@media screen and (max-width: 480px) {
    
    #header
    {
        padding: 20px 20px;
        padding-top: 30px;
    }
    
    #header-logo
    {
        float: none;
        text-align: center;
    }
    
    #header-navigation
    {
        float: none;
        margin: 0;
        text-align: center;
    }
    
    #header-navigation .header-navigation-item
    {
        float: none;
        margin: 20px 0;
    }
    
    #header-navigation .header-navigation-item .button
    {
        display: block !important;
        margin: 30px 0 !important;
        width: 100% !important;
    }
    
    #header-navigation .header-navigation-separator
    {
        border: none;
        border-bottom: 1px solid #EEE;
        height: 0;
        float: none;
    }   
    
    #masthead
    {
        background: url(mastheads/homepage-mobile.jpg) no-repeat center center;
        background-size: cover;
        color: white;
        padding: 20px;
    }
    
    #masthead.masthead-about
    {
        background: url(mastheads/about-mobile.jpg) no-repeat center center;
        background-size: cover;
    }

    #masthead.masthead-contact
    {
        background: url(mastheads/contact-mobile.jpg) no-repeat center center;
        background-size: cover;
    }

    #masthead h1
    {
        font-size: 28px;
        line-height: 36px;
    }
    
    #masthead h2
    {
        font-size: 18px;
        line-height: 36px;
    }

    #social
    {
        margin: 0;
    }
    
    #social a
    {
        margin: 0 5px;
    }
    
    #social img
    {
        height: 40px;
        width: 40px;
    }

    #social .signup
    {
        margin-top: 20px;
    }
    
    #introduction
    {
        padding: 20px;
    }
    
    #footer
    {
        padding: 20px 20px;
    }
    
    #footer-navigation
    {
        float: none;
        margin: 0;
        text-align: center;
    }
    
    #footer-navigation .footer-navigation-item
    {
        float: none;
        margin: 20px 0;
    }
    
    #footer-legal
    {
        float: none;
        text-align: center;
    }

    #footer-legal a
    {
        margin: 20px 0;
        padding: 0;
        display: block;
    }

    #footer-social
    {
        float: none;
        text-align: center;
    }
    
    .callout
    {
        padding: 0 50px;
    }
    
    .group
    {
        padding: 20px;
    }
    
    .group .team-photo
    {
        margin: 20px 0;
        width: 100%;
    }
    
}

@media only screen and (max-width: 480px) and (-moz-min-device-pixel-ratio: 2),
       only screen and (max-width: 480px) and (-o-min-device-pixel-ratio: 2/1),
       only screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio: 2),
       only screen and (max-width: 480px) and (min-device-pixel-ratio: 2),
       only screen and (max-width: 480px) and (min-resolution: 192dpi) {

       #masthead
       {
           background: url(mastheads/homepage-mobile-2x.jpg) no-repeat center center;
           background-size: cover;
       }

       #masthead.masthead-about
       {
           background: url(mastheads/about-mobile-2x.jpg) no-repeat center center;
           background-size: cover;
       }

       #masthead.masthead-contact
       {
           background: url(mastheads/contact-mobile-2x.jpg) no-repeat center center;
           background-size: cover;
       }

}