.sous_titre 				        { color: #60a6b7 ;}
.page .link.sticked                 { opacity: 1; visibility: visible; left: auto; right: 30px; top: 410px; transform-origin: right;}

/***** top page *****/
.top_page 							{ position: relative; background: #12323f; color: #fff;}
.top_page::before                   { content: "";display: block; position: absolute; top: 0;left: 0;width: 100%;height: 250px;background: linear-gradient(to bottom, #12323f, rgba(0,0,0,0)); z-index: 1;
}
.top_page .wrapper                  { padding: 180px 0 100px 0; z-index: 20; min-height: 756px;}
.top_page::after                    { content: ""; background: url(../images/vague-7.svg) no-repeat bottom; width: 100%; height: 100%; top: 0; left: 0;position: absolute;  background-size: contain;}
.top_page .titre_main				{ color: #fff; font-size: 60px; line-height: 70px; margin-bottom: 5px;}
.top_page .chapo 					{ margin: 20px 0 0 0;}
.top_page .texte                    { max-width: 50%; padding-right: 115px;}
.top_page .photo                    { position: absolute; width: 50%; right: 0; top: 0; height: 100%;}
.top_page .photo img                { width: 100%; height: 100%; object-fit: cover;}
@media (max-width:1200px) {
.top_page .texte                    { padding-right: 80px;}
.top_page .titre_main               { font-size: 40px; line-height: 50px;}
.top_page .wrapper                  { padding-bottom: 150px ;}
}
@media (max-width:1000px) {
.top_page .photo    				{ display: none;}
.top_page .texte 					{ max-width: 100%; padding: 0;}
.top_page::after                    { display: none;}
.top_page .wrapper                  { padding-bottom: 80px;}
.top_page .wrapper                  { min-height: 600px;}
}
@media (max-width:600px) {
.top_page .photo    				{ display: none;}
.top_page .texte 					{ max-width: 100%; padding: 0;}
.top_page::after                    { display: none;}
.top_page .wrapper                  { padding: 150px 0 50px; min-height: 450px;}
}




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

@media (min-width:1201px) {
.breadcrumb a:hover                 { color: #60a6b7;}
}
@media (max-width:1000px) {
.breadcrumb                         { padding-bottom: 50px;}
}
@media (max-width:600px) { 
.breadcrumb							{ display: none;}
}

.atouts                             { display: grid; grid-template-columns: auto 340px; gap: 80px; margin: 90px 0 110px; align-items: start;}
.stats                              { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; justify-content: start; gap: 60px; margin-top: 50px;}
.stats .arround                     { display: grid; width: 150px; height: 150px; align-items: center; justify-content: center; background-color: #60a6b7; font: 400 50px/40px 'DM Serif Display'; color: #fff; border-radius: 50%; margin: 0 auto;}
.stats .stitre                      { font: 400 16px/26px "poppins"; margin-top: 15px; text-align: center;}
.atouts .info                       { background: url(../images/bg_footer.svg) no-repeat center #12323f; padding:50px 30px; border-radius: 20px; margin: 20px 0 8px; }
.atouts .info_detail                { display: grid; grid-template-columns: 1fr 1fr; color: #fff; gap: 10px 30px; }
.atouts .info .sous_titre           { color: #fff;}
.atouts .link                       { display: block; margin-top: 40px;}

@media (max-width: 1300px) {
.atouts .stats                      { gap: 30px;}
}

@media (max-width: 1200px) {
.atouts                             { gap: 30px; grid-template-columns: auto 320px;}
.atouts .arround                    { width: 130px; height: 130px;}
.atouts .stats                      { gap: 20px;}
}
@media (max-width:1000px) {
.atouts                             {  grid-template-columns: 1fr; gap: 0; margin: 80px 0;}
.atouts .info                       { width: 100%; max-width: 450px; margin: 30px auto 0; padding: 30px 40px; border-radius: 5px; background:#12323f;}
}
@media (max-width:700px) {
.atouts .arround                    { width: 120px; height: 120px; font-size: 30px; line-height: 40px;}
}
@media (max-width:600px) {
.atouts                             { margin: 40px 0;}
.atouts .stats                      { grid-template-columns: 1fr 1fr; margin-top: 30px;}
.stats .stitre                      { font-size: 14px; line-height: 20px; margin-top: 10px;}
.atouts .info                       { padding: 25px 20px ;}
.atouts .link                       { margin-top: 20px;}
.atouts .info_detail                { gap: 15px;}
}
/***** page content *****/
.page 								{ position: relative; padding-bottom: 20px;}
.page p								{ margin-bottom: 15px;}
.page .ul_list li                   { margin-top: 0;}
.page .ul_list a, 
.page p a							{ border-bottom: 1px solid transparent; padding-bottom: 2px;}

@media (min-width:1201px) {
.page .ul_list a:hover,
.page p a:hover						{ color: #60a6b7; border-color:#60a6b7;}
}
@media (max-width:1200px) {
}
@media (max-width:1000px) {
}
@media (max-width:600px) {
.page 								{ padding-bottom: 10px;}
.page p								{ margin-bottom: 10px;}
.page .ul_list						{ margin-bottom: 10px;}
.page .ul_list li					{ padding-left: 35px; background-position: left 42%; background-size: 25px;}
.page .ul_list li:before			{ top: 15px; width: 5px; height: 5px;}
}


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

@media (max-width:1200px) { 
.bloc_texte							{ margin: 70px auto;}
}
@media (max-width:1000px) { 
.bloc_texte							{ margin: 60px auto;}
    
}
@media (max-width:600px) { 
.bloc_texte							{ margin: 35px 0;}
}
.cta                                { background: url(../images/bg_footer.svg) no-repeat center #12323f; padding: 60px; border-radius: 20px; margin: 80px auto; text-align: center; background-size: cover;}
.cta .btn                           { margin-top: 10px; }
.cta .link                          { display: inline-block;}
.cta .sous_titre                    { color: #fff;}
.cta .link.tel                      { position: relative; padding-left: 65px; margin-right: 5px;}
.cta  .link.tel::before             { content: ""; background: url(../images/phone.svg) no-repeat center; position: absolute; left: 30px; top: 20px; width: 20px; height: 20px;}
.cta .link.mail                     { position: relative; padding-left: 65px; }
.cta .link.mail::before             { content: ""; background: url(../images/mail_white.svg) no-repeat center; position: absolute; left: 30px; top: 20px; width: 20px; height: 20px;}
@media (min-width:1201px) {
.cta .link.mail:hover::before                   { background: url(../images/mail.svg) no-repeat center; }
.cta .link.tel:hover::before                   {  background: url(../images/tel.svg) no-repeat center;}
}

@media (max-width:1000px) {
.cta                                { margin: 50px 0; border-radius: 5px; padding: 30px 30px 40px;}
}
@media (max-width:600px) {
.cta                                { margin: 40px -7.5vw; border-radius: 0;}
.cta .btn                           { margin-top: 20px; display: grid; gap: 10px; justify-content:center;}
.cta .link                          { margin: 0 auto; width: 250px; padding: 0 30px!important;}
.cta .link.tel                      {margin-right: 0;}
.cta .link.tel::before, 
.cta .link.mail::before             { display: none;}   
}


.faq                                { margin: 90px 0 150px;}
.show_hide                          { margin-top: 30px;}
.show_hide .titre                   { background-color: #60a6b7; color: #fff; }
.show_hide .titre:after             { background-image: url(../images/plus.svg); }
.show_hide .titre.active            { color: #fff;}
.show_hide .hide                    { background-color: #60a6b7; color: #fff;}
@media (min-width:1200px) {
.show_hide .titre:hover             { background: #60a6b7; color: #fff;}
}
@media (max-width:1000px) {
.faq                                { margin: 40px 0 50px;}
}


.grid-tarifs                      { display: grid; grid-template-columns: 1fr 1fr ; grid-gap: 100px; align-items: center; position: relative; margin: 100px auto; position: relative; width: 90vw; max-width: 1200px; position: relative;}
.grid-tarifs .item                { border-radius: 50%; color: #ffffff; width: 100%; text-align: center; position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; background: url(../images/bg_prices.svg) no-repeat center #60a6b7;}
.grid-tarifs .item .duree         { font: 400 24px / 26px "poppins"; display: block;}
.grid-tarifs .item .tarif         { font: 400 18px / 26px "poppins"; display: block; margin-top: 0;}
.grid-tarifs .item .tarif span    { font: 400 60px / 40px 'DM Serif Display'; display: block; margin-top: 30px;}

.grid-tarifs .item:nth-child(1)   { margin-top: -150px;}
.grid-tarifs .item:nth-child(3)   { margin-top: -150px;}


@media (max-width:1000px) {
    .grid-tarifs                      { margin-top: 150px; grid-gap: 60px;}
    .grid-tarifs .item .duree         { font: 400 22px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif         { font: 400 16px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif span    { font: 400 50px / 40px 'DM Serif Display'; display: block; margin-top: 30px;}
}

@media (max-width:800px) {
    .grid-tarifs                      { grid-gap: 30px;}
    .grid-tarifs .item .duree         { font: 400 20px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif         { font: 400 14px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif span    { font: 400 40px / 40px 'DM Serif Display'; display: block; margin-top: 20px;}
}

@media (max-width:600px) {
    .grid-tarifs                      { grid-gap: 10px; margin-bottom: 50px;}
    .grid-tarifs .item .duree         { font: 400 16px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif         { font: 400 12px / 26px "poppins"; display: block;}
    .grid-tarifs .item .tarif span    { font: 400 30px / 40px 'DM Serif Display'; display: block; margin-top: 10px;}
}

@media (max-width:500px) {
    .grid-tarifs                      { grid-template-columns: 1fr; width: 80vw; margin-top:50px;}
    .grid-tarifs .item:nth-child(1)   { margin-top: 0;}
    .grid-tarifs .item:nth-child(3)   { margin-top: 0;}
    .grid-tarifs .item                { border-radius: 10px; padding: 0 20px;}
}
