body {

    font-family:  'Open Sans', 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;

}

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

    .header {
        display: flex;
        flex-wrap: nowrap;
    }

    .header img {
        width: 20%;
    }

    .header h1 {
        padding: 0 0 0 5%;
        font-size: 20px;
    }

    .logo img {
        width: 100%;
    }

    .about {
        width: 100%;
        background-color: orange;
    }

}

@media only screen and (min-width: 601px) {

    .about {
        width: 1000px;
        background-color: red;
    }

}

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

    .about {
        background-color: green;
    }

}

@media only screen and (min-width: 992px) {

    .about { 
        background-color: purple;
    }

}

@media only screen and (min-width: 1200px) {

    .about {

    }

}