
@import url('https://fonts.googleapis.com/css?family=Open Sans:400,600,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700');

body {  
    background-color: #fff; /* #00407b; */
    margin: 0px;
    padding: 0px;
    font:400 14px 'Open Sans',Arial, sans-serif;
    color: #000;
    border-top:solid 5px #EE1E57;
    height:100%;
}

html {
  /* height:100%; */
}

a:hover {
  text-decoration: none;
}

figure { 
  margin: 0;
}

.tilted {
  display:flex;
  align-items:center;
}

/* - - - - - - - - - - - Helpers - - - */
  .box-sizing {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  *, *:after, *:before, .box-sizing {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .DEV {
    position: absolute;
    top:0; left:0;
    z-index:999999;
    padding:15px; margin:0;
    background:#fff;
    font:600 14px 'Open Sans',Arial;
    color:#000;
  }

  .shadow {
    /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
    -webkit-filter: drop-shadow( 0px 0px 5px #000 ); 
            filter: drop-shadow( 0px 0px 5px #000 );
  }


  .transform-center {
    -webkit-transform: translateX(-50%) translateY(-50%) ;
    -moz-transform: translateX(-50%) translateY(-50%) ;
    -ms-transform: translateX(-50%) translateY(-50%) ;
    -o-transform: translateX(-50%) translateY(-50%) ;
    transform: translateX(-50%) translateY(-50%) ;
  }


  .transform-center-bottom {
    -webkit-transform: translateX(-50%) translateY(0%) ;
    -moz-transform: translateX(-50%) translateY(0%) ;
    -ms-transform: translateX(-50%) translateY(0%) ;
    -o-transform: translateX(-50%) translateY(0%) ;
    transform: translateX(-50%) translateY(0%) ;
  }

  .transform-right {
    -webkit-transform: translateX(-100%) translateY(-100%) ;
    -moz-transform: translateX(-100%) translateY(-100%) ;
    -ms-transform: translateX(-100%) translateY(-100%) ;
    -o-transform: translateX(-100%) translateY(-100%) ;
    transform: translateX(-100%) translateY(-100%) ;
  }

  .transform-x {
    -webkit-transform: translateX(-50%) translateY(0%) ;
    -moz-transform: translateX(-50%) translateY(0%) ;
    -ms-transform: translateX(-50%) translateY(0%) ;
    -o-transform: translateX(-50%) translateY(0%) ;
    transform: translateX(-50%) translateY(0%) ;
  }

  .transform-y {
    -webkit-transform: translateX(0%) translateY(-50%) ;
    -moz-transform: translateX(0%) translateY(-50%) ;
    -ms-transform: translateX(0%) translateY(-50%) ;
    -o-transform: translateX(0%) translateY(-50%) ;
    transform: translateX(0%) translateY(-50%) ;
  }

  .clear { clear:both; }
  .img-100pcnt { width:100%; max-width:300px; height:auto; }
  .image-width100 { width:100% !important; height:auto; }


/* - - - - - - - - - - - Bootstrap 4 - - - */

.modal-full {
    min-width: 80%;
    margin: 40px auto 25px auto;
}


.modal-bt-fermer {
  display:inline-block;
  position: absolute;
  top:0px; right:-50px;
  z-index:100;
  width:50px; height:50px;
  cursor : pointer;
}

#myModal1 { padding-right:0px !important; z-index:9999 !important; }


.btn-icon { color: #ec1b4d; background-color: #fff; border-color: #fff; }
.btn-icon:hover { border:#C6153F solid 1px; }

.img-lien { position: relative; }
.img-lien img { height: auto !important; }

.img-lien-loupe {
  width:30px; height:auto;
  position: absolute;
  top:0px;right:0px;
  z-index: 10;
}



/* - - Accueil menuburger carré */
.accueil-mb { 
  display:inline-block;
  position: absolute; top: 0px; right: -300px; z-index:9995; 
  padding:5px 0px 0px 0px;         
  cursor: pointer;
  background:transparent; color:#ec1b4d;
}
.accueil-mb:hover .icon-menu-svg > g.icon-menu-support > path { fill:#850f2b !important; }

/*
.accueil-mb-tiret  { width: 40px; height: 4px; margin: 6px 0; background-color: #ec1b4d; } 
.accueil-mb-titre { font: 700 13px 'Open Sans',Arial,sans-serif; color:#ec1b4d; }
.accueil-mb:hover { background:#ec1b4d !important; }
.accueil-mb:hover .accueil-mb-titre { color:white; }
.accueil-mb:hover .accueil-mb-tiret { background-color:white; }
*/


/* - - Accueil telecharger */
.accueil-telecharger { 
  display:inline-block;
  position: absolute; top: 0px; right: -300px; z-index:9990; 
  padding:5px 0px 0px 0px;         
  cursor: pointer;
  background:transparent; color:#ec1b4d;
}
.accueil-telecharger:hover .icon-menu-svg > g.icon-menu-support > path { fill:#850f2b !important; }


/* - - Accueil telecharger Mobile */
.accueil-telecharger-mobile { 
  display:none;
  position: fixed; top: 0px; right: 0px; z-index:9990; 
  width:100%; height:auto;
  text-align: center;
  padding:5px;         
  cursor: pointer;
  background:#ec1b4d; color:#fff;
}



/* - - - - - - - - - -  *\
|*  MENU liste           
\* - - - - - - - - - -  */
.menu-liste {
  position: absolute; z-index:9999; top:0; right:-460px; display:none;
  width:380px; height:100vh;
  padding:25px 0px;
  background-color:#ec1b4d; 
  transition: all 0.25s;
}
.menu-liste ul { list-style: none; } 

.menu-liste .container-fluid { max-width:1400px; }
.menu-liste .menu-liste-col { padding:0px 30px !important; }
.menu-liste-col ul { padding:0px !important; }

.menu-liste .menu-liste-btn-fermer {
    font: 400 16px 'Open Sans',Arial,sans-serif;
    color: white; margin:15px 0px;
    cursor:pointer;
}
.menu-liste .menu-liste-btn-fermer img { width:30px; height:auto; position:relative; top:-3px; }

.menu-liste .menu-chapitre {
  display: inline-block;
  font: 700 23px 'Open Sans',Arial,sans-serif;
  background:#ec1b4d; color: white; 
  margin:10px 0px; padding: 5px 10px;
  text-decoration: none;
  border-radius:5px;
}
.menu-liste  .menu-chapitre:hover { background:#530a1b; }

.icon-menu-fermer { 
  position:relative; top:5px;
  width:20px; height:20px; 
}
.icon-menu-fermer > g > path { fill:white !important; }

.menu-chapitre {
  width:auto; height:auto;
  padding:0px; margin:5px 0;
  cursor: pointer;
  background-size: 35px;
  background-repeat: no-repeat; 
  background-position: 0px 50%;
} 
.menu-chapitre-texte {
  display: inline-block;
  width:auto;
  padding:5px 10px; margin:0;
  background-color: transparent;
  font:700 14px 'Open Sans',Arial;
  color:#fff;
  letter-spacing: 0.15em;
  line-height: 1em;
  text-transform: uppercase;
}
.menu-chapitre-texte span { font:400 12px 'Open Sans',Arial; color:#fff; }
.menu-chapitre:hover .menu-chapitre-texte,
.menu-chapitre:hover .menu-chapitre-texte span  {
  background-color: #530a1b;
  color:#fff;
} 



/* - - - - - - - - - -  *\
|*  Telecharger liste           
\* - - - - - - - - - -  */
.telecharger-liste {
  position: absolute; z-index:9999; top:0; right:-460px; display:none;
  width:380px; height:100vh;
  padding:25px 0px;
  background-color:#ec1b4d; 
  transition: all 0.25s;
}
.telecharger-liste ul { list-style: none; } 

.telecharger-liste .container-fluid { max-width:1400px; }
.telecharger-liste .telecharger-liste-col { padding:0px 30px !important; }

.telecharger-liste .telecharger-btn-fermer {
    font: 400 16px 'Open Sans',Arial,sans-serif;
    color: white; margin:15px 0px;
    cursor:pointer;
}
.telecharger-liste .telecharger-btn-fermer img { width:30px; height:auto; position:relative; top:-3px; }

.telecharger-liste .telecharger-chapitre {
  display: inline-block;
  font: 700 23px 'Open Sans',Arial,sans-serif;
  background:#ec1b4d; color: white; 
  margin:10px 0px; padding: 5px 10px;
  text-decoration: none;
  border-radius:5px;
}
.telecharger-liste .menu-chapitre:hover { background:#530a1b; }

.icon-telecharger-fermer { 
  position:relative; top:5px;
  width:20px; height:20px; 
}
.icon-telecharger-fermer > g > path { fill:white !important; }

.ul-telecharger


.ul-telecharger li {
  width:auto; height:auto;
  padding:0px; margin:0;
  cursor: pointer;
  background-size: 35px;
  background-repeat: no-repeat; 
  background-position: 0px 50%;
} 
.ul-telecharger li a {
  display: inline-block;
  width:auto;
  padding:15px 10px; margin:5px 0;
  background-color: transparent;
  font:700 14px 'Open Sans',Arial;
  color:#fff;
  letter-spacing: 0.15em;
  line-height: 1em;  text-transform: uppercase;
  border-radius:5px;
}
.ul-telecharger li a:hover {
  background-color: #530a1b;
  color:#fff;
} 

/* - - - - - - - - - - - Grille Element - - - */
  .grille-container {
    width:100%; height:100%;
    background: transparent;
    position: absolute;
    z-index:100;
    top:0; left:0;
  }

  .grille-element {
    width:50px; height:50px;
    background: transparent;
    position: absolute;
    top:50%; left:50%;

    background-image: url(../svg/croix.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    
  }

  .grille-hexagone-1 {
    width:250px; height:auto;
    background: transparent;
    position: absolute;
    top:50%; left:50%;
  }

  .grille-hexagone-2 {
    width:160px; height:auto;
    background: transparent;
    position: absolute;
    top:50%; left:50%;
  }


  .grille-hexagone-detail {
    width:100px; height:auto;
    background: transparent;
    position: absolute;
    top:18%; left:85%;
    opacity:0.5;
  }


/* - - - - - - - - - - - - - - - - FULLPAGE */

  #fp-nav ul li a span, .fp-slidesNav ul li a span {
    background: #fff !important;      
  }

  #section0 {
    background-color: #ffffff;
    /* background-image: url(../img/background-00.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed; */
  }

  #section1 {
    background-image: url(../img/section1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section2 {
    background-image: url(../img/section2.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section3 {
    background-image: url(../img/section3.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section4 {
    background-image: url(../img/section4.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section5 {
    background-image: url(../img/section5.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section6 {
    background-image: url(../img/section6.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }


  #section7 {
    background-image: url(../img/section7.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }

  #section8 {
    background-image: url(../img/section8.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
  }



/* - - - - - - - - - - - - - - - - LOGO + RA2017 + Telecharger */
  .logo-container {
    display: inline-block;
    position: absolute;
    bottom:0%; left:100%;
    z-index: 1040;

    width:90%; max-width:250px; height:auto;
    text-align:right;
    padding:0px;

    background-color: transparent;

    -webkit-transform: translateX(-100%) translateY(0%) ;
    -moz-transform: translateX(-100%) translateY(0%) ;
    -ms-transform: translateX(-100%) translateY(0%) ;
    -o-transform: translateX(-100%) translateY(0%) ;
    transform: translateX(-100%) translateY(0%) ;
  } 
  .btn-accueil-retour {
    cursor: pointer;
  }
  .ra2017-container {
    display: inline-block;
    position: absolute;
    top:30px; left:30px;
    z-index: 1000;

    width:123px; height:auto;
    text-align:right;
    padding:0px;
    background-color: transparent;
    cursor: pointer;
  } 
   

/* - - - - - - - - - - - - - - - - DECOR */
  #decor-gauche {
    opacity:0.5;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: 50%;
    left: 0%;
    width: auto; height: auto;
  }


  #decor-droite {
    opacity:0.5;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: 0%;
    left: 100%;
    width: auto; height: auto;
  }

  #motif-milieu-droit {
    opacity:0.25;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: 0%;
    left: 95%;
    width: 190px; height: auto;
  }

  #motif-plein-milieu {
    opacity:0;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: -50%;
    left: 50%;
    
    width : 720px; 
    height: auto; 

  }


  #motif-plein-milieu-blanc  {
    opacity:0;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: 49%;
    left: 50%;
    
    width: 700px;
    height: auto;
  }

  #staticImg{
    opacity:0.5;
    display: inline-block;
    position: absolute;
    z-index: 900;
    top: 50%;
    left: 50%;
    width: auto; height: auto;

    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;

    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
  }
  #staticImg.moveDown{
    -webkit-transform: translate3d(0, 100%, 0);
        -ms-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
  }
  #staticImg.moveUp{
    -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
  }
  #staticImg.moveDown .imgsContainer{ top: 50%; }
  #staticImg.moveDown img{ top: 155px; }
  #staticImg.active .imgsContainer{ top: 50%; }
  #staticImg.active img{ top: 487px; }
  
  /* - - - - - - - - - - - - - GSAP ACCUEIL */
  .text {
    display: inline-block;
    font-size: 25px;
    line-height: 1.205;
  }

  .text__first, .text__second, .text__third, .text__fourth {
    position: relative;
  }

  .text__first, .text__second {
    font-size: 40px;
  }

  .text__word {
    opacity: 0;
  }

  .text__first-bg, .text__second-bg, .text__third-bg, .text__fourth-bg {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
    transform-origin: left;
    transform: scaleX(0);
    background-color: #ee1e57; 
  }

  /* - - - - - - - - - - - - - GSAP CHAPITRE TITRE */
  .Chapitre-GSAP-Text {
    display: inline-block;
    font-size: 3vmin;
    line-height: 1.3em;
    text-align: center;
  }

  .Chapitre-GSAP-Text-1 {
    position: relative; 
  }
  
  .Chapitre-GSAP-Text-2 { 
    position: relative; 
  }

  .Chapitre-GSAP-Titre-Petit {
    font-family: 'Open Sans', Arial;
    font-size: 25px;
    font-weight:400;
    text-transform: uppercase;
  }

  .Chapitre-GSAP-Titre-Grand {
    font-family: 'Open Sans', Arial;
    font-size: 40px;
    font-weight:700;
    text-transform: uppercase;
  }
  
  .Chapitre-GSAP-Text-1 span.Chapitre-GSAP-Titre {
    position: relative; 
    
  }

  .Chapitre-GSAP-Text-2 span.Chapitre-GSAP-Titre {
    position: relative; 
  }

  .Chapitre-GSAP-Word {
    opacity: 0;
  }

  .Chapitre-GSAP-Back-1, .Chapitre-GSAP-Back-2 {
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      z-index: 100;
      transform-origin: left;
      transform: scaleX(0);
    background-color: #ee1e57; 
  }


  .Chapitre-contenu-Liste {
    display:inline-block;
    width:auto; height:auto;

    padding:10px 0 0 0;
    margin:0 auto;
    text-align:left;
    font:600 16px 'Open Sans',Arial;

  }

  .Chapitre-contenu-Liste hr {
    width:50%; height: 1px;
    margin:0 auto 20px auto;
    border: 0; 
    background: #fff;
    background: rgba(255,255,255,0.5);
  }

  .Chapitre-contenu-Liste ul{
    padding:0 25px; margin:0 25px;
    list-style: none;
    list-style-image: url("../img/liste-puce.png");
  }

  .Chapitre-contenu-Liste ul li {
    margin:10px 0;
  }

  .Chapitre-contenu-Liste ul li a {
    margin:0; padding:0;
  }

  
  /* - - - - - - - - - - - - - - - - Sections -> Chapitres * titre */
  .hexagone-chapitres-container {
    display: inline-block;
    position:absolute;
    z-index:1000;
    
    width:auto; height: auto;
    margin:0; padding:15px;
    cursor: pointer;
    overflow:hidden;
  }

  .hexagone-chapitres-container:hover .hexagone-chapitres-titre {
    background:#EE1E57; 
  }

/*
  .hexagone-chapitres-container:hover .hexagone-chapitres-support {
    width:100%;
  }

  .hexagone-chapitres-lettrine-container {
    position:relative;
    width:35px; height: 35px;
    float:left;  

    background-image: url(../img/hexagone-rouge.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
  }
 */

  .hexagone-chapitres-lettrine {
    display:inline-block;
    position: absolute;
    top:48%; left:50%;
    z-index:10;

    width:auto; height:auto;
    text-align:center;
    font:600 23px 'Open Sans',Arial;
    color:#fff;
  }
  

  .hexagone-chapitres-titre-container {
    position:relative;
    display:block;
    width:250px; height:auto;
    padding:0;
    text-align :left;
    font:400 23px 'Open Sans',Arial,sans-serif;
  }


  .hexagone-chapitres-titre {
    display:inline-block;
    width:auto; height:auto;
    text-align:center;
    font:600 18px 'Open Sans',Arial;
    color:#fff;
    text-transform: uppercase;
    padding:5px;
    border-radius:10px;
  }

  
  .hexagone-chapitres-support{
    position: absolute;
    background:#EE1E57;
    width:0%; height:50px;
    margin:0 0 0 20px;

    -webkit-transition: width 0.5s; /* Safari */
    transition: width 0.5s;
  }





.ls-fullscreen-wrapper {
  width: 100% !important; height:100vh !important; 
}



/* - - - - - - - - - - - - - - - - ACCUEIL */
  .accueil-accroche-container {
    display: none;
    position: absolute;
    top:50%; left:50%;
    z-index:1000;
    width:80%; max-width:850px; height:auto;
    background-color: transparent;
  }

 
  .accueil-accroche-contenu {
    display: inline-block;
    position: absolute;
    top:50%; left:50%;
    
    width:90%; height:auto;
    text-align:center;
    font:400 200% 'Open Sans', Arial;
    color:#fff;
    letter-spacing: 0.05em;
    line-height: 1.5em;
  } 

  .accueil-accroche-contenu h2 {
    font:700 80% 'Open Sans', Arial;
    color:#fff;
    letter-spacing: 0.05em;
    padding:0; margin:0;
  } 


   #perso-accueil {
    opacity:0;
    display: inline-block;
    position: fixed;
    bottom:10%; left:50%;
    z-index:1000;
    width:auto; height:105px;
    text-align:center;
  }


  #perso-2-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:3%; left:35%;
  }
  
  #perso-2-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:3%; left:73%;
  }


  #perso-3-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:5%; left:60%;
  }
  
  #perso-3-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:16%; left:78%;
  }


  #perso-4-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:0%; left:30%;
  }
  
  #perso-4-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:30%; left:94%;
  }

  #perso-5-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:0%; left:30%;
  }
  
  #perso-5-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:0%; left:75%;
  }



  #perso-6-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:-2%; left:46%;
  }
  
  #perso-6-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:-2%; left:54%;
  }


  #perso-7-1 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1001; text-align:center;
    width:auto; height:105px;
    bottom:-2%; left:46%;
  }
  
  #perso-7-2 {
    opacity:1; 
    display: none;position: fixed;
    z-index:1000; text-align:center;
    width:auto; height:105px;
    bottom:-2%; left:54%;
  }


/* - - - - - - - - - - - - - - - - TELECHARGER * GAUCHE */
  .telecharger-container {
    display: inline-block;
    position: absolute;
    top:-120px; /* 223px */
    left:45px;
    z-index:1040;

    background: transparent;
    cursor: pointer;
    width: 100px; height:auto;
  }

  .telecharger-icon {
    width:100px; height:auto;
  }

  .telecharger-icon-background {
    fill:#ee1e57;fill-rule:nonzero;
  }


  .telecharger-icon:hover .menu-icon-background {
    fill:#EE1E57;fill-rule:nonzero;
  }

/*
  .telecharger-liste {
    display: none;
    position: absolute;
    top:35px; left:30px;
    z-index:1100;
    width:auto; 
    height:auto;
  }

  .telecharger-liste ul {
    list-style: none;
  }   
*/

  .telecharger-dropdown {
    display:inline-block; 
    margin: 0px auto;
    width: 50px;
  }
  
  .telecharger-dropdown:hover li {
    padding: 0px;
    height: auto;
    overflow: auto;
    opacity: 1;
  }

  .telecharger-dropdown ul {
    display: inline-block;
    position: relative;
    list-style: none;
    padding: 0 5px;
    margin: -12px 0 0 80px;
    background: #ee1e57;
    background: rgba(238, 30, 87, 0.8);
    width: auto;
  }

  .telecharger-dropdown li {
    padding: 0px;
    background: transparent;
    color: #000;
    text-align: left;
    border: 0px;
    width: 100%;
    height: 0px;
    overflow: hidden;
    cursor: pointer;
    opacity: 0;
    transition-property: all, background-color;
    transition-duration: 0.2s, 0.4s;
  }


  .telecharger-dropdown li a {
    color:#fff;
    font:600 14px 'Open Sans',Arial;
    text-decoration: none;
  }


  .telecharger-dropdown li:hover,
  .telecharger-dropdown li.selected {
    background-color: transparent;
  }

  .telecharger-dropdown li:last-child {
    border-radius: 0px;
  }
  

  .telecharger-dropdown li:nth-child(1) { transition-delay: 0s, 0s; }
  .telecharger-dropdown li:nth-child(2) { transition-delay: 0.1s, 0s; }
  .telecharger-dropdown li:nth-child(3) { transition-delay: 0.2s, 0s; }
  .telecharger-dropdown li:nth-child(4) { transition-delay: 0.3s, 0s; }
  .telecharger-dropdown li:nth-child(5) { transition-delay: 0.4s, 0s; }
  .telecharger-dropdown li:nth-child(6) { transition-delay: 0.5s, 0s; }
  
/*
  .telecharger-fichier {
    width:auto; height:auto;
    padding:0px; margin:5px 0;
    cursor: pointer;
 
    background-size: 35px;
    background-repeat: no-repeat; 
    background-position: 0px 50%;
  } 

  .telecharger-fichier:hover {
    background-color: #EE1E57;
    color:#fff;
  } 
*/
/* - - - - - - - - - - - - - - - - MENU * RESPONSIVE MOBILE */

.logo-container-haut-droit {
  display: none;
  position: absolute; z-index: 1040; top:5px; left:50%;
  width:100px; height:auto;
  text-align:right;
  padding:0px;
  background-color: transparent;
} 


#menu-mobile {
  display: none;
  position: absolute; z-index:1040; top:-200px; right:10px;
  width:80px; height:auto;
  background: transparent;
  cursor: pointer;
}

li.menu-mobile-titre {
  font:700 23px 'Montserrat',sans-serif;
  color:#00407B;
  text-align:center;
  margin:1px 0;
}
li.menu-mobile-titre hr {
  width:25%; height: 1px;
  margin:10px auto 10px auto;
  border: 0; 
  background: #00407B;
}

ul.menu-mobile {
  display:none; width:80%;
  position: absolute; z-index:1000; top:105px; left:50%;  
  list-style: none;
  text-align:center;
  margin:0;padding:0;
}
ul.menu-mobile li {  width:100%; padding:0px; }
.menu-mobile-chapitre {
  width:auto; height:auto;
  padding:0px; margin:0;
  cursor: pointer;
  background-size: 35px;
  background-repeat: no-repeat; 
  background-position: 0px 50%;
} 
.menu-mobile-chapitre-texte {
  width:auto;
  padding:10px; margin:0;
  background-color: transparent;
  font:700 12px 'Open Sans',Arial;
  color:#EE1E57;
  letter-spacing: 0.15em;
  line-height: 1em;
  text-transform: uppercase;
}
.menu-mobile-chapitre-texte span {
  font:400 10px 'Open Sans',Arial;
  color:#EE1E57;
}
.menu-mobile-chapitre:hover .menu-mobile-chapitre-texte,
.menu-mobile-chapitre:hover .menu-mobile-chapitre-texte span  {
  background-color: #EE1E57;
  color:#fff;
} 


.wrapper-mobile {
  display:none;
  position: relative; z-index:999; top:10px; left:0px;
  width:100%; height:auto; min-height:100vh;
  /*overflow: hidden;*/
  background-color: rgba(255,255,255,0.5);
}

.wrapper-mobile-loader {
  text-align: center;
  font:700 14px 'Montserrat',sans-serif;
}


/* - - - - - - - - - - - - - - - - MENU * GAUCHE */
  #menu {
    display: inline-block;
    position: absolute;
    top:217px; left:-100px;
    z-index:1040;
    background: transparent;
    cursor: pointer;
  }

  .menu-icon {
    width:50px; height:auto;
  }

  .menu-icon-background {
    fill:#ee1e57;fill-rule:nonzero;
  }


  .menu-icon:hover .menu-icon-background {
    fill:#EE1E57;fill-rule:nonzero;
  }

/*
  .menu-liste {
    display: none;
    position: absolute;
    top:35px; left:30px;
    z-index:1100;
    width:auto; 
    height:auto;
  }

  .menu-liste ul {
    list-style: none;
  }   
*/

  .dropdown {
    display:inline-block; 
    margin: 0px auto;
    width: 50px;
  }
  
  .dropdown:hover li {
    padding: 0px;
    height: auto;
    overflow: auto;
    opacity: 1;
  }

  .dropdown ul {
    display: inline-block;
    position: relative;
    list-style: none;
    padding: 0 5px;
    margin: -12px 0 0 80px;
    background: #ee1e57;
    background: rgba(238, 30, 87, 0.8);
    width: auto;
  }

  .dropdown li {
    padding: 0px;
    background: transparent;
    color: #000;
    text-align: left;
    border: 0px;
    width: 100%;
    height: 0px;
    overflow: hidden;
    cursor: pointer;
    opacity: 0;
    transition-property: all, background-color;
    transition-duration: 0.2s, 0.4s;
  }


  .dropdown li:hover,
  .dropdown li.selected {
    background-color: transparent;
  }

  .dropdown li:last-child {
    border-radius: 0px;
  }
  

  .dropdown li:nth-child(1) { transition-delay: 0s, 0s; }
  .dropdown li:nth-child(2) { transition-delay: 0.1s, 0s; }
  .dropdown li:nth-child(3) { transition-delay: 0.2s, 0s; }
  .dropdown li:nth-child(4) { transition-delay: 0.3s, 0s; }
  .dropdown li:nth-child(5) { transition-delay: 0.4s, 0s; }
  .dropdown li:nth-child(6) { transition-delay: 0.5s, 0s; }

  

/* - - - - - - - - - - - - - - - - MENU Chapitre */
.menu-chapitre-hexagone-image {
  opacity:1;
}

.menu-chapitre-hexagone {
   display: block;
   width:100px; height:auto;
   padding:0px; margin:0 auto;
   background-color: transparent;
 }
 
 .menu-chapitre-hexagone-decor {
   display: inline-block;
   width:50px; height:auto;
   padding:0px; margin:0 auto;
   background-color: transparent;
   position: absolute;
   top:80%; left:75%;
   z-index:2000;
 }

/*   
.accueil-menu-chapitre-container {
  display: inline-block;
  position: absolute;
  top:50%; left:50%;
  z-index: 1000;

  width:100px; height:100px;
  padding:0px;
  background-color: transparent;

  border:solid 1px #000;
}
*/

  .accueil-menu-chapitre {
    display: inline-block;
    position: absolute;
    z-index: 1100;
    width:200px; height:210px;
    padding:0px;

    background-color: transparent;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center; 

    cursor: pointer;
  }

  .accueil-menu-chapitre-texte {
    display: inline-block;
    position: absolute;
    top: 50%; left: 50%;
    z-index: 1000;

    width: 100%; max-width: 160px;
    height: auto;
    padding: 0px; margin: 0;
    
    font: 700 14px 'Open Sans',Arial;
    background-color: transparent;
    color:#fff;
    
    letter-spacing: 0.05em;
    line-height: 1.25em;
    text-transform: uppercase;
  }

  .accueil-menu-chapitre-texte span {
    font:400 12px 'Open Sans',Arial;
    background-color: transparent;
    color:#fff;
  }

  .accueil-menu-chapitre:hover .menu-chapitre-hexagone-image {
    opacity:1;
  } 

  .accueil-menu-chapitre:hover .menu-chapitre-texte,
  .accueil-menu-chapitre:hover .menu-chapitre-texte span {
   /*  background-color: #EE1E57; */
    color:#fff;
    border-radius: 10px;
  }


  
 

/* - - - - - - - - - - - - - - - - CONTENU Chapitre */

  .Chapitre-Background {
    position: absolute;
    top:0; left:0;
    z-index:50;
    
    width:100%; height:100vh;

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;

    opacity: 0.25;
  }

  .Chapitre-Titre-container {
    display: block;
    position: absolute;
    top:50%; left:50%;
    z-index:1000;
    width:900px; height:auto;
    background-color: transparent;
  }
  
  .Chapitre-Titre-contenu {
    display: inline-block;
    position: absolute;
    top:50%; left:50%;

    width:80%; max-width:600px; height:auto;
    text-align:center;
    font:400 18px 'Open Sans', Arial;
    color:#fff;
    letter-spacing: 0.05em;
    line-height: 1.5em;
  }  

  .Chapitre-Resume-container {
    display: inline-block;
    position: absolute;
    top:32%; left:50%;
    z-index:1000;
    width:auto; height:auto;
    background-color: transparent;

    font:400 16px 'Open Sans', Arial;
    color:#fff;
    text-align: justify;

    text-align:center;
  }
  

  #icon-plus {
    display: none;
    position: absolute;
    top:74%; left:50%;
    z-index:999;

    width:auto; height:auto;
    text-align:center;

    cursor: pointer;
  }




 /* - - - - - - - - - - - Button */
.btn-shlmr {
  background-color: transparent;
  border: none;
  color: #000;
  cursor: pointer;
  display: inline-block;
  font-family: 'Open Sans', Arial, sans-serif;

  font-size: 14px;
  line-height: 1em;

  margin: 0px 5px;
  outline: none;
  padding: 0px;
  
  position: relative;
  /*text-transform: uppercase;*/
  font-weight: 700;
}
.btn-shlmr:before,
.btn-shlmr:after {
  border-color: transparent;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
  border-style: solid;
  border-width: 0;
  content: "";
  height: 10px;
  position: absolute;
  width: 0px;
}
.btn-shlmr:before {
  border-color: #000;
  border-right-width: 0px;
  border-top-width: 0px;
  right: 0px;
  top: 0px;
}
.btn-shlmr:after {
  border-bottom-width: 1px;
  border-color: #000;
  border-left-width: 0px;
  bottom: -5px;
  left: 0px;
}
.btn-shlmr:hover,
.btn-shlmr.hover {
  background-color: transparent;
  color:#000;
}
.btn-shlmr:hover:before,
.btn-shlmr.hover:before,
.btn-shlmr:hover:after,
.btn-shlmr.hover:after {
  height: 100%;
  width: 100%;
}





 /* - - - - - - - - - - - Scroll Bouton animation */
.chevron-container {
  opacity:0;
  position: absolute;
  display: inline-block;
  bottom:30px; left:50%;
  z-index:1045;
  justify-content: center;
  align-items: center;
  width: 35px; height: 60px;
  margin: 0 0 0 -17px ;
}

.chevron {
  width: 30px;
  height: 8px;
  opacity: 0;
  -webkit-transform: scale(0.3);
          transform: scale(0.3);
  -webkit-animation: move-chevron 3s ease-out infinite;
          animation: move-chevron 3s ease-out infinite;
}

.chevron:first-child {
  -webkit-animation: move-chevron 3s ease-out 1s infinite;
          animation: move-chevron 3s ease-out 1s infinite;
}

.chevron:nth-child(2) {
  -webkit-animation: move-chevron 3s ease-out 2s infinite;
          animation: move-chevron 3s ease-out 2s infinite;
}

.chevron:before,
.chevron:after {
  content: '';
  position: absolute;
  top: 0;
  height: 100%;
  width: 50%;
  background: #EC1B4D;
}

.chevron:before {
  left: 0;
  -webkit-transform: skewY(30deg);
          transform: skewY(30deg);
}

.chevron:after {
  right: 0;
  width: 50%;
  -webkit-transform: skewY(-30deg);
          transform: skewY(-30deg);
}

@-webkit-keyframes move-chevron {
  25% {
    opacity: 1;
  }
  33.3% {
    opacity: 1;
    -webkit-transform: translateY(2.28rem);
            transform: translateY(2.28rem);
  }
  66.6% {
    opacity: 1;
    -webkit-transform: translateY(3.12rem);
            transform: translateY(3.12rem);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(4.8rem) scale(0.5);
            transform: translateY(4.8rem) scale(0.5);
  }
}

@keyframes move-chevron {
  25% {
    opacity: 1;
  }
  33.3% {
    opacity: 1;
    -webkit-transform: translateY(2.28rem);
            transform: translateY(2.28rem);
  }
  66.6% {
    opacity: 1;
    -webkit-transform: translateY(3.12rem);
            transform: translateY(3.12rem);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(4.8rem) scale(0.5);
            transform: translateY(4.8rem) scale(0.5);
  }
}

 /* - - - - - - - - - - - Footer - - - */

  footer {
    /* display: inline-block; */
    width:100%;
    height:auto;
    
    position: fixed;
    z-index:1040;
    bottom:25px; left:0px;
    text-align: center;

    background:transparent;
    /*background:rgba(255,255,255,0.5);*/
    padding: 10px 0;


  }

  
  .footer-gauche {
    position: absolute;
    top:0; left:30px;
    color:#000;

  }

  .footer-droite {
    position: absolute;
    top:0; right:0;
    
  }

  .footer-icon {
    display: inline-block;
    width:16px; height:auto;
    margin:0 5px;

  }


/* - - - - - - - - - - - - - - - - - - - - - - - */
/* - - - - - - - - - - - -  Media Queries - - -  */
/* - - - - - - - - - - - - - - - - - - - - - - - */

@media only screen and (max-width: 768px) { 
	.modal-content { width:100% !important; }
}


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

    body, html { overflow: visible !important; }
    /* Mobile */
    #menu-mobile { display:inline-block; }
    ul.menu-mobile { display:inline-block; }
    .wrapper-mobile { display:inline-block; }

    .modal-bt-fermer { right:-20px; }
    .btn-imprimer { top:-100px !important; }

    #motif-plein-milieu { display:none; }
    #fullpage { display:none; }

    .accueil-mb { display:none; }
    .accueil-telecharger { display:none; }
    .accueil-telecharger-mobile { display:block; }

    .logo-container-haut-droit { display: inline-block; top:40px; }
    .ra2017-container { width:80px; height:auto; top:30px; left:5px; }
    .logo-container { display: none; }

    footer { bottom:5px; }
    .footer-gauche { width:100%; left:0; }

}




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

    #motif-plein-milieu { width:600px; }
    .accueil-accroche-contenu p { line-height:1.2em; }

    .text__first .text__word,
    .text__second .text__word {
      font-size:80% !important;
    }

    .text__third .text__word,
    .text__fourth .text__word {
      font-size:70% !important;
    }

    .els-container,
    .accueil-menu-chapitre  { width:160px; height:170px; }
    .accueil-menu-chapitre-texte { width:150px; }

    .menu-chapitre-hexagone { width:100px; }
      
    .chevron-container{ display:none; }

}

