html{margin: 0; padding: 0;}

body{
	font-family: 'Ubuntu', sans-serif !important;
	font-weight: 400;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	word-wrap: break-word;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-ms-interpolation-mode: nearest-neighbor;
	text-rendering: optimizeLegibility;
	color: #363638 !important;
}

*, ::after, ::before{box-sizing: inherit !important;}

h1{
	font-family: 'Play', sans-serif !important;
	font-size: 40px;
	line-height: 44px;
	font-weight: 700;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

h2{
	font-family: 'Play', sans-serif !important;
	font-size: 30px;
	line-height: 34px;
	font-weight: 700;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

h3{
	font-family: 'Play', sans-serif !important;
	font-size: 20px;
	line-height: 24px;
	font-weight: 700;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

h4{
	font-size: 16px;
	line-height: 20px;
	font-weight: 700;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

a{color:#353131; text-decoration: none; cursor: pointer; -webkit-transition: all 300ms; transition: all 300ms;}

a:hover,
a:focus{color:#353131; text-decoration: none; outline: none; cursor: pointer;}



/* ------------------ */
/* ----  Header  ---- */
/* ------------------ */

header{background-color: #efefef; position: relative; padding: 0 20px;}

header::before{
	/* background-color: #0a2d81; */
	background-color: #DF0020;
	/* background-color: ##EFEFEF; */
	content: "";
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	z-index: 1;
	height: 80%;
	max-height: 320px;
}

#nav-header{
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	max-width: 1400px;
	margin: 0 auto;
}

.block-contact-header{
	background-color: #FFF;
	border: 1px solid #0a2d81;
	padding: 15px 20px;
	margin-right: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	max-width: 315px;
	width: 100%;
	min-width: 225px;
}

.logo-header .logo-yamaha{display: block; width: 180px; margin-bottom: 14px;}
.logo-header .logo-yamaha img{width: 100%;}

.logo-header .nom-concessionnaire{
	display: flex;
	align-items: center;
	font-size: 22px;
	line-height: 24px;
	color:#3d4045;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	margin-bottom: 15px;
}

.logo-header .nom-concessionnaire span{display: inline-block; margin-right: 6px; font-size: 12px;}

.adress-header{padding: 0 18px 15px; margin-bottom: 24px; border-bottom: 1px solid #353131; font-size: 15px; line-height: 20px;}

.detail-contact{list-style: none; margin: 0; padding: 0; font-weight: 400;}

.phone-banner{font-size: 26px; line-height: 28px; font-weight: 700; margin-bottom: 26px; display: flex; align-items: center;}
.phone-banner span{display: inline-block; padding-top: 4px; margin-right: 10px; font-size: 18px;}

.detail-contact #back-top2{padding-left: 3px;}

.detail-contact #back-top2,
.detail-contact #back-top3,
.detail-contact .contact-email{flex; align-items: center;}

.detail-contact #back-top2 span{display: inline-block; margin-right: 14px; font-size: 20px;}
.detail-contact #back-top3 span,
.detail-contact .contact-email span{display: inline-block; margin-right: 10px; font-size: 20px;}

.detail-contact #back-top2,
.detail-contact #back-top3{cursor: pointer; margin-bottom: 10px; -webkit-transition: all 500ms; transition: all 500ms;}

.detail-contact .contact-header-top{text-decoration: none; color: #353131; -webkit-transition: all 500ms; transition: all 500ms;}

.detail-contact #back-top2:hover,
.detail-contact #back-top3:hover,
.detail-contact .contact-header-top:hover{text-decoration: none; color: #ee2a24;}

.title-header{max-width: 970px; width: 100%;}

.title-header h1{font-size: 40px; color:#FFF; line-height: 42px; font-weight: 700; margin: 50px 0 30px;}

.block-image{display: flex; justify-content: space-between;}

.block-image .img1,
.block-image .img2{border: 1px solid #0a2d81; background-color: #FFF;}
.block-image .img1{margin-right: 20px;}

#Sidebar-header{
	position: absolute;
	z-index: 5;
	left: 380px;
	top: 0;
	width: 100%;
	max-width: 450px;
	height: 0;
	background-color: #FFF;
	opacity: 0;
	box-shadow: 0 1px 20px rgba(0, 0, 0, 0.3);
	-webkit-transition: all 500ms ease;
	transition: all 500ms ease;
}

#Sidebar-header::before{
	content: "";
	position: absolute;
	top: 50%;
	left: -15px;
	margin-top: -25px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 25px 15px 25px 0;
	border-color: transparent #ffffff transparent transparent;
}

#Sidebar-header.show-Sidebar1,
#Sidebar-header.show-Sidebar2,
#Sidebar-header.show-Sidebar3 {top: 58px; height: 310px; opacity: 1;}
#Sidebar-header.show-Sidebar3 {top: 58px; height: 420px; opacity: 1;}

.horaires-detail,
.plan-acces-detail,
.nous-contacter-header{display: none; height: 0; -webkit-transition: all 500ms ease; transition: all 500ms ease;}

.horaires-detail.active-detail,
.plan-acces-detail.active-detail,
.nous-contacter-header.active-detail{display: flex;}

.show-Sidebar1 .closebtn,
.show-Sidebar2 .closebtn,
.show-Sidebar3 .closebtn{opacity: 1;}

.horaires-detail,
.nous-contacter-header{
	height: 420px;
	padding: 15px 20px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.horaires-detail h3,
.nous-contacter-header h3{font-size: 24px; font-weight: 700; text-transform: uppercase;}

.horaires-detail h3{margin-bottom: 18px;}
.nous-contacter-header h3{margin-bottom: 12px;}

.space-top{display: block; margin-top: 15px;}

.form-contact-header{display: flex; flex-direction: column; align-items:center;}

.form-contact-header .form-style,
.form-contact-header textarea{
	padding: 3px 10px;
	border: 1px solid #dddddd;
	font-size: 15px;
	font-weight: 400;
	width: 100%;
	max-width: 270px;
	margin-bottom: 10px;
}

.form-contact-header .form-style{height: 30px;}

.form-contact-header .button-submit{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 120px;
	min-height: 34px;
	padding: 0 10px;
	font-family: 'Play', sans-serif !important;
	background-color: #0a2d81;
	border: none;
	font-size: 16px;
	font-weight: 700;
	color: #FFF;
	cursor: pointer;
	-webkit-transition: all 500ms ease;
	transition: all 500ms ease;
}

.form-contact-header .button-submit:hover{background-color: #071c50; text-decoration: none;}

.closebtn {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #ee2e24;
	position: absolute;
	top: 5%;
	right: 3%;
	z-index: 10;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	font-family: 'Play', sans-serif !important;
	font-size: 34px;
	line-height: 34px;
	cursor: pointer;
	color: #FFF;
	opacity: 0;
	box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-transition: all 500ms ease;
	transition: all 500ms ease;
}

#back-top {
	position: fixed;
	bottom: 20px;
	right: 15px;
	overflow: hidden;
	z-index: 10;
}
#back-top a {
	width: 40px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #bbb;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
	outline: none;
	border-bottom: none;
}
#back-top a:hover {
	color: #000;
}
/* arrow icon (span tag) */
#back-top span {
	width: 40px;
	height: 40px;
	display: block;
	margin-bottom: 7px;
	background: rgba(82,97,108,0.5) url(../img/up-arrow.png) no-repeat center center;
	background-size: 35%;
	border-radius: 5px;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
	background-color: #0a2d81;
}



/* ------------------ */
/* ----  Footer  ---- */
/* ------------------ */


footer{background-color: #363638; padding: 45px 0 30px; color:#afafaf; font-size: 15px; text-align: center;}

footer a{color:#afafaf; -webkit-transition: all 800ms ease; transition: all 800ms ease;}

footer a:hover,
footer a:focus{text-decoration: none; color: #ee2e24;}

footer ul{list-style: none; margin: 0; padding: 0;}

.entry-footer{max-width: 960px; margin: 0 auto; padding: 0 20px; display: flex; justify-content: center; align-items: flex-start;}

.information-footer h4{font-size: 14px; font-weight: 500;}

.information-footer a{
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 14px 0 20px;
	font-size: 16px;
	color: #FFF;
	font-weight: 700;
	text-transform: uppercase;
}

.information-footer span{display: inline-block; margin-right: 8px; font-size: 40px;}

.RS-footer h4{
	margin-bottom: 12px;
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
}

.RS-footer a{display: inline-block; font-size: 24px; margin: 0 10px;}

.nav-footer{max-width: 960px; margin: 30px auto 0; padding: 0 20px;}
.nav-footer ul{display: flex; justify-content: center; align-items: center;}

.nav-footer ul li{background: url(../img/separation-link-footer.png) no-repeat right center; padding: 0 18px;}
.nav-footer ul li:last-child{background: none;}

.copyright-yamaha{margin: 15px 0 0; padding: 18px 20px 0; border-top: 1px solid #afafaf; font-size: 12px; line-height: 16px;}




/* --------------------------- */
/* ----  Demande d essai  ---- */
/* --------------------------- */



.content-demande-d-essai{background-color: #efefef; padding: 20px 20px 20px;}

.demande-d-essai{max-width: 960px; margin: 0 auto;}

.white-zone{
	background-color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	padding: 24px 24px 50px;
	margin-bottom: 40px;
}

.white-zone h2{
	display: flex;
	width:100%;
	margin-bottom: 40px;
	justify-content: flex-start;
	align-items: center;
	font-size: 24px;
	font-weight: 700;
}

.white-zone h2 .number{
	/* background-color: #0a2d81; */
	background-color: #DF0020;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 48px;
	height: 48px;
	margin-right: 22px;
	border-radius: 24px;
	color: #FFF;
	font-size: 32px;
	line-height: 32px;
}

.coordonnees-pour-essai.white-zone{align-items: flex-start;}

.souligne-titre{display: block; width: 93%; max-width: 840px; padding-bottom: 8px; border-bottom: 1px solid #dddddd;}

.block-datepicker{display: flex; justify-content: flex-start; align-items: center; margin-right: 70px; font-weight: 500;}
.periode-de-contact{display: flex; justify-content: space-between; align-items: center; max-width: 400px; width: 100%;}

.form-reserv-essai input::placeholder{color: #333333; opacity: 1;}
.form-reserv-essai input:-ms-input-placeholder{color: #333333;}
.form-reserv-essai input::-ms-input-placeholder{color: #333333;}

.redcolor{color:#eb0000;}

.txt-before{margin-right: 20px;}

.datepicker{background: url(../img/calendar.svg) no-repeat 15px 10px; background-size: 22px 22px;}

.datepicker #date-from, .datepicker #DateEssai {
	background-color: transparent;
	max-width: 221px;
	height: 36px;
	padding-top: 3px;
	border: 1px solid #dddddd;
	padding-left: 50px;
}

.type-de-contact-commerciale{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin: 34px 0 42px;
}

.form-reserv-essai .form-item{position: relative; margin-bottom: 35px;}

.form-reserv-essai .col-left{margin-right: 50px;}
.col-right .co-form{text-align: right; font-size: 12px;}

.col-full {
	flex: 0 0 690px;
	max-width: 100%;
	position: relative;
}

.form-reserv-essai .form-item .form-style.form-style-full {
	width: calc(100% - 5px);
	display: block;
	height: initial;
}

.form-reserv-essai .form-item input{
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	padding-left: 15px;
	padding-right: 15px;
	color: #333;
}

.form-reserv-essai .form-item .form-style{
	display: block;
	height: 36px;
	width: 288px;
	border: 1px solid #dddddd;
	background-color: #FFF;
	font-size: 15px;
	font-weight: 400;
	color: #333333;
}

.form-reserv-essai .form-item .form-style:focus{
	outline: none;
	color: #374256;
}

.form-reserv-essai .form-item .formLabel{
	position: absolute;
	top: 9px;
	left: 15px;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
	color: #374256;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0.02em;
}

.form-reserv-essai .form-item .formTop{
	top:-20px !important;
	font-size: 14px !important;
	background-color: transparent;
	color: #848993 !important;
}

.form-reserv-essai .custom-select2{
  position: relative;
  font-family: Arial;
	width: auto;
	margin-bottom: 20px;
}

.form-reserv-essai .custom-select2 select{display: none;}

.form-reserv-essai .select-selected {border: 1px solid #dddddd;
  background-color: #fff;
}

.form-reserv-essai .select-selected:after{
  position: absolute;
  content: "";
  top: 16px;
  right: 12px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #333 transparent transparent transparent;
}

.form-reserv-essai .select-selected.select-arrow-active:after {
  border-color: transparent transparent #333 transparent;
  top: 10px;
}

.form-reserv-essai .select-items div,.select-selected {
	color: #333333;
	padding: 8px 16px;
	height: 22px;
	cursor: pointer;
	user-select: none;
	font-size: 15px;
}

.form-reserv-essai .select-items {
	position: absolute;
	background-color: #fff;
	border-left: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 99;
}

.form-reserv-essai .select-hide {display: none;}

.form-reserv-essai .select-items div:hover,
.same-as-selected{background-color: rgba(0, 0, 0, 0.1);}


#ui-datepicker-div{
	z-index: 10 !important;
	width: 252px;
	background-color: #FFF;
	border-radius: 0 0 3px 3px;
	border: 1px solid #dddddd;
	box-shadow: 1px 1px 12px rgba(0,0,0,0.16);
}

#ui-datepicker-div .ui-datepicker-header{
	background: #383c40;
	color: #fff;
	font-weight: normal;
	font-size: 16px;
	padding: 10px 0;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-next{
	position: absolute;
	top: 7px;
	width: 1.8em;
	height: 1.8em;
	-webkit-transition: all 0.2s ease;
	transition: color 0.2s ease;
	cursor: pointer;
}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev{left: 4px;}
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-next{right: 4px;}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev:hover{left: 2px;}
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-next:hover{right: 2px;}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev span,
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-next span{
	display: block;
	background: none;
	width: 0;
	height: 0;
	position: absolute;
	top: 50%;
	margin-top: -8px;
	text-indent: -99999px;
	overflow: hidden;
}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-prev span{
	left: 50%;
	margin-left: -8px;
	border-style: solid;
	border-width: 8px 8px 8px 0;
	border-color: transparent #ffffff transparent transparent;
}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-next span{
	right: 50%;
	margin-right: -8px;
	border-style: solid;
	border-width: 8px 0 8px 8px;
	border-color: transparent transparent transparent #ffffff;
}

#ui-datepicker-div .ui-datepicker-calendar{width: 252px; font-size: 0.9em; border-collapse: collapse; margin: 0;}

#ui-datepicker-div .ui-datepicker-calendar thead{
	background-color: #383C40;
	color: #fff;
	border-top: 1px solid #585b5f;
	text-align: center;
	font-size: 12px;
}

#ui-datepicker-div .ui-datepicker-calendar thead th{padding: 5px 0;}

#ui-datepicker-div td .ui-state-active,
#ui-datepicker-div td .ui-state-hover{background: #ee2e24; color: #fff;}

#ui-datepicker-div td .ui-state-highlight{background: #888; color: #fff;}

.ui-datepicker-calendar td .ui-state-default{
	display: block;
	background: transparent;
	border: none;
	text-align: center;
	padding: 3px 4px;
	margin: 0;
	font-weight: 300;
	color: #383737;
	font-size: 16px;
	text-decoration: none;
}

#ui-datepicker-div .ui-state-disabled .ui-state-default{
	display: block;
	background-color: rgba(222,220,220,0.62);
	position: relative;
	border: none;
	text-align: center;
	padding: 3px 4px;
	margin: 0;
	font-weight: 300;
	font-size: 16px;
	color: #BDBDBD;
}

.container1-reserv-essai{
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 0;
	margin-right: 20px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 500;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.container1-reserv-essai input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark-radio{
	position: absolute;
	top: 0;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #FFF;
	border: 1px solid #0a2d81;
	border-radius: 50%;
	-webkit-transition: all 400ms;
	transition: all 400ms;
}

.container1-reserv-essai:hover input ~ .checkmark-radio{background-color: #DDD;}
.container1-reserv-essai input:checked ~ .checkmark-radio{background-color: #0a2d81;}

.checkmark-radio:after {
  content: "";
  position: absolute;
  display: none;
}

.container1-reserv-essai input:checked ~ .checkmark-radio:after{display: block;}

.container1-reserv-essai .checkmark-radio:after {
	top: 6px;
	left: 6px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

.choise-contact{display: flex; justify-content: space-between; align-items: center; width: 100%; max-width: 264px;}

.container2-reserv-essai{
	display: block;
	position: relative;
	padding-left: 32px;
	margin-bottom: 0;
	margin-right: 20px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 500;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.container2-reserv-essai input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark{
	position: absolute;
	top: 2px;
	left: 0;
	height: 18px;
	width: 18px;
	background-color: #FFF;
	border: 2px solid #0a2d81;
	border-radius: 3px;
}

.container2-reserv-essai:hover input ~ .checkmark {background-color: #DDD;}

.container2-reserv-essai input:checked ~ .checkmark {background-color: #0a2d81;}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.container2-reserv-essai input:checked ~ .checkmark:after {display: block;}

.container2-reserv-essai .checkmark:after {
  left: 6px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.form-reserv-essai .button-submit{
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 68px;
	font-family: 'Play', sans-serif !important;
	/* background-color: #0a2d81; */
	background-color: #DF0020; 
	padding: 0 20px;
	border: none;
	font-size: 22px;
	line-height: 24px;
	font-weight: 700;
	color: #FFF;
	cursor: pointer;
	-webkit-transition: all 500ms ease;
	transition: all 500ms ease;
}

.form-reserv-essai .button-submit:hover,
.form-reserv-essai .button-submit:focus {
	background-color: #071c50;
	text-decoration: none;
	color: #FFF;
}

.form-reserv-essai .picto-reserv {
	background-color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 48px;
	min-width: 48px;
	height: 48px;
	margin-right: 20px;
	border-radius: 24px;
	font-size: 31px;
	color: #0a2d81;
}

.mentions-legales-footer-essai{background-color: #efefef; padding: 0 20px 60px;}

.mentions-legales-footer-essai p{max-width: 933px; margin: 0 auto; font-size: 14px; line-height: 18px; text-align: justify;}
.mentions-legales-footer-essai p a{color: #363638; text-decoration: underline;}

.demande-valide.white-zone{padding: 24px 24px 30px;}

.demande-valide h2{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin-bottom: 40px;
	padding-bottom: 8px;
	border-bottom: 1px solid #dddddd;
	font-size: 24px;
	font-weight: 700;
	text-align: center;
}

.demande-valide .txt-valide{text-align: center;}
.demande-valide .txt-valide strong{color:#009c00; display: block; margin-bottom: 20px; font-size: 18px;}
.demande-valide .txt-valide a{color: #363638; text-decoration: underline;}


/* --------------------- */
/* --- Media Queries --- */
/* --------------------- */


@media screen and (max-width: 380px) {
	.block-datepicker .datepicker{background: none;}
	.block-datepicker .datepicker #date-from{padding-left: 15px; width: 90%;}
	.form-reserv-essai .white-zone {padding: 24px 15px 25px;}
	.white-zone .periode-de-contact{flex-direction: column; align-items: center;}
	.periode-de-contact .container1-reserv-essai{margin-bottom: 10px; margin-right: 0;}
	.white-zone h2{font-size: 20px;}
	.white-zone h2 .number{margin-right: 15px;}
	.form-reserv-essai .coordonnees-pour-essai .select-selected::after {right: 12px;}
	.form-reserv-essai .picto-reserv{display: none;}
	.type-de-contact-commerciale{margin: 30px 0;}
	#ui-datepicker-div{margin-left: -10px;}
}

@media screen and (max-width: 540px) {
	.coordonnees-pour-essai.white-zone{flex-direction: column; align-items: center;}
	.form-reserv-essai .coordonnees-pour-essai .col-left{margin-right: 0; width: 100%;}
	.form-reserv-essai .coordonnees-pour-essai .col-right{width: 100%;}
	.form-reserv-essai .select-selected::after{right: 33px;}
	.container2-reserv-essai:last-child{margin-right: 0;}
	.form-reserv-essai .button-submit{font-size: 20px; padding: 5px 15px; min-height: 50px;}
	.form-reserv-essai .picto-reserv{
		width: 38px;
		min-width: 38px;
		height: 38px;
		margin-right: 15px;
		border-radius: 19px;
		font-size: 26px;
	}
	.nav-footer ul{flex-direction: column;}
	.nav-footer ul li{background: none;}
}

@media screen and (max-width: 700px) {
	/* header::before{height: 255px;} */
	header::before{height: 170px;}
	#nav-header{flex-direction: column; align-items: center;}
	.block-contact-header{margin-right: 0;}
	#nav-header .title-header{display: flex; flex-direction: column; align-items: center;}
	.title-header .block-image{justify-content: center;}
	.title-header h1{color: #FFF; margin: 40px 0 30px; text-align: center;}
	.block-contact-header{width: 90%;}
	.txt-before{margin-right: 10px; font-size: 15px;}
	.datepicker{background-position: 10px 13px; background-size: 18px 18px;}
	.datepicker #date-from{width: 80%; padding-left: 36px; font-size: 15px;}
	#nav-header #Sidebar-header{max-width: 320px; width: 320px; left: 50%; margin-left: -160px;}
	#Sidebar-header::before{display: none;}
	#Sidebar-header.show-Sidebar1, #Sidebar-header.show-Sidebar2, #Sidebar-header.show-Sidebar3{top: 255px;}
	.form-reserv-essai .form-item{margin-bottom: 26px;}
}

@media screen and (max-width: 780px) {
	.white-zone{padding: 24px 15px 35px;}
	.white-zone .block-datepicker{margin-right: 0;}
	.white-zone .periode-de-contact{width: 100%; margin-top: 25px;}
	.periode-de-contact .container1-reserv-essai:last-child{margin-right: 0;}
	.souligne-titre{width: 85%;}
	.form-reserv-essai .col-left {margin-right: 15px; width: 44%;}
	.form-reserv-essai .col-right{width: 44%;}
	.form-reserv-essai .form-item{width: 100%;}
	.form-reserv-essai .form-item .form-style,
	.form-reserv-essai .select-selected{width: 100%; max-width: 88%;}
	.type-de-contact-commerciale{text-align: center; font-size: 15px;}
	#Sidebar-header{max-width: 360px;}
	.content-demande-d-essai{padding: 40px 20px 20px;}
	.white-zone{margin-bottom: 20px;}
}

@media screen and (max-width: 960px) {
	.title-header h1{font-size: 36px; line-height: 40px;}
	.title-header .block-image{width: 100%;}
	.title-header .block-image .img1{width: auto; margin-right: 0;}
	.title-header .block-image .img2{display: none;}
	.block-datepicker{margin-right: 30px;}
	.periode-de-contact{width: 50%;}
	.container1-reserv-essai{padding-left: 30px; font-size: 15px; margin-right: 15px;}
}


@media screen and (max-width: 1254px) {
	.block-image{width: 100%; justify-content: flex-start;}
	
	.block-image .img1,
	.block-image .img2{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 330px;
		height: 280px;
		overflow: hidden;
	}
	
	.block-image .img1 img,
	.block-image .img2 img{height: 100%;}
	/* .title-header{max-width: 685px;} */
	#nav-header{justify-content: center; max-width: 980px;}
}

@media screen and (max-width: 1350px) {
	.block-contact-header{width: 225px;}
	#Sidebar-header{left: 288px;}
}