/**
* TOOLS
*/
.center{
    text-align: center;
}

.italic{
    font-style: italic;
}

.scroll_top{
    cursor:pointer;   
}

.left{
    float: left;
}

.right{
    float: right;
}

.none{
    display: none;     
}

.inline_block{
    display: inline-block !important;
}

.block{
    display: block;     
}

.html_text strong{
    font-weight: bold;
}

.html_text em{
    font-style: italic;
}

.html_text u{
    text-decoration: underline;
}

b{
    font-weight: bold;
}

.error,
.error > .messageContent{
  color: red;
  font-weight: bold;
}

.error > .messageContent a,
.success > .messageContent a{
    color: inherit;
}

.success,
.success > .messageContent{
  color: green;
  font-weight: bold;
}

.rounded_picture{
    overflow:hidden;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}

/* PARAMETRES GENERAUX SLIDER */


.bx-wrapper .bx-prev {
  background: url(../../resources/pictures/themes/icons/arrow_left.png) no-repeat;
}
.bx-wrapper .bx-next {
  background: url(../../resources/pictures/themes/icons/arrow_right.png) no-repeat;
}
.bx-wrapper .bx-next:hover {
  background-position: 0% 0%; 
}

.bx-wrapper .bx-viewport {
  -moz-box-shadow: none;
  -webkit-box-shadow: none; 
   box-shadow: none;
   border: 0; 
   background: transparent; 

}
.bx-wrapper .bx-controls-direction a {
   z-index: 1;
}  


/**
* TEMPLATE GENERAL
*/
@font-face {
    font-family: 'bebas_neueregular';
    src: url('../resources/font/bebas_neue.eot');
    src: url('../resources/font/bebas_neue.eot?#iefix') format('embedded-opentype'),
         url('../resources/font/bebas_neue.woff2') format('woff2'),
         url('../resources/font/bebas_neue.woff') format('woff'),
         url('../resources/font/bebas_neue.ttf') format('truetype'),
         url('../resources/font/bebas_neue.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
  font-family: 'raleway';
  font-style: normal;
  /*font-weight: 400;*/
  font-weight: normal;
  src: url('../resources/font/raleway.eot');
  src: url('../resources/font/raleway.eot?#iefix') format('embedded-opentype'),
       url('../resources/font/raleway.woff2') format('woff2'),
       url('../resources/font/raleway.woff') format('woff'),
       url('../resources/font/raleway.ttf') format('truetype'),
       url('../resources/font/raleway.svg#ralewayregular') format('svg');
}
html, body {
    height: 100%;
    -webkit-text-size-adjust : none;
    -ms-text-size-adjust : none;
}
html {font-size: 100%; font-family: 'raleway';}
body { 
    background-image: url('../resources/pictures/themes/background.png');
    background-repeat: no-repeat;
    background-attachment: fixed !important;
    background-size: 100%;
    background-size: cover !important;
    
    /*font-size: .8em;*/
    font-size: 1em;
}

/*
* BLOCKS FLOTTANT
*/
#alert_integrity{
      /*background-color: #e53325;*/
      background-color: transparent;
      position: fixed;
      margin-top: 50px;
      color: white;
      padding: 15px;
      right: 0;
      z-index : 11;
      cursor : pointer;
      font-size: 1.2em;
      display: block;
      text-decoration: inherit;
}

.require_manual{
    font-size: 1.8em;
    vertical-align: initial;
    
}

#alert_integrity img,
#alert_integrity span
{
    /*display: inline-block;*/
    display: block;
    margin: auto;
}

#alert_integrity span
{
     color: white;
     text-decoration: none;
     text-align: center;
     vertical-align: super;
     text-transform: uppercase;
}

#alert-integrity-dialog h1{
     margin-bottom: 20px;
     font-weight: bold;
     font-size: 1.8em;
     color: #e53325;
     text-transform: uppercase;
     font-family: bebas_neueregular;
     letter-spacing: 2px;
     margin-top: 10px;
     text-align: center;
}

#alert-integrity-dialog #container_confirm{
    margin-top: 10px;
}

#alert-integrity-dialog #confirm{
    width: auto !important;
    vertical-align: top;
    margin-right: 10px;
}

#alert-integrity-dialog #label_confirm{
    width: 90% !important;
    display: inline-block;
    padding: 0;
    margin: 0;
    font-size: 1em; 
}



/*-----------------------------
//--> POPUP ALERTE INTEGRITE
-------------------------------*/
#alert-integrity-dialog{
   background-color: white; 
   color : black;
   font-size: 1.0em;
   padding: 20px 30px;
   text-align: left;
   max-width: 600px;
   margin: 40px auto;
   position: relative;
   border: 7px solid #e53325;
}

a.popup-more{
    font-weight: bold;
    color: black
}


#fieldset_alert_integrity input:focus,
#fieldset_alert_integrity textarea:focus
{
    outline-color: #e53325;
}


#fieldset_alert_integrity .important
{
    display: inline-block;
    font-size: 1.8em;
}

#bt_alert_integrity.ajax-popup-link{
    display: initial;
    background-color: red;
    padding: 6px;   
}

form.form_alert_integrity #fieldset_alert_integrity input, 
form.form_alert_integrity #fieldset_alert_integrity textarea, 
form.form_alert_integrity #fieldset_alert_integrity select {
  padding: 10px;
  width : 95% !important;
}

form.form_alert_integrity #fieldset_alert_integrity label {
  display: block;
  width: 100%;
  padding-top: 25px;
  padding-bottom: 10px;
  text-align: left;
  font-size: 1em;
  /* font-weight: bold; */
  /*font-family: bebas_neueregular;*/
  letter-spacing: 2px;
}

form.form_alert_integrity .message.messageBottom {
    margin-top: 15px;
    font-size: 1.5em;
}

form.form_alert_integrity #fieldset_alert_integrity #submit{
  margin-right: 0px;
  background-color: rgb(154,182,46);
  color: rgb(0,25,46);
  border: 0;
  border-bottom: 10px solid rgb(84,112,32);
  padding: 15px;
  width: 30%;
  font-size: 1.0em;
  font-weight: bold;
  margin-top: 40px;
}

form.form_alert_integrity #fieldset_alert_integrity #container_submit {
    margin-bottom: 10px;
}

form #submit{
    cursor: pointer;
}

form.form_alert_integrity #fieldset_alert_integrity #label_anonymous {
  width : auto !important;
  display: inline;
}

form.form_alert_integrity #fieldset_alert_integrity #anonymous {
  width: auto !important;
}

form.form_alert_integrity #fieldset_alert_integrity p {
  padding: 0;
}

form.form_alert_integrity #fieldset_alert_integrity #message {
  width : 95%;
  height: 75px;
}

#more-dialog{
  max-width: 400px;
  background-color: white;
  margin: auto;
  opacity: 1;   
  padding: 25px; 
}

.priorize{
    z-index: 1050;
}

#more-dialog h1{
    font-weight: bold;
    font-size: 1.3em;
    text-align: center;
}

#more-dialog img,
#alert-integrity-dialog img
{
    max-height: 40px;
    margin: auto;
    display: block;
    margin-top: 10px;
}

#more-dialog ul{
    margin-top: 10px;
    font-size: 1.1em;
    list-style-type: square;
    margin-left: 10px;
}

#more-dialog ul li{
    margin-bottom: 15px;
}

#more-dialog ul li:last{
    margin-bottom: 0px;
}

#alert-integrity-dialog > .mfp-close {
  color: #e53325 !important;
}
/*-----------------------------
//--> FIN POPUP ALERTE INTEGRITE
-------------------------------*/
#info_site{
      background-color: #042035;
      position: fixed;
      cursor : pointer;
      color: white;
      padding: 20px;
      left: 2%;
      bottom: 5%;
      font-weight: bold;
      z-index : 11;
      border-radius: 50%;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      text-align: center;
      width: 80px;
      height: 80px;
}

#info_site > img{
     display: block;
     /* margin: auto; */
     /*max-width: 65px;*/
     margin-top:-20px;
     margin-left:-30px;
     max-width: 140px;
}

/* BLOCK FLOTTANT AMBASSADEUR */
#floating_ambassadors
{
    position: fixed;
    max-width: 200px;
    background-color: transparent;
    color: black;
    z-index: 10;
}

#floating_ambassadors,
#floating_ambassadors  a{
    text-decoration: none;
    color : white;   
}

#floating_ambassadors h2{
    color: rgb(188,214,19);
    text-transform: uppercase;
    font-size: 1.9em;
    font-family: "bebas_neueregular";
    margin-bottom: 15px;
    margin-top: 15px;
}


#floating_ambassadors .content_slide > a > .content{
    padding: 5px;
    padding-top: 10px;
}

#floating_ambassadors .bx-wrapper .bx-viewport{
    left : 0;
}

#floating_ambassadors .content_slide >  a > .content > h3{
      color: rgb(188,214,19);
      margin-bottom: 10px;
}

#floating_ambassadors .content_slide > a > .picture{
      width: 150px;
      height: 150px;
      margin: auto;
      border : 5px solid rgb(141,173,28);
      
}

#fixed{
   position: fixed;
   z-index:10;
}

/* CONTIENT L ENSEMBLE DU SITE */
#wrapper {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -70px !important; 
}
#wrapper:after {
  content: ".";
  display: block;
}
footer, #wrapper:after {
  height: 70px; 
}

#wrapper,#fixed{
    
    max-width: 1200px;
    margin: auto;
    width : 90%;
    top: 0px;
}


/* HEADER */
#wrapper header{
    background: rgba(0,25,56, 0.9);  
    height : auto;
    border-bottom: 2px solid rgb(0,25,56);
    padding-bottom: 0.8em;
}


#wrapper header > nav a{
    padding: 0% 2% 0% 2%;
    text-decoration: none;
    color: white;
    font-size: 1.0em;    
    
    position: relative;
}
#lang_en, #lang_es, #lang_fr{
    padding: 2px !important; 
}
#lang_en img, #lang_es img, #lang_fr img{
    padding-top: 5px !important; 
}
/* MENU ENTETE */
#wrapper header > nav{
    text-align: right;
    line-height: 40px;
    margin-left: 1%;
    margin-right: 1%;
    position: relative;
}

#fixed > nav a.highlighted{
    background-color: rgb(188,214,19);
    color : rgb(0,25,56);
}

#wrapper header > nav .logo img{
    max-height: 65px;
    float: left;
    padding-top: 30px;
}


#wrapper header > nav .logo img.logo-handclean{
    max-height: 150px;
    padding: 0;
}

#wrapper header > nav .link{
    position: absolute;
    bottom: 0;
    right: 0;
    min-width: 285px;
}

#wrapper header > nav .link img{
    position: absolute;
    margin: 0 auto;
    bottom: 90%;
    left: 0;
    right: 0;
    max-height: 18px;
}


#wrapper header > nav .logo{
    overflow: hidden;
}
#fixed > nav > #responsive{
      position: relative;
      bottom: 0px;
      height: 30px;
      display: none;
}
/* MENU */



#fixed > nav a.selected,
#fixed > nav a:hover
{
    border-bottom: 5px solid rgb(188,214,19); 
}


#fixed > nav ul li ul li a
{
    border-top: 5px solid transparent; 
    border-bottom: 5px solid transparent; 
}

#fixed > nav  ul li ul li .sub_selected{
    background-color: rgb(188,214,19);
    color: white;  
    /* font-weight: bold; */
}

#fixed > nav ul li ul li a:hover
{
    border-top: 5px solid rgb(188,214,19); 
    border-bottom: 5px solid rgb(188,214,19); 
}

#fixed h1{
    text-align: left;
    font-size: 3.5em;
    color : rgb(188,214,19);
    font-family: "bebas_neueregular";  
    float: left;
    padding-left: 15px;
    margin-top: 45px;
    padding-right: 15px;
}

/** DETECTTION MOBILE BLOCK*/
#download-mobile-apps-ios-dialog,
#download-mobile-apps-android-dialog
{
  height: auto;
  background-color: white;    
  padding:2%;
  overflow: hidden;
}

#download-mobile-apps-ios-dialog span,
#download-mobile-apps-android-dialog span{
  
  text-align: center; 
  color: black;
}



#download-mobile-apps-ios-dialog a,
#download-mobile-apps-android-dialog a{
  text-decoration: none;
  display: block;
}


#download-mobile-apps-ios-dialog .mfp-close,
#download-mobile-apps-android-dialog .mfp-close{
  color: #000000 !important;
  font-size: 3em;
}

#download-mobile-apps-ios-dialog span,
#download-mobile-apps-android-dialog span,
#download-mobile-apps-ios-dialog img,
#download-mobile-apps-android-dialog img{
  
  max-width: 48%;
  vertical-align: middle;
  font-size: 2em;
}



  

#content h1
{
    text-align: center;
    font-size: 4em;
    padding: 25px;
    color : rgb(188,214,19);
    font-family: "bebas_neueregular";
}

/*  
    CONTENT
    BLOCKS - LIENS GENERIQUE CLASSES PREDEFINIES 
*/
/*  
    BLOCK BG BLUE
    -----------------------------------------------
*/
#content div.background_blue{
    background-color: rgba(0,25,56, 0.9);
    color : white;
}

#content div.background_blue h2{
    text-transform: uppercase;
    opacity : 1;
    font-size: 3em;
    font-family: "bebas_neueregular";
    margin-bottom: 25px;
}

#content div.background_blue p{
    
}

/*  
    FIN --> BLOCK BG BLUE
    -----------------------------------------------
*/
/*  
    BLOCK BG WHITE
    -----------------------------------------------
*/
#content div.background_white{
    background-color: rgba(255,255,255, 0.9);
    /*color : rgb(0,25,56);*/
    
    color : black;
}

#content div.background_white h2{
    text-transform: uppercase;
    font-size: 3em;
    font-family: "bebas_neueregular";
    margin-bottom: 25px;
    color : rgb(0,25,56);
}

#content div.background_white .more{
    color : rgb(84,112,32);
    font-weight: bold;
    margin-top: 10px;
    text-decoration: underline;
}
/*  
    FIN --> BLOCK BG WHITE
    -----------------------------------------------
*/
/*  
    LINK BG GREEN
    -----------------------------------------------
*/
#content a.background_green{
      background-color: rgb(154,182,46);
      color: rgb(0,25,46);
      border-bottom: 10px solid rgb(84,112,32);
      padding: 25px;
      width: 40%;
      font-size: 1.4em;
      font-weight: bold;
      
      margin: auto;
      margin-top: 40px;
}
/*  
    FIN --> LINK BG GREEN
    -----------------------------------------------
*/
/*  
    BLOCK CONTENT
    -----------------------------------------------
*/


#content .opacity{
    opacity : 0.8;
}

#content a{
    text-decoration: none;
    display: block;
}

#content span{
    display: block;
}

#content .big_padding{
    padding: 25px;
}

#content .green_title > h2{ 
   color: rgb(188,214,19) !important;   
}

#content .little_padding{
    padding: 20px;
}

#content .margin_top{
    margin-top: 15px;
}

#content div p,
#content div ul li,
.html_text{
    line-height: 20px;
}

/*  
    FIN --> CONTENT
    -----------------------------------------------
*/
/*  
    FOOTER
    -----------------------------------------------
*/
footer{
      /* margin-top: 20px; */
      background-color: white;
      /* height: auto; */
      padding: 20px 0 20px 0;
      max-width: 1200px;
      margin: auto;
      height: 30px;
      text-align: center;
      font-size: 0.8em;
}

footer > p{
      padding: 10px;
      text-align: center;
      
}

footer img{
    max-height: 35px;
    vertical-align: middle;
}

/*  
    FIN --> FOOTER
    -----------------------------------------------
*/
@media screen and (max-width: 1650px) {
    body{
        background-size : auto; 
        font-size: 84%;   
    }
    
    #wrapper, #fixed, footer {
      max-width: 835px;
      margin: auto;
      width: 66%;
    }
    
    #fixed h1 {
      font-size: 2.3em;
      /*float : none;
      display: inline-block;*/
    }
    
    #content .big_padding {
      padding: 2%;
    }
    
    /*#wrapper header > nav .logo {
      text-align: center;
    }*/
    
    #wrapper header > nav .logo a{
      /*position: static;
      text-align: center;
      overflow: hidden;
      display: inline-block;*/
    }
    
    #wrapper header > nav .logo img {
      max-height: 55px;
      /*float: none;*/
      /* display: inline-block; */
    }
    
    #wrapper header > nav .logo img.logo-handclean{
      max-height: 85px;
      padding-top: 5px;
    }
    
    #wrapper header > nav .link {
      /*position: static;
      bottom: auto;
      right: auto;*/
      /* margin: auto; */
      /*text-align: center;*/
    }
        
}

@media screen and (max-width: 1240px) {
    #wrapper header > nav .link {
        position: static;
    }
}

@media screen and (max-width: 1024px) {
    
    body{
        background-size : auto; 
        font-size: 71%;   
    }
        
    #floating_ambassadors {
        max-width: 170px;
    }
    
    #wrapper header > nav .link {
      bottom: -10px;
    }
    
    #fixed h1 {
      font-size: 2.6em;
    }
    
    #alert_integrity > img{
       max-height: 40px;
    }
    
    #wrapper header > nav .logo img{
        max-height: 50px;
        margin-top: 0px;
    }
    
    #info_site{
        left : auto;
        right: 2%;
    }
    
    
}
@media screen and (max-width: 768px) {
    
    #wrapper, #fixed, footer {
      max-width: 835px;
      margin: auto;
      width: 96%;
    }
    
    #wrapper header > nav .logo a {
        display : inline;
    }
        
    #fixed h1 {
      text-align: center;
      font-size: 2em;
      margin-top: 0px; 
    }
    
    
    #content h1 {
      font-size: 2.5em;
    }
    
    #wrapper header > nav {
      text-align: center;
    }   
    
    /*#fixed > nav a{
      display: block;
    }*/
    
    #fixed header > nav .logo img {
      float: none;
      max-width: 22%;
      min-width: auto;
      margin-top: 0px;
      padding-top: 0px;
      
    }
    
    #wrapper header > nav .logo img.logo-handclean{
      max-height: 50px;
      padding-top: 10px;
    }
    
    nav .link {
      min-width: auto; 
      text-align: center;
      width: 100%;
    }
    
    #wrapper header > nav .link {
      position: static; 
      min-width: 0; 
      display: none;
    }    
    
    #content div.background_blue h2,
    #content div.background_white h2{
      font-size: 2em !important;
    }
    
    #content a.background_green{
      width: 75%;
      font-size: 1em;
    }
    
    /* BLOCK FLOTTANT */
    #floating_ambassadors,
    #alert_integrity,
    #info_site{
        display: none;
    }
}

@media screen and (max-width: 450px) {
    #wrapper header > nav .logo img.logo-handclean{
       float: left;
    }
    
    #fixed h1{
       float: left;
       font-size: 1.5em; 
       margin-top: 10px;
    }
    
    #wrapper header > nav .logo a:first-child > img:last-child{
        display: none;
    }
    
    #wrapper header > nav .logo a:last-child{
        display: none;
    }
    
    
}



.col-6 {
    float: left;
    width: 50%;
}

#content .col-6 a.background_green {
    background-color: rgb(154, 182, 46);
    color: rgb(0, 25, 46);
    border-bottom: 10px solid rgb(84, 112, 32);
    padding: 25px;
    width: 80%;
    font-size: 1.4em;
    font-weight: bold;
    margin: auto;
    margin-top: 20px;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}