/***** common *****/
#wrapper:after 						{ height: 140px;}


/***** top page *****/
.top_page 							{ position: relative; padding-top: 140px;}
.top_page .content 					{ display: grid; grid-template-columns: 1fr auto; grid-gap: 80px; align-items: start; padding: 40px 0 0 0;}
.top_page .content.no_grid			{ display: block; padding: 40px 0 0 0;}
.top_page .titre_main				{ margin-bottom: 0;}
.top_page .titre 					{ font: 500 20px/30px "Open Sans"; text-transform: none; letter-spacing: 0.6px; color: #000; display: block; padding-top: 5px; margin-bottom: 15px;}
.top_page .chapo 					{ margin: 20px 0 0 0;}
.top_page p 						{ margin: 15px 0 0 0;}

.cta_devis 							{ position: relative; background: #ffb941; border-radius: 10px; overflow: hidden; text-align: center; width: 340px; margin-top: 20px;}
.cta_devis:before					{ width: 500px; height: 500px; background: url("../images/shape.svg") center / contain no-repeat; position: absolute; right: -95%; top: -75%; opacity: 0.2; content: "";}
.cta_devis a.titre_main				{ font-size: 25px; line-height: 35px; color: #fff; padding: 65px 40px; margin: 0; display: block;}

@media (max-width:1200px) {
.top_page 							{ padding-top: 100px;}
.top_page .content 					{ grid-gap: 60px;}
.cta_devis a.titre_main				{ font-size: 22px; line-height: 30px; padding: 65px 40px;}
}
@media (max-width:1000px) { 
.top_page .content 					{ grid-template-columns: 1fr; grid-gap: 40px;}
.top_page .titre 					{ font-size: 18px; line-height: 28px;}
.cta_devis 							{ border-radius: 10px; width: 100%; margin-top: 0;}
.cta_devis a.titre_main				{ font-size: 16px; line-height: 24px; padding: 30px;}
.cta_devis:before					{ width: 400px; height: 400px; right: -25%; top: -100%;}

}
@media (max-width:700px) { 
.top_page 							{ padding-top: 80px;}
.top_page .content 					{ grid-gap: 25px; padding-top: 25px;}
.top_page .titre 					{ font-size: 15px; line-height: 22px; padding-top: 4px; letter-spacing: 0.4px;}
.top_page .chapo 					{ margin: 15px 0 0 0;}
.top_page p 						{ margin: 10px 0 0 0;}


.cta_devis  						{ border-radius: 5px;}
.cta_devis a.titre_main				{ font-size: 12px; line-height: 20px; padding: 15px 25px;}
.cta_devis:before					{ display: none;}

}




/***** breadcrumb *****/
.breadcrumb							{ line-height: 0; position: relative; padding: 60px 0 0 0;}
.breadcrumb li 						{ display: inline-block; font-size: 12px; line-height: 20px; margin-right: 30px; letter-spacing: 0.6px; position: relative;}
.breadcrumb li:after				{ width: 1px; height: 9px; position: absolute; right: -16px; top: 5px; background: #444; content: "";}
.breadcrumb li:last-child:after 	{ display: none;}
.breadcrumb li a.active 			{ color: #ffb941;}

@media (min-width:1201px) {
.breadcrumb a:hover                 { color: #444;}
}
@media (max-width:1200px) { 
.breadcrumb							{ padding: 20px 0 0 0;}
}
@media (max-width:700px) { 
.breadcrumb							{ padding: 10px 0 0 0;}
}



/***** page content *****/
.page 								{ position: relative; padding-bottom: 20px;}
.page p								{ margin-bottom: 15px;}
.page .ul_list a, 
.page p a							{ border-bottom: 1px solid #ccc; padding-bottom: 2px;}


.page .ul_list							{ margin: 0 0 20px 0;}
.page .ul_list li							{ padding: 0 0 0 35px; position: relative; margin-top: 10px; background: url("../images/check.svg") 0 1px no-repeat;}


@media (min-width:1201px) {
.page .ul_list a:hover,
.page p a:hover						{ color: #156e63; border-color: #156e63;}
}
@media (max-width:1200px) {
.page 								{ padding-bottom: 20px;}
}
@media (max-width:700px) {
.page 								{ padding-bottom: 10px;}
.page p								{ margin-bottom: 10px;}
.page .ul_list						{ margin-bottom: 10px;}
.page .ul_list li					{ padding-left: 24px; background-size: 12px auto; margin-top: 5px;}
}



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

.bloc_texte.info              { background: #156e63; border-radius: 5px; color: #ffffff; padding: 50px; font-size: 18px;}
.bloc_texte.info a            { color: #ffffff;}
.bloc_texte.info a:hover      { color: #ffffff;}

@media (max-width:1200px) { 
.bloc_texte							{ margin: 70px auto;}
}
@media (max-width:1000px) { 
.bloc_texte							{ margin: 50px auto;}
}
@media (max-width:700px) { 
.bloc_texte							{ margin: 30px 0;}
.bloc_texte.info                    { padding: 30px; font-size: 16px; border-radius: 3px; }
}



/***** cta *****/
@media (max-width:700px) { 
.bloc_texte.bottom_page .cta		{ margin: 50px -6vw -40px -6vw;}
}



.cadre                                 { background-color: #156e63; padding: 40px; color: #fff; border-radius: 10px}
.cadre h3                              { color: #ffb941; }
@media (max-width:700px) {
.cadre                                 { padding: 20px; border-radius: 5px}
}




/***** services ****
.services                           { position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 40px; padding: 20px 0;}
.services .item                     { position: relative;}
.services .row 						{ position: relative; padding: 60px; border-radius: 15px; background: #ebf3f3; transition: all 400ms ease-in-out;}
.services .row:before 				{ width: 220px; height: 100%; background: url("../images/shape_n.svg") 50% 100% / contain no-repeat; position: absolute; right: 40px; bottom: 0; opacity: 0.05; content: "";} 
.services .row p              		{ margin: 10px 0 0 0; position: relative;}

@media (min-width:1201px) {
.services .item .row:hover 			{ border-color: #8cc738; background: #fff;}
}
@media (max-width:1600px) {
.services .row 						{ padding: 40px;}
}
@media (max-width:1400px) {
.services                           { grid-gap: 30px;}
.services .row:before 				{ width: 200px; right: 30px;} 
.services .titre_cap 				{ margin-bottom: 10px;} 
}
@media (max-width:1200px) {
.services                           { grid-gap: 20px; padding: 10px 0;}
.services .row 						{ padding: 30px; border-radius: 10px;}
.services .row:before 				{ display: none;} 
}
@media (max-width:1000px) {
.services                           { grid-template-columns: 1fr; padding: 0;}
.services .row 						{ padding: 30px 40px;}
}
@media (max-width:700px) {
.services                           { grid-gap: 10px;}
.services .titre_cap 				{ padding-top: 2px;} 
.services .row 						{ padding: 20px 25px; border-radius: 5px; line-height: 24px;}
.services .row p              		{ margin: 8px 0 0 0;}
}


@media (max-width:700px) {
#solution .page 					{ display: grid;}
#solution .page .bloc_cta			{ grid-area: 2;}
}
*/