@media (max-width: 2800px)  
{    
    div#page {
        background-image: url('../img/BGretina.jpg');
    }
}

@media (max-width: 2000px)  
{    
    div#page {
        background-image: url('../img/BGHD.jpg');
    }
}

@media (max-width: 1200px)  
{    
    div#page {
        background-image: url('../img/BG1200.jpg');
    }
}

@media (max-width: 64px)   
{    
    div#page {
        background-image: url('../img/BGmobile.jpg');
    }
}

@media (max-width: 1200px)  
{    
    div.maxWidth {
        max-width: 1000px;
    }
}

@media (max-width: 980px)  
{    
    #newsletter {
        min-height: 100px;
    }
    
    div.maxWidth {
        max-width: 640px;
    }
    
    .seeAllTile  {
        width: 100%;
    }
    
    #mainMovie {
        width: 100%;
        float: none;
        margin: auto;
    }
    
    #youTubeStream {
        width: 100%;
        float: none;
        margin: auto;
        margin-top: 25px;
    }
    
    .streamInner {
        margin: 10px;
        margin-top: 0px;
    }
    
    .centerLogo {
        margin-left: 7%;
        margin-right: 7%;
    }
    
    .archivePost img {
        max-width: 50%;
    }
    
    .archivePost .authorBio {
        min-height: 160px;
    }
    
    
    .author img {
        display: none;
    }
    
    .text .author img {
        display: block !important;
    }
    
    .archivePost p {
        margin-left: 10px;
    }
    
    .coverMask h1 {
        font-size: 15px;
    }
}



@media (max-width: 660px)  
{   
    #topSocial .socialIcons {
        width: 150px;
    }
    
    #bottomSocial .button {
          margin-right: 30px;
        margin-left: 30px;
        margin-bottom: 20px; 
    }
    
    .topJoinButton {
        margin-top: 22px;
    }
    
    .coverMask {
        width: 288px;
    }
    
    .coverMask h1 {
        margin-top: 8%;
    }
    
    div.maxWidth {
        max-width: 320px;
    }
    
    a#logo img {
        max-height: 60px;
        margin-top: 10px;
    }

    #topSocial {
        position: absolute;
        top: 12px;
        right: -20px;
        width: 141px;
    }
    
    .topJoinButton {
        font-size: 12px;
        margin-bottom: 8px;
    }
    
    #topSocial .socialIcons {
        position: absolute;
        width: 200px;
        top: 84px;
        left: -80px;
    }
    
    topJoinButton {
        display: none;
    }
    
    #youTubeStream {
        display: none;
    }
    
    #facebookStream, #twitterStream {
        width: 100%;
        float: none;
    }
    
    #facebookStream {
        margin-bottom: 25px;
    }
    
    .separator {
        display: none;
    }
    
    .centerLogo {
        margin-top: 15px;
    }
    
    #sidebar {
        display: none;
    }
    
    .screan {
        margin-right: 0px;
    }
    
    .authorBio {
        margin-left: 0px;
    }
    
    .join {
        text-align: center;
    }
    
    .join h1 {
        margin-bottom: 10px;
        margin-right: 0px;
    }
    
    .archivePost {
        padding-right: 0px;
    }
    
    .archivePost img{
        max-width: 100%;
        margin-bottom: 20px;
    }
    
    .joinRed {
        margin-right: 0px;
        margin-top: 10px;
    }
    
    .archivePost .authorBio {
        padding-left: 10px;
    }
    
    .text {
        padding: 15px;
    }
    
    /* Menu */
    
    div.mobileMenu {
        display: block;
    }
    
    div.mobileMenu img {
        height: 30px;
        float: right;
        margin-right: 20px;
    }
    
    nav#mainNav {
        width: 100%;
        background: #222222;
        z-index: 110;
        position: absolute;
        left: 0px;
        display: none;
    }
    
    #mainNav li {
        float: none;
        text-align: center;
        border-bottom: 1px solid #606060;
        width: 100%;
    }
    
    #mainNav a {
        padding: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        color: white;
        width: 100%;
    }
    
    #mainNav li:hover > a {
        color: white;
        text-decoration: underline;
        background: gray;
    }

    .current-menu-item a {
        color: white !important;
        text-decoration: underline;
    }
}

