#eap{
    width: 100%;
    position: relative;
    background:#1E1E1E;
    color:#FFF;
    overflow:hidden;
}
#eap .aux-content-top-margin .aux-primary{
    padding-top:0 !important;
}

.exergue{
    /*color:#806D46;*/
    /*color:rgb(0,200,255);*/
    color:#b58e44;
}
#barre-eap-1-1 svg path, #barre-eap-1-1 svg rect{
    /*fill:rgb(0,200,255) !important;*/
    fill:#b58e44 !important;
}

#animation-chapitre2 .exergue, #chapitre2-content-1 .exergue, #chapitre2-content-2 .exergue, #chapitre2-content-3 .exergue{
    color:#e74040 !important;
}

#barre-eap-2-1 svg path, #barre-eap-2-1 svg rect{
    fill:#e74040 !important;
}

body video{filter: contrast(101%);}
body.mac video{filter: brightness(88%);}

.section-fullscreen{
    position: relative;
    width:100%;
    height:100vh;
    overflow: hidden;
}
.section-fullscreen-center{
    display: flex;
    align-items: center;
    justify-content: center;
}
.back-video{
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%;
    width:auto;
}

line {
    shape-rendering: geometricPrecision;
}



.tete-chapitre-titre{font-size:2rem; margin-bottom:5px; line-height:1;font-weight: 100; letter-spacing: 5px;}
.tete-chapitre-sstitre{font-size: 4.45rem;font-weight: bold;margin-bottom:20px;line-height:1;}
.tete-chapitre-texte{font-size:1.3rem; line-height:1.2; font-weight:bold;}

.contenu-chapitre-titre{font-size:2.9rem; font-weight:bold; margin-bottom:20px; line-height:1.2;}
.contenu-chapitre-texte{font-size:1.2rem; line-height:1.2; font-weight:bold;}
.contenu-chapitre-fin{font-size:2.5rem; line-height:1; font-weight:100;}

#main{opacity:0;}
#eap-logo-menu-svg{
    display:inline-block; opacity:0;
}
#eap-logo-menu{
    display:none;
}
#eap-logo-menu-svg{
    z-index: 1000;
}


#animation-intro{
    position: relative;
    width:100%;
    margin:0 auto;
    height:700vh;
    overflow: hidden;
}

#header-animation{
    position: absolute;
    width:100%;
    background: #001e32;
    height:100vh;
    overflow: hidden;
}

#eap-logo-menu-svg{
    width: 80px;
    height: 40px;
}
#eap-logo-menu-svg svg{
    width: 100%;
    height: auto;
    display:block;
}

#title-eap{
    position:absolute;
    top:-20px;left:50%; transform: translateX(-50%);
    width:170px; text-align: center;
    color: #FFFFFF;
    font-size: 6px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight:normal;
    margin:0;
    font-family:"Ubuntu", Arial;
    line-height: 1;
}


.animation-canvas-cont{
    position: relative;
    width:100%;
    height:100vh;
    overflow: hidden;
}
.animation-canvas-cont canvas {
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
    width: auto;
}

@media (min-aspect-ratio: 1920/1080) {
    .animation-canvas-cont canvas {
        width: 100%;
        height: auto;
    }
}


#icon-scroll, #icon-scroll:before {
    position: absolute;
    left: 50%;
}
#icon-scroll {
    width: 30px;
    height: 50px;
    margin-left: -15px;
    bottom: 100px;
    margin-top: -35px;
    box-shadow: inset 0 0 0 2px #FFFFFF;
    border-radius: 20px;
}
#icon-scroll span{
    color: #FFFFFF;
    transform: translateX(-50%);
    display: inline-block;
    left: 50%;
    position: absolute;
    bottom: -30px;
    font-size: 0.9em;
}

#icon-scroll:before {
    content: '';
    width: 8px;
    height: 8px;
    background: #FFFFFF;
    margin-left: -4px;
    top: 8px;
    border-radius: 4px;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: mousescroll;
}
@keyframes mousescroll {
    0% {opacity:1;}
    100% {opacity:0; transform: translateY(20px);}
}


#subtitle{
    display: flex;
    align-items: center;
    justify-content: center;
    position:absolute;
    top:0; left:0;
    width:100%;
    height:100vh;
    opacity:0;
    will-change: transform;
}
#subtitle h2{
    padding:0; margin:0;
    font-size:4rem;
    letter-spacing: 3px;
    color:#FFFFFF;
    line-height:1.1;
    font-weight:bold;
    text-align: center;
}


#intro-texte-cont{
    display: flex;
    align-items: center;
    justify-content: center;
    position:absolute;
    top:0; left:0;
    width:100%;
    height:100vh;
    opacity:0;
}
#intro-texte, #text1{
    max-width:700px;
    width:96%;
    font-size:2.5rem;
    line-height:1.2;
    color:#FFF;
    font-weight: bold;
    text-shadow: 0 0 10px #000000;
    font-family:"Ubuntu";
}
#intro-texte > span{opacity:0.4;}

#chapitre1-intro-cont{
    position:absolute; top:0; right:10%;
    max-width:900px;
    width:80%;
    height:100vh;
    opacity:0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    column-gap:50px;
    word-break: break-word;
}

#txt-vous-1, #txt-vous-2{opacity:0;   }


.barre-eap{width:100%; min-width:50px; max-width:200px;}
.barre-eap svg{width:100%; height:auto;}
.barre-eap svg rect, .barre-eap svg path{fill:#FFFFFF;}





#chapitre1-content-2{
    margin-top:100vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    overflow: initial;
}
#chapitre1-content-2 .chapitre-content-cont {
    position: initial;
    max-width:800px;
    width:96%;
    text-align:center;
}

#chapitre1-content-2-image{
    position: relative;
    max-height:50vh;
    text-align: center;
    margin-bottom:5vh;
}

#chapitre1-content-2-image img{
    width: auto; height:100%; max-width: none;
}




#chapitre1-content-3{
    height:auto;
    z-index:450;
    padding:10vh 0 0 0;

}
#chapitre1-content-3-inner{
    position:initial;
    width:70%; height:auto; margin:0 auto;
    display:flex; align-items: center;
}

#chapitre1-content-3-images{
    position:relative; float:left; width:50%; height:auto;
}
#chapitre1-content-3-images img{
    opacity:0;
    vertical-align: top;
}
#chapitre1-content-3 #chapitre1-content-3-image-1{
    position:relative; float:left; width:72%; margin-top:170px; margin-right:6%;
}
#chapitre1-content-3 #chapitre1-content-3-image-2{
    position:relative; float:left; width:20%;
}
#chapitre1-content-3-flag{position:relative; float:left; width:15%; margin-top:30px;}
#chapitre1-content-3-flag div{display: inline-block; width:33.33%; height:15px; opacity:0;}
#chapitre1-content-3-flag div:nth-child(1){background:#3f88d4;}
#chapitre1-content-3-flag div:nth-child(2){background:white;}
#chapitre1-content-3-flag div:nth-child(3){background:#ff1d25;}

#chapitre1-content-3 #chapitre1-content-3-image-3{
    position:relative; float:left; clear:both;width:75%;
    margin:30px 0 0 15%;

}

#chapitre1-content-3 .chapitre-content-cont{
    position:relative; float:left; width:50%; height:auto;
    text-align:left; padding-left:5%;
}




#animation-chapitre2{
    position: relative;
    width:100%;
    margin:-50vh auto 0 auto;
    height:400vh;
    overflow: hidden;
    z-index:460;
}
#animation-chapitre2-canvas-cont{
    opacity:0;
}

#chapitre2-intro-cont{
    position:absolute; top:0; right:10%;
    max-width:900px;
    width:80%;
    height:100vh;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    column-gap:50px;
    word-break: break-word;
}
#chapitre2-intro{
    opacity:0;
    color:#1E1E1E;
    /*mix-blend-mode: multiply;*/
    /*text-shadow: 0 1px 20px #FFF;*/
    text-shadow: 0 0 15px rgba(255,255,255,0.9);
}


#barre-eap-2-1 {opacity:0;}
#barre-eap-2-1 svg{}
#barre-eap-2-1 svg rect, #barre-eap-2-1 svg path{fill:#FFFFFF;}





#chapitre2-content-1{
    margin-top:-60vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    background:#1E1E1E;
    z-index:470;
}

#chapitre2-content-1 .chapitre-content-cont {
    position: initial;
    width:600px;
    max-width:96%;
    text-align:center;
}





#chapitre2-content-2{
    background:#1E1E1E;
    height:300vh;
    z-index:480;
}

#chapitre2-content-2-video{
    position:absolute;
    height:auto; width: 100%;
    top:0; left:0;
}
/*
@media (min-aspect-ratio: 1920/1080) {
    #chapitre2-content-2-video {
        width: 100%;
        height: auto;
    }
}
*/


#chapitre2-content-2-cont{
    position:absolute; top:0; left:15%;
    max-width:550px;
    width:80%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
}





#animation-chapitre3{
    position: relative;
    width:100%;
    margin:-100vh auto 0 auto;
    height:400vh;
    overflow: hidden;
    z-index:490;
}
#animation-chapitre3-canvas-cont{
    opacity:0;
}

#chapitre3-intro-cont{
    position:absolute; top:0; right:10%;
    max-width:900px;
    width:80%;
    height:100vh;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    column-gap:50px;
    row-gap:50px;
}
#chapitre3-intro{
    opacity:0;
    text-shadow: 0 1px 20px #000;
}

#barre-eap-3-1 {opacity:0;}
#barre-eap-3-1 svg {}
#barre-eap-3-1 svg rect, #barre-eap-3-1 svg path{fill:#FFFFFF;}





#chapitre3-content-1{
    margin-top:-50vh;
    height:auto;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    z-index:500;
}
#chapitre3-content-1 .chapitre-content-cont{
    position:initial;
    max-width:610px;
    width:96%;
    text-align:center;
}

#chapitre3-content-1-images{
    margin:50px 10% 0 10%;
    position:relative;
    width:80%; height:auto;
}
#chapitre3-content-1-images img{
    position:absolute; top:0; left:0; width:100%; height:auto; opacity: 0;
}
#chapitre3-content-1-images img:nth-child(1){
    position: relative;
}




#chapitre3-content-2{
    height:100vh;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: stretch;
    align-items: center;
    column-gap:100px;
    row-gap:100px;
    padding: 0 10%;
}
#chapitre3-content-2 .chapitre-content-cont{
    position:relative;
    max-width:610px;
    width:96%;
    text-align:left;
}

#chapitre3-content-2-images{
    position:relative;
    aspect-ratio:1/1;
    border-radius:50%;
    max-width:600px;
    width:96%;
    overflow:hidden;
}
#chapitre3-content-2-images img{
    height:100%; width:auto;max-width:initial;
}


#barre-eap-performance{position:absolute; top:10%; right:10%; width:32%;}
#barre-eap-performance svg {width:100%; height:auto;}
#barre-eap-performance svg rect, #barre-eap-performance svg path{fill:#609578;}

#animation-chapitre2 .exergue, #chapitre2-content-1 .exergue, #chapitre2-content-2 .exergue, #chapitre2-content-3 .exergue{color:#8763b4;}
#animation-chapitre3 .exergue, #chapitre3-content-1 .exergue, #chapitre3-content-2 .exergue, #chapitre3-content-3 .exergue{color:#609578;}



html.darkmysite_dark_mode_enabled #chapitre2-intro *{
    color:#000 !important;
}


@media (min-aspect-ratio: 23/10) {


}
@media screen and (max-height: 750px) {



}


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

}


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

}

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


}

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

    .contenu-chapitre-fin{font-size:2rem;}
    .tete-chapitre-titre{font-size:1.5rem; letter-spacing: 3px;}
    .tete-chapitre-sstitre{font-size:2.6rem;}

    #intro-texte{font-size:1.5em;}
    .contenu-chapitre-titre{font-size:2rem;}

    #chapitre1-intro-cont{position:absolute; top:0; right:2%; width:96%; column-gap:10px;}
    #chapitre2-intro-cont{position:absolute; top:0; right:2%; width:96%; column-gap:10px;}
    #chapitre3-intro-cont{position:absolute; top:0; right:2%; width:96%; column-gap:10px;}

    #chapitre1-content-3-inner{width:96%; flex-direction: column-reverse; column-gap:0;}
    #chapitre1-content-3-images{width:100%;}
    #chapitre1-content-3 .chapitre-content-cont{width:100%; padding-left:0;}
    #chapitre1-content-3-image-2{visibility: hidden}

    #chapitre2-content-2{height:200vh;}
    #chapitre2-content-2-cont{left:2%; width:96%; justify-content: end; padding-bottom:10vh;}
    #chapitre2-content-2-video{width: 120%; left: -10%;}

    #chapitre3-content-2{
        height:auto;
        flex-direction: column;
        row-gap:20px;
        padding: 10vh 2% 10vh 0;
    }

}



@media screen and (max-width: 750px) {
    #subtitle h2{font-size:3rem;}
}



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

}