@charset 'UTF-8';


@desktop: (min-width: 992px);

@tablet: (max-width: 991.5px);

@mobile: (max-width: 767.5px);

/*

benya, 01.2022
tg: @bendyuzhko

*/



* {
    scrollbar-width: thin;
    scrollbar-color: rgba(31, 60, 82, 0.3) transparent;
}

::-webkit-scrollbar {

    width: .5rem;

    &:horizontal {
        height: .5rem;
    }

}

::-webkit-scrollbar-thumb {
    background: rgba(31, 60, 82, 0.3);
    border-radius: 1rem;
}

body {
    background: #F9F9F9;
    color: #283B4A;
    font-family: 'Ubuntu', sans-serif;
}

video[poster] {
    object-fit: cover;
}


::selection {}


.fw-bolder {
    font-weight: 500 !important;
}

.dropdown-menu {

    background: #405D73;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
    border: none;

    .dropdown-item {

        color: #F9F9F9;

        &:focus,
        &:hover {
            background: none;
        }

    }

}


@media @desktop {

.dropup:hover .dropdown-menu,
.dropdown:hover .dropdown-menu {
    display: block;
}

}

.form-control {
    background: transparent;
    border-top: none;
    border-bottom: 1px solid #4F738F;
    border-right: none;
    border-left: none;
    color: #4F738F;
    border-radius: 0;

    &:focus {
        background: transparent;
        border-bottom: 1px solid #4F738F;
        box-shadow: none;
    }

}


.btn:focus {
    box-shadow: none;
}


/*
slick
*/
.slick-slider {
    position: relative;
}

.slick-list {
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-slide {
    float: left;
}
/*
slick
*/

.fancybox-bg {
    background: transparent !important;
}

.fancybox-content {
    background: #F9F9F9 !important;
}

.fancybox-button {
    background: none !important;
    color: #4F738F !important;
    border: none !important;
}

.fancybox-close-small {
    color: #4F738F !important;
    border: none !important;
}


.head {

/*
    background: #3D586D;
*/
    background: rgba(31, 60, 82, 0.3);
    z-index: 1;

    .nav-link {

        color: #F9F9F9;
        /*
        border-bottom: 2px solid transparent;
        */

        &:focus,
        &:hover {
            color: #F9F9F9;
            /*
            border-bottom: 2px solid #F9F9F9;
            */
        }

    }


@media @desktop {


    .active {

        position: relative;

        &::before {
            margin-bottom: -16px;
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            right: 0;
            left: 0;
            border-bottom: 2px solid #F9F9F9;
        }

    }


}


    .form-control {

        background: none;
        border: none;
        color: #F9F9F9;

        &::placeholder {
            color: #F9F9F9;
        }

        &:focus {
            background: none;
            border: none;
            color: #F9F9F9;
        }

    }

    .btn-search {

        color: #F9F9F9;

        &:hover {
            color: #F9F9F9;
        }

    }


@media @tablet {


    #bars {
        display: none;
    }

    #search {
        display: none;
    }


}


}


header {

    background: rgba(31, 60, 82, 0.3);

    .slick-dots {

        position: absolute;

        @media @desktop {
            bottom: 2rem;
        }

        @media @tablet {
            bottom: 1rem;
            padding-left: 0;
        }

        @media @mobile {
            bottom: 0;
        }

        li {

            display: inline-block;
            margin-left: 1rem;

            button {
                background: rgba(249, 249, 249, 0.5);;
                border-radius: 100%;
                font-size: 0;
                border: none;
                width: 10px;
                height: 10px;
            }

        }

        .slick-active button {
            background: #F9F9F9;
        }

    }

    @media @desktop {

        .position-absolute {
            left: 20%;
            bottom: 30%;
        }

    }

    @media @tablet {

        .position-absolute {
            left: 1.5rem;
            bottom: 40%;
        }

    }

    @media @mobile {

        .position-absolute {
            left: 1rem;
            bottom: 35%;
        }

    }

    .btn {

        font-size: 15px;
        line-height: 2;
        color: #F9F9F9;
        border: 2px solid #F9F9F9;

        &:hover {
            background: rgba(249, 249, 249, 0.5);
            color: #F9F9F9;
        }

    }

}






.section-1 {

    background: #F9F9F9;
    color: #283B4A;

    @media @desktop {

        padding-top: 5rem !important;
        padding-bottom: 5rem !important;

        .row.mt-3.mt-lg-5 {
            margin-top: 4rem !important;
        }

    }

    p {
        font-size: 18px;
    }

    a {
        color: #4F738F;
    }

    .year {

        @media @desktop {
            position: relative;
            padding-top: 4rem!important;
        }

        &:before {
            background: #4F738F;
            height: 1px;
            margin-top: 10px;
            content: '';
            position: absolute;
            right: 0;
            left: 0;
        }

        .year-5 {

            background-image: url('/assets/img/li-1.png');
            background-repeat: no-repeat;
/*
            background-color: #4F738F;
*/
            width: 20px;
            height: 20px;

            &:hover,
            &:focus {
                background-image: url('/assets/img/li-2.png');
/*
                background-color: #E9EBEA;
                border: 1px solid #4F738F;
*/
            }

            @media @tablet {
                margin: 0 auto;
            }

        }

        @media @mobile {

            overflow-y: auto;
            white-space: nowrap;
            display: block;

            .col {
                display: inline-block;
                width: 25%;
            }

        }

    }

    .display-3 {
        color: transparent;
        -webkit-text-stroke: 2px #4F738F;
    }

}


.section-2 {

    background: #4F738F;
    color: #F9F9F9;
    padding-bottom: 8rem;

    @media @desktop {
        padding-top: 5rem !important;
    }

    @media @tablet {
        padding-bottom: 4rem;
    }

    @media @mobile {
        padding-bottom: 2rem;
    }

    p {
        font-size: 18px;
    }

    a {
        color: #F9F9F9;
    }

    .display-3 {
        color: transparent;
        -webkit-text-stroke: 2px #E9EBEA;
    }

    .col-lg-3 {

        border: 1px solid #E9EBEA;

        @media @mobile {
            border-top: 1px solid #E9EBEA !important;
            border: none;
        }

        .pt-3 {

            max-height: 350px;

            @media @mobile {
                max-height: 100% !important;
            }

        }

        .title {

            border-bottom: 1px solid #E9EBEA;

            @media @mobile {
                border: none !important;
            }

        }

        .h-100 {

            min-height: 54px;

            @media @mobile {
                min-height: auto !important;
            }

        }

    }

}


#new {

    @media @desktop {
        margin-top: 4rem !important;
    }

    .slick-prev,
    .slick-next {
        position: absolute;
        background: transparent;
        color: rgba(249, 249, 249, 0.5);
        z-index: 1;
        font-family: 'FontAwesome';
        font-size: 0;
    }

    .slick-prev:before {
        font-size: 2rem;
        content: '\f104';
    }

    .slick-next:before {
        font-size: 2rem;
        content: '\f105';
    }

    @media @desktop {

        .slick-prev,
        .slick-next {
            border-top: 1px solid #E9EBEA;
            border-bottom: 1px solid #E9EBEA;
            position: absolute;
            width: 109px;
            height: 109px;
            bottom: -108px;
        }

        .slick-prev {
            border-left: 1px solid #E9EBEA;
            border-right: 1px solid #E9EBEA;
            right: 109px;
        }

        .slick-next {
            border-left: none;
            border-right: 1px solid #E9EBEA;
            right: 0;
        }

    }

    @media @tablet {

        .slick-prev,
        .slick-next {
            border: none;
            margin: 0 auto;
            width: auto;
            bottom: -54px;
        }

        .slick-prev {
            left: 44%;
        }

        .slick-next {
            right: 44%;
        }

    }

    @media @mobile {

        .slick-prev,
        .slick-next {
            bottom: -2rem;
        }

        .slick-prev {
            left: 35%;
        }

        .slick-next {
            right: 40%;
        }

    }

}


.section-3 {

    background: #F9F9F9;
    color: #283B4A;

    @media @desktop {

        padding-top: 5rem !important;
        padding-bottom: 5rem !important;

        .row.mt-3.mt-lg-5 {
            margin-top: 4rem !important;
        }

    }

    p {
        font-size: 18px;
    }

    a {
        color: #283B4A;
    }

    .display-3 {
        color: transparent;
        -webkit-text-stroke: 2px #4F738F;
    }

    .btn {

        color: #4F738F;
        border: 2px solid #4F738F;
        font-size: 15px;
        line-height: 2;

        &:hover {
            background: #4F738F;
            color: #F9F9F9;
        }

    }

}


.section-4 {

    background: #4F738F;
    color: #F9F9F9;

    @media @desktop {

        padding-top: 5rem !important;
        padding-bottom: 5rem !important;

        .row.mt-3.mt-lg-5 {
            margin-top: 4rem !important;
        }

    }

    .display-3 {
        color: transparent;
        -webkit-text-stroke: 2px #E9EBEA;
    }

    p {
        font-size: 18px;
    }

    a {
        color: rgba(249, 249, 249, 0.5);

        &:hover,
        &:focus {

            color: #E9EBEA;
        }
    }

    ul {

        @media @desktop {

            a:hover,
            a:focus {
                font-size: 3rem;
                border-bottom: 1px solid rgba(249, 249, 249, 0.5);
            }

        }

        a[aria-selected="true"] {

            color: #E9EBEA;
            font-size: 3rem;

            @media @desktop {
                border-bottom: 1px solid rgba(249, 249, 249, 0.5);
            }

        }

    }

    ol {

        list-style-type: decimal-leading-zero;
        padding: 0;

        li {
            border-top: 1px solid rgba(249, 249, 249, 0.5);
        }

    }

    @media @desktop {

        #data-tabs li:nth-child(n+6) {
            display: none;
        }

        #data-tabs.open li:nth-child(n+6) {
            display: list-item;
        }

        #list-button {
            color: rgba(249, 249, 249, 0.5);
            cursor: pointer;
        }

        .overflow-auto {
            height: 60vh;
        }

    }

    @media @tablet {


        a {
            display: table-cell;
            vertical-align: bottom;
        }


        .list-unstyled {

            overflow-y: auto;
            white-space: nowrap;

            .fs-1 {
                display: table;
                font-size: 30px !important;
                padding-right: 2rem !important;
            }

            a[aria-selected="true"] {
                font-size: 40px;
            }

        }

        .overflow-auto {
            height: 100vh;
        }

    }

}

.section-5-i {

    @media @desktop {
        background-image: url('/assets/img/europe-i.png') !important;
    }

}

.section-5 {

    color: #283B4A;

    @media @desktop {

        background-image: url('/assets/img/europe.png');
        background-color: #F9F9F9;
        background-position: right;
        background-repeat: no-repeat;
        background-size: 50% 100%;
        padding-top: 5rem !important;
        padding-bottom: 5rem !important;
    }

    @media @tablet {

        background: #F9F9F9;

        .img-fluid {
            position: absolute;
            right: 0;
            left: 0;
        }

    }

    .form-floating {

        color: rgba(79, 115, 143, 0.5);

        .form-control:focus~label {
            opacity: 1;
        }

    }

    .btn {

        line-height: 2;
        font-size: 15px;
        color: #4F738F;
        border: 2px solid #4F738F;

        &:hover {
            background: #4F738F;
            color: #F9F9F9;
        }

    }

    @media @tablet {

        .w-75 {
            width: 100% !important;
        }

    }

}


#accordionSlider {

    color: #F9F9F9;
    font-size: 18px;

    .display-1,
    .display-5 {
        color: #F9F9F9;
    }

    .display-5 {
        cursor: pointer;
        transform: rotate(-90deg);
    }

    .as-layer {
        color: #F9F9F9;
    }

    .as-shadow {
        box-shadow: -5px 0px 40px 1px rgba(79, 115, 143, 0.4);
    }

    @media @desktop {

        overflow: hidden;

        .as-panels {
            width: 100%;
            height: 100%;
            position: absolute;
        }

        .as-panel {

            position: absolute;

            .as-background {
                height: 415px !important;
            }

            .as-layer {
                position: absolute;
            }

        }

    }

    @media @tablet {

        .as-panel {

            position: relative;

            .as-background {
                width: 100%;
                height: auto;
            }

            .as-layer {
                position: absolute;
                top: 20%;
                left: 0;
                width: 100%;
                z-index: 1;
            }

        }

        .slick-dots {

            position: absolute;
            bottom: 1rem;
            padding-left: 0;

            li {

                display: inline-block;
                margin-left: 1rem;

                button {
                    background: rgba(249, 249, 249, 0.5);
                    border-radius: 100%;
                    font-size: 0;
                    border: none;
                    width: 10px;
                    height: 10px;
                }

            }

            .slick-active button {
                background: #F9F9F9;
            }

        }

    }

    @media @mobile {

        .as-panel .as-layer {
            top: 0;
        }

        .slick-dots {
            bottom: 0;
        }

    }

}


#categories {

    color: #283B4A;
    font-size: 18px;

    a {
        color: #283B4A;
    }

    .pt-3 {
        max-height: 350px;
    }

    .fs-4 {
        border-bottom: 1px solid #283B4A;
    }

}


#shop {

    color: #283B4A;
    font-size: 18px;

    .description {

        font-size: 24px;

        .display-3 {
            color: #4F738F;
        }

        .btn-link {

            color: #4F738F;
            font-size: 24px;

            &:focus,
            &:hover {
                color: #283B4A;
                text-decoration: none;
            }

        }

        #products_price_2,
        #products_img_2 {
            display: none;
        }

    }

    .category_1 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #4F738F;
        }

    }

    .category_2 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #EC6C4E;
        }

    }

    .category_3 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #5FB49F;
        }

    }

    .category_4 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #D21537;
        }

    }

    .category_5 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #AD4E89;
        }

    }

    .category_6 {

        .display-3,
        .btn-link,
        .col-lg-3 {
            color: #482514;
        }

    }

/*
    .col-lg-3 {
        color: #4F738F;
    }
*/

}


#pages {

    color: #283B4A;
    font-size: 18px;

    a {
        color: #4F738F;
    }

    .display-3 {
        color: transparent;
        -webkit-text-stroke: 2px #4F738F;
    }

}


#events-1 {

    color: #283B4A;
    font-size: 18px;

    strong {
        font-weight: 500;
    }

    .events {

        border: 1px solid #283B4A;

        img {
            background: linear-gradient(180.16deg, rgba(40, 59, 74, 0) 59.43%, #283B4A 99.86%);
        }

        .fs-4 a {
            color: #283B4A;
        }

    }

}


@media @desktop {

    footer {

        background: #3D586D;
        color: #F9F9F9;

        .nav-link {

            color: #F9F9F9;

            &:focus,
            &:hover {
                color: #F9F9F9;
            }

        }

    }

}


@media screen and (min-width: 992px) {

    #events-min {

        .slick-prev,
        .slick-next {
            border-top: 1px solid #4F738F;
            border-bottom: 1px solid #4F738F;
            background: transparent;
            color: #4F738F;
            position: absolute;
            z-index: 1;
            font-family: 'FontAwesome';
            font-size: 0;
            width: 109px;
            height: 109px;
            top: 50%;
            margin-top: 2px;
        }

        .slick-prev {

            border-left: 1px solid #4F738F;
            border-right: 1px solid #4F738F;

            &:before {
                font-size: 2rem;
                content: '\f104';
            }

        }

        .slick-next {

            border-left: none;
            border-right: 1px solid #4F738F;

            left: 121px;

            &:before {
                font-size: 2rem;
                content: '\f105';
            }

        }

    }

    #categories .col-lg-4 {

        border-bottom: 1px solid #283B4A;
        border-right: 1px solid #283B4A;

        &:nth-child(-n+3) {
            border-top: 1px solid #283B4A;
        }
        &:nth-child(3n + 1) {
            border-left: 1px solid #283B4A;
        }

    }


}


@media screen and (max-width: 991.5px) {

    #events {

        .slick-prev,
        .slick-next {

            background: transparent;
            border: none;
            color: #E9EBEA;
            position: absolute;
            z-index: 1;
            font-family: 'FontAwesome';
            font-size: 0;
            width: auto;
            top: 0;
        }

        .slick-prev {

            right: 45px;

            &:before {
                font-size: 2rem;
                content: '\f104';
            }

        }

        .slick-next {

            right: 15px;

            &:before {
                font-size: 2rem;
                content: '\f105';
            }

        }

    }

    #categories .col-12 {
        border: 1px solid #283B4A;
        margin-bottom: -1px;
    }

}



/*
#reviews {

    .slick-prev,
    .slick-next {
        background: none;
        border: none;
        color: #2F4B5E;
        z-index: 1;
        font-family: 'FontAwesome';
        font-size: 0;
    }

    .slick-prev:before {
        font-size: 1rem;
        content: '\f077';
    }

        .slick-next:before {
        font-size: 1rem;
        content: '\f078';
    }

}
*/
