/* ------------------------------------------------------
RESET
@section reset
--------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after, q:before, q:after {
        content: '';
        content: none;
    }

a {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    color: #db4d4d;
    text-decoration: none;
}

    a:hover {
        color: #535353;
    }

    a.action-link, input.action-link {
        border: none;
        background-color: #DB4D4D;
        color: white;
        font-size: 1.25em;
        line-height: 1.3em;
        padding: 0.35em 20px 0.3em;
        cursor: pointer;
        text-decoration: none;
        outline: none;
        -webkit-appearance: none;
        -webkit-border-radius: 0;
    }

        a.action-link:hover, button.action-link:hover, input.action-link:hover {
            background-color: #535353;
        }
/* tables still need cellspacing='0' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

input, select {
    vertical-align: middle;
}


/* ------------------------------------------------------
TYPOGRAPHY
@section typography
--------------------------------------------------------- */
/*
@section Body
*/

body {
    font-family: 'raleway','Gill Sans','Gill Sans MT',Calibri,sans-serif;
    height: 100%;
    width: 100%;
    margin: 0;
    text-align: center;
    background-color: #e6e6e6;
}

/*
@section paragraphs
*/
p, dl, hr, h1, h2, h3, h4, h5, h6, ol, ul, pre, table, address, fieldset {
    margin-bottom: .5em;
}

p, .content li {
    color: #535353;
    font-size: 1em;
    line-height: 1.625em;
}

.content-col p {
    text-align: left;
}

::selection {
    background: #dc6767; /* Safari */
}

::-moz-selection {
    background: #dc6767; /* Firefox */
}

/*
@section Headings
*/
h1, h2, h3, h4, h5, h6 {
    font-weight: 100;
}

#mainContent h2 {
    color: #DB4D4D;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 100;
}
/*
@section Lists
*/
ol {
    list-style: decimal;
}

ul {
    list-style: disc;
}

li {
    margin-left: 30px;
}

/* ------------------------------------------------------
STRUCTURE
@section common
--------------------------------------------------------- */
.hidden {
    display: none;
}

.clear {
    clear: both;
}

.clearLeft {
    clear: left;
}

.clearRight {
    clear: right;
}

/* ----------
@Build Information message
---------- */
#buildInfo {
    position: fixed;
    top: -30px;
    left: 50%;
    width: 96px;
    height: 35px;
    margin: 0 0 0 -48px;
    font-size: 11px;
    line-height: 38px;
    text-align: center;
    text-transform: uppercase;
    cursor: default;
    background: #00acec;
    color: #f0f0f0;
    z-index: 9999;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
}

    #buildInfo:hover {
        top: -5px;
    }

    #buildInfo small {
        font-size: 10px;
    }

iframe #buildInfo {
    display: none;
}

/* ----------
@section - main structure & page landing backgrounds
---------- */

#mainWrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
    background-color: transparent;
    text-align: center;
}

#main {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    background-color: transparent;
}

header {
    width: 100%;
    height: 100px;
    background-color: transparent;
    z-index: 9998;
    position: relative;
}

#mainContent {
    width: 100%;
    background-color: transparent;
    float: left;
}

footer {
    float: left;
    width: 100%;
    min-height: 80px;
    background-color: #d9d9d9;
    margin-top: 50px;
}


/* ----------
@section carousel
---------- */

#mainWrapper #carousel {
    width: 100%;
    z-index: 0;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
}

    #mainWrapper #carousel ul li {
        float: left;
        width: 100%;
        margin: 0;
        padding: 0;
        list-style-type: none;
        position: relative;
        -webkit-background-size: contain;
        -moz-background-size: contain;
        -o-background-size: contain;
        background-size: contain;
    }

        #mainWrapper #carousel ul li img {
            border: none;
            width: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }

        #mainWrapper #carousel ul li .dead-center {
            text-align: center;
            position: absolute;
            left: 0px;
            top: 50%;
            width: 100%;
            height: 1px;
            overflow: visible;
            visibility: visible;
            display: block;
        }

            #mainWrapper #carousel ul li .dead-center h2 {
                color: #fff;
                font-size: 40px;
                font-weight: 100;
                text-align: center;
            }

            #mainWrapper #carousel ul li .dead-center.caption-top {
                top: 30%;
            }

            #mainWrapper #carousel ul li .dead-center.caption-middle {
                top: 50%;
            }

            #mainWrapper #carousel ul li .dead-center.caption-bottom {
                top: 70%;
            }

@media only screen and (max-width: 640px) {
    #mainWrapper #carousel ul li div.dead-center {
        display: none;
    }
}

@media only screen and (min-width: 901px) {
    #mainWrapper #carousel ul li {
        height: 425px;
    }
}

@media only screen and (min-width: 1681px) {
    header {
        margin-bottom: 355px;
    }

    #mainWrapper #carousel ul li {
        width: 1920px;
        height: 425px;
    }
}

@media only screen and (max-width: 1680px) and (min-width: 1601px) {
    header {
        margin-bottom: 302px;
    }

    #mainWrapper #carousel ul li {
        width: 1680px;
        height: 372px;
    }
}

@media only screen and (max-width: 1600px) and (min-width: 1441px) {
    header {
        margin-bottom: 284px;
    }

    #mainWrapper #carousel ul li {
        width: 1600px;
        height: 354px;
    }
}

@media only screen and (max-width: 1440px) and (min-width: 1281px) {
    header {
        margin-bottom: 249px;
    }

    #mainWrapper #carousel ul li {
        width: 1440px;
        height: 319px;
    }
}

@media only screen and (max-width: 1280px) and (min-width: 1025px) {
    header {
        margin-bottom: 213px;
    }

    #mainWrapper #carousel ul li {
        width: 1280px;
        height: 283px;
    }
}

@media only screen and (max-width: 1024px) and (min-width: 801px) {
    header {
        margin-bottom: 157px;
    }

    #mainWrapper #carousel ul li {
        width: 1024px;
        height: 227px;
    }
}

@media only screen and (max-width: 800px) and (min-width: 551px) {
    header {
        margin-bottom: 107px;
    }

    #mainWrapper #carousel ul li {
        width: 800px;
        height: 177px;
    }
}

@media only screen and (max-width: 550px) {
    header {
        margin-bottom: 28px;
    }

    #mainWrapper #carousel ul li {
        width: 550px;
        height: 122px;
    }
}
/* ----------
@section logo
---------- */

.logo {
    float: left;
    margin: 20px 0 0 30px;
}

    .logo a {
        float: left;
        text-decoration: none;
        line-height: 0.8;
        border-bottom: solid 1px #fff;
        padding-bottom: 5px!important;
    }

        .logo a span {
            clear: left;
            font-size: 15px;
            font-weight: 400;
        }

        .logo a h1, .logo a h1 span.hightlight {
            padding: 0;
            margin: 0;
            font-weight: 700;
            font-size: 23px;
            color: #fff;
            text-transform: uppercase;
        }

            .logo a h1 span.hightlight {
                color: #db4d4d;
            }



/* ----------
@section header - nav
---------- */
@media only screen and (min-width: 641px) {
    header nav {
        width: 484px;
        float: right;
        margin: 20px 12px 0 0;
    }

        header nav ul {
            list-style: none;
            margin: 0;
            padding: 0;
            float: right;
        }

        header nav li {
            float: left;
            text-align: left;
            margin: 0;
            padding: 0 18px;
            position: relative;
        }

            header nav li a {
                color: #fff;
                text-decoration: none;
                font-size: 14px;
                text-transform: uppercase;
                padding-bottom: 8px;
                float: left;
            }

                header nav li a.selected, header nav li a:hover {
                    border-bottom: solid 1px #db4d4d;
                    color: #fff;
                }

                header nav li a.selected {
                    color: #db4d4d;
                }
}

@media only screen and (max-width: 640px) {
    header nav {
        width: 36px;
        height: 17px;
        background-image: url('/Custom/DefaultSite/Images/nav-collapse.gif');
        background-repeat: no-repeat;
        background-color: transparent;
        background-position: 0 0;
        float: right;
        margin: 20px 12px 0 0;
        position: relative;
        cursor: pointer;
    }

        header nav ul {
            list-style: none outside none;
            position: absolute;
            right: 0;
            top: 23px;
            padding: 20px;
            background-color: rgba(255, 255, 255, 0.7);
            width: 200px;
            display: none;
        }

        header nav.active ul {
            display: block;
        }

        header nav li {
            width: 80px;
            float: left;
            text-align: left;
            margin: 0;
        }

            header nav li a {
                color: #535353;
                display: block;
                font-size: 14px;
                padding-bottom: 8px;
                float: left;
            }

                header nav li a.selected, header nav li a:hover {
                    color: #db4d4d;
                    border-bottom: none;
                }
}



/* ----------
@section structure 
---------- */
#mainContent .main-one-col {
    float: left;
    text-align: left;
    width: 100%;
}

#mainContent .main-three-col {
    float: left;
    margin-top: 26px;
}

    #mainContent .main-three-col div {
        float: left;
        width: 33%;
        min-width: 300px;
    }

#mainContent .main-two-third-col {
    float: left;
    width: 667px;
}

#mainContent .main-one-third-col {
    float: left;
    width: 307px;
    margin-left: 26px;
    text-align: left;
}

    #mainContent .main-two-col h1, #mainContent .main-one-third-col h1, #mainContent .main-two-third-col h1, #mainContent .main-one-col h1 {
        border-top: solid 1px #db4d4d;
        text-align: left;
        font-size: 24px;
        color: #535353;
        padding: 10px 0 0;
        margin: 20px auto 20px;
        text-transform: uppercase;
        float: left;
        width: 100%;
    }

/* ----------
@section home page 
---------- */

#mainContent .main-three-col div a {
    text-decoration: none;
    text-align: center;
    float: left;
    width: 100%;
    display: block;
}

    #mainContent .main-three-col div a:hover > span {
        background-position-x: right;
        -ms-background-position-x: right;
    }

    #mainContent .main-three-col div a h2 {
        text-align: center;
        color: #db4d4d;
        padding: 0;
        margin: 10px auto 15px;
        text-transform: uppercase;
    }

    #mainContent .main-three-col div a span {
        display: block;
        margin: 0 auto;
        height: 41px;
    }

        #mainContent .main-three-col div a span.icon-about {
            width: 43px;
            background: transparent url('../Images/icon-about.gif') no-repeat top left;
        }

        #mainContent .main-three-col div a span.icon-accomodation {
            width: 35px;
            background: transparent url('../Images/icon-accomodation.gif') no-repeat top left;
        }

        #mainContent .main-three-col div a span.icon-contact {
            width: 59px;
            background: transparent url('../Images/icon-contact.gif') no-repeat top left;
        }

#mainContent .main-three-col div p {
    padding: 0 40px;
    clear: both;
    font-size: 0.875em;
    line-height: 1.85714286em;
}


/* ----------
@section accomodation page 
---------- */
#mainContent .main-two-col {
    position: relative;
}

    #mainContent .main-two-col .side-menu {
        width: 31%;
        float: left;
    }

        #mainContent .main-two-col .side-menu ul {
            width: 100%;
            float: left;
            list-style-type: none;
        }

            #mainContent .main-two-col .side-menu ul li {
                width: 100%;
                float: left;
                margin: 0 0 13px;
                padding: 0;
            }

                #mainContent .main-two-col .side-menu ul li a {
                    min-width: 300px;
                    width: 100%;
                    height: 38px;
                    float: left;
                    background-color: #d9d9d9;
                    text-align: center;
                    color: #535353;
                    text-decoration: none;
                    font-size: 20px;
                    font-weight: 100;
                    line-height: 1.9;
                    text-transform: uppercase;
                }

                    #mainContent .main-two-col .side-menu ul li a:hover, #mainContent .main-two-col .side-menu ul li a.selected {
                        background-color: #db4d4d;
                        color: #fff;
                    }

        #mainContent .main-two-col .side-menu .reference {
            font-size: 12px;
            font-style: italic;
            padding: 0 10px;
            margin-top: 15px;
        }

    #mainContent .main-two-col .content-col {
        margin-left: 30px;
        float: left;
        width: 66%;
        text-align: left;
    }

        #mainContent .main-two-col .content-col .content-item h3 {
            color: #535353;
            font-size: 14px;
            font-weight: 400;
            float: left;
            margin-top: 0px;
        }

        #mainContent .main-two-col .content-col .amenities {
            margin-bottom: 10px;
            float: left;
            width: 100%;
            font-weight: 400;
            font-size: 14px;
        }

            #mainContent .main-two-col .content-col .amenities .amenities-wrapper {
                margin-top: 5px;
            }

            #mainContent .main-two-col .content-col .amenities div.amenity-item {
                color: #535353;
                vertical-align: middle;
                text-transform: uppercase;
                padding-right: 5px;
                text-align: left;
                float: left;
                margin-right: 20px;
            }

                #mainContent .main-two-col .content-col .amenities div.amenity-item .amenity-text {
                    line-height: 1.7;
                }

            #mainContent .main-two-col .content-col .amenities div span.icon-amenity {
                text-indent: -500px;
                overflow: hidden;
                display: block;
                float: left;
                margin-right: 4px;
            }

            #mainContent .main-two-col .content-col .amenities div span.icon-shower {
                background: transparent url('../Images/icon-shower.png') no-repeat top left;
                width: 20px;
                height: 20px;
            }

            #mainContent .main-two-col .content-col .amenities div span.icon-bed {
                background: transparent url('../Images/icon-bed.png') no-repeat top left;
                width: 29px;
                height: 20px;
            }

            #mainContent .main-two-col .content-col .amenities div span.icon-parking {
                background: transparent url('../Images/icon-parking.png') no-repeat top left;
                width: 24px;
                height: 20px;
            }

            #mainContent .main-two-col .content-col .amenities div span.icon-tv {
                background: transparent url('../Images/icon-tv.png') no-repeat top left;
                width: 19px;
                height: 20px;
            }

            #mainContent .main-two-col .content-col .amenities div span.icon-sky {
                background: transparent url('../Images/icon-sky.png') no-repeat top left;
                width: 19px;
                height: 20px;
            }

        #mainContent .main-two-col .content-col .content {
            float: left;
            width: 100%;
            padding: 0px;
            margin: 0px;
        }

            #mainContent .main-two-col .content-col .content p {
                width: 100%;
            }

@media only screen and (min-width: 640px) {
    #mainContent .main-two-col a.action-link {
        position: absolute;
        top: 87px;
        right: 0;
    }
}

@media only screen and (max-width: 999px) {
    #mainContent .main-two-col .content-col {
        width: 90%;
    }

    #mainContent .main-two-col .side-menu .reference {
        display: none;
    }
}

@media only screen and (max-width: 639px) {
    #mainContent .main-two-col a.action-link {
        position: inherit;
        margin: 0 auto;
    }

    #mainContent .main-two-col .content-col {
        margin-bottom: 20px;
    }
}


/* ----------
@section footer
---------- */
@media only screen and (min-width: 1000px) {
    footer #footerWrapper {
        width: 1000px;
        margin: 0 auto;
    }
}

footer ul {
    list-style-type: none;
    margin-top: 34px;
    float: left;
}

    footer ul li {
        float: left;
        padding: 0 9px 0;
        margin: 0;
        border-left: solid 1px #535353;
        line-height: 1;
    }

        footer ul li:first-child {
            padding-left: 0;
        }

        footer ul li:first-child {
            border-left: none;
        }


footer a {
    color: #db4d4d;
    font-size: 14px;
    text-decoration: none;
    margin: -1px 0 0 0;
    float: left;
}

    footer a:hover {
        color: #535353;
    }

@media only screen and (max-width: 999px) {
    footer #footerWrapper {
        width: 100%;
        text-align: center;
    }

        footer #footerWrapper nav {
            width: 100%;
            margin: 0 auto;
        }
}

/* ----------
@section contact
---------- */
/* custom dropdown */
.dropdown-wrapper {
    background-position: 96%;
    background-image: url('/Custom/DefaultSite/Images/dropdown-arrow.gif');
    background-repeat: no-repeat;
    background-color: #d9d9d9;
    text-align: left;
    line-height: 1.625em;
    float: left;
    height: 3.25em;
    padding: 0 10px 0 0;
    width: 210px;
    overflow: hidden;
}

    .dropdown-wrapper select {
        color: #535353;
        background-color: transparent;
        width: 238px;
        outline: none;
        border: none;
        height: 3.25em;
        background: transparent;
        -webkit-appearance: none;
        font-size: 1em;
        padding-left: 5px;
    }



        .dropdown-wrapper select option {
            background-color: #fff;
        }


/* date picker*/
.ui-datepicker {
    border: solid 1px #999;
    background-color: #f0efed;
    width: 242px;
    display: none;
}

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        background-color: #ccd0dc;
        padding: 6px 10px;
        float: left;
        width: 222px;
        margin-bottom: 5px;
    }

        .ui-datepicker .ui-datepicker-header .ui-datepicker-next, .ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
            position: absolute;
            cursor: pointer;
            width: 22px;
            height: 23px;
            text-indent: -200px;
            overflow: hidden;
            top: 4px;
        }

        .ui-datepicker .ui-datepicker-header .ui-state-disabled {
            display: none;
        }

        .ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
            left: 10px;
            background: transparent url('../images/arrow-left.png') top left no-repeat;
        }

            .ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover {
                background-image: url('../images/arrow-left-hover.png');
            }

        .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
            right: 10px;
            background: transparent url('../images/arrow-right.png') top left no-repeat;
        }

            .ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover {
                background-image: url('../images/arrow-right-hover.png');
            }



        .ui-datepicker .ui-datepicker-header select.ui-datepicker-month, .ui-datepicker .ui-datepicker-header select.ui-datepicker-year {
            font-size: 12px;
            width: 80px;
            outline: none;
        }

        .ui-datepicker .ui-datepicker-header select.ui-datepicker-month {
            float: left;
            margin-left: 28px;
        }

        .ui-datepicker .ui-datepicker-header select.ui-datepicker-year {
            float: right;
            margin-right: 28px;
        }

    .ui-datepicker table.ui-datepicker-calendar {
        margin: 10px;
        clear: both;
    }

        .ui-datepicker table.ui-datepicker-calendar th {
            font-size: 12px;
            width: 29px;
            font-weight: normal;
        }

        .ui-datepicker table.ui-datepicker-calendar td {
            background-color: #a6c1dc;
            border: solid 1px #f0efed;
            font-size: 14px;
            padding: 3px;
        }

            .ui-datepicker table.ui-datepicker-calendar td a {
                color: #fff;
            }

            .ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-other-month {
                background-color: #f0efed;
            }

            .ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-other-month {
                background-color: #cfdbe7;
            }

            .ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-today {
                background-color: #db4d4d;
            }

            .ui-datepicker table.ui-datepicker-calendar td.ui-datepicker-unselectable {
                background-color: #f0efed;
                color: #535353;
            }

    .ui-datepicker .ui-datepicker-buttonpane button {
        color: #fff;
        border: none;
        background-color: #DB4D4D;
        text-transform: uppercase;
        font-size: 12px;
    }

        .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close {
            float: right;
            margin: 0 10px 10px 0;
        }

            .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close:hover {
                background-color: #535353;
            }

        .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
            display: none;
        }

#mainContent fieldset .field-wrapper .textbox-date {
    width: 140px;
    background-image: url('/custom/defaultsite/images/icon-calendar.png');
    background-position: 131px 17px;
    background-repeat: no-repeat;
}

/* forms default*/

#mainContent fieldset .field-wrapper {
    width: 100%;
    float: left;
    margin-bottom: 10px;
}

    #mainContent fieldset .field-wrapper label {
        width: 167px;
        float: left;
        text-align: right;
        margin-right: 10px;
        color: #535353;
        line-height: 3.3;
    }

        #mainContent fieldset .field-wrapper label span.required {
            color: #db4d4d;
        }

        #mainContent fieldset .field-wrapper label.label-long {
            line-height: 1.7;
        }


    #mainContent fieldset .field-wrapper input {
        height: 3.25em;
        width: 65%;
        font-size: 1em;
        border: none;
        padding: 0 9px;
        background-color: #D9D9D9;
        color: #818181;
        float: left;
        outline: none;
    }

#mainContent fieldset textarea {
    float: left;
    width: 65%;
    border: none;
    margin: 0;
    padding: 9px;
    font-size: 1em;
    line-height: 1.625em;
    height: 13em;
    background-color: #D9D9D9;
    color: #818181;
    outline: none;
    resize: none;
}

    #mainContent fieldset textarea.error, #mainContent fieldset input.error {
        border: solid 1px #DB4D4D;
    }

    #mainContent fieldset textarea:focus, #mainContent fieldset input:focus {
        background-color: #ffffff;
        color: #535353;
    }

#mainContent .btn-submit {
    cursor: pointer;
    float: left;
    margin-top: 15px;
    margin-left: 177px;
}

#mainContent fieldset span.form-error {
    float: left;
    margin-top: 0;
    margin-left: 177px;
    font-size: 14px;
    text-align: left;
    color: #db4d4d;
    width: 100%;
    line-height: 1.6;
    margin-top: 4px;
}

::-webkit-input-placeholder {
    color: #818181;
}

:-moz-placeholder {
    color: #818181;
}

.screenReader {
    position: absolute;
    left: -9999px;
}

a[href^=tel] {
    color: #db4d4d;
    text-decoration: none;
}

p.contact-info {
    font-size: 16px;
}

@media only screen and (max-width: 998px) {

    #mainContent fieldset ol input, #mainContent fieldset textarea, #mainContent fieldset .btn-submit {
    }

    #mainContent fieldset .author {
        margin-bottom: 15px;
    }

    #mainContent .main-two-third-col {
        width: 100%;
    }

    #mainContent .main-one-third-col {
        margin-left: 0 !important;
        width: 100%;
    }

        #mainContent .main-one-third-col p {
            padding: 0 10px;
        }
}

@media only screen and (max-width: 557px) {
    #mainContent fieldset .field-wrapper textarea, #mainContent fieldset .field-wrapper input, #mainContent fieldset .field-wrapper label {
        width: 100%;
    }

    #mainContent fieldset .field-wrapper label {
        line-height: 1.2;
        text-align: left;
    }

    #mainContent .buttons .btn-submit, #mainContent fieldset span.form-error {
        margin-left: 0;
    }
}
/* ----------
@section sitemap
---------- */

ul#siteMap, ul#siteMap ul {
    list-style-type: none;
}

    ul#siteMap li {
        font-size: 14px;
    }


/* ----------
@section facebook like, twitter share
---------- */
.fb-like {
    border: none;
    width: 47px;
    height: 24px;
    float: right;
    margin-top: 29px;
    overflow: hidden;
}

.twitter-share-button {
    float: right;
    margin-top: 31px;
    margin-right: 0;
    width: 98px !important;
}

/* ----------
@section availability alert
---------- */

#availabilityAlert {
    background-color: #535353;
    color: #ccc;
    overflow: hidden;
    z-index: 999;
    position: relative;
    display: none;
}

    #availabilityAlert h3 {
        font-size: 1.125em;
        line-height: 1.44444444em;
        text-transform: uppercase;
        color: white;
        font-weight: 100 !important;
        text-align: right;
    }

    #availabilityAlert .alert-container {
        max-width: 960px;
        width: 96%;
        padding: 0 2%;
        margin: 0 auto;
    }

        #availabilityAlert .alert-container .alert-header {
            padding: 0.8125em 0;
            width: 14%;
            margin: 0 1%;
            float: left;
        }

        #availabilityAlert .alert-container .alert-content {
            width: 64%;
            padding: 0.92857143em 0;
            margin: 0 2%;
            float: left;
        }

            #availabilityAlert .alert-container .alert-content p {
                color: #ccc;
                text-align: left;
                font-size: 15px;
                line-height: 1.7;
                margin-top: -2px;
            }

            #availabilityAlert .alert-container .alert-content a:hover {
                color: #ffffff;
                border-bottom: 1px solid #db4d4d;
            }

        #availabilityAlert .alert-container .alert-footer {
            font-size: 0.875em;
            line-height: 1.85714286em;
            padding: 0.92857143em 0;
            width: 14%;
            margin: 0 1%;
            float: left;
        }

            #availabilityAlert .alert-container .alert-footer a {
                color: #ccc;
                background: url('/custom/defaultSite/images/cookie-tick.gif') no-repeat left top;
                background-position: 0 2px;
                padding-left: 30px;
                font-size: 15px;
                line-height: 1;
            }

                #availabilityAlert .alert-container .alert-footer a:hover {
                    color: #db4d4d;
                    background-position: 0 -16px;
                }


@media only screen and (max-width: 745px) {
    #availabilityAlert .alert-container .alert-header,
    #availabilityAlert .alert-container .alert-content,
    #availabilityAlert .alert-container .alert-footer {
        width: 100%;
        margin: 0 10px;
        text-align: left;
        padding: 0;
    }

    #availabilityAlert h3 {
        text-align: left;
    }

    #availabilityAlert .alert-container .alert-footer {
        width: 100%;
        padding-bottom: 10px;
    }
}
