
/* Smaller than 1024, Landscape iPads/Tablets */
@media screen and (max-width: 1024px) {



}


/* Smaller than 768, Portrait iPads/Tablets, Landscape Smartphones */
@media screen and (max-width: 768px) {

    /* General Layout */
    div#header-wrap,
    div#inner-wrap,
    div#header
    {
        height: auto;
        width: 100%;
    }

    /* Header & Nav */
    div#header-wrap
    {
        background: none;
    }

    div#logo
    {
        margin: 10px 0px;
        padding: 20px 10px 0px 10px;
        height: auto;
        width: 94%;
    }

    div#header-contact
    {
        width: 94%;
        position: static;
        text-align: left;
        margin: 10px 0px;
        padding: 0px 10px 0px 10px;
    }

    div#header-contact h2
    {
        color: #0B4B7B;
    }

    #navigation li a:link, #navigation li a:visited
    {
        padding: 9px 10px;
    }

    /* Page */

    #page p,
    #page ul
    {
        text-align: left;
    }

    #page span.link-container
    {
        width: 340px;
        height: auto;
        margin: 0px auto;
    }

    #page span.link-container h2.heading-overlay
    {
        width: inherit;
        margin: 0px auto;
        padding-left: 0;
        padding-right: 0;
    }

    #page div.threecol p
    {
        text-align: center;
    }

    #page div.threecol ul
    {
        text-align: center;
    }

    #page div.threecol img
    {
        display: block;
        margin: 0px auto;
    }

    div.threecol
    {
        float: none;
        width: 100%;
        text-align: center;
    }

    /* Footer */

    div#footer
    {
        width: 100%;
        padding: 0px;
    }

    div#footer div.threecol
    {
        text-align: center;
        padding: 0px;
        padding-top: 20px;
    }

    div#footer div.threecol img
    {
        margin: 10px auto;
        display: block;
        width: auto;
        height: auto;
    }

    /* Contact Page */

    #booking-form fieldset
    {
        padding: 25px 10px;
        margin-right: 0px;
        margin-left: 0px;
        width: auto;
    }

    #booking-form label
    {
        float: none;
        display: block;
        width: auto;
        text-align: left;
        margin: 5px 5px 0px 0px;
    }

    #booking-form input,
    #booking-form textarea
    {
        width: 80%;
        margin-bottom: 5px;
    }

    #booking-form  input[type="submit"]
    {
        clear: left;
        width: auto;
        margin-left: 50%;
        background: #0B4B7B;
        color: white;
        border: 0;
        padding: 10px 25px;
    }

    h2#center
    {
        text-align: center;
    }

    div#directions
    {
        float: none;
        width: auto;
        margin: 0px auto;
    }

    div#directions p
    {
        text-align: center;
    }

    div#directions img
    {
        margin: 10px auto;
        display: block;
    }

    div#google-map
    {
        width: 90%;
    }

    div#google-map iframe
    {
        width: 100%;
    }

}


/* Smaller than 480, Landscape Smartphones */
@media screen and (max-width: 480px) {

    /* General Layout */
    img
    {
        width: 100%;
        height: auto;
    }

    /* Header & Nav */
    div#logo h4
    {
        display: none;
    }

    div#logo strong
    {
        display: block;
    }

    div#logo h1 span
    {
        display: none;
    }

    #navigation
    {
        height: auto;
    }

    #navigation li
    {
        float: none;
        border-bottom: 1px dotted #A2C4E3;
    }

    /* Page */
    div#page
    {
        padding: 10px;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
    }

    div#page p
    {
        margin: 15px 0px;
    }

    div#page h2
    {
        padding-left: 0px;
    }

    div#page h4
    {
        margin-right: 0px;
    }

    div#page img
    {
        display: block;
        float: none;
        margin: 0;
    }

    #page span.link-container
    {
        width: 100%;
    }

    div#thumbnails
    {
        float: none;
    }

    /* Footer */
    div#footer div.threecol img
    {
        margin: 10px auto;
        display: block;
        width: 95%;
        height: auto;
    }

}


/* Smaller than 320, Portrait Smartphones */
@media screen and (max-width: 320px) {


}
