body {
            font-family: Arial, sans-serif;
            background-color: #1e1e1e;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            color: #eee;
            user-select: none;
            scrollbar-width: 1px;
        }
        
        
        
        
        :root{
    --colorDefault: #ffff00;
    --whiteColor: #ffffff;
}

/*LOADER*/

.loading{
    margin: 0 auto;
    position: fixed;
    background-color: var(--whiteColor);
    width: 100%;
    height: 100%;
    z-index: 99;
    animation: fadeOut 4s;
    animation-fill-mode: forwards;
}
.main{
    margin: 20rem auto;
    display: flex;
    justify-content: center;
}
.dot{
    border: 6px solid #000000;
    border-radius: 60px;
    width: 100px;
    height: 100px;
}
.dot2{
    border: 6px solid var(--colorDefault);
    border-radius: 60px;
    background-color: transparent;
    width: 100px;
    height: 100px;
    margin: -6px -6px;
    border-left-color: transparent;
    border-top-color: transparent;
    animation: loader 1s;
    animation-iteration-count: infinite;
}

@keyframes loader{
    100%{
        transform: rotate(360deg);
    }
}

@-webkit-keyframes loader{
    100%{
        transform: rotate(360deg);
    }
}

@keyframes fadeOut{
    100%{
        visibility: hidden;
    }
}

@-webkit-keyframes fadeOut{
    100%{
        visibility: hidden;
    }
}
        
        

        ::-webkit-scrollbar {
            width: 0;
        }

        #top_sect,
        #och2,
        .status_need {
            display: none;
        }


        .tugma {
            max-width: 400px;
            margin: 0 auto;
            padding: 20px;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            /*background-color: #686f82;*/
            background: linear-gradient(180deg, #000 10%, orange 90%);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }

        .tugma .quote {
            width: 95%;
            height: 45px;
            padding: 10px;
            margin: -5px auto 30px auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 16px;
            border-radius: 15px;
            background-color: #8f8f8f61;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }

        .tugma .quote .chap {
            display: flex;
            align-items: center;
        }

        .tugma .quote img {
            width: 50px;
            margin: 0 10px 0 0;
            border-radius: 12px;
        }

        .tugma .balans {
            display: flex;
            align-items: center;
            font-size: 45px;
            font-weight: bold;
            margin: 0 auto;
        }

        .tugma .balans img {
            width: 35px;
            margin: 0 10px 0 0;
        }

        .tugma .lavozim {
            display: flex;
            align-items: center;
            /* font-size: 40px; */
            margin: 15px auto 60px auto;
        }

        .click {
            width: 285px;
            height: 285px;
            margin: 0 auto;
            justify-content: center;
            align-items: center;
            position: relative;
            transition: .4;
        }

        .click img {
            width: 100%;
        }

        /*.click:active {*/
        /*    transform: scale(0.97);*/
        /*}*/

        .tugma .footer {
            width: 95%;
            height: 60px;
            padding: 10px;
            margin: 20px auto 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .tugma .footer .chaqmoq {
            display: flex;
            align-items: center;
        }

        .tugma .footer .chaqmoq .chaq {
            font-size: 35px;
        }

        .tugma .footer .chaqmoq .tez {
            display: flex;
            flex-direction: column;
            font-size: 20px;
        }

        .tugma .footer .chaqmoq .tez .kelishi {
            font-size: 11px !important;
        }

        .tugma .footer .sozlama {
            max-width: 220px;
            height: 65px;
            display: flex;
            align-items: center;
            margin: auto 0 auto 5px;
            border-radius: 15px;
            border: 1px solid #aaa;
            background-color: #3d3d3d89;
            box-shadow: 0 0 10px rgba(1, 1, 1, 0.1);
        }

        .tugma .footer .sozlama .as {
            width: 35px;
            font-size: 30px;
            padding: 0 20px;
            margin: 0 auto;
            border-right: 1px solid #999;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .tugma .footer .sozlama .as3 {
            border-right: 0px solid #999 !important;
        }

        .tugma .footer .sozlama .as .text1 {
            width: 30px;
            height: 30px;
        }

        .tugma .footer .sozlama .as .text2 {
            font-size: 15px;
        }

        a {
            text-decoration: none;
            color: white;
        }

        .cid {
            text-decoration: none;
            color: #000;
            font-size: 1px;
            position: absolute;
            top: -20px;
        }

        .tugma .tugashi {
            width: 100%;
            height: 14px;
            margin: 0 auto;
            border-radius: 15px;
            background: linear-gradient(90deg, #848da1 10%, #ddd 90%, #111 20%);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }

        p {
            color: white;
            font-size: 35px;
            font-weight: bold;
            opacity: 0;
            animation: asilbek 1.4s reverse ease-in;
        }

        @keyframes asilbek {
            0% {
                opacity: 0;
                transform: translateY(-200px);
            }

            100% {
                opacity: 1;
            }
        }

        .blur {
            filter: blur(15px);
        }

        .top0 {
            width: 100%;
            height: 10px;
            position: absolute;
            top: 0;
            right: 0;
        }

        .copyright {
            width: 100%;
            position: fixed;
            bottom: 5px;
            font-size: 12px;
            color: #50505089;
        }

        .copyright div {
            text-align: center;
            margin: 0 auto;
        }

        .orta {
            max-width: 340px;
            height: 580px;
            padding: 70px 10px 10px 10px;
            border-radius: 20px;
            margin: 40px auto 0 auto;
            background: #8282824a;
            transform: translate(0px, 0px) scale(1);
            box-shadow: 0 0 6px #222;
            transition: .5s;
            overflow-y: scroll;
            /* transform-origin: 50% 0; */
        }
        .chiq{
            width: 100%;
            position: fixed;
            top: 30px;
            z-index: 50;
            transition: .5s;
            opacity: 1;
        }
        .chiqe{
            top: -80px;
            opacity: 0;
        }
        .tophe {
            max-width: 340px;
            display: flex;
            align-items: center;
            margin: 0 auto;
            justify-content: space-between;
            background: linear-gradient(#000000eb, #00000000);
            border-radius: 20px 20px 0 0;
            /* border-bottom: 1px solid #f4f4f44d; */
            padding: 0 20px;
        }
        .bos .balans2{
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .chiqish {
            width: 50px;
            height: 50px;
            border-radius: 10px;
            background: #b2351f;
            position: relative;
        }

        .ch1 {
            width: 40px;
            height: 5px;
            border-radius: 2px;
            transform: rotate(-45deg);
            background: #b9bab6;
            position: absolute;
            top: 23px;
            right: 5px;
            color: #eee;
        }

        .ch2 {
            width: 40px;
            height: 5px;
            border-radius: 2px;
            transform: rotate(45deg);
            background: #b9bab6;
            position: absolute;
            top: 23px;
            right: 5px;
        }

        .active1 {
            transform: translate(125px, 300px) scale(0) !important;
        }

        .active2 {
            transform: translate(-20px, 300px) scale(0) !important;
        }

        .active3 {
            transform: translate(50px, 300px) scale(0) !important;
        }

        .ilink {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin: 10px;
        }

        .ilink a {
            color: #fefae0;
            padding: 10px 20px;
            background-color: #ffbe0b;
            border-radius: 15px;
        }

        .referalim {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin: 10px;
            padding: 18px;
            background: #8282824a;
            border: 1px solid #f4f4f44d;
            border-radius: 15px;
        }

        
        .referalim .bal span {
            color: #ffbe0b;
        }
        .referalim .bonus{
            color: #dde5b6;
        }

        .referalim .ismi {
            font-size: 18px;
            font-weight: 30px;
        }

        .referalim .bal {
            font-size: 14px;
            color: #dde5b6;
        }

        .bolim {
            background: #8282824a;
            border: 1px solid #f4f4f44d;
            border-radius: 15px;
        }

        .mkanal {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 15px;
        }

        .kchap {
            margin: 10px;
        }

        .mkanal .krasm {
            display: flex;
            align-items: center;
        }

        .mkanal .knomi {
            font-size: 15px;
            font-weight: 30px;
        }

        .mkanal .kbonus {
            font-size: 14px;
            color: #dcdcdcdf;
        }

        .mkanal img {
            width: 55px;
            height: 55px;
            border-radius: 60px;
        }

        .mkanal a {
            color: #fefae0;
            padding: 10px 20px;
            background-color: #ffbe0b;
            border-radius: 15px;
        }



        .ener {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 5px;
            margin: 5px;
        }
        .ener .turbo{
            width: 41%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 10px;
            background: #8282824a;
            border: 1px solid #f4f4f44d;
            border-radius: 15px;
        }
        .ener .turbo .tnomi{
            font-size: 17px;
        }
        .ener .turbo .qolgani{
            font-size: 14px;
            color: #dcdcdcdf;
        }
        .ener .turbo .traket{
            font-size: 24px;
        }

        .qolip{
            background: #8282824a;
            border: 1px solid #f4f4f44d;
            border-radius: 15px;
        }
        .qolip .multitap{
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 5px;
            margin: 5px;
        }
        .qolip .multitap .moshir{
            margin-right: 20px;
        }
        .qolip .multitap .mchap{
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        .qolip .multitap .mchap .belgi{
            font-size: 32px;
            padding: 16px 20px;
            background: #8282824a;
            border-radius: 15px;
        }
        .qolip .multitap .mchap .mo{
            margin-left: 10px;
        }
        .boosts .bos .balans2{
            margin: 30px 0;
        }
        .boosts .bos .balans2 img{
            width: 29px;
            margin: 0 10px 0 0;
        }
        .qolip .multitap .mtext{
            font-size: 19px;
            font-weight: 30px;
        }
        .qolip .multitap .mnomi{
            font-size: 15px;
            /*font-weight: 25px;*/
        }
        .boosts .bos .balans2 .son2{
            font-size: 29px;
        }
        
        .btekshirish{
            padding: 7px 20px;
        }
        
        .onactive{
            padding: 10px 20px;
            background: #06d6a0;
            border-radius: 15px;
        }
        
        
        #gifimge{
            width: 100px;
            height: 100px;
            position: absolute;
            top: -150px;
            transition: .7s;
            opacity: 0;
        }
        #gifimg{
            width: 100%;
            height: auto;
        }
        
        .gifa{
            animation: asilbek2 6s reverse linear forwards;
        }

        @keyframes asilbek2 {
            0% {
                opacity: 1;
            }
            80% {
                opacity: 0;
            }
            100% {
                opacity: 0;
            }
        }