.heading {
    color: whitesmoke;
    text-align: center;
    font-weight: 900;
    font-size: 50px;
}

.heading span {
    color: orange;
}

.about .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 1rem 0;
}

.about .row .info {
    flex: 1 1 48rem;
    padding: 2rem 1rem;
    padding-left: 6rem;
    color: yellow;
}

.about .row .info h3 {
    font-size: 2rem;
    color: var(--sky);
    padding: 1rem 0;
    font-weight: normal;
}

.about .row .info h3 span {
    color: #eee;
    padding: 0 .5rem;
}

.about .row .counter {
    flex: 1 1 48rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.about .row .counter .box {
    width: 20rem;
    background: #007ced;
    text-align: center;
    padding: 2rem;
    margin: 2rem;
}

.about .row .counter .box span {
    font-size: 4rem;
    color: gold;
}

.about .row .counter .box h3 {
    font-size: 2rem;
    color: #fff;
}

.about .row .counter .box a {
    font-size: 2rem;
    color: var(--sky);
    color: black;
}


@media screen and (max-width: 768px) {

    .heading {
        color: whitesmoke;
        text-align: center;
        font-weight: 900;
        font-size: 50px;
    }
    
    .heading span {
        color: orange;
    }
    
    .about .row {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        padding: 1rem 0;
    }
    
    .about .row .info {
        flex: 1 1 48rem;
        padding: 2rem 1rem;
        padding-left: 1.5rem;
        color: yellow;
    }
    
    .about .row .info h3 {
        font-size: 2rem;
        color: var(--sky);
        padding: 1rem 0;
        font-weight: normal;
    }
    
    .about .row .info h3 span {
        color: #eee;
        padding: 0 .5rem;
    }
    
    .about .row .counter {
        flex: 1 1 48rem;
        flex-direction: column;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .about .row .counter .box {
        width: 20rem;
        background: #007ced;
        text-align: center;
        padding: 2rem;
        margin: 2rem;
    }
    
    .about .row .counter .box span {
        font-size: 4rem;
        color: gold;
    }
    
    .about .row .counter .box h3 {
        font-size: 2rem;
        color: #fff;
    }
    
    .about .row .counter .box a {
        font-size: 2rem;
        color: var(--sky);
        color: black;
    }
    
}