@font-face {
    font-family: 'Besom';
    src: url("../font/Besom.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Parker';
    src: url("../font/Parker.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
html, body {
    margin: 0;
    padding: 0;
}
html *, body * {
    box-sizing: border-box;
    outline: none;
}

body {
    overflow-x: hidden;
    background-color: #ffffff;
}
body#about {
    background-image: url("../images/about_bg.jpg");
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
}
@media (max-width: 1024px) {
    body#about {
        background-image: url("../images/respon-bg.jpg");
        background-size: auto;
    }
}
@media (min-width: 1024px) {
    body .leaderboard {
        min-width: 800px;
    }
}
@media (min-width: 1024px) {
    body .leaderboard .username {
        min-width: 250px;
    }
}
body .leaderboard .uk-overflow-auto {
    max-height: 480px;
}
body.menu-opened {
    overflow: hidden;
}
body.menuOpen {
    overflow: hidden;
}
body p, body a, body input, body div, body span, body .h1, body .h2, body .h3, body .h4, body .h5, body .h6, body h1, body h2, body h3, body h4, body h5, body h6, body input, body select, body textarea {
    font-family: 'Montserrat', sans-serif !important;
}
body .h1, body .h2, body .h3, body .h4, body .h5, body .h6, body h1, body h2, body h3, body h4, body h5, body h6, body p {
    margin: 0;
}
body .about-title {
    text-transform: uppercase;
    font-family: 'Parker', sans-serif !important;
}
body .about-title a {
    color: #ffffff !important;
    text-decoration: underline;
}
body .game-title {
    font-family: 'Besom', sans-serif !important;
}
body section.main {
    min-height: 100vh;
}
body section.main .true .big-score, body section.main .false .big-score {
    background-image: url("../images/score.png");
    background-position: center;
    background-size: auto;
    background-repeat: no-repeat;
}
body section.main .true .score, body section.main .false .score {
    color: #a7a9ac;
    font-size: 36px;
    font-weight: 200;
}
body section.main .true .view-lead, body section.main .false .view-lead {
    color: #a7a9ac;
    text-decoration: underline;
}
body section.main .true h2, body section.main .false h2 {
    color: #ffa200;
    font-size: 63px;
    font-weight: 600;
}
body section.main .true h5, body section.main .false h5 {
    color: #a7a9ac;
    font-size: 36px;
    font-weight: 200;
    margin-bottom: 20px;
}
body section.main .true h3, body section.main .false h3 {
    color: #a7a9ac;
    font-size: 36px;
}
body section.main .true h3.true-text, body section.main .false h3.true-text {
    color: #8abd24;
}
body section.main .true h3.false-text, body section.main .false h3.false-text {
    color: #ff6666;
}
body section.main .true h4, body section.main .false h4 {
    color: #23c6e6;
    font-size: 30px;
}
body section.main .true .next-btn, body section.main .false .next-btn {
    background-color: #23c6e6;
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 25px;
    text-decoration: none;
    padding: 10px 60px;
}
body section.main .true .next-btn:hover, body section.main .false .next-btn:hover {
    background-color: #ffa200;
    color: #ffffff;
}
body section.main .true p, body section.main .false p {
    color: #a7a9ac;
    font-size: 24px;
}
body section.main .true a, body section.main .false a {
    display: inline-block;
    color: #a7a9ac;
    font-size: 24px;
}
body section.about {
    padding-top: 30px;
}
@media (max-width: 1024px) {
    body section.about {
        padding-top: 150px;
    }
}
body section.about h3 {
    font-size: 50px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1;
    margin-left: -30px;
    padding-left: 30px;
    background-position: left;
    background-size: contain;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}
@media (max-width: 480px) {
    body section.about h3 {
        font-size: 26px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body section.about h3.title1 {
    background-image: url("../images/text1-bg.png");
}
@media (max-width: 1024px) {
    body section.about h3.title1 {
        background-size: contain;
    }
}
body section.about h3.title2 {
    background-image: url("../images/text2-bg.png");
}
body section.about h3.title3 {
    background-image: url("../images/text3-bg.png");
}
body section.about h3.title4 {
    background-image: url("../images/text4-bg.png");
}
body section.about h3.title5 {
    background-image: url("../images/text5-bg.png");
    background-size: cover;
}
@media (max-width: 1024px) {
    body section.about h3.title5 {
        background-size: contain;
    }
}
body section.about h3.title5 a {
    color: #ffffff !important;
    font-weight: bold;
}
body section.about p {
    color: #ffffff;
}
body section.about p a {
    color: #ffffff !important;
    font-weight: bold;
    text-decoration: underline;
}
body section.about p span {
    font-weight: 700;
    color: #ffffff;
}
body section.about p em {
    color: #ffffff;
}
@media (max-width: 1024px) {
    body section.about.subabout {
        padding-top: 50px;
    }
}
body section.about.white-bg {
    background-image: url("../images/white-bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    padding: 120px 0 170px;
}
@media (max-width: 1024px) {
    body section.about.white-bg {
        background-size: cover;
    }
}
body section.about.white-bg img {
    min-height: auto !important;
}
@media (max-width: 480px) {
    body section.about.white-bg .uk-list {
        margin-left: 20px;
    }
}
body section.about.white-bg .red li {
    list-style-image: url(../images/red-dot.png);
    color: #ff6666;
    font-size: 24px;
    font-weight: bold;
}
@media (max-width: 480px) {
    body section.about.white-bg .red li {
        font-size: 18px;
    }
}
body section.about.white-bg .blue li {
    list-style-image: url(../images/blue-dot.png);
    color: #00b1ff;
    font-size: 24px;
    font-weight: bold;
}
@media (max-width: 480px) {
    body section.about.white-bg .blue li {
        font-size: 18px;
    }
}
body section.about.white-bg .violet li {
    list-style-image: url(../images/violet-dot.png);
    color: #cf4dff;
    font-size: 24px;
    font-weight: bold;
}
@media (max-width: 480px) {
    body section.about.white-bg .violet li {
        font-size: 18px;
    }
}
body section.about.big-white-bg {
    background-image: url("../images/big-white-bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    padding: 120px 0 250px;
}
@media (max-width: 1440px) {
    body section.about.big-white-bg {
        background-position: top center;
        background-size: cover;
    }
}
@media (max-width: 480px) {
    body section.about.big-white-bg {
        background-color: #ffffff;
        padding: 100px 0;
    }
}
body section.about.big-white-bg img {
    min-height: auto !important;
}
body section.about.big-white-bg h3 {
    color: #ffa200;
    font-size: 60px;
    font-family: 'Parker', sans-serif !important;
    text-transform: uppercase;
}
@media (max-width: 480px) {
    body section.about.big-white-bg h3 {
        font-size: 40px;
    }
}
body section.about.big-white-bg p {
    color: #414042;
    font-size: 24px;
    font-weight: 200;
}
@media (max-width: 480px) {
    body section.about.big-white-bg p {
        font-size: 18px;
    }
}
body header {
    min-height: 100vh;
    background-image: url("../images/header_bg.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}
body header nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header nav {
        padding: 20px 45px 0;
    }
}
@media (max-width: 1280px) {
    body header nav {
        padding-top: 0;
    }
}
body header nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 0 35px;
    position: relative;
    z-index: 2;
}
body header nav .glitch.active:before {
    content: '';
    display: block;
    position: absolute;
    top: 20px;
    left: 0;
    background-color: #00b1ff;
    width: 100%;
    border-radius: 25px;
    height: 40px;
    z-index: -1;
}
@media (max-width: 1280px) {
    body header nav .glitch {
        font-size: 20px;
    }
}
body header nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #ffffff;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
@media (max-width: 1440px) {
    body header nav .glitch {
        font-size: 20px;
    }
}
body header .content h4 {
    color: #ffffff;
    font-size: 48px;
    text-transform: uppercase;
    font-weight: 200;
}
@media (max-width: 480px) {
    body header .content h4 {
        font-size: 28px;
    }
}
body header .content h3 {
    color: #ffffff;
    font-size: 96px;
    font-weight: 700;
}
@media (max-width: 480px) {
    body header .content h3 {
        font-size: 40px;
    }
}
body header .content h6 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 200;
}
@media (max-width: 480px) {
    body header .content h6 {
        font-size: 20px;
    }
}
body header .content p {
    color: #ffffff;
    font-size: 18px;
}
@media (max-width: 480px) {
    body header .content p {
        font-size: 16px;
    }
}
body header .content .btn-link {
    border-radius: 30px;
    position: relative;
    display: inline-block;
    padding: 15px 50px;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #23c6e6;
    font-size: 24px;
    font-weight: 700;
    text-decoration: none;
}
@media (max-width: 480px) {
    body header .content .btn-link {
        font-size: 18px;
        padding: 15px 40px;
    }
    body header .content .btn-link img {
        width: 25%;
    }
}
body header .content .btn-link:before, body header .content .btn-link:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 30px;
    border: none;
}
body header .content .btn-link:before {
    background-color: #19f3dd;
    z-index: -2;
}
body header .content .btn-link:after {
    background-color: #ff3600;
    z-index: -3;
}
body header .content .btn-link:hover .link-inner {
    animation: glitchy 0.3s ease infinite;
}
body header .content .btn-link:hover:before {
    animation: glitchy 0.3s ease 0.3s infinite;
}
body header .content .btn-link:hover:after {
    animation: glitchy 0.3s ease infinite reverse;
}
body header .content .btn-link .link-inner {
    display: block;
    height: 100%;
}
@keyframes glitchy {
    0% {
        transform: translate(-2px, 2px);
    }
    25% {
        transform: translate(-2px, -2px);
    }
    50% {
        transform: translate(2px, 2px);
    }
    75% {
        transform: translate(2px, -2px);
    }
    100% {
        transform: translate(-2px, 2px);
    }
}
body header .uk-divider-vertical {
    height: 80px;
    border-left: 1px solid #ffffff;
    margin-bottom: 0;
}
@media (max-width: 1440px) {
    body header .uk-divider-vertical {
        height: 60px;
    }
}
@media (max-width: 1280px) {
    body header .uk-divider-vertical {
        height: 40px;
    }
}
@media (max-width: 480px) {
    body header .uk-divider-vertical {
        display: none;
    }
}
body header .uk-table {
    border-collapse: collapse;
    border-radius: 25px;
    overflow: hidden;
}
body header .uk-table thead {
    background-color: #ff6666;
    border-radius: 25px;
}
body header .uk-table thead * {
    color: #ffffff;
    font-weight: bold;
}
body header .uk-table.uk-table-striped tbody tr:nth-of-type(odd), body header .uk-table .uk-table-striped > tr:nth-of-type(odd) {
    background: #3ecd9a;
    border: none;
}
body header .uk-table.uk-table-striped tbody tr:nth-of-type(odd) *, body header .uk-table .uk-table-striped > tr:nth-of-type(odd) * {
    color: #ffffff;
}
body header .uk-table.uk-table-striped tbody tr:nth-of-type(even), body header .uk-table .uk-table-striped > tr:nth-of-type(even) {
    background: #4ce1ac;
    border: none;
}
body header .uk-table.uk-table-striped tbody tr:nth-of-type(even) *, body header .uk-table .uk-table-striped > tr:nth-of-type(even) * {
    color: #ffffff;
}
body header .viewAll {
    display: block;
    color: #ffffff;
    text-transform: uppercase;
    text-decoration: underline;
    margin-bottom: 30px;
    font-weight: bold;
}
body header .card {
    pointer-events: none;
    transform: translateZ(0);
    padding: 30px;
    border-radius: 5px;
    width: 100vw;
    height: 100vh;
    margin: auto;
    top: 0;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    position: absolute;
}
body header .card-content {
    margin: auto;
    text-align: center;
    width: 100%;
    float: left;
    position: relative;
    transform-style: preserve-3d;
}
body header .card-content .img {
    position: absolute;
    height: 90vh;
    top: 32px;
    right: 0;
    left: 0;
    margin: auto;
}
body header .card-content .img1 {
    transform: translateZ(150px);
}
body header .card-content .img2 {
    transform: translateZ(50px);
}
body header .card-content .img3 {
    transform: translateZ(80px);
}
body header.true-false {
    background-image: url("../images/main-bg.jpg");
}
body header.true-false nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header.true-false nav {
        padding: 20px 45px 0;
    }
}
@media (max-width: 1024px) {
    body header.true-false nav img {
        width: 60%;
    }
}
body header.true-false nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #a7a9ac;
    padding: 0 35px;
}
@media (max-width: 1440px) {
    body header.true-false nav .glitch {
        padding: 0 15px;
    }
}
@media (max-width: 1280px) {
    body header.true-false nav .glitch {
        font-size: 20px;
    }
}
body header.true-false nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #a7a9ac;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
body header.true-false .uk-position-center {
    top: 53%;
}
body header.true-false .content {
    position: relative;
    max-width: 1200px;
    width: 100%;
}
body header.true-false .content .timer {
    position: absolute;
    right: 0;
    text-align: right;
}
@media (max-width: 480px) {
    body header.true-false .content .timer {
        top: -80px;
        left: 0;
        margin: auto;
        width: 100px;
        text-align: center !important;
    }
}
@media (max-width: 360px) {
    body header.true-false .content .timer {
        top: -60px;
    }
}
body header.true-false .content .timer h3 {
    color: #a7a9ac;
    font-size: 30px;
    font-weight: 600;
}
@media (max-width: 1440px) {
    body header.true-false .content .timer h3 {
        font-size: 25px;
    }
}
@media (max-width: 360px) {
    body header.true-false .content .timer h3 {
        font-size: 20px;
    }
}
body header.true-false .content p {
    color: #a7a9ac;
    font-size: 30px;
    font-weight: 200;
}
@media (max-width: 1440px) {
    body header.true-false .content p {
        font-size: 25px;
    }
}
@media (max-width: 360px) {
    body header.true-false .content p {
        font-size: 20px;
    }
}
body header.true-false .content h2 {
    color: #ffa200;
    font-size: 63px;
    font-weight: 600;
}
@media (max-width: 1440px) {
    body header.true-false .content h2 {
        font-size: 53px;
    }
}
@media (max-width: 360px) {
    body header.true-false .content h2 {
        font-size: 40px;
    }
}
body header.true-false .content .question-container {
    background-image: url("../images/question-bg.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    min-height: 550px;
    padding: 30px 0 60px;
    margin-top: 0;
}
@media (max-width: 480px) {
    body header.true-false .content .question-container {
        background-size: cover;
        min-height: auto;
        padding: 20px 0;
    }
}
body header.true-false .content .question-container .wrapper {
    padding: 120px 80px 100px;
}
@media (max-width: 1440px) {
    body header.true-false .content .question-container .wrapper {
        padding: 70px 50px 70px;
    }
}
@media (max-width: 480px) {
    body header.true-false .content .question-container .wrapper {
        padding: 0 20px 20px;
    }
}
@media (max-width: 480px) {
    body header.true-false .content .question-container .wrapper .uk-grid-margin {
        margin-top: 20px;
    }
}
body header.true-false .content .question-container p {
    color: #ffffff;
    font-size: 24px;
    font-weight: 200;
}
@media (max-width: 1440px) {
    body header.true-false .content .question-container p {
        font-size: 20px;
    }
}
body header.true-false .content .question-container p.sub-title {
    margin-top: 40px;
}
@media (max-width: 1440px) {
    body header.true-false .content .question-container p.sub-title {
        margin-top: 65px;
    }
}
@media (max-width: 480px) {
    body header.true-false .content .question-container p.sub-title {
        margin-top: 0;
    }
}
body header.true-false .content .question-container h3 {
    font-size: 32px;
    color: #ffffff;
    width: 80%;
    margin: 10px auto 30px;
}
@media (max-width: 1440px) {
    body header.true-false .content .question-container h3 {
        font-size: 25px;
        width: 100%;
    }
}
@media (max-width: 480px) {
    body header.true-false .content .question-container h3 {
        font-size: 20px;
        margin: 10px auto;
    }
}
body header.true-false .content .question-container .buttons button {
    width: 100%;
    border-radius: 25px;
    border: none;
    background-color: #ffffff;
    color: #23c6e6;
    font-size: 24px;
    font-weight: 600;
    padding: 10px;
    cursor: pointer;
}
@media (max-width: 480px) {
    body header.true-false .content .question-container .buttons button {
        font-size: 18px;
        width: 60%;
        margin: 0 auto;
    }
}
body header.true-false .content .question-container .buttons button:hover {
    background-color: #ffa200;
    animation: glitchs 0.5s infinite;
    color: #ffffff;
}
@keyframes glitchs {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #23c6e6;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #23c6e6;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
body header.true-false .content .question-container .hint-btn {
    background: none;
    border: none;
    color: #ffffff;
    font-size: 20px;
    margin-bottom: 50px;
}
body header.true-false .content .question-container .hint-btn:hover {
    color: #000000;
    text-decoration: none;
}
body header.about {
    background: none;
    min-height: 1px;
}
body header.about nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header.about nav {
        padding: 20px 45px 0;
    }
    body header.about nav img {
        width: 60%;
    }
}
body header.about nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 0 35px;
}
@media (max-width: 1440px) {
    body header.about nav .glitch {
        padding: 0 15px;
    }
}
@media (max-width: 1280px) {
    body header.about nav .glitch {
        font-size: 20px;
    }
}
body header.about nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #ffffff;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
@media (max-width: 960px) {
    body header.rules {
        padding: 120px 0;
    }
}
@media (max-width: 768px) {
    body header.rules {
        padding: 100px 0;
    }
}
body header.rules nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header.rules nav {
        padding: 20px 45px 0;
    }
    body header.rules nav img {
        width: 60%;
    }
}
body header.rules nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 0 35px;
}
@media (max-width: 1440px) {
    body header.rules nav .glitch {
        padding: 0 15px;
    }
}
@media (max-width: 1280px) {
    body header.rules nav .glitch {
        font-size: 20px;
    }
}
body header.rules nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #ffffff;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
body header.rules h3 {
    font-size: 50px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1;
    padding-left: 10px;
    background-position: left;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}
@media (max-width: 480px) {
    body header.rules h3 {
        font-size: 26px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body header.rules h3.title1 {
    background-image: url("../images/rules-bg.png");
    background-size: cover;
    padding: 0 10px;
    width: max-content;
}
body header.rules p {
    color: #ffffff;
    font-size: 15px;
    font-weight: bold;
}
@media (min-width: 1024px) {
    body header.koz {
        padding-bottom: 120px;
    }
}
@media (max-width: 960px) {
    body header.koz {
        padding: 120px 0;
    }
}
@media (max-width: 768px) {
    body header.koz {
        padding: 100px 0;
    }
}
body header.koz nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header.koz nav {
        padding: 20px 45px 0;
    }
    body header.koz nav img {
        width: 60%;
    }
}
body header.koz nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 0 35px;
}
@media (max-width: 1440px) {
    body header.koz nav .glitch {
        padding: 0 15px;
    }
}
@media (max-width: 1280px) {
    body header.koz nav .glitch {
        font-size: 20px;
    }
}
body header.koz nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #ffffff;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
body header.koz h3 {
    font-size: 47px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1;
    padding-left: 10px;
    background-position: left;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}
@media (max-width: 480px) {
    body header.koz h3 {
        font-size: 26px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body header.koz h3.title1 {
    background-image: url("../images/koz_img2.png");
    background-size: contain;
    padding: 0 20px;
    width: fit-content;
}
body header.koz h3.title2 {
    background-image: url("../images/koz_img3.png");
    background-size: contain;
    padding: 0 20px;
    width: fit-content;
}
body header.koz p {
    color: #ffffff;
    font-size: 20px;
}
body header.koz p span {
    font-weight: bold;
}
body header.koz ul {
    padding-left: 18px;
}
body header.koz ul li {
    color: #ffffff;
    font-size: 20px;
    margin-bottom: 25px;
}
body header.koz h4 {
    color: #ffffff;
    font-size: 30px;
    font-weight: bold;
    background-position: left;
    background-repeat: no-repeat;
}
body header.koz h4.stitle1 {
    background-image: url("../images/koz_img4.png");
    background-size: contain;
    padding: 0 20px;
    font-size: 30px;
    font-weight: normal;
    font-family: 'Parker', sans-serif !important;
}
body header.koz h4.stitle2 {
    background-image: url("../images/koz_img5.png");
    background-size: contain;
    padding: 0 20px;
    font-family: 'Parker', sans-serif !important;
    font-size: 30px;
    font-weight: normal;
}
body header.koz h4.stitle3 {
    background-image: url("../images/koz_img6.png");
    background-size: contain;
    padding: 0 20px;
    font-family: 'Parker', sans-serif !important;
    font-size: 30px;
    font-weight: normal;
}
body header.koz h4.stitle4 {
    background-image: url("../images/koz_img7.png");
    background-size: contain;
    padding: 0 20px;
    font-family: 'Parker', sans-serif !important;
    font-size: 30px;
    font-weight: normal;
}
@media (max-width: 960px) {
    body header.sponsor {
        padding: 120px 0 0;
    }
}
@media (max-width: 768px) {
    body header.sponsor {
        padding: 100px 0 0;
    }
}
body header.sponsor nav {
    padding: 45px 45px 0;
}
@media (max-width: 1440px) {
    body header.sponsor nav {
        padding: 20px 45px 0;
    }
    body header.sponsor nav img {
        width: 60%;
    }
}
body header.sponsor nav .glitch {
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffffff;
    padding: 0 35px;
}
@media (max-width: 1440px) {
    body header.sponsor nav .glitch {
        padding: 0 15px;
    }
}
@media (max-width: 1280px) {
    body header.sponsor nav .glitch {
        font-size: 20px;
    }
}
body header.sponsor nav .glitch:hover {
    animation: glitch 0.5s infinite;
    color: #ffffff;
}
@keyframes glitch {
    from {
        text-shadow: 0 0px 0px white;
    }
    20% {
        text-shadow: 2px -2px 0px #19f3dd;
    }
    40% {
        text-shadow: -2px 2px 0px #ff3600;
    }
    60% {
        text-shadow: 2px 2px 0px #19f3dd;
    }
    80% {
        text-shadow: -2px -2px 0px #ff3600;
    }
    to {
        text-shadow: 0px 0px 0px white;
    }
}
body header.sponsor .sponsors {
    background-image: url("../images/sponsor_bg.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    min-height: 100vh;
}
body header.sponsor h5 {
    color: #ffa200;
    font-weight: bold;
    font-size: 30px;
    text-transform: uppercase;
}
@media (max-width: 768px) {
    body header.sponsor h5 {
        font-size: 25px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body header.sponsor h3 {
    color: #ffffff;
    line-height: 1;
    background-position: left;
    background-repeat: no-repeat;
    margin-bottom: 30px;
    font-family: 'Parker', sans-serif !important;
    font-size: 30px;
    text-transform: uppercase;
    font-weight: normal;
}
@media (max-width: 480px) {
    body header.sponsor h3 {
        font-size: 26px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body header.sponsor h3.gold {
    background-image: url("../images/gold.png");
    background-size: contain;
    padding: 0 10px;
}
body header.sponsor h3.silver {
    background-image: url("../images/silver.png");
    background-size: contain;
    padding: 0 10px;
}
body header.sponsor h3.media {
    background-image: url("../images/media.png");
    background-size: cover;
    padding: 0 10px;
    width: fit-content;
    padding: 0 10px;
}
body:not(#home) .off-header img {
    transition: opacity .6s ease-out;
}
body:not(#home) .off-header .bar {
    background: #ffa200 !important;
}
body:not(#home) .off-header.menu-opened {
    height: 100%;
    background-color: #ffa200;
}
body:not(#home) .off-header.menu-opened .bar {
    background: #ffffff !important;
}
body:not(#home) .off-header.menu-opened img {
    opacity: 0;
    transition: opacity .6s ease-out;
}
body#about .off-header, body#rules .off-header, body#koz .off-header, body#sponsor .off-header {
    height: auto;
}
body#about .off-header img, body#rules .off-header img, body#koz .off-header img, body#sponsor .off-header img {
    transition: opacity .6s ease-out;
}
body#about .off-header .bar, body#rules .off-header .bar, body#koz .off-header .bar, body#sponsor .off-header .bar {
    background: #ffffff !important;
}
body#about .off-header.menu-opened, body#rules .off-header.menu-opened, body#koz .off-header.menu-opened, body#sponsor .off-header.menu-opened {
    height: 100%;
    background-color: #ffa200;
}
body#about .off-header.menu-opened .bar, body#rules .off-header.menu-opened .bar, body#koz .off-header.menu-opened .bar, body#sponsor .off-header.menu-opened .bar {
    background: #ffffff !important;
}
body#about .off-header.menu-opened img, body#rules .off-header.menu-opened img, body#koz .off-header.menu-opened img, body#sponsor .off-header.menu-opened img {
    opacity: 0;
    transition: opacity .6s ease-out;
}
body .off-header {
    padding-bottom: 20px;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    height: 60px;
    width: 100%;
    overflow: hidden;
    transition: all 0.5s ease-out, background 1s ease-out;
    transition-delay: 0.2s;
}
body .off-header .icon-fbk {
    border: 2px solid #ffffff;
    border-radius: 50%;
    padding: 10px;
}
body .off-header .icon-fbk svg {
    width: 25px;
    fill: #ffffff;
}
body .off-header img {
    width: 20%;
    z-index: 9;
    position: relative;
}
body .off-header .burger-container {
    position: absolute;
    right: 0;
    display: inline-block;
    height: 50px;
    width: 50px;
    cursor: pointer;
    transform: rotate(0deg);
    transition: all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99);
    user-select: none;
    z-index: 9;
    -webkit-tap-highlight-color: transparent;
}
body .off-header .burger-container #burger {
    width: 28px;
    height: 8px;
    position: relative;
    display: block;
    margin: -4px auto 0;
    top: 50%;
}
body .off-header .burger-container #burger .bar {
    width: 100%;
    height: 2px;
    display: block;
    position: relative;
    background: #FFF;
    transition: all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99);
    transition-delay: 0s;
}
body .off-header .burger-container #burger .bar.topBar {
    transform: translateY(0px) rotate(0deg);
}
body .off-header .burger-container #burger .bar.midBar {
    transform: translateY(-12px) rotate(0deg);
}
body .off-header .burger-container #burger .bar.btmBar {
    transform: translateY(6px) rotate(0deg);
}
body .off-header .icon {
    display: inline-block;
    position: absolute;
    height: 100%;
    line-height: 50px;
    width: 50px;
    height: 50px;
    text-align: center;
    color: #ffffff;
    font-size: 22px;
    left: 50%;
    transform: translateX(-50%);
}
body .off-header .icon.icon-bag {
    right: 0;
    top: 0;
    left: auto;
    transform: translateX(0px);
    transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99);
    transition-delay: 0.65s;
}
body .off-header ul.menu {
    position: relative;
    display: block;
    padding: 25px 48px 30px;
    margin-top: 0;
    list-style: none;
}
body .off-header ul.menu li.menu-item {
    margin-top: 5px;
    transform: scale(1.15) translateY(-30px);
    opacity: 0;
    text-align: right;
    font-size: 40px;
    font-weight: 600;
    transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
}
body .off-header ul.menu li.menu-item a {
    display: block;
    position: relative;
    color: #ffffff;
    font-family: "Ek Mukta", sans-serif;
    text-decoration: none;
    font-size: 30px;
    font-weight: 500;
    line-height: 2.35;
    width: 100%;
}
body .off-header a.menu-item {
    transform: scale(1.15) translateY(-30px);
    opacity: 0;
    text-align: right;
    transition: transform 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99), opacity 0.6s cubic-bezier(0.4, 0.01, 0.165, 0.99);
}
body .off-header.menu-opened {
    height: 100%;
    background-color: #ffa200;
    transition: all 0.3s ease-in, background 0.5s ease-in;
    transition-delay: 0.25s;
    z-index: 2;
}
body .off-header.menu-opened .burger-container {
    transform: rotate(90deg);
}
body .off-header.menu-opened .burger-container #burger .bar {
    transition: all 0.4s cubic-bezier(0.4, 0.01, 0.165, 0.99);
    transition-delay: 0.2s;
    background: #ffffff;
}
body .off-header.menu-opened .burger-container #burger .bar.topBar {
    transform: translateY(6px) rotate(45deg);
}
body .off-header.menu-opened .burger-container #burger .bar.midBar {
    transform: translateY(4.5px) rotate(45deg);
}
body .off-header.menu-opened .burger-container #burger .bar.btmBar {
    transform: translateY(3px) rotate(-45deg);
}
body .off-header.menu-opened ul.menu {
    display: block;
}
body .off-header.menu-opened ul.menu li.menu-item {
    transform: scale(1) translateY(0px);
    opacity: 1;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(1) {
    transition-delay: 0.27s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(2) {
    transition-delay: 0.34s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(3) {
    transition-delay: 0.41s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(4) {
    transition-delay: 0.48s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(5) {
    transition-delay: 0.55s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(6) {
    transition-delay: 0.62s;
}
body .off-header.menu-opened ul.menu li.menu-item:nth-child(7) {
    transition-delay: 0.69s;
}
body .off-header.menu-opened a.menu-item {
    transform: scale(1) translateY(0px);
    opacity: 1;
}
body .off-header.menu-opened a.menu-item:nth-child(1) {
    transition-delay: 0.27s;
}
body .off-header.menu-opened a.menu-item:nth-child(2) {
    transition-delay: 0.34s;
}
body .off-header.menu-opened a.menu-item:nth-child(3) {
    transition-delay: 0.41s;
}
body .off-header.menu-opened a.menu-item:nth-child(4) {
    transition-delay: 0.48s;
}
body .off-header.menu-opened a.menu-item:nth-child(5) {
    transition-delay: 0.55s;
}
body .off-header.menu-opened a.menu-item:nth-child(6) {
    transition-delay: 0.62s;
}
body .off-header.menu-opened a.menu-item:nth-child(7) {
    transition-delay: 0.69s;
}
body .off-header.menu-opened .icon.icon-bag {
    transform: translateX(75px);
    transition-delay: 0.3s;
}
body section {
    position: relative;
    padding: 100px 0;
}
body section .uk-divider-vertical {
    height: 50px;
    border-left: 1px solid #ffa200;
    margin-bottom: 0;
}
body section h3 {
    font-size: 36px;
    font-weight: 700;
    color: #ffa200;
    line-height: 1.3;
}
@media (max-width: 480px) {
    body section h3 {
        font-size: 26px;
    }
}
body section img {
    min-height: 250px;
}
@media (max-width: 480px) {
    body section .wrapper {
        width: 100% !important;
    }
}
body section .disable {
    position: relative;
}
body section .disable img {
    opacity: .15;
}
body section .disable:after {
    content: '';
    background-image: url("../images/lock.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
    width: 100%;
    height: 250px;
    position: absolute;
    display: block;
    z-index: 199999;
    top: 0;
}
body section .disable .btn-link {
    background-color: #a7a9ac;
    pointer-events: none;
}
body section .game-title {
    font-size: 48px;
}
body section .game-title.title1 {
    color: #ff6666;
}
body section .game-title.title2 {
    color: #cf4dff;
}
body section .game-title.title3 {
    color: #00b1ff;
}
body section .game-title.title4 {
    color: #00ff91;
}
body section p span {
    font-weight: 700;
    color: #23c6e6;
}
body section .btn-link {
    border-radius: 30px;
    position: relative;
    display: inline-block;
    padding: 10px 50px;
    margin-top: 20px;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #23c6e6;
    font-size: 20px;
    font-weight: 700;
    text-decoration: none;
}
@media (max-width: 480px) {
    body section .btn-link {
        padding: 10px 20px;
    }
}
body section .btn-link:hover .link-inner {
    animation: glitchy 0.3s ease infinite;
}
body section .btn-link .link-inner {
    display: block;
    height: 100%;
}
@keyframes glitchy {
    0% {
        transform: translate(-2px, 2px);
    }
    25% {
        transform: translate(-2px, -2px);
    }
    50% {
        transform: translate(2px, 2px);
    }
    75% {
        transform: translate(2px, -2px);
    }
    100% {
        transform: translate(-2px, 2px);
    }
}
body #koz h3 {
    font-size: 50px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1;
    padding-left: 10px;
    background-position: left;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}
@media (max-width: 480px) {
    body #koz h3 {
        font-size: 26px;
        margin-left: -10px;
        padding-left: 10px;
    }
}
body #koz h3.title1 {
    background-image: url("../images/koz_img2.png");
    background-size: cover;
    padding: 0 10px;
    width: max-content;
}
body .uk-modal h3 {
    font-size: 28px;
    margin-bottom: 20px;
    font-weight: 600;
    color: #ffffff;
}
body .uk-modal .uk-modal-dialog {
    background-image: url(../images/question-bg.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    min-height: 200px;
    padding: 150px 100px;
    background-color: transparent;
    color: #ffffff;
}
body .uk-modal button.uk-icon:not(:disabled) {
    color: #ffffff;
    transform: scale(1.5);
}
body footer {
    background-color: #ffa200;
    padding: 20px 0;
    font-size: 15px;
    color: #ffffff;
}
body footer a {
    color: #ffffff;
}
body footer a:hover {
    color: #ff2a00;
}

::-webkit-scrollbar {
    width: 8px;
    border-radius: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #ff6666;
    transition: all .3s ease-out;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #a3c4e5;
    transition: all .3s ease-out;
}

.uk-list > li::after, .uk-list > li::before {
    display: block;
    content: '';
}



/* Eal */

@media (max-width: 1440px) {
    body .uk-navbar .uk-navbar-left img {
        width: 50%;
    }
}
@media (min-width: 481px) and (max-width: 1440px) {
    body .uk-position-center {
        transform: translate(-50%, -50%) scale(0.7);
        z-index: 9;
    }
}
body header.sponsor .sponsors {
    padding-bottom: 100px;
}
body header.rules {
    padding-bottom: 100px;
}

@media (max-width: 480px){
    body section .true {
        margin-top: 30px;
        padding-bottom: 50px;
    }
}
