#main_p1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}



.big_text_p3 {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(../img/big_text_p3.png);
    background-position: top;
    background-repeat: repeat-y;
    background-size: 99.1vw 57vw;
    user-select: none;
    z-index: -1;
}


#rules {
position: absolute;
right: 19.7vw;
    top: 13.75vw;
    color: #000;
    width: 1.9vw;
    height: fit-content;
    padding: .4vw;
    background-color: #f53a71;
    font-size: 1.1vw;
    line-height: 1.1;
    font-weight: 600;
    cursor: pointer;
    border: none;
}


        #rules:hover {
            filter: brightness(120%);
        }

.rules_icon {
    width: 1.5vw;
    height: 1.5vw;
    margin-left: -.2vw;
        }



#box_p3 {
    position: relative;
    border: 0.1vw solid;
    border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    background-color: #000;
    font-size: .8vw;
        text-align: center;
    font-weight: 400;
    letter-spacing: 0.1vw;
    line-height: 1.75;
    color: #fff;
    width: 56vw;
    height: auto;
    padding: 2.5vw;
    box-sizing: border-box;
        display: flex;
    flex-direction: column;
    align-items: center;
}


#box_p1b {
    position: relative;
    border: 0.1vw solid;
    border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    background-color: #000;
    font-size: .8vw;
    font-weight: 400;
    letter-spacing: 0.1vw;
    line-height: 1.75;
    color: #fff;
    width: 59vw;
    height: auto;
    padding: 2.5vw;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}



       #bet_btn19_box {
            width: 56vw;
            display: flex;
            overflow-x: auto;
            overflow-y: hidden;
            white-space: nowrap;
                margin-bottom: 1vw;
                flex-direction: row;
    justify-content: center;
        }

        .bet_button {
font-size: 0.77vw;
    width: 5.75vw;
    height: 1.5vw;
    color: #000;
    text-align: center;
    line-height: 2vw;
    margin-right: .5vw;
    flex-shrink: 0;
    text-align: center;
    line-height: 1.5vw;
         user-select: none;
         font-weight: 500;
        }

        .bet_button:hover {
filter: brightness(120%);
}

        .bet_button.active {
            background-color: #e84e84;
                cursor: pointer;
        }

        .bet_button.off {
            background-color: #3e3e3e;
                            cursor: pointer;
        }

        .bet_button.soon {
            background-color: #973456;

        }

        #bet_btn9 {
            margin-right: 0;
        }

        .bet_box {
    display: none;
    padding: 10px;
    height: fit-content;
        }

        .active {
            display: block;
        }


 #currency {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0.1vw solid;
    border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    width: 18vw;
    background-color: #161616;
    height: auto;
    padding: 0.3vw 0;
    font-size: .9vw;
    margin: 0 auto 2.5vw auto;
    text-align: center;
 }



        #bet_btn19_box::-webkit-scrollbar {
            width: .85vw;
        }
        #bet_btn19_box::-webkit-scrollbar-thumb:hover {
            background-color: #ffbde8;
        }
        #bet_btn19_box::-webkit-scrollbar-thumb {
background-color: #ff9adc;
    border: 0.4vw solid #000000;
        }
        #bet_btn19_box::-webkit-scrollbar-track {

        }




.title_bet {
font-size: 1.5vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.title_bettxt {
font-size: 1.1vw;
    font-weight: 600;
    letter-spacing: 0.1vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
}



#vs_box {
    width: 50vw;
    height: fit-content;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
        margin-top: 2vw;
}

.vs1 {
    width: 37%;
    height: fit-content;
    background-color: #1d1d1d;
padding: .5vw 1vw 1vw 1vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
        border-bottom: .2vw solid;
    border-color: #79e1fa;
}

.vs1.win {
background-image: url(../img/win-blue.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: contain;
}



#vs2 {
width: 7vw;
    height: 7vw;
background-image: url(../img/vs.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.vs3 {
width: 37%;
    height: fit-content;
    background-color: #1d1d1d;
padding: .5vw 1vw 1vw 1vw;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    border-bottom: .2vw solid;
    border-color: #e84e84;
}

.vs3.win {
background-image: url(../img/win-red.png);
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: contain;
}



#sub_L {
    display: flex;
    width: 6.5vw;
    height: 1.3vw;
    font-size: .8vw;
    color: #000000;
    background-color: #4ec0e8;
    font-weight: 500;
    clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
    border: none;
    transition: all .3s ease;
    justify-content: center;
    align-items: center;
    margin-top: 1vw;
    user-select: none;
    transition: background-color 0.3s ease;

}

#sub_R {
    display: flex;
    width: 6.5vw;
    height: 1.3vw;
    font-size: .8vw;
    color: #000000;
    background-color: #e84e84;
    font-weight: 500;
    clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
    border: none;
    transition: all .3s ease;
    justify-content: center;
    align-items: center;
    margin-top: 1vw;
    user-select: none;
    transition: background-color 0.3s ease;

}


.vs_btn {
    display: flex;
    position: relative;
    z-index: 3;
    width: 12vw;
    height: 1.8vw;
    font-size: 1vw;
    color: #000000;
    background-color: #4ec0e8;
    font-weight: 500;
    cursor: pointer;
    clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
    border: none;
    transition: all .3s ease;
    justify-content: center;
    align-items: center;
    margin: 2vw 0vw 3vw 19vw;
    user-select: none;
    transition: background-color 0.3s ease;
}

.vs_btn:hover {
filter: brightness(120%);
}



.vs_btn.off {
background-color: #5b5b5b;
    position: absolute;
}

.vs_btn.on {
background-color: #4ec0e8;
}

.vs_btn.pp {
background-color: #e84e84;
}

.vs_btn.cs {
background-color: #5b5b5b;
}



.gradient-line {
            width: 100%;
            height: .05vw;
            background: linear-gradient(to right, #2edcff, #ff639a);
            border: none;
    margin: 1vw 0 3vw 0;
        }


#over_box {
width: 50vw;
    height: fit-content;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
margin-top: 2.75vw;
    margin-bottom: 4vw;
    border: .1vw solid;
    border-color: #5b5b5b;
    padding: 1.5vw 0 .8vw 0;
    flex-wrap: wrap;
}

.over1 {
    animation-fill-mode: both;
    width: 22%;
    height: fit-content;
    padding: 1vw 1vw .3vw 1vw;
    display: flex;
    flex-direction: column;
    margin: 0 1vw;
font-size: .8vw;
    font-weight: 600;
}

.over2 {
    animation-fill-mode: both;
    width: 22%;
    height: fit-content;
    padding: .3vw 1vw 1vw 1vw;
    display: flex;
    flex-direction: column;
    margin: 0 1vw;
    border-top: .1vw solid;
    border-color: #5c5c5c;
font-size: .8vw;
    font-weight: 600;
}

.over2.bule {
color: #79e1fa;
}

.over2.red {
color: #e84e84;
}


.stats_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: .5vw;
        }

        .stats_text-with-icon {
            display: flex;
            align-items: center;
            gap: 0.2vw;
        }

        .stats_icon {
    width: 1.15vw;
    height: 1.15vw;
        }

        .stats_text {
            font-size: .8vw;
        }





.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 1000;
}


#closepop_box_rules {
    position: fixed;
    top: 1vw;
    right: 1vw;
    cursor: pointer;
    width: 2vw;
    height: 2vw;
        }


#closepop_box_rules:hover {
filter: brightness(150%);
        }


#closepop_box_vs {
    position: fixed;
    top: 1vw;
    right: 1vw;
    cursor: pointer;
    width: 2vw;
    height: 2vw;
        }

#closepop_box_vs:hover {
filter: brightness(150%);
        }




#pop_box_rules {
display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
       width: 45vw;
        height: auto;
        max-height: 60vh;
        background-color: #000;
    padding: 2.5vw 3.5vw;
        z-index: 9999;
        overflow: auto;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    font-size: .8vw;
    font-weight: 400;
    letter-spacing: 0.1vw;
    line-height: 1.75;
    color: #fff;
        }


#pop_box_rules::-webkit-scrollbar {
    width: .8vw;
    padding: 1vw;
    height: 1vw;
}
#pop_box_rules::-webkit-scrollbar-thumb:hover {
    background-color: #F9669A;
}
#pop_box_rules::-webkit-scrollbar-thumb {
    background-color: #e84e84;
    border: 0.3vw solid #000000;
}
#pop_box_rules::-webkit-scrollbar-track {
    margin-right: 1vw;
}


.title_info {
    font-size: 1.3vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 8%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.title_info_spacing {
    margin-top: 3vw;
}


/*POP 2*/


#pop_box_vs {
display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
       width: 39vw;
        height: auto;
        max-height: 60vh;
        background-color: #000;
    padding: 2.5vw 3.5vw;
        z-index: 9999;
        overflow: auto;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    font-size: .8vw;
    font-weight: 400;
    letter-spacing: 0.1vw;
    line-height: 1.75;
    color: #fff;
}


#pop_box_vs::-webkit-scrollbar {
    width: .8vw;
    padding: 1vw;
    height: 1vw;
}
#pop_box_vs::-webkit-scrollbar-thumb:hover {
    background-color: #F9669A;
}
#pop_box_vs::-webkit-scrollbar-thumb {
    background-color: #e84e84;
    border: 0.3vw solid #000000;
}
#pop_box_vs::-webkit-scrollbar-track {
    margin-right: 1vw;
}


.animate__fadeIn {
    animation: fadeIn 0.5s;
}


.title_team {
    font-size: 1.5vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 33%, #f66197 55%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
        text-align: center;
    margin: 2.5vw 0;
}


.title_teamtxt {
    font-size: 1.1vw;
    font-weight: 600;
    letter-spacing: 0.1vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
    margin: 1vw 0 .5vw 0;
}






        .custom-select, .custom50-select {
    background-color: #000;
    color: #fff;
    border: none;
            border-bottom: .1vw solid;
    border-image: linear-gradient(to right, #2edcff, #ff639a) 1;
    padding: .5vw 0;
    width: 100%;
    box-sizing: border-box;
    font-size: 1vw;
    margin-bottom: 1vw;
    appearance: none;
    background-image: url(../img/arrow.png);
    background-repeat: no-repeat;
    background-position: calc(100% - .5vw) center;
    background-size: 1.5vw 1.5vw;
        text-align: center;
        }






        .custom-select option {
            background-color: #000;
            color: #fff;
            border: none;
        }


        .custom-select option:checked {
            background-color: #e84e84;
            color: #fff;
            border: none;
        }



#confirm_btn {
    display: flex;
    width: 12vw;
    height: 1.8vw;
    font-size: 1vw;
    color: #000000;
    background-color: #4ec0e8;
    font-weight: 500;
    cursor: pointer;
    clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
    border: none;
    transition: all .3s ease;
    justify-content: center;
    align-items: center;
    margin: 1.5vw 0vw 1.5vw 13vw;
    user-select: none;
    transition: background-color 0.3s ease;
}



#confirm_btn:hover {
 filter: brightness(115%);
}




@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}




#gotop {
width: 3vw;
    height: 3vw;
    background-image: url(../img/gotop.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    margin-top: 4vw;
    margin-bottom: 3vw;
    cursor: pointer;
    transition: all .3s ease;
}

#gotop:hover {
            filter: brightness(150%);
        }



#footbox {
    width: 100%;
    background-color: #000;
}


footer {
  background-color: #000;
}


@media screen and (min-width: 1024px) and (max-width: 1279px) {



}


@media screen and (min-width: 769px) and (max-width: 1023px) {


.big_text_p3 {
display: none;
}



}


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

#main_p1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}



.big_text_p3 {
display: none;
}





#rules {
        position: absolute;
        right: 5vw;
        top: 38vw;
        color: #000;
        width: 90vw;
        height: fit-content;
        background: linear-gradient(to right, #7ff8fe 0%, #f66197 50%);
        background-size: 100%;
        background-position: center;
        font-size: 3vw;
        line-height: 2;
        font-weight: 600;
        cursor: pointer;
        border: none;
        z-index: 2;
}


.rules_icon {
        width: 4.5vw;
        height: 4.5vw;
        margin-left: 0vw;
        padding-bottom: .65vw;
        }



#box_p3 {
        position: relative;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
        background-color: #000;
        font-size: 3vw;
        text-align: center;
        font-weight: 400;
        letter-spacing: 0.1vw;
        line-height: 1.75;
        color: #fff;
        width: 90vw;
        height: auto;
        padding: 5.5vw;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
}


#box_p1b {
    position: relative;
    border: 0.1vw solid;
    border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
    background-color: #000;
    font-size: .8vw;
    font-weight: 400;
    letter-spacing: 0.1vw;
    line-height: 1.75;
    color: #fff;
    width: 59vw;
    height: auto;
    padding: 2.5vw;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}



#bet_btn19_box {
width: 90vw;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        margin-bottom: 6vw;
        flex-direction: row;
        justify-content: flex-start;
        padding-bottom: 2vw;
        }

        .bet_button {
        font-size: 2.8vw;
        width: 16.75vw;
        height: 6vw;
        color: #000;
        text-align: center;
        line-height: 2vw;
        margin-right: 1.5vw;
        flex-shrink: 0;
        text-align: center;
        line-height: 6vw;
        user-select: none;
        font-weight: 500;
        }

        .bet_button:hover {
filter: brightness(120%);
}

        .bet_button.active {
            background-color: #e84e84;
                cursor: pointer;
        }

        .bet_button.off {
            background-color: #3e3e3e;
                            cursor: pointer;
        }

        .bet_button.soon {
            background-color: #973456;

        }

        #bet_btn9 {
            margin-right: 0;
        }

        .bet_box {
    display: none;
    padding: 10px;
    height: fit-content;
        }

        .active {
            display: block;
        }

        /* Scrollbar styles */
        #bet_btn19_box::-webkit-scrollbar {
        height: .65vw;
        }
        #bet_btn19_box::-webkit-scrollbar-thumb:hover {
            background-color: #ffbde8;
        }
        #bet_btn19_box::-webkit-scrollbar-thumb {
background-color: #ff9adc;
    border: 0vw solid #000000;
        }
        #bet_btn19_box::-webkit-scrollbar-track {

        }

 #currency {
        display: flex;
        justify-content: center;
        align-items: center;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
        width: 50vw;
        background-color: #161616;
        height: auto;
        padding: 1.3vw 0;
        font-size: 3vw;
        margin: 5vw auto 5vw auto;
        text-align: center;
 }



.title_bet {
font-size: 5vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
            margin-top: 4vw;
}

.title_bettxt {
font-size: 3.5vw;
    font-weight: 600;
    letter-spacing: 0.1vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
}



#vs_box {
        width: 80vw;
        height: fit-content;
        display: flex;
        margin-top: 2vw;
        flex-direction: column;
        align-items: center;
}

.vs1 {
       width: 90%;
        height: fit-content;
        background-color: #1d1d1d;
        padding: 2vw 0 3vw 0;
        display: flex;
        flex-direction: column;
        border-bottom: .5vw solid;
        border-color: #79e1fa;
        align-items: center;
}

#vs2 {
width: 13vw;
    height: 13vw;
background-image: url(../img/vs.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.vs3 {
       width: 90%;
        height: fit-content;
        background-color: #1d1d1d;
        padding: 2vw 0 3vw 0;
        display: flex;
        flex-direction: column;
        border-bottom: .5vw solid;
    border-color: #e84e84;
            align-items: center;
}



#sub_L {
        display: flex;
        width: 22.5vw;
        height: 4vw;
        font-size: 2.4vw;
        line-height: 4vw;
        color: #000000;
        background-color: #4ec0e8;
        font-weight: 500;
        clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
        border: none;
        transition: all .3s ease;
        /* margin-top: 1vw; */
        user-select: none;
        transition: background-color 0.3s ease;

}

#sub_R {
        display: flex;
        width: 22.5vw;
        height: 4vw;
        font-size: 2.4vw;
        line-height: 4vw;
        color: #000000;
    background-color: #e84e84;
        font-weight: 500;
        clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
        border: none;
        transition: all .3s ease;
        /* margin-top: 1vw; */
        user-select: none;
        transition: background-color 0.3s ease;

}


.vs_btn {
        display: flex;
        position: relative;
        z-index: 3;
        width: 50vw;
        height: 7.8vw;
        line-height: 7.8vw;
        font-size: 3.3vw;
        color: #000000;
        background-color: #4ec0e8;
        font-weight: 600;
        cursor: pointer;
        clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
        border: none;
        transition: all .3s ease;
        margin: 6vw 0vw 4vw 15vw;
        user-select: none;
        transition: background-color 0.3s ease;
}

.vs_btn:hover {
filter: brightness(120%);
}



.vs_btn.off {
background-color: #5b5b5b;
    position: absolute;
}

.vs_btn.on {
background-color: #4ec0e8;
}

.vs_btn.pp {
background-color: #e84e84;
}

.gradient-line {
        width: 100%;
        height: .2vw;
        background: linear-gradient(to right, #2edcff, #ff639a);
        border: none;
        margin: 10vw 0;
        }


#over_box {
        width: 80vw;
        height: fit-content;
        display: flex;
        margin-top: 10vw;
        padding: 6vw 0 2vw 0;
        flex-direction: row;
        align-items: center;
}

.over1 {
animation-fill-mode: both;
        width: 25%;
        height: fit-content;
        padding: 1vw 1vw 1.3vw 1vw;
        display: flex;
        flex-direction: column;
        margin: 0 1vw;
        font-size: 2.5vw;
        font-weight: 600;
}

.over2 {
animation-fill-mode: both;
        width: 25%;
        height: fit-content;
        padding: 1vw 1vw 1.3vw 1vw;
        display: flex;
        flex-direction: column;
        margin: 0 1vw;
    border-top: .1vw solid;
    border-color: #5c5c5c;
        font-size: 2.5vw;
        font-weight: 600;
}

.over2.bule {
color: #79e1fa;
}

.over2.red {
color: #e84e84;
}


.stats_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: .5vw;
        }

        .stats_text-with-icon {
            display: flex;
            align-items: center;
            gap: 0.2vw;
        }

        .stats_icon {
    width: 3vw;
    height: 3vw;
        }

        .stats_text {
            font-size: 3vw;
        }




.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 1000;
}


#closepop_box_rules {
        position: fixed;
        right: 2vw;
        top: 2vw;
        cursor: pointer;
        width: 8vw;
        height: 8vw;
        filter: brightness(185%);
        }


#closepop_box_vs {
        position: fixed;
        right: 2vw;
        top: 2vw;
        cursor: pointer;
        width: 8vw;
        height: 8vw;
        filter: brightness(185%);
        }



#pop_box_rules {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80vw;
        height: auto;
        max-height: 80vh;
        background-color: #000;
        padding: 5vw;
        z-index: 9999;
        overflow: auto;
        color: #fff;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
        font-size: 3vw;
        font-weight: 400;
        letter-spacing: 0.1vw;
        line-height: 2;
        color: #fff;
        }



#pop_box_rules::-webkit-scrollbar {
    width: 2.5vw;
    padding: 1vw;
    height: 1vw;
}
#pop_box_rules::-webkit-scrollbar-thumb:hover {
    background-color: #F9669A;
}
#pop_box_rules::-webkit-scrollbar-thumb {
    background-color: #e84e84;
    border: 0.75vw solid #000000;
}
#pop_box_rules::-webkit-scrollbar-track {
    margin-right: 1vw;
}


.title_info {
    font-size: 3.5vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 8%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.title_info_spacing {
    margin-top: 3vw;
}


/*POP 2*/


#pop_box_vs {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80vw;
        height: auto;
        max-height: 80vh;
        background-color: #000;
        padding: 5vw;
        z-index: 9999;
        overflow: auto;
        color: #fff;
        border: 0.1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff216f) 1;
        font-size: 3vw;
        font-weight: 400;
        letter-spacing: 0.1vw;
        line-height: 2;
        color: #fff;
}


#pop_box_vs::-webkit-scrollbar {
    width: 2.5vw;
    padding: 1vw;
    height: 1vw;
}
#pop_box_vs::-webkit-scrollbar-thumb:hover {
    background-color: #F9669A;
}
#pop_box_vs::-webkit-scrollbar-thumb {
    background-color: #e84e84;
    border: 0.75vw solid #000000;
}
#pop_box_vs::-webkit-scrollbar-track {
    margin-right: 1vw;
}


.animate__fadeIn {
    animation: fadeIn 0.5s;
}


.title_team {
    font-size: 4.5vw;
    font-weight: 600;
    letter-spacing: 0.2vw;
    background: linear-gradient(to right, #7ff8fe 33%, #f66197 55%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
        text-align: center;
    margin: 2.5vw 0;
}


.title_teamtxt {
    font-size: 3.3vw;
    font-weight: 600;
    letter-spacing: 0.1vw;
    background: linear-gradient(to right, #7ff8fe 0%, #f66197 100%);
    background-size: 100%;
    background-position: center;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-align: center;
    margin: 1vw 0 .5vw 0;
}






        .custom-select, .custom50-select {
        background-color: #000;
        color: #fff;
        border: none;
        border-bottom: .1vw solid;
        border-image: linear-gradient(to right, #2edcff, #ff639a) 1;
        padding: 1.5vw 0;
        width: 100%;
        box-sizing: border-box;
        font-size: 3vw;
        margin-bottom: 6vw;
        appearance: none;
        background-image: url(../img/arrow.png);
        background-repeat: no-repeat;
        background-position: calc(100% - .5vw) center;
        background-size: 3.5vw 3.5vw;
        }






        .custom-select option {
            background-color: #000;
            color: #fff;
            border: none;
        }


        .custom-select option:checked {
            background-color: #e84e84;
            color: #fff;
            border: none;
        }



#confirm_btn {
        display: flex;
        width: 46vw;
        height: 6.8vw;
        font-size: 3.5vw;
        color: #000000;
        font-weight: 500;
        cursor: pointer;
        clip-path: polygon(7% 0%, 100% 0%, 100% 70%, 93% 100%, 0% 100%, 0% 30%);
        border: none;
        transition: all .3s ease;
        justify-content: center;
        align-items: center;
        margin: 3vw 0 5vw 16vw;
        user-select: none;
        transition: background-color 0.3s ease;
        background-color: #4ec0e8;
}






@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
















#gotop {
width: 8vw;
    height: 8vw;
    background-image: url(../img/gotop.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    margin-top: 14vw;
    margin-bottom: 3vw;
    cursor: pointer;
    transition: all .3s ease;
}

#gotop:hover {
            filter: brightness(150%);
        }



#footbox {
    width: 100%;
    background-color: #000;
}


footer {
  background-color: #000;
}


}