@charset "UTF-8";

/******************************************************************************/
/****** Fix browser display bugs                                         ******/
/****** Normalize CSS v8.0.1                                             ******/
/****** MIT License | github.com/necolas/normalize.css                   ******/
/******************************************************************************/

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
}

main {
    display: block;
}

h1 {
    font-size: 2rem;
    line-height: 2rem;
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}

pre {
    font-family: monospace, monospace;
    font-size: 1em;
}

a {
    background-color: transparent;
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted;
}

b,
strong {
    font-weight: bolder;
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

img {
    border-style: none;
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}

button,
input {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

fieldset {
    padding: 0.35em 0.75em 0.625em;
}


legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}

progress {
    vertical-align: baseline;
}

textarea {
    overflow: auto;
}

[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

details {
    display: block;
}

summary {
    display: list-item;
}

template {
    display: none;
}

[hidden] {
    display: none;
}



/******************************************************************************/
/****** Flickity v2.2.0 https://flickity.metafizzy.co                    ******/
/******************************************************************************/

.flickity-enabled {
    position: relative;
}

.flickity-enabled:focus {
    outline: none;
}

.flickity-viewport {
    height: 100%;
    overflow: hidden;
    position: relative;
}

.flickity-slider {
    height: 100%;
    position: absolute;
    width: 100%;
}



/****** Flickity draggable ******/

.flickity-enabled.is-draggable {
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}



/****** Flickity button ******/

.flickity-button {
    background: hsla(0, 0%, 100%, 0.75);
    border: none;
    color: #000;
    position: absolute;
}

.flickity-button:hover {
    background: white;
    cursor: pointer;
}

.flickity-button:focus {
    box-shadow: 0 0 0 5px #19F;
    outline: none;
}

.flickity-button:active {
    opacity: 0.6;
}

.flickity-button:disabled {
    cursor: auto;
    opacity: 0;
    pointer-events: none;
}

.flickity-button-icon {
    fill: currentColor;
}



/****** Flickity previous/next buttons ******/

.flickity-prev-next-button {
    border-radius: 50%;
    height: 44px !important;
    top: 50%;
    transform: translateY(-50%);
    width: 44px !important;
}

.flickity-prev-next-button.previous {
    left: 10px;
}

.flickity-prev-next-button.next {
    right: 10px;
}



/****** Flickity right to left ******/

.flickity-rtl .flickity-prev-next-button.previous {
    right: 10px;
    left: auto;
}

.flickity-rtl .flickity-prev-next-button.next {
    left: 10px;
    right: auto;
}

.flickity-prev-next-button .flickity-button-icon {
    height: 60%;
    left: 20%;
    position: absolute;
    top: 20%;
    width: 60%;
}



/****** Flickity page dots ******/

.flickity-page-dots {
    bottom: -3rem;
    line-height: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

.flickity-rtl .flickity-page-dots {
    direction: rtl;
}

.flickity-page-dots .dot {
    background: rgba(197, 190, 183, 1);
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    height: 1.5rem;
    margin: 0 .5rem;
    opacity: .3;
    transition: 0.1s;
    width: 1.5rem;
}

.flickity-page-dots .dot:hover {
    opacity: 1;
}

.flickity-page-dots .dot.is-selected {
    background: rgba(26, 33, 34, 1);
    opacity: 1;
}



/******************************************************************************/
/****** Pikaday                                                          ******/
/****** © 2014 David Bushell | BSD & MIT license | https://dbushell.com/ ******/
/******************************************************************************/

.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    color: #000;
    background: #fff;
    border: 1px solid #ccc;
    border-bottom-color: #bbb;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/******************************************************************************/
/****** Clear child float (pika-lendar)                                  ******/
/****** using the famous micro clearfix hack                             ******/
/****** http://nicolasgallagher.com/micro-clearfix-hack/                 ******/
/******************************************************************************/

.pika-single:before,
.pika-single:after {
    content: " ";
    display: table;
}
.pika-single:after { clear: both }

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
}

.pika-lendar {
    float: left;
    width: 240px;
    margin: 8px;
}

.pika-title {
    position: relative;
    text-align: center;
}

.pika-label {
    display: inline-block;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    background-color: #fff;
}

.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    opacity: 0;
}

.pika-prev,
.pika-next {
    display: block;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    /* hide text using text-indent trick, using width value (it's enough) */
    text-indent: 20px;
    white-space: nowrap;
    overflow: hidden;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    opacity: .5;
}

.pika-prev:hover,
.pika-next:hover {
    opacity: 1;
}

.pika-prev,
.is-rtl .pika-next {
    float: left;
    background-image: url('/assets/images/arrow-left.svg');
    background-position: center;
    background-size: 50%;
}

.pika-prev:hover,
.is-rtl:hover .pika-next:hover {
    background-color: #fff;
    background-image: url('/assets/images/arrow-left.svg');
    border: 0;
    transition: none;
}

.pika-next,
.is-rtl .pika-prev {
    float: right;
    background-image: url('/assets/images/arrow-right.svg');
    background-position: center;
    background-size: 50%;
}

.pika-next:hover,
.is-rtl:hover .pika-prev {
    background-color: #fff;
    background-image: url('/assets/images/arrow-right.svg');
    border: 0;
    transition: none;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
    cursor: default;
    opacity: .2;
}

.pika-select {
    display: inline-block;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th,
.pika-table td {
    width: 14.285714285714286%;
    padding: 0;
}

.pika-table th {
    color: #999;
    font-size: 12px;
    line-height: 25px;
    font-weight: bold;
    text-align: center;
}

.pika-button {
    background: none;
    cursor: pointer;
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 5px;
    color: #666;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    background: #f5f5f5;
}

.pika-button:hover {
    background : #FFF;
    border: none;
    color: #666;
}

.pika-week {
    font-size: 11px;
    color: #999;
}

.is-today .pika-button {
    color: #000;
    font-weight: bold;
}

.is-selected .pika-button,
.has-event .pika-button {
    color: #fff;
    font-weight: bold;
    background: #ADADAD;
    box-shadow: inset 0 1px 3px #178fe5;
    border-radius: 0;
}

.has-event .pika-button {
    background: #ADADAD;
    box-shadow: inset 0 1px 3px #0076c9;
}

.is-disabled .pika-button,
.is-inrange .pika-button {
    background: #F2F2F2;
}

.is-startrange .pika-button {
    color: #000;
    background: #ADADAD;
    box-shadow: none;
    border-radius: 0;
}

.is-endrange .pika-button {
    color: #000;
    background: #ADADAD;
    box-shadow: none;
    border-radius: 0;
}

.is-disabled .pika-button {
    pointer-events: none;
    cursor: default;
    color: #999;
    opacity: .3;
}

.is-outside-current-month .pika-button {
    color: #999;
    opacity: .3;
}

.is-selection-disabled {
    pointer-events: none;
    cursor: default;
}

.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
    border: 0;
    color: #000;
    background: #ADADAD;
    box-shadow: none;
    border-radius: 0;
}

/* styling for abbr */
.pika-table abbr {
    border-bottom: none;
    cursor: default;
}



/******************************************************************************/
/****** Aaron Ikler custom form styling https://css-tricks.com/          ******/
/******************************************************************************/

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
    input[type='checkbox'],
    input[type='radio'] {
        --active: rgba(197, 190, 183, 1);
        --active-inner: rgba(197, 190, 183, 1);
        --focus: .25rem rgba(197, 190, 183, 1);
        --border: rgba(197, 190, 183, 1);
        --border-hover: rgba(166, 155, 144, 1);
        --background: rgba(255, 255, 255, 1);
        --disabled: #E2E2E2;
        --disabled-inner: #E2E2E2;
        -webkit-appearance: none;
        -moz-appearance: none;
        height: 21px;
        outline: none;
        display: inline-block;
        vertical-align: top;
        position: relative;
        margin: 0;
        cursor: pointer;
        border: 1px solid var(--bc, var(--border));
        background: var(--b, var(--background));
        -webkit-transition: background .3s, border-color .3s, box-shadow .2s;
        transition: background .3s, border-color .3s, box-shadow .2s;
    }

    input[type='checkbox']:after,
    input[type='radio']:after {
        content: '';
        display: block;
        left: 0;
        top: 0;
        position: absolute;
        -webkit-transition: opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
        transition: opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
        transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
        transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
    }

    input[type='checkbox']:checked,
    input[type='radio']:checked {
        --b: var(--active);
        --bc: var(--active);
        --d-o: .3s;
        --d-t: .6s;
        --d-t-e: cubic-bezier(.2, .85, .32, 1.2);
    }

    input[type='checkbox']:disabled,
    input[type='radio']:disabled {
        --b: var(--disabled);
        cursor: not-allowed;
        opacity: .9;
    }

    input[type='checkbox']:disabled:checked,
    input[type='radio']:disabled:checked {
        --b: var(--disabled-inner);
        --bc: var(--border);
    }

    input[type='checkbox']:disabled + label,
    input[type='radio']:disabled + label {
        cursor: not-allowed;
    }

    input[type='checkbox']:hover:not(:checked):not(:disabled),
    input[type='radio']:hover:not(:checked):not(:disabled) {
        --bc: var(--border-hover);
    }

    input[type='checkbox']:focus,
    input[type='radio']:focus {
        box-shadow: 0 0 0 var(--focus);
    }

    input[type='checkbox']:not(.switch),
    input[type='radio']:not(.switch) {
        width: 21px;
    }

    input[type='checkbox']:not(.switch):after,
    input[type='radio']:not(.switch):after {
        opacity: var(--o, 0);
    }

    input[type='checkbox']:not(.switch):checked,
    input[type='radio']:not(.switch):checked {
        --o: 1;
    }

    input[type='checkbox'] + label,
    input[type='radio'] + label {
        font-size: 14px;
        line-height: 21px;
        display: inline-block;
        vertical-align: top;
        cursor: pointer;
        margin-left: 4px;
    }

    input[type='checkbox']:not(.switch) {
        border-radius: 7px;
    }

    input[type='checkbox']:not(.switch):after {
        width: 5px;
        height: 9px;
        border: 2px solid var(--active-inner);
        border-top: 0;
        border-left: 0;
        left: 7px;
        top: 4px;
        -webkit-transform: rotate(var(--r, 20deg));
        transform: rotate(var(--r, 20deg));
    }

    input[type='checkbox']:not(.switch):checked {
        --r: 43deg;
    }

    input[type='checkbox'].switch {
        width: 38px;
        border-radius: 11px;
    }

    input[type='checkbox'].switch:after {
        left: 2px;
        top: 2px;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        background: var(--ab, var(--border));
        -webkit-transform: translateX(var(--x, 0));
        transform: translateX(var(--x, 0));
    }

    input[type='checkbox'].switch:checked {
        --ab: var(--active-inner);
        --x: 17px;
    }

    input[type='checkbox'].switch:disabled:not(:checked):after {
        opacity: .6;
    }

    input[type='radio'] {
        border-radius: 50%;
    }

    input[type='radio']:after {
        width: 19px;
        height: 19px;
        border-radius: 50%;
        background: var(--active-inner);
        opacity: 0;
        -webkit-transform: scale(var(--s, 0.7));
        transform: scale(var(--s, 0.7));
    }

    input[type='radio']:checked {
        --s: .5;
    }
}

select {
	-moz-appearance: none;
	-webkit-appearance: none;
	background-color: rgba(255, 255, 255, 1);
    color: rgba(26, 33, 34, 1);
	display: inline-block;
	font-size: 1rem;
    font-family: 'Cormorant Garamond', serif;
	font-weight: 400;
	line-height: 1.3;
	padding: .6em 1.4em .5em .8em;
	width: auto;
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
	border: none;
	box-shadow: 0;
	border-radius: 0;
	appearance: none;
	background-image: url(/assets/images/arrow-down.svg), linear-gradient(to bottom, #fff 0%,#fff 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}

select::-ms-expand {
	display: none;
}

select:hover {
	border-color: rgba(255, 255, 255, 1);
}

select:focus {
	border-color: rgba(255, 255, 255, 1);
	box-shadow: 0 0 1px 1px rgba(255, 255, 255, 1);
	box-shadow: 0 0 0 1px -moz-mac-focusring;
    color:  rgba(26, 33, 34, 1);
	outline: none;
}

select option {
	font-weight: normal;
}



/******************************************************************************/
/****** Global tags                                                      ******/
/******************************************************************************/

/****** Everything ******/

*,
:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    min-height: auto;
    min-width: auto;
}



/****** Html ******/


html {
    scroll-behavior: smooth;
}



/****** Body ******/

body {
    background: rgba(255, 255, 255, 1);
    color:  rgba(26, 33, 34, 1);
    font-family: 'Cormorant Garamond', serif;
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: .0165rem;
    line-height: 1.875rem;
    overflow-y: scroll;
}

@media (max-width:48em) {
    body {
        font-size: 1.25rem;
    }
}



/****** Headings ******/

h1,
h2,
h3,
h4,
h5,
h6 {
    color: inherit;
    font-family: inherit;
    font-weight: 400;
    margin: 0 0 1.25rem 0;
    text-transform: capitalize;
}

h1 {
    font-size: 2.75rem;
    line-height: 3rem;
    margin: 0 0 1.25rem 0;
}

h2 {
    font-size: 2.75rem;
    line-height: 3rem;
    margin: 0 0 1.25rem 0;
}

h3 {
    font-size: 2.5rem;
    line-height: 2.75rem;
}

h4 {
    font-size: 2rem;
    line-height: 2.25rem;
    margin: 0 0 .3125rem 0;
} 

h5 {
    font-size: 1.5rem;
    line-height: 1.75rem;
    margin: 0 0 .3125rem 0;
}

h6 {
    font-size: 1.25rem;
    line-height: inherit;
    margin: 0;
}



/****** Links ******/

a {
    color: rgba(26, 33, 34, 1);
    text-decoration: none;
    transition: all .4s;
}

a:hover {
    color: rgba(197, 190, 183, 1);
}

a[href^=tel]:hover {
    color: rgba(197, 190, 183, 1);
}



/****** Text ******/

p {
    margin: 0 0 1rem 0;
}

strong {
    font-weight: 700;
}



/****** Lists ******/

ul {
    list-style: none;
}



/****** Images ******/

img {
    display: inline-block;
}

svg {
    display: block;
}



/****** Forms ******/

form {
    padding: 0;
}

input {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border: none;
    border-radius: 0;
    box-shadow: 0;
    padding: .625rem;
}

button {
    -webkit-appearance: none;
    border: none;
    box-shadow: none;
}

input[type=text] {
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}

input[type=email] {
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}

input[type=tel] {
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}

textarea {
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}

select {
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}



/****** Tables ******/

table {
    border-collapse: collapse;
}



/******************************************************************************/
/****** Global classes                                                   ******/
/******************************************************************************/

/****** Content ******/

.content {
    padding: 3.125rem 0 0 0;
    position: relative;
}

/****** Colour ******/

.black {
    color: rgba(26, 33, 34, 1);
}

.taupe {
    color: rgba(197, 190, 183, 1);
}

.beige {
    color: rgba(244, 245, 241, 1);
}

.grey {
    color: rgba(177, 192, 201);
}


/****** Background colour ******/

.black-bg {
    background-color: rgba(26, 33, 34, 1);
}

.taupe-bg {
    background-color: rgba(197, 190, 183, 1);
}

.beige-bg {
    background-color: rgba(244, 245, 241, 1);
}

.grey-bg {
    background-color: rgba(177, 192, 201);
}

.white-bg {
    background-color: rgba(255, 255, 255);
}


/****** SVG fill ******/

.taupe-fill {
    fill: rgba(197, 190, 183, 1);
}

.beige-fill {
    fill: rgba(244, 245, 241, 1);
}

.grey-fill {
    fill: rgba(177, 192, 201, 1);
}

.white-fill {
    fill: rgba(255, 255, 255, 1);
}

.black-fill {
    fill: rgba(26, 33, 34, 1);
}


/****** Buttons ******/

.beige-button,
.beige-button[href^=tel] {
    background-color: rgba(244, 245, 241, 1);
    color: rgba(26, 33, 34, 1);
    cursor: pointer;
    display: block;
    margin: 0 auto 1.25rem auto;
    min-width: 12.5rem;
    max-width: 18.75rem;
    padding: .625rem 1.25rem;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all .4s;
    width: 100%;
}

.beige-button:hover {
    background-color: rgba(26, 33, 34, 1);
    color: rgba(197, 190, 183, 1);
}

.taupe-button,
.taupe-button[href^=tel] {
    background-color: rgba(197, 190, 183, 1);
    color: rgba(26, 33, 34, 1);
    cursor: pointer;
    display: block;
    margin: 0 auto 1.25rem auto;
    min-width: 12.5rem;
    max-width: 18.75rem;
    padding: .625rem 1.25rem;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all .4s;
    width: 100%;
}

.taupe-button:hover {
    background-color: rgba(26, 33, 34, 1);
    color: rgba(197, 190, 183, 1);
}

.dark-taupe-button,
.dark-taupe-button[href^=tel] {
    background-color: rgba(171, 161, 152, 1);
    color: rgba(26, 33, 34, 1);
    cursor: pointer;
    display: block;
    margin: 0 auto 1.25rem auto;
    min-width: 12.5rem;
    max-width: 18.75rem;
    padding: .625rem 1.25rem;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all .4s;
    width: 100%;
}

.dark-taupe-button:hover {
    background-color: rgba(26, 33, 34, 1);
    color: rgba(197, 190, 183, 1);
}

.content-button {
    margin-bottom: 3.125rem;
    margin-top: 3.125rem;
}


/****** Alternate font ******/

.font-alt {
    font-family: 'Raleway', sans-serif;
    letter-spacing: .125rem;
}



/******************************************************************************/
/****** Header                                                           ******/
/******************************************************************************/

.header {
    display: grid;
    grid-template-areas: "logo trigger";
    grid-template-columns: 1fr 1fr;
    padding: .625rem 1.25rem;
    position: fixed;
    transition: all .4s;
    width: 100%;
    z-index: 20;
}



/****** Logo ******/

.logo {
    align-self: center;
    display: block;
    grid-area: logo;
    justify-self: left;
}

.logo svg {
    height: 1.25rem;
    width: auto;
}

.logo:hover svg {
    fill: rgba(197, 190, 183, 1);
}



/****** Logo (homepage) ******/

.logo--homepage {
    align-self: center;
    display: block;
    justify-self: center;
    width: 100%;
}

.logo--homepage svg {
    height: auto;
    justify-self: center;
    margin: 0 auto 2.25rem auto;
    max-width: 32rem;
    padding: 0 1.25rem;
    width: 100%;
}

.logo--homepage--light svg {
    fill: rgba(255, 255, 255, 1);
}

.logo--homepage--dark svg {
    fill: rgba(26, 33, 34, 1);
}

.homepage--phone--dark {
    color: rgba(255, 255, 255, 1) !important;
    font-size: 1.25rem;
    transition: all .4s;
}

.homepage--phone--dark:hover {
    color: rgba(26, 33, 34, 1) !important;
}

.homepage--phone--light {
    color: rgba(26, 33, 34, 1) !important;
    font-size: 1.25rem;
    transition: all .4s;
}

.homepage--phone--light:hover {
    color: rgba(197, 190, 183, 1) !important;
}

.homepage--t--dark {
    color: rgba(255, 255, 255, 1) !important;
    font-size: 1.25rem;
    font-weight: 700;
    transition: all .4s;
}

.homepage--t--light {
    color: rgba(26, 33, 34, 1) !important;
    font-size: 1.25rem;
    font-weight: 700;
    transition: all .4s;
}

.homepage--phone--general {
    color: rgba(26, 33, 34, 1) !important;
    font-size: 1.25rem;
    transition: all .4s;
}

.homepage--phone--general:hover {
    color: rgba(197, 190, 183, 1) !important;
}

.homepage--t--general {
    color: rgba(26, 33, 34, 1) !important;
    font-size: 1.25rem;
    font-weight: 700;
    transition: all .4s;
}



/****** Menu trigger ******/

.trigger {
    align-self: center;
    cursor: pointer;
    display: block;
    grid-area: trigger;
    justify-self: right;
}

.trigger:hover svg {
    fill: rgba(197, 190, 183, 1);
}

.trigger-dark-theme svg {
    fill: rgba(26, 33, 34, 1);
}

.trigger-dark-theme:hover svg {
    fill: rgba(244, 245, 241, 1);
}

.trigger-light-theme svg {
    fill: rgba(244, 245, 241, 1);
}

.trigger-light-theme:hover svg {
    fill: rgba(26, 33, 34, 1);
}

.trigger-original-theme svg {
    fill: rgba(26, 33, 34, 1);
}

.trigger-original-theme:hover svg {
    fill: rgba(197, 190, 183, 1);
}



/****** Burger ******/

.burger {
    height: 1.25rem;
    margin: .3125rem 0;
    width: auto;
}



/****** Cross ******/

.cross {
    display: none;
    height: 1.875rem;
    margin: 0 .3125rem 0 0;
    width: auto;
}



/****** Navigation ******/

.navigation {
    display: none;
    height: 100vh;
    padding: 6.25rem 0 3.125rem 0;
    text-align: center;
    overflow: auto;
    position: fixed;
    width: 100%;
    z-index: 19;
}

.navigation-list {
    margin: 0 0 2.5rem 0;
}

.navigation-list--item {
    margin: 0 0 1.25rem 0;
}

.navigation-list--link {
    font-size: 1.25rem;
    font-weight: 600;
    text-transform: uppercase;
}

.navigation-list--link:hover {
    color: rgba(244, 245, 241, 1);
}

.navigation-list--item ul {
    margin: 0 0 .625rem 0;
}

.navigation-list--item ul li {
    display: inline-block;
    margin: 0;
    padding: 0 .625rem;
}

.navigation-list--item ul li a {
    font-size: 1rem;
    font-weight: 400;
    text-transform: uppercase;
}

.navigation-list--children {
    display: block;
    margin: 0 auto !important;
    padding: 0 1.25rem;
    max-width: 48rem;
    width: 100%;
}



/******************************************************************************/
/****** Details                                                          ******/
/******************************************************************************/

.details {
    font-size: .875rem;
    line-height: 1.25rem;
    margin: 2.5rem auto;
    max-width: 25rem;
    text-align: left;
    width: 100%;
}



/****** Site name ******/

.site-name {
    font-size: 1rem;
    font-weight: 600;
}



/****** Opening times ******/

.opening-times {
    font-size: .875rem;
    line-height: 1.25rem;
    margin: 0 auto 1.25rem auto;
    max-width: 25rem;
    text-align: left;
    text-transform: uppercase;
    width: 100%;
}

.opening-times--day {
    width: 50%;
}

.opening-times--time {
    text-align: right;
    width: 50%;
}



/****** Text links ******/

.text-link--small {
    display: block;
    font-size: .875rem;
    line-height: 1.25rem;
    margin: 0 0 .03125rem 0;
}

.text-link--large {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 .03125rem 0;
}

.text-link--small:hover,
.text-link--small[href^=tel]:hover,
.text-link--large:hover,
.text-link--large[href^=tel]:hover {
    color: rgba(244, 245, 241, 1);
}



/****** Social media ******/

.social-media {
    margin: 2.5rem 0 0 0;
}

.social-media--icon {
    display: inline-block;
    height: 1.75rem;
    margin: 0 .625rem 0 0;
    width: auto;
}

.social-media--icon:hover {
    fill: rgba(244, 245, 241, 1);
}



/******************************************************************************/
/****** Footer                                                           ******/
/******************************************************************************/

.footer {
    display: grid;
    grid-template-areas: "details newsletter";
    column-gap: 3.125rem;
    grid-template-columns: 1fr 3fr;
    padding: .625rem 1.25rem;
}

@media (max-width:48em) {
    .footer {
        grid-template-areas: "newsletter" "details";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: 1.25rem;
    }
}

.footer--newsletter {
    display: grid;
    grid-template-areas: "newsletter";
    column-gap: 3.125rem;
    grid-template-columns: 1fr;
    padding: 1.25rem 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .footer--newsletter {
        grid-template-areas: "newsletter";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: 1.25rem;
    }
}



/****** Details ******/

.details-wrapper {
    grid-area: details;
}



/****** Newsletter ******/

.newsletter {
    font-size: .875rem;
    line-height: 1.25rem;
    grid-area: newsletter;
    margin: 2.5rem auto;
    max-width: 48rem;
    text-align: center;
    width: 100%;
}

@media (max-width:48em) {
    .newsletter {
        margin: 2.5rem auto 0 auto;
    }
}

.newsletter--grid {
    column-gap: .625rem;
    display: grid;
    grid-template-areas: "input submit";
    grid-template-columns: 3fr 1fr;
    width: 100%;
}

@media (max-width:64em) {
    .newsletter--grid {
        grid-template-areas: "input" "submit";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: .625rem;
    }
}

.newsletter--title {
    margin: 0 0 .625rem 0;
}

.newsletter--strapline {
    font-weight: 600;
    text-transform: uppercase;
}

.submit {
    font-size: 1rem;
    line-height: 1.875rem;
}

.submit--wrapper {
    grid-area: submit;
}

.email-address {
    display: block;
    font-size: 1rem;
    grid-area: input;
    line-height: 1.875rem;
    padding: .625rem 1.25rem;
    width: 100%;
}

.input--wrapper {
    grid-area: input;
}



/****** Recapture ******/

.submit-container {
    grid-area: capture !important;
}

.grecaptcha-badge {
    margin: .625rem auto 0 auto;
    position: static !important;
}



/****** Terms ******/


.terms-list {
    font-size: .875rem;
    margin: 1.25rem;
}

.terms-list--item {
    display: inline-block;
    margin: 0 1.25rem 0 0;
}

/****** Appointment ******/

.appointment {
    margin-top: 3.125rem;
    padding: 6.25rem 1.25rem;
    text-align: center;
}

.appointment--button {
    display: inline-block !important;
    margin: 0 1.25rem;
}

.appointment--link {
    display: block;
    font-size: .8125rem;
    margin: 0 auto;
    width: fit-content;
}



/******************************************************************************/
/****** Hero                                                             ******/
/******************************************************************************/

.hero {
    height: 100vh;
    position: relative;
    width: 100%;
    z-index: 0;
}

.hero--dark-fade {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .6) 0%, transparent 40%, rgba(0, 0, 0, .6) 100%);
    height: 100vh;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}

.hero--light-fade {
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, .4), transparent, rgba(255, 255, 255, .4));
    height: 100vh;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}

.hero img {
    -o-object-fit: cover;
    height: 100vh;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

.carousel div {
    height: 100vh;
    width: 100%;
    top: 0;
    z-index: 1;
}

.carousel div img {
    -o-object-fit: cover;
    height: 100vh;
    object-fit: cover;
    position: absolute;
    width: 100%;
}

.hero--strapline {
    align-items: center;
    bottom: 0;
    color: rgba(255, 255, 255, 1);
    display: flex;
    flex-direction: column;
    height: 12.5rem;
    justify-content: center;
    left: 0;
    margin: auto;
    max-width: 32rem;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 3;
}

.hero--strapline--dark {
    align-items: center;
    bottom: 0;
    color: rgba(26, 33, 34, 1);
    display: flex;
    flex-direction: column;
    height: 12.5rem;
    justify-content: center;
    left: 0;
    margin: auto;
    max-width: 32rem;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 3;
}

.hero--strapline h2 {
    align-self: flex-start;
}

.hero--links {
    align-items: flex-start;
    bottom: 0;
    color: rgba(255, 255, 255, 1);
    display: flex;
    height: 9.375rem;
    justify-content: center;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    width: 100%;
    z-index: 4;

}

@media (max-width:48em) {
    .hero--links {
        align-items: center;
        flex-direction: column;
        height: 15.625rem;
        justify-content:flex-start;
        gap: .625rem;
    }
}



/******************************************************************************/
/****** Services (homepage)                                              ******/
/******************************************************************************/

.services--wrapper {
    background-color: rgba(244, 245, 241, 1);
    padding: 6.125rem 1.25rem;
}

.services {
    display: flex;
    flex-flow: wrap;
    margin: auto;
    max-width: 62.5rem;
    text-align: center;
    width: 100%
}

.services--header {
    padding: 0 0 1.25rem 0;
    text-align: center;
}

.services--link {
    align-items: center;
    border-right: .0625rem solid rgba(197, 190, 183, 1);
    border-bottom: .0625rem solid rgba(197, 190, 183, 1);
    border-collapse: collapse;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font-size: 2rem;
    gap: .625rem;
    justify-content: center;
    line-height: 2.5rem;
    padding: 6.25rem 1.25rem;
    text-align: center;
    width: 33.3333%;
}

.services--link:hover {
    background: rgba(197, 190, 183, 1);
    color: inherit;
}

.services--link:hover .services--count {
    color: rgba(26, 33, 34, 1);
}

.services--link:nth-of-type(3n) {
    border-right: none;
}

.services--link:nth-last-child(-n+3) {
    border-bottom: none;
}

@media (max-width:48em) {
    .services--link {
        font-size: 1.25rem;
        line-height: 1.75rem;
        padding: 3.125rem .625rem;
        width: 50%;
    }

    .services--link:nth-of-type(3n) {
        border-right: .0625rem solid rgba(197, 190, 183, 1);
    }
    
    .services--link:nth-last-child(-n+3) {
        border-bottom: .0625rem solid rgba(197, 190, 183, 1);
    }

    .services--link:nth-of-type(2n) {
        border-right: none;
    }

    .services--link:nth-last-child(-n+2) {
        border-bottom: none;
    }
}

.services--count {
    font-size: 1rem;
    font-weight: 600;
    transition: all .4s;
}

.services--wrapper--margin {
    margin-bottom: 6.25rem;
}



/******************************************************************************/
/****** Services (services page)                                         ******/
/******************************************************************************/

.services-page--wrapper {
    padding: 3.125rem 1.25rem 6.125rem 1.25rem;
}

.services-page {
    display: flex;
    flex-flow: wrap;
    margin: auto;
    max-width: 62.5rem;
    text-align: center;
    width: 100%
}

.services-page--link {
    align-items: center;
    border-right: .0625rem solid rgba(197, 190, 183, 1);
    border-bottom: .0625rem solid rgba(197, 190, 183, 1);
    border-collapse: collapse;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    font-size: 2rem;
    gap: .625rem;
    justify-content: center;
    line-height: 2.5rem;
    padding: 6.25rem 1.25rem;
    text-align: center;
    width: 33.3333%;
}

.services-page--link:hover {
    background: rgba(244, 245, 241, 1);
    color: inherit;
}

.services-page--link:hover .services-page--count {
    color: rgba(26, 33, 34, 1);
}

.services-page--link:nth-of-type(3n) {
    border-right: none;
}

.services-page--link:nth-last-child(-n+3) {
    border-bottom: none;
}

@media (max-width:48em) {
    .services-page--link {
        font-size: 1.25rem;
        line-height: 1.75rem;
        padding: 3.125rem .625rem;
        width: 50%;
    }

    .services-page--link:nth-of-type(3n) {
        border-right: .0625rem solid rgba(197, 190, 183, 1);
    }
    
    .services-page--link:nth-last-child(-n+3) {
        border-bottom: .0625rem solid rgba(197, 190, 183, 1);
    }

    .services-page--link:nth-of-type(2n) {
        border-right: none;
    }

    .services-page--link:nth-last-child(-n+2) {
        border-bottom: none;
    }
}

.services-page--count {
    font-size: 1rem;
    font-weight: 600;
    transition: all .4s;
}

.services-page--wrapper--margin {
    margin-bottom: 6.25rem;
}

.services--slider {
    border: none !important;
    border-right: .0625rem solid rgba(197, 190, 183, 1) !important;
    padding: 6.25rem 1.25rem !important;
}

.services--slider:first-child {
    border: none !important;
    border-left: .0625rem solid rgba(197, 190, 183, 1) !important;
    border-right: .0625rem solid rgba(197, 190, 183, 1) !important;
}

@media (max-width:48em) {
    .services--slider {
        border-left: .0625rem solid rgba(197, 190, 183, 1) !important;
        border-right: .0625rem solid rgba(197, 190, 183, 1) !important;
        display: block !important;
        height: auto !important;
        margin: 0 auto !important;
        width: 100% !important;
    }
}



/******************************************************************************/
/****** Team member                                                      ******/
/******************************************************************************/

.team-member {
    display: grid;
    gap: 3.125rem;
    grid-template-areas: "photo bio";
    grid-template-columns: 1fr 1fr;
    margin: 0 auto;
    max-width: 48rem;
    padding: 6.25rem 1.25rem;
    width: 100%;
}

.team-member:nth-of-type(even) {
    display: grid;
    gap: 3.125rem;
    grid-template-areas: "bio photo";
    grid-template-columns: 1fr 1fr;
    margin: 0 auto;
    max-width: 48rem;
    padding: 6.25rem 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .team-member,
    .team-member:nth-of-type(even) {
        grid-template-areas: "photo" "bio";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: 1.25rem;
        padding: 6.25rem 2.5rem;
    }
}

.team-member--wrapper {
    position: relative;
    width: 100%;
}

.team-member--bio {
    grid-area: bio;
    margin-top: 50%;
}

@media (max-width:48em) {
    .team-member--bio {
        margin-top: 0;
    }
}

.team-member--photo--wrapper {
    grid-area: photo;
    height: fit-content;
    position: relative;
}

@media (max-width:48em) {
    .team-member--photo--wrapper {
        margin: 0 3.125rem;
    }
}

.team-member--photo {
    height: fit-content;
    max-height: fit-content;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.team-member--photo img {
    height: auto;
    position: relative;
    transition: all .4s;
    width: 100%;
}

.team-member--photo img:hover {
    transform: scale(1.1, 1.1);
}

.team-member-box-top {
    height: 40%;
    left: -1.25rem;
    position: absolute;
    top: 1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.team-member-box-bottom {
    top: 8rem;
    height: 40%;
    position: absolute;
    right: -1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.team-member--job-title {
    font-size: 1.5rem;
}

.feature-title {
    display: block;
    padding: .625rem 1.25rem;
    position: fixed;
    right: 0;
    text-align: center;
    text-transform: uppercase;
    transform-origin: top right;
    transform: rotate(90deg) translateX(50%);
    top: 22.5rem;
    z-index: 1;
}

@media (max-width:52em) {
    .feature-title {
        display: none;
    }
}



/****** Team member gallery ******/

.gallery {
    padding: 0 0 6.25rem 0;
}

.gallery--feature {
    height: auto;
    margin: 0 auto;
    max-width: 75rem;
    text-align: left;
    width: 100%;
}

@media (max-width:48em) {
    .gallery--feature {
        display: block;
    }
}

.gallery--photo {
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
    height: 100%;
    max-height: 37.5rem;
    max-width: 25rem;
    object-fit: cover;
    object-position: 100% 0;
    width: 100%;
}

@media (max-width:48em) {
    .gallery--photo {
        height: auto;
        margin: 0 auto;
        min-height: 0;
    }
}

.gallery--cell {
    display: block;
    height: auto;
    padding: 0 1.25rem;
    width: 33.3333%;
}

@media (max-width:48em) {
    .gallery--cell {
        display: block;
        height: auto;
        margin: 0 auto;
        width: 100%;
    }
}

.gallery--header {
    text-align: center;
    padding: 0 0 1.25rem 0;
}



/****** Team member quote ******/

.quote--wrapper {
    margin: 3.125rem 0 6.25rem 0;
    padding: 6.25rem 1.25rem;
    width: 100%;
}

.quote--box {
    margin: 0 auto;
    min-height: 15.625rem;
    max-width: 48rem;
    padding: 0 3.125rem;
    position: relative;
    width: 100%;
}

.quote {
    font-size: 2.5rem;
    font-weight: 400;
    line-height: 2.75rem;
    margin: 0 0 1.25rem 0;
}

.quote--inner-box {
    position: absolute;
    top: 0;
}

.quote-by {
    font-size: 2rem;
    font-weight: 400;
    line-height: 2.5rem;
}

.quotation-marks {
    display: block;
    height: auto;
    left: -3.125rem;
    position: absolute;
    top: 0;
    width: 3.125rem;
}

@media (max-width:48em) {
    .quotation-marks {
        left: -.625rem;
    }
}

.fade-quote {
    display: none
}

.fade-current {
    display: block;
}



/****** Team member slider ******/

.team-slider {
    padding: 0 0 6.25rem 0;
}

@media (max-width:48em) {
    .team-slider {
        padding: 0 1.25rem 6.25rem 1.25rem;
    }
}

.team-slider--feature {
    height: auto;
    margin: 0 auto;
    max-width: 75rem;
    text-align: left;
    width: 100%;
}

@media (max-width:48em) {
    .team-slider--feature {
        display: block;
    }
}

.team-slider--photo {
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
    height: 100%;
    max-height: 37.5rem;
    max-width: 25rem;
    object-fit: cover;
    object-position: 100% 0;
    transition: all .4s;
    width: 100%;
}

@media (max-width:48em) {
    .team-slider--photo {
        height: auto;
        margin: 0 auto;
        min-height: 0;
    }
}

.team-slider--photo:hover {
    transform: scale(1.1, 1.1);
}

.team-slider--photo-box {
    height: fit-content;
    overflow: hidden;
    width: fit-content;
}

.team-slider--cell {
    display: grid;
    gap: 2.5rem;
    grid-template-areas: "photo-slider bio-slider";
    grid-template-columns: 2fr 1fr;
    height: auto;
    padding: .625rem 1.25rem;
    width: 33.3333%;
}

@media (max-width:75em) {
    .team-slider--cell {
        display: grid;
        height: auto;
        margin: 0 auto;
        width: 50%;
    }
}

@media (max-width:48em) {
    .team-slider--cell {
        display: grid;
        height: auto;
        margin: 0 auto;
        width: 100%;
    }
}

.team-slider--figure {
    grid-area: photo-slider;
    position: relative;
}

.team-slider--header {
    text-align: center;
    padding: 0 0 1.25rem 0;
}

.team-slider--cell--header {
    grid-area: bio-slider;
    position: relative;
}

.team-slider--cell--header--copy {
    height: 100%;
    position: relative;
    text-align: left;
    text-orientation: mixed;
    transform: rotate(180deg) translateX(50%);
    writing-mode: vertical-lr;
    width: 100%;
    z-index: 1;
    position: absolute;
    bottom: 0;
}

.team-slider--cell--header--copy h3 {
    font-size: 2rem;
    line-height: 2rem;
}



/******************************************************************************/
/****** Meet the team                                                    ******/
/******************************************************************************/

.meet-the-team--header {
    margin: 0 auto;
    max-width: 48rem;
    padding: 3.125rem 1.25rem 3.125rem 1.25rem;
    width: 100%;
}

.meet-the-team--first-member:first-of-type {
    padding-top: 1.25rem;
}

.meet-the-team--button {
    margin: 1.25rem 0 0 0;
    text-align: center;
}



/******************************************************************************/
/****** Blog                                                             ******/
/******************************************************************************/

.blog--header {
    margin: 0 auto;
    max-width: 48rem;
    padding: 3.125rem 1.25rem 0 1.25rem;
    width: 100%;
}

.blog--categories {
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
}

.blog--strapline {
    font-size: 1.25rem;
    font-weight: 700;
}

.categories,
.tags {
    display: block;
    margin: 0 auto;
    max-width: 75rem;
    padding: 2.25rem 0;
    text-align: center;
    width: 100%;
}

.paginate-wrapper {
    display: grid;
    gap: 2.5rem;
    grid-template-areas: "previous recent";
    grid-template-columns: 1fr 1fr;
    margin: 0 auto;
    max-width: 75rem;
    padding: 2.25rem 0;
    width: 100%;
}

.paginate-right {
    grid-area: recent;
    text-align: right;
}

.paginate-left {
    grid-area: previous;
    text-align: left;
}

.blog-slider {
    padding: 3.125rem 0 0 0;
}

@media (max-width:48em) {
    .blog-slider {
        padding: 3.125rem 1.25rem 6.25rem 1.25rem;
    }
}

.blog-link {
    font-weight: 700;
    text-transform: uppercase;
}

.blog-info-links {
    padding: .625rem 0 0 0;
}

.blog-slider--feature {
    height: auto;
    margin: 0 auto 6.25rem auto;
    max-width: 75rem;
    padding: 0 0 3.125rem 0; 
    text-align: left;
    width: 100%;
}

@media (max-width:48em) {
    .blog-slider--feature {
        display: block;
        margin: 0 auto;
        padding: 3.125rem 0; 
    }
}

.blog-slider--photo {
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
    height: 100%;
    min-height: 20.25rem;
    max-height: 37.5rem;
    max-width: 25rem;
    object-fit: cover;
    object-position: 100% 0;
    width: 100%;
}

@media (max-width:48em) {
    .blog-slider--photo {
        height: auto;
        margin: 0 auto;
        min-height: 0;
        width: 100%;
    }
}

.blog-slider--cell {
    display: grid;
    gap: 2.5rem;
    grid-template-areas: "blog-slider-info blog-slider-photo";
    grid-template-columns: 2fr 1fr;
    height: auto;
    padding: .625rem 1.25rem;
    width: 50%;
}

@media (max-width:75em) {
    .blog-slider--cell {
        display: grid;
        height: auto;
        margin: 0 auto;
        width: 50%;
    }
}

@media (max-width:48em) {
    .blog-slider--cell {
        display: grid;
        grid-template-areas: "blog-slider-photo" "blog-slider-info";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        height: auto;
        margin: 0 auto;
        width: 100%;
    }
}

.blog-slider--figure {
    grid-area: blog-slider-photo;
    height: fit-content;
    overflow: hidden;
    position: relative;
    width: fit-content;
}

.blog-slider--header {
    text-align: center;
}

.blog-slider--cell--header {
    grid-area: blog-slider-info;
    position: relative;
}

.blog-slider--cell--header--copy {
    bottom: 0;
    position: absolute;
    text-align: left;
    text-transform: uppercase;
    width: 100%;
}

@media (max-width:48em) {
    .blog-slider--cell--header--copy {
        position: static;
    }
}

.blog-slider--strapline {
    font-size: 1.25rem;
}

.blog-slider--photo {
    transition: all .4s;
}

.blog-slider--photo:hover {
    transform: scale(1.1, 1.1);
}

.blog-slider--photo-box {
    height: fit-content;
    overflow: hidden;
    width: fit-content;
}

.blog--content {
    margin: 0 auto;
    max-width: 48rem;
    padding: 0 2.5rem;
    width: 100%;
}

.blog--content h3 {
    margin-top: 3.125rem;
}

.blog--content a {
    text-decoration: underline;
}

.blog-post-figure {
    padding: 2.25rem 0;
    width: 100%;
}

.blog-post-figure img {
    height: auto;
    width: 100%;
}

.blog-entry {
    padding: 3.125rem 0 6.25rem 0;
}

.blog-post-wrapper-adj {
    top: -3.125rem;
}

.blog-homepage-title {
    display: block;
    font-weight: 700;
    padding: .625rem 1.25rem;
    position: absolute;
    right: 0;
    text-transform: uppercase;
    transform-origin: top right;
    transform: rotate(90deg) translateX(50%);
    top: 12.5rem;
}

@media (max-width:75em) {
    .blog-homepage-title {
        display: none;
    }
}



/******************************************************************************/
/****** Blog article                                                     ******/
/******************************************************************************/

.blog-article {
    display: grid;
    gap: 3.125rem;
    grid-template-areas: "photo" "bio";
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    margin: 0 auto;
    max-width: 48rem;
    padding: 6.25rem 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .blog-article {
        grid-template-areas: "photo" "bio";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: 1.25rem;
        padding: 6.25rem 2.5rem;
    }
}

.blog-article--wrapper {
    position: relative;
    width: 100%;
}

.blog-article--bio {
    grid-area: bio;
    max-width: 48rem;
    padding: 0 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .blog-article--bio {
        margin-top: 0;
        padding: 0;
    }
}

.blog-article--photo--wrapper {
    grid-area: photo;
    position: relative;
}

@media (max-width:48em) {
    .blog-article--photo--wrapper {
        margin: 0 1.25rem 1.25rem 1.25rem;
    }
}

.blog-article--photo {
    height: 28.125rem;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.blog-article--photo img {
    -o-object-fit: cover;
    height: 100%;
    object-fit: cover;
    transition: all .4s;
    width: 100%;
}

.blog-article--photo:hover img {
    transform: scale(1.1, 1.1);
}

.blog-article-box-top {
    height: 40%;
    left: -1.25rem;
    position: absolute;
    top: 1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.blog-article-box-bottom {
    bottom: -.625rem;
    height: 60%;
    position: absolute;
    right: -1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.blog-article--job-title {
    font-size: 1.5rem;
}

.no-transition:hover img {
    transition: none;
    transform: none;
}



/******************************************************************************/
/****** Services article                                                 ******/
/******************************************************************************/

.services-article {
    display: grid;
    gap: 3.125rem;
    grid-template-areas: "bio" "photo";
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    margin: 0 auto;
    max-width: 48rem;
    padding: 6.25rem 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .services-article {
        grid-template-areas: "bio" "photo";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        row-gap: 1.25rem;
        padding: 6.25rem 2.5rem;
    }
}

.services-article--wrapper {
    position: relative;
    width: 100%;
}

.services-article--bio {
    grid-area: bio;
    max-width: 48rem;
    padding: 0 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .services-article--bio {
        margin-top: 0;
        padding: 0;
    }
}

.services-article--photo--wrapper {
    grid-area: photo;
}

@media (max-width:48em) {
    .services-article--photo--wrapper {
        margin: 0 1.25rem;
    }
}

.services-article--photo {
    height: fit-content;
    position: relative;
}

.services-article--photo img {
    height: auto;
    width: 100%;
}

.services-article-box-top {
    height: 40%;
    left: -1.25rem;
    position: absolute;
    top: 1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.services-article-box-bottom {
    bottom: -.625rem;
    height: 60%;
    position: absolute;
    right: -1.25rem;
    width: 1.25rem;
    z-index: 1;
}

.services-article--job-title {
    font-size: 1.5rem;
}



/****** Price list ******/

.price-list--wrapper {
    padding: 3.125rem 0
}

.price-list {
    width: 100%;
}

.price-list--item {
    vertical-align: top;
    width: 75%;
}

@media (max-width:48em) {
    .price-list--item {
        width: 60%;
    }
}

.price-list--price {
    font-size: 1.25rem;
    vertical-align: top;
    text-align: right;
    width: 25%;
}

@media (max-width:48em) {
    .price-list--price {
        width: 40%;
    }
}

.price-list--description {
    padding: 0 0 1.25rem 0;
}

.price-list--nav {
    padding: 1.25rem 1.25rem 0 1.25rem;
    text-align: center;
    width: 100%;
}

.price-list--button {
    background-color: rgba(197, 190, 183, 1);
    color: rgba(26, 33, 34, 1);
    cursor: pointer;
    display: inline-block;
    font-size: .875rem;
    margin: 0 .625rem 1.25rem .625rem;
    min-width: 6.25rem;
    max-width: 12.5rem;
    padding: .625rem 1.25rem;
    text-transform: uppercase;
    transition: all .4s;
    width: 100%;
}

.price-list--button:hover {
    background-color: rgba(26, 33, 34, 1);
    color: rgba(197, 190, 183, 1);
}

.price-list-nav--header {
    font-size: .875rem;
    text-transform: uppercase;
}

.price-list--button-inactive {
    background-color: transparent;
    border: .0625rem solid rgba(197, 190, 183, 1);
    color: rgba(26, 33, 34, 1);
    cursor: pointer;
    display: inline-block;
    font-size: .875rem;
    margin: 0 .625rem 1.25rem .625rem;
    min-width: 6.25rem;
    max-width: 12.5rem;
    padding: .625rem 1.25rem;
    text-transform: uppercase;
    transition: all .4s;
    width: 100%;
}

.price-list--button-inactive:hover {
    border: .0625rem solid rgba(26, 33, 34, 1);
    background-color: rgba(26, 33, 34, 1);
    color: rgba(197, 190, 183, 1);
}



/******************************************************************************/
/****** Pop-up                                                           ******/
/******************************************************************************/

.pop-up {
    border: .0625rem solid rgba(244, 245, 241, 1);
    left: 50%;
    padding: 2.25rem;
    position: fixed;
    text-align: center;
    transform: translate(-50%, -50%);
    top: 50%;
    width: 50%;
    z-index: 10;
}

@media (max-width:48em) {
    .pop-up {
        width: 90%;
    }
}

.pop-up--strapline {
    font-size: .875rem;
    padding: 0 0 1.25rem 0;
    text-transform: uppercase;
}

.pop-up--description {
    font-size: .875rem;
    padding: 0 0 1.25rem 0;
}

.pop-up--footer {
    font-size: .875rem;
}

.pop-up--close {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 1.125rem;
    box-sizing: border-box;
    cursor: pointer;
    font-family: arial, sans-serif;
    font-size: 1.0625rem;
    font-weight: 700;
    height: 2.25rem;
    line-height: 2.25rem;
    position: absolute !important;
    left: -0.625rem !important;
    text-align: center;
    text-transform: uppercase;
    top: -0.625rem !important;
    transition: all .4s;
    vertical-align: middle;
    width: 2.25rem;
    z-index: 11;
}

.pop-up--close {
    display: block;
    left: 0.0625rem;
    position: relative;
}

.pop-up--close-x svg {
    fill: rgba(26, 33, 34, 1);
    height: 1rem;
    margin: auto;
    position: relative;
    top: .625rem;
    width: 1rem;
}

.pop-up--close:hover {
    background-color: rgba(26, 33, 34, 1);
}

.pop-up--close:hover .pop-up--close-x svg {
    fill: rgba(255, 255, 255, 1);
}



/***********************************************************************************/
/****** Make a booking                                                        ******/
/***********************************************************************************/

.booking-panel {
    display: block;
    margin: 0 auto;
    max-width: 75rem;
    padding: 3.125rem 1.25rem 6.25rem 1.25rem;
    width: 100%;
}

@media (max-width:48em) {
    .booking-panel {
        border: 0;
        display: block;
    }
}

.booking-confirmation-panel {
    display: block;
    margin: 0 auto;
    max-width: 48rem;
    width: 100%;
}

.confirmation-box {
    padding: 0 1.25rem 3.125rem 1.25rem;
}

.form-button {
    margin: 2.25rem auto 0 auto;
}

.booking-panel--box {
    display: grid;
    grid-column-gap: 3.125rem;
    grid-row-gap: 1.25rem;
    grid-template-areas:
        "header header"
        "column-1 column-2"
        "footer footer";
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    padding: .625rem;
}

@media (max-width:48em) {
    .booking-panel--box {
        grid-row-gap: 1.25rem;
        grid-template-areas:
            "header"
            "column-1"
            "column-2"
            "footer";
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
}

.booking-panel--column-1 {
    grid-area: column-1;
}

.booking-panel--column-2 {
    grid-area: column-2;
}

@media (max-width:48em) {
    .booking-panel--column-2 {
        grid-area: column-2;
    }
}

.booking-panel--form-box {
    display: block;
    font-size: 1rem;
    font-weight: 300;
    padding: .625rem;
    width: 100%;
}

.booking-panel--label {
    padding: 0 .625rem 0 0;
}

.booking-panel--pointer {
    fill: rgba(255, 255, 255, 1);
    height: .625rem;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: -.625rem;
    width: .625rem;
}

.salon-appointments {
    background: rgba(255, 255, 255, 1);
    position: relative;
    text-align: center;
}

.service--salon,
.service--barbers,
.service--nail-bar,
.service--time,
.service--treatments {
    width: 100%;
}

.salon-appointments--nail-bar {
    display: none;
}

.salon-appointments--barbers {
    display: none;
}

.salon-appointments--salon {
    display: block;
}

.salon-appointments--treatments {
    display: none;
}

.form--date {
    background: #FFF url('/assets/images/calendar.svg') !important;
    background-repeat: no-repeat !important;
    background-size: 1.25rem !important;
    background-position: 98% 50% !important;
}

.form--label {
    display: block;
    font-weight: 300;
    margin: 1.25rem 0 0 0;
}

.instagram-wall {
    margin: 0 auto;
    max-width: 75rem;
    padding: 0 1.25rem;
    width: 100%;
}