/***** champs formulaire *****/ 
label								{ display: block; margin-bottom: 5px; font-size: 14px;}
label span							{ color: #ba0000;} 

.formulaire select,
.formulaire input[type="text"],
.formulaire input[type="email"],
.formulaire input[type="date"],
.formulaire input[type="number"],
.formulaire textarea      { width: 100%; border: 1px solid #dfdfdf; padding: 0 20px; height: 54px; font: var(--fontBody); color: var(--mainColor1); margin-bottom: 10px; display:block; background: #fff; font-size: 14px; border-radius: var(--linkRadius);}
.formulaire textarea      { min-height: 160px; padding: 15px 20px; display: block; margin-bottom: 0;}
input[type=submit]        { border: none; cursor: pointer; transition: all 400ms ease-in-out;width: max-content; margin: 0; display: block; } 
input::placeholder        { color:#00000040; }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus 		{ border: 1px solid #010101; -webkit-text-fill-color: #000000; box-shadow: 0 0 0px 1000px #ffffff inset; transition: background-color 5000s ease-in-out 0s;}




/** formulaire **/
.formulaire 						{ position: relative;}
.formulaire form .grid 				{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px; margin-bottom: 20px;}
.formulaire form .link 				{ width: 100%; text-align: center; border: none; padding-bottom: 2px;}

@media (max-width:1600px) { 
.formulaire form .grid 				{ grid-gap: 30px;}
}
@media (max-width:1400px) { 
.formulaire form .grid 				{ grid-gap: 25px; margin-top: 25px;}
}
@media (max-width:1200px) {     
.formulaire form .grid 				{ grid-gap: 15px; margin-top: 20px; grid-template-columns: 1fr;}
.formulaire form .grid .full		{ grid-column: auto;}
.formulaire form .sous_titre 		{ margin: 0;}
}
@media (max-width:1000px) { 
.formulaire 						{ padding-bottom: 20px;}
.formulaire form .grid 				{ grid-template-columns: 1fr 1fr;}
.formulaire form .grid .full		{ grid-column: span 2;}
}
@media (max-width:700px) { 
.formulaire form .grid 				{ grid-gap: 10px; margin-top: 0;}
}
@media (max-width:500px) { 
.formulaire form .grid 				{ grid-template-columns: 1fr;}
.formulaire form .grid .full		{ grid-column: auto;}
}


/***** confirmation formulaire *****/
.anchor 							{ position: absolute; left: 0; top: -140px;}
.confirmation_form			 		{ padding: 30px; background: var(--mainColor2); color: #ffffff; text-align: center; border-radius: var(--imgRadius);}

@media (max-width:600px) {
    .confirmation_form              { padding: 30px; }
}

/***** RGPD *****/
#rgpdForm 							{ font: 400 12px/22px "Poppins"; border: none; letter-spacing: 0.6px; margin: 10px 20px 30px 0;}
#rgpdForm input[type=checkbox]		{ width: 18px; height: 18px; display: block; float: left; padding: 0; margin: 2px 0 0 0; -webkit-appearance: checkbox; -ms-appearance: checkbox; appearance: checkbox; -moz-appearance: checkbox; -o-appearance: checkbox;}
#rgpdForm label						{ display: block; margin: 0; padding-left: 30px; font: 400 12px/22px "Poppins"; letter-spacing: 0.6px;}
#rgpdForm a							{ color: var(--mainColor2); border-bottom: 1px solid var(--mainColor2);}
#rgpdFormAcceptError				{ padding: 5px 0 0 30px; color: #ba0000;}

@media (min-width:1201px) {
#rgpdForm a:hover 					{ border-color: var(--mainColor1); color: var(--mainColor1);}
}
@media (max-width:700px) { 
#rgpdForm, 
#rgpdForm label						{ font-size: 11px; line-height: 20px;}
}





/***** page contact *****/
#contact .grid_bloc  											{ padding-top: 240px;}
#contact .grid_bloc .container									{ grid-template-columns: 1fr 380px; grid-gap: clamp(20px, 4vw, 60px); align-items: start;}
#contact .grid_bloc .formulaire									{ background: var(--bgColorLight); padding: clamp(20px, 4vw, 50px); border-radius: var(--imgRadius);}

#contact .grid_bloc .coordonnees								{ line-height: 170%; position: sticky; top: 120px;}
#contact .grid_bloc .coordonnees .icon 							{ padding-left: 35px; position: relative; /*color: #fff;*/}
#contact .grid_bloc .coordonnees .icon:after 					{ width: 18px; height: 100%; position: absolute; left: 0; top: 0; content: "";}
#contact .grid_bloc .coordonnees .address:after 				{ background: url(../images/map.svg) 1px 5px no-repeat;}
#contact .grid_bloc .coordonnees .opening 						{ margin-top: 10px; padding-bottom: 5px;}
#contact .grid_bloc .coordonnees .tel a:after 					{ background: url(../images/tel.svg) 0 50% no-repeat;}
#contact .grid_bloc .coordonnees .email a:after 				{ background: url(../images/email.svg) 1px 50% no-repeat;}

#contact .grid_bloc .coordonnees p a 							{ border-bottom: none;}
#contact .grid_bloc .coordonnees .link 							{ margin-top: 15px;}

.bloc_contact .grid                    							{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; margin-bottom: 30px;  }

.contact_form .grid .item               						{ position: relative;}
.contact_form .grid .item .sous_titre      						{ margin-bottom: 0;}
.contact_form .grid .item.margin-top    						{ margin-top: 30px;}
.contact_form .grid .item_full          						{ grid-column: span 2; position: relative;}

#contact .map  			 										{ margin-top: -2vw;}
#contact .map iframe 			 								{ width: 100%; height: auto; max-height: 700px; aspect-ratio: 16/9; object-fit: cover; display: block; border-radius: 20px; border: none;}

@media (max-width:1400px) { 
#contact .bloc_col_txt .coordonnees             { padding-left: 40px;}
}
@media (max-width:1200px) { 
#contact .grid_bloc                             { padding-top: 140px;}    
#contact .map iframe 							{ border-radius: 15px;}
}
@media (max-width:1000px) { 
#contact .grid_bloc .container                  { grid-template-columns: 1fr;}
#contact .grid_bloc .coordonnees .item          { display: none;}
}

@media (max-width:700px) { 
.contact_form .grid .item.margin-top    						{ margin-top: 20px;}
#contact .grid_bloc                             { padding-top: 0;}       
#contact .grid_bloc .formulaire                 { margin-top: 40px;}    
#contact .grid_bloc .item                       { margin-bottom: 0;}
#contact .map iframe 							{ border-radius: 12px;}
}