/* Styles */

.menuButton{
  display:none;
}

.adminClose,
.adminOpen,
.userOpen,
.userClose,
.hamburger,
.cross{
  background:none;
  position:relative;
  padding:2px 0px 0px 3px;
  border:0;
  font-weight:bold;
  cursor:pointer;
  z-index:10000000000000;
}

.homeClose,
.adminClose,
.userClose,
.cross{
  background:none;
  position:relative;
  padding:2px 0px 0px 3px;
  border:0;
  font-weight:bold;
  cursor:pointer;
  z-index:10000000000000;
  display:none;
}

.menu{
  padding:0;
  margin:0;
 /* height:24px;*/
  text-align:center;
}

.menu ul {margin:0; padding: 0; list-style-type: none; list-style-image: none; margin-top:5px}
.menu li {display: inline;  font-size:16px;}
.menu a {  
  color:#979797;
  text-decoration: none;  
  font-weight: bold;
  display:inline;
  margin:0;
  padding-right:10px;
  padding-left:10px;  
}

/* conteneur de box pour petit écran : aligner les box à gauche*/

#mainbox{
  box-sizing: border-box;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
  justify-content:center;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  -webkit-flex-direction:row;
  flex-direction:row;  
}

.play_white{
  background:none;
}

.build_white{
  background:none;
}

.menu_sep{
  display:inline;
}


/***************************/


.display_header{
  margin:0;
  padding:0;
  border:0;
}

.play{
  background:white;/*#CDE7FF;*/
}

.build{
  background:#CDE7FF; /*#CDE7FF;*/
}

.logo{
  margin:0;
  padding:0;
  display:inline;
  padding-top:4px;
  padding-bottom:4px;
  padding-left:8px;
  text-align: center;  
}

.logo_lachez{
  margin:0;
  padding:0;
  display:inline;
  padding-top:4px;
  padding-bottom:4px;
  padding-left:8px;
  text-align: left;     
}

.titleText{
  display:inline;
  font-size:18pt;  
  color:black;
  font-weight: bold;
  font-family:Arial;  
}
 
.title{
  width:100%;
  text-align: center;
  box-sizing: border-box;  
  border-bottom:solid 3px black;
}	

.title_lachez{
  width:100%;
  text-align: left;
  box-sizing: border-box;  
  border-bottom:solid 3px black;
}

.languages{
  position:absolute;  
  top:3px;
  right:3px;
}

.username{
  position:absolute;  
  padding:0;
  margin:0;
  color:#473F35;  
  top:0;
  left:390px;
  height:20px;
  padding-left:25px;
  padding-top:3px;
  color:black;
}

.link_quit{
  padding-top:3px;
  padding-right:5px;
  position:absolute;
  left:370px;
}

.menu_lev1{
  padding:0;
  margin:0;
  height:28px;
  background:url('images/ombre.png');
  background-position: 0px 24px;
  background-repeat:repeat-x;   
}

.menu_lev1 .elt_menu a{
  color:#979797;
  text-decoration: none;  
  font-weight: bold;
  float:left;
  display:block;
  margin:0;
  padding-top:4px;
  padding-bottom:4px;  
  padding-right:10px;
  padding-left:10px;  
}

.menu_lev1 .elt_menu_select a{
  text-decoration: none;
  font-weight: bold;
  float:left;
  display:block;
  margin:0;
  padding-top:4px;
  padding-bottom:4px;    
  padding-left:10px;  
  padding-right:10px;
  color:#FDB602;  
}


.menu_lev1 .elt_menu_img a{
  color:rgb(0,0,0);
  text-decoration: none;  
  font-weight: bold;
  float:left;
  display:block;
  margin:0;
  padding-top:3px;
  padding-bottom:1px;  
  padding-right:10px;
  padding-left:10px;  
}

.menu_lev1 .elt_menu_img_select a{
  color:rgb(255,255,255);
  text-decoration: none;
  font-weight: bold;
  float:left;
  display:block;
  margin:0;
  padding-top:3px;
  padding-bottom:2px;    
  padding-left:10px;  
  padding-right:10px;
}

.menu_lev1 .elt_menu_img_select a{
  background:url('images/stripes.png');  
}


.menu_lev2{
  width:100%;
  padding:0;
  margin:0;
  float:left;  
  height:28px;
  background:url('images/ombre.png');
  background-position: 0px 24px;
  background-repeat:repeat-x;   
  background-color:#F7F7F7;
}


.menu_lev2 .elt_menu a{
  float:left;
  display:block;
  margin:0;  
  padding-top:4px;
  padding-bottom:4px;    
  padding-left:10px;  
  padding-right:10px;  
  color:rgb(255,255,255);
  text-decoration: none;  
  font-weight: bold;  
}

.menu_lev2 .elt_menu_select{
  float:left;
  display:block;
  margin:0;
  padding-top:4px;
  padding-bottom:4px;    
  padding-left:10px;  
  padding-right:10px;  
}

.menu_lev2 .elt_menu_select a{
  color:#FDB602;
  text-decoration: none;
  font-weight: bold;
  margin:0;
}


.menu_lev2{
  background-color:#F7F7F7;
  color:#000000;
}

.menu_lev2 .elt_menu a{
  color:#868686;
}

.menu_lev2 .elt_menu_select{
  
}

.blockGap{
  padding-top:32px;  
}

/* HACK elements */
.fieldset .legend{
  border:0;
  background-color:#F3F3F3;
  padding:6px;
  background-image: none;
}

.label{
  font-weight:normal;
}

.button,
.button:link,
.button:visited,
.button:link:visited{
 text-decoration:none;
 color:#3E2500;
}

.buttonsRight{
  position:absolute;  
  top:3px;
  right:5px;
}

.user{
  position:relative;  
  float:right;
}

.admin{
  position:relative;  
  float:right;
  margin-right:3px;
}

.buttonsLeft{
  position:absolute;  
  top:3px;
  left:5px;
}

.menuButton{
  position:relative;  
  float:left;
  margin:0;
  padding:0;  
  margin-left:3px;
}

.menuUser {z-index:1000000; display:none; font-weight:bold; font-size:0.8em; width:100%;   position:absolute; text-align:center;}
.menuUser ul {margin: 0; padding: 0; list-style-type: none; list-style-image: none;}
.menuUser li {display: block;   padding:8px 0 8px 0; border-bottom:#1d1f20 1px solid;font-size:14pt;}
.menuUser ul:first-child{ border-top:#1d1f20 1px solid;}
.menuUser ul li a { text-decoration:none;  margin: 0px;}
.menuUser a{text-decoration:none; color:black;}

.menuAdmin {z-index:1000000; display:none; font-weight:bold; font-size:0.8em; width:100%;  position:absolute; text-align:center;}
.menuAdmin ul {margin: 0; padding: 0; list-style-type: none; list-style-image: none;}
.menuAdmin li {display: block;   padding:8px 0 8px 0; border-bottom:#1d1f20 1px solid;font-size:12pt;}
.menuAdmin ul:first-child{ border-top:#1d1f20 1px solid;}
.menuAdmin ul li a { text-decoration:none;  margin: 0px;}
.menuAdmin a{text-decoration:none; color:black;}

.menuHome {z-index:1000000; display:none; font-weight:bold; font-size:0.8em; width:100%;  position:absolute; text-align:center;}
.menuHome ul {margin: 0; padding: 0; list-style-type: none; list-style-image: none;}
.menuHome li {display: block;   padding:8px 0 8px 0; border-bottom:#1d1f20 1px solid;font-size:12pt;}
.menuHome ul:first-child{ border-top:#1d1f20 1px solid;}
.menuHome ul li a { text-decoration:none;  margin: 0px;}
.menuHome a{text-decoration:none; color:black;}

.button_shell_free{
  margin-right:2px;
  margin-left:4px;
  margin-bottom:5px;
  margin-top:10px;
}

/* HACK */
.zebraTable td{
  line-height:1;
}

.hacklev1{
  width:100%;  
}

.width100{
  clear:both;
  width:auto;
  display:inline;  
  font-size:12pt;  
}

.back{
  margin:0;
  padding:0;
  text-align:center;
  width:100%;
  box-sizing:border-box;
}

.userFocus{
  background-color:#FFF8D7;
}

.listScores td{
  font-size:9pt;  
}

.badge{
  float:left;  
  border:solid 1px #CDE7FF;
  width:60px;
}

.countChallenge span,
.countChallenge a{
  font-size:20pt;
  font-weight :bold;    
  text-decoration: none;
}

.countChallenge{
  padding: 10px;
  padding-top:5px;
  padding-bottom:5px;
}

.typeChallenge{
  padding:0;  
}

.imgChallenge{
  height:64px;  
}

.blockMarker{
  border-bottom:solid 1px lightgray;  
  text-align:left;
}

/****** UPLOAD BUTTON ***********/
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.file_list_item{
  font-style:normal;

}

#files_to_upload_list{
  margin-bottom:20px;    
  margin-top:5px;
}

.filename_uploadfiles{
  background: url('../images/app/file.svg') no-repeat;  
  padding:8px;
  padding-left:24px;
  background-position: 4px 8px;   
  background-size: 16px;
  background-color:#F5F8FF;  
  border:solid 1px #598FC1;
  border-left-width: 5px;
}

.thumbnailBox{
  padding:5px;
  border:solid 1px #598FC1;
  background-color:#F5F8FF;
  margin:5px;
  text-align:center;
}

.titrePage{
  font-size:15pt;  
  text-align:center;
  padding-top:8px;
  padding-bottom:8px;
}

.missionDone{
  position:relative;
  font-size:13pt;
  font-weight:bold;
  color:#6DC180;
  margin-bottom:10px;
}

.missionFailed{
  position:relative;
  font-size:13pt;
  font-weight:bold;
  color:#FF6643;
  margin-bottom:10px;
}

.challengeLink{
  font-size:12pt;
  padding:3px;
  text-decoration: none;
  font-weight:bold;
  color:#23ABF7;
}

.blocBasic{
  margin-left:25px;  
  font-style: normal;
  color:#878a85;
}

.blocBasicMission{
  font-style: normal;
  color:navy;
  text-align:left;
  margin-bottom:15px;
}

.warningField{
  background: url('../images/warning.svg') no-repeat;   
  background-position: 2px 4px;
  background-color: #FFC9B2;  
  background-size: 16px 16px;
  padding:5px;
  padding-left:20px;
  border-radius: 6px;
}

.dashedBlueLine{
  border-top:dashed 1px #F3D617;  
  padding-top:8px;
}

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited{
  color:white;  
}


#sortable { list-style-type: none; margin: 0; padding: 0;  }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; font-size: 1.4em;}

#sortable_static { list-style-type: none; margin: 0; padding: 0;  }
#sortable_static li { margin: 0 3px 3px 3px; padding: 0.4em; font-size: 1.4em;}


.ui-state-default{
  border:solid 1px grey;  
  background: -webkit-linear-gradient(top, #F9F7EF 30%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */
  background: linear-gradient(#F9F7EF 30%,#FFFFFF 100%); /* W3C; A catch-all for everything else */     
}

.ui-state-highlight{
  height:30px;
}

.answerDisplay{
  font-size:9pt;  
}

 .commandRefresh{
   position:relative;
   padding:8px;
   float:left;
 }
 
 .counterAnswer{
   position:relative;
   float:left;
   width:60px;
   margin-left:5px;
 }
 
 #counterAnswer{
  font-size:18pt;   
  text-align:center;
 }
 
 .legend_question{
    display: block;
    width: 100%;
    padding: 0.3em 0;
    margin-bottom: 0.3em;
    color:#497958;
    border-bottom: 2px solid #e5e5e5;
    font-weight: bold;
    font-size:15pt;
    text-align:center;
}

.displayQuestion{
  padding-bottom:6px;  
}

.QuestionText{
  font-size:13pt;  
  border-bottom: solid 1px gainsboro;
  padding:5px;
  color:navy;
  margin-bottom:3px;
}

.questionAnswer{
  font-size:12pt;
  cursor:pointer;
  background-color:#FFF8CA;
  height:38px;
  padding-top:8px;
}

.answerAlt{
  background-color:white;  
}

.QuestionNumber{
  background-color:#F5F8FF;
  font-weight:bold;
  font-size:13pt;
  padding:4px;
}

.clickAnswer{
  text-align:center;  
  padding:5px;
}

.SelectedBlue{
  background-color:#97B0F8;
  font-weight:bold;
  border-radius: 6px;
  background: linear-gradient(90deg,#D2D3F8 30%,#F5F8FF 100%); /* W3C; A catch-all for everything else */   
}

.SelectedBlueImg{
  background-image: url('../images/app/tick_blue.svg');
  background-repeat:no-repeat;
  background-position:95% 50%;
  background-size: 20px 20px;
  color:#006EF5;  
}

.goodBG{
  background: linear-gradient(90deg,#8AF8A0,#FFFFFF 90%); /* W3C; A catch-all for everything else */       
    border-radius: 6px;
}
.wrongBG{
  background: linear-gradient(90deg, #FFA094, #FFFFFF 90%); 
    border-radius: 6px;
}

.goodResponse{
  background-image: url('../images/app/good.svg');
  background-repeat:no-repeat;
  background-position:95% 50%;
  background-size: 20px 20px;  
}

.wrongResponse{
  background-image: url('../images/app/wrong.svg');   
  background-repeat:no-repeat;
  background-position:95% 50%;
  background-size: 20px 20px;
}

.pointsEarned{
  background-color:#EBF0FF;
  font-size:10pt;
  padding:5px;
}

.buttons{
  margin-top:10px;
}

.challenge_legend{
  margin-top:8px;
}

.legend_title{
  font-size:9pt;
  font-weight: bold;  
  margin-left:8px;
  padding-top:5px;
  padding-bottom:5px;
}

.legend_item{
  width:20px;
}

.reviewProgress{
 margin-top:4px;
}

.reviewProgressPeer{
 margin-top:10px;
 font-weight: bold;
}

.reviewMenu{
  text-decoration: none;
  font-size:12pt;  
  color:#598FC1;
}

.age_field{
  display:none;  
}

.checkFormField{
  font-size:9pt;
  vertical-align:middle;
  padding-top:3px;
  margin-bottom:8px;
}

.mailCheckImg,
.loginCheckImg{
  /*float:left;*/
  width:30px;
  margin-left:15px;   
  margin-bottom:8px;
}

.mailCheckTxt,
.loginCheckTxt{
  /*margin-left:50px;*/
  text-align:center;
  margin-bottom:8px;
}

.emailMsg{
  color:#F3B600;
  font-family:calibri;
  font-size:11pt;
  margin-bottom:5px;
}

.swal-footer {
  background-color: #F3F3F3;
  margin-top: 32px;
  border-top: 1px solid #E9EEF1;
  overflow: hidden;
}

.swal-overlay {
  background-color: rgba(255, 247, 193, 0.45);
}

.swal-modal {
  background-color:white;
  border: 3px solid #F3D617;
}

.swal-button {
  padding: 7px 19px;
  border-radius: 2px;
  background-color: #F3D617;
  font-size: 12px;
  color:black;
}

.shunt_box{
  margin-top:8px;  
  padding:5px;  
}

.shunt_box_title{
  margin-bottom:4px;
  background-color: #C4C4C4;
  padding:3px;
}

.messageEntete{
  position: fixed; /* Le bloc reste en haut même en faisant défiler la page */
  top: 0; /* Positionne le bloc en haut de l'écran */
  left: 0; /* Optionnel : positionne le bloc à gauche de l'écran */    
  font-size:12pt;
  font-weight: bold;
  font-family:'renaultkrextrabold';
  text-align: left;
  padding:8px;
  display:none;
  height:54px;
}

.pageTitle{
  font-size:24pt;
  font-weight: bold;
  font-family:'renaultkrextrabold';
  text-align: left;
  margin-bottom:16px;
  padding:8px;
}

.pageSubTitle{
  font-family:'renaultkrextrabold';    
  font-size:18pt;  
  padding:8px;
  text-align:left;
}

.niceLink{
  color:black; /*#FFCA00;*/
  text-decoration: none;
  font-weight:bold;
}

.niceLink:hover{
  color:#FFCA00; /*#A8DAFF;*/
}

.compteur{
font-size:30pt;
font-family: 'caracterel2';  
color:black;
}

#emailMsg{
  width:400px;  
}

.action_filtrer{
  margin-right:5px;
  text-decoration: none;  
  color:navy;
  font-style:italic;
}

/*----PARKING TABLE ------------------*/
.parkingTable{
  width:100%;
  padding-bottom:10px;
  text-align:left;
}

.parkingTable td{
  margin:0;
 /* border-top:solid 8px white;*/
}

.bgcolor_parking{
 background-color: #005B8C;
 color:white;
 padding: 10px; 
 border-top:solid 8px white;
}

.parking_details{
  background-color: #FFFFF6;  
  color:black;
  font-size:11pt;
  padding: 5px;
  padding-bottom:10px;
  border-bottom:solid 3px #005B8C;
}

.parking_line{
  display:inline-block ;
  color:white;
  font-size:12pt;
}

.parking_nb_bornes{
  color:black;
  padding-left:5px;
  padding-right:5px;
  text-align: center;
  min-width:20px;
  display:inline-block;
}

.parking_nb_bornes_legende{
  color:black;
  padding-left:5px;
  padding-right:5px;
  text-align: center;
  width:16px;
  display:inline-block;
}

.parking_display{
  width:180px;
}

.des_bornes{
  background-color:#0ACA00;  
}

.pas_de_borne{
  background-color: #D12525;   
}

.parking_puissances{
  margin-left:8px; 
  background-color: #23ABF7;
  padding-left:7px;
  padding-right:7px;
}

.bouton_parking{
  background-color: black;
  color:white;
  margin:16px;
  padding:8px;
  font-size:20pt;
  text-align: center;
}

.bouton_parking_petit{
  background-color: black;
  color:white;
  padding:4px;
  margin:8px;
  font-size:12pt;
  text-align: center;

}

.lien_charge_petit{
  color:white;
  font-size:12pt;
  text-align: center;   
  text-decoration: none;
}

.lien_charge{
  color:white;
  font-size:18pt;
  text-align: center;   
  text-decoration: none;
}

.grise{
  background-color:grey;     
}

.boite_choix_parking{
  background-color: #005B8C;   
  width:100%;
  text-align: left; 
  padding:3px;
  margin:2px;
}

.ligne_soulignee{
  background-color: #2daebf;      
}

.boite_choix_parking_attente{
  background-color: #2daebf;   
  width:100%;
  text-align: left; 
  padding:3px;
  margin:2px;
}


.lien_choix_parking{
  color:white;
  font-size:14pt;  
  text-decoration: none;
  display: block;
}

.lien_choix_parking_attente{
  color:white;
  font-size:13pt;  
  text-decoration: none;
  margin-bottom: 0;
}

.lien_choix_parking_indication{
  color:black;
  font-size:11pt;  
  text-decoration: none;
  padding-left:16px;
}

.lien_choix_parking_attente_djapris{
  color:lightgrey;
  font-size:13pt;  
  text-decoration: none;
  font-style: italic;
}

.bornes_dispos{
  background-color: #E7E8E8;
  padding:10px;
  text-align:left;
}

.retour_message{
  padding-top:8px;
  text-align:left;
  margin-left:8px;  
}

.bas_page{
  position:fixed;
  bottom:5px;
  left:0px; 
  width:90%;
}

.declarations{
  width:100%;  
  text-align:center;
  background-color: lightgray;
  border:0;
}

.declarations th{
  background-color: lightgray;
  margin:0;
  padding:4px;
  border:0;
  border-left:1px solid white;
  border-bottom:1px solid #999999;
  font-weight:bold;
}


.declarations td{
  margin:0;
  padding:4px;
  border:0;
  border-left:1px solid white;
}

.bg_gris{
  background-color: #EEEEEE;
  color:black;  
}

.bg_vert{
  background-color: #38B449;
  color:white;   
}

.bg_bleu{
    background-color: #99ccff;
  color:black;      
}

.nb_utilisateurs{
 display:inline-block;
 text-align: center;
  width:18px;
  background-color: black;
  color:white;
  padding:1px;
  font-size:12pt;
  font-weight: bold;
}

.texte_utilisateurs{
  display:inline-block;
  font-size:12pt;
  padding-left:3px;    
}

.tab_onglets{
  width:100%;
  text-align: center;
}

.onglet{
  color:black;
  margin:0;
  font-weight: bold;
  font-size:20pt;
  text-decoration: none;
}

.onglet_etat_actif{
   border-top:solid 3px black;    
  background-color: white;
  padding-top:16px;
  padding-bottom:16px;  
  
}

.onglet_etat{
   background-color:#E7E8E8 ;
  padding-top:16px;
  padding-bottom:16px; 
}

.text_plus{
font-size:16pt;
text-align:left;
margin:8px;
border-top:solid 1px black;   
margin-top:20px;
padding-top:20px;
}

.text_plusplus{
font-size:16pt;
text-align:left;
margin:8px;
margin-top:10px;
padding-top:10px;
}

.etape{
  font-size:24pt;
  text-align:center;
  margin-top:10px;
  padding-top:10px;  
  font-family: zeus,arial;
  color:#cd7f32;
}

.vignettes{
  overflow:hidden;
  width:100%;
height:100%;  
}

.ligne_legende{
  margin-top:8px;  
}

.arrow::marker {
  content: "\21F0";
}

.font20
{
  font-size: 20px;
}

.hourglass{
  color:#007d9a;  
}

.icon-eclair 
{
   color: #FFD700; /* Gold color */
}

.case_badge{
  width:33%;
  text-align:center;
  font-size:14pt;  
}

.titre1{
  color:#598FC1;
  font-size:13pt;
  text-align:left;
  font-weight:bold;  
 /* display:inline;*/
}

.titre2{
  color:black;
  font-size:12pt;
  font-weight:bold;   
  text-align:left;
}

.bronze{
  color:#cd7f32;   
}

.argent{
  color:#C0C0C0;  
}

.or{
  color:#D4A50D;  
}

.bouton_infos{
  background-color:#005B8C;
  color:white;
  margin:16px;
  padding:10px;
  padding-left:16px;
  font-size:18pt;
  text-align: left;  
  border-top-right-radius:20px;
  border-bottom-right-radius:20px;

}

.charte{
  margin:0;   
  margin-top:24px;
  padding:0;  
  width:100%;
}

.faq_sous_titre{
  font-style: italic;
  text-align: center;  
  font-size:18pt;
  padding-bottom:20px;
}

.faq_question{
  font-weight:bold;
  font-size:12pt;  
  text-align:center; 
}

.faq_reponse{
  font-size:12pt;  
  text-align:center;      
}

.titre_page_lachez{
  font-size:24pt;
  font-weight: bold;
  font-family:'renaultkrextrabold';
  text-align: left;
  margin-bottom:16px;
  padding:8px  
}

.titre_specs{
  font-size:24pt;
  font-weight: bold;
  font-family:'renaultkrextrabold';
  text-align: left;
}