@font-face{
    font-family:'digital-clock-font';
    src: url('put_the_location_to_your_font.ttf or .otf');
}

@font-face {
    font-family: 'digital-7';
    src: url('../text_font/digital-7.regular.woff');
}

:root{
    --s: clamp(0px, 3vw, 12px);
    --m: clamp(0px, 3.5vw, 15px);
    --ml: clamp(0px, 4vw, 18px);
    --l: clamp(0px, 5vw, 20.7px);
    --xl: clamp(0px, 7vw, 28.98px);
    --xxl: clamp(0px, 10vw, 41.4px);

    /* --font-family-roboto: "Roboto", Helvetica; */
    --font-family-roboto: Arial, sans-serif;
    --font-family-digit-clock: "digital-clock-font";
}

input{
    border:1px solid red;
}
/* sub text */
.text-sub-m{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-sub);
}

/* marquee text */
.text-marquee{ 
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-marquee);
}

/* jackpot Text */
.text-jackpot{
    font-size: var(--xl);
    font-weight: 900;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    background: -webkit-linear-gradient(var(--jackpot-pool-text-1), var(--jackpot-pool-text-2), var(--jackpot-pool-text-3));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: clamp(0px ,0.5vw , 2.07px); 
}

/* live 1 Text */
.text-live1-title{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live1-title);
}

.text-live1-topup{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live1-topup);
}

.text-live1-win{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live1-win);
}

.text-live1-user{
    font-size: var(--s);
    font-family: var(--font-family-roboto);
    color: var(--text-live1-user);
}

.text-live1-price{
    font-size: var(--s);
    font-family: var(--font-family-roboto);
    color: var(--text-live1-price);
}

/* live 2 text */
.text-live2-user{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live2-user);
    font-weight: 700;
}

.text-live2-gtype{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live2-gtype);
    font-weight: 700;
}

.text-live2-price-mega{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live2-price-mega);
    font-weight: 700;
    
}

.text-live2-price{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-live2-price);
    font-weight: 700;
}

/* date time */
/* dt 1 */
.text-dt-1{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-dt-1);
}
/* dt 2 */
.text-dt2-time{
    font-size: var(--xxl);
    font-family: var(--font-family-digit-clock);
    color: var(--text-dt2-time);
    font-weight: 900;
    letter-spacing: 1vw;
}

.text-dt2-weekday{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-dt2-weekday);
    font-weight: 500;
}

.text-dt2-day{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    color: var(--text-dt2-day);
    font-weight: 500;
}

.text-dt2-month{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-dt2-month);
}
/* dt3 */
.text-dt3-time{
    font-size: var(--l);
    font-family: var( --font-family-digit-clock);
    color: var(--text-dt3-time);
    font-weight: 600;
    letter-spacing: 0.5vw;
}

.text-dt3-date{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-dt3-date);
}

/* login bar */
/* lb1 */
.text-lb1-main{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb1-main);
}

.text-lb1-main-bold{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb1-main);
    font-weight: 700;
}

.text-lb1-main-l-bold{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb1-main);

}

.text-lb1-sub-l-bold{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb1-balance);

}

.text-lb1-balance{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    color: var(--text-lb1-balance);
    font-weight: 700;
}
/* lb2 */
.text-lb2-balance{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb2-balance);
}

.text-lb2-currency{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-lb2-currency);
}

.text-lb2-amount{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    color: var(--text-lb2-amount);
    font-weight: 700;
}

.text-pm1-title{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-pm1-title);
    font-weight: 700;
}

.text-pm1-sub-title{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-pm1-sub-title);
    font-weight: 700;
}




/* Promotion text */
.promotion-title{ 
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-promotion-title);
}
.promotion-category{ 
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-promotion-category);
}
.promotion-item-title{
    color: var(--text-promotion-item-title);
}
.promotion-item-desc{
    color: var(--text-promotion-item-desc);
}
.promotion-item-claimtxt{
    color: var(--text-promotion-item-claimtxt);
}

.text{
    color: var(--sub-color);
}


/* rcb text */
.text-rcb1-title-b{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    font-weight: 700;
}

.text-rcb1-claim-b{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    color: #fff;
    font-weight: 700;
}


/* cant edit part */
.text-main-title{
    font-size: var(--l);
    font-family: var(--font-family-roboto);
    color: var(--text-main);
}

.text-main-title-b{
    font-size: var(--l);
    font-family: var(--font-family-roboto);
    color: var(--text-main);
    font-weight: 700;
}

.text-main-normal{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-main);
}


.text-main-normal-b{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-main);
    font-weight: 700;
}

.text-main-small{
    font-size: var(--s);
    font-family: var(--font-family-roboto);
    color: var(--text-main);
}

.text-inselected-normal{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: #979797;
}

.text-sub-title-b{
    font-size: var(--l);
    font-family: var(--font-family-roboto);
    color: var(--text-sub);
    font-weight: 700;
} 

.text-sub-title-600{
    font-size: var(--l);
    font-family: var(--font-family-roboto);
    color: var(--text-sub);
    font-weight: 600;
} 

.text-sub-normal{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: var(--text-sub);
}

input{
    height:10px;
    color:black;
}

.text-white-s{
    font-size: var(--s);
    font-family: var(--font-family-roboto);  
    color: #fff; 
}

.text-white-m{
    font-size: var(--m);
    font-family: var(--font-family-roboto);  
    color: #fff; 
}

.text-white-m-b{
    font-size: var(--m);
    font-family: var(--font-family-roboto);  
    color: #fff; 
    font-weight: 700;
}

.text-white-xl{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);  
    color: #fff; 
}

.text-ne-black-m{
    font-size: var(--m);
    font-family: var(--font-family-roboto);  
    color: #000; 
}

.text-ne-dark-grey-m{
    font-size: var(--m);
    font-family: var(--font-family-roboto);  
    color: #a9a9a9; 
}

.text-red-s{
    font-size: var(--s);
    font-family: var(--font-family-roboto);  
    color: #FF4545; 
}

/* for football live 'fix color n size' */
.text-fbl-title{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: #fff;
    font-weight: 700;
}

.text-fbl-subtitle{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: #000;
    font-weight: 500;
}

.text-fbl-time{
    font-size: var(--l);
    font-family: 'digital-7';
    color: #038F00;
    font-weight: 500;
}

.text-fbl-team{
    font-size: var(--s);
    font-family: var(--font-family-roboto);
    color: #000;
}

.text-fbl-bet{
    font-size: var(--s);
    font-family: var(--font-family-roboto);
    color: #fff;
}

/* fix */
.text-copygrey-normal-bold{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: #707070;
    font-weight: 700;
}

.text-copygrey-normal{
    font-size: var(--m);
    font-family: var(--font-family-roboto);
    color: #707070;
}

.maintenance-title-text{
    font-size: var(--xl);
    font-family: var(--font-family-roboto);
    color: #fff;
    font-weight: 700;
}