
.info-box {
    .info-box-stats{ 
        span.info-box-title {
            display: block;
            font-size: 16px;
            margin-bottom: 10px;
            color: #374051;
        }
        p {
            font-size: 30px;
            margin-bottom: 14px;
            font-weight: bold;
        }
    }

    .info-box-icon {
        width: 45px;
        height: 45px;
        text-align: center;
        border-radius: 50%;

        svg {
            position: relative;
            font-size: 24px;
            color: #fff;
            top: 9px;
        }
    }
}




.bg-blue {
    background-color: #4776E6;
}
.bg-green {
    background-color: #31d281;
}
.bg-orange {
    background-color: #ff7f57;
}
.bg-violet {
    background-color: #796AEE;
}

.f-blue {
    color: #4776E6;
}

.f-green {
    color: #31d281;
}

.f-orange {
    color: #ff7f57;
}

.f-violet {
    color: #796AEE;
}