/*
Theme Name: andtoo
Theme URI: https://www.andtoo.place
Author: Mars Rouge
Author URI: http://www.marsrouge.com
Version: 2.0
*/

@CHARSET "UTF-8";
* {box-sizing:border-box; padding:0; margin:0; -webkit-backface-visibility:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; outline:none;}

:root {
	
	--blanc:#ffffff;
	--bleu:#0D1A3D;	
	--jaune:#CA9C2D;
	--gris:#edebf9;
	--gris2:#b6b4c8;
	--pad250:250px;
	--pad200:200px;
	--pad150:150px;
	--pad130:130px;
	--pad110:110px;
	--pad100:100px;
	--pad90:90px;
	--pad80:80px;
	--pad70:70px;
	--pad60:60px;
	--pad50:50px;
	--pad40:40px;
	--pad35:35px;
	--pad30:30px;
	--pad25:25px;
	--pad20:20px;
	--pad15:15px;
	--pad10:10px;
	--pad5:5px;
	--menu:140px;
	--ease:cubic-bezier(0.165, 0.84, 0.44, 1);
	--ease2:cubic-bezier(.215,0,.355,1);
	
} 

* {scrollbar-width: none; -ms-overflow-style: none;}
html {background:var(--blanc);}
body, html {overflow-x: hidden!important; touch-action: pan-y; max-width:100vw;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; vertical-align: baseline;}
body {background:var(--blanc); color:var(--bleu); overflow-x: hidden; webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; counter-reset:item itemb;
transition:background .3s ease-out;}
::-webkit-scrollbar {width:0px;}

a {color:inherit; outline:none; webkit-transition:all .35s; -moz-transition:all .35s; transition:all .35s; -o-transition:all .35s; -ms-transition:all .35s; text-decoration:none;}
a:focus, a:active {outline: none;}
a:link, a:visited, a:hover, a:active, a:focus, button {outline:0;}
:focus, :hover {-webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

sup {font-size:.6em; vertical-align:super;}
 
button {font-size:inherit;}
button:hover {cursor:pointer;}
 
section {position:relative; clear:both; transform-style:preserve-3d;}

button {border:0;}
li {list-style: none; margin-bottom:0;}
li:last-child {margin-bottom:0;}

p {margin-bottom:var(--pads);}
p:last-child {margin-bottom:0!important;}

.grecaptcha-badge {visibility: hidden!important; pointer-events:none!important; display:none!important;}

img {pointer-events:none;}
.radius {border-radius:10px;}
.border {border:1px solid var(--bleu);}



/* FONTS */
 
body, .font-normal, .article h3 {font-family: "aktiv-grotesk", sans-serif; font-weight:400; font-style: normal; font-optical-sizing: auto; font-size:1.4rem; line-height:1.5;}
h1, h2, h3 , h4 {line-height:1; font-weight:400;}

.font-size--a {font-size:5vw; line-height:1;}
.font-size--b {font-size:2.4rem; line-height:1.3;}
.article h2 {font-size:2rem; line-height:1.3;}

.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.bold {font-weight:700;}
.uppercase {text-transform:uppercase;}

.underline a {position:relative; white-space: nowrap; display:inline-block;}
.underline a:before {content:''; position:absolute; bottom:-10%; left:0; width:100%; min-height:2px; height:2px; transform-origin:left; transform:scaleX(1); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--jaune);}
.underline a:hover::before {transform-origin:right; transform:scaleX(0);}

.page-contact .underline a:before {transform-origin:right; transform:scaleX(0); background-color:var(--bleu);}
.page-contact .underline a:hover::before {transform-origin:left; transform:scaleX(1);}

.bg-bleu .underline a {color:var(--blanc);}
.bg-bleu .underline a:hover {color:var(--jaune);}
.bg-bleu .underline a:before {transform-origin:right; transform:scaleX(0); background-color:var(--jaune);}
.bg-bleu .underline a:hover::before {transform-origin:left; transform:scaleX(1);}

.bloc-andtoo-foundation .article a {color:var(--bleu);}
.bloc-andtoo-foundation a:before {background-color:var(--bleu);}

.page-stiftung {align-items: stretch;}
.thumb {inset: 0; width:100%; position:absolute; height:100%; background-size:cover; background-position:center center; transform: translateY(0); will-change: transform;}



/* GRID + FLEX + WRAPPER */

.absolute {position:absolute;}
.grid {display:grid;}
.flex {display:flex;}
.aligncenter {justify-content:center;}
.justify-end {justify-content: flex-end;}
.itemscenter {align-items:center;}
.alignitemsstart {align-items: flex-start;}
.aligncntstart {align-content: flex-start;}
.alignright {justify-content:flex-end;}
.alignbottom {justify-content: flex-end;}
.itemstbottom {align-items: flex-end;}
.justify {justify-content:space-between;}
.baseline {align-items:baseline;}
.direction {flex-direction:column;}
.center {text-align:center;}

.grid-pad250 {grid-gap:calc(var(--pad100) + var(--pad100) + var(--pad50));}
.grid-pad200 {grid-gap:var(--pad200);}
.grid-pad150 {grid-gap:calc(var(--pad100) + var(--pad50));}
.grid-pad100 {grid-gap:var(--pad100);}
.grid-pad90 {grid-gap:var(--pad90);}
.grid-pad80 {grid-gap:var(--pad80);}
.grid-pad70 {grid-gap:var(--pad70);}
.grid-pad60 {grid-gap:var(--pad60);}
.grid-pad50 {grid-gap:var(--pad50);}
.grid-pad40 {grid-gap:var(--pad40);}
.grid-pad35 {grid-gap:var(--pad35);}
.grid-pad30 {grid-gap:var(--pad30);}
.grid-pad25 {grid-gap:var(--pad25);}
.grid-pad20 {grid-gap:var(--pad20);}
.grid-pad15 {grid-gap:var(--pad15);}
.grid-pad10 {grid-gap:var(--pad10);}
.grid-pad5 {grid-gap:var(--pad5);}
.grid-pads {grid-gap:var(--pads);}

.column-2 {column-count: 2;}
.col-1-2 {grid-template-columns:1fr 1.5fr;}
.col-1-3 {grid-template-columns: var(--pad100) auto;}
.col-1-3-1 {grid-template-columns:auto 1fr auto;}
.col-2 {grid-template-columns:1fr 1fr;}
.col-2-1-1 {grid-template-columns:2fr 1fr 1fr;}
.col-3 {grid-template-columns:1fr 1fr 1fr;}
.col-3-1 {grid-template-columns:2fr 1fr;}
.col-4 {grid-template-columns:1fr 1fr 1fr 1fr;}
.col-5 {grid-template-columns:1fr 1fr 1fr 1fr 1fr;}
.footer-col {grid-template-columns:.8fr 1fr auto;}

.hidden {overflow:hidden;}
.inline-block {display:inline-block;}
.block {display:block;}

.relative {position:relative;}
.absolute {position:absolute;}

.mar-450 {margin-top:calc(calc(var(--pad100) * 4) + var(--pad50));}
.mar-250 {margin-top:var(--pad250);}
.mar-200 {margin-top:var(--pad200);}
.mar-150 {margin-top:var(--pad150);}
.mar-130 {margin-top:var(--pad130);}
.mar-100 {margin-top:var(--pad100);}
.mar-90 {margin-top:var(--pad90);}
.mar-80 {margin-top:var(--pad80);}
.mar-70 {margin-top:var(--pad70);}
.mar-60 {margin-top:var(--pad60);}
.mar-50 {margin-top:var(--pad50);}
.mar-40 {margin-top:var(--pad40);}
.mar-35 {margin-top:var(--pad35);}
.mar-30 {margin-top:var(--pad30);}
.mar-20 {margin-top:var(--pad20);}
.mar-15 {margin-top:var(--pad15);}
.mar-10 {margin-top:var(--pad10);}
.mar-5 {margin-top:var(--pad10);}

.content-100 {width:100%;}
.content-90 {width:90%;}
.content-85 {width:85%;}
.content-80 {width:80%;}
.content-75 {width:75%;}
.content-70 {width:70%;}
.content-65 {width:65%;}
.content-60 {width:60%;}
.content-55 {width:55%;}
.content-50 {width:50%;}
.content-45 {width:45%;}
.content-40 {width:40%;}
.content-35 {width:35%;}
.content-30 {width:30%;}
.content-25 {width:27%;}
.content-20 {width:20%;}
.content-10 {width:10%;}

.content-height-100 {height:100%;}

.height-80 {height:80vh;}
.height-100 {height:100vh;}

.zindex {z-index:10;}
.nowrap {white-space:nowrap;}

.homepage {padding:var(--menu) var(--pad90) var(--pad90) var(--pad90);}
.wrapper-50 {padding:var(--pad50);}
.wrapper-90-90-0-90 {padding:var(--pad90) var(--pad90) 0 var(--pad90);}
.wrapper-90-90-150-90 {padding:var(--pad90) var(--pad90) var(--pad150) var(--pad90);}
.wrapper-0-90-90-90 {padding:0 var(--pad90) var(--pad90) var(--pad90);}
.wrapper-90 {padding:var(--pad90);}
.wrapper-0-90 {padding:0 var(--pad90);}
.wrapper-b-90 {padding-bottom:var(--pad90);}
.wrapper-t-90 {padding-top:var(--pad90);}
.wrapper-t-150 {padding-top:var(--pad150);}
.wrapper-150 {padding:var(--pad150);}
.wrapper-150-90 {padding:var(--pad150) var(--pad90);}
.wrapper-150-0 {padding:var(--pad150) 0;}
.wrapper-0-90-150-90 {padding:0 var(--pad90) var(--pad150) var(--pad90);}
.wrapper-0-90-40-90 {padding:0 var(--pad90) var(--pad40) var(--pad90);}
.page {padding-top:var(--menu);}



/* OVERLAY */

#loader {position:fixed; width:100vw; height:100vh; height: 100dvh; top:0; left:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
z-index:9999; transition:transform .9s cubic-bezier(.86,0,.07,.995); transform:translateZ(0);}
#loader:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:var(--gris); z-index:-1;}
#loader svg {width:19rem;}
.loader-text {overflow: hidden; height:4rem; position: relative;}
#loader .loader-text {transform:translateY(4rem); transition:.7s var(--ease); opacity:0;}
.loader-text.loading {transform:none!important; opacity:1!important;}
#loader.loading {transform:translate3d(0,-100%,0);}
.loader-track {display: flex; flex-direction: column; transform: translateY(100%); transition: transform.6s ease;}
.loader-text.animate .loader-track {transform: translateY(0);}
.loader-track div {height:4rem; display:flex; align-items:center; justify-content:center; gap:0.4rem; transform:skewY(3deg);
opacity:0; transition: transform .7s ease, opacity .7s ease;}
.loader-track div.active {transform: skewY(0deg); opacity: 1;}

.logo-1 {fill:var(--jaune);}
.logo-2 {fill:var(--bleu);}
.logo-3 {fill:var(--blanc);}
.logo-4 {fill:#4e9833;}

.menu {padding:0 var(--pad90); height:var(--menu); width:100vw; position:fixed; top:0; z-index:10; transition:.4s var(--ease); transform:translateY(-100%) skewY(3deg);}
.is-ready .menu {transform:none;}
.menu-logo .logo {width:215px; transform-style: preserve-3d;}
.menu.scroll .menu-logo .logo {width:160px;}
.menu-links a:hover, .menu-stuff a:hover, .menu-links a.active, .menu-stuff a.active {opacity:.3;}
.menu .link-fk {color:var(--jaune); position:relative; white-space: nowrap; display:inline-block;}
.menu .link-fk:hover {opacity:1;}
.menu .link-fk:before {content:''; position:absolute; bottom:-20%; left:0; width:100%; min-height:2px; height:2px; transform-origin:left; transform:scaleX(1); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--jaune);}
.menu .link-fk:hover::before {transform-origin:right; transform:scaleX(0);}

.menu.active {color:var(--blanc);}
.menu.active .logo-2 {fill:var(--blanc);}

.menu.scroll {height: var(--pad90); font-size:75%;}
.menu:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; transform:translateY(-100%); transition:.4s cubic-bezier(.215,.61,.355,1);
background:var(--gris); z-index:-1; transform-style: preserve-3d;}
.menu.scroll:before {transform:none; }
.menu.scroll.active {color:var(--bleu)!important;}
.menu.scroll.active .logo-2 {fill:var(--bleu)!important;}



/* MENU */

.overlay-menu {position:fixed; top:var(--pad30); right:var(--pad90); z-index:20; grid-gap:1.5rem; display:none;}
.overlay-menu span {color:var(--blanc); transition:.4s cubic-bezier(.215,.61,.355,1); transition-delay:.2s; display:block; transform: translateY(-100%);}
.is-ready .overlay-menu span {transform:none;}

.menu-close {display:none; pointer-events:none; position:absolute; width:var(--pad70); height:var(--pad70); right:0; top:0;}
.menu-close.open {display:block; pointer-events:auto; z-index:20; cursor:pointer;}
.overlay-menu--icon {position:relative; cursor:pointer; width:var(--pad70); height:var(--pad70); display:flex; justify-content:center;
align-items:center; grid-gap:.3rem; flex-direction:column; transition:transform .5s cubic-bezier(.86,0,.07,.995), opacity .5s cubic-bezier(.86,0,.07,.995);
transform:scale(0.2) rotate(-90deg); opacity:0;}
.is-ready .overlay-menu--icon {transform:none; opacity:1;}
.overlay-menu--icon:before {content:''; position:absolute; background:var(--jaune); width:100%; height:100%; top:0; left:0; transition:.4s cubic-bezier(.215,.61,.355,1);
border-radius:7rem; z-index:-1;}
.overlay-menu--icon:hover::before {transform:scale(1.15);}
.menu-mobile--bar {height:2px; width:1.5rem; background:var(--blanc); transition:transform .3s cubic-bezier(0.165, 0.84, 0.44, 1);}

.overlay-menu--icon.open {grid-gap:0rem; transform:rotate(180deg);}
.overlay-menu--icon.open .menu-mobile--bar {;}
.overlay-menu--icon.open .menu-mobile--bar:nth-child(1) {transform:translateY(2px) rotate(-45deg);}
.overlay-menu--icon.open .menu-mobile--bar:nth-child(2) {transform:rotate(45deg);}
.overlay-menu--icon.open .menu-mobile--bar:nth-child(3) {transform:scaleX(0);}
.overlay-menu--icon.open:before {;}

main {transition:filter .9s cubic-bezier(.86,0,.07,.995), opacity .9s cubic-bezier(.86,0,.07,.995), transform .9s cubic-bezier(.86,0,.07,.995); transform-origin:center center;
transform:translateZ(0);}
main.open {filter:blur(1.5rem); backdrop-filter:blur(1.5rem); -webkit-backdrop-filter:blur(1.5rem); transform:scale(1.04); pointer-events:none;}
.menu-mobile {position:fixed; height:100vh; width:100vw; right:0; top:0; background:var(--blanc); z-index:15; transition:transform .9s cubic-bezier(.86,0,.07,.995); 
transform: translate3d(100%,0,0);}
.menu-mobile.open {transform:translateX(0);}
.menu-bg {position:fixed; top:0; left:0; width:100vw; transition:.9s cubic-bezier(.86,0,.07,.995); height:100vh; background:rgba(0,0,0,0); z-index:10; pointer-events:none;}
.menu-bg.open {transition:.9s cubic-bezier(.86,0,.07,.995); background:rgba(0,0,0,.3);}

html.open {overflow:hidden!important;}

.menu-thumb--wrapper {width:35%;}
.menu-wrapper {width:100%; padding:9.5rem 0 5rem 0; color:var(--bleu);}

.menu-principal a {width:100%; padding: 2vh var(--pad30); position:relative;}
.menu-principal a {overflow:hidden; transition:.5s cubic-bezier(.215,.61,.355,1); pointer-events:none;}
.menu-principal a div {transform:translateY(calc(100% + 2.5rem)) skewY(5deg); transition:transform .6s cubic-bezier(.215,.61,.355,1);}
.menu-mobile .follow a {transform:translateY(3rem) skewY(5deg); transition:.3s cubic-bezier(.215,.61,.355,1), transform .6s cubic-bezier(.215,.61,.355,1);
pointer-events:none; opacity:0;}
.menu-mobile .follow a:hover {background:var(--gris);}
.menu-principal a:after {content:''; width:0; height:1px; background:var(--bleu); position:absolute; bottom:0; left:0; transition:.6s cubic-bezier(.215,.61,.355,1);}
.menu-principal.open a:after {width:100%;}

.menu-principal {display:flex; flex-direction:column; align-items:flex-start; font-size:1.5rem;}
.menu-principal a svg {fill:var(--vert2); width:8px;}
.menu-principal a:before {content:''; position:absolute; bottom:-1px; top:-1px; left:-1px; right:-1px; z-index:-1; transform:scaleY(0); transform-origin:center top;
background-color:var(--bleu); transition:transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-principal a:hover::before {transform:scaleY(1); transform-origin:center bottom;}
.menu-principal a.active:before {transform:scaleY(0); transform-origin:center top;}
.menu-principal a.active svg {display:none;}
.menu-principal.open a.active:before {transform:scaleY(1);}
.menu-principal a:hover, .menu-principal a.active {color:var(--blanc);}
.menu-principal a:hover svg, .menu-principal a.active svg {fill:var(--blanc);}

.menu-mobile .follow {padding:0 var(--pad40);}
.menu-principal.open a, .menu-mobile .follow.open a {pointer-events:auto;}
.menu-principal.open a div, .menu-mobile .follow.open a {transform:none;}
.menu-mobile .follow.open a {opacity:1;}
.menu-principal.open a:nth-child(2) div, .menu-mobile .follow.open a:nth-child(2) {transition-delay:.05s;}
.menu-principal.open a:nth-child(3) div, .menu-mobile .follow.open a:nth-child(3) {transition-delay:.1s;}
.menu-principal.open a:nth-child(4) div, .menu-mobile .follow.open a:nth-child(4) {transition-delay:.15s;}
.menu-principal.open a:nth-child(5) div, .menu-mobile .follow.open a:nth-child(5) {transition-delay:.2s;}
.menu-principal.open a:nth-child(6) div, .menu-mobile .follow.open a:nth-child(6) {transition-delay:.25s;}

.mobile-language {display:none;}
.mobile-logo {display:none;}



/* CONTENU */

.border-bottom {border-bottom:1px solid var(--bleu);}
.bg-bleu .border-bottom {border-bottom:1px solid var(--blanc);}

.btn {color:var(--jaune); position:relative; white-space: nowrap; display:inline-block;}
.btn:before {content:''; position:absolute; bottom:-20%; left:0; width:100%; min-height:2px; height:2px; transform-origin:left; transform:scaleX(1); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--jaune);}
.btn:hover::before {transform-origin:right; transform:scaleX(0);}

.btn-contact {background:var(--bleu); border-radius:10px; cursor:pointer; color:var(--blanc); height:var(--pad90); padding:0 var(--pad50); transition:.2s;}
.btn-contact:hover {background:var(--jaune);}

.bg-blanc {background:var(--blanc);}
.bg-gris {background:var(--gris);}
.bg-bleu {background:var(--bleu); color:var(--blanc);}
.bg-jaune {color:var(--bleu);}

.font-size--a em, .font-size--b em {color:var(--jaune); font-style:inherit;}
.color-j {color:var(--jaune);}
.color-b {color:var(--blanc);}

.fullwidth-video {width:100%; height:100vh; position:absolute; top:0; left:0; display:flex; align-items: center; justify-content: center; overflow:hidden; z-index:-1;}
.fullwidth-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.noise {z-index: 100; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; opacity: .1;}

.first, .second {transition:.8s var(--ease); transform:translateY(5rem); opacity:0;}
.is-ready .first {transform:none; opacity:1;}
.is-ready .second {transform:none; opacity:1; transition-delay:.2s;}

.flotaison-icon {position:absolute; right:var(--pad90); bottom:var(--pad90); cursor:pointer; width:var(--pad80); height:var(--pad80); border-radius:8rem; 
border:1px solid var(--blanc); transition:.3s;}
.flotaison-icon:hover {background:var(--jaune); border:1px solid var(--jaune);}
.flotaison-icon svg {fill:var(--blanc); width:18px; transition:.35s;}
.flotaison-icon.is-hidden {opacity: 0; transform: translateY(-2rem); pointer-events: none;}

.section-title {padding:0 var(--pad90) var(--pad50) var(--pad90); border-bottom:1px solid var(--bleu);}

.article a {color:var(--jaune);}
.article a:hover {color:var(--bleu);}
.article p {margin-bottom:var(--pad40);}
.article h2 {color:var(--jaune); margin:var(--pad60) 0 var(--pad30) 0; padding-bottom:var(--pad30); border-bottom:1px solid var(--jaune);}
.article h2:first-child {margin:0 0 var(--pad30) 0;}
.article h3 {margin:var(--pad60) 0 var(--pad20) 0; padding-bottom:var(--pad20); border-bottom:1px solid var(--bleu);}
.article ul {padding-left:3rem; display:flex; flex-direction:column; grid-gap:var(--pad10); margin:var(--pad40) 0;}
.article li {position:relative;}
.article li:before {content:''; border-radius:8rem; background:var(--jaune); width:15px; height:15px; position:absolute; top:10px; left:-3rem;}

.timeline-wrapper {position: relative;}
.timeline-line, .timeline-progress {position: absolute; left: 10px; top: 18px; width: 2px;}
.timeline-line {height: calc(100% - 36px); background: var(--gris); z-index: 0;}
.timeline-progress {height: calc(100% - 36px); background:var(--jaune); z-index: 1; transform: scaleY(0); transform-origin: top center;}
.paragraph {position: relative; display: flex; margin-bottom:var(--pad200);}
.paragraph:last-child {margin-bottom: 0;}
.timeline-col {position: relative; width:var(--pad150); min-width:var(--pad150); flex-shrink: 0;}
.paragraph .dot {position: absolute; left: 0; top: 18px; width: 20px; height: 20px; border-radius: 50%; background: var(--gris2); z-index: 2;}
.paragraph-text {color: var(--gris2); position: relative; z-index: 2;}
.paragraph-img {position: relative;}
.paragraph-img--sticky {position: relative; will-change: transform; overflow: hidden; aspect-ratio: 2 / 1.5; border-radius:10px;}
.paragraph-visual {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; visibility: hidden; transform: scale(1.1);
will-change: opacity, transform;}
.paragraph-visual.is-active {opacity: 1; visibility: visible; transform: scale(1);}

.headline-switch {--step: 4s; --duration: calc(var(--count) * var(--step)); position: relative; width: 100%; display: grid;}
.headline-item {grid-area: 1 / 1; display: block; text-align: center; line-height:1.3; letter-spacing: -0.03em; text-wrap: balance; opacity: 0; transform: translateY(-2rem); 
filter: blur(10px); will-change: transform, opacity, filter; animation: headlineSwitch var(--duration) infinite; animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
animation-delay: calc(var(--i) * -1 * var(--step));}

@keyframes headlineSwitch {
	
	0% {
		opacity: 0;
		transform: translateY(-2rem);
		filter: blur(10px);
	}

	1.5% {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}

	10% {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}

	12% {
		opacity: 0;
		transform: translateY(2rem);
		filter: blur(10px);
	}

	100% {
		opacity: 0;
		transform: translateY(2rem);
		filter: blur(10px);
	}
	
}

.number {width:var(--pad70); height:var(--pad70); background:var(--jaune); border-radius:8rem;}
.number:after {counter-increment: itemb; font-size:inherit; color: var(--blanc); content: counter(itemb, decimal-leading-zero);}

.item-team img {width:400px; height:auto; max-width:100%;}

.andtoo-foundation img {width:300px; height:auto;}



/* CONTACT */

.contact-img img {width:100%; height:auto;}

.form-item {position:relative;}
.form-item--message {margin-bottom:0!important;}

input, textarea {font-family: "aktiv-grotesk", sans-serif; font-weight:400; color:var(--violet); font-size:inherit;}
.formulaire label {display: flex;}
.formulaire input, .formulaire textarea, .mailerlite-form input, .select-selected  {width:100%; border:0; border-radius:10px; color:inherit; background:var(--gris); transition:.2s;}
.formulaire input {padding:0 var(--pad30); height:var(--pad90); display:flex; align-content: center;}
.formulaire textarea {padding:var(--pad30);}
.formulaire input:hover, .formulaire textarea:hover, .formulaire input:focus, .formulaire textarea:focus, .select-selected:hover, 
.mailerlite-form input:hover, .mailerlite-form input:focus {background:var(--gris2);}
.formulaire textarea {resize: none; height:100%;}
.formulaire button[type="submit"] {position:relative;}
.formulaire .radio-elements {border:1px solid var(--violet); padding:2rem; grid-gap:var(--pad30);}
.formulaire .radio-elements label {display:block;}

button[type="submit"] {position:relative; font-family:inherit;}

.wpcf7-form-control-wrap {display: none !important; visibility: hidden !important;}
.wpcf7-list-item {background:var(--blanc); color:var(--bleu); width:100%; padding:var(--pad30) 0; display: flex; align-items: center;}
.wpcf7-list-item label {width:100%;}

.wpcf7-checkbox {display:inline-block;}
.wpcf7-form input[type="radio"], .wpcf7-form input[type="checkbox"] {display: none;}
.wpcf7-list-item-label {cursor:pointer; padding-left:1rem; position:relative;}

.wpcf7-form input[type="file"] {cursor:pointer;}
.wpcf7-form input[type="radio"], .wpcf7-form input[type="checkbox"] {display: none;}
.wpcf7-list-item-label {cursor:pointer; left:4rem; width:calc(100% - 4rem); position:relative;}
.wpcf7-radio {display:grid; grid-template-columns: 1fr 1fr; grid-gap:1.5rem; margin-bottom:0; flex-wrap: wrap;}
.form-item--connu .wpcf7-radio {display:grid; grid-template-columns: 1fr 1fr; grid-gap:var(--pad20); margin-bottom:0; flex-wrap: wrap;}
.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before,  .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {position: absolute; top:50%;
transform: translateY(-50%); left:-3rem; background: none; border:1px solid var(--bleu); border-radius:50%; display:inline-block; vertical-align:middle;
height:25px; width:25px; content:''; transition:.2s;}
.wpcf7-form input[type="radio"]:checked + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"]:checked + .wpcf7-list-item-label::before 
{background:var(--bleu);}

.wpcf7-acceptance {font-size:80%;}
.wpcf7-acceptance a {color:var(--jaune);}

::-webkit-input-placeholder {color:var(--bleu); opacity:.4; -webkit-transition: opacity .5s; transition: opacity .5s;}
:-moz-placeholder {color:var(--bleu);  opacity:.4 -moz-transition: opacity .5s; transition: opacity .5s;}
::-moz-placeholder {color:var(--bleu); opacity:.4; -moz-transition: opacity .5s; transition: opacity .5s;}
:-ms-input-placeholder {color:var(--bleu); opacity:.4; -ms-transition: opacity .5s; transition: opacity .5s;}
::placeholder {color:var(--bleu); opacity:.4; transition: opacity .5s;}

*:focus::-webkit-input-placeholder {color:var(--bleu); opacity:.4;}
*:focus:-moz-placeholder {color:var(--bleu); opacity:.4;}
*:focus::-moz-placeholder {color:var(--bleu); opacity:.4;}
*:focus:-ms-input-placeholder {color:var(--bleu); opacity:.4;}
*:focus::placeholder {color:var(--bleu); opacity:.4;}

:invalid {box-shadow: none;}
:-moz-submit-invalid {box-shadow: none;}
:-moz-ui-invalid {box-shadow:none;}

.wpcf7-not-valid {border:1px solid #cc2e2e!important;}
.wpcf7-acceptance.wpcf7-not-valid {border:0!important;}
.screen-reader-response, .wpcf7-response-output {display:none;}
.wpcf7-not-valid-tip, .mailerlite-form-error {color:#cc2e2e; font-size: .8rem; width: 100%; position: relative; display: block; margin-top:.5rem;}
.mc4wp-alert.mc4wp-success {font-size: .8rem; margin-top:1.5rem; text-align: center;}

.cmplz-cookiebanner .cmplz-message img {width:70px; height:70px; margin-left: 1.5rem;}
.spindown {-webkit-animation:spindown 8s linear infinite; -moz-animation:spindown 8s linear infinite; animation:spindown 8s linear infinite;}
@-moz-keyframes spindown {100% {-moz-transform: rotate(360deg);}}
@-webkit-keyframes spindown {100% {-webkit-transform: rotate(360deg);}}
@keyframes spindown {100% {-webkit-transform: rotate(360deg); transform:rotate(360deg);}}



/* FOOTER */

.footer {overflow:hidden; min-height:100vh; display:flex; flex-direction:column; justify-content: flex-end;}
.footer-bg {position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-position:center center; z-index:-1; will-change: transform;}

.follow a svg {fill:var(--bleu); height: var(--pad20); width: auto;}
.follow a {width:var(--pad60); height:var(--pad60); background:var(--jaune); border-radius:8rem; transition:.3s;}
.follow a:hover {background:var(--blanc);}
.page-contact .follow a:hover {background:var(--gris);}

.footer-isotype {width:190px; height:auto;}
.logo-foundation svg {width:120px;}

.marsrouge {width:40px; fill:var(--blanc); transition:.3s;}
.marsrouge:hover {fill:var(--jaune);}



/* RESPONSIVE DESIGN */

@media screen and (max-width:1790px) {
	
	.font-size--a {font-size: 4.5vw;}
	.font-size--b {font-size: 2.2rem; line-height: 1.2;}
	
	.paragraph .dot {top: 15px;}
	
}

@media screen and (max-width:1550px) {
	
	:root {
		--menu: 120px;
		--pad90:70px;
	}
	
	body, .font-normal, .article h3 {font-size: 1.2rem; line-height: 1.4;}
	.font-size--b {font-size: 2rem;}
	
	.menu-logo .logo {width:180px;}
	.menu.scroll .menu-logo .logo {width:140px;}
	
	.flotaison-icon {right: var(--pad70); bottom: var(--pad70);}
	.flotaison-icon svg {width:15px;}
	
	.services-meta {display:grid; grid-template-columns: 2fr 1fr; width:100%;}
	.number {width: var(--pad60); height: var(--pad60);}
	
	.paragraph .dot {top: 13px;}
	
	.article li:before {width:10px; height:10px;}
	
	.andtoo-foundation img {width: 200px;}
	
	.follow a {width: var(--pad50); height: var(--pad50);}
	.follow a svg {height: var(--pad15);}
	
	.footer-isotype {width: 130px;}
	
}

@media screen and (max-width:1390px) {

	body, .font-normal, .article h3 {font-size: 1rem; line-height: 1.4;}
	.font-size--b, .article h2 {font-size:1.8rem;}

	.menu.col-3 {grid-template-columns:1fr 1fr 1fr;}
	.col-3 {grid-template-columns:1fr 1fr;}
	
	.paragraph .dot {top: 10px;}
	.article li:before {top: 7px;}
	
	.footer-line-2 {grid-template-columns:1fr; grid-gap:var(--pad90);}
	.footer-andtoo--text {width:60%;}
	
	.fullwidth-video video {opacity:.6;}
	
}

@media screen and (max-width:1150px) {

	:root {
		--menu: 120px;
		--pad150:120px;
		--pad90:70px;
	}
	
	.font-size--a {line-height:1.2;}
	.font-size--b, .article h2 {font-size:1.6rem;}

	.menu {padding:0; height: auto; width: auto; top:2.8rem; left:var(--pad90); opacity:0;}
	.is-ready .menu {opacity:1;}
	.menu:before {content:none;}

	.menu {position:absolute;}
	.menu-logo .logo {width: 150px;}
	.menu .menu-links, .menu .menu-stuff {display:none;}
	
	.mobile-logo {display:flex;}
	
	.col-3-1, .col-2, .footer-line-1 {grid-template-columns:1fr;}
	
	.content-90, .content-80, .content-70, .content-60, .content-50, .content-40, .content-30 {width:100%;}
	
	.section-title {padding: 0 var(--pad90) var(--pad30) var(--pad90);}
	
	.page {padding-top:5rem;}
	
	.paragraph-img {display:none;}
	.paragraph {margin-bottom: var(--pad100);}
	
	.andtoo-foundation {flex-direction: column; grid-gap:var(--pad90);}
	
	.overlay-menu {display: flex;}
	.mobile-language.active a {color:var(--blanc);}
	.mobile-language.open a {color:var(--bleu)!important;}
	.mobile-language {display:flex; position:fixed; top:3.45rem; right:calc(var(--pad90) + var(--pad70) + var(--pad30)); z-index: 20; transition: .4s var(--ease);
	opacity:0; transform: translateY(-100%);}
	.is-ready .mobile-language {transform:none; opacity:1;}
	.mobile-logo {top:2.8rem;; left: var(--pad90); z-index: 20; transition: .4s var(--ease); transform: translateY(-100%) skewY(3deg); opacity:0;
	pointer-events:none; position:fixed;}
	.mobile-logo.open {transform:none; opacity:1; pointer-events:auto;}
	.mobile-logo svg {width:150px; height:auto;}
	
	.thumb {width: 100%; position:relative; aspect-ratio: 1 / 1;}
	
	.footer-isotype {width: 80px;}
	.footer-line-1 {grid-gap:var(--pad90);}
	.footer-line-1 .footer-col {grid-template-columns:1fr 1fr;}
	
}

@media screen and (max-width:890px) {
	
	:root {
		--pad150:5rem;
		--pad100:3rem;
		--pad90:3rem;
		--pad80:3rem;
		--pad70:3rem;
		--pad60:3rem;
		--pad50:3rem;
	}
	
	.col-3, .footer-line-3 {grid-template-columns:1fr;}
	.footer-col {grid-template-columns: 1fr 1fr;}
	
	.flotaison-icon {width: 3rem; height: 3rem; bottom: 5rem;}
	.flotaison-icon svg {width: 10px;}
	.overlay-menu--icon, .menu-close {width: 3rem; height: 3rem;}
	.menu-mobile--bar {width: 1rem;}
	.overlay-menu--icon {grid-gap: 3px;}
	.mobile-language {top: 2.7rem; right: calc(var(--pad90) + 3rem + var(--pad30));}
	
	.mobile-logo, .menu {top: 2.1rem;}
	
	.andtoo-foundation img {width: 150px;}
	
	.formulaire input, .btn-contact {height: 4rem;}
	
	.footer-bg {display: none;}
	.footer-line-3 {justify-items:center; padding: var(--pad90) var(--pad90) var(--pad40) var(--pad90); border-top: 1px solid var(--blanc);}
	
}

@media screen and (max-width:690px) {
	
	:root {
		--pad150:5rem;
		--pad100:2.5rem;
		--pad90:2rem;
		--pad80:2rem;
		--pad70:2rem;
		--pad60:2rem;
		--pad50:2rem;
		--pad40:2rem;
		--pad30:1.5rem;
		--pad5:10px;
	}
	
	.mobile-logo, .menu {top: 1.8rem;}
	.mobile-language {top: 2.35rem;}
	
	.menu-principal {font-size:1.2rem;}
	.font-size--b, .article h2 {font-size: 1.4rem; line-height:1.3;}
	
	.column-2 {column-count:1;}
	
	.paragraph .dot {top:9px; width: 15px; height: 15px;}
	.timeline-line, .timeline-progress {top:20px; left: 7px;}
	.timeline-progress {height: calc(100% - 20px);}
	
	.page {padding-top: 6rem;}
	
	.number, .follow a {width: 3rem; height: 3rem;}
	
	.wrapper-150 {padding: var(--pad150) var(--pad90);}
	
	.footer .wrapper-90 {padding:3rem 2rem;}
	.footer-line-3 {justify-items: flex-start; padding:3rem var(--pad90) var(--pad40) var(--pad90);}
	
}

@media screen and (max-width:510px) {
	
	.font-size--a {font-size: 1.8rem;}
	.timeline-col, .timeline-line, .timeline-progress {display:none;}
	.article ul {padding-left:2rem;}
	.article li:before {left: -2rem;}
	.menu-mobile .follow {justify-content: center;}
	.mobile-language {right: calc(var(--pad90) + 3rem + 1rem);}
	
	div.item-team:nth-child(1) > div:nth-child(1) > div:nth-child(2), div.item-team:nth-child(2) > div:nth-child(1) > div:nth-child(2) {flex-direction:column; text-align:centr;
	align-items: center;}
	
	.andtoo-foundation .font-size--b {font-size:1.2rem;}
	
	.footer-isotype {width: 70px;}
	.footer-col, .footer-line-1 .footer-col {grid-template-columns: 1fr;}
	.footer-andtoo--text {width:100%;}
	.footer-line-3 {grid-gap: 3rem;}
	.footer-line-3 > div:nth-child(2) {flex-direction:column; align-items: flex-start; grid-gap:1rem; font-size:.8rem;}
		
}