.banner 								{ position: relative; padding-top: 160px; margin-top: 0; z-index: 20;}
.banner .container						{ display: grid; grid-template-columns: 1fr 60%; grid-gap: 80px; align-items: center;}
.banner .slider img                     { width: 100%; height: auto; display: block; object-fit: cover; border-radius: var(--allImgBR); }
.banner .txt 							{ position: relative; padding-bottom: 10px;}
.banner .txt .wrap   					{ max-width: 580px}
.banner .txt p  						{ font-size: 18px; padding: 20px 0 30px 0;}


@media (max-width:1400px) {
.banner .container						{ grid-gap: 40px; align-items: center;}
}

@media (max-width:1200px) {
.banner 								{ padding-top: 150px;}
}

@media (max-width:1000px) {
.banner .container						{ grid-template-columns: 1fr;}
.banner .img   							{ grid-area: 1; overflow: hidden;}
.banner .txt .wrap   					{ text-align: center;  max-width: 100%}
.banner .slider img                     { width: 100%; height: 50vw;}
}

@media (max-width:700px) {
.banner 								{ padding-top: 110px;}
.banner .container						{ grid-gap: 30px;}
.banner .txt p  						{ font-size: 16px; padding: 10px 0 20px 0;}
}



/***** horaires *****/
.horaires               { position: relative; background-color: var(--bgColorDark); color: var(--colorBody); width: 100%; padding: 10px 0 10px 30px; vertical-align: top; margin-top: 25px; transition: all 300ms ease-in-out; z-index: 20; border-radius: var(--allImgBR);}
.horaires p             { cursor: pointer; position: relative; margin: 0; z-index: 10; color:var(--mainColor1); text-transform: uppercase; font-weight: 600}
.horaires p span        { display: block; color: #fff; text-transform: none; font-weight: 400}
.horaires p:after         { width: 50px; height: 50px; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); background: url("../images/arrow_down.svg") 50% 52% no-repeat transparent; content:""; z-index: 20;}
.horaires p.active:after { transform: rotate(-180deg) translateY(50%);}
.horaires ul            { width: 100%; background: var(--mainColor3); text-align: left; line-height: 30px; padding: 0 30px 20px; position: absolute; left: 0; top: 100%; color: #fff; display: none; margin-top: -10px;}
.horaires li            { display: grid; grid-template-columns: 80px 1fr; align-items: center;}
.horaires li.title      { display: block;}
.horaires li span       { text-align: left; padding: 0 0 0 30px;}

@media (max-width:1200px) {
.horaires               { text-align: left; z-index: 20;}
}
@media (max-width:600px) {
.horaires               { padding: 15px 0 15px 20px; margin-top: 20px; }
.horaires ul            { padding: 40px 20px 20px;}
}

/***** quote */

.quote_txt_img 											{ position: relative;}
.quote_txt_img .item							        { position: relative; text-align: center}
.quote_txt_img .gridlinks							    { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 20px; margin-top: 50px}
.quote_txt_img .gridlinks a							    { height: 80px; line-height: 80px; font-size: 20px}




@media (max-width:1200px) { 
.quote_txt_img .container	                        	{ grid-gap: 0 40px;}
}

@media (max-width:700px) { 
.quote_txt_img 											{ margin: 20px 0;}
.quote_txt_img .gridlinks							    { grid-template-columns: 1fr;}
.quote_txt_img .container	                        	{ grid-template-columns: 1fr; grid-gap: 25px; text-align: left;}
.quote_txt_img .container p               				{ margin-bottom: 10px;}
.quote_txt_img .gridlinks a							    { height: 60px; line-height: 60px; font-size: 16px}
}


/***** Atouts *****/
.atouts .grid						{ display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; align-items: center; align-items: start; }
.atouts .grid .item				    { position: relative; display: block; text-align: center; background:var(--bgColorDark); padding: 20px 40px 50px 40px; border-radius: var(--allImgBR);}
.atouts .grid .item .img			{ position: relative; display: block; margin: 25px auto; border: 1.5px solid #fff; width: 80px; height: 80px; border-radius:50%}
.atouts .grid .item .img img		{ width: 60px; height: 60px; margin: 10px auto 0 auto}
.atouts .grid .item span			{ position: relative; display: block; line-height: 20px; text-align: center; color: var(--mainColor1); margin: 0 auto 20px auto; font: 600 25px/32px "DM Sans"; letter-spacing: 1.5px}

@media (max-width:1200px) {
.atouts							    { margin: 90px 0 100px; }
}
@media (max-width:1000px) {
.atouts							    { margin: 70px 0 80px; }
.atouts .grid						{ grid-gap: 10px; }
.atouts .grid .item img			    { width: 50px; margin: 15px auto; }
.atouts .grid .img:before	        { width: 90px; height: 90px;}
.atouts .grid .item span			{ margin: 0 auto 20px auto;}
}

@media (max-width:700px) {
.atouts							    { margin: 40px 0 60px; }
.atouts .grid						{ grid-template-columns: 1fr;}
}



/***** moving galerie *****/
.gallery 							        { margin: 80px 0; position: relative; overflow: hidden}
.moving_galerie 							{ width: auto; left: 50%; transform: translateX(-50%); position: relative; text-align: center; margin: 20px 0 ;}
.moving_galerie .row 						{ width: auto; display: flex;}
.moving_galerie .row .item 					{ width: auto; display: flex; animation: scroll_gallery 100s linear infinite;}
.moving_galerie.sens_inverse .row .item 	{ animation: scroll_gallery_invert 100s linear infinite;}
.moving_galerie .row .item div 				{ padding: 0 10px;}
.moving_galerie .row .item img 				{ width: auto; height: 400px; display: block; margin: 0 auto; transition: all 300ms ease-in-out; border-radius: var(--allImgBR);}

@keyframes scroll_gallery {
0%											{ transform: translate(0, 0);}
100% 										{ transform: translate(-100%, 0); }
}
@keyframes scroll_gallery_invert {
0%											{ transform: translate(-100%, 0);}
100% 										{ transform: translate(0, 0); }
}
@media (max-width:1400px) {
.moving_galerie .row .item img 				{ height: 380px;}
}
@media (max-width:1200px) {
.moving_galerie .row .item img 				{ height: 350px;}
}
@media (max-width:1000px) {
.gallery 							        { margin: 60px 0;}
.moving_galerie .row .item img 				{ height: 300px;}
}
@media (max-width:600px) {
.gallery 							        { margin: 40px 0;}
.moving_galerie 							{ margin: 10px 0 ;}
.moving_galerie .row .item div 				{ padding: 0 5px;}
.moving_galerie .row .item img 				{ height: 50vw;}
}