/* ####################################################
M E D I A  Q U E R I E S
#################################################### */
/* ::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints */
.navBG {
    background-color: #873636;
}

.navbar-light .navbar-toggler {
    color: rgba(0, 0, 0, 0.5);
    border: 2px solid #106a94;
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 105, 150, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.bg-light {
    background-color: #e8f8f7 !important;
}

.navbar-light .navbar-nav .nav-link {
    color: #006996 !important;
    font-family: 'Domine', serif;
    font-size: 18px;
}

.navbar-expand-md .navbar-nav {
    -ms-flex-direction: row;
    flex-direction: row;
}

#back-to-top {
    position: fixed;
    bottom: 28px;
    right: 20px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, .5) url(../img/up-arrow.png) no-repeat center 100%;
    color: #444;
    cursor: pointer;
    border: 1px solid #D8D8D8;
    border-radius: 2px;
    text-decoration: none;
    transition: all 0.2s ease-out;
    opacity: 0;
}

#back-to-top.show {
    opacity: 0.8;
}

/* Extra small devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap because it is "mobile first" */
@media (max-width:575.98px) {
    .hero {
        height: 800px;
        background-image: url('../img/hero_img.jpg');
        background-position: center bottom;
        background-size: auto;
        background-attachment: scroll;
        background-repeat: no-repeat;
    }

    .gallery {
        background-color: #E8F8F7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .discover {
        background-color: #44B0E7;
        padding-top: 20px;
    }

    .cookie {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cover {
        background-color: #E8F8F7;
        background-image: url('../img/beach_scene_01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: scroll;
        background-size: auto;
    }

    .booking {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .contact {
        background-color: #006996;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .copyright {
        background-color: #003f5d;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .facilities {
        background-color: #e9f8f7;
        padding-top: 20px;
    }

    .heroBox {
        background-color: rgba(255, 255, 255, 0.78);
        margin-top: 20px;
        padding: 20px;
        box-shadow: 2px 2px 19px 0px #ffffff;
    }

    .heroRow {
        padding-top: 200px;
    }

    .h1Hero {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 3.2em;
    }

    .strap {
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        color: #106a94;
        font-size: 1em;
    }

    .h3Gallery {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 2em;
        padding-bottom: 19px;
    }

    .h3Cover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2em;
        padding-bottom: 35px;
        padding-top: 45px;
        font-weight: 700;
        letter-spacing: 2px;
        text-shadow: 3px 2px 5px #545454;
    }

    .h2Discover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2em;
    }

    .h5booking {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h4Facilities {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #106a94;
        font-size: 2em;
    }

    .btn-light {
        color: #ffffff;
        background-color: #006996;
        border-color: #004968;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        border-radius: 8px;
    }

    .btn-light:hover {
        color: #ffffff;
        background-color: #004968;
        border-color: #004968;
    }

    h3 {
        font-size: 1.75rem;
        font-family: 'Handlee', cursive;
        color: #ffffff;
        text-align: center;
        font-weight: 400;
    }

    .disText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: normal;
    }

    .bookingText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: pre-wrap;
    }

    .copyrightText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        padding: 1.25rem;
        background-color: #e9f8f7;
    }

    .card-title {
        margin-bottom: 0.75rem;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        color: #006996;
        text-align: center;
    }

    .h2Facilities {
    }

    .facText {
        font-family: 'Domine', serif;
        font-size: 1.1em;
        color: #006996;
        text-align: center;
    }

    dd {
        margin-bottom: .5rem;
        margin-left: 0;
        color: #006996;
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        font-size: 1.2em;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2em;
        text-align: center;
    }

    .h6Contact {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.2em;
        text-align: center;
    }

    .contactColHead {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.4em;
        text-align: center;
        font-weight: 400;
    }

    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid #ffffff;
    }

    address {
        margin-bottom: 2rem;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: center;
        font-size: 1.2em;
        font-weight: 400;
    }

    footerText {
        margin-bottom: 1rem;
        font-style: normal;
        line-height: inherit;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
    }

    .footerText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 0.9em;
        font-weight: 400;
    }

    .contactDetailsText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.2em;
        text-align: center;
        font-weight: 400;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* unvisited link */
    a:link.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* visited link */
    a:visited.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* mouse over link */
    a:hover.contactDetailsText {
        color: #e6e6e6;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-decoration: underline;
    }

    /* selected link */
    a:active.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* unvisited link */
    a:link.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* visited link */
    a:visited.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* mouse over link */
    a:hover.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-decoration: none;
    }

    /* selected link */
    a:active.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width:576px) and (max-width:767px) {
    .w-60 {
        width: 98% !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .hero {
        height: 800px;
        background-image: url('../img/hero_img.jpg');
        background-position: center bottom;
        background-size: auto;
        background-attachment: scroll;
        background-repeat: no-repeat;
    }

    .gallery {
        background-color: #E8F8F7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .discover {
        background-color: #44B0E7;
        padding-top: 20px;
    }

    .cookie {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cover {
        background-color: #E8F8F7;
        background-image: url('../img/beach_scene_01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: scroll;
        background-size: auto;
    }

    .booking {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .contact {
        background-color: #006996;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .copyright {
        background-color: #003f5d;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .facilities {
        background-color: #e9f8f7;
        padding-top: 20px;
    }

    .heroBox {
        background-color: rgba(255, 255, 255, 0.78);
        margin-top: 20px;
        padding: 20px;
        box-shadow: 2px 2px 19px 0px #ffffff;
    }

    .heroRow {
        padding-top: 200px;
    }

    .h1Hero {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 3.4em;
    }

    .strap {
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        color: #106a94;
        font-size: 1.4em;
    }

    .h3Gallery {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 2.2em;
        padding-bottom: 19px;
    }

    .h3Cover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 1.8em;
        padding-bottom: 35px;
        padding-top: 45px;
        font-weight: 700;
        letter-spacing: 2px;
        text-shadow: 3px 2px 5px #545454;
    }

    .h2Discover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h5booking {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h4Facilities {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #106a94;
        font-size: 2.2em;
    }

    .btn-light {
        color: #ffffff;
        background-color: #006996;
        border-color: #004968;
        font-family: 'Domine', serif;
        font-size: 1.4em;
        font-weight: 400;
        text-align: center;
        border-radius: 8px;
    }

    .btn-light:hover {
        color: #ffffff;
        background-color: #004968;
        border-color: #004968;
    }

    h3 {
        font-size: 1.75rem;
        font-family: 'Handlee', cursive;
        color: #ffffff;
        text-align: center;
        font-weight: 400;
    }

    .disText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: normal;
    }

    .bookingText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: pre-wrap;
    }

    .copyrightText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        padding: 1.25rem;
        background-color: #e9f8f7;
    }

    .card-title {
        margin-bottom: 0.75rem;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        color: #006996;
        text-align: center;
    }

    .h2Facilities {
    }

    .facText {
        font-family: 'Domine', serif;
        font-size: 1.1em;
        color: #006996;
        text-align: center;
    }

    dd {
        margin-bottom: .5rem;
        margin-left: 0;
        color: #006996;
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        font-size: 1.2em;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.2em;
        text-align: center;
    }

    .h6Contact {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.2em;
        text-align: center;
    }

    .contactColHead {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.4em;
        text-align: center;
        font-weight: 400;
    }

    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid #ffffff;
    }

    address {
        margin-bottom: 1rem;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: center;
        font-size: 1.2em;
        font-weight: 400;
    }

    footerText {
        margin-bottom: 1rem;
        font-style: normal;
        line-height: inherit;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
    }

    .footerText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1em;
        font-weight: 400;
    }

    .contactDetailsText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.2em;
        text-align: center;
        font-weight: 400;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* unvisited link */
    a:link.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* visited link */
    a:visited.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* mouse over link */
    a:hover.contactDetailsText {
        color: #e6e6e6;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-decoration: underline;
    }

    /* selected link */
    a:active.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* unvisited link */
    a:link.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* visited link */
    a:visited.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }

    /* mouse over link */
    a:hover.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
        text-decoration: none;
    }

    /* selected link */
    a:active.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: center;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width:768px) and (max-width:991px) {
    .w-60 {
        width: 80% !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .hero {
        height: 800px;
        background-image: url('../img/hero_img.jpg');
        background-position: center bottom;
        background-size: auto;
        background-attachment: scroll;
        background-repeat: no-repeat;
    }

    .gallery {
        background-color: #E8F8F7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .discover {
        background-color: #44B0E7;
        padding-top: 20px;
    }

    .cookie {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cover {
        background-color: #E8F8F7;
        background-image: url('../img/beach_scene_01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: scroll;
        background-size: auto;
    }

    .booking {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .contact {
        background-color: #006996;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .copyright {
        background-color: #003f5d;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .facilities {
        background-color: #e9f8f7;
        padding-top: 20px;
    }

    .heroBox {
        background-color: rgba(255, 255, 255, 0.78);
        margin-top: 20px;
        padding: 20px;
        box-shadow: 2px 2px 19px 0px #ffffff;
    }

    .heroRow {
        padding-top: 200px;
    }

    .h1Hero {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 3.4em;
    }

    .strap {
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        color: #106a94;
        font-size: 1.4em;
    }

    .h3Gallery {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 2.8em;
        padding-bottom: 19px;
    }

    .h3Cover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 1.8em;
        padding-bottom: 35px;
        padding-top: 45px;
        font-weight: 700;
        letter-spacing: 2px;
        text-shadow: 3px 2px 5px #545454;
    }

    .h2Discover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h5booking {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h4Facilities {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #106a94;
        font-size: 2.8em;
    }

    .btn-light {
        color: #ffffff;
        background-color: #006996;
        border-color: #004968;
        font-family: 'Domine', serif;
        font-size: 1.4em;
        font-weight: 400;
        text-align: center;
        border-radius: 8px;
    }

    .btn-light:hover {
        color: #ffffff;
        background-color: #004968;
        border-color: #004968;
    }

    h3 {
        font-size: 1.75rem;
        font-family: 'Handlee', cursive;
        color: #ffffff;
        text-align: center;
        font-weight: 400;
    }

    .disText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .bookingText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: pre-wrap;
    }

    .copyrightText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        padding: 1.25rem;
        background-color: #e9f8f7;
    }

    .card-title {
        margin-bottom: 0.75rem;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        color: #006996;
        text-align: center;
    }

    .h2Facilities {
    }

    .facText {
        font-family: 'Domine', serif;
        font-size: 1.1em;
        color: #006996;
        text-align: center;
    }

    dd {
        margin-bottom: .5rem;
        margin-left: 0;
        color: #006996;
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        font-size: 1.2em;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h6Contact {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .contactColHead {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.4em;
        font-weight: 400;
        text-align: left;
    }

    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid #ffffff;
    }

    address {
        margin-bottom: 1rem;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
        font-weight: 400;
        font-size: 1.2em;
    }

    footerText {
        margin-bottom: 1rem;
        font-style: normal;
        line-height: inherit;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
    }

    .footerText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 0.7em;
        font-weight: 400;
    }

    .contactDetailsText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.2em;
        text-align: left;
        font-weight: 400;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* unvisited link */
    a:link.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsText {
        color: #e6e6e6;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
        text-decoration: underline;
    }

    /* selected link */
    a:active.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
    }

    /* unvisited link */
    a:link.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        font-weight: 400;
        text-align: left;
        text-decoration: none;
    }

    /* selected link */
    a:active.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width:992px) and (max-width:1199px) {
    .w-60 {
        width: 80% !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .hero {
        height: 800px;
        background-image: url('../img/hero_img.jpg');
        background-position: center bottom;
        background-size: auto;
        background-attachment: scroll;
        background-repeat: no-repeat;
    }

    .gallery {
        background-color: #E8F8F7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .discover {
        background-color: #44B0E7;
        padding-top: 20px;
    }

    .cookie {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cover {
        background-color: #E8F8F7;
        background-image: url('../img/beach_scene_01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: scroll;
        background-size: auto;
    }

    .booking {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .contact {
        background-color: #006996;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .copyright {
        background-color: #003f5d;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .facilities {
        background-color: #e9f8f7;
        padding-top: 20px;
    }

    .heroBox {
        background-color: rgba(255, 255, 255, 0.78);
        margin-top: 20px;
        padding: 20px;
        box-shadow: 2px 2px 19px 0px #ffffff;
    }

    .heroRow {
        padding-top: 200px;
    }

    .h1Hero {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 3.4em;
    }

    .strap {
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        color: #106a94;
        font-size: 1.6em;
    }

    .h3Gallery {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 2.8em;
        padding-bottom: 19px;
    }

    .h3Cover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 1.8em;
        padding-bottom: 35px;
        padding-top: 45px;
        font-weight: 700;
        letter-spacing: 2px;
        text-shadow: 3px 2px 5px #545454;
    }

    .h2Discover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h5booking {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h4Facilities {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #106a94;
        font-size: 2.8em;
    }

    .btn-light {
        color: #ffffff;
        background-color: #006996;
        border-color: #004968;
        font-family: 'Domine', serif;
        font-size: 1.4em;
        font-weight: 400;
        text-align: center;
        border-radius: 8px;
    }

    .btn-light:hover {
        color: #ffffff;
        background-color: #004968;
        border-color: #004968;
    }

    h3 {
        font-size: 1.75rem;
        font-family: 'Handlee', cursive;
        color: #ffffff;
        text-align: center;
        font-weight: 400;
    }

    .disText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .bookingText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
        white-space: pre-wrap;
    }

    .copyrightText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        padding: 1.25rem;
        background-color: #e9f8f7;
    }

    .card-title {
        margin-bottom: 0.75rem;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        color: #006996;
        text-align: center;
    }

    .h2Facilities {
    }

    .facText {
        font-family: 'Domine', serif;
        font-size: 1.1em;
        color: #006996;
        text-align: center;
    }

    dd {
        margin-bottom: .5rem;
        margin-left: 0;
        color: #006996;
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        font-size: 1.2em;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h6Contact {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .contactColHead {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.4em;
        text-align: left;
        font-weight: 400;
    }

    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid #ffffff;
    }

    address {
        margin-bottom: 1rem;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
        font-size: 1.2em;
    }

    footerText {
        margin-bottom: 1rem;
        font-style: normal;
        line-height: inherit;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
    }

    .footerText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 0.9em;
        font-weight: 400;
    }

    .contactDetailsText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.2em;
        text-align: left;
        font-weight: 400;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* unvisited link */
    a:link.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsText {
        color: #e6e6e6;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
        text-decoration: underline;
    }

    /* selected link */
    a:active.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* unvisited link */
    a:link.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
        text-decoration: none;
    }

    /* selected link */
    a:active.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width:1200px) {
    .w-60 {
        width: 50% !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .navbar-light .navbar-nav .nav-link {
        color: #006996 !important;
        font-family: 'Domine', serif;
        font-size: 18px;
    }

    .hero {
        height: 800px;
        background-image: url('../img/hero_img.jpg');
        background-position: center bottom;
        background-size: auto;
        background-attachment: scroll;
        background-repeat: no-repeat;
    }

    .gallery {
        background-color: #E8F8F7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .discover {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cookie {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 10px;
    }

    .cover {
        background-color: #E8F8F7;
        background-image: url('../img/beach_scene_01.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: scroll;
        background-size: auto;
    }

    .booking {
        background-color: #44B0E7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .contact {
        background-color: #006996;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .copyright {
        background-color: #003f5d;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .facilities {
        background-color: #e9f8f7;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .heroBox {
        background-color: rgba(255, 255, 255, 0.78);
        margin-top: 20px;
        padding: 20px;
        box-shadow: 2px 2px 19px 0px #ffffff;
    }

    .heroRow {
        padding-top: 200px;
    }

    .h1Hero {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 3.4em;
    }

    .strap {
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        color: #106a94;
        font-size: 1.6em;
    }

    .h3Gallery {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #006996;
        font-size: 2.8em;
        padding-bottom: 19px;
    }

    .h3Cover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2em;
        padding-bottom: 35px;
        padding-top: 45px;
        font-weight: 700;
        letter-spacing: 2px;
        text-shadow: 3px 2px 5px #545454;
    }

    .h2Discover {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h5booking {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #ffffff;
        font-size: 2.8em;
    }

    .h4Facilities {
        font-family: 'Handlee', cursive;
        text-align: center;
        color: #106a94;
        font-size: 2.8em;
    }

    .btn-light {
        color: #ffffff;
        background-color: #006996;
        border-color: #004968;
        font-family: 'Domine', serif;
        font-size: 1.4em;
        font-weight: 400;
        text-align: center;
        border-radius: 8px;
    }

    .btn-light:hover {
        color: #ffffff;
        background-color: #004968;
        border-color: #004968;
    }

    h3 {
        font-size: 1.75rem;
        font-family: 'Handlee', cursive;
        color: #ffffff;
        text-align: center;
        font-weight: 400;
    }

    .disText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .bookingText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .copyrightText {
        color: #ffffff;
        text-align: center;
        font-family: 'Domine', serif;
        font-size: 1em;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        padding: 1.25rem;
        background-color: #e9f8f7;
    }

    .card-title {
        margin-bottom: 0.75rem;
        font-family: 'Domine', serif;
        font-size: 0.9em;
        color: #006996;
        text-align: center;
    }

    .h2Facilities {
    }

    .facText {
        font-family: 'Domine', serif;
        font-size: 1.1em;
        color: #006996;
        text-align: center;
    }

    dd {
        margin-bottom: .5rem;
        margin-left: 0;
        color: #006996;
        font-family: 'Domine', serif;
        text-align: center;
        font-weight: 700;
        font-size: 1.2em;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h5Booking {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .h6Contact {
        font-family: 'Handlee', cursive;
        color: #ffffff;
        font-size: 2.8em;
        text-align: center;
    }

    .contactColHead {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.6em;
        text-align: left;
        font-weight: 400;
    }

    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid #ffffff;
    }

    address {
        margin-bottom: 1rem;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
        font-size: 1.2em;
    }

    footerText {
        margin-bottom: 1rem;
        font-style: normal;
        line-height: inherit;
        font-family: 'Domine', serif;
        color: #ffffff;
        text-align: left;
    }

    .contactDetailsText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 1.2em;
        text-align: left;
        font-weight: 400;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    /* unvisited link */
    a:link.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsText {
        color: #e6e6e6;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
        text-decoration: underline;
    }

    /* selected link */
    a:active.contactDetailsText {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* unvisited link */
    a:link.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* visited link */
    a:visited.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    /* mouse over link */
    a:hover.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
        text-decoration: none;
    }

    /* selected link */
    a:active.contactDetailsTextPhone {
        color: #ffffff;
        font-family: 'Domine', serif;
        font-size: 1.2em;
        font-weight: 400;
        text-align: left;
    }

    .footerText {
        font-family: 'Domine', serif;
        color: #ffffff;
        font-size: 0.9em;
        font-weight: 400;
    }
}

a.cookie:hover {
    color: #006996;
}

a.cookie: {
    color: #ffffff;
}

a.cookie:visited {
    color: #ffffff;
}