@import url(../css/style/preloader.css);
@import url(../css/style/nav.css);
@import url(../css/style/font.css);
@import url(../css/style/header.css);
@import url(../css/style/footer.css);
@import url(../css/style/hystmodal.css);
@import url(../css/style/container.css);
* {
    box-sizing: border-box;
}

::-webkit-scrollbar {
    width: 4px;
    height: 0;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-track-piece {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #ffffff;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #727272;
}


/* iframe {
    border: none !important;
    overflow: hidden;
    height: 96vh;
    width: 80vw;
    margin: 2vh auto;
    outline: none !important;
    border-radius: 20px;
} */

body {
    transition: all .3s;
    color: white;
    font-family: "Gotham Pro";
    background-color: #09334A;
    width: 96vw;
    overflow-x: hidden;
    margin: 0 auto;
    padding: 0;
    max-width: 2000px;
}

a {
    text-decoration: none;
}

img {
    display: block;
}

::selection {
    background-color: #fff;
    color: #000;
}

.loaded .preloader {
    display: none;
}

.fade {
    animation: fade 1s ease-in-out;
}

@keyframes fade {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.animated {
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.animated.hinge {
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
}

@-webkit-keyframes slideInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes slideInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible;
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight;
}

@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100vh);
        transform: translateY(-100vh);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100vh);
        -ms-transform: translateY(-100vh);
        transform: translateY(-100vh);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translateY(20vh);
        transform: translateY(20vh);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translateY(20vh);
        -ms-transform: translateY(20vh);
        transform: translateY(20vh);
        visibility: visible;
    }
    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
}

.GOup {
    z-index: 99;
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 30px;
    right: 30px;
    transition: all .3s;
    border-radius: 20px;
}

.GOup__bg {
    cursor: pointer;
    background: #082B3F;
    border: 1px solid #082B3F;
    box-shadow: inset 0px 0px 8px rgba(0, 0, 0, 0.4);
    border-radius: 20px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .3s;
}

.GOup_polygon {
    transition: all .3s;
}

.GOup__bg:hover .GOup_polygon {
    transform: translateY(-4px);
}

.tabs {
    display: flex;
    flex-direction: row;
    gap: 6px;
    position: relative;
}

#light {
    background: #09334A;
    box-shadow: inset 0px 0px 4px #000000;
    border-radius: 20px;
    width: 49px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#darck {
    background: #09334A;
    box-shadow: inset 0px 0px 4px #000000;
    border-radius: 20px;
    width: 49px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#preloader {
    overflow: hidden;
    user-select: none;
    pointer-events: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    background: #09334A;
}


/* @media all and (max-width: 550px) {
    p {
        font-size: 14px !important;
    }
} */