
/*===================== SECTION FIRST OF WEBSITE ===========================*/

.section-first {
    background: var(--color-backgr-transparent) !important;
}
.section-first .content-top-container {
    height: calc(100vh - 12vh);
    margin-top: 12vh;
    bottom: 0;
}

.section-first figure {
    height: calc(100vh - 12vh);
    width: calc(100% - (2*var(--content-margin)) );
    margin: 0 auto;
    border-radius: 1.2vw;
}
.section-first figure::before {
    content: "";
    position: absolute;
    display: flex;
    width: 100%;
    height: calc(100vh - 12vh);
    /* background: linear-gradient(180deg, rgba(159, 77, 6, 0.885) 0%, #d8795c00 50%, rgb(0 0 0 / 74%) 100%); */
    /* background: linear-gradient(180deg, rgb(159 77 6 / 93%) 0%, #e15f3752 50%, rgb(255 255 255 / 78%) 83%); */
    background: linear-gradient(180deg, rgb(6 159 51 / 93%) 0%, #37e13852 50%, rgb(255 255 255 / 78%) 83%);
    top: 0;
    left: 0;
    right: 0;
    z-index: 3;
    transition: all .5s ease-in-out;
}
.section-first figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    position: absolute;
    transition: all .5s ease-in-out;
}
.section-first figure img.active {
    opacity: 1;
    transition: all .5s ease-in-out;
}

.section-first .content-details {
    z-index: 4;
    gap: 3.16666vw;
    /* margin-top: 10vw; */
}

.section-first h3.title-accroche {
    font-size: 4.5vw; 
    text-align: center; 
    font-weight: 900;    
}

.section-first form {
    z-index: 4;
    border-radius: 5vw 5vw 1.1vw 1.1vw;
    width: calc(100% - (2*var(--content-margin)) );
}
.section-first form .os-form .content {
    width: 13vw;
}
.section-first form select {
    width: 100%;   
}

.section-first form .btn-submit {
    
}

.section-first form .select-option {
    transform: translateY(-50%);
}

/* From Uiverse.io by Pradeepsaranbishnoi */ 
.section-first form .select-option .tabs {
    display: flex;
    position: relative;
    background-color: #fff;
    box-shadow: 0 0 1px 0 rgb(24 224 117 / 15%), 0 6px 12px 0 rgb(24 224 54 / 15%);
    /* box-shadow: 0 0 1px 0 rgba(224, 84, 24, 0.15), 0 6px 12px 0 rgba(224, 77, 24, 0.15); */
    padding: .5vw;
    border-radius: 45vw;
}
.section-first form .select-option .tabs * {
    z-index: 2;
}
.select-option input[type="radio"] {
    display: none;
}
.section-first form .select-option .tab {
    width: 10vw;
    padding: .5vw .5vw;
    background: #b9e6be49;
    color: black;
    font-weight: 500;
    border-radius: 45vw;
    text-wrap: nowrap;
    transition: color 0.15s ease-in;
}
.section-first form .select-option input[type="radio"]:checked + label {
    color: white;   
    background: var(--success-color);
}

/*===================== SECTION SECUND OF WEBSITE -- SECTION AVANTAGES ===========================*/

.section-avantages {
    background: var(--color-backgr-transparent) !important;
}
.section-avantages .title-accroche {
    font-size: 4vw;
    color: var(--success-color);
}

.section-avantages .list {
    gap: 2vw;
}
.section-avantages .one-details {
    width: 30%;
    background: #b9e6c349;
}

/*===================== SECTION THIRD OF WEBSITE -- SECTION PROMOTION ===========================*/

.section-promote {
    background: var(--color-backgr-transparent) !important;
}
.section-promote .title-accroche {
    font-size: 4vw;
    width: 70%;
}
.section-promote .content-details {
    gap: 6vw;
}

.section-promote .content-left .content-secund {
    /* background: linear-gradient(90deg, #FFF 0%, #f0c5b8); */
    background: linear-gradient(90deg, #FFF 0%, #b8f0ca);
    z-index: 3;
}
.section-promote .content-left::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    bottom: 2vw;
    right: 2vw;
    /* background: #FF3D00; */
    background: var(--success-color);
    z-index: 1;
    border-radius: 1vw;
}

.section-promote .content-left .list {
    list-style-type: circle;
}

.section-promote .content-right {
    width: 45%;
    height: 35vw;
}
.section-promote .content-right img {
    object-position: top;
}
.section-promote .content-right::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    /* background: linear-gradient(176deg, #ffffff00 0%, #f97047ad 129%); */
    background: linear-gradient(176deg, #ffffff00 0%, #47f956ad 129%);
}

/*===================== SECTION FOUR OF WEBSITE -- SECTION ATTRACTIONS ===========================*/

.section-attractions {
    background: var(--color-backgr-transparent) !important;
}

.section-attractions .title-accroche {
    font-size: 4vw;
    width: 70%;
    text-align: end;
}
.section-attractions .list-attractions {
    gap: 2vw;
}
.section-attractions .list-attractions .one-attraction figure {
    width: 10vw;
    height: 17vw;
    border-radius: 9vw;
}
.section-attractions .list-attractions .one-attraction figure::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(176deg, #ffffff00 0%, #47f956ad 129%);
    /* background: linear-gradient(176deg, #ffffff00 0%, #f97047ad 129%); */
    transition: all .5s ease-in-out;
}
.section-attractions .list-attractions .one-attraction figure img {
    transform: scale(1);
    transition: all .5s ease-in-out;
}
.section-attractions .list-attractions .one-attraction:hover figure img {
    transition: all .5s ease-in-out;
    transform: scale(1.1);
}

/*===================== SECTION FIVE OF WEBSITE -- SECTION LIENS UTILES ===========================*/

/*===================== SECTION FOUR OF WEBSITE -- SECTION ATTRACTIONS ===========================*/

.section-contact {
    background: var(--color-backgr-transparent) !important;
}
.section-contact .content-details {
    height: 35vw;
}
.section-contact .content-details figure::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(176deg, #494240a6 0%, #f97047d7 100%); */
    background: linear-gradient(176deg, #404943a6 0%, #47f9b2d7 100%);
    transition: all .5s ease-in-out;
}

.section-contact .title-accroche {
    font-size: 4vw;
    width: 70%;
}
.section-contact .content-details-link .list-links {
    gap: 2vw;
    display: grid;
    grid-template-columns: repeat(3, 2fr);
}
.section-contact .content-details-link .list-links .one-link {
    /* background: #f0c5b880; */
    background: #b8f0e480;
    backdrop-filter: blur(12px);
    border: 1px solid transparent;
    transition: all .5s ease-in-out;
}
.section-contact .content-details-link .list-links .one-link:hover {
    background: white;
    border: 1px solid var(--success-color);
    transition: all .5s ease-in-out;
}
.section-contact .content-details-link .list-links .one-link:hover span {
    color: var(--success-color);
    transition: all .5s ease-in-out;
}
.section-contact .content-details-link .list-links .one-link:hover span.icon {
    background: var(--success-color);
    color: white;
    transition: all .5s ease-in-out;
}

/* LOADER CSS */

.loader {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: #FF3D00;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
} 

/*===================== SECTION TWO OF WEBSITE ===========================*/



@media (max-width:768px) {

    .tabs {
        transform: scale(0.6);
    }

    section {
        display: none !important;
    }

}