/***** top page *****/
.top_page 									{ position: relative; padding-top: 130px;}
.top_page .content .wrapper 				{ background-color: var(--bgColorLight); border-radius: var(--imgRadius); padding: 30px 60px 80px; }
.top_page .wrap 							{ padding: 0 40px; }
.top_page .titre_main						{ color: var(--mainColor1);}
.top_page .titre_main span					{ font-size: 25px; line-height: 35px;}
.top_page .chapo 							{ color: var(--mainColor1); padding-top: 5px;}
.top_page .cta.wrapper                      { padding: 0; }
.top_page p 								{ margin: 15px 0 0 0;}

@media (max-width:1200px) {
.top_page 									{ padding-top: 120px;}
.top_page .content .wrapper 				{ padding: 20px 50px 60px; }
}
@media (max-width:1000px) { 
.top_page 									{ padding-top: 100px;}
}
@media (max-width:700px) { 
.top_page 									{ padding-top: 75px;}
.top_page .content .wrapper 				{ padding: 20px 25px 20px; }
.top_page .wrap 							{ padding: 0; }
}





 /***** breadcrumb *****/
.breadcrumb							{ position: relative; z-index: 50; font-size: 14px; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color: var(--mainColor2); padding-top: 50px; }
.breadcrumb li 						{ display: inline; margin-right: 30px; letter-spacing: 0.8px; position: relative;}
.breadcrumb li:after				{ width: 1px; height: 10px; position: absolute; right: -16px; top: 3px; background: var(--mainColor1); content: "";}
.breadcrumb li:last-child:after 	{ display: none;}
.breadcrumb li a 		 			{ color: var(--mainColor1);}
.breadcrumb li a.active 			{ color: var(--mainColor1);}

@media (max-width:1200px) { 

}
@media (max-width:1000px) { 
.breadcrumb							{ position: static; margin-bottom: 25px;}
}
@media (max-width:700px) { 
.breadcrumb							{ display: none;}
}




/***** page content *****/
.page 								{ position: relative;}
.page p								{ margin-bottom: 15px;}
.page .ul_list a, 
.page p a							{ border-bottom: 1px solid #ccc; padding-bottom: 2px;}
.page .ul_list						{ margin: 20px 0;}
.page .ul_list li					{ padding: 0 0 0 20px; position: relative; margin-top: 10px; background: url("../images/list_mainColor2.svg") 0 9px no-repeat;}
.page .ul_check						{ margin: 20px 0;}
.page .ul_check li					{ padding: 0 0 0 35px; position: relative; margin-top: 10px; background: url("../images/check_mainColor2.svg") 0 6px no-repeat;}

@media (min-width:1201px) {
.page .ul_list a:hover,
.page p a:hover						{ color: var(--blue); border-color: var(--blue);}
}
@media (max-width:1200px) {

}
@media (max-width:700px) {
.page p								{ margin-bottom: 10px;}
.page .ul_list						{ margin: 15px 0;}
.page .ul_list li					{ padding-left: 18px; margin-top: 8px; background-position: 0 7px;}
.page .ul_check						{ margin: 15px 0;}
.page .ul_check li					{ padding: 0 0 0 28px; margin-top: 8px; background-size: 16px auto;}
}




/***** bloc texte *****/
.bloc_texte							{ margin: var(--marginTB); position: relative;}
.bloc_texte :last-child				{ margin-bottom: 0;}
.bloc_texte img,
.bloc_texte video					{ width: 100%; height: auto; display: block;}




/***** valeurs *****/
#about .valeurs 										{ position: relative; text-align: center; padding: 160px 0; background: var(--mainColor1); color: #fff;}
#about .valeurs .titre_main								{ display: none;}
#about .valeurs ul 										{ position: relative;}
#about .valeurs li 										{ display: inline-block; font-size: 20px; line-height: 30px; letter-spacing: 1px; margin-right: 50px; position: relative;}
#about .valeurs li:after								{ width: 3px; height: 20px; position: absolute; right: -28px; top: 4px; background: var(--mainColor2); content: "";}
#about .valeurs li:last-child  							{ margin: 0;}
#about .valeurs li:last-child:after 					{ display: none;}

#about .valeurs .moving_text 							{ width: 100vw; position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 140px; overflow: hidden;}
#about .valeurs .moving_text .row 						{ display: flex;}
#about .valeurs .moving_text .row .item 				{ display: grid; grid-template-columns: 1fr 1fr; grid-gap: 5vw; white-space: nowrap; font: 900 150px/140px "Raleway"; text-transform: uppercase; letter-spacing: 15px; color: var(--blue); opacity: 8%; padding-left: 5vw; animation: moving_text_valeurs 35s linear infinite;}

@keyframes moving_text_valeurs {
0%														{ transform: translate(-100%, 0);}
100% 													{ transform: translate(0%, 0);}
}

#about .bloc_ora_groupe 								{ grid-template-columns: 1fr auto; padding-top: 120px; border-top: 2px solid var(--mainColor2);}
#about .bloc_ora_groupe img 							{ display: block; height: auto; border: 1px solid #ddd; width: 180px;}
#about .bloc_ora_groupe .grid_logos 					{ display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 15px;}

@media (max-width:1600px) {
#about .valeurs 										{ padding: 140px 0;}
#about .valeurs li 										{ font-size: 18px;}
#about .valeurs .moving_text 							{ height: 130px;}
#about .valeurs .moving_text .row .item 				{ font-size: 140px; line-height: 130px;}
#about .bloc_ora_groupe img 							{ width: 160px;}
}
@media (max-width:1400px) {
#about .bloc_ora_groupe 								{ padding-top: 100px;}
}
@media (max-width:1400px) {
#about .valeurs 										{ padding: 120px 0;}
#about .valeurs .moving_text 							{ height: 110px;}
#about .valeurs .moving_text .row .item 				{ font-size: 120px; line-height: 110px;}
#about .bloc_ora_groupe img 							{ width: 140px;}
}
@media (max-width:1200px) {
#about .valeurs 										{ padding: 100px 0;}
#about .valeurs li 										{ font-size: 16px;}
#about .valeurs li:after								{ height: 16px; top: 6px;}
#about .valeurs .moving_text 							{ height: 90px;}
#about .valeurs .moving_text .row .item 				{ font-size: 100px; line-height: 90px;}
#about .bloc_ora_groupe 								{ padding-top: 80px;}
}
@media (max-width:1000px) {
#about .bloc_columns .grid                    			{ grid-template-columns: 1fr 1fr 1fr;}
#about .bloc_ora_groupe 								{ grid-template-columns: 1fr;}
#about .bloc_ora_groupe img 							{ width: 100%;}
}
@media (max-width:700px) {
#about .valeurs 										{ padding: 45px 0; text-align: left;}
#about .valeurs ul 										{ column-count: 2; padding: 0 20px;}
#about .valeurs li 										{ display: block; margin: 0 0 5px 0; font-size: 14px; background: url("../images/check_mainColor2.svg") 0 8px no-repeat; padding: 0 0 0 28px; background-size: 16px auto;}
#about .valeurs li:after								{ display: none;}
#about .valeurs .moving_text 							{ height: 80px;}
#about .valeurs .moving_text .row .item 				{ font-size: 60px; line-height: 80px;}

#about .bloc_columns .grid                    			{ grid-template-columns: 1fr;}
#about .bloc_columns.cta_links .grid 					{ grid-template-columns: 1fr 1fr;}

#about .bloc_ora_groupe 								{ padding-top: 35px; grid-gap: 25px;}
#about .bloc_ora_groupe .grid_logos 					{ grid-gap: 10px;}
#about .bloc_ora_groupe img 							{ object-fit: contain; aspect-ratio: 1.25/1;}
}
@media (max-width:500px) {
#about .bloc_columns.cta_links .grid 					{ grid-template-columns: 1fr;}
}




/***** page generale services *****/
#services .list_services 								{ position: relative; display: grid; padding-right: 40%;}
#services .list_services .item 							{ border-bottom: 1px solid #ddd;}
#services .list_services .item .icon  					{ width: 120px; padding: 30px; background: var(--mainColor2); border-radius: 50% 50% 50% 0; margin-bottom: 25px;}
#services .list_services .sous_titre 					{ display: grid; align-items: center; margin: 0; background: url("../images/arrow_link_mainColor2.svg") right center no-repeat; font-size: 22px; line-height: 30px; padding-right: 40px; min-height: 90px;}
#services .list_services .sous_titre .icon  			{ display: none;}
#services .list_services .texte 						{ position: absolute; right: 0; top: 0; max-width: 520px; width: 40%; padding-left: 80px; opacity: 0; visibility: hidden;}
#services .list_services .link 							{ float: right; width: 100%; height: 90px; margin-top: -90px; opacity: 0;}

@media (min-width:1201px) {
#services .list_services .item:last-child 				{ border-bottom: none;}
#services .list_services .sous_titre 					{ transition: color 300ms ease-in-out;}
#services .list_services .item.active .sous_titre		{ color: var(--mainColor2);}
#services .list_services .item.active .texte			{ opacity: 1; visibility: visible;}
}
@media (max-width:1200px) {
#services .list_services 								{ padding-right: 0; grid-gap: 20px;}
#services .list_services .item 							{ padding: 40px; border: 1px solid #ddd; position: relative;}
#services .list_services .sous_titre 					{ margin: 0 0 20px 0; grid-template-columns: auto 1fr; grid-gap: 20px;}
#services .list_services .sous_titre .icon  			{ display: block; width: 90px; padding: 22px; background: var(--blue); border-radius: 50%; margin: 0;}
#services .list_services .texte 						{ position: relative; right: auto; top: auto; max-width: none; width: 100%; padding-left: 0; opacity: 1; visibility: visible;}
#services .list_services .texte .icon					{ display: none;}
#services .list_services .link 							{ float: none; margin: 0; position: absolute; left: 0; top: 40px;}
}
@media (max-width:1000px) {
#services .top_page .bloc_grid .photo img 				{ object-position: center bottom;}
}
@media (max-width:700px) {
#services .list_services 								{ grid-gap: 30px;}
#services .list_services .item 							{ padding: 0 0 30px 0; border: none; border-bottom: 1px solid #ddd;}
#services .list_services .item:last-of-type				{ padding: 0; border-bottom: 0;}
#services .list_services .sous_titre 					{ margin: 0 0 15px 0; grid-template-columns: auto 1fr; grid-gap: 15px; font-size: 16px; line-height: 24px; min-height: 60px;}
#services .list_services .sous_titre .icon  			{ width: 60px; padding: 15px;}
#services .list_services .link 							{ height: 60px; top: 0;}
#services .moving_img									{ padding-bottom: 50px;}
}




/***** page service *****/
#service .intro 										{ padding: 120px 0 120px 200px; max-width: 80%; position: relative;}
#service .intro img										{ width: 120px; height: auto; display: block; position: absolute; left: 0; top: 50%; margin-top: -80px;}
#service .intro .chapo									{ font-size: 20px; line-height: 36px;}

@media (max-width:1600px) {
#service .intro .chapo									{ font-size: 18px; line-height: 34px;}
}
@media (max-width:1400px) {
#service .intro 										{ padding: 120px 0 100px 180px; max-width: none;}
#service .intro img										{ width: 100px; margin-top: -60px;}
}
@media (max-width:1200px) {
#service .intro 										{ padding: 100px 0 80px 140px;}
#service .intro img										{ width: 80px; margin-top: -50px;}
#service .intro .chapo									{ font-size: 16px; line-height: 32px;}
}
@media (max-width:1000px) {
#service .intro 										{ padding: 30px 0 60px 0;}
#service .intro img										{ width: 80px; position: static; margin: 0 0 20px 0;}
}
@media (max-width:700px) {
#service .intro 										{ padding: 5px 0 30px 0;}
#service .intro img										{ width: 60px;}
#service .intro .chapo									{ font-size: 14px; line-height: 28px;}

}





/***** blocquote *****/
.blocquote                          { position: relative; background:#fff; box-shadow: 0 0 40px 0 rgba(0,29,153,0.12);  text-align: center; font-style: italic; font-size: 20px; letter-spacing: 30px; letter-spacing: 0.5px; padding:45px 40px; margin: 80px 0; border-radius: 10px;}
.blocquote .titre                   { position: absolute; left: 30px; top: -20px; background: var(--mainColor2); padding: 8px 20px; text-transform: uppercase; color: var(--white); border-radius: 5px; letter-spacing: 1px; font-size: 12px; font-weight: 600;}

@media (max-width:1000px) {
.blocquote                          { margin: 70px 0 50px;}
}
@media (max-width:700px) {
.blocquote                          { border-radius: 10px; padding: 30px 20px; font-size: 16px;}
}