/**********/
/*FONTS
/***********/

@font-face {
  font-family: "dacia";
  src: url("../font/DaciaSpirit-Regular_V1200.ttf") format("truetype")
      
}
@font-face {
  font-family: "dacia light";
  src: url("../font/DaciaSpirit-Light_V1200.ttf") format("truetype")
      
}
@font-face {
  font-family: "dacia bold";
  src: url("../font/DaciaSpirit-Bold_V1200.ttf") format("truetype")
      
}



body{
    background-image: url(../img/background.png);
    background-repeat: repeat;
    box-sizing: border-box;
    font-family: "dacia";
    font-size: 12pt;
    margin: 0;
    color:#003a76;
    /*width:auto;*/
    overflow-x:hidden;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex: 1;
}

/**********************/
/* HEADER
/**********************/

header{height: 100px; display: flex; justify-content: space-between;align-items: center;}
.col-25{width: 25%;}


.logo_mobile{max-width:97px;}

#nav_bar{cursor: pointer;}
#nav_bar span{
  width:25px;
  height: 2px;
  background-color: #0f406f;
  display: block;
  border-radius: 0.77px;
  position: relative;
  left: 50%;
}

#nav_bar span::after{
  content: "";
  width:25px;
  height: 2px;
  background-color: #0f406f;
  position: absolute;
  top:8px;

}

#nav_bar span::before{
  content: "";
  width:25px;
  height: 2px;
  background-color: #0f406f;
  position: absolute;
  bottom:8px;

}



/**********************/
/* FOOTER
/**********************/

footer{
	background-color:#10314C;
	display:flex;
	margin: 0;
	font-size:11px;
	justify-content:space-between;
	padding:1px 20px;
	border-top:1px solid #eee;
	
}
footer ul{ transform:none;width:auto;padding:0;margin:0;}

footer ul a{text-decoration:none;color:white;display:inline-block;}
footer ul a:hover{color:#0089cd;}
footer ul li{color:white; }
footer .footer_item{display:flex; }
footer .footer_item img{padding-right:30px; }
footer .footer_item ul li{padding:0 2px;}
footer .footer_item .footer_item_left_menu{display:flex;}


/**********************/
/* TITLE/LINKS/BOUTTON/FORM
/**********************/
h1{color:#0087cc;font-family: "dacia bold";}
p.titre{color:#0087cc;font-family: "dacia bold";font-size: 14pt;}

a{color: #2691d0;}
a.mobile{text-decoration: none;color: #003a76;}
a.lien_mail{text-decoration: none;}

.color-blue{color:#003a76;font-family: "dacia bold";}
.color-orange{color:#f18700; font-family: "dacia bold";}

.text-size{font-size: 13pt!important;}

.underline{text-decoration:underline;}
strong{font-family:"dacia bold"}

.col600{width:35%;}
.col600 img{max-width:80%;}


.btn-submit{
  background-color: #f08700;
  color: white;
  width:230px;
  height: 56px;
  border-radius: 26px;
  font-size: 10pt;
  border: none;
  margin-top:30px;
  border-color: inherit; 
  cursor:pointer;
}


input[type="submit"]{
	border-color: none; 
	border-style:none;
	-webkit-appearance: none;
	white-space: none;
}



.btn-submit:disabled,
.btn-submit[disabled]
{
	background-color:#ffdaaa;
	border-color: inherit
}
.row{display: flex ;}


.home_form{margin:0 auto; width:80%;}
#myDiv {
    width: 80%;
    margin: auto;
}
.form-group{display: flex;justify-content: space-between;margin:6px 0;text-align: left;}
.form-group input{width:292.88px;  height: 25px;background-color: #ebf0f4;border: none;}
.form-code input{width:138px;}
.form-group label{width:50%;}
.form-group .code{width:100%;}

::placeholder{font-family: "dacia";color:#003a76;text-align: center;}




/**INPUT TYPE CHECK***/
.form-check{display: flex;justify-content: space-around;}
.form_check_row{display: flex;justify-content: space-around;}

.form-check >div{width: 30%;}

input[type=radio] {-webkit-appearance: none;-moz-appearance: none;-ms-appearance: none; appearance: none}
input[type=radio] {height: 25px;width: 25px;background: #ebf0f4;border: none;margin:0;position: relative;top: 5px;left:5px;}

input[type="radio"]:hover {background: #e9ebec;}
input[type="radio"]:checked {background: #e9ebec;margin:0px;position: relative;}
input[type="radio"]:checked:before {content: '\002713';display: block;color:#003a76;font-size: 20px;position: absolute;left:25%;right: 25%;}

#check_monsieur input[type="radio"],#check_madame input[type="radio"]{left:0;!important}


/******/


.hidden{display: none;}
.text-danger{color:red; font-size: 11pt;}
ul{list-style: none;text-align: left; width:50%; transform: translate(40%);}



/************************************
                DESKTOP
*************************************/



/***HOME PAGE / Page confirmation***/
.page_template{display: flex;justify-content: flex-start;padding-left: 69px;}

#bloc_white{
  	background-color: white;
	-webkit-box-shadow: 2px -2px 25px 0px rgba(15,18,48,0.06);
	-moz-box-shadow: 2px -2px 25px 0px rgba(15,18,48,0.06);
	box-shadow: 2px -2px 25px 0px rgba(15,18,48,0.06);
}

.page_bloc::after{
	content:"";
	width:100%;
	height:100vh;
	background-image: url("../img/logo-15bis.png");
	background-size:50%;
	background-repeat:no-repeat;
	position:absolute;
	top:0;
	left:40%;
	z-index:-1;	 
	
}


#home_bloc_text,#confirmation_bloc_text{padding: 28px; text-align: center;}
#home_bloc_info{padding: 0 22px;font-size: 7pt;}
.col600 img{margin-top:25%;}


.mobile{display: none;}
#conditions{text-align: center;cursor: pointer;}

.visible{display: block;}

#confirmation{height:100vh;}
#confirmation #bloc_white{height:450px;}


/***PAGE MENTIONS/ Page COOKIE***/
#mentions_bloc ul,#cookie_bloc ul{width:auto;list-style:initial;transform:none;}
#cookie_bloc.col600,#mentions_bloc.col600{width:60%}


/***Tableau***/
table{border-collapse:collapse;width:100%;}
tr{width:100%;text-align:left}
th{
	background-color:#003878;
	color:white;
	height:54px;
	padding:0 5px;
	line-height:54px;
	width:20%;
	
}
td.first-col{background-color:#0089cd;color:white;}
td{border-top:1px solid #EEEEEE;padding-left:5px}

/**ORDI ##Screen = 1281px to */
@media screen and (min-width: 1281px) and (max-width: 1440px){

#home.page_bloc::after{left:50%; }
.col600{width:30%;}

#home #bloc_white.col600{width:40%!important}
/*.home_form{width:70%;}*/

}


/* ##Screen = B/w 1025px to 1280px*/
@media (min-width: 1025px) and (max-width: 1280px) {
  
	#home.page_bloc::after{left:50%; }
	/*.col600{width:30%;} Marlene*/
	.col600{width:40%;}
	.col600 img{max-width:80%;}
	#home.page_bloc .col600{width:45%!important}



  
}


/*
form {
    width: 70%;
    margin: auto;
}
*/

/************************************
               TABLETTE
*************************************/

@media (min-width: 768px) and (max-width: 1024px){

  /**HOME PAGE***/
  .page_template{flex-wrap: wrap; justify-content: center;padding-left: 0;}
   #bloc_white{background-color: inherit; -moz-box-shadow: inherit;
  box-shadow:  inherit}
  

  .form-group{flex-wrap: wrap;}
  .form-group input{width:100%;}
  .form-group input:last-child{width:100%;}
  .form-group label{width:100%;}


  .form-check{flex-wrap: wrap;}
  /*.form_check_row{justify-content: center;}*/
  .form_check_row .form-check:first-child{margin-right: 10px;}
  #label_oui{margin-right: 50px;}
  .form-check{flex-direction: column;}
  .form-check >div{width: 100%;}
  .home_form{width:50%}
  .form-group input{height:35px}
  
  ::placeholder{line-height:10px}
  
   .page_bloc::after{
	content:"";
	width:0;
	height:0;
	}


  
  .mobile{display: block;}
  .desktop{display: none;}
  .visible{display: block;}

  
  #submit_mobile{margin-left: auto;margin-right: auto;}
  
  #home .page_bloc::after,#confirmation .page_bloc::after{left:50%; }
  .col600{width:80%;}
  #cookie_bloc.col600,#mentions_bloc.col600{width:80%!important}

  
  footer .footer_item ul li { font-size: 9px; }
  footer ul li { font-size: 9px; }
  

  form {
    width: 100%;
    margin: auto;
    }

    .fm_mb {
        margin-bottom: 35px;
    }

    #label_madame { float: left}
    #label_monsieur { float: right; margin-right: 5px;}

    #myDiv {
        width: 50%;
        margin: auto;
    }


}





@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){

  /**HOME PAGE***/
  .page_template{flex-wrap: wrap; justify-content: center;padding-left: 0;}
   #bloc_whitec{background-color: inherit; -moz-box-shadow: inherit;
  box-shadow:  inherit}
  


  .form-group{flex-wrap: wrap;}
  .form-group input{width:100%;}
  .form-group input:last-child{width:100%;}
  .form-group label{width:100%;}

  .mobile{display: block;}
  .desktop{display: none;}
  .visible{display: block;}

  .form-check{flex-wrap: wrap;}

  .form_check_row{justify-content: center;}
  .form_check_row .form-check:first-child{margin-right: 10px;}
  #label_oui{margin-right: 10px;}
  .form-check{flex-direction: column;}
  .form-check >div{width: 100%;}
    ::placeholder{line-height:10px}
   .page_bloc::after{
	content:"";
	width:0;
	height:0;
	}



  #submit_mobile{margin-left: auto;margin-right: auto;}
  #home_bloc::after,#confirmation_bloc::after{left:50%; }
  .col600{width:60%;}
  #cookie_bloc.col600,#mentions_bloc.col600{width:60%!important}
  
  #confirmation_bloc{height:auto;}
  footer{flex-direction:column;}
  footer .footer_item:nth-child(2){justify-content: flex-end;}
  form {
    width: 100%;
    margin: auto;
    }

    .fm_mb {
        margin-bottom: 35px;
    }

    #label_madame { float: left}
    #label_monsieur { float: right; margin-right: 5px;}

    #myDiv {
        width: 50%;
        margin: auto;
    }

 

}

/************************************
              TABLETTE XS
*************************************/
@media screen and (min-width: 481px) and (max-width: 767px ){

  /***HOME PAGE**/
  .page_template{flex-wrap: wrap; justify-content: center;padding-left: 0;}
   #bloc_white{background-color: #fefefe; -moz-box-shadow: inherit;
  box-shadow:  inherit}
  

  .form-group{flex-wrap: wrap;}
  .form-group input{width:100%;}
  .form-group input:last-child{width:100%;}
  .form-group label{width:100%;}
  .mobile{display: block;}
  .desktop{display: none;}
  .visible{display: block;}

  .form_check_row{justify-content: center;}
  .form_check_row .form-check:first-child{margin-right: 10px;}
  #label_oui{margin-right: 10px;}
  .form-check{flex-direction: column;}
  .form-check >div{width: 100%;}
    ::placeholder{line-height:5px}

	.page_bloc::after{
	content:"";
	width:0;
	height:0;
	}




  #submit_mobile{margin-left: auto;margin-right: auto;}
  .page_bloc:after{left:50%; }
	.col600{width:60%;}
	#cookie_bloc.col600,#mentions_bloc.col600{width:90%!important;padding:0 50px;}


	
	/***Tableau***/

	th{height:54px;padding:0 5px;line-height:initial;}


	
	
  /**MESSAGE ERREUR**/
   ul{width: 50%;transform: translate(30%);}
   
   
   
  
  footer{flex-direction:column;padding-top:10px;padding-bottom:5px;}
  footer .footer_item{padding:3px 0;}
  footer .footer_item:first-child{flex-direction:column;}
  footer .footer_img{padding-bottom:5px;padding-left:3px;}
  footer .footer_item:nth-child(2){justify-content: flex-start;}
	
  form {
    width: 100%;
    margin: auto;
    }

    .fm_mb {
        margin-bottom: 35px;
    }

    #label_madame { float: left}
    #label_monsieur { float: right; margin-right: 5px;}

    #myDiv {
        width: 50%;
        margin: auto;
    }



} 




/************************************
            SMARTPHONE
*************************************/
@media screen and (min-width:320px) and (max-width: 480px){

  /***HOME PAGE**/
  .page_template{flex-wrap: wrap; justify-content: center;padding-left: 0;}
 /* header{background-color: #fefefe;}*/
 
    #bloc_white{background-color:  #fefefe; -moz-box-shadow: inherit;
  box-shadow:  inherit}
  
 .page_bloc::after{
	content:"";
	width:0;
	height:0;
	}
   ::placeholder{line-height:15px}

  .home_form{width:80%;}
  .form-group{flex-wrap: wrap;}
  .form-group input{width:100%;}
  .form-group input:last-child{width:100%;}
  .form-group label{width:100%;}


  .mobile{display: block;}
  .desktop{display: none;}
  .visible{display: block;}

  /*.form_check_row{justify-content: center;}*/
  #label_oui{/*margin-right: 40px;*/width: 100%}
  #label_non{width: 100%}
  .form-check{flex-direction: column;}
  .form-check >div{width: 100%;}

	
	#confirmation{height:auto;}

	#confirmation .bloc_white{height:auto;}


  	#submit_mobile{margin-left: auto;margin-right: auto;}
	.col600{width:100%;}
	#cookie_bloc.col600,#mentions_bloc.col600{width:90%!important;padding:0 50px;} /*background-color:  #fefefe;*/

	/*#mentions_bloc h1{font-size:22px;}*/
	#mentions_bloc h1{font-size:19px;}
	
	
	/***Tableau***/

	th{height:54px;padding:0 5px;line-height:initial;}



	

  /**MESSAGE ERREUR**/
  ul{width: 100%;transform: translate(0);}
  
  footer{flex-direction:column;}
  footer .footer_item{padding:5px 0;}
  footer .footer_item:first-child{flex-direction:column;}
  footer .footer_img{padding-bottom:3px;padding-left:3px;}
  footer .footer_item .footer_item_left_menu{flex-wrap:wrap;}
  footer .footer_item:nth-child(2){justify-content: flex-start;flex-wrap:wrap}
	
  form {
    width: 100%;
    margin: auto;
}

.formB {
    width: 100%;
    margin: auto;
}

.form_check_row {
    width: 85%;
    margin: auto;
}

.fm_mb {
    margin-bottom: 35px;
}

#label_madame { float: left}
#label_monsieur { float: right; margin-right: 5px;}

#myDiv {
    width: 100%;
    margin: auto;
}

}