/***** champs formulaire *****/ 
label								{ font-weight: 600; font-size: clamp(16px, 1.4vw, 18px); color: var(--darkBlue); display: block; margin: clamp(25px, 7vw, 40px) 0 clamp(10px, 1.6vw, 15px) 0;}
label span							{ color: #e81e3f;}
select,
input,
textarea 							{ width: 100%; height: 70px; font: 400 clamp(14px, 1.2vw, 16px)/170% "Montserrat"; letter-spacing: 0.2px; padding: 0 25px 2px 25px; border-radius: var(--radiusXS); border: 1px solid #d4d4d4; background: #fff; color: var(--darkBlue);}
select								{ -webkit-appearance: none; appearance: none; background: url("../images/arrow_down_blue.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: 22px; height: 22px; display: block; float: left; padding: 0; margin: 0;}
input[type=radio] 					{ -webkit-appearance: radio; -ms-appearance: radio; appearance: radio; -moz-appearance: radio; -o-appearance: radio; width: 22px; height: 22px; 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;}*/
input[type=submit] { cursor: pointer;}
select:focus,
input:focus,
textarea:focus 						{ border-color: var(--bgColorDark); outline: 1px solid var(--bgColorDark);}


.checkbox,
.radio								{ line-height: 20px; margin-bottom: 15px;}
.checkbox input,
.radio input								{ margin-right: 10px;}

.checkbox label,
.radio label						{ margin: 0; font-size: clamp(14px, 1.2vw, 16px); font-weight: 400; line-height: 22px;}

/*
.checkbox input[type=checkbox],
.radio input[type=radio]			{ width: 22px; height: 22px; margin: 0; float: left; margin-right: 10px; border: 1px solid var(--darkBlue); border-radius: var(--radiusXS); padding: 0;}
*/


::placeholder 						{ color: var(--darkBlue); opacity: 0.5;}

@media (max-width:1200px) { 
label								{ font-size: clamp(15px, 3vw, 18px);}
select,
input,
textarea 							{ font-size: clamp(13px, 2.8vw, 15px);}
}
@media (max-width:700px) { 
select,
input,
textarea 							{ height: 55px; padding: 0 18px;}
textarea							{ padding: 15px 18px;}
}



/***** page contact *****/
#contact .top_page .content					{ grid-template-columns: 1fr 60%; gap: 40px; align-items: center; min-height: 40vh;}

.top_page .coordonnees  					{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px;}
.top_page .coordonnees .item				{ background: #fff; color: var(--txtColor); padding: 30px 35px 35px; }
.top_page .coordonnees img					{ width: 100%; height: auto; display: block; border-radius: var(--imgRadius); margin-top: 20px;}
.top_page .coordonnees p					{ margin: clamp(10px, 2vw, 15px) 0 0 0; padding-left: 35px;}
.top_page .coordonnees p a					{ border: none; padding-bottom: 0;}
.top_page .coordonnees .icon 				{ padding-left: 35px; position: relative; display: inline-block;}
.top_page .coordonnees .icon:after 			{ width: 18px; height: 100%; position: absolute; left: 0; top: 0; content: "";}
.top_page .coordonnees .gsm a:after 		{ background: url(../images/gsm.svg) 2px 50% no-repeat;}
.top_page .coordonnees .tel a:after 		{ background: url(../images/tel.svg) 0 50% no-repeat;}
.top_page .coordonnees .email a:after 		{ background: url(../images/email.svg) 0 50% no-repeat;}
.top_page .coordonnees .hours span:after 	{ background: url("../images/clock.svg") 0 7px no-repeat;}
.top_page .coordonnees .address span:after 	{ background: url("../images/map.svg") 0 7px no-repeat;}
.top_page .coordonnees .hours 				{ padding-bottom: 10px;}


@media (min-width:1201px) { 
.coordonnees p a:hover						{ color: var(--mainColor1);}
}
@media (max-width:1500px) { 
#contact .top_page .content					{ grid-template-columns: 1fr ; gap: 30px; }
}
@media (max-width:1200px) { 
#contact .grid_bloc>.wrapper				{ padding-top: var(--marginT);}
#contact .grid_bloc .container				{ grid-template-columns: 1fr 320px;}
}
@media (max-width:1000px) { 
#contact .grid_bloc .container				{ grid-template-columns: 1fr; grid-gap: 6vw;}
.coordonnees img							{ margin-top: 6vw;}
.coordonnees>div							{ padding: 5vw;}
}
@media (max-width:700px) { 
#contact .grid_bloc .container				{ padding-top: 6vw;}
.top_page .coordonnees  					{ grid-template-columns: 1fr; grid-gap: 10px;}
.top_page .coordonnees .item				{ padding: 20px;}
}



.formulaire 								{ padding: clamp(20px, 4vw, 50px); border-radius: calc(var(--linkRadius) + 5px); background: #fff; box-shadow: rgba(0 0, 0, 0.08) 0 0 60px 0; color: var(--txtColor); position: relative;}
.formulaire .alert							{ padding-bottom: 5px;}
.formulaire .label i						{ font-size: 13px;}
.formulaire .titre_cap						{ padding-bottom: 5px;}
.formulaire .line 							{ margin: 20px 0 25px 0; height: 1px; background: #ddd;}
.formulaire .grid 							{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0 15px;}
.formulaire .adresse .grid 					{ grid-template-columns: 1fr 30%;}
.formulaire .adresse .grid.reverse			{ grid-template-columns: 30% 1fr;}
.formulaire .adresse .grid>div				{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 15px;}
.formulaire .link 							{ width: 100%; text-align: center; border: none;}

@media (max-width:700px) { 
.formulaire         						{ padding: 30px 0; }
.formulaire .label i						{ font-size: 12px;}
.formulaire .line 							{ margin: 18px 0 20px 0;}
.formulaire .grid 							{ grid-template-columns: 1fr; grid-gap: 20px;}
.formulaire .adresse .grid 					{ grid-template-columns: 1fr;}
.formulaire .adresse .grid.reverse			{ grid-template-columns: 1fr;}
.formulaire .adresse .grid>div				{ grid-gap: 10px;}
.formulaire .link 							{ height: 48px; padding-bottom: 2px;}
}


/***** confirmation formulaire *****/
.confirmation_form			 				{ text-align: center; padding: 30px; background: #ff0000; color: #ffffff; max-width: 800px; margin: 0 auto; }
.confirmation_form p			 			{ margin: 5px 0 20px 0;}
.confirmation_form p b			 			{ text-transform: uppercase;}



/***** RGPD *****/
#rgpdForm 									{ font: 400 13px/24px "Montserrat"; 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 "Montserrat"; letter-spacing: 0.6px;}
#rgpdForm a									{ position: relative; color: var(--red);}
#rgpdFormAcceptError						{ padding: 5px 0 0 30px; color: var(--red);}

@media (min-width:1201px) {
#rgpdForm a:hover 							{ color: var(--txtColor);}
}
@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;}
}


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

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







/***** page contact *****/
#contact .grid_sticky            						{ position: relative;}
#contact .grid_sticky .fullw      						{ margin-top: 20px;}
#contact .grid_sticky .content 							{ margin: 0 auto; }
#contact .grid_sticky .content label:first-of-type 		{ margin-top: 0;}

#contact .grid_sticky .confirmation_form 				{ margin-top: calc(clamp(10px, 4vw, 60px) + clamp(20px, 6vw, 100px) + clamp(30px, 5vw, 100px));}


@media (min-width:1201px) { 
#contact .coordonnees .contact_infos a:hover			{ filter: brightness(1);}
}
@media (max-width:1500px) { 

}
@media (max-width:1200px) { 
#contact .top_page .titre_main .icon					{ padding-right: 100px;}

#contact .coordonnees  									{ width: 100%; margin-top: 0;}

}
@media (max-width:700px) { 
#contact .top_page .wrapper_small						{ width: 90vw; text-align: center;}
#contact .top_page .titre_main  						{ margin-top: -15px;}
#contact .top_page .titre_main .icon					{ padding-right: 0; position: static;}
#contact .coordonnees .bloc_shadow						{ padding: 7vw;}
#contact .coordonnees .adresse 							{ padding: 5px 0 10px 0;}
#contact .coordonnees .adresse a						{ font-size: 12px;}
#contact .coordonnees .adresse a:after					{ margin-bottom: -5px; margin-right: 3px;}
#contact .coordonnees .contact_infos p					{ margin: 10px 0 5px 0;}
}



/**** uploads ****/
.uploads                     { border: 1px solid #cccccc; border-radius: 0; padding: 20px; margin-top: 40px; margin-bottom: 40px;}
.uploads a                   { color: #5b5954; border-bottom: 1px solid #5b5954;}

.custom-file-input                             { color: transparent;display: block; margin-bottom: 0; border: none; padding: 0; height: inherit;}
.custom-file-input::-webkit-file-upload-button { visibility: hidden;}

.custom-file-input::before                { content: "Choisir un fichier"; color: #ffffff; display: inline-block; background: #ff0000; padding: 10px 22px; outline: none; white-space: nowrap; -webkit-user-select: none; cursor: pointer; font-weight: 300; border-radius: 0; outline: none;  }
.custom-file-input:focus                  {	outline: none !important;}
.custom-file-input:active::before         { transform: scale(.9) translate(0px, 2px); box-shadow:  inset 4px 4px 5px 0px rgba(0, 0, 0, 0.20); }















