/* //////////////////////////////////////////////////////////// */
/* // Type , vars, main */
/* //////////////////////////////////////////////////////////// */
html {
    scroll-behavior : smooth;
    font-family     : "Prompt", sans-serif;
    color           : var(--primary);
    font-size       : 14px;
}

:target:before {
    content : "";
    display : block;
}

:root {
    --white              : #FFF;
    --black              : #000;
    --primary            : #00606B;
    --primary-lighter    : #000;
    --primary-darker     : #004148;
    --secondary          : #FCB040;
    --secondary-lighter  : #FFEDD4;
    --secondary-darker   : #000;
    --tertiary           : #000;
    --tertiary-lighter   : #000;
    --tertiary-darker    : #000;
    --preloader-bg       : #00606B;
    --preloader-circle   : #FCB040;
    --form-error         : #FBB040;
    --input-color        : white;
    --input-placeholder  : #fff;
    --input-bg           : rgba(0, 0, 0, 0);
    --input-borders      : #fff;
    --header-size-large  : 0px;
    --header-size-medium : 0px;
    --header-size-small  : 0px;
    --swiper-theme-color : #00606B;
    --swiper-bullet      : #FFF;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    font-weight : 500;
}

h1, .h1 {
    font-size     : clamp(1.5rem, 2.5vw, 2.8rem);
    line-height   : clamp(1.9rem, 2.7vw, 3rem);
    margin-bottom : 1.5rem;
}

h2, .h2 {
    font-size     : clamp(1.2rem, 2vw, 4rem);
    line-height   : clamp(1.7rem, 2.5vw, 2.4rem);
    margin-bottom : 1.3rem;
}

h3, .h3 {
    font-size     : clamp(1rem, 1.75vw, 2rem);
    line-height   : clamp(1.4rem, 2.3vw, 2rem);
    margin-bottom : 1.1rem;
}

h4, .h4 {
    font-size     : clamp(1rem, 1.3vw, 1.3rem);
    margin-bottom : 1rem;
}

/* //////////////////////////////////////////////////////////// */
/* // Header and Main Navigation */
/* //////////////////////////////////////////////////////////// */
.navbar-items li a {
    text-transform : uppercase;
    font-weight    : 400;
    font-size      : 14px;
    color          : var(--primary);
}

.navbar-items ul li {
    position : relative;
}

.navbar-items ul li ul {
    width      : 100%;
    position   : absolute;
    padding    : 10px;
    background : #fff;
    visibility : hidden;
    opacity    : 0;
    transition : all .25s ease-in-out !important;
}


.navbar-items ul li:hover ul {
    visibility : visible;
    opacity    : 1;

}

/* //////////////////////////////////////////////////////////// */
/* // Content */
/* //////////////////////////////////////////////////////////// */
b, strong {
    font-weight : 600;
}

/* //////////////////////////////////////////////////////////// */
/* // Footer */
/* //////////////////////////////////////////////////////////// */

/* //////////////////////////////////////////////////////////// */
/* // Header and Main Navigation */
/* //////////////////////////////////////////////////////////// */
.heading {
    font-size   : 160%;
    line-height : 1.8rem;
}

/* //////////////////////////////////////////////////////////// */
/* // Buttons */
/* //////////////////////////////////////////////////////////// */

.button {
    background-color : var(--primary);
    color            : var(--white) !important;
    padding          : 10px 20px !important;
    font-weight      : 500;
    font-size        : 14px;
    text-transform   : uppercase;
}

.button:hover {
    background-color : var(--primary-darker);
    color            : var(--white) !important;
}

.button-2 {
    background-color : var(--secondary);
    color            : var(--primary);
    padding          : 9px 23px !important;
    /*    font-weight      : 600;*/
}

/* //////////////////////////////////////////////////////////// */
/* // Forms */
/* //////////////////////////////////////////////////////////// */

/* //////////////////////////////////////////////////////////// */
/* // Custom */
/* //////////////////////////////////////////////////////////// */

.ani_1 {
    height              : calc(100% - 145px);
    width               : calc(100% - 30px);
    position            : absolute;
    margin              : auto;
    top                 : 0;
    bottom              : 0;
    z-index             : 1;
    aspect-ratio        : auto;
    object-fit          : cover;
    background-position : center;
}

.winten-logo {
    top       : calc(21% - 40px);
    width     : 36%;
    max-width : 200px;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left    : -45px;
    right   : auto;
    z-index : 4;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right   : -45px;
    left    : auto;
    z-index : 4;
}

.panel-holder {
    max-width : 1600px;
}


.swiper-slide img {
    transition : all .3s ease-in-out !important;
}

.swiper-slide:not(.swiper-slide-active) img {
    opacity : 0.25;
}

.info-area ul,
.info-area ul li {
    text-align : left;
    list-style : none;
}

.info-area ul a {
    text-decoration : underline;
}

/* //////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////// */

@media (min-width : 1200px) {

    .middle-ani {
        margin-top : 150px;
    }
}

@media (min-width : 1400px) {

    .middle-ani {
        margin-top : 13%;
    }
}

@media (max-width : 1550px) {
    .swiper-button-next:after, .swiper-button-prev:after {
        font-size : clamp(2rem, 4vw, 4rem);
    }

    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left : 4%;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right : 4%;
    }
}

@media (max-width : 1200px) {
    .swiper-button-next:after, .swiper-button-prev:after {
        font-size : clamp(1.5em, 4vw, 4rem);
    }

    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left : 3%;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right : 3%;
    }
}


@media (min-width : 769px) {

    .navbar-items li ul li a {
        padding-top    : 0px;
        padding-bottom : 0px;
    }

    nav * {
        transition : all .3s ease-in-out !important;
    }

    nav .active .n,
    nav li:hover .n {
        width : calc(100% - 41px);
    }

    nav li {
        position : relative;
    }

    nav .n {
        background   : var(--primary);
        height       : 2px;
        width        : 0%;
        position     : absolute;
        left         : 0;
        right        : 0;
        margin-right : auto;
        margin-left  : auto;
        bottom       : 0px;
        transition   : all 0.5s ease;
    }

    .navbar-items ul li ul {
        width       : 195px;
        margin-left : -31px;
        top         : 45px;
    }

    .panel-text {
        width         : 320px;
        flex-shrink   : 0;
        padding-left  : 30px;
        padding-right : 30px;
    }

    :target:before {
        height : 64px;
        margin : -64px 0 0;
    }

    .main-nav {
        padding-bottom : 35px;
    }

    .navbar-logo {
        opacity       : 0;
        min-width     : 100px;
        margin-top    : 5px;
        margin-bottom : -5px;
    }

    .scrolled .navbar-logo {
        opacity : 1;
    }


    .logo-single {
        padding-top    : 15px;
        padding-bottom : 15px;
    }

    .hide-scroll {
        max-height : 200px;
        opacity    : 1;
        transition : all .3s ease-in-out !important;
        visibility : visible;
    }

    .scrolled .hide-scroll {
        max-height     : 0px;
        opacity        : 0;
        padding-top    : 0px;
        padding-bottom : 0px;
        visibility     : hidden;
    }

    .scrolled .main-nav {
        padding-top    : 10px;
        padding-bottom : 20px;
    }

}

@media (max-width : 1024px) {

    .middle-ani {
        top : calc(50% - 230px);
    }
}

@media (max-width : 768px) {
    .sm\:block {
        flex-direction : column;
    }

    .sm\:block > div {
        width     : 100%;
        margin    : 10px 0 !important;
        max-width : calc(100vw - 40px);
        padding   : 30px 20px;
    }

    .sm\:block > div ul {
        padding-left : 0px;
        font-size    : 13px;
    }

    form h3 {
        text-align : center;
    }

    .fix-1 div[class^="w-"],
    footer div[class^="w-"] {
        width : 100%;
    }

    .fix-1,
    footer .flex {
        flex-direction : column;
    }

    :target:before {
        height : 54px;
        margin : -54px 0 0;
    }

    .panel-holder {
        flex-direction : column !important;
    }

    .panel-text {
        width : auto;
    }

    .fix-2 {
        padding-top : 0px !important;
    }

    .navbar-items li a {
        font-size : 74%;
    }

    .middle-ani {
        top : calc(50% - 190px);
    }

    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left : 2%;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right : 2%;
    }

    .navbar-items ul li ul {
        position   : relative;
        visibility : visible;
        opacity    : 1;
        margin     : -7px 0 0px 0 !important;
    }

    .navbar-items ul li ul a {
        color : var(--secondary);
    }

}

@media (max-width : 640px) {
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left : 1.6%;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right : 1.6%;
    }

    .middle-ani {
        top : calc(50% - 135px);
    }
}

@media (max-width : 480px) {


    .winten-logo {
        top : 5%;
    }

    .middle-ani {
        top : calc(50% - 100px);
    }

    .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
        left : -2px;
    }

    .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
        right : -2px;
    }
}