/*** Media queries for variable screen sizes ***/
/** Large devices 1023 < x <= 1200 */
@media only screen and (max-width: 1200px) {
    .row {
        padding: 0 2%;
    }
}

/* Devices 719 < x <= 1023px */
@media only screen and (max-width: 1023px) {
    .about-details {
        transform: translate(25%, 0);
    }
    
    footer {
        font-size: 75%;
        line-height: 1.5;
    }
    
    .footer-nav li,
    .social-media li {
        margin: 0 10px 10px 10px;
    }
}

/* Devices 480 < x <= 720px */
@media only screen and (max-width: 720px) {
    body {
        font-size: 85%
    }
    
    .about-details {
        transform: none;
    }
    
    .about-picture {
        transform: none;
    }

    .span_1_of_5 h4 {
        font-size: 80%;
    }
    
    .span_1_of_5 {
        font-size: 70%;
    }
    
    .footer-nav {
        transform: none;
        margin: 0 0;
    }
}

/* Small devices x <= 480px */
@media only screen and (max-width: 480px) {
    .section-about {
        text-align: center;
    }
    
    .span_1_of_5 h4 {
        font-size: 110%;
    }
    
    .span_1_of_5 {
        font-size: 100%;
    }
}