@charset "utf-8";
/* CSS Document */

#contact {
	display:inline-block ;
	vertical-align:top ;
	margin-top:20px ;
	padding-left:5px ;
	box-shadow: 1px 1px 20px #d2d2d2 ;
	height:550px ;
	width:685px ;
	background-color:#eeeeee ; 
	/* background-image: url(../images/notemusique7.png); */
}
.info_contact {
	 margin-top:10px ;
	 margin-left:10px ;
	 margin-bottom:20px ;
	background-color:white ;
	border-bottom:solid grey 1px ;
	padding:10px ;
	width:670px ;
	height:60px ;
	position:relative ;
	top:-10px ;
	left:-15px ;
 }

.titre_contact {
	display:inline-block ;
	vertical-align: middle ;
	letter-spacing:1px ;
	font-size:13px ;
	font-weight: bold;
	color:black ;
	margin-bottom: 10px ;
	margin-left: 5px ;
}
.email {
	display:inline-block ;
	vertical-align: middle ;
	width:20px ;
	margin-left: 142px ;
	margin-bottom: 10px ;
	
 }
 .tel {
	 display:inline-block ;
	 vertical-align:middle ;
	 cursor:pointer ;
	 color:black ;
	 font-size:16px ;
 }
.form_contact {
	width:400px ;
	margin:auto ;
}
.form_contact input { 
	display:inline-block ;
	vertical-align:top ;
	width:400px ;
	height:20px ;
	margin-bottom:10px ;
	color:rgb(56, 56, 56) ; 
	border:solid #CCC 1px ;
	padding:2px ;
} 
.form_contact textarea {
	display:inline-block ;
	width:398px ;
	height:145px ;
	border:solid #CCC 1px ;
	overflow-y:hidden ;
	border-radius:4px ;
	padding:3px ;
}
.form_contact input[type="submit"] {
	display:inline-block ;
	width:406px ;
	height:40px ;
	font-size:18px ;
	letter-spacing:3px ;
	background-color:#007EBB ;
	color:white ;
	box-shadow:5px 5px 5px black ;
	margin-top:10px ;
	cursor:pointer ;
	border:none ;
}
#bouton_liberte input[type="submit"]{
	color:white ;
	width:404px ;
	height:40px ;
	font-size:18px ;
	letter-spacing:3px ;
	background-color:#007EBB ;
	margin-top:10px ;
	cursor:pointer ;
	border:none ;
	box-shadow:3px 3px 3px black ;
	margin-left:150px ;
	margin-top:20px ;
}
#bouton_liberte input[type="submit"]:hover,#connexion_creation:hover,.form_contact input[type="submit"]:hover{
	background-color: rgb(2, 175, 2) ;
}
#connexion_creation{
    display: flex;
    justify-content: center; /* Centre verticalement */
    align-items: center;     /* Centre horizontalement */
	text-align: center;      /* centre plusieurs lignes */
	color:white ;
	width:404px ;
	height:40px ;
	font-size:15px ;
	letter-spacing:3px ;
	background-color:#007EBB ;
	margin-top:10px ;
	cursor:pointer ;
	border:none ;
	box-shadow:3px 3px 3px black ;
	margin-left:0px ;
	margin-top:20px ;	
}
.confirmation_envoi {
	display:inline-block ;
	width:406px ;
	height:40px ;
	line-height: 40px;
	font-size:18px ;
	background-color:#00bb2c ;
	color:black ;
	box-shadow:5px 5px 5px black ;
	margin-top:10px ;
	cursor:pointer ;
	border:none ;
	text-align: center;
	font-size: 15px ;
}
.option_liberte {
	display:inline-block ;
	width:406px ;
	height:40px ;
	line-height: 40px;
	font-size:18px ;
	background-color:#007EBB ;
	color:white ;
	box-shadow:5px 5px 5px black ;
	margin-top:10px ;
	cursor:pointer ;
	border:none ;
	text-align: center;
	font-size: 15px ;
}
.option_liberte:hover {
	color:white ;
	background-color:#00D200 ;
}
.triangle_bottomleft2 {
	display:inline-block ;
	vertical-align:baseline ;
	margin-left:140px ;
	margin-top:10px ;
	width: 0;
	height: 0;
	border-bottom: 20px solid #0080C0 ;
	border-right: 20px solid transparent;
 }
.logo_contact {
	display:inline-block ;
	vertical-align:top ;
}
img.logo_contact {
	max-height:60px ;
}
.raison_contact {
	margin-left:5px ;	  
	font-size:14px ;
	font-style:italic ;
	margin-bottom:10px ;
	font-weight:bold ;
}
.tel_general {
	margin-left:5px ;
	font-size:15px ;
	font-style:italic ;
}
 .contact_droit {
	 display:inline-block ;
	 vertical-align:top ;
 }
 img.icone_tel {
	 display:inline-block ;
	 vertical-align:middle ;	
	 height:20px ;
	 margin-right:5px ;
 }

 
 /* *************************************************************************** */

 input:focus {
	border-color: rgba(82, 168, 236, 0.75);
	-moz-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
	-webkit-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
	box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);
}

.correct {
	border-color: rgba(68, 191, 68, 0.75);
	background-color:white ;
}

.correct:focus {
	border-color: rgba(68, 191, 68, 0.75);
	-moz-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
	-webkit-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
	box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);
}

.incorrect {
	border-color: rgba(191, 68, 68, 0.75);
	background-color:#FFB871 ;
}

.incorrect:focus {
	border-color: rgba(191, 68, 68, 0.75);
	-moz-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
	-webkit-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
	box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);
}

.tooltip,.tooltip3 {
	display:none ;
	vertical-align:top ;
	text-align:center ;
	width:200px ;
	height:22px ;
	line-height:22px ;
	padding:5px ;
	padding-top:3px ;
	padding-bottom:3px ;
	margin-left:10px ;
	border: 1px solid black ;
	background-color:#4F4F4F ;
	color:white ;
}

.tooltip2 {
	display:none ;
	vertical-align:top ;
	text-align:center ;
	width:200px ;
	padding:5px ;
	padding-top:3px ;
	padding-bottom:3px ;
	margin-left:10px ;

}
.form_contact input[type="text"].calcul_captcha {
	display:inline-block ;
	width:140px ;
	height:27px ;
    border:solid black 1px ;
    position:relative ;
    top:5px ;
}
.depassement {
	width:700px ;
}
.validation_message {
	z-index: 100 ;
	height:80px ;
	line-height:80px ;
	text-align:center ;
	font-weight:bold ;
	font-size:16px ;
	text-decoration:underline ;
}

#non_envoiFc {
	display:none ;
}
#envoiFc {
	display:none ;
}
.croix_contact,.croix_confirmation {
	float:right ;
	position:relative ;
	top:4px ;
	right:4px ;
	height:30px ;
	width:30px ;
	background-color:white ;
	border:solid black 1px ;
   	box-shadow: 1px 1px 5px black ;	 
   	cursor:pointer ;
}
.croix1c {
	display:inline-block ;
	vertical-align:middle ;
	position:absolute ;
	left:14px ;
	top:3px ;
	height:22px ;
	border-left:solid #C10000 2px ;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);

}
.croix2c {
	display:inline-block ;
	vertical-align:middle ;
	position:absolute ;
	left:15px ;	  
	top:3px ;
	height:22px ;
	border-left:solid #C10000 2px ;
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
}

#shadow {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* S’assure de couvrir toute la page */
    opacity: 0.8;
    visibility: hidden;
    background: black ; /* Couleur de fond pour un effet d’ombre */
    z-index: 101;
}
#multicouche {
	display:none ;
	position:relative ;
  margin-bottom:auto ;  
  margin-right:auto ;
  margin-left:auto ;
  margin-right:auto ;
  height:650px ;
  width:510px ;
  /*background-color:#F5F5F5 ; 
  background-color:#466C79 ;
  background-color:#445C62 ;*/
  background-color:white ;
  opacity:0.95 ;
  background-size:cover ;
  border:solid black 1px ;
  box-shadow: 5px 5px 12px black ;
}
#multicouche_confirmation {
	display:none ;
	position:relative ;
  margin-bottom:auto ;  
  margin-right:auto ;
  margin-left:auto ;
  margin-right:auto ;
  height:110px ;
  width:350px ;
  background-color:white ;
  border:solid black 2px ;
  box-shadow: 5px 5px 12px black ;
  background-color:#F2F2F2 ;
  color:black ;
  font-weight:bold ;
}
#multicouche_confirmation:hover {
	cursor:pointer ;
}