.btn-blue:hover{color:#fff;}

li.v_plus a {
    color: red !important;
    font-weight: bold !important;
}
.slotholder {
    right: 10%;
    position: absolute;
    width: 40% !important;
    height: 72% !important;
    border-radius: 50% 25%;
    overflow: hidden;
    margin-top: 130px;
    background-color: blue;
    border: 10px solid blue;
}

.tp-caption {
    color: black !important;
	white-space: normal;
}

.main-slider .big-text {
    color: black;
}

.tp-caption {
    left: 10% !important;
    width: 40%;
}
.tp-bgimg.defaultimg {
    border: 10px solid red;
    border-radius: 50%;
    padding: 10px;
}

section#intro-section3 {
    background-color: rgb(78 79 88 / 80%);
}

header.main-header {
    border-bottom: 1px solid #eee;
}
.main-slider .big-text {
    font-size: 1.2em !important;
}
.main-slider a.theme-btn.btn-style-one {
    max-width: 300px;
}

/* Conteneur principal */
        .slider-wrapper {
            width: 100%;
            position: relative;
            display: flex;
            overflow-x: scroll; /* Le défilement se fait ici */
            scroll-snap-type: x mandatory; /* Aimante les slides */
            scroll-behavior: smooth;
        }

        /* Supprimer la barre de défilement visuelle */
        .slider-wrapper::-webkit-scrollbar { display: none; }

        /* Chaque Slide */
        .slide {
            min-width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            scroll-snap-align: start;
        }

        .content {
            display: flex;
            max-width: 1200px;
            width: 100%;
            align-items: center;
            padding: 20px;
        }

        /* Texte à gauche */
        .text-part { flex: 1; padding-right: 50px; }
        .text-part h2 { font-size: 37px; margin-bottom: 10px; font-weight: 800; }
        .text-part p { margin-bottom: 30px; line-height: 1.5; }
        .btn-blue {
            background: var(--blue);
            color: white;
            padding: 15px 40px;
            border-radius: 50px;
            text-decoration: none;
            font-weight: bold;
        }

        /* Image à droite avec masque */
        .image-part { flex: 1; position: relative;margin-top: 150px;    border-right: 15px solid #e31e27;    border-radius: 40% 60% 70% 30% / 40% 50% 60% 40%; }
        
        .mask-container {
            width: 580px;
            height: 580px;
            border: 10px solid blue;
            /* La forme arrondie spécifique de votre image */
            border-radius: 40% 60% 70% 30% / 40% 50% 60% 40%;
            overflow: hidden;
            position: relative;
        }

        .mask-container img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* Boutons de contact fixes sur le masque */
        .contact-btns {
            position: absolute;
            right: -25px;
            top: 50%;
            transform: translateY(-50%);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .c-btn {
            padding: 12px 20px;
            color: white;
            text-decoration: none;
            border-radius: 20px 0 0 20px;
            font-size: 14px;
            font-weight: bold;
            box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
        }
        .tel { background: #eee; color: #333; }
        .wa { background: var(--green); }
        .devis { background: var(--red); }

        /* Navigation manuelle en bas */
.nav-dots {
    position: absolute;
    bottom: 60px;
    width: 100%;
    display: flex;
    justify-content: left;
    gap: 15px;
    max-width: 1200px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.dot {
    width: 150px;
    text-align: center;
    background: #db1010;
    border-radius: 5px;
    text-decoration: none;
    color: white;
    font-weight: 500;
    line-height: 40px;
    font-size: 16px;
    letter-spacing: 0.5px;
	}
        .dot:hover { background: blue; color:#fff;}
		a.dot.current {background: blue;}
		/* Animation Zoom-Out */
@keyframes zoomOutEffect {
    0% { transform: scale(1.3); } /* Démarre zoomé */
    100% { transform: scale(1); } /* Revient à la taille normale */
}

/* On applique l'animation à l'image du slide actif */
.slide.active .mask-container img {
    animation: zoomOutEffect 6s ease-out forwards;
}

/* Assurer que l'image ne dépasse pas du masque pendant le zoom */
.mask-container img {
    transition: transform 0.5s ease;
}
.mask-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Important pour ne pas déformer le plan de métro */
    object-position: center; 
}
section.slider-wrapper-header {
    position: relative;
	/*padding-bottom: 100px;*/
}

section#intro-section3 {
    transform: initial;
    display: block;
    min-height: 60px;
    margin-bottom: 50px;
	background-color: #000091;
}
section.slider-wrapper-header {
    /* Couleurs inspirées de votre image : Bleu foncé, Bleu électrique et Blanc */
    background: linear-gradient(-45deg, #9497a5, #f3e5e9, #f8f9fa, #ffffff);
    background-size: 400% 400%;
    animation: gradientAnimation 15s ease infinite;
    /*height: 100vh; */
    display: flex;
    align-items: center;
}
@keyframes gradientAnimation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.lines, .lins {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  margin: auto;
  width: 90vw;
  display: flex;
  justify-content: space-between; /* Distribute lines evenly */
}
.lins {
  display: block;
  justify-content: space-between; /* Distribute lines evenly */
}
.line, .lin {
  position: relative;
  width: 1.5px;
  height: 100%;
  /*background: #ffffff;  /* Line color */
  overflow: hidden;
}
.lin {
  width: 100%;
  height: 1.5px;
      margin-bottom: 5%;
}
.line::after,
.lin::after {
  content: '';
  display: block;
  position: absolute;
  height: 15vh;
  width: 100%;
  top: -50%;
  left: 0;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 75%, #ffffff 100%);
  animation: drop 7s 0s infinite;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
}
.lin::after {
  animation: drop2 7s 0s infinite;
  top: -5%;
}
.lin::after {
  height: 100%;
  width: 15vh;
  left: -50%;
  top: 0;
}
/* Different colors for each line's pseudo-element */
.line:nth-child(1)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FF4500 75%, #FF4500 100%);
  animation-delay: 0.5s;
}
.lin:nth-child(1)::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FF4500 75%, #FF4500 100%);
  animation-delay: 0.5s;
}
.line:nth-child(2)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #32CD32 75%, #32CD32 100%);
  animation-delay: 1s;
}
.lin:nth-child(2)::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #32CD32 75%, #32CD32 100%);
  animation-delay: 1s;
}
.line:nth-child(3)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #1E90FF 75%, #1E90FF 100%);
  animation-delay: 1.5s;
}
.lin:nth-child(3)::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #1E90FF 75%, #1E90FF 100%);
  animation-delay: 1.5s;
}
.line:nth-child(4)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFD700 75%, #FFD700 100%);
  animation-delay: 2s;
}
.lin:nth-child(4)::after{
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FFD700 75%, #FFD700 100%);
  animation-delay: 2s;
}
.line:nth-child(5)::after {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #8A2BE2 75%, #8A2BE2 100%);
  animation-delay: 2.5s;
}
.lin:nth-child(5)::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #8A2BE2 75%, #8A2BE2 100%);
  animation-delay: 2.5s;
}
.line:nth-child(6)::after {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #20B2AA 75%, #20B2AA 100%);
  animation-delay: 3s;
}
.lin:nth-child(6)::after {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #20B2AA 75%, #20B2AA 100%);
  animation-delay: 3s;
}
.line:nth-child(7)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #DC143C 75%, #DC143C 100%);
  animation-delay: 3.5s;
}
.lin:nth-child(7)::after{
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #DC143C 75%, #DC143C 100%);
  animation-delay: 3.5s;
}
.line:nth-child(8)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #00FA9A 75%, #00FA9A 100%);
  animation-delay: 4s;
}
.lin:nth-child(8)::after{
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #00FA9A 75%, #00FA9A 100%);
  animation-delay: 4s;
}
.line:nth-child(9)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FF1493 75%, #FF1493 100%);
  animation-delay: 4.5s;
}
.lin:nth-child(9)::after{
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FF1493 75%, #FF1493 100%);
  animation-delay: 4.5s;
}
.line:nth-child(10)::after{
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #00BFFF 75%, #00BFFF 100%);
  animation-delay: 5s;
}
.lin:nth-child(10)::after{
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #00BFFF 75%, #00BFFF 100%);
  animation-delay: 5s;
}
@keyframes drop {
  0% {
    top: -50%;
  }
  100% {
    top: 110%;
  }
}
@keyframes drop2 {
  0% {
    left: -50%;
  }
  100% {
    left: 110%;
  }
}


.intro-section3 .news-style-one h3 a {
    /*display: flex;*/
    text-align: left;
    line-height: 22px;
}

.intro-section3 .news-style-one h3 a i {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    padding: 30px;
    margin-left: 0;
    margin-top: -5px;
}

.news-style-one p {
    text-align: justify;
    /* display: none; */
}
.single-item-carousel222 .slide-item h3 a {
    text-align: left;
}
.split-card > div .content.lft {
    -webkit-clip-path: polygon(0 0, 78% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 78% 0, 100% 100%, 0% 100%);
    margin-top: 0;
    margin-left: 0;
    padding: 30px 10% 30px 5%;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
	padding-top: 50px;
}
.split-card > div .content.cnt {
    border-radius: 0;
    clip-path: polygon(5% 0, 80% 0, 92% 100%, 21% 100%);
    margin-left: -90px;
    background-color: #c7111d;
    min-width: 415px;
    padding-top: 30px;
    padding-left: 60px;
}
.split-card > div .content.rgt {
    margin-top: 0;
}
.split-card > div .content {
    width: initial;
    height: initial;
	display: block;
    text-align: left;
	padding: 30px 5% 30px 5%;
	padding-top: 50px;
}

.split-card > div .content.cnt {margin-bottom: 20px;}
.slider-wrapper-header .top-sl {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 113px;
    color: #fff;
    line-height: 1.3;
    margin: 0 auto;
    left: 0;
    right: 0;
    background: #000091;
    z-index: 9;
	padding: 15px 5px;
}
.top-sl h1 {
    font-size: 32px;
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    line-height: 1.3;
}
.top-sl p{
	max-width: 1200px;
	margin: 0 auto;
    text-align: center;
}
.slider-wrapper-header{
padding-top:100px;
}
.sec-title-one h2 hr {
    margin: 0 10px;
    margin-bottom: 10px;
}
.slider-wrapper-header .top-sl b {
    color: #e1000f;
}
.last {
    margin-top: 65px;
}

.last a {
    margin-bottom: 10px;
    max-width: 270px;
}
h2.bor::before,
h2.bor::after {
  content: "";
    display: block;
    height: 2px;
    background: #0037ff;
    position: absolute;
    top: 50%;
    width: 50px;
	left:0;
}
h2.bor::after {
    right: 0;
	left:initial;
}
.intro-section3 .news-style-one h3 a i {
    margin-bottom: 15px;
}
.news-style-one {
    text-align: left;
}
.news-style-one .inner-box {
    background-color: #0b0b7e;
    padding: 20px;
    border-radius: 10px;
	color: #fff;
}
.news-style-one .inner-box:hover {
    background-color: #030359;
}
.news-style-one.bx2 {
    margin-top: 60px;
}
.news-style-one.bx3 {
    margin-top: -50px;
}
section#missions .sec-title-one p {
    text-align: center;
}

section#missions .service-card, section#missions .service-card p {
    color: black;
    text-align: center;
}
figure.footer-logo img{
float: none;
    height: initial;
    max-width: 300px;
}
.footer-style-one .footer-upper {
    position: relative;
    padding: 50px 0px 10px;
}
.footer-style-one .column {
    position: relative;
    margin-bottom: 0;
}
.avan .services-wrapper .col-md-4.col-sm-6.col-xs-12 {
    padding-bottom: 45px;
    text-transform: uppercase;
    margin-top: 20px;
}
.avan .services-wrapper .col-md-4.col-sm-6.col-xs-12 i.glyphicon.glyphicon-ok {
    color: red;
}

.avan .services-wrapper .col-md-4.col-sm-6.col-xs-12 b {
    color: #06068d;
    text-transform: initial;
    letter-spacing: 0.3px;
}
h2.bor {
    text-align: center;
}
.faq-wrapper > h3 {
    font-size: 28px;
}
section.intro-section3 {
    margin: 30px 0;
    padding-top: 25px;
}
.last a {
    width: 100%;
}
@media only screen and (max-width: 1250px) {
    .slider-wrapper-header a.btn-blue {
        font-size: 15px;
        padding: 15px;
    }
h2.bor {
    padding: 0 50px;
}
.faq-wrapper .carousel-outer .owl-theme .owl-controls .owl-nav .owl-prev, .faq-wrapper .carousel-outer .owl-theme .owl-controls .owl-nav .owl-next {
  transform: translateX(0px);
  width: 40px;
  height: 40px;
}
.faq-wrapper .carousel-outer .owl-theme .owl-controls .owl-nav .owl-next {
    transform: translateX(5px);
}
.faq-wrapper .carousel-outer .slide-item .content {
  padding: 10px;
  line-height: 18px;
}
h4 {
  font-size: 16px;
  line-height: 1.3;
}
.faq-wrapper .carousel-outer .slide-item .content .resume {
  font-size: 15px;
}
}
@media only screen and (max-width: 1024px) {
.mask-container {
    width: 45vw;
    height: 45vw;
}
.slider-wrapper-header {
    padding-top: 25vw;
}
.text-part h2 {
    font-size: 3.5vw;
    line-height: 1.2;
}
.nav-dots {
    bottom: 20px;
    left: 10px;
}
.devi li {
    width: 100%;
    float: none;
}
.split-card > div .content.lft {
    padding: 30px 5% 30px 5%;
}
.content.cnt {
    min-width: 30.33% !important;
    padding: 5% 10% !important;
}
.content.lft {
    position: relative;
    z-index: 2;
}
.deal-of-day .carousel-outer .slide-item .content {
    padding: 0;
}
}
@media only screen and (max-width: 767px) {
.news-style-one.bx2 {
    margin-top: 20px;
    margin-bottom: 70px;
}
.split-card > div .content {
    clip-path: initial !important;
    border-radius: 25px !important;
    padding: 25px !important;
    margin-left: initial !important;
    margin-bottom: 20px;
}
.footer-services {
    margin: 30px 0;
}
.faq-wrapper > h3 {
    font-size: 20px;
}
.slider-wrapper-header .top-sl {
    position: relative !important;
    width: 100vw;
    top: initial;
    margin-top: 82px;
}

section.slider-wrapper-header {
    display: initial;
}

.slider-wrapper .content .mask-container {
    width: 90vw;
    height: 100vw;
}

.slider-wrapper .content {
    display: block;
}

}