/* reset --------------------*/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a,
address, em, img, small, b, u, i, dl, dt, dd, ol, ul, li,
article, aside, figure, figcaption, footer, header, menu, nav {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}

ol, ul {
    list-style: none;
}

*, *:before, *:after {
    box-sizing: border-box;
}

address {
    font-style: normal;
}

figcaption {
    width: 100%;
}

a {
    text-decoration: none;
    cursor: pointer;
    color: black;
}

a[href^="tel:"] {
   text-decoration: inherit;
   color: inherit;
   white-space:nowrap;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 6rem;
    font-size: 100%;
}

img {
    display: block;
    width: 100%;
    image-rendering: -webkit-optimize-contrast;
}

:root {
    /* Colour - clr  */
    --clr-blue: #0D0D17;
    --clr-darkblue: rgba(6, 6, 12, 1);
    --clr-blue-gradient: linear-gradient(180deg, #1c1c31, #06060c 32%, #181829 97%);
    --clr-blue-gradient2: linear-gradient(180deg, #1c1c31, #06060c 52%, #181829 97%);
    --clr-gold: #edddbd;
    --clr-darkgold: #ad9b76;

    /* Shade - sh */
    --sh-offblack: rgb(7, 7, 7);
    --sh-darkgrey: rgb(30, 30, 30);
    --sh-grey: rgb(75, 75, 75);
    --sh-lightgrey: rgb(180, 180, 180);
    --sh-whitegrey: rgb(242, 242, 242);
    --sh-offwhite: rgb(243, 243, 243);
    --clr-whitegold: rgba(237, 227, 190, 0.5);

    /* Font Foundry */
    --ff-pri: 'muli', sans-serif;
    --ff-sec: 'Lora', serif;
    --ff-ter: 'OptimaLTPro-Roman', serif;

    /* Backgrounds */
    --bg-lightgrey: rgb(215, 215, 215);
    --bg-grey: rgb(248, 248, 248);
    --bg-gold: rgba(223, 209, 181, .2);
    --bg-darkgold: rgba(223, 209, 181, .7);

    /* Overlay */
    --ovr-offwhite: rgba(10, 10, 10, .05);
    --ovr-gradient: linear-gradient(180deg, rgb(236,236,236) 0%, rgb(255,255,255) 47%);
    --ovr-gradient-a:  radial-gradient(circle, rgba(0,0,0,0) 35%, rgba(0,0,0,0.04) 100%);
     /* --ovr-gradient-a: linear-gradient(180deg, rgba(0,0,0,0.06) 0%, rgba(0,0,0,0.03) 55%, rgba(0,0,0,0) 100%); */

}



/* Headings --------------------------------*/
.page__heading {
    font-family: var(--ff-pri);
    font-size: 1.7rem;
    font-weight: 100;
    letter-spacing: .2rem;
    text-transform: uppercase;
    text-align: center;
    line-height: 2.5rem;
    margin-bottom: 4rem;
}

.page__heading--sans {
    font-family: var(--ff-pri);
    font-size: 1.6rem;
    font-weight: 100;
    letter-spacing: .2rem;
}

.page__intro {
    font-family: var(--ff-ter);
    font-weight: 200;
    font-size: 1.15rem;
    line-height: 2rem;
    padding: 0 1.5rem;
    margin-bottom: 2rem;
    color: var(--sh-darkgrey);
}

.page__img {
    width: 100%;
    max-width: 24rem;
    padding: 0 1rem;
    margin: auto auto 4rem;
}

.heading,
.sub-heading,
.question {
    font-family: var(--ff-ter);
    font-weight: 100;
    line-height: 1.5rem;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--sh-offblack);
}

.heading {
    font-size: 1.35rem;
    letter-spacing: .1;
    line-height: 2rem;
    margin-bottom: 1rem;
}

.heading--row {
    margin-bottom: 1rem;
}

.sub-heading {
    font-size: 1.3rem;
    line-height: 2rem;
    margin-bottom: 1rem;
}

.sub-heading--flush {
    margin-bottom: .5rem;
}

.sub-heading--sm {
    font-family: var(--ff-pri);
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 400;
    line-height: 1.5rem;
    letter-spacing: .1rem;
    color: var(--sh-offblack);
    margin: -0.5rem 0 0;
}

.caption {
    font-family: var(--ff-ter);
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.5rem;
    text-align: center;
    letter-spacing: .1rem;
    text-transform: uppercase;
    color: var(--sh-offblack);
    margin: 1rem 0 .5rem;
}

.question {
    font-size: 1rem;
    letter-spacing: .075rem;
    line-height: 1.75rem;
    margin-top: 4rem;
}

.question:first-of-type {
    margin-top: 0rem;
}



/* Text ------------------------------------*/
.text-large {
    font-family: var(--ff-pri);
    font-size: 1rem;
    font-weight: 300;
    text-align: center;
    line-height: 2rem;
    margin: 0 auto;
    color: var(--sh-darkgrey);
}

.text {
    font-family: var(--ff-pri);
    font-size: 1rem;
    font-weight: 300;
    text-align: left;
    line-height: 1.7rem;
    margin: 0 auto;
    color: var(--sh-darkgrey);
}

.text li {
text-align: left;
line-height: 1.7rem; margin-bottom:1.7rem;
}

.text-block {
    font-family: var(--ff-pri);
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.7rem;
    padding: 0 2rem;
    margin: 0 auto;
    color: var(--sh-darkgrey);
    column-width: 50ch;
    column-gap: 3rem;
}

.text-sm {
    font-family: var(--ff-pri);
    font-size: .85rem;
    font-weight: 300;
    letter-spacing: 0.04em;
    line-height: 1.4rem;
    text-align: center;
    max-width: 75ch;
    margin: 0 auto;
    color: var(--sh-darkgrey);
}

.text-xs, small {
    font-size: .7rem;
    font-family: var(--ff-pri);
    font-weight: 300;
    line-height: 1.5rem;
}

.text--intro {
    line-height: 1.6rem;
    max-width: 70ch;
    padding: 0 1rem;
    margin-bottom: 2rem;
}

.text--alert {
    font-family: var(--ff-pri);
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 800;
   color: var(--clr-darkgold);
   color: black;
    letter-spacing: .04em;
    line-height: 2rem;
    padding: 0 1rem;
    margin-bottom: 1rem;
}

.text--alert span {
    color: var(--clr-darkgold);
}

.text--enquiries {
    font-size: .8rem;
    letter-spacing: .1em;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0 2rem;
}

.text--gold,
.text--gold a {
    color: var(--clr-gold);
}

.text-info {
    font-family: var(--ff-pri);
    font-size: .8rem;
    font-weight: 300;
    line-height: 1.6rem;
    letter-spacing: .05rem;
    width: 100%;
}

.text-info__row {
    width: 100%;
}

.text-info__row td,
.text-info__row th {
    font-weight: 300;
    flex-grow: 1;
    width: calc(100%/3);
    text-align: left;
    line-height: 1.1rem;
}

.text--middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.text--wrap {
    padding: 0 2rem;
}

.text--max {
    max-width: 60ch;
}

.text__links {
    margin-bottom: 2rem;
}

.text__links .link-sm {
    letter-spacing: .1em;
    margin: 0 .5rem;
}

.nightly a:hover {
    color: var(--sh-offwhite);
}

.linebreak {
    display: block;
}

::-moz-selection {
    background: var(--clr-whitegold);
}

::selection {
    background: var(--clr-whitegold);
}



/* Links -----------------------------------*/
:focus {
    color: inherit;
    outline: none;
}

.links {
    position: relative;
    margin-bottom: 2rem;
    display: flex;
    justify-content: center;
    align-items: baseline;
}

.links .text {
    margin: 0 .5rem 0 0;
}

.links__devider {
    width: 1px;
    height: .7rem;
    margin: 0 .6rem 0 .5rem;
    background: black;
}

.link {
    position: relative;
    font-family: var(--ff-pri);
    font-size: .9rem;
    font-weight: 400;
    letter-spacing: .08rem;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    color: black;
    transition: 300ms color ease-out;
    transition: 300ms opacity ease-out;
}

.link-sm,
.link-text {
    position: relative;
    font-family: var(--ff-pri);
    font-size: .95rem;
    font-weight: 400;
    letter-spacing: .075em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    line-height: 1.5rem;
    cursor: pointer;
    color: black;
    transition: 400ms color ease-out;
}

.link-sm {
    font-weight: 600;
    letter-spacing: .125em;
}

.link-xs {
    font-family: var(--ff-pri);
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .09rem;
    text-transform: uppercase;
    line-height: 1rem;
    color: black;
}

.link-line {
    font-family: var(--ff-pri);
    font-size: .9rem;
    letter-spacing: .02rem;
    text-transform: none;
    text-decoration: none;
    padding-bottom: .2rem;
    border-bottom: 1px solid;
    color: inherit;
    display: in
}

.link-line--lg {
    font-size: 1.1rem;
}

.link--gold {
    color: var(--clr-darkgold);
}

.link:hover,
.link-sm:hover,
.link-xs:hover {
    opacity: .6;
}

.link--inline {
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    color: inherit;
    text-decoration: underline;
    transition: 300ms opacity ease-out;
}

.link--inline:hover {
   opacity: .5;
}

.link--icons {
    margin: 0 auto;
    width: 10rem;
    margin-top: 1.5rem;
    color: var(--sh-offblack);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.link--icon {
    font-size: 1.3rem;
}

.link--icon:hover {
    color: var(--sh-lightgrey);
    transition: 500ms color ease-out;
}

.links--page:last-of-type {
    margin-left: -.1rem;
}

.links--page:hover {
    color: var(--clr-darkgold);
    transition: 400ms color ease-out;
}

.links--page:first-of-type::after {
    content: '|';
    margin: 0 1.2rem;
    color: var(--sh-offblack);
}



/* Image -----------------------------------*/
.img--border {
    border: .75rem solid white;
}

.img--border--wide {
    border: 1rem solid white;
}

.zoom:hover {
    -ms-transform: scale(1.25);
    /* IE 9 */
    -webkit-transform: scale(1.25);
    /* Safari 3-8 */
    transform: scale(1.25);
}


/* GDPR -----------------------------------*/

.gdpr-warning {
   display: none;
   position: fixed;
   text-align: center;
   padding: 3rem 2rem;
   bottom: 0;
   left: 0;
   right: 0;
   z-index: 100;
   background: var(--clr-blue-gradient2);
}

.gdpr-warning .btn {
   display: inline-block;
   font-size: .7em;
   padding: .4rem 1rem;
   margin-top: 1rem;
}


/* Animation -------------------------------*/
@keyframes fadeIn { from {opacity: 0;} to {opacity: 1;}}
@keyframes slideInBottom {from {bottom: -4rem; opacity: 0;} to {bottom: 0; opacity: 1;}}


/* Media -----------------------------------*/
@media screen and (min-width: 400px) {
    .link--sm {
        padding: 0 calc(.4rem + .1vw);
    }
}


@media screen and (min-width: 500px) {
    .link--sm {
        padding: 0 calc(.4rem + .1vw);
    }
}


@media screen and (min-width: 750px) {
    :root {
        --clr-blue-gradient: linear-gradient(180deg, #131322, #06060c 42%, #1a1a2e 85%);
    }

    .page__heading {
        font-size: 1.7rem;
        font-weight: 100;
        margin-bottom: 4rem;
    }

    .page__heading--sans {
        font-size: 1.5rem;
    }

    .text {
        font-size: .95rem;
    }

    .text-sm {
        font-family: var(--ff-pri);
        font-size: .8rem;
        letter-spacing: 0.02em;
        line-height: 1.45rem;
    }

    .text-block {
        padding: 0 3rem;
    }

    .text--alert {
        font-weight: 400;
        font-size: .75rem;
         letter-spacing: .07em;
    }

    .heading {
        font-size: 1.3rem;
        letter-spacing: .1;
        line-height: 2rem;
        margin-bottom: 2rem;
    }

    .heading--row {
      margin-bottom: 2rem;
  }

    .sub-heading {
        font-size: 1.1rem;
        margin-bottom: 1rem;
    }


    .sub-heading--sm {
       margin: -1.5rem 0 2rem 0;
   }

    .sub-heading--strap {
        font-size: .9rem;
        margin: -2rem 0 2rem 0;
        background: red;
    }

    .heading,
    .sub-heading {
        letter-spacing: .15rem;
    }

    .link-sm, .link-text {
        font-size: .8rem;
    }

    .linebreak {
        display: inline;
    }
}


@media screen and (min-width: 1100px) {
    .links--pages {
        display: block;
        margin-top: 1rem;
    }

    .link-xs {
        font-size: .7em;
        transition: 400ms color ease-out;
    }

    .caption {
        font-size: .85rem;
        letter-spacing: .1rem
    }

    .text-info {
        font-size: .7rem;
        line-height: 1.4rem;
    }

    .text--intro {
        margin-bottom: 1rem;
        padding: 0;
    }

    .text--capitals {
        font-size: .8rem;
        font-weight: 400;
        line-height: 1.75rem;
        text-transform: uppercase;
        letter-spacing: .1em;
        color: var(--clr-darkgold);
        background: purple;
    }
}
