/***** top page *****/
.top_page 										{ position: relative; padding-top: 170px; background-color: var(--bgColorDark);}
.top_page .content 								{ padding: clamp(20px, 7vw, 40px) 0 clamp(40px, 7vw, 80px); color: #fff;}
.top_page .titre          						{ text-transform: uppercase; letter-spacing: 1.5px; font-size: 14px; color: var(--mainColor2);}
.top_page .sous_titre     						{ font-size: 50px; line-height: 60px; color: #fff;}

@media (max-width:1200px) {
.top_page 										{ padding-top: 120px;}
.top_page .sous_titre     						{ font-size: 40px; line-height: 50px;}
.top_page .titre          						{ font-size: 12px;}
}
@media (max-width:700px) { 
.top_page 										{ padding-top: 64px;}
.top_page .titre          						{ font-size: 10px;}
.top_page .sous_titre     						{ font-size: 25px; line-height: 35px;}
}




/***** breadcrumb *****/
.breadcrumb										{ line-height: 0; position: relative; }
.breadcrumb li 									{ display: inline-block; font-size: 12px; line-height: 20px; margin-right: 30px; letter-spacing: 0.8px; position: relative;}
.breadcrumb li a								{ color: #fff; }
.breadcrumb li:after							{ width: 1px; height: 10px; position: absolute; right: -18px; top: 5px; background: #fff; content: ""; }
.breadcrumb li:last-child:after 				{ display: none;}

@media (min-width:1201px) {
.breadcrumb a:hover                 			{ color: var(--mainColor2);}
}
@media (max-width:700px) { 
.breadcrumb										{ display: none;}
}



/***** text : simple *****/
.txt_simple 									{ position: relative; text-align: center; margin: var(--marginTB);}
.txt_simple p a									{ border-bottom: 1px solid #555;}
.item.txt p a									{ border-bottom: 1px solid #555;}
.txt_simple.align_left							{ text-align: left;}
.txt_simple:before								{ position: absolute; width: 94vw; max-width: calc(47vw + 720px); left: auto; right: 3vw; top: 0; bottom: 0; background: #eee; border-radius: 50px; visibility: hidden; transition: none; content: "";}
.txt_simple svg									{ width: 60px; height: auto; display: block; margin: 0 auto 15px auto;}
.txt_simple :last-child               			{ margin-bottom: 0;}
.txt_simple .link								{ margin-top: 10px;}
.txt_simple .multi_links						{ display: grid; grid-template-columns: 1fr 1fr; max-width: 300px; grid-gap: 10px; margin: 25px 0 0 0;}
.txt_simple .multi_links .link					{ margin: 0; text-align: center; padding: 0;}

/* custom highlight */
.txt_simple .txt_highlight    					{ padding-bottom: 15px;}
.txt_simple .txt_highlight svg  				{ bottom: 0; left: 0; right: 0; margin: 0 auto;}
.txt_simple .txt_highlight svg path				{ fill: var(--mainColor1);}

@media (min-width:1201px) { 
.item.txt p a:hover,
.txt_simple p a:hover                           { color: var(--mainColor1); border-bottom: 1px solid var(--mainColor1);}
.txt_simple .txt_highlight p a:hover            { color: var(--mainColor1); border-bottom: 1px solid var(--mainColor1);}
}


.bloc_highilight                                { padding: 50px; background-color: #fff; }


.assets_v2:before 							{ background: var(--mainColor1);}
.assets_v2 .item ul li                      { font-size: 18px; }
.assets_v2 .container                       { grid-template-columns: 1fr 1fr 400px; }
.assets_v2 .container .sous_titre           { margin-left: 60px; }

@media (max-width:1000px) {
.assets_v2 .container						{ grid-template-columns: 1fr 1fr;}
.assets_v2.reverse .item:first-child  		{ grid-area: auto;}
.assets_v2.reverse .item.photo_surplus 		{ display: none;}
.assets_v2:before 							{ display: none;}
.assets_v2.reverse .item ul  				{ padding-left: 0;}
.assets_v2 .container .sous_titre           { margin-left: 0; }
}
@media (max-width:700px) {
.assets_v2 									{ padding: 0;}
.assets_v2 .container						{ grid-template-columns: 1fr;}
.assets_v2 .item ul li 						{ font-size: 18px; line-height: 28px; }
}




/***** bloc txt img *****/
.bloc_txt_img 											{ position: relative; margin: var(--marginTB); overflow: hidden;}
.bloc_txt_img .item.img:before							{ position: absolute; right: calc(100% + 20px); top: 0; bottom: 0; background: var(--mainColor1); width: 100%; height: 100%; content: "";}
.bloc_txt_img .container	                        	{ display: grid; grid-template-columns: 50% 1fr; grid-gap: 0 80px; align-items: center; position: relative;}
.bloc_txt_img .container>.item							{ position: relative;}
.bloc_txt_img .container>.item :last-child 				{ margin-bottom: 0;}
.bloc_txt_img .container .txt .wrap						{ display: inline-block; text-align: left; max-width: 520px;}
.bloc_txt_img .container .img>img 						{ width: 100%; height: auto; object-fit: cover; display: block; position: relative; z-index: 10; border-radius: var(--imgRadius);}
.bloc_txt_img .container p               				{ margin-bottom: 15px;}
.bloc_txt_img .container .link							{ margin-top: 10px;}
.bloc_txt_img .container .multi_links					{ display: grid; grid-template-columns: 140px 140px; grid-gap: 10px; margin-top: 25px;}
.bloc_txt_img .container .multi_links .link				{ margin: 0; text-align: center; padding: 0;}

.bloc_txt_img.reverse .item.img:before					{ right: inherit; left: calc(100% + 20px);}
.bloc_txt_img.reverse .container 						{ grid-template-columns: 1fr 50%;}
.bloc_txt_img.reverse .container>.item:last-child		{ grid-area: 1 / 1 ;}
.bloc_txt_img.reverse .container>.item:first-child      { grid-area: 1 / 2;}
.bloc_txt_img.reverse .container .txt					{ text-align: right;}
.bloc_txt_img.align_top .container                		{ align-items: start;}

.bloc_txt_img.small_av_ap .container 			        { grid-template-columns: 38% 1fr;}
.bloc_txt_img.reverse.small_av_ap .container 			{ grid-template-columns: 1fr 38%;}
.bloc_txt_img.reverse.small_av_ap .wrap      			{ max-width: inherit;}
.bloc_txt_img.small_av_ap .container .txt .wrap      	{ max-width: inherit;}
    

@media (max-width:1200px) { 
.bloc_txt_img .container	                        	{ grid-gap: 0 60px;}
}
@media (max-width:1000px) { 
.bloc_txt_img .container 								{ grid-template-columns: 1fr; grid-gap: 40px;}
.bloc_txt_img .container .txt .wrap						{ max-width: none;}

.bloc_txt_img.reverse .container 						{ grid-template-columns: 1fr;}
.bloc_txt_img.reverse .container>.item:last-child		{ grid-area: 2;}
.bloc_txt_img.reverse .container>.item:first-child      { grid-area: 1;}

.bloc_txt_img.small_av_ap .container 			        { grid-template-columns: 1fr;}
.bloc_txt_img.reverse.small_av_ap .container 			{ grid-template-columns: 1fr;}

}
@media (max-width:700px) { 
.bloc_txt_img .container	                        	{ grid-gap: 30px;}
.bloc_txt_img .container p               				{ margin-bottom: 10px;}
.bloc_txt_img .container .multi_links					{ grid-template-columns: 1fr 1fr; grid-gap: 10px; margin-top: 20px;}
}


/* before after img */
.before_after_img                               		{ display: grid; position: relative; overflow: hidden; --position: 50%}
.before_after_img img                         			{ width: 100%; height: 100%; object-fit: cover; object-position: left; border-radius: var(--imgRadius);}
.before_after_img img.image_before                      { position: absolute; inset: 0; width: var(--position);}
.before_after_img .range                                { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: grab;}
.before_after_img .range:active                         { cursor: grabbing;}
.before_after_img .range_line                          	{ position: absolute; inset: 0; width: 4px; height: 100%; background-color: #fff; left: var(--position); transform: translateX(-50%); pointer-events: none;}
.before_after_img .range_button 						{ position: absolute; background: #fff; display: grid; top: 50%; left: var(--position); transform: translate(-50%,-50%); pointer-events: none; width: 80px; grid-template-columns: 1fr 1fr; align-items: center;}
.before_after_img .range_button span                    { background: url("../images/arrow_slider.svg") 55% 50% no-repeat; display: block; height: 50px; filter: invert(1);}
.before_after_img .range_button span:first-child 		{ transform: rotate(180deg);}

@media (max-width:700px) { 
.before_after_img .range_line                          	{ width: 2px;}
.before_after_img .range_button 						{ width: 60px;}
.before_after_img .range_button span                    { height: 40px;}
}
}








/***** moving galerie *****/
.wrap_gallery                               { overflow: hidden; background-color: deeppink}
.gallery 							        { 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;}

@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) {
.moving_galerie .row .item img 				{ height: 300px;}
}
@media (max-width:600px) {
.moving_galerie 							{ margin: 10px 0 ;}
.moving_galerie .row .item div 				{ padding: 0 5px;}
.moving_galerie .row .item img 				{ height: 42vw;}
}