html {
	height: 100%;
}

body {
	font-family: 'Montserrat', sans-serif;
	height: 100%;
}

ul {
	list-style: none;
}

a {
	text-decoration: none;
}

.select-none {
	user-select: none;
}

.violet {
	color: #ec008c;
}

.hover-violet:hover {
	color: #ec008c;
}

.bg-violet {
	background-color: #ec008c;
}

.hover-bg-violet:hover {
	background-color: #ec008c;
}

.hover-white:hover {
	color: #fff;
}

.noir {
	color: #1e1e1e;
}

.bg-noir {
	background-color: #1e1e1e;
}

.translateY--50 {
	transform: translateY(-50%);
}

.translateX--50 {
	transform: translateX(-50%);
}

.translateY--100 {
	transform: translateY(-100%);
}

.translate-center {
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
}

/* .translate-right1 { */
/* 	transform: translate(0, 0); */
/* 	top: 10%; */
/* 	left: 0; */
/* 	@media screen and (min-width: 60em) { */
/* 		transform: translate(-40%, -50%); */
/* 		top: 50%; */
/* 		left: 50%; */
/* 	} */
/* } */
/* .translate-right2 { */
/* 	transform: translate(0, 0); */
/* 	top: 10%; */
/* 	left: 0; */
/* } */

@media screen and (min-width: 60em) {
.translate-right1 {
		transform: translate(-40%, -50%);
		top: 50%;
		left: 50%;

}
  .translate-right2 {
		transform: translate(-36%, -50%);
		top: 70%;
		left: 50%;
  }
}
.inegal-radius {
	border-radius: 50px 8px 8px 50px;
}

.gradient-down {
	background: linear-gradient(to bottom, #f8f8f8, #fff 80%);
}

.gradient-up {
	background: linear-gradient(to top, #e5e1e1, #fff 20%);
}

.big-gradient-up {
	background: linear-gradient(to top, #e5e1e1, #fff 90%);
}

.stroke-black {
	/* color: white; */
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

button {
	font-family: 'Roboto Condensed first', 'Roboto Condensed', sans-serif;
	font-size: 1rem;
}

.mw1200-flex {
	max-width: 1200px;
	display: flex;
}

.mw1200 {
	max-width: 1200px;
	margin: 0 auto;
}

.mw1200::after {
	content: '';
	clear: both;
	display: table;
}

.clearfix::after {
	content: '';
	clear: both;
	display: table;
}

.trapeze1 {
	border-bottom: 64px solid #fadd11;
	border-left: 18px solid transparent;
	border-right: 18px solid transparent;
	height: 0;
	/* width: 400px; */
}

.bg-ombre {
	background-color: #f2f2f2;
}

.lh-20 {
	line-height: 2;
}

.lh-15 {
	line-height: 1.5;
}

.transition {
	transition: all 100ms ease-in-out;
}

.transition2 {
	transition: all 0.3s ease-in-out;
}

.scale:hover {
	transform: scale(1.15);
}

.triangle {
	left: 50%;
	width: 48px;
	height: 48px;
	margin-left: -24px;
	margin-top: -24px;
	transform: rotate(45deg);
}

re-captcha > div > div {
	position: relative;
	z-index: 4;
	margin: 0 auto;
	text-align: center;
}

.yellow-fnaim {
	color: #fadd11;
}

.bg-yellow-fnaim {
	background-color: #fadd11;
}

.hover-bg-yellow-fnaim:hover {
	background-color: #fadd11;
}

.hover-fill-white {
	fill: white;
}

.drop-shadow {
	filter: drop-shadow(1px 5px 2px rgba(110, 110, 110, 0.34));
}

.js-menu {
	/* @extend .fl, .w-100, .w-20-l, .h-100, .tc, .flex, */
	/* .flex-column, .items-center, .hover-bg-yellow-fnaim, .flex-grow-1; */
	float: left;
	text-align: center;
	display: flex;
	height: 100%;
	flex-direction: column;
	align-items: center;
	flex-grow: 1;
	padding-top: 10px;
	padding-bottom: 10px;
	transition: all 250ms ease-in-out;
	border-right: solid 1px #e9e9e9;
}
.js-menu:hover {
	background-color: #fadd11;
}

.last {
	border-right: none;
}

.js-menu > * {
	transition: filter 450ms ease-in-out;
}

.frame {
	/**
	 * (optional) wrapper width, specifies width of the slider frame.
	 */
	width: 880px;

	position: relative;
	font-size: 0;
	line-height: 0;
	overflow: hidden;
	white-space: nowrap;
}

.bg-qui {
	background: url('/static/qui.jpg') no-repeat center center;
	background-size: cover;
}

.bg-pourquoi {
	background: url('/static/pourquoi.jpg') no-repeat center center;
	background-size: cover;
}

.bg-video {
	background: url('/static/video.jpg') no-repeat center center;
	background-size: cover;
}

.bg-gris {
	background: #f9f9f9;
}
.bg-translucide {
	background-color: rgba(249, 249, 249, 0.49);
}

.footer-logo { max-width: 149px; }
.mylogo { max-width: 350px; }
.footer-top { height: 65px; }
.footer-top-inner { position: relative; display: flex; align-items: center; justify-content: flex-end; height: 100%; padding: 0; }
.facebook-link { color: #fff; }
.facebook-icon { display: inline-flex; align-items: center; justify-content: center; width: 35px; height: 35px; margin-left: .5rem; color: #fff; background: #50629a; border-radius: 50%; font-size: 1.8rem; font-weight: 700; }
.footer-content { position: relative; }
.footer-form-column { position: relative; min-height: 354px; padding-top: 1rem; }
.contact-ribbon { position: absolute; z-index: 2; top: -65px; right: 0; left: 0; height: 65px; padding-top: 1rem; color: #000; background: #fadd11; clip-path: polygon(8% 0, 92% 0, 100% 100%, 0 100%); font-size: 1.5rem; font-weight: 700; }
.contact-field { display: block; box-sizing: border-box; width: 75%; max-width: 300px; margin: 4px auto; }
.contact-form altcha-widget { display: block; width: max-content; max-width: 100%; margin: 6px auto !important; }
.footer-essential { min-height: 354px; padding-top: 2rem; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: .5rem; padding-bottom: .5rem; font-size: .75rem; }
.footer-bottom > span:last-child { margin-left: auto; text-align: right; }
.topbar-inner { position: relative; display: flex; align-items: center; height: 28px; }
.topbar-inner > div { padding: 0 0.5rem; line-height: 28px; }
.extranet-link { position: absolute; top: 0; right: 0; height: 28px; padding-top: 0; padding-bottom: 0; line-height: 28px; }
.nav-icon { display: block; width: 59px; height: 59px; margin: 0 auto; }
.menu-button { border: 0; background: transparent; }
.extranet-icon { display: inline-block; width: 17px; height: 18px; margin-right: .5rem; vertical-align: -4px; }
.footer-icon { display: inline-block; width: 2rem; color: #fadd11; font-size: 1.25rem; }
.slideshow { position: relative; width: 100%; height: 700px; overflow: hidden; white-space: nowrap; }
.slide-container { display: flex; height: 100%; transition: transform ease-out .45s; }
.slide { position: relative; min-width: 100%; height: 100%; }
.slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.slide-info { position: absolute; top: 50%; left: 50%; width: 48%; color: #fff; font-size: clamp(1.15rem, 1.7vw, 2rem); line-height: 1.3; text-align: center; white-space: normal; transform: translateY(-42%); }
.slide-info::before { content: '“'; display: inline; margin-right: .25rem; color: #fff; font-size: 3.5rem; font-weight: 700; line-height: 1; }
.slide-info::after { content: '”'; display: inline; margin-left: .25rem; font-size: 3rem; font-weight: 700; line-height: 1; vertical-align: -.35rem; }
.dots-container { position: absolute; z-index: 5; right: 0; bottom: 26px; left: 0; text-align: center; }
.dot { display: inline-block; width: 16px; height: 16px; padding: 8px; margin-right: 15px; cursor: pointer; background: whitesmoke; border: 1px solid #d1d1d1; border-radius: 50%; }
.dot.active { background: #1e3e66; border-color: #1e3e66; }
.dot:last-child { margin-right: 0; }
.dot:hover { background: #232323; }
.directory-header { display: flex; align-items: stretch; justify-content: space-between; gap: 1rem; }
.directory-title { display: flex; align-items: center; width: 40%; min-height: 60px; }
.directory-search { position: relative; width: 60%; }
.directory-icon { position: relative; display: inline-block; width: 38px; height: 38px; margin-right: .75rem; vertical-align: middle; background: #fff; border: 3px solid #fadd11; border-radius: 50%; }
.directory-icon::before { content: ''; position: absolute; top: 8px; left: 8px; width: 12px; height: 12px; border: 3px solid #fadd11; border-radius: 50%; }
.directory-icon::after { content: ''; position: absolute; top: 21px; left: 23px; width: 9px; height: 3px; background: #fadd11; transform: rotate(45deg); }
.search-arrow { display: inline-block; width: 0; height: 0; margin: 0 .5rem; vertical-align: middle; border-top: 24px solid transparent; border-bottom: 24px solid transparent; border-left: 24px solid #fadd11; }
.why-hero { min-height: 230px; padding-top: 3rem; background-position: center; }
.why-sections { padding: 1rem 0 4rem; }
.why-row { display: flex; align-items: center; justify-content: space-between; gap: 3rem; min-height: 210px; padding: 2.5rem 1rem; }
.why-row.reverse { flex-direction: row-reverse; background: #fafafa; }
.why-row > div:first-child { width: 60%; }
.why-row h2 { font-size: 1.8rem; }
.why-icon { display: grid; width: 150px; height: 120px; place-items: center; color: #fadd11; font-size: 5rem; }
.member-photo { max-height: 206px; object-fit: cover; }

@media screen and (max-width: 59.99em) {
	#main-menu { display: none; }
	#main-menu.is-open { display: flex; }
	.directory-header { align-items: stretch; flex-direction: column; }
	.directory-title, .directory-search, .why-row > div:first-child { width: 100%; }
	.footer-top { height: 55px; }
	.footer-form-column { margin-top: 55px; }
	.contact-ribbon { top: -55px; height: 55px; font-size: 1.15rem; }
	.contact-field { width: 75%; }
	.footer-bottom { flex-direction: column; gap: .25rem; }
	.footer-bottom > span:last-child { margin-left: 0; }
	.why-row, .why-row.reverse { flex-direction: column; gap: 1rem; text-align: center; }
	.why-icon { height: 80px; }
	.slide-info { top: 50%; left: 48%; width: 50%; padding: 0 .5rem; font-size: 1rem; }
	.slideshow { height: 430px; }
	.directory-search input { max-width: 45%; }
}

@media screen and (min-width: 60em) {
	.mylogo { max-width: 600px; }
}