// Counter Section
.counter-section {
    position: relative;
    padding: 40px 0 30px;
    margin-top: -105px;
    transform: translateZ(10px);
    &::before {
        position: absolute;
        content: "";
        width: 90%;
        background: #0d102f;
        border-radius: 20px;
        height: 100%;
        top: 0;
        left: 5%;
        z-index: -1;
    }
    .single-area {
        .text-area {
            margin-left: 30px;
            p {
                color: var(--head-color);
            }
        }
        h3 {
            span {
                font-size: inherit;
                font-weight: inherit;
            }
        }
    }
}

// About bitbetio
.about-bitbetio {
    .overlay {
        position: relative;
        .shape-area {
            img {
                position: absolute;
            }
            .obj-1 {
                right: 4%;
                top: calc(15%);
                animation: rippleAni 5s linear infinite;
            }
            .obj-2 {
                right: 8%;
                bottom: calc(30%);
                animation: ripple2Ani 5s linear infinite;
            }
        }
    }
    .cus-mar {
        margin-bottom: -20px;
    }
    .single-item {
        text-align: center;
        margin-bottom: 20px;
        padding: 40px 0 35px;
        border: 1px solid var(--border-color);
        border-radius: 20px;
        h5 {
            margin-top: 40px;
        }
    }
}

// How it Works
.how-it-works {
    position: relative;
    &::before {
        position: absolute;
        content: "";
        width: 100%;
        background-image: url(../images/how-works-bg.png);
        background-repeat: no-repeat;
        background-size: contain;
        height: 100%;
        top: 0;
        left: 0;
        z-index: -1;
    }
    .main-content {
        position: relative;
        padding: 66px 0 60px;
        &::before {
            position: absolute;
            content: "";
            width: 120%;
            background: var(--hover-alt-color);
            box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.15);
            border-radius: 30px;
            height: 100%;
            top: 0;
            left: -10%;
            z-index: -1;
        }
        ul {
            margin-bottom: -30px;
            li {
                width: 100%;
                cursor: pointer;
                margin-bottom: 30px;
                h5 {
                    display: inline-flex;
                    align-items: center;
                    background: #38268f;
                    border-radius: 5px;
                    width: 100%;
                    padding: 7px 30px;
                    color: var(--bs-white);
                    &.active {
                        background: #5025b4;
                        box-shadow: 0px 4px 25px #5025b4;
                        border-radius: 5px;
                    }
                    .image-area {
                        margin-right: 20px;
                    }
                }
            }
        }
        .tab-content {
            background: var(--body-color);
            border-radius: 20px;
            text-align: center;
            padding: 27px 30px 30px;
            h4 {
                margin: -4px 0 24px;
            }
        }
    }
    .counter-section {
        padding: 0;
        margin-top: 0;
        &::before {
            display: none;
        }
    }
    &.affiliates {
        &::before {
            position: absolute;
            content: "";
            width: 100%;
            background: #291b6b;
            height: 75%;
            top: 0;
            left: 0;
            z-index: -1;
        }
        .single-area {
            margin-bottom: 30px;
            h4 {
                margin-top: 25px;
            }
        }
        .magnific-area {
            border-radius: 30px;
            position: relative;
            z-index: 1;
            .bg-item {
                padding: 20px 0;
            }
            .mfp-iframe {
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center;
                background-color: #f55164;
                height: 77px;
                width: 77px;
                border-radius: 50%;
                z-index: 5;
                &::before {
                    position: absolute;
                    content: "";
                    border-radius: 50%;
                    z-index: -2;
                    animation: stretch 5s linear infinite;
                    width: 180px;
                    height: 180px;
                    background: #f55164;
                    opacity: 0.2;
                }
                &::after {
                    position: absolute;
                    content: "";
                    border-radius: 50%;
                    z-index: -1;
                    animation: stretch 7s linear infinite;
                    width: 130px;
                    height: 130px;
                    background: #f55164;
                    opacity: 0.2;
                }
            }
            .popupvideo {
                position: absolute;
            }
        }
    }
}

// Bet This Game
.bet-this-game {
    .overlay {
        background-image: url(../images/bet-this-game-bg.png);
        background-repeat: no-repeat;
        background-position: center;
    }
    .cus-mar {
        margin-bottom: -30px;
    }
    .single-area {
        background: var(--hover-alt-color);
        border-radius: 10px;
        margin-bottom: 30px;
        .head-area {
            background: #382591;
            padding: 13px 20px;
            border-top-right-radius: 10px;
            border-top-left-radius: 10px;
            .cmn-btn {
                &:hover {
                    background: var(--hover-color);
                }
            }
            p {
                margin-left: 20px;
            }
        }
        .main-content {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin: 50px 40px 40px;
            .team-single {
                text-align: center;
                .mdr {
                    color: var(--head-color);
                }
                .img-area {
                    margin-top: 25px;
                }
            }
            .mid-area {
                .countdown {
                    background: #1d613a;
                    border-radius: 10px;
                    padding: 13px 30px;
                    margin-bottom: 26px;
                    h4 {
                        margin: 0;
                        span {
                            font-size: inherit;
                            font-weight: inherit;
                        }
                    }
                }
            }
        }
        .bottom-item {
            border-top: 1px solid #8e78c0;
            padding: 30px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
    }
    &.all-soccer-bets {
        margin-top: -145px;
        transform: translateZ(10px);
        overflow-x: initial;
        .filter-section {
            padding: 60px 30px;
            border-radius: 30px;
            background-color: #382590;
            .nice-select {
                border-style: solid;
                border-width: 1px;
                border-color: rgb(183, 167, 255);
                border-radius: 10px;
                background-color: rgb(67, 47, 159);
                display: flex;
                align-items: center;
                width: 100%;
                height: 50px;
                &::after {
                    height: 10px;
                    margin-top: -5px;
                    pointer-events: none;
                    position: absolute;
                    right: 20px;
                    width: 10px;
                }
                .list {
                    width: 100%;
                    background: var(--body-color);
                    border: 1px solid #483f90;
                    .option {
                        background: transparent;
                        &:hover {
                            color: var(--head-color);
                        }
                    }
                    .focus {
                        background-color: transparent;
                        color: var(--head-color);
                    }
                }
            }
            .input-area {
                display: flex;
                align-items: center;
                border: 1px solid #b7a7ff;
                background-color: #432f9f;
                border-radius: 10px;
                padding-left: 15px;
                input {
                    border: none;
                    padding-left: 10px;
                }
            }
        }
    }
    &.bets-2 {
        margin-bottom: 30px;
    }
    .sidebar {
        .single-sidebar {
            border-radius: 10px;
            background-color: #291b6b;
            margin-bottom: 30px;
            .title-area {
                background: #382590;
                padding: 20px;
                border-top-left-radius: 10px;
                border-top-right-radius: 10px;
            }
            .single-item {
                padding: 20px;
                .checkbox-single {
                    position: relative;
                    padding-left: 40px;
                    margin-bottom: 20px;
                    padding-bottom: 20px;
                    cursor: pointer;
                    user-select: none;
                    border-bottom: 1px solid #462faf;
                    &:last-child {
                        border-bottom: none;
                        margin-bottom: 0;
                        padding-bottom: 0;
                    }
                    .left-area {
                        display: flex;
                        align-items: center;
                    }
                    .checkbox-area {
                        align-items: center;
                        input {
                            position: absolute;
                            opacity: 0;
                            cursor: pointer;
                            height: 0;
                            width: 0;
                        }
                        .checkmark {
                            position: absolute;
                            left: 0;
                            height: 24px;
                            width: 24px;
                            border-radius: 5px;
                            background: #3a2a86;
                            &::after {
                                content: "";
                                position: absolute;
                                display: none;
                            }
                        }
                    }
                    .checkmark {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        &::after {
                            width: 14px;
                            height: 12px;
                            background-image: url(../images/icon/check.png);
                            background-repeat: no-repeat;
                        }
                    }
                    input:checked ~ .checkmark {
                        background: #571ce0;
                    }
                    input:checked ~ .checkmark:after {
                        display: block;
                    }
                    .item-title {
                        img {
                            margin-right: 20px;
                        }
                        .vs {
                            color: var(--head-alt-color);
                            font-weight: bold;
                        }
                    }
                }
            }
        }
    }
}

// Amazing Features
.amazing-features {
    position: relative;
    &::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background-image: url(../images/amazing-features-bg.png);
        background-repeat: no-repeat;
        background-position: top;
        z-index: -2;
    }
    &::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background-image: url(../images/amazing-features-circle.png);
        background-repeat: no-repeat;
        background-position: top;
        top: 0;
        z-index: -1;
    }
    .single-slide {
        .slide-content {
            background: var(--bg-color);
            border: 1px solid var(--border-color);
            border-radius: 20px;
            margin: 0 10px;
            padding: 40px 0 34px;
            text-align: center;
            img {
                margin: auto;
            }
            h5 {
                margin-top: 34px;
            }
        }
    }
    .features-carousel {
        .slick-arrow {
            position: absolute;
            outline: none;
            bottom: calc(50% - 10px);
            width: 60px;
            height: 40px;
            background: var(--hover-alt-color);
            border-radius: 10px;
            z-index: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            &:hover {
                background: var(--hover-color);
                transition: all 0.5s;
            }
            &.slick-prev {
                left: calc(-20px);
                z-index: 2;
                &::before {
                    position: absolute;
                    content: "";
                    width: 29px;
                    height: 11px;
                    background-image: url(../images/icon/arrow-left.png);
                    background-repeat: no-repeat;
                    z-index: -1;
                }
            }
            &.slick-next {
                right: calc(-20px);
                &::before {
                    position: absolute;
                    content: "";
                    width: 29px;
                    height: 11px;
                    background-image: url(../images/icon/arrow-right.png);
                    background-repeat: no-repeat;
                    z-index: -1;
                }
            }
        }
    }
}

// More Features
.more-features {
    .content-area {
        margin-bottom: -40px;
        .single-item {
            display: flex;
            margin-bottom: 35px;
            .image-area {
                img {
                    max-width: initial;
                }
            }
            .text-area {
                margin-left: 20px;
                h5 {
                    margin-bottom: 16px;
                }
            }
        }
    }
}

// FAQs
.faqs-section {
    position: relative;
    &::before {
        position: absolute;
        content: "";
        width: 100%;
        background-image: url(../images/faqs-bg.png);
        background-repeat: no-repeat;
        background-position: top center;
        border-radius: 20px;
        height: 100%;
        top: 0;
        left: 0;
        z-index: -2;
    }
    .faq-bg {
        position: relative;
        &::before {
            position: absolute;
            content: "";
            width: 120%;
            background: #291b6b;
            border-radius: 20px;
            height: 100%;
            top: 0;
            left: -10%;
            z-index: -1;
        }
    }
    .accordion {
        .accordion-item {
            margin-bottom: 20px;
            background: #3a2fa4;
            box-shadow: 0px 12px 24px rgba(47, 65, 129, 0.1);
            border-radius: 10px;
            border: none;
            .accordion-header {
                position: relative;
                display: flex;
                align-items: center;
                margin-top: 0;
                &::after {
                    position: absolute;
                    left: 20px;
                    z-index: 3;
                    width: 30px;
                    height: 30px;
                    margin-left: auto;
                    content: "";
                    background-image: url(../images/icon/faq-icon.png);
                    background-repeat: no-repeat;
                }
            }
            .accordion-button {
                padding: 20px;
                padding-left: 70px;
                background: #3a2fa4;
                border-radius: 10px;
                font-size: inherit;
                font-weight: inherit;
                color: inherit;
                border: none;
                &::after {
                    flex-shrink: 0;
                    width: 20px;
                    height: 20px;
                    content: "";
                    background-image: url(../images/icon/minus.png);
                    background-repeat: no-repeat;
                    background-size: 20px;
                    position: absolute;
                    right: 30px;
                    transition: all ease 0.3s;
                }
                &::before {
                    content: "";
                    position: absolute;
                    right: 25px;
                    width: 30px;
                    height: 30px;
                    background: #261c7e;
                    border-radius: 5px;
                }
                &.collapsed {
                    &::after {
                        width: 20px;
                        height: 20px;
                        content: "";
                        background-image: url(../images/icon/plus.png);
                        background-repeat: no-repeat;
                        background-size: 20px;
                        transform: rotate(-90deg);
                        transition: all ease 0.3s;
                    }
                }
            }
            .accordion-collapse {
                border: none;
                .accordion-body {
                    padding: 0 20px;
                    p {
                        padding: 20px 0;
                        border-top: 1px solid #b0baf1;
                    }
                }
            }
        }
    }
    &.second {
        &::before {
            position: absolute;
            background-image: url(../images/faqs-2-bg.png);
            background-repeat: no-repeat;
        }
    }
    &.faqs-page {
        &::before {
            display: none;
        }
        ul {
            border: 1px solid var(--border-color);
            border-radius: 50px;
            padding: 10px 5px;
            margin-bottom: 40px;
            .cmn-btn {
                margin: 0 5px;
                text-transform: capitalize;
                &.active,
                &:hover {
                    background: #cab4ff;
                    color: #291b6b;
                    border-color: transparent;
                }
            }
        }
        .accordion {
            .accordion-item {
                &:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}

// UI Datepicker
.ui-datepicker {
    &.ui-widget-content {
        background-color: var(--body-color);
        border: 1px solid #483f90;
    }
    .ui-datepicker-header {
        background: var(--body-color);
        border: 1px solid #483f90;
    }
    .ui-state-default,
    .ui-state-default,
    .ui-widget-header .ui-state-default,
    .ui-button,
    .ui-button.ui-state-disabled:hover,
    .ui-button.ui-state-disabled:active {
        border: 1px solid var(--border-color);
        background: var(--body-color);
        text-align: center;
        color: var(--bs-white);
    }
    .ui-state-highlight,
    .ui-state-highlight,
    .ui-widget-header .ui-state-highlight {
        background: var(--head-color);
        border: 1px solid var(--hover-color);
    }
    .ui-datepicker-prev,
    .ui-datepicker-next {
        background: transparent !important;
        border: none;
    }
    .ui-state-active,
    .ui-state-active,
    .ui-widget-header .ui-state-active,
    a.ui-button:active,
    .ui-button:active,
    .ui-button.ui-state-active:hover {
        background: var(--head-alt-color);
        border-color: var(--hover-alt-color);
    }
}

// Pagination
.pagination {
    display: inline-flex;
    .page-item {
        .page-link {
            width: 40px;
            height: 40px;
            background: #291b6b;
            border-radius: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--bs-white);
            border: none;
            font-weight: bold;
            margin: 0 8px;
            &.active,
            &:hover {
                background: #571ce0;
                transition: all 0.3s;
            }
        }
        .page-btn {
            background: var(--hover-alt-color);
            border-radius: 10px;
            width: 60px;
            height: 40px;
            display: flex;
            justify-content: center;
            align-items: center;
            &:hover {
                background: #571ce0;
                transition: all 0.3s;
            }
            &.previous {
                margin-right: 20px;
            }
            &.next {
                margin-left: 20px;
            }
        }
    }
}

// Bet Modal
.betpopmodal {
    .modal {
        .modal-dialog {
            margin: auto;
            max-width: 100%;
            width: 100%;
            .modal-content {
                border-radius: 10px;
                background-color: #4832b1;
                .modal-header {
                    position: relative;
                    padding: 0;
                    border: none;
                    z-index: 1;
                    button {
                        position: absolute;
                        right: 10px;
                        top: 10px;
                        margin: 0;
                        padding: 3px;
                        margin: 0;
                        background-color: #ffb4bc;
                    }
                }
                .modal-body {
                    padding: 30px;
                    .top-item {
                        display: flex;
                        justify-content: space-between;
                        border-bottom: 1px solid #8e78c0;
                        margin-bottom: 30px;
                        padding-bottom: 30px;
                        .cmn-btn {
                            &:hover,
                            &.active {
                                background: #cab4ff;
                                color: #291b6b;
                            }
                        }
                    }
                    .select-odds {
                        border-radius: 10px;
                        background-color: #382590;
                        padding: 30px;
                        .in-dec-val {
                            width: 20%;
                            margin-left: 20px;
                            border-style: solid;
                            border-width: 1px;
                            border-color: #5b41d1;
                            border-radius: 10px;
                            background-color: #4630ae;
                        }
                    }
                    .in-dec-val {
                        border: 1px solid #5b41d1;
                        border-radius: 10px;
                        background-color: #382590;
                        width: 100%;
                        position: relative;
                        input {
                            display: inline;
                            border: none;
                            text-align: center;
                            background-color: #382590;
                            padding-left: 0;
                        }
                        .btn-area {
                            display: grid;
                            position: absolute;
                            right: 15px;
                            button {
                                background: transparent;
                                padding: 0;
                                width: 12px;
                                height: 15px;
                                img {
                                    max-width: unset;
                                }
                            }
                        }
                    }
                    .mid-area {
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        margin-top: 30px;
                        .single-area {
                            .item-title {
                                margin-bottom: 5px;
                            }
                            .nice-select {
                                background: transparent;
                                border: none;
                                padding: 0;
                                display: flex;
                                align-items: center;
                                width: 33%;
                                height: 0;
                                &::after {
                                    height: 10px;
                                    margin-top: -8px;
                                    pointer-events: none;
                                    position: absolute;
                                    right: 20px;
                                    width: 10px;
                                }
                                .list {
                                    width: 100%;
                                    background: var(--body-color);
                                    border: 1px solid #483f90;
                                    .option {
                                        background: transparent;
                                        &:hover {
                                            color: var(--head-color);
                                        }
                                    }
                                    .focus {
                                        background-color: transparent;
                                        color: var(--head-color);
                                    }
                                }
                            }
                            .input-item {
                                .quickIn {
                                    border-style: solid;
                                    border-width: 1px;
                                    border-color: #5b41d1;
                                    border-radius: 10px;
                                    background-color: #382590;
                                    color: var(--bs-white);
                                    padding: 10px;
                                    &:hover {
                                        border: 1px solid #25ad5f;
                                        transition: 0.3s;
                                    }
                                }
                            }
                            &.smart-value {
                                border-radius: 10px;
                                background-color: #382590;
                                padding: 12px 10px;
                                h5 {
                                    margin-left: 15px;
                                }
                            }
                        }
                    }
                    .bottom-area {
                        display: flex;
                        justify-content: space-between;
                        border-top: 1px solid #8e78c0;
                        margin-top: 30px;
                        padding-top: 30px;
                        p {
                            span {
                                color: #ffe1e5;
                            }
                        }
                        .fee-area {
                            p {
                                .amount {
                                    color: #8bffbd;
                                }
                            }
                        }
                        .btn-area {
                            button {
                                padding: 0 25px;
                                display: flex;
                                align-items: center;
                                height: 100%;
                                color: var(--bs-white);
                                border-radius: 10px;
                                background-color: #571ce0;
                                box-shadow: 4px 6.928px 24px 0px rgba(0, 0, 0, 0.18);
                            }
                        }
                    }
                }
            }
        }
    }
}

// Currency bet section
.currency-bet-section {
    margin-top: -120px;
    transform: translateZ(10px);
    .overlay {
        background-image: url(../images/currency-bet-bg.png);
        background-repeat: no-repeat;
        background-position: bottom;
    }
    .filter-section {
        padding: 60px 30px;
        border-radius: 30px;
        background-color: #382590;
        .input-area {
            display: flex;
            align-items: center;
            border: 1px solid #b7a7ff;
            background-color: #432f9f;
            border-radius: 10px;
            padding: 5px;
            padding-left: 15px;
            input {
                border: none;
                padding-left: 10px;
            }
            button {
                border-radius: 10px;
                color: var(--bs-white);
                align-self: stretch;
                padding-left: 20px;
                padding-right: 20px;
                background-color: #571ce0;
                img {
                    margin-right: 5px;
                }
            }
        }
    }
    .table-responsive {
        .table {
            margin-bottom: 0;
            tr {
                background-color: #291b6b;
                border-bottom: 1px solid #5946b5;
                th,
                td {
                    color: var(--bs-white);
                    text-align: center;
                    vertical-align: middle;
                    img {
                        margin-right: 5px;
                    }
                }
                .progress {
                    background-color: #25596f;
                    border-radius: 7px;
                    height: 14px;
                    .progress-bar {
                        background-color: #19652a;
                        font-size: 10px;
                    }
                }
            }
        }
    }
}

// Betting details
.betting-details {
    margin-top: -145px;
    transform: translateZ(10px);
    .main-content {
        border-radius: 30px;
        background-color: #382590;
        padding: 0 40px 40px;
        .countdown {
            span {
                font-size: inherit;
                font-weight: inherit;
            }
        }
        .table-responsive {
            border-radius: 20px;
            .table {
                margin-bottom: 0;
                border-top: 1px solid #5946b5;
                tr {
                    background-color: #291b6b;
                    border-bottom: 1px solid #5946b5;
                    vertical-align: middle;
                    th,
                    td {
                        padding: 30px 40px;
                    }
                }
            }
        }
        .escrow-bet-single {
            display: flex;
            justify-content: space-between;
            border-radius: 10px;
            border: 1px solid #a996fe;
            align-items: center;
            margin-top: 20px;
            padding: 30px;
            .left-area {
                p {
                    color: var(--head-color);
                    padding-top: 20px;
                }
            }
            .right-area {
                border-style: solid;
                border-width: 1px;
                border-color: #5f4bbd;
                border-radius: 10px;
                background-color: #332282;
                padding: 40px;
                text-align: center;
                .cmn-btn {
                    margin-top: 20px;
                }
            }
        }
    }
}

// Escrow Bets Fee
.escrow-bets-fee {
    .single-item {
        border-radius: 20px;
        background-color: #382590;
        padding: 40px;
        text-align: center;
        h4 {
            margin-top: 30px;
        }
        h3 {
            margin: 40px 0;
            padding: 30px 0 25px;
            border-top: 1px solid #5c47c0;
            border-bottom: 1px solid #5c47c0;
            span {
                font-size: inherit;
                font-weight: inherit;
                color: #ffbec6;
            }
        }
        p {
            margin-bottom: 30px;
        }
        .btn-border {
            margin-top: 10px;
        }
    }
}

// Testimonails
.testimonails-section {
    .slick-slide {
        opacity: 0.3;
        &.slick-center {
            opacity: 1;
            transition: 0.3s;
        }
        .single-content {
            border-radius: 10px;
            background-color: #291b6b;
            margin: 0 15px;
            padding: 40px;
            .profile-area {
                display: flex;
                align-items: center;
                margin-top: 30px;
                img {
                    border-radius: 50%;
                }
                .text-area {
                    margin-left: 20px;
                    h5 {
                        margin-bottom: 5px;
                    }
                }
            }
        }
    }
    .testimonails-carousel {
        padding-bottom: 100px;
        .slick-arrow {
            position: absolute;
            outline: none;
            bottom: 0;
            width: 40px;
            height: 40px;
            background: var(--hover-alt-color);
            border-radius: 10px;
            z-index: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            &:hover {
                background: var(--hover-color);
                transition: all 0.5s;
            }
            &.slick-prev {
                left: calc(50% - 55px);
                z-index: 2;
                &::before {
                    position: absolute;
                    content: "";
                    width: 12px;
                    height: 20px;
                    background-image: url(../images/icon/arrow-left-4.png);
                    background-repeat: no-repeat;
                    z-index: -1;
                }
            }
            &.slick-next {
                right: calc(50% - 55px);
                &::before {
                    position: absolute;
                    content: "";
                    width: 12px;
                    height: 20px;
                    background-image: url(../images/icon/arrow-right-4.png);
                    background-repeat: no-repeat;
                    z-index: -1;
                }
            }
        }
    }
}

// Create Future Currency
.create-future-currency {
    transform: translateZ(10px);
    margin-top: -150px;
    .main-content {
        background: #382590;
        border-radius: 30px;
        padding: 60px;
        .single-input {
            margin-bottom: 30px;
            margin-top: -7px;
            .input-items {
                border: 1px solid var(--border-color);
                border-radius: 10px;
                input {
                    border: none;
                    &:first-child {
                        width: 80%;
                    }
                    &:last-child {
                        width: 20%;
                        border-left: 1px solid var(--border-color);
                        border-top-left-radius: 0;
                        border-bottom-left-radius: 0;
                    }
                }
            }
            .input-select {
                border: 1px solid var(--border-color);
                border-radius: 10px;
                input {
                    border-top-left-radius: 0;
                    border-bottom-left-radius: 0;
                    border: none;
                    border-left: 1px solid var(--border-color);
                }
            }
            .nice-select {
                border: none;
                padding: 0 20px;
                display: flex;
                align-items: center;
                width: 30%;
                height: auto;
                background: #432f9f;
                border-radius: 10px;
                &::after {
                    height: 10px;
                    margin-top: -8px;
                    pointer-events: none;
                    position: absolute;
                    right: 20px;
                    width: 10px;
                }
                .list {
                    width: 100%;
                    background: var(--body-color);
                    border: 1px solid #483f90;
                    .option {
                        background: transparent;
                        &:hover {
                            color: var(--head-color);
                        }
                    }
                    .focus {
                        background-color: transparent;
                        color: var(--head-color);
                    }
                }
            }
            p.mdr {
                margin-top: 5px;
            }
        }
        .invite-friends {
            background: #33237c;
            border: 1px dashed #ffffff;
            box-sizing: border-box;
            border-radius: 20px;
            padding: 40px 30px;
            margin-bottom: 30px;
            .checkbox-single {
                position: relative;
                padding-left: 35px;
                padding-bottom: 30px;
                cursor: pointer;
                user-select: none;
                display: inline-flex !important;
                .left-area {
                    display: flex;
                    align-items: center;
                }
                .checkbox-area {
                    align-items: center;
                    input {
                        position: absolute;
                        opacity: 0;
                        cursor: pointer;
                        height: 0;
                        width: 0;
                    }
                    .checkmark {
                        position: absolute;
                        left: 0;
                        height: 24px;
                        width: 24px;
                        border-radius: 5px;
                        background: #3a2a86;
                        &::after {
                            content: "";
                            position: absolute;
                            display: none;
                        }
                    }
                }
                .checkmark {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    &::after {
                        width: 14px;
                        height: 12px;
                        background-image: url(../images/icon/check.png);
                        background-repeat: no-repeat;
                    }
                }
                input:checked ~ .checkmark {
                    background: #571ce0;
                }
                input:checked ~ .checkmark:after {
                    display: block;
                }
                .item-title {
                    img {
                        margin-right: 20px;
                    }
                    .vs {
                        color: var(--head-alt-color);
                        font-weight: bold;
                    }
                }
            }
            .single-btn {
                button {
                    margin-right: 10px;
                }
            }
        }
        .more-info {
            ul {
                margin-top: 30px;
                li {
                    position: relative;
                    display: flex;
                    align-items: center;
                    padding-left: 20px;
                    &::before {
                        position: absolute;
                        content: "";
                        border-radius: 50%;
                        width: 10px;
                        height: 10px;
                        background: var(--head-color);
                        left: 0;
                    }
                }
            }
        }
    }
}

// Bitbetio Affiliates
.bitbetio-affiliates {
    ul {
        margin: 25px 0 -6px;
        li {
            position: relative;
            display: flex;
            align-items: flex-start;
            padding-left: 20px;
            &::before {
                position: absolute;
                content: "";
                border-radius: 50%;
                width: 10px;
                height: 10px;
                background: var(--head-color);
                left: 0;
                top: 10px;
            }
        }
    }
}

// Features Section
.features-section {
    .cus-mar {
        margin-bottom: -30px;
    }
    .single-area {
        margin-bottom: 30px;
        h5 {
            margin-top: 25px;
        }
    }
}

// How it works Tournaments
.how-works-tournaments {
    transform: translateZ(10px);
    margin-top: -78px;
    .single-area {
        border-radius: 10px;
        background-color: #291b6b;
        padding: 60px 0 55px;
        h4 {
            margin: 30px 0 20px;
        }
    }
}

// Tournaments section
.tournaments-section {
    ul.nav {
        border: 1px solid var(--border-color);
        border-radius: 50px;
        padding: 10px 5px;
        margin-bottom: 40px;
        .cmn-btn {
            margin: 0 5px;
            text-transform: capitalize;
            &.active,
            &:hover {
                background: #cab4ff;
                color: #291b6b;
                border-color: transparent;
            }
        }
    }
    .single-item {
        display: flex;
        justify-content: space-between;
        border-style: solid;
        border-width: 1px;
        border-color: #7f8fc9;
        border-radius: 10px;
        background-color: #291b6b;
        padding: 20px;
        margin-bottom: 30px;
        &:last-child {
            margin-bottom: 0;
        }
        .left-item {
            display: flex;
        }
        .mid-area {
            margin-top: 5px;
            margin-left: 20px;
            padding-right: 15px;
            ul {
                display: flex;
                align-items: center;
                margin: 15px 0 20px;
                li {
                    display: flex;
                    align-items: center;
                    margin-right: 40px;
                    span {
                        margin-right: 10px;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        border-radius: 50%;
                        background-color: #4129b0;
                        width: 30px;
                        height: 30px;
                    }
                }
            }
        }
        .last-item {
            border-radius: 10px;
            background-color: #382590;
            padding: 40px 20px;
            text-align: center;
            h4 {
                margin: 20px 0 30px;
                border-radius: 10px;
                padding: 5px 67px;
                background-color: #1d613a;
            }
            .cmn-btn,
            .btn-border {
                width: 100%;
            }
        }
    }
    .table-responsive {
        .table {
            margin-bottom: 0;
            tbody {
                tr {
                    &:hover {
                        background-color: #382590;
                    }
                }
            }
            tr {
                background-color: #291b6b;
                border-bottom: 1px solid #5946b5;
                th,
                td {
                    color: var(--bs-white);
                    text-align: center;
                    vertical-align: middle;
                    &.prize {
                        color: #ffc107;
                        font-weight: 600;
                    }
                }
            }
        }
    }
}

// Blog
.blog-section {
    .single-blog {
        margin-bottom: 30px;
        &:last-child {
            margin-bottom: 0;
        }
        .blog-img {
            img {
                border-top-left-radius: 10px;
                border-top-right-radius: 10px;
            }
        }
        .blog-content {
            padding: 30px;
            background: #322a71;
            border-bottom-left-radius: 10px;
            border-bottom-right-radius: 10px;
            .mid-content {
                p {
                    margin: 20px 0 15px;
                }
            }
            .bottom-item {
                border-top: 1px solid #617097;
                margin-top: 25px;
                padding-top: 25px;

                a {
                    color: var(--bs-white);
                    img {
                        margin-left: 10px;
                    }
                }
            }
        }
    }
    .sidebar-blog {
        .sidebar-single {
            padding: 30px;
            background: #322a71;
            border-radius: 10px;
            margin-bottom: 30px;
            &:last-child {
                margin-bottom: 0;
            }
            .title {
                margin-bottom: 25px;
            }
            form {
                input {
                    margin-bottom: 30px;
                }
                .cmn-btn {
                    width: 100%;
                }
            }
            .sidebar-carousel {
                .single-slide {
                    img {
                        border-radius: 10px;
                    }
                    .title {
                        margin-top: 30px;
                    }
                    .slide-bottom {
                        .icon-area {
                            display: flex;
                            align-items: center;
                            margin-right: 30px;
                            i {
                                width: 35px;
                                height: 35px;
                                background: #5b2ed9;
                                border-radius: 20px;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                color: var(--bs-white);
                                margin-right: 5px;
                            }
                        }
                    }
                }
                .slick-arrow {
                    position: absolute;
                    outline: none;
                    top: -55px;
                    width: 40px;
                    height: 40px;
                    background: var(--hover-alt-color);
                    border-radius: 10px;
                    z-index: 1;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    &:hover {
                        background: var(--hover-color);
                        transition: all 0.5s;
                    }
                    &.slick-prev {
                        right: calc(15%);
                        z-index: 2;
                        &::before {
                            position: absolute;
                            content: "";
                            width: 12px;
                            height: 20px;
                            background-image: url(../images/icon/arrow-left-4.png);
                            background-repeat: no-repeat;
                            z-index: -1;
                        }
                    }
                    &.slick-next {
                        right: 0;
                        &::before {
                            position: absolute;
                            content: "";
                            width: 12px;
                            height: 20px;
                            background-image: url(../images/icon/arrow-right-4.png);
                            background-repeat: no-repeat;
                            z-index: -1;
                        }
                    }
                }
            }
            .social-link {
                a {
                    width: 35px;
                    height: 35px;
                    border: 1px solid #5653a8;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-right: 20px;
                    transition: 0.3s;
                    i {
                        color: #5ac4ff;
                        transition: 0.3s;
                    }
                    &:hover {
                        background: #ff96a5;
                        border-color: #ff96a5;
                        i {
                            color: var(--bs-white);
                        }
                    }
                }
            }
        }
    }
    .blog-post {
        background: #322a71;
        border-radius: 20px;
        padding: 40px;
        .head-area {
            span {
                margin-right: 20px;
            }
        }
        .title {
            margin: 30px 0 35px;
        }
        .author {
            margin-right: 30px;
            .author-img {
                border: 3px solid #0dd8b3;
                border-radius: 50%;
                max-width: initial;
            }
            .author-bottom {
                display: grid;
                justify-content: center;
                text-align: center;
                margin-top: 20px;
                .icon-area {
                    margin-bottom: 15px;
                    i {
                        color: var(--bs-white);
                        background: #5b2ed9;
                        border-radius: 20px;
                        width: 40px;
                        height: 40px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        margin-bottom: 10px;
                    }
                }
            }
        }
        .author-content {
            p {
                margin-bottom: 25px;
            }
            img {
                margin: 15px 0 35px;
            }
        }
        .bottom-item {
            border-top: 1px solid #584dad;
            padding-top: 30px;
            margin-top: 7px;
            .social-link {
                a {
                    width: 35px;
                    height: 35px;
                    border: 1px solid #5653a8;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-left: 20px;
                    transition: 0.3s;
                    i {
                        color: #5ac4ff;
                        transition: 0.3s;
                    }
                    &:hover {
                        background: #ff96a5;
                        border-color: #ff96a5;
                        i {
                            color: var(--bs-white);
                        }
                    }
                }
            }
        }
    }
    .comments-area {
        .title {
            border-bottom: 1px solid #4641ba;
            padding-bottom: 20px;
            margin-bottom: 30px;
        }
        .single-comments {
            display: flex;
            border-bottom: 1px solid #38357a;
            padding: 15px 0 30px;
            margin-bottom: 30px;
            &:last-child {
                margin-bottom: 0;
            }
            .left-area {
                margin-right: 20px;
                img {
                    max-width: initial;
                    border: 1px solid #6c82ba;
                    border-radius: 50%;
                    padding: 5px;
                    background: rgba(255, 255, 255, 0.2);
                }
            }
            .right-area {
                p.mdr {
                    margin: 10px 0 20px;
                }
                .reply-btn {
                    margin-bottom: 10px;
                    color: #ffc107;
                    background: transparent;
                    padding: 0;
                    margin-top: 15px;
                }
                form{
                    background: #382590;
                    border-radius: 10px;
                    padding: 20px;
                    display: none;
                }
            }
            &.mid {
                margin-left: 11%;
            }
        }
    }
    .leave-comments {
        border-radius: 20px;
        background-color: #322a71;
        padding: 40px 20px 35px;
        .single-input {
            margin-bottom: 30px;
            .input-area {
                display: flex;
                align-items: center;
                border: 1px solid #b7a7ff;
                background-color: #2d2565;
                border-radius: 10px;
                padding-left: 15px;
                padding-right: 20px;
                input {
                    background: #2d2565;
                    border: none;
                    padding-left: 10px;
                }
            }
            textarea {
                background: #2d2565;
            }
        }
    }
}

// Privacy Content
.privacy-content{
    overflow-x: initial;
    .top-wrapper{
        margin-top: -7px;
        margin-bottom: -7px;
        h4{
            text-transform: uppercase;
            margin-bottom: 25px;
        }
        p{
            margin-bottom: 30px;
        }
        ul{
            margin-bottom: 20px;
            li{
                margin-bottom: 10px;
            }
        }
    }
    .safe-data{
        margin: 55px 0;
        ul{
            list-style-type: decimal;
            margin-left: 18px;
            li{
                padding-left: 15px;
                &::marker{
                    font-weight: bold;
                }
            }
        }
    }
    .cookies{
        margin-bottom: -36px;
    }
    &.terms{
        .safe-data{
            margin-bottom: -23px;
        }
    }
}

// Dashboard Content
.dashboard-content {
    margin-top: -8px;
    .dashboard-heading {
        background-color: #322a71;
        margin-bottom: 30px;
        ul {
            justify-content: space-between;
            li {
                .nav-link {
                    background-color: transparent;
                    color: var(--bs-white);
                    text-transform: capitalize;
                    padding: 30px 12px;
                    font-weight: 700;
                    &.active,
                    &:hover {
                        background: #463b9f;
                        transition: 0.3s;
                    }
                }
            }
        }
    }
    .dashboard-sidebar {
        .single-item {
            text-align: center;
            background: #322a71;
            border-radius: 10px;
            padding: 30px 20px;
            margin-bottom: 30px;
            &:last-child {
                margin-bottom: 0;
            }
            img {
                border-radius: 50%;
            }
            h5 {
                margin: 30px 0 15px;
            }
            .btn-border {
                margin-top: 30px;
            }
        }
        .balance {
            margin-bottom: 30px;
            .single-item {
                margin-bottom: 0;
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
            }
            .bottom-area {
                background: #571ce0;
                padding: 8px 20px;
                border-bottom-left-radius: 10px;
                border-bottom-right-radius: 10px;
                a {
                    color: var(--bs-white);
                }
            }
        }
    }
    .tab-content {
        .single-info {
            background: #322a71;
            border-radius: 10px;
            display: flex;
            align-items: center;
            padding: 30px;
            .text-area {
                margin-left: 25px;
                p {
                    color: #00ff6d;
                }
            }
        }
        h5.title {
            padding: 15px 10px 15px 30px;
            background: #322a71;
            margin-bottom: 0;
            margin-top: 40px;
        }
        .table-responsive {
            .table {
                margin-bottom: 0;
                tr {
                    background-color: #291b6b;
                    border-bottom: 1px solid var(--body-color);
                    th,
                    td {
                        color: var(--bs-white);
                        text-align: center;
                        vertical-align: middle;
                        padding: 15px 10px;
                        img {
                            margin-right: 5px;
                        }
                    }
                }
            }
        }
        .file-upload {
            display: flex;
            align-items: center;
            .img-area {
                margin-right: 30px;
                img {
                    display: inline;
                    border: 1px solid #5c61c8;
                    padding: 10px;
                    border-radius: 50%;
                }
            }
            input {
                margin: 0;
                opacity: 0;
                visibility: hidden;
            }
            .file {
                cursor: pointer;
                position: relative;
                margin-bottom: 15px;
                .file-custom {
                    position: absolute;
                    top: 0;
                    width: 60%;
                    z-index: 5;
                    height: 55px;
                    border-radius: 20px;
                    border: 1px solid #5b70ba;
                    display: flex;
                    align-items: center;
                    &::before {
                        position: absolute;
                        left: 0;
                        background-image: url(../images/icon/upload-icons.png);
                        background-repeat: no-repeat;
                        content: "";
                        width: 24px;
                        height: 24px;
                        left: 20px;
                    }
                    &::after {
                        content: "Upload Profile Photo";
                        position: absolute;
                        right: 20px;
                    }
                }
            }
        }
    }
    .bets-tab {
        ul {
            border: 1px solid var(--border-color);
            border-radius: 50px;
            padding: 10px 5px;
            margin-bottom: 40px;
            .cmn-btn {
                margin: 0 5px;
                text-transform: capitalize;
                &.active,
                &:hover {
                    background: #cab4ff;
                    color: #291b6b;
                    border-color: transparent;
                }
            }
        }
    }
    .deposit-with-tab {
        .balance-area {
            background: #15115f;
            border: 1px solid #3f4291;
            padding: 30px 20px;
            border-radius: 10px;
            text-align: center;
            .nice-select {
                border: 1px solid #2b2791;
                border-radius: 5px;
                background: transparent;
                display: flex;
                align-items: center;
                width: 35%;
                height: 35px;
                &::after {
                    height: 10px;
                    margin-top: -7px;
                    pointer-events: none;
                    position: absolute;
                    right: 20px;
                    width: 10px;
                }
                span {
                    font-size: 16px;
                }
                .list {
                    width: 100%;
                    background: var(--body-color);
                    border: 1px solid #483f90;
                    .option {
                        background: transparent;
                        font-size: 16px;
                        &:hover {
                            color: var(--head-color);
                        }
                    }
                    .focus {
                        background-color: transparent;
                        color: var(--head-color);
                    }
                }
            }
            h6 {
                background: #463b9f;
                border-radius: 5px;
                display: inline-block;
                padding: 10px 25px;
                margin: 20px 0 25px;
                color: #ffe599;
                span {
                    font-size: inherit;
                    font-weight: inherit;
                }
            }
        }
        .right-area {
            background: #15115f;
            border: 1px solid #3f4290;
            padding: 30px;
            border-radius: 20px;
            .para-area {
                margin: 10px 0 25px;
            }
            .address-bar {
                border-style: solid;
                border-width: 1px;
                border-color: #474a9e;
                border-radius: 10px;
                background-color: #322a71;
                padding: 30px;
                .input-area {
                    display: flex;
                    align-items: center;
                    border: 1px solid #b7a7ff;
                    background-color: #282470;
                    border-radius: 10px;
                    padding: 5px;
                    padding-left: 15px;
                    padding-right: 20px;
                    img {
                        cursor: pointer;
                    }
                    input {
                        padding-left: 0;
                        background-color: #282470;
                        border: none;
                    }
                }
                form {
                    .input-single {
                        margin-bottom: 25px;
                    }
                    .btn-border {
                        margin-top: 10px;
                    }
                }
                .qr-copy {
                    margin-top: 15px;
                    p {
                        margin-left: 20px;
                        cursor: pointer;
                    }
                }
            }
            .bottom-area {
                .single-item {
                    margin-top: 35px;
                    h6 {
                        color: #ffe599;
                        margin-bottom: 5px;
                    }
                }
            }
        }
    }
    .buy-crypto {
        border-style: solid;
        border-width: 1px;
        border-color: rgb(63, 66, 144);
        border-radius: 20px;
        background-color: #15115f;
        padding: 30px;
        h5 {
            margin-bottom: 15px;
        }
        .form-box {
            border-style: solid;
            border-width: 1px;
            border-color: #474a9e;
            border-radius: 10px;
            background-color: #322a71;
            padding: 30px;
            margin-top: 15px;
        }
        .nice-select {
            display: flex;
            align-items: center;
            width: 100%;
            height: 50px;
            border-style: solid;
            border-width: 1px;
            border-color: #b7a7ff;
            border-radius: 10px;
            background-color: #282470;
            &::after {
                height: 10px;
                margin-top: -7px;
                pointer-events: none;
                position: absolute;
                right: 20px;
                width: 10px;
            }
            span {
                font-size: 16px;
            }
            .list {
                width: 100%;
                background: var(--body-color);
                border: 1px solid #483f90;
                .option {
                    background: transparent;
                    font-size: 16px;
                    &:hover {
                        color: var(--head-color);
                    }
                }
                .focus {
                    background-color: transparent;
                    color: var(--head-color);
                }
            }
        }
        .input-single {
            margin-top: 20px;
        }
        .input-select {
            border: 1px solid var(--border-color);
            border-radius: 10px;
            input {
                border-top-right-radius: 0;
                border-bottom-right-radius: 0;
                border: none;
                border-left: 1px solid var(--border-color);
                background-color: #282470;
            }
            .nice-select {
                width: 35%;
                border: none;
                border-top-left-radius: 0;
                border-bottom-left-radius: 0;
                border-left: 1px solid #474a9e;
                background-color: #282470;
            }
        }
        .table-area {
            margin-top: 30px;
            p {
                margin-bottom: 20px;
            }
        }
    }
    .affiliate-tab {
        background: #15115f;
        border: 1px solid #3f4290;
        border-radius: 20px;
        padding: 30px;
        h5 {
            margin-bottom: 10px;
        }
        .referral-bar {
            border-style: solid;
            border-width: 1px;
            border-color: #474a9e;
            border-radius: 10px;
            background-color: #322a71;
            padding: 30px;
            margin: 25px 0 30px;
            .input-area {
                display: flex;
                align-items: center;
                border: 1px solid #b7a7ff;
                background-color: #282470;
                border-radius: 10px;
                padding: 5px;
                padding-left: 15px;
                padding-right: 20px;
                img {
                    cursor: pointer;
                }
                input {
                    padding-left: 0;
                    background-color: #282470;
                    border: none;
                }
            }
        }
        .table-area {
            border-radius: 10px;
            background-color: #322a71;
            padding: 30px;
            margin-top: 30px;
            .head-area {
                margin-bottom: 30px;
            }
            .input-area {
                border-style: solid;
                border-width: 1px;
                border-color: #3d2a98;
                background-color: #291b6b;
                padding-right: 15px;
                border-radius: 25px;
                input {
                    border: none;
                    background: transparent;
                }
            }
        }
    }
    .transactions-tab {
        form {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 10px;
            .single-input {
                width: 100%;
                margin-right: 20px;
            }
            button {
                padding: 10px 20px;
                color: var(--bs-white);
                background: #571ce0;
                border-radius: 5px;
            }
        }
        .nice-select {
            display: flex;
            align-items: center;
            width: 100%;
            height: 50px;
            border-style: solid;
            border-width: 1px;
            border-color: #b7a7ff;
            border-radius: 10px;
            background-color: #282470;
            &::after {
                height: 10px;
                margin-top: -7px;
                pointer-events: none;
                position: absolute;
                right: 20px;
                width: 10px;
            }
            span {
                font-size: 16px;
            }
            .list {
                width: 100%;
                background: var(--body-color);
                border: 1px solid #483f90;
                .option {
                    background: transparent;
                    font-size: 16px;
                    &:hover {
                        color: var(--head-color);
                    }
                }
                .focus {
                    background-color: transparent;
                    color: var(--head-color);
                }
            }
        }
    }
    .setting-tab {
        .single-area {
            padding: 30px;
            background: #291b6b;
            border-radius: 5px;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            &:last-child {
                margin-bottom: 0;
            }
            .icon-area {
                border-radius: 50%;
                background-color: #571ce0;
                width: 40px;
                height: 40px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-right: 20px;
            }
            a.mdr {
                color: #fe8f9c;
                margin-left: 20px;
            }
            .cmn-btn {
                border-radius: 10px;
            }
            .switch {
                position: relative;
                display: inline-block;
                width: 53px;
                height: 25px;
                margin-left: 15px;
                input {
                    opacity: 0;
                    width: 0;
                    height: 0;
                    &:checked + .slider {
                        background-color: #571ce0;
                    }
                    &:focus + .slider {
                        box-shadow: 0 0 1px #571ce0;
                    }
                }
                .slider {
                    position: absolute;
                    cursor: pointer;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    background-color: var(--border-color);
                    transition: 0.4s;
                    &::before {
                        position: absolute;
                        content: "";
                        height: 18px;
                        width: 18px;
                        left: 4px;
                        bottom: 4px;
                        background-color: white;
                        transition: 0.4s;
                    }
                    &.round {
                        border-radius: 24px;
                        &::before {
                            border-radius: 50%;
                        }
                    }
                }
                input:checked + .slider:before {
                    transform: translateX(26px);
                }
            }
        }
    }
    .setting-personal-details {
        border-style: solid;
        border-width: 1px;
        border-color: #3f4290;
        border-radius: 20px;
        background-color: #15115f;
        padding: 30px;
        border-radius: 20px;
        .nice-select {
            display: flex;
            align-items: center;
            width: 100%;
            height: 50px;
            border-style: solid;
            border-width: 1px;
            border-color: #b7a7ff;
            border-radius: 10px;
            background-color: #432f9f;
            &::after {
                height: 10px;
                margin-top: -7px;
                pointer-events: none;
                position: absolute;
                right: 20px;
                width: 10px;
            }
            span {
                font-size: 16px;
            }
            .list {
                width: 100%;
                background: var(--body-color);
                border: 1px solid #483f90;
                .option {
                    background: transparent;
                    font-size: 16px;
                    &:hover {
                        color: var(--head-color);
                    }
                }
                .focus {
                    background-color: transparent;
                    color: var(--head-color);
                }
            }
        }
        .single-input{
            margin-top: 25px;
            input{
                border-style: solid;
                border-width: 1px;
                border-color: #b7a7ff;
                border-radius: 10px;
                background-color: #432f9f;
            }
        }
        .btn-border{
            margin-top: 35px;
        }
        .file-upload .file {
            cursor: pointer;
            position: relative;
            margin-bottom: 5px;
        }
    }
    .google-authentication{
        border-style: solid;
        border-width: 1px;
        border-color: #3f4290;
        border-radius: 20px;
        background-color: #15115f;
        padding: 30px;
        h4{
            margin-bottom: 25px;
        }
        ul {
            border: 1px solid var(--border-color);
            border-radius: 50px;
            padding: 10px 5px;
            margin-bottom: 30px;
            .cmn-btn {
                margin: 0 5px;
                text-transform: capitalize;
                &.active,
                &:hover {
                    background: #cab4ff;
                    color: #291b6b;
                    border-color: transparent;
                }
            }
        }
        .brand{
            margin-top: 20px;
            img{
                margin-right: 30px;
            }
        }
        .number-area{
            margin-top: 20px;
            .number{
                background: #cab4ff;
                color: #291b6b;
                border-color: transparent;
                padding: 15px 20px;
                border-radius: 10px;
                font-weight: 800;
                display: inline-block;
                margin-top: 15px;
            }
        }
        form{
            margin-top: 20px;
            .single-input{
                margin-bottom: 25px;
            }
        }
        .footer-area{
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-top: 1px solid #594998;
            padding-top: 30px;
            margin-top: 30px;
        }
    }
}

// Contact Section
.contact-section {
    margin-top: -140px;
    transform: translateZ(10px);
    .bg-area {
        background: #382590;
        border-radius: 30px;
        padding: 80px 60px;
    }
    .form-content {
        margin-top: -38px;
        .single-input {
            margin-top: 30px;
            input,
            textarea {
                border-style: solid;
                border-width: 1px;
                border-color: #b7a7ff;
                border-radius: 10px;
                background-color: #432f9f;
            }
        }
    }
}

// Error
.error-section{
    .btn-border{
        display: inline-flex;
    }
}