/***** champs formulaire *****/ 
label								{ font: 400 14px/28px "Open Sans"; display: block; margin: 15px 0 15px 0;}
label span							{ color: #e81e3f;}
select,
input[type="text"],
input[type="email"],
input[type="date"],
textarea 							{ width: 100%; height: 56px; border: none; font: 400 14px/22px "Open Sans"; letter-spacing: 0.4px; padding: 0 25px; border-radius: 5px; background: #fff; margin-bottom: 15px;}
select								{ -webkit-appearance: none; appearance: none; background: url("../images/arrow_select.svg") calc(100% - 25px) 50% no-repeat #fff; padding-bottom: 0;}
textarea							{ min-height: 160px; padding: 20px 25px; display: block;}
input[type=checkbox] 				{ -webkit-appearance: checkbox; -ms-appearance: checkbox; appearance: checkbox; -moz-appearance: checkbox; -o-appearance: checkbox; width: 20px; height: 20px; display: block; float: left; padding: 0; margin: 0;}
::-webkit-calendar-picker-indicator { background: url(../images/calendar.svg) 50% 100% no-repeat; cursor: pointer; height: 24px; outline: none;}

@media (max-width:1200px) { 
select,
input[type="text"],
input[type="email"],
input[type="date"] 					{ padding: 0 20px;}
textarea							{ padding: 15px 20px;}
}
@media (max-width:700px) { 
label								{ font-size: 13px; line-height: 24px; margin: 10px 0 10px 0;}
select,
input[type="text"],
input[type="email"],
input[type="date"],
textarea 							{ font-size: 13px; height: 50px; padding: 0 20px; border-radius: 5px; margin-bottom: 10px;}
select								{ background-position: calc(100% - 20px) 50%;}
textarea							{ padding: 15px 20px;}
}


/** formulaire **/
.formulaire 						{ position: relative; background: linear-gradient(to bottom, #fd9603 0%, #ffb941 100%); border-radius: 10px; padding: 40px 50px 50px 50px; margin-top: 40px;}
.formulaire:before					{ width: 700px; height: 700px; background: #fff; background: url("../images/shape.svg") center / contain no-repeat; position: absolute; left: 50%; top: -12.5%; opacity: 0.2; content: "";}
.formulaire .label 					{ margin: 10px 0 10px 0; color: #fff; font-size: 16px; font-weight: 500;}
.formulaire .grid 					{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px; margin-bottom: 20px;}
.formulaire .grid * 				{ margin: 0;}
.formulaire form .link 				{ width: 100%; text-align: center; border: none; background-image: linear-gradient(to top, #156e63 0% 50%, #11584f 50% 100%);}

@media (max-width:1200px) { 
.formulaire 						{ padding: 30px 40px 40px 40px;}
}
@media (max-width:700px) { 
.formulaire 						{ padding: 20px 6vw 40px 6vw; margin: 25px -6vw 0 -6vw; border-radius: 0; background: #ffb941;}
.formulaire:before					{ display: none;}
.formulaire .label 					{ margin-bottom: 10px; font-size: 14px;}
.formulaire .grid 					{ grid-template-columns: 1fr; grid-gap: 10px; margin-bottom: 15px;}
.formulaire form .link 				{ width: 100%; text-align: center; border: none; background: #156e63;}
}


/***** confirmation formulaire *****/
.confirmation_form			 		{ text-align: center;}
.confirmation_form p			 	{ margin: 5px 0 20px 0; font-size: 16px; font-weight: 500; color: #fff;}
.confirmation_form .link 			{ background-image: linear-gradient(to top, #156e63 0% 50%, #11584f 50% 100%);}

@media (max-width:700px) { 
.confirmation_form p 				{ font-size: 14px;}
.confirmation_form .link 			{ width: 100%; text-align: center; border: none; background: #156e63;}
}



/***** RGPD *****/
#rgpdForm 							{ font: 400 13px/24px "Open Sans"; padding: 0 15px; letter-spacing: 0.8px;}
#rgpdForm input[type=checkbox]		{ width: 20px; height: 20px; display: block; float: left; padding: 0; margin: 6px 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: 40px; font: 400 13px/24px "Open Sans"; letter-spacing: 0.6px;}
#rgpdForm a							{ position: relative; color: #000; border-bottom: 1px solid #444;}
#rgpdFormAcceptError				{ padding: 10px 0 0 40px; color: red; font-size: 13px; line-height: 24px;}

@media (min-width:1201px) {
#rgpdForm a:hover 					{ color: #fff; border-color: #fff;}
}
@media (max-width:700px) { 
#rgpdForm 							{ padding: 0;}
#rgpdForm input[type=checkbox]		{ width: 16px; height: 16px; margin: 4px 0 0 0;}
#rgpdForm label						{ padding-left: 30px; font-size: 11px; line-height: 20px;}
#rgpdFormAcceptError				{ font-size: 11px; line-height: 20px;  padding: 10px 0 0 30px;}
}


/* custom */
.rgpd 								{ margin: 20px 0 30px 0;}

@media (max-width:700px) { 
.rgpd 								{ margin: 15px 0 25px 0;}
}



/***** page devis *****/
#devis .bloc_contact 						{ position: relative; padding: 50px; border-radius: 10px; background: #156e63; margin-bottom: 60px;}
#devis .bloc_contact p						{ font-size: 14px; margin-top: 10px;}
#devis .bloc_contact .titre_main			{ font-size: 24px; line-height: 30px; color: #fff; margin: 0 0 20px 0;}
#devis .bloc_contact p.map					{ background: url("../images/map.svg") 2px 50% no-repeat; padding-left: 35px;}
#devis .bloc_contact a.tel					{ font-size: 14px; background: url("../images/tel.svg") 1px 50% no-repeat; padding: 0 0 0 35px; color: #fff; border: none;}
#devis .bloc_contact a.email				{ font-size: 14px; background: url("../images/email.svg") 0 50% no-repeat; padding: 0 0 0 35px; color: #fff; border: none;}

#devis .bloc_texte 							{ margin-top: 40px; padding-bottom: 20px;}


@media (max-width:1200px) { 

}
@media (max-width:1000px) { 

}
@media (max-width:700px) { 
#devis .bloc_texte 							{ margin-top: 25px; padding-bottom: 0; margin-bottom: -10px;}

}
@media (max-width:450px) {

}
@media (max-width:370px) {

}


#devis .contact_form input[type="text"],
#devis .contact_form input[type="email"],
#devis .contact_form input[type="date"],
#devis .contact_form textarea,
#devis .contact_form select {position:relative;z-index:50;}









