/*
Theme Name: Alpes Vélo 2021
Author: 9W
Author URI: https://9wdigital.com/
Description: Theme sur-mesure pour Alpes Vélo
Version: 1.0
Text Domain: alpesvelo
Domain Path: /languages
*/

/* work-sans-300 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Work Sans';
	font-style: normal;
	font-weight: 300;
	src: url('./fonts/work-sans-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Work Sans';
	font-style: normal;
	font-weight: 400;
	src: url('./fonts/work-sans-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-500 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Work Sans';
	font-style: normal;
	font-weight: 500;
	src: url('./fonts/work-sans-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-600 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Work Sans';
	font-style: normal;
	font-weight: 600;
	src: url('./fonts/work-sans-v19-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-700 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Work Sans';
	font-style: normal;
	font-weight: 700;
	src: url('./fonts/work-sans-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* waiting-for-the-sunrise-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Waiting for the Sunrise';
	font-style: normal;
	font-weight: 400;
	src: url('./fonts/waiting-for-the-sunrise-v21-latin-regular.woff2')
		format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.logo-image,
.intro-spiel,
.lang-list,
.epreuve,
.competence,
.employee {
	visibility: hidden;
}

:root {
	--THEME-COLOR-DARK: #0e2a47;
	--THEME-COLOR-DARKER: #000f1e;
	--THEME-COLOR-BLUE: #004da5;
	--THEME-COLOR-RED: #cc2131;
	--THEME-COLOR-DARKRED: #8c1723;
	--THEME-COLOR-LIGHTGREY: #e6e6e6;
	--BORDER-COLOR-LIGHTGREY: #dddddd;
}

body {
	font-family: 'Work Sans', sans-serif;
	font-size: 1.1rem;
	/* font-weight: 300; */
	/* background-color: #eee; */
	color: #0f1d22;
	min-height: 100vh;
}
@media (min-width: 1200px) {
	.container-xxl {
		max-width: 1140px;
	}
}
@media (min-width: 1400px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		max-width: 1320px;
	}
}
@media (min-width: 1650px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		max-width: 1410px;
	}
}
@media (min-width: 1920px) {
	.container-xxl {
		max-width: 1650px;
	}
}
.breakout {
	position: relative;
	width: 100vw;
	left: 50%;
	transform: translate(-50%, 0);
}
main {
	flex-grow: 1;
	margin-bottom: 0;
	padding-bottom: 0;
	position: relative;
}

body > .svg-container {
	display: block;
	line-height: 0;
	height: clamp(75px, 10vw, 100px);
	max-width: 100vw;
	position: relative;
	overflow: hidden;
	margin-bottom: -1px;
}
.svg-container svg {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	display: block;
	bottom: 0;
	min-height: 100px;
}
body > svg rect {
	fill: transparent;
}
main.cd-main-content > section:not(.partenaires) {
	padding: 0 1rem 5rem;
	min-height: 300px;
}
@media only screen and (min-width: 768px) {
	main.cd-main-content > section:not(.partenaires) {
		padding: 0 3rem 3.5rem;
		min-height: 400px;
	}
}
@media only screen and (min-width: 1200px) {
	/* main { margin-bottom: calc(4rem + 2.5vw); } */
	main.cd-main-content > section:not(.partenaires) {
		padding: 0 3rem 5rem;
	}
}
@media only screen and (min-width: 1400px) {
	main.cd-main-content > section:not(.partenaires) {
		padding: 0 3rem 5.5rem;
	}
}
main.cd-main-content > section:first-child {
	padding-top: 6.5rem;
}
.sticky-offset {
	top: 66px;
}
section:first-child {
	margin-top: 5rem;
}
section:not(:last-child) {
	margin-bottom: calc(5rem + 3vw);
}
section.hoverable {
	background-color: rgba(0, 0, 0, 0.85);
	color: white;
	position: relative;
}
section.hoverable h1.section-title:before {
	background: #fff;
}

/* Gen Styling */
a {
	color: inherit;
}
a:hover {
	color: #ea533c;
}
a.more-link {
	display: block;
	margin-top: 1rem;
	font-weight: 400;
	font-size: 0.95em;
	text-decoration: none;
	letter-spacing: -0.5px;
	color: #000;
}
a.more-link:hover {
	color: #ea533c;
}
a.more-link svg {
	transition: all 0.25s ease-out;
}
a.more-link:hover svg {
	transform: translateX(6px);
}
.columns-2 {
	-moz-column-gap: 4em;
	column-gap: 4em;
	-moz-columns: 2 320px;
	columns: 2 320px;
}
p {
	max-width: 75ch;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
	text-decoration: none;
}
h1.section-title,
h2.section-title {
	font-size: calc(1.5rem + 0.25vw);
	margin-bottom: 5rem;
	position: relative;
	padding-left: 1.5rem;
}
h1.section-title:before {
	position: absolute;
	content: '';
	height: 2px;
	background: #111;
	top: calc(0.75rem + 0.25vw);
	left: -1rem;
	width: 1.75rem;
}
@media only screen and (min-width: 768px) {
	h1.section-title,
	h2.section-title {
		padding-left: 0;
	}
	h1.section-title:before {
		left: -3rem;
		width: 2.25rem;
	}
}
.dark-bg {
	background-color: rgba(0, 0, 0, 0.85);
	color: white;
}
.dark-bg h1.section-title:before {
	background: #fff;
}

/* Header */
header a {
	text-decoration: none;
}
.logo-image {
	width: 130px;
	max-width: calc(95vw - 140px);
	height: auto;
}
@media only screen and (min-width: 992px) {
	.logo-image {
		width: 170px;
	}
}
header button.btn {
	text-transform: uppercase;
	font-size: 0.85em;
	margin-left: auto;
	margin-right: 1.5rem;
}
.lang-list {
	font-weight: 400;
	font-size: 1.15rem;
	text-transform: uppercase;
	margin-left: auto;
	margin-right: 1rem;
	visibility: hidden;
}
.lang-list li {
	position: relative;
	padding: 0.5rem;
}
.lang-list li a {
	color: #888;
}
.lang-list li.current-lang a,
.lang-list li a:hover {
	color: #0f1d22;
}

header li.lang-item + li.lang-item:before {
	content: '';
	position: absolute;
	left: 10px;
	padding-left: 0.5rem;
	margin-left: 0.5rem;
	height: 35px;
	width: 1px;
	border-left: 1px solid #aaa;
	top: -14px;
	transform: rotate(80deg);
}
@media only screen and (min-width: 576px) {
	.lang-list {
		font-size: 0.95rem;
	}
	header li.lang-item + li.lang-item:before {
		left: -0.5rem;
		padding-left: 0.5rem;
		margin-left: 0.5rem;
		height: 25px;
		top: 16%;
		transform: rotate(15deg);
	}
}

/* Main */
main.cd-main-content {
	padding-top: 80px;
	overflow: hidden;
	padding-bottom: calc(3rem + 2vw);
}
@media only screen and (min-width: 1024px) {
	.cd-main-content {
		padding-top: 125px;
	}
}

/* Intro */
#intro {
	position: relative;
	padding-bottom: 4rem;
	padding-left: 3.75%;
	padding-right: 5%;
	overflow: hidden;
	margin-top: 0;
	margin-bottom: 0;
	min-height: 25vw;
}
@media only screen and (min-width: 1024px) {
	#intro {
		padding-left: 8vw;
	}
}
.intro-spiel {
	font-size: clamp(1.125rem, 1vw + 0.8rem, 1.75rem);
	font-weight: 400;
	max-width: 100%;
	width: 65ch;
	visibility: hidden;
	z-index: 1;
	position: relative;
	margin-top: calc(1rem + 1vw);
}

/* Epreuves */
.epreuves-list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	--grid-gap: 1rem;
	gap: var(--grid-gap);
}
.epreuve {
	z-index: 2;
	position: relative;
	box-shadow: 0px 0.9px 2px rgba(0, 0, 0, 0.067),
		0px 2.2px 4.5px rgba(0, 0, 0, 0.097), 0px 4.1px 8.2px rgba(0, 0, 0, 0.12),
		0px 7.4px 14.8px rgba(0, 0, 0, 0.143), 0px 13.8px 30px rgba(0, 0, 0, 0.173),
		0px 33px 80px rgba(0, 0, 0, 0.24);
	color: white;
	padding: 0rem;
	border-radius: 0.5rem;
	overflow: hidden;

	flex: 0 0 auto;
	width: 90%;
	max-width: 330px;
	--bs-aspect-ratio: calc(231 / 165 * 100%);
}
.epreuve-smaller {
	height: calc(165px + 9vw) !important;
}
.epreuve:after {
	/* content: ''; */
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	padding-left: 2rem;
	padding-right: 2rem;
	background: #1d324a;
	height: 100%;
	width: 100%;
	border-radius: 6px;
}
.epreuve > img {
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	width: 100%;
	height: 100%;
}
.epreuve .epreuve-info {
	color: white;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0 1rem 1rem;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 50%,
		rgba(35, 41, 55, 0.8) 85%
	);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.epreuve .epreuve-info h2 {
	font-size: calc(1.75rem + 0.125vw);
	letter-spacing: -0.5px;
}
.epreuve .epreuve-info p:last-child {
	margin-bottom: 0;
}
.epreuve-url {
	color: white;
	border-radius: 50%;
	display: inline-block;
	position: absolute;
	right: 1.5rem;
	bottom: 1rem;
}
.epreuve:hover .epreuve-url {
	background-color: white;
}
.epreuve:hover .epreuve-url svg {
	stroke: black;
}
@media only screen and (min-width: 520px) {
	.epreuve {
		width: calc(50% - (var(--grid-gap) / 2));
	}
}
@media only screen and (min-width: 992px) {
	.epreuve {
		width: calc(33.333% - (var(--grid-gap) * 2 / 3));
	}
	.epreuve .epreuve-info {
		padding: 0 14% 2rem 2rem;
	}
}
@media only screen and (min-width: 1100px) {
	.epreuves-list {
		--grid-gap: 2rem;
	}
	.epreuve {
		width: calc(30% - (var(--grid-gap) * 2 / 3));
	}
}
@media only screen and (min-width: 1300px) {
	.epreuve {
		width: calc(25% - (var(--grid-gap) * 3 / 4));
	}
}
@media only screen and (min-width: 1650px) {
	.epreuve {
		width: calc(20% - (var(--grid-gap) * 4 / 5));
	}
}

/* Stats */
#stats {
	display: grid;
	place-content: center;
	padding: 0;
	position: relative;
	margin-bottom: 0;
	min-height: 560px;
}
#stats:before {
	content: '';
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1920' height='600' preserveAspectRatio='none' viewBox='0 0 1920 600'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1058%26quot%3b)' fill='none'%3e%3cpath d='M447.92 666.3C623.21 621.91 562.13 146.98 948.67 144.36 1335.2 141.74 1696.77 299.89 1950.16 300.36' stroke='rgba(237%2c 83%2c 60%2c 0.25)' stroke-width='2'%3e%3c/path%3e%3cpath d='M370.47 640.89C619.59 635.05 814.51 294.67 1302.65 288 1790.79 281.33 1994.92 61.65 2234.83 60' stroke='rgba(237%2c 83%2c 60%2c 0.25)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1005.63 659.32C1148.65 591.08 1083.71 132.19 1354.1 129.84 1624.5 127.49 1865.81 378.01 2051.05 381.84' stroke='rgba(237%2c 83%2c 60%2c 0.15)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1006.01 718.09C1123.84 700.79 1073.95 432.21 1378.99 421.72 1684.02 411.23 1932.38 231.25 2124.94 229.72' stroke='rgba(237%2c 83%2c 60%2c 0.25)' stroke-width='2'%3e%3c/path%3e%3cpath d='M756.82 646.91C955.56 641.45 1103.35 358.42 1494.88 350.72 1886.42 343.02 2039.85 125.3 2232.95 122.72' stroke='rgba(237%2c 83%2c 60%2c 0.35)' stroke-width='2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1058'%3e%3crect width='1920' height='600' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
	position: absolute;
	z-index: -1;
	height: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position-y: bottom;
	background-position-x: center;
}
#stats h1 {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5rem;
}
.stats-wrapper {
}
.pre-stat,
.stat {
	margin-bottom: 2.25rem;
	position: relative;
}

.stat .stat-inner {
	margin-left: auto;
	padding-left: 60px;
}
.stat_chiffre {
	font-size: 5rem;
	font-family: serif;
	letter-spacing: -5px;
	line-height: 0.95;
	display: inline;
	position: relative;
}
.stat_chiffre:after {
	transform-origin: center;
	transform: rotate(-73deg);
	font-family: 'Work Sans', sans-serif;
	font-size: 0.9rem;
	font-weight: 400;
	position: absolute;
	right: -65px;
	letter-spacing: 1px;
	line-height: 7rem;
	opacity: 0.75;
	top: -10px;
}
@media only screen and (min-width: 992px) {
	.stat:before {
		top: -0.75rem;
		left: 35px;
		height: 145px;
	}
	.stat_chiffre {
		font-size: 7rem;
	}
	.stat_chiffre:after {
		font-size: 1.25rem;
		right: -65px;
		top: auto;
	}
}
.stat_subscript {
	font-family: 'Work Sans', sans-serif;
	font-size: 1rem;
	font-weight: 400;
	display: none;
	position: relative;
	bottom: 1rem;
	right: 0;
}
.stat_unit {
	font-weight: 600;
}
.stat_texte {
	font-size: 1.1rem;
	padding-right: 10%;
	margin-left: -1rem;
}

/* Competences */
#competences {
	counter-reset: section;
	padding-block: calc(3rem + 2vw) calc(2rem + 2vw);
	background-color: #262626;
	color: white;
	position: relative;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}
#competences > div.row {
	width: 1450px;
	-webkit-margin-start: auto;
	margin-inline-start: auto;
	max-width: 100%;
}
#competences h1.section-title:before {
	background: #ffffff;
}
#competence svg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}
.competence {
	border-top: 1px solid #555;
	padding-top: 2.5rem;
	margin-bottom: 6rem;
	position: relative;
	color: #bbb;
	width: 400px;
	max-width: 100%;
}
.competence::before {
	counter-increment: section;
	content: counter(section);
	position: absolute;
	left: 0;
	top: -40px;
	font-size: 5rem;
	color: #ea533c;
	font-family: 'Waiting for the Sunrise', cursive;
	background: #262626;
	padding-right: 0.25rem;
	line-height: 1;
}
.competence h2 {
	font-family: serif;
	font-size: clamp(1.75rem, 0.7vw + 1.4rem, 2.1rem);
	font-weight: 300;
	color: #fff;
	line-height: 1;
	text-align: right;
	position: relative;
}
/* .competence h2:before {
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: #555;
	position: absolute;
	bottom: 0;
	left: 0;
} */
@media only screen and (min-width: 8px) {
	.competence h2 {
		top: -25px;
		right: 0;
		background: #262626;
		position: absolute;
		padding-left: 1rem;
		margin-left: 5rem;
	}
}
/* News */
#news {
	position: relative;
}

.swiper-container-news {
	padding-bottom: 85px;
}
.swiper-slide.article-short {
	width: 60ch;
	margin-right: 75px;
	max-width: 90vw;
}

.date {
	font-size: 0.9em;
	margin-bottom: 0.5rem;
}
#news .swiper-button-next,
#news .swiper-button-prev {
	position: relative;
	margin: 0;
	left: 0;
	right: 0;
}
#news .swiper-button-next.swiper-button-disabled,
#news .swiper-button-prev.swiper-button-disabled,
#news .swiper-button-next,
#news .swiper-button-prev {
	background: #111;
	color: white;
	opacity: 1;
	width: 35px;
	border-radius: 2px;
	height: 35px;
	transition: scale 0.5s ease;
}
#news .swiper-button-next:hover:after,
#news .swiper-button-prev:hover:after {
	transform: scale(1.25);
}
#news .swiper-button-next:after,
#news .swiper-button-prev:after {
	font-size: 14px;
	color: white;
}
#news .swiper-button-next.swiper-button-disabled,
#news .swiper-button-prev.swiper-button-disabled {
	opacity: 0.5;
}

.scrollcontainer {
	margin: 0 auto;
	/* height: 10em;
  width: 40em; */
	/* border: 1px solid #ccc; */
	--background-color: white;
	--shadow-color: rgba(34, 34, 34, 0.5);
	--shadow-size: 0.75em;
	--transparent: rgba(
		255,
		255,
		255,
		0
	); /* We can't use "transparent" directly, because Safari would interpret the color as "transparent black" (see https://css-tricks.com/thing-know-gradients-transparent-black/). Using this workaround, it works fine. */
}
.grey-bg .scrollcontainer {
	--background-color: var(--THEME-COLOR-LIGHTGREY);
}
.scrollcontainer--horizontal {
	overflow-y: scroll;
	background: linear-gradient(
			to right,
			var(--background-color),
			var(--background-color),
			var(--transparent) calc(var(--shadow-size) * 2)
		),
		radial-gradient(
			farthest-side at 0 50%,
			var(--shadow-color),
			var(--transparent)
		),
		linear-gradient(
			to left,
			var(--background-color),
			var(--background-color),
			var(--transparent) calc(var(--shadow-size) * 2)
		),
		radial-gradient(
				farthest-side at 100% 50%,
				var(--shadow-color),
				var(--transparent)
			)
			100%;
	background-color: var(--background-color);
	background-repeat: no-repeat;
	background-attachment: local, scroll, local, scroll;
	background-size: 100% 100%, var(--shadow-size) 100%, 100% 100%,
		var(--shadow-size) 100%;
	height: 100%;
}

/* Blog Page */
.blog article.post {
	margin-bottom: 3rem;
	position: relative;
	border-bottom: 1px solid #999;
	padding-bottom: 3rem;
}
.blog article.post:last-child {
	margin-bottom: 0rem;
}
.blog .section-title + .row {
	margin-bottom: 4rem;
}
@media only screen and (min-width: 768px) {
	.blog article.post:nth-child(even) {
		padding-right: 2rem;
	}
}
@media only screen and (min-width: 992px) {
	.blog article.post:nth-child(odd) {
		padding-right: 3rem;
	}
	.blog article.post:nth-child(even) {
		padding-right: 3rem;
	}
}

/* Single */
.post-meta {
	font-weight: 400;
	font-size: 0.95em;
}
.post-meta a {
	text-decoration: none;
}
.main-col-content p {
	font-size: 1.1em;
}
.single h1.section-title {
	font-size: calc(1.5rem + 0.25vw);
}
.single h1.section-title:before {
	top: 17px;
}

/* Breadcrumbs */
#breadcrumbs {
	margin-block: 0 2rem;
	font-size: 0.9em;
	font-weight: 300;
}
#breadcrumbs a {
	text-decoration: none;
}
#breadcrumbs > * + * {
	position: relative;
	margin-left: 0.75rem;
	padding-left: 1rem;
}
#breadcrumbs > * + *:before {
	position: absolute;
	left: 0;
	top: -0.25rem;
	content: '';
	height: 1.75rem;
	border-left: 1px solid #999;
	transform: rotate(25deg);
}

/* Post navigation */
.prev-post {
	margin-left: auto;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	margin-right: auto;
	max-width: 400px;
}
.prev-post a {
	display: block;
	text-decoration: none;
	font-weight: 500;
}

/* RSE */
#rse {
	padding-left: 8vw;
	padding-right: 8vw;
	/* background-image: url('./img/cool-background-crunch.png'); */
	background-size: cover;
	background-image: linear-gradient(
			56deg,
			rgba(254, 254, 254, 0.05) 0%,
			rgba(254, 254, 254, 0.05) 69%,
			rgba(160, 160, 160, 0.05) 69%,
			rgba(160, 160, 160, 0.05) 100%
		),
		linear-gradient(
			194deg,
			rgba(102, 102, 102, 0.02) 0%,
			rgba(102, 102, 102, 0.02) 60%,
			rgba(67, 67, 67, 0.02) 60%,
			rgba(67, 67, 67, 0.02) 100%
		),
		linear-gradient(
			76deg,
			rgba(169, 169, 169, 0.06) 0%,
			rgba(169, 169, 169, 0.06) 89%,
			rgba(189, 189, 189, 0.06) 89%,
			rgba(189, 189, 189, 0.06) 100%
		),
		linear-gradient(
			326deg,
			rgba(213, 213, 213, 0.04) 0%,
			rgba(213, 213, 213, 0.04) 45%,
			rgba(66, 66, 66, 0.04) 45%,
			rgba(66, 66, 66, 0.04) 100%
		),
		linear-gradient(
			183deg,
			rgba(223, 223, 223, 0.01) 0%,
			rgba(223, 223, 223, 0.01) 82%,
			rgba(28, 28, 28, 0.01) 82%,
			rgba(28, 28, 28, 0.01) 100%
		),
		linear-gradient(
			3deg,
			rgba(20, 20, 20, 0.06) 0%,
			rgba(20, 20, 20, 0.06) 62%,
			rgba(136, 136, 136, 0.06) 62%,
			rgba(136, 136, 136, 0.06) 100%
		),
		linear-gradient(
			200deg,
			rgba(206, 206, 206, 0.09) 0%,
			rgba(206, 206, 206, 0.09) 58%,
			rgba(6, 6, 6, 0.09) 58%,
			rgba(6, 6, 6, 0.09) 100%
		),
		linear-gradient(
			304deg,
			rgba(162, 162, 162, 0.07) 0%,
			rgba(162, 162, 162, 0.07) 27%,
			rgba(24, 24, 24, 0.07) 27%,
			rgba(24, 24, 24, 0.07) 100%
		),
		linear-gradient(
			186deg,
			rgba(166, 166, 166, 0.04) 0%,
			rgba(166, 166, 166, 0.04) 5%,
			rgba(210, 210, 210, 0.04) 5%,
			rgba(210, 210, 210, 0.04) 100%
		),
		linear-gradient(90deg, rgb(26, 118, 64), rgb(32, 207, 121), rgb(78, 196, 128));
	color: white;
	margin-bottom: 0;
}

/* Staff */
#staff {
	background: rgba(0, 0, 0, 0.1);
	margin-bottom: 0;
	padding-block: 4rem;
	border-radius: 0 0 10px 10px;
	position: relative;
}
#staff.has-button {
	padding-bottom: 6rem;
}
.swiper-button-next:after,
.swiper-button-prev:after {
	color: black;
	font-weight: 600;
}
#staff .swiper-wrapper {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-inline: auto;
}
#staff button {
	position: absolute;
	bottom: 1rem;
	right: 1rem;
	color: currentColor;
	font-weight: 400;
	font-size: 1.1rem;
	text-decoration: none;
}
#staff button:hover {
	color: darkslategrey;
}
.employee.swiper-slide {
	width: 250px;
	max-width: 100%;
	visibility: hidden;
	font-size: 0.95rem;
	line-height: 1.25;
	flex-grow: 1;
}
.employee figure {
	margin-bottom: 0.75rem;
	overflow: hidden;
	position: relative;
	aspect-ratio: 2 / 2.5;
	min-height: 200px;
	max-width: 100%;
}
.employee figure img {
	-o-object-fit: cover;
	object-fit: cover;
	height: 100%;
}
.employee .staff-name {
	font-size: 1.15rem;
	font-weight: 500;
	line-height: 1.2;
	margin-bottom: 0.25rem;
}
@media (pointer: fine) {
	.employee figure img {
		display: block;
		height: 100%;
		width: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		-o-object-position: center;
		object-position: center;
	}
}

/* Partenaires */
section.partenaires {
	padding-block: calc(4rem + 4vw);
	margin-bottom: 0;
}
.swiper-partenaires {
	width: 100%;
	height: 100px;
}
.swiper-slide.partenaire {
	width: calc(125px + 2.5rem);
	max-width: 55dvw;
	padding-right: 1rem;
	padding-left: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media only screen and (min-width: 768px) {
	.swiper-slide.partenaire {
		padding-right: 2.5rem;
		padding-left: 2.5rem;
		width: 200px;
		max-width: 80dvw;
	}
}
@media only screen and (min-width: 992px) {
	.swiper-slide.partenaire {
		width: 240px;
	}
}
.partenaire img {
	max-height: 100%;
	width: auto;
}
.greyscale-img {
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(100%);
	filter: grayscale(1);
	opacity: 0.5;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.greyscale-img:hover {
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0%);
	filter: grayscale(0);
	opacity: 1;
	-webkit-backface-visibility: hidden;
}
.greyscale-img.lazy-loaded {
	opacity: 0.5 !important;
}
.greyscale-img:hover.lazy-loaded {
	opacity: 1 !important;
}

/* CTA */
section.cta {
	min-height: 0 !important;
	padding: 8rem 0 7.25rem !important;
	background-color: #ea533c;
	color: white;
	position: relative;
	margin-bottom: 50px;
}
@media only screen and (min-width: 1200px) {
	section.cta {
		margin-bottom: inherit;
	}
}
section.partenaires + .cta:before {
	content: '';
	width: 40px;
	height: 40px;
	margin-left: 11%;
	background-color: #ea533c;
	transform: rotate(45deg);
	top: -20px;
	position: absolute;
	left: 0;
	right: 0;
}
.cta_content {
	font-size: calc(1.4rem + 0.5vw);
	font-weight: 300;
	margin-left: 12%;
	max-width: 80%;
	width: 900px;
	/* line-height: 1.35; */
}
.cta_content img.signature {
	margin-right: 2%;
	margin-left: auto;
	margin-top: 1.75rem;
}
.cta_content h3 {
	font-size: 0.8em;
	margin: 2rem auto 1rem;
	text-align: right;
}

/* Footer */
body > footer {
	font-size: 0.8em;
	font-weight: 400;
	line-height: 1.75;
	position: relative;
	background: #131415;
}
.site-footer {
	padding-bottom: 3.5rem;
}
body > footer,
body > footer a {
	color: #bbbbbb;
	text-decoration: none;
}
footer .footer2,
footer .footer2 a {
	color: #777777;
}
body > footer a:hover {
	color: #ffffff;
}
body > footer > div {
	padding-top: 2rem;
	padding-left: 4vw;
	padding-right: 4vw;
}
body > footer ul {
	list-style: none;
}
body > footer addresse {
	display: block;
	margin-top: 0.25rem;
}
body > footer .email,
body > footer .phone {
	white-space: nowrap;
	font-weight: 500;
}
body > footer .email + .phone {
	padding-left: 2rem;
	position: relative;
}
.socialmedia-list {
	margin-top: calc(4rem + 1vw);
	padding: 0;
	display: flex;
	gap: calc(2rem + 1vw);
	justify-content: center;
	list-style: none;
}
.socialmedia-list a {
	padding: 6px;
}
body > footer .email + .phone:before {
	content: '';
	position: absolute;
	height: 28px;
	border-left: 1px solid #444;
	left: 1rem;
	top: 0px;
}
.footer2 {
	border-top: 1px solid #333;
	padding-top: 0.75rem;
	margin-top: 1rem;
	font-size: 0.95em;
	max-width: 90%;
	margin-left: auto;
	margin-right: auto;
}
@media only screen and (min-width: 992px) {
	.footer2 {
		max-width: none;
		margin-left: 0;
	}
}

.ninew img {
	opacity: 0.5;
}
.ninew:hover img {
	opacity: 1;
}

/* Modal */
.modal-content {
	font-weight: 400;
}
.modal-title {
	text-transform: uppercase;
}

/* Recrutement */
.job + .job {
	margin-top: 1rem;
	padding-top: 1em;
	border-top: 1px solid #ddd;
}
.job + .texte_benevoles {
	margin-top: 3rem;
}

/* Cookie Notice */
#cookie-notice {
	min-width: 0;
	width: 450px;
	max-width: 100%;
	background-color: rgba(0, 0, 0, 0.5) !important;
}
.cookie-notice-container {
	padding-right: 50px;
}
.cn-close-icon {
	top: 30px;
}

/* Top navigation */
.cd-auto-hide-header {
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 110px;
	background-color: #ffffff;
	/* Force Hardware Acceleration */
	transform: translateZ(0);
	will-change: transform;
	transition: transform 0.5s;
	/* border-bottom: 1px solid #ddd; */
}
.cd-auto-hide-header::after {
	clear: both;
	content: '';
	display: block;
}
.cd-auto-hide-header.is-hidden {
	transform: translateY(-100%);
}
@media only screen and (min-width: 1024px) {
	.cd-auto-hide-header {
		height: 125px;
	}
}
/* .cd-auto-hide-header .logo, */
.cd-auto-hide-header .nav-trigger {
	position: absolute;
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}
.cd-auto-hide-header .logo {
	margin-left: calc(3.75% - 12px);
}
.cd-auto-hide-header .logo a,
.cd-auto-hide-header .logo img {
	display: block;
}
.cd-auto-hide-header .nav-trigger {
	/* vertically align its content */
	display: table;
	height: 100%;
	padding: 0 1em;
	font-size: 1.2rem;
	text-transform: uppercase;
	color: #25283d;
	font-weight: bold;
	right: 0;
	border-left: 1px solid #f2f2f2;
}
.cd-auto-hide-header .nav-trigger span {
	/* vertically align inside parent element */
	display: table-cell;
	vertical-align: middle;
}
.cd-auto-hide-header .nav-trigger em,
.cd-auto-hide-header .nav-trigger em::after,
.cd-auto-hide-header .nav-trigger em::before {
	/* this is the menu icon */
	display: block;
	position: relative;
	height: 2px;
	width: 22px;
	background-color: #25283d;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.cd-auto-hide-header .nav-trigger em {
	/* this is the menu central line */
	margin: 6px auto 14px;
	transition: background-color 0.2s;
}
.cd-auto-hide-header .nav-trigger em::before,
.cd-auto-hide-header .nav-trigger em::after {
	position: absolute;
	content: '';
	left: 0;
	transition: transform 0.2s;
}
.cd-auto-hide-header .nav-trigger em::before {
	/* this is the menu icon top line */
	transform: translateY(-6px);
}
.cd-auto-hide-header .nav-trigger em::after {
	/* this is the menu icon bottom line */
	transform: translateY(6px);
}
@media only screen and (min-width: 1024px) {
	.cd-auto-hide-header .logo {
		margin-left: 5%;
	}
	.cd-auto-hide-header .nav-trigger {
		display: none;
	}
}
@media only screen and (min-width: 1650px) {
	.cd-auto-hide-header .logo {
		margin-left: 0;
	}
}
.cd-auto-hide-header.nav-open .nav-trigger em {
	/* transform menu icon into a 'X' icon */
	background-color: rgba(255, 255, 255, 0);
}
.cd-auto-hide-header.nav-open .nav-trigger em::before {
	/* rotate top line */
	transform: rotate(-45deg);
}
.cd-auto-hide-header.nav-open .nav-trigger em::after {
	/* rotate bottom line */
	transform: rotate(45deg);
}
.cd-primary-nav {
	display: inline-block;
	float: right;
	height: 100%;
	padding-right: 5%;
}
.cd-primary-nav > ul {
	position: absolute;
	z-index: 2;
	top: 80px;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	display: none;
	box-shadow: 0 14px 20px rgba(0, 0, 0, 0.2);
}
.cd-primary-nav > ul a {
	/* target primary-nav links */
	display: block;
	height: 50px;
	line-height: 50px;
	padding-left: 5%;
	color: #25283d;
	font-size: 0.85rem;
	font-weight: 500;
	text-transform: uppercase;
	border-top: 1px solid #f2f2f2;
}
.cd-primary-nav > ul a:hover,
.cd-primary-nav > ul a.active {
	color: #8f3985;
}
@media only screen and (min-width: 1024px) {
	.cd-primary-nav {
		/* vertically align its content */
		display: table;
	}
	.cd-primary-nav > ul {
		/* vertically align inside parent element */
		display: table-cell;
		vertical-align: middle;
		/* reset mobile style */
		position: relative;
		width: auto;
		top: 0;
		padding: 0;
		background-color: transparent;
		box-shadow: none;
	}
	.cd-primary-nav > ul::after {
		clear: both;
		content: '';
		display: block;
	}
	.cd-primary-nav > ul li {
		display: inline-block;
		float: left;
		margin-right: 1.5em;
	}
	.cd-primary-nav > ul li:last-of-type {
		margin-right: 0;
	}
	.cd-primary-nav > ul a {
		/* reset mobile style */
		height: auto;
		line-height: normal;
		padding: 0;
		border: none;
	}
}
.nav-open .cd-primary-nav ul,
.cd-primary-nav ul:target {
	/*
  	show primary nav - mobile only
  	:target is used to show navigation on no-js devices
  */
	display: block;
}
@media only screen and (min-width: 1024px) {
	.nav-open .cd-primary-nav ul,
	.cd-primary-nav ul:target {
		display: table-cell;
	}
}

/*
Default style for WP-PageNavi plugin
http://wordpress.org/extend/plugins/wp-pagenavi/
*/
.wp-pagenavi {
	clear: both;
}
.wp-pagenavi a,
.wp-pagenavi span {
	text-decoration: none;
	border: 1px solid #bfbfbf;
	padding: 3px 5px;
	margin: 2px;
}
.wp-pagenavi a:hover,
.wp-pagenavi span.current {
	border-color: #000;
}
.wp-pagenavi span.current {
	font-weight: bold;
}