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

    /*****************************
            PAGE CONTACT
    *****************************/

    #primary {
        width: 50%;
        float: left;
    }

    #secondary {
        width: 40%;
        float: right;
    }


    /*****************************
            PAGE PORTFOLIO
    *****************************/

    #gallery li {
        width: 28.333%;
    }

    #gallery li:nth-child(4n){
        clear: left;
    }



    /*****************************
             PAGE ABOUT
    *****************************/

    .profile-photo {
        float: left;
        margin: 0 5% 50% 0;
    }

}

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

    /******************************
              HEADER
     *****************************/
    nav {
        background: none;
        float: right;
        font-size: 1.125em;
        margin-right: 5%;
        text-align: right;
        width: 45%;
    }

    #logo {
        float: left;
        margin-left: 5%;
        text-align: left;
        width: 45%;
    }

    h1 {
        font-size: 2.5em;
    }

    h2 {
        font-size: 0.825em;
        margin-bottom: 20px;
    }

    header {
        border-bottom: 5px solid dodgerblue;
        margin-bottom: 60px;
    }

}