/* # Media Queries # */
@media only screen and (max-width: 900px) {
    *, *:before, *:after {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    div#reservations {
        overflow-x: scroll;
    }

    body {
        min-width: 320px;
    }

    /* Header */
    header {
        margin: 15px 0;
    }

    header p.logo {
        margin-left: 50px;
    }

    header p.logo a {
        width: 250px;
        height: 49px;
        background-position: left bottom;
    }

    a#menulink {
        text-indent: -9999px;
        display: inline-block;
        width: 32px;
        height: 26px;
        position: absolute;
        top: 12px;
        left: 0;
        background: url(../images/nav-icon.png) no-repeat center;
    }

    header .info {
        width: auto;
        padding: 9px 0 0 0;
    }

    header .info .right p.spacer {
        margin: 0;
    }

    header .info p.tripadvisor,
    header .info .left {
        display: none;
    }

    nav {
        width: 100%;
        display: none;
    }

    nav ul.nav {
        text-align: left;
    }

    nav ul.nav li {
        font-size: 1.5em;
        width: 100%;
        margin: 5px 0;
    }

    nav ul.nav li a {
        padding: 0;
        border-right: none;
    }

    nav .sub {
        display: block;
        padding: 0;
        position: static;
    }

    nav ul.subnav {
        padding: 0 10px;
        background: none;
    }

    div.video {
        display: none;
    }

    div.header,
    nav ul.nav,
    div.page,
    div.hero,
    article,
    div.home,
    #slideshow,
    div.contentright,
    div.panels,
    div.images,
    footer {
        width: 100%;
    }

    div.contentright {
        margin-bottom: 15px;
    }

    div.gallery {
        width: 100%;
    }

    div.home div.introduction .text {
        width: 52.8888%;
        height: 85.4497%;
        top: 7.4074%;
        right: 2%;
    }

    div.home .homenews .newsText.left {
        width: 219px;
    }

    div.content {
        width: 100%;
        padding: 25px 3.33333%;
    }

    div.column-left {
        width: 68.4523%;
    }

    div.column-right {
        width: 29.1666%;
    }

    div.column-right img {
        max-width: 100%;
        height: auto;
    }

    /* Gallery */
    div.gallery p.thumb,
    .contentright div.gallery p.thumb {
        width: 23%;
        margin: 1%;
    }

    div.gallery p.thumb img {
        margin: 0;
        width: 100%;
        height: auto;
    }

    /* Contact */
    div.content div.contactleft {
        width: 50%;
    }

    div.content div.contactright {
        width: 50% !important;
    }

    div.content div.form {
        width: 100%;
    }

    /* Footer */
    footer .info,
    footer .links,
    footer .copy {
        width: 100%;
        float: left;
    }

    footer .contact {
        margin-bottom: 10px;
    }

    footer .links li,
    footer .copy li {
        padding: 0 15px 0 0;
        background: none;
    }

    /* Forms */
    div.content div.form div.status,
    div.content div.form div.status ul,
    div.content div.form p.field input,
    div.content div.form p.field textarea,
    div.content div.form p.field select,
    div.content div.form p.submit {
        width: 100%;
    }
}

@media only screen and (max-width: 768px) {
    header {
        margin: 10px 0;
        padding: 5px 0;
    }

    header p.logo,
    header p.logo a,
    .header-extras,
    div.header ul.header-buttons,
    .header-buttons li {
        float: none;
    }

    .header-buttons,
    .header-links {
        text-align: center;
    }

    header p.logo {
        margin-left: 0;
        margin-bottom: 15px;
    }

    header p.logo a {
        margin: 0 auto;
    }

    .header-buttons li {
        display: inline-block;
    }

    div.panels .panel1,
    div.panels .panel2 {
        width: 49%;
    }

    div.panels .panel1,
    div.panels .panel3 {
        margin: 0;
    }

    div.panels .panel3 {
        width: 100%;
    }
}

@media only screen and (max-width: 650px) {
    div.home div.introduction .text {
        display: none;
    }

    div.column-left,
    div.column-right {
        width: 100%;
    }

    div.column-left {
        margin-bottom: 15px;
    }

    div.gallery p.thumb,
    .contentright div.gallery p.thumb {
        width: 31.2%;
        margin: 1.06%;
    }

    footer .contact {
        width: 100%;
        float: none;
    }

    footer p {
        text-align: center;
    }

    footer .logos {
        width: auto;
        margin: 0 auto 20px auto;
        padding: 0;
        float: none;
        position: relative;
    }

    footer .logos a.bb,
    footer .logos a.hbnz {
        float: none;
        display: inline-block;
    }

    footer .info,
    footer .links,
    footer .copy {
        float: none;
    }

    footer .links,
    footer .copy {
        margin: 0 auto;
    }

    footer .links {
        width: 280px;
    }

    footer .copy {
        width: 200px;
    }
}

@media only screen and (max-width: 550px) {

    div.content div.contactleft,
    div.content div.contactright {
        width: 100% !important;
    }

    div.content div.contactright {
        margin-bottom: 15px;
    }
}

@media only screen and (max-width: 500px) {
    div.panels .panel {
        width: 100%;
        margin: 0;
        padding: 5px 0 15px 0;
        border-top: 1px solid #79665a;
    }

    div.dynamic .dynamicinner img {
        width: 50%;
        height: auto;
        padding-right: 0;
        float: none;
    }
}

@media only screen and (max-width: 470px) {
    div.header {
        width: 310px;
        margin: 0 auto;
        float: none;
    }

    header p.logo a {
        margin-left: 42px;
    }

    .header-button {
        background: none;
    }

    .header-button::before,
    .header-button::after {
        display: none;
    }

    .header-links li:last-child {
        padding-left: 0;
    }

    header .info {
        width: 143px;
        margin: 0 auto;
        float: none;
        clear: both;
    }

    div.gallery p.thumb,
    .contentright div.gallery p.thumb {
        width: 48%;
        margin: 1%;
    }
}