:root .color28-4 {

    /* color */
    --color-stop-1: #C7CBD7;
    --color-stop-2: #C7CBD7;
    --color-stop-3: #859398;
    --color-stop-4: #859398;

    --color-stop-1a: #C7CBD7;
    --color-stop-2a: #C7CBD7;
    --color-stop-3a: #859398;
    --color-stop-4a: #859398;

    /* position */
    --position-1: 10%;
    --position-2: 25%;
    --position-3: 75%;
    --position-4: 100%;
    
    /* body */
    --bg-body: #000000;
    --bg-mobile: #000000;
    --gradient-bg-body: linear-gradient(0deg, #C7CBD7 10%, #859398 100%);
    --gradient-text: linear-gradient(0deg, #CED2DD 0%, rgba(133, 147, 152, 0.64) 100%);

    /* download */
    --bg-download: #000000;

    --color-primary-0: #EAEAED;
    --color-primary-10: #EAEAEDD1;
    --color-primary-20: #EAEAED33;
    --color-primary-30: #EAEAED4D;
    --color-primary-100: #D4D6DA;
    --color-primary-200: #BFC1C8;
    --color-primary-300: #9498A4;
    --color-primary-400: #696E7F;
    --color-primary-600: #283048;
    --color-primary-700: #242B41;
    --color-primary-900: #141824;
    --color-primary-1000: #080A0E;
    
    --color-chat: #ADADAD;

    /* footer */
    --bg-deposit: url(../images/color28-4/bg-deposit.svg);
    --bg-deposit-top: url(../images/color28-4/bg-deposit-top.png);

    /* vip */
    --bg-vip-bar: linear-gradient(0deg, #CED2DD 0%, rgba(133, 147, 152, 0.64) 100%);
    --bg-progress: linear-gradient(180deg, rgba(40, 48, 72, 0.60) 0%, #859398 100%);
    --bg-progress-logged-in: #000000;
}

.color28-4 .modal-content {
    background: var(--gradient-bg-body);
    border: 0;
}
.color28-4 #annModal .modal-content,
.color28-4 #token-history .modal-content,
.color28-4 .info-page-wrap {
    background: var(--gradient-text);
}
.color28-4 .annbox .cclose,
.color28-4 .modal-content .btn-close {
    background: linear-gradient(var(--black-100), var(--black-100)) padding-box, var(--gradient-text) border-box;
}
.color28-4 .ann-title,
.color28-4 .modal-title,
.color28-4 .page-div-top h4,
.color28-4 .af-box .af-box-head h4 {
    background: var(--gradient-text);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.color28-4 .anncon .nav-link[data-bs-toggle="pill"]::before {
    background-color: var(--color-primary-100);
}
.color28-4 .modal-body .btn-main {
    background: var(--color-accent-100);
}
.color28-4 .btn-main:hover, 
.color28-4 .btn-main:active, 
.color28-4 .btn-main:focus, 
.color28-4 .btnform:hover, 
.color28-4 .btnform:active, 
.color28-4 .btnform:focus {
    background: var(--black-30);
}