* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
}

:root {
    /* new variable color  */
    --dark-bg: #080B0F;
    --bg: #111820;
    --border: #2C3D50;
    --green: #2DD158;
    --dullfont: #8394A7;
    --yellow: #F9CA48;
    --white: #FFFFFF;
    --red: #FF2525;
    --blue: #1779FF;
    --purple: #9747FF;
    --buy: #2DD158;
    --black: #111820;

    /* svg image color  */

    --gray: #4787E6;
    --svg-bg: #202125;
    --round: #3B4043;
    --svg-gray: #D4D4D4;
    --svg-blue: #ffffff;
}

body.light-mode {

    /* new variable color  */
    --dark-bg: #ffffff;
    --bg: #EFF0F2;
    --border: #C0CCDD;
    --green: #00BB31;
    --buy: #00BB31;
    --dullfont: #888888;
    --yellow: #E4B020;
    --white: #111111;
    --red: #FF2525;
    --blue: #1779FF;
    --purple: #9747FF;
    --black: #111820;




    /* svg image color  */

    --gray: #4787E6;
    --svg-bg: #ffffff;
    --round: #d6d4d4;
    --svg-gray: #111111;
    --svg-blue: #1779FF;
}



/* font color css start */
.text_primary {
    color: var(--blue) !important;
}

.text_success {
    color: var(--green);
}

.text_warning {
    color: var(--yellow) !important;
}

.text_danger {
    color: var(--red) !important;
}

.text_dark {
    color: var(--bg) !important;
}

.text_gray {
    color: var(--dullfont) !important;
}

.text_white {
    color: var(--white) !important;
}

.text_light_blue {
    color: var(--border);
}

.text_buy {
    color: var(--buy) !important;
}

.text_bg {
    color: var(--bg);
}

.black_text {
    color: var(--black) !important;
}

/* font color css end */


/* bg color css start */
.bg_buy {
    background-color: var(--buy) !important;
}

.bg_primary {
    background-color: var(--blue);
}

.bg_Warning {
    background-color: var(--yellow) !important;
}

.bg_danger {
    background-color: var(--red) !important;
}

.bg_normal {
    background-color: var(--bg);
}

.bg_dark {
    background-color: var(--dark-bg) !important;
}

.bg_gray {
    background-color: var(--border) !important;
}

.bg_white {
    background-color: var(--white) !important;
}

.bg_dull {
    background-color: var(--dullfont) !important;
}

.bg_green {
    background-color: var(--green);
}

.bg_transparent {
    background-color: transparent !important;
}

/* font color css end */







/* font weight css start  */

.fw_100 {
    font-weight: 100;
}

.fw_200 {
    font-weight: 200;
}

.fw_400 {
    font-weight: 400;
}

.fw_500 {
    font-weight: 500;
}

.fw_600 {
    font-weight: 600;
}

.fw_700 {
    font-weight: 700;
}

.fw_800 {
    font-weight: 800;
}

.fw_950 {
    font-weight: 950;
}

/* font weight css END  */

.border_buy {
    border: 1px solid var(--buy);
}

.border_Warning {
    border: 1px solid var(--yellow);
}

.border_success {
    border: 1px solid var(--green) !important;
}

.border_danger {
    border: 1px solid var(--red) !important;
}

.border_bottom {
    border-bottom: 1px solid var(--border);
}

.border_left {
    border-left: 1px solid var(--border);
}

.border-top {
    border-top: 1px solid var(--border) !important;
}

.border_right {
    border-right: 1px solid var(--border);
}

.border-end {
    border-color: var(--border) !important;
}

.border {
    border: 1px solid var(--border) !important;
}

.pointer {
    cursor: pointer !important;
}

/* border radius class list */

.round22 {
    border-radius: 22px !important;
}

.round3 {
    border-radius: 3px !important;
}

/* font size and font weight class list  */


.sb12 {
    font-size: 12px !important;
    font-weight: 500 !important;
}

.sb14 {
    font-size: 14px !important;
    font-weight: 500 !important;
}

.m14 {
    font-size: 14px !important;
    font-weight: 400 !important;
}

.r14 {
    font-size: 14px !important;
    font-weight: 400 !important;
}

.r10 {
    font-size: 10px !important;
    font-weight: 400 !important;
}

.m12 {
    font-size: 12px !important;
    font-weight: 400 !important;
}

.sb20 {
    font-size: 20px;
    font-weight: 500;
}

.sb35 {
    font-size: 35px;
    font-weight: 500;
}

.rg16 {
    font-size: 16px;
    font-weight: 400;
}

.eb10 {
    font-size: 10px !important;
    font-weight: 700 !important;
}

.m16 {
    font-size: 16px;
    font-weight: 400;
}

.mb6 {
    margin-bottom: 6px;
}
.mb2 {
    margin-bottom: 2px;
}

.m18 {
    font-size: 18px !important;
    font-weight: 400 !important;
}

.sm20 {
    font-size: 20px;
    font-weight: 500;
}


/* spacing class list  */
.pb30 {
    padding-bottom: 30px;
}
.pb10 {
    padding-bottom: 10px !important;
}
.pt35 {
    padding-top: 35px;
}

.mt50 {
    margin-top: 50px !important;
}

.mt40 {
    margin-top: 40px;
}

.mt20 {
    margin-top: 20px !important;
}

.mt15 {
    margin-top: 15px;
}

.my15 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.mt30 {
    margin-top: 30px;
}

.mt10 {
    margin-top: 10px;
}

.mt100 {
    margin-top: 100px;
}

.mt120 {
    margin-top: 120px !important;
}

.mt5 {
    margin-top: 5px !important;
}

.mt7 {
    margin-top: 7px !important;
}

.mb40 {
    margin-bottom: 40px;
}

.mr5 {
    margin-right: 5px;
}

.pt85 {
    padding-top: 85px;
}

.py30 {
    padding-top: 30px;
    padding-bottom: 30px;
}

.py40 {
    padding: 40px 0;
}

.mt85 {
    margin-top: 85px;
}

.py50 {
    padding: 50px 0;
}

.px15 {
    padding-left: 15px;
    padding-right: 15px;
}

.my12 {
    margin: 12px 0;
}

.my10 {
    margin: 10px 0;
}

.my30 {
    margin: 30px 0;
}

.px10 {
    padding-left: 10px;
    padding-right: 10px;
}
.p12 {
    padding: 12px;
}
.p15 {
    padding: 15px;
}

.pb118 {
    padding-bottom: 118px;
}

.py9 {
    padding: 9px 8px !important;
}

.py10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.mt70 {
    margin-top: 70px;
}
.mb15 {
    margin-bottom: 15px;
}
.mb20 {
    margin-bottom: 20px;
}

.mt12 {
    margin-top: 12px;
}

.mt25 {
    margin-top: 25px;
}

.mt3 {
    margin-top: 3px;
}

.px20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.pl20 {
    padding-left: 20px;
}

.p10 {
    padding: 10px;
}

.p20 {
    padding: 20px !important;
}

.word_breck {
    word-break: break-all;
}

.w90 {
    width: 90px;
}

.h320 {
    height: 353px !important;
}

.w70 {
    width: 70px;
}

.w180 {
    width: 180px;
}

.w105 {
    width: 105px;
    min-width: 105px;
}

.gap20 {
    gap: 20px;
}

.gap78 {
    gap: 78px;
}

.gap100 {
    gap: 100px;
}
.zi1 {
    z-index: 1;
}

@media (max-width: 1025px) {
    .mobile_12 {
        font-size: 12px !important;
        font-weight: 400 !important;
    }

    .mt120 {
        margin-top: 60px !important;
    }

    .mt70 {
        margin-top: 40px;
    }
}

@media (max-width: 991px) {
    .mobile_border_none_end {
        border-right: 0 !important;
    }

    .py40 {
        padding: 25px 0;
    }

    .pl20 {
        padding-left: 15px;
    }
}

@media (max-width: 600px) {
    .mt70 {
        margin-top: 30px;
    }

    .pl20 {
        padding-left: 10px;
    }
}

.allicon {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 20px;
}





/* light mode extra css  */

.light-mode .color_dark .text_gray {
    color: #111 !important;
}

.light-mode .color_dark.securitytab .active {
    background-color: #C0CCDD !important;
    color: #111111 !important;
}

.light-mode .security-subheading {
    color: #111111;
}

.light-mode .security-subsection p {
    /* color: #111111; */
}

.light-mode .light_primary {
    color: var(--blue);
}

.light-mode .color_dark.securitytab .gray_button {
    color: #111111;
}

.light-mode .storage {
    background-color: #C0CCDD;
    color: #111111;
}

.light-mode .btn_group_gray {
    color: #111111;
}

.light-mode .pagination_page.active_page a {
    padding: 4px 15px;
    background-color: #C0CCDD;
    border: 1px solid #C0CCDD;
}

.light-mode .pagination_page.active_page a {
    color: #111111;
}