﻿
.nsop-tg-seccounterbox-conatiner {
}

.nsop-tg-seccounterbox-icon {
    color: var(--nsop-theme-seccounterbox-mainicon-color);
}

.nsop-tg-seccounterbox-toptitle {
    color: var(--nsop-theme-seccounterbox-toptitle-color);
    font-size: var( --nsop-theme-seccounterbox-toptitle-font-size);
    font-weight: var(--nsop-theme-seccounterbox-toptitle-font-weight);
}

.nsop-tg-seccounterbox-title {
    color: var(--nsop-theme-seccounterbox-title-color);
    font-size: var( --nsop-theme-seccounterbox-title-font-size);
    font-weight: var(--nsop-theme-seccounterbox-title-font-weight);
}

.nsop-tg-seccounterbox-subtitle {
    color: var(--nsop-theme-seccounterbox-subtitle-color);
    font-size: var( --nsop-theme-seccounterbox-subtitle-font-size);
    font-weight: var(--nsop-theme-seccounterbox-subtitle-font-weight);
}

.nsop-tg-seccounterbox-items-holder {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    --webkit-overflow-scrolling: touch;
}

.nsop-tg-seccounterbox-item {
    text-align: center;
    margin: 1rem 2rem;
    min-width: 10rem;
}

.nsop-tg-seccounterbox-item-icon-holder {
    margin-bottom: .5rem;
}


.nsop-tg-seccounterbox-item-icon {
    color: var(--nsop-theme-seccounterbox-mainicon-color);
    font-size: 2rem;
}


.nsop-tg-seccounterbox-item-title {
    font-size: var(--nsop-theme-seccounterbox-item-title-font-size);
    font-weight: var(--nsop-theme-seccounterbox-item-title-font-weight);
    color: var(--nsop-theme-seccounterbox-item-title-color);
}

.nsop-tg-seccounterbox-num-holder {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    color: var(--nsop-theme-palette-secondary-dark-color);
    font-size: 1.8rem;
    font-weight: 800;
    font-family: var(--nsop-theme-digit-font-family);
}

.nsop-tg-seccounterbox-plussign {
}

    .nsop-tg-seccounterbox-plussign::before {
        vertical-align: middle !important;
    }

@media (min-width: 700px) {
    .nsop-tg-seccounterbox-items-holder {
        justify-content: center;
    }
}
@media (max-width: 576px) {
    
    .nsop-tg-seccounterbox-item {
        margin: 1rem;
    }

    .nsop-tg-seccounterbox-item-title {
        font-size: 1rem;
    }

    .nsop-tg-seccounterbox-num-holder {
        font-size: 1.5rem;
    }
}