/* Very Small devices (tablets, 480px and up) */
@media (min-width: 480px) { 

    .btn-lg { font-size: 1.5em; }


}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    h1 { font-size: 36px; }

    .sm-left { text-align: left; }
    .sm-center { text-align: center; }
    .sm-right { text-align: right; }  
    .sm-hidden { display: none; }
    .sm-block { display: block; }
    .sm-inlineblock { display: inline-block; }

    figure img { width: 50% !important; }        



}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .md-left { text-align: left; }
    .md-center { text-align: center; }
    .md-right { text-align: right; }
    .md-hidden { display: none; }
    .md-block { display: block; }
    .md-inlineblock { display: inline-block; }

    .col-md-15 {
        width: 20%;
        float: left;
    }            

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    
    .lg-left { text-align: left; }
    .lg-center { text-align: center; }
    .lg-right { text-align: right; }
    .lg-hidden { display: none; }
    .lg-block { display: block; }
    .lg-inlineblock { display: inline-block; }

    .col-lg-15 {
        width: 20%;
        float: left;
    }    
}

/* DOM width */
@media (min-width: 1000px) { 

 .pageSection > div { width: 900px; margin: 0 auto; }

}

/* ----------------- */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (min-height: 768px) { 

    .post_content { font-size: 1em; line-height: 1.75em; }

    #pageHeader { height: 7em; }
    #logo { height: 3em; }
    #pageHeader > div { padding: 2em 0; margin-left: 8em; }
    #pageHeader h2 { font-size: 2.75em; }

    #headerBackground { height: 7em; }
    #headerBackground { background-size: 100% 20em; }

    #burger { padding: 1em; }
    #burger > div { width: 3em; height: 3em; }

    #burger { padding: 2em; }
    #wrap { margin-top: 7em; }

}