/*==================== Google fonts ====================*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,700;1,900&display=swap');

body {
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 400;
    background: #0C0F1D;
    color: #FFF;
}

a {
    display: inline-block;
    text-decoration: none;
    transition: 0.2s all ease;
    -webkit-transition: 0.2s all ease;
    -moz-transition: 0.2s all ease;
}

    a:visited,
    a:hover,
    a:active {
        text-decoration: none;
    }

ul,
ol {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

img {
    max-width: 100%;
}

html {
    font-size: 0.52vw;
}

/*scrollto-top*/
.scrollto-top {
    width: 40px;
    height: 40px;
    border-radius: 20px 20px 0 0;
    background: #2E66F5;
    text-align: center;
    padding-top: 8px;
    font-size: 18px;
    color: #FFF;
    position: fixed;
    right: 5px;
    bottom: 5px;
    display: none;
    transition: 0.2s all ease;
    -webkit-transition: 0.2s all ease;
    -moz-transition: 0.2s all ease;
}

    .scrollto-top:hover {
        background: #2E66F5;
        color: #fff;
        box-shadow: 0px 0px 5px rgba(0,0,0,.5);
        -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.5);
        -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.5);
    }

/*==================== header-area start ====================*/
.container {
    max-width: 152rem;
    width: 152rem;
    padding-left: 15px;
    padding-right: 15px;
}

.header-area {
    background: #0D1120;
    padding: 4rem 0;
}

.header_main {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header_left ul {
    display: flex;
    align-items: center;
}

    .header_left ul li img {
        width: 4.4rem;
    }

    .header_left ul li {
        padding-right: 8rem;
    }

        .header_left ul li a {
            font-size: 1.6rem;
            font-weight: 600;
            text-transform: uppercase;
            color: #6576A0;
            transition: 0.2s all ease;
        }

            .header_left ul li a.active,
            .header_left ul li a:hover {
                color: #FFF;
                text-shadow: 0px 0px 8px rgba(134, 197, 255, 0.24);
            }

.header_right ul {
    display: flex;
    align-items: center;
}

    .header_right ul li a {
        font-size: 1.4rem;
        font-weight: 600;
        color: #6576A0;
        text-transform: uppercase;
        border: 2px solid #3F4C6E;
        display: inline-block;
        padding: 1.4rem 1.8rem;
        border-radius: 1.5rem;
        margin-left: 2rem;
        transition: 0.2s all ease;
    }

        .header_right ul li a:hover {
            color: #FFF;
            border-color: #FFF;
        }

/*===================== main_wrapper start ===================*/
.main_part {
    display: flex;
    align-items: flex-start;
    grid-gap: 4rem;
}

.main_left {
    width: 38rem;
}

.main_right {
    width: 110rem;
}

.best_box {
    background: #252B4C;
    padding: 4rem 3.2rem 3.2rem;
    position: relative;
    border-radius: 32px;
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset, 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
}


.best_upper img {
    max-width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.best_upper h4 {
    font-size: 2.4rem;
    font-weight: 600;
    color: #FFF;
    text-align: right;
    line-height: 1.45;
}

.best_upper p {
    font-size: 2.4rem;
    font-weight: 600;
    color: #FFF;
    text-align: right;
    margin-top: 1.6rem;
}

    .best_upper p span {
        background: radial-gradient(143.59% 322.73% at 20.69% -0.00%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

.best_item {
    padding: 12rem 0 3.5rem;
}

    .best_item ul li {
        display: flex;
        align-items: center;
        font-size: 1.6rem;
        font-weight: 500;
        color: #FFF;
        font-variant: small-caps;
        padding: 0.7rem 0;
    }

        .best_item ul li img {
            width: 2.4rem;
            margin-right: 1.4rem;
        }

.best_cnt p {
    width: 30rem;
    font-size: 1.4rem;
    font-weight: 500;
    color: #A1B2DD;
    margin-bottom: 3.6rem;
}

.best_cnt a {
    font-size: 1.8rem;
    font-weight: 600;
    color: #6576A0;
    border: 0.2rem solid #3F4C6E;
    padding: 1.5rem 1.5rem;
    display: block;
    text-align: center;
    border-radius: 1.5rem;
    margin-top: 2rem;
    transition: 0.2s all ease;
}

    .best_cnt a:hover,
    .best_cnt a.active {
        color: #FFF;
        background: radial-gradient(75.50% 150.00% at 47.14% -48.75%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
        box-shadow: 0px 7.23944616317749px 12.065741539001465px 0px rgba(22, 30, 50, 0.09);
    }

.bonus_box {
    border-radius: 3.2rem;
    border-top: 0.2px solid rgba(134, 189, 255, 0.44);
    background: radial-gradient(129.38% 129.38% at 50.00% 0%, #243050 0%, #171E37 100%);
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset, 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
    margin-top: 5rem;
}

.bonud_title {
    padding: 3.2rem 2.8rem 3.2rem;
    border-bottom: 1px solid #313C5D;
}

    .bonud_title h4 {
        font-size: 1.6rem;
        font-weight: 600;
        color: #FFF;
        text-transform: uppercase;
        margin: 0;
    }

.bonus_box ul {
    padding: 0.5rem 3.2rem 3.2rem;
}

    .bonus_box ul li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-top: 1.8rem;
    }

        .bonus_box ul li p {
            display: flex;
            align-items: center;
            font-size: 1.6rem;
            font-weight: 500;
            color: #FFF;
        }

            .bonus_box ul li p img {
                max-width: 100%;
                margin-right: 1.5rem;
            }

        .bonus_box ul li span {
            font-size: 1.6rem;
            font-weight: 600;
            color: #FFF;
            text-transform: uppercase;
            background: radial-gradient(75.50% 150.00% at 47.14% -48.75%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
            display: inline-block;
            padding: 1rem 2.2rem;
            border-radius: 1.2rem;
        }

.topBox {
    margin-top: 2rem;
}

.bonus_box ul li a {
    font-size: 1.4rem;
    font-weight: 600;
    color: #FFF;
    text-transform: uppercase;
    background: radial-gradient(75.50% 150.00% at 47.14% -48.75%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
    display: inline-block;
    padding: 1.1rem 1.5rem;
    border-radius: 1.2rem;
    transition: 0.2s all ease;
}

    .bonus_box ul li a:hover {
        opacity: 0.8;
    }

.topBox_title .nav-tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .topBox_title .nav-tabs .nav-link {
        font-size: 1.6rem;
        font-weight: 600;
        color: #6576A0;
        background: none;
        padding: 0 1.5rem;
        text-align: center;
        border: none;
        text-transform: uppercase;
        transition: 0.2s all ease;
        position: relative;
        margin: 0;
        transition: 0.2s all ease;
    }

        .topBox_title .nav-tabs .nav-link.active,
        .topBox_title .nav-tabs .nav-link:hover {
            color: #FFF;
            text-shadow: 0px 0px 8px rgba(134, 197, 255, 0.24);
            border: none;
        }

        .topBox_title .nav-tabs .nav-link::after {
            content: "";
            width: 0%;
            height: 0.3rem;
            display: block;
            background: radial-gradient(71.22% 141.04% at 6.13% -27.93%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
            position: absolute;
            border-radius: 1rem 1rem;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: -3.2rem;
            transition: 0.2s all ease;
        }

        .topBox_title .nav-tabs .nav-link.active::after,
        .topBox_title .nav-tabs .nav-link:hover::after {
            width: 100%;
        }

.right_part {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    grid-gap: 5rem;
    padding: 2.4rem 4.8rem 0 3.5rem;
    background: #161E34;
    border: 0.2rem solid transparent;
    box-shadow: 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
    border-radius: 2.4rem;
    position: relative;
    transition: 0.2s all ease;
    margin-bottom: 2rem;
}

.right_leftinner {
    width: 64%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    grid-gap: 4.5rem;
}

.right_innerright {
    width: 36%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.games_logo {
    width: 30%;
    text-align: center;
    padding-top: 1rem;
}

.deposit_cnt {
    width: 70%;
}

.games_logo img {
    max-width: 100%;
}

.deposit_cnt p {
    font-size: 1.4rem;
    font-weight: 600;
    color: #FFF;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
}

.deposit_itemcard {
    width: 100%;
    height: 7.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
    background: #D3DBF1;
    border: 0.2rem solid transparent;
    padding: 1rem 1.5rem;
    border-radius: 2.8rem 2.8rem 0 0;
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.04) inset;
    transition: 0.2s all ease;
}

    .deposit_itemcard ul {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .deposit_itemcard ul li {
            padding: 0.3rem 0.6rem;
        }

        .deposit_itemcard ul img {
            max-width: 100%;
        }

.right_innerright ul li {
    display: flex;
    align-items: center;
    font-size: 1.4rem;
    font-weight: 500;
    color: #FFF;
    margin: 0.7rem 0;
}

    .right_innerright ul li img {
        width: 2rem;
        margin-right: 1.2rem;
    }

.play_btn span {
    font-size: 1.6rem;
    font-weight: 600;
    color: #6576A0;
    text-transform: uppercase;
    background: #252B4C;
    border-top: 0.2rem solid transparent;
    border-radius: 1.6rem;
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.06) inset;
    backdrop-filter: blur(2.3109049797058105px);
    display: inline-block;
    padding: 1.4rem 3.2rem;
    transition: 0.2s all ease;
}

.hash_number {
    position: absolute;
    top: 0;
    right: 0;
}

    .hash_number span {
        font-size: 1.6rem;
        font-weight: 600;
        letter-spacing: 0.16px;
        color: #6576A0;
        background: #252B4C;
        padding: 0.4rem 1.5rem;
        display: inline-block;
        border-radius: 0 2rem 0 2rem;
        transition: 0.2s all ease;
    }

.right_part:hover,
.right_part.active {
    border: 0.2rem solid #1B57F1;
    background: rgba(36, 48, 80, 0.40);
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset, 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
}

    .right_part:hover .play_btn span,
    .right_part.active .play_btn span {
        color: #FFF;
        border-top: 0.2rem solid rgba(134, 189, 255, 0.44);
        background: radial-gradient(75.50% 150.00% at 47.14% -48.75%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
        box-shadow: 0px 7.23944616317749px 12.065741539001465px 0px rgba(22, 30, 50, 0.09);
    }

    .right_part:hover .hash_number span,
    .right_part.active .hash_number span {
        background: radial-gradient(249.31% 420.33% at 363.54% -201.25%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
        color: #FFF;
    }

    .right_part:hover .deposit_itemcard,
    .right_part.active .deposit_itemcard {
        border-color: #1C58F1;
    }

/*================== slider-area start ===================*/
.slider-area {
    padding: 4rem 0;
}

.slider_item {
    padding: 2.8rem 2rem 3.2rem;
    min-height: 16rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 2.4rem;
    background: rgba(36, 48, 80, 0.40);
    border: 1px solid #2E3E6C;
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset;
    backdrop-filter: blur(2.3109049797058105px);
}

    .slider_item img {
        max-width: 100% !important;
        width: initial !important;
    }

    .slider_item p {
        font-size: 1.6rem;
        font-weight: 600;
        color: #FFF;
        text-transform: uppercase;
        margin-top: 2rem;
        margin-bottom: 0;
    }

.slider-inner {
    min-height: 7.2rem;
}

/*=============== about-area start =================*/
.about_item {
    padding: 4rem 3rem;
    border-radius: 3.2rem;
    background: radial-gradient(129.38% 129.38% at 50.00% 0%, #243050 0%, #171E37 100%);
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset, 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
}


    .about_item h4 {
        font-size: 2.4rem;
        font-weight: 600;
        color: #FFF;
    }

    .about_item p {
        font-size: 1.4rem;
        font-weight: 500;
        color: #A1B2DD;
        margin-top: 2.4rem;
    }

.about_bottom {
    background: #212B49;
    padding: 3.2rem 3.2rem 4rem;
    border-radius: 3.2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: center;
    margin-top: 4rem;
}

.abtbottom_cnt h3 {
    font-size: 2.4rem;
    font-weight: 600;
    color: #FFF;
    margin-bottom: 0.8rem;
    text-align: center;
}

.abtbottom_cnt p {
    font-size: 1.4rem;
    font-weight: 500;
    color: #6576A0;
    margin: 0;
    text-align: center;
}

.contact_item {
    padding: 4rem 3.2rem 3.2rem;
    border-radius: 3.2rem;
    background: radial-gradient(129.38% 129.38% at 50.00% 0%, #243050 0%, #171E37 100%);
    box-shadow: 0.7703016400337219px 1.5406032800674438px 1.5406032800674438px 0px rgba(243, 243, 243, 0.11) inset, 0px 3.0812065601348877px 3.0812065601348877px 0px rgba(0, 0, 0, 0.11);
    backdrop-filter: blur(2.3109049797058105px);
}

    .contact_item h4 {
        font-size: 2.4rem;
        font-weight: 600;
        color: #FFF;
    }

    .contact_item p {
        width: 50.8rem;
        font-size: 1.4rem;
        font-weight: 500;
        color: #A1B2DD;
        margin-top: 2.4rem;
    }

.contact_cnt input,
.contact_cnt textarea {
    width: 100%;
    display: block;
    font-size: 1.4rem;
    font-weight: 600;
    color: #3C4867;
    background: #141B2F;
    padding: 1.8rem 2rem;
    border-radius: 1.6rem;
    border: none;
    outline: none;
}

    .contact_cnt input::placeholder,
    .contact_cnt textarea::placeholder {
        color: #3C4867;
        opacity: 1;
    }

.contact_cnt textarea {
    height: 13rem;
    resize: none;
}

.contact_cnt {
    margin-bottom: 1.2rem;
}

    .contact_cnt button {
        font-size: 1.4rem;
        font-weight: 600;
        color: #FFF;
        text-transform: uppercase;
        border-radius: 1.2rem;
        border: none;
        border-top: 0.2rem solid rgba(134, 189, 255, 0.44);
        background: radial-gradient(75.50% 150.00% at 47.14% -48.75%, #86C5FF 0%, #618DFF 47.12%, #1B57F1 100%);
        display: inline-block;
        padding: 1.2rem 3.2rem;
        outline: none;
        transition: 0.2s all ease;
    }

        .contact_cnt button:hover {
            opacity: 0.85;
        }

/*================= footer-area start ===============*/
.footer-area {
    padding: 8rem 0 4rem;
}

.footer_main {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .footer_main a {
        font-size: 1.6rem;
        font-weight: 600;
        color: #FFF;
    }

    .footer_main p {
        font-size: 1.2rem;
        font-weight: 600;
        color: #FFF;
        margin: 0;
    }

        .footer_main p a {
            font-size: 1.2rem;
            font-weight: 600;
            color: #FFF;
            margin: 0;
        }

.main_wrapper {
    overflow: hidden !important;
}

.right_box a {
    display: block;
    width: 100%;
}