@media only screen and (max-width:1024px) {
    .container {
        margin:0 auto
    }
}
@media handheld, only screen and (max-width:768px) {
    .col_4 {
        width:48%
    }
    .col_4c {
        width:48%
    }
    .col_2 {
        width:98%
    }
    .col_2c {
        width:98%
    }
    header h1, header h2 {
/*
        text-align:center;
*/
/*
        float:none;
*/
        margin:0
    }
        
    #socials-group {
        text-align:center;
        padding-top:0
    }
    #socials-group a:last-child {
        margin-right:0
    }
    #socials-group img {
        width:20px;
        height:20px
    }
    #introduction p {
        padding:30px 7% 22px;
        font-size:1.1875em;
        line-height:1.3
    }
    nav a {
        font-size:1.125em;
        margin:0 3px;
        line-height:1.5em
    }
}
@media handheld, only screen and (max-width:480px) {
    .col_3 {
        width:98%
    }
    .col_4 {
        width:98%
    }
    .col_5 {
        width:98%
    }
    .col_3c {
        width:98%
    }
    .col_4c {
        width:98%
    }
    .col_5c {
        width:98%
    }
    .col_5x2 {
        width:98%
    }
    
    header h1, header h2 {
/*
        text-align:center
*/
    }
    
    header h1 {
        font-size: 40px;
    }

    section p {
        font-size:1em
    }
    #introduction p {
        padding:20px 2% 15px;
        font-size:1.0625em;
        line-height:1.2
    }
    nav a {
        font-size:1em;
        line-height:1.375em;
        padding-left: 2px;
        padding-right: 2px;
    }
    
    nav {
        padding-top:4px
    }
    #about p, #photos p, #contact p {
        text-align:center
    }
    .col_0, .col_1, .col_2, .col_3, .col_3c, .col_4, .col_4c, .col_5, .col_5c, .col_5x2 {
        margin-bottom:20px
    }
    .head-circle {
        border-radius:32px;
        width:64px;
        height:64px;
        line-height:67px;
        font-size:0.7em
    }
    #about p, #photos p, #contact p, #images-holder {
        padding-right:1%
    }
}
@media handheld, only screen and (max-width:320px) {
    .container {
        width:100%!important;
        max-width:100%!important
    }
    .col_1, .col_2, .col_3, .col_3c {
        width:92%;
        margin-left:0;
        margin-right:0;
        padding-left:4%;
        padding-right:4%
    }
    #about p, #photos p, #contact p, #images-holder {
        padding-right:0;
        padding-left:0
    }
    .col_4, .col_4c, .col_5, .col_5c, .col_5x2 {
        width:100%;
        margin-left:0;
        margin-right:0
    }
}
@media handheld, only screen and (max-width:240px) {
    nav a {
        font-size:.875em;
        font-weight:normal;
        margin:0
    }
}