﻿@charset "UTF-8";

/* –––––––––––––––––––––––––––––––––––––––––––––––––– 
ZIPPORAH - GENERIC SYSTEM - Updated 22nd September 2022
ZIPPORAH BASE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* –––––––––––––––––––––––––––––––––––––––––––––––––– 
STYLE VARIABLES - Add client specific colours here
–––––––––––––––––––––––––––––––––––––––––––––––––– */
:root {
    --black: #333;
    --white: #fafafa;
    --grey: #e3e3e3;
    --primary-colour: #3C8067;
    --primary-colour-dark: #2c634f;
    --primary-colour-light: #468b72;
    --site-header-colour: var(--primary-colour);
    --breadcrumb-bk: #E5E5E5;
    --hero-area-colour: #EBEBEB;
    --hero-area-border-colour: #d4d4d4;
    --hero-area-text-colour: white;
    --primary-button-bk: var(--primary-colour);
    --primary-button-text: var(--white);
    --primary-button-hover-bk: #3c3c3b;
    --primary-button-hover-text: var(--white);
    --reverse-button-bk: var(--white);
    --reverse-button-hover-bk: #3c3c3b;
    --reverse-button-text: var(--primary-colour);
    --reverse-button-hover-text: var(--white);
    --headings-colour: var(--primary-colour);
    --links-colour: var(--primary-colour);
    --links-hover-colour: var(--primary-colour);
    --link-focus-colour: #009ace;
    --background-colour: #FBFBFB;
    --input-bk: #fefefe;
    --primary-grey: #EBEBEB;
    --primary-grey-dark: #3c3c3b;
    --primary-green: #008764;
    --primary-danger: #C51A4B;
    --primary-danger-dark: #790a29;
    --accordion-border-color: #ebebeb;
    --accordion-border-color-active: var(--primary-colour);
    --input-file-grey-hover: #ddd;
    --table-mobile-top-cell-bk: #ddd;
    --table-button-bk: var(--table-mobile-top-cell-bk);
    /* –––––––––––––––––––––––––––––––––––––––––––––––––– 
  DATEPICKER STYLING
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
    --datepicker-default-bk: var(--primary-colour-light);
    --datepicker-default-text: var(--black);
    --datepicker-hover-bk: var(--primary-colour-light);
    --datepicker-hover-text: var(--white);
    --datepicker-active-bk: var(--primary-colour);
    --datepicker-active-text: #fafafa;
    --datepicker-active-border: solid 1px var(--primary-colour);
    --datepicker-header-bk: var(--primary-colour);
    --datepicker-highlight-bk: var(--hero-area-colour);
    --datepicker-highlight-border: solid 1px var(--hero-area-border-colour);
    --datepicker-highlight-text: var(--primary-colour);
    /* –––––––––––––––––––––––––––––––––––––––––––––––––– 
    /* MAIN SITE MENU
    /* –––––––––––––––––––––––––––––––––––––––––––––––––– */
    --menu-background-colour: #222;
    --menu-link-colour: var(--white);
    --menu-links-hover-colour: rgba(255, 255, 255, 0.3);
    /* –––––––––––––––––––––––––––––––––––––––––––––––––– 
  FONT STACK
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
    --font-stack: 'Roboto', sans-serif;
}

html {
    font-size: 100%;
    line-height: 1.5em;
}

body {
    scroll-behavior: smooth;
}

/*MEYER RESET
-------------------------------------------------- */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
.site-header .account .account-details label,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

figure {
    margin: 0;
}

figure img {
    width: 100%;
    position: relative;
    object-fit: cover;
}

*,
*:before,
*:after {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

* {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
}

/*Bedford Custom Fonts 
/* -------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=OpenSans:wght@400;700&display=swap');


/*FONT SMOOTHING*/
/* -------------------------------------------------- */
* {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

/*SKIP LINK*/
/* -------------------------------------------------- */
.zip-skip-to-content-link {
    background: var(--primary-colour);
    height: 30px;
    left: 50%;
    padding: 8px;
    position: absolute;
    transform: translateY(-100%);
    transition: transform 0.3s;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: -9999;
}

.zip-skip-to-content-link:focus {
    transform: translateY(0%);
}


/*GRID SYSTEM 
/* -------------------------------------------------- */
html {
    scroll-behavior: smooth;
    font-size: 100%;
    display: flex;
    flex-direction: column;
}

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

body {
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    /* Change default typefaces here */
    font-size: 16px;
    line-height: 24px;
    font-family: var(--font-stack);
    color: var(--black);
    background: var(--background-colour);
    min-height: 100vh;
    width: 100%;
    flex-direction: column;
}

.wrap {
    width: 100%;
    margin: 0 auto;
    max-width: 75rem;
    position: relative;
    padding: 0 16px;
    overflow: hidden;
}

.site-header,
.site-footer {
    flex-shrink: 0;
}

.site-footer {
    margin-top: 100px;
}

.site-content {
    flex-grow: 1;
    display: flex;
    flex-flow: column;
}

.grid {
    display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
}

section {
    display: block;
    position: relative;
    overflow: hidden;
}

.row.align-center {
    align-items: center !important;
}

.row .full-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.row-spacebetween {
    justify-content: flex-start;
    display: flex;
    align-items: center;
    flex-flow: column;
}

.row-spacebetween button,
.row-spacebetween input[type="submit"] {
    width: 100%;
}

@media screen and (min-width:600px) {
    .row-spacebetween {
        flex-flow: row;
        justify-content: space-between;
    }

    .row-spacebetween button,
    .row-spacebetween input[type="submit"] {
        width: auto;
    }
}

.button-row {
    margin-top: 1.5rem;
}

/* -------------------------------------------------- */
/* GENERAL TYPOGRAPHY TWEAKS
/* -------------------------------------------------- */
.letter-nudge,
.zeta {
    letter-spacing: -0.018rem;
}

.zeta {
    font-size: 75px;
    font-size: 4.6875rem;
    line-height: 78px;
    line-height: 4.875rem;
    margin: 1.5rem 0 3rem 0;
}

.epsilon,
section.success .alert.success h2:before,
.hero-header,
.h1 {
    font-size: 45px;
    font-size: 2.8125rem;
    line-height: 48px;
    line-height: 3rem;
    margin: 1.5rem 0;
}

@media screen and (max-width: 700px) {

    .epsilon,
    section.success .alert.success h2:before,
    .hero-header,
    .h1 {
        font-size: 2rem;
    }
}

.delta,
.h2 {
    font-size: 27px;
    font-size: 1.6875rem;
    line-height: 30px;
    line-height: 1.875rem;
    margin: 1.5rem 0;
}

.gamma,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header h2,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .h2,
.rooms-card-list .card-footer label:before,
.appointment-types-area .appointment-types-list .card-header,
.alert h3,
form label.error h3,
.h3 {
    font-size: 21px;
    font-size: 1.3125rem;
    line-height: 24px;
    line-height: 1.5rem;
    margin: 1.5rem 0;
}

.beta,
.card-list .card-header,
.h4,
.h5,
.h6 {
    font-size: 16px;
    font-size: 1rem;
    line-height: 18px;
    line-height: 1.125rem;
    margin: 1.5rem 0;
}

.alpha {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 16px;
    line-height: 1rem;
    margin: 1.5rem 0;
}

/* -------------------------------------------------- */
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
    color: var(--links-colour);
}

a:hover {
    color: var(--links-hover-colour);
}

a:active {
    outline: 2px solid var(--link-focus-colour);
}

.site-header a {
    color: white;
}

.menu-items a,
.user-controls ul a,
.menu-toggle a {
    color: white !important;
}



/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items label,
.day-list input:checked+label,
.day-list label,
.rooms-card-list .card-footer label,
button,
input[type=submit],
input[type=reset],
input[type=button],
.card-footer .input-group label,
.checkboxToButton label {
    font-family: var(--font-stack);
    display: inline-block;
    height: 38px;
    padding: 0 30px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 38px;
    text-decoration: none;
    white-space: nowrap;
    background-color: var(--primary-button-bk);
    border-radius: 0px;
    color: var(--primary-button-text);
    border: var(--primary-button-bk);
    cursor: pointer;
    box-sizing: border-box;
    transition: all 0.25s ease;
    border: 0;
    box-sizing: border-box;
}

.button:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:hover,
section.confirmationPayment .payment-method-select-items label:hover,
.day-list input:checked+label:hover,
.day-list label:hover,
.rooms-card-list .card-footer label:hover,
.button:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:focus,
section.confirmationPayment .payment-method-select-items label:focus,
.day-list input:checked+label:focus,
.day-list label:focus,
.rooms-card-list .card-footer label:focus,
button:hover,
button:focus,
input[type=submit]:hover,
input[type=submit]:focus,
input[type=reset]:hover,
input[type=reset]:focus,
input[type=button]:hover,
input[type=button]:focus {
    background-color: var(--primary-button-hover-bk);
    color: var(--primary-button-hover-text);
    text-decoration: none;
    outline: 0;
    transition: all 0.25s ease;
}

.button:active,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:active,
section.confirmationPayment .payment-method-select-items label:active,
.day-list input:checked+label:active,
.day-list label:active,
.rooms-card-list .card-footer label:active,
button:active,
input[type=submit]:active,
input[type=reset]:active,
input[type=button]:active,
.checkboxToButton label:active {
    outline: 2px solid var(--link-focus-colour);
}

.button:disabled,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:active,
section.confirmationPayment .payment-method-select-items label:active,
.day-list input:checked+label:active,
.day-list label:active,
.rooms-card-list .card-footer label:active,
button:disabled,
input[type=submit]:disabled,
input[type=reset]:disabled,
input[type=button]:disabled,
.checkboxToButton label:disabled {
    background-color: var(--hero-area-colour);
    background-color: var(--hero-area-border-colour);
}

.button.button-primary,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items label.button-primary,
.day-list input:checked+label,
.day-list label.button-primary,
section.confirmationPayment .payment-method-select-items .day-list input[type=radio]:checked~label,
.rooms-card-list .card-footer label.button-primary,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer input[type=radio]:checked~label,
.day-list .rooms-card-list .card-footer input:checked+label,
button.button-primary,
.appointment .toolbar .datepicker-col button,
input[type=submit].button-primary,
input[type=reset].button-primary,
input[type=button].button-primary {
    color: var(--primary-button-text);
    background-color: var(--primary-button-bk);
    border-color: var(--primary-button-bk);
}

.button.button-primary:disabled,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items label.button-primary,
.day-list label.button-primary,
section.confirmationPayment .payment-method-select-items .day-list input[type=radio]:checked~label,
.rooms-card-list .card-footer label.button-primary,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer input[type=radio]:checked~label,
.day-list .rooms-card-list .card-footer input:checked+label,
button.button-primary:disabled,
.appointment .toolbar .datepicker-col button,
input[type=submit].button-primary:disabled,
input[type=reset].button-primary:disabled,
input[type=button].button-primary:disabled {
    background-color: var(--hero-area-colour);
    background-color: var(--hero-area-border-colour);
    border-color: transparent;
}

.day-list input:checked+label{
    background-color: var(--primary-button-bk);
    color: var(--primary-button-text) !important;
}

.button.button-primary:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:hover,
section.confirmationPayment .payment-method-select-items label.button-primary:hover,
.day-list label.button-primary:hover,
section.confirmationPayment .payment-method-select-items .day-list input[type=radio]:checked~label:hover,
.day-list input:checked+label:hover,
.rooms-card-list .card-footer label.button-primary:hover,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer input[type=radio]:checked~label:hover,
.day-list .rooms-card-list .card-footer input:checked+label:hover,
.button.button-primary:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:focus,
section.confirmationPayment .payment-method-select-items label.button-primary:focus,
.day-list label.button-primary:focus,
section.confirmationPayment .payment-method-select-items .day-list input[type=radio]:checked~label:focus,
.day-list input:checked+label:focus,
.rooms-card-list .card-footer label.button-primary:focus,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer input[type=radio]:checked~label:focus,
.day-list .rooms-card-list .card-footer input:checked+label:focus,
button.button-primary:hover,
.appointment .toolbar .datepicker-col button:hover,
button.button-primary:focus,
.appointment .toolbar .datepicker-col button:focus,
input[type=submit].button-primary:hover,
input[type=submit].button-primary:focus,
input[type=reset].button-primary:hover,
input[type=reset].button-primary:focus,
input[type=button].button-primary:hover,
input[type=button].button-primary:focus {
    background-color: var(--primary-button-hover-bk);
    color: var(--primary-button-hover-text);
    text-decoration: none;
    outline: 0;
    transition: all 0.25s ease;
}


.button.button-primary-reverse,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-primary-reverse,
section.confirmationPayment .payment-method-select-items label,
.day-list input:checked+label.button-primary-reverse,
.day-list label,
.rooms-card-list .card-footer label.button-primary-reverse,
.rooms-card-list .card-footer .day-list label,
.day-list .rooms-card-list .card-footer label,
button.button-primary-reverse,
input[type=submit].button-primary-reverse,
input[type=reset].button-primary-reverse,
input[type=button].button-primary-reverse,
.checkboxButtonReverse label {
    color: var(--primary-colour) !important;
    background-color: var(--white);
    border: 1px solid var(--primary-colour);
}

.button.button-primary-reverse:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-primary-reverse:hover,
section.confirmationPayment .payment-method-select-items label:hover,
.day-list input:checked+label.button-primary-reverse:hover,
.day-list label:hover,
.rooms-card-list .card-footer label.button-primary-reverse:hover,
.button.button-primary-reverse:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-primary-reverse:focus,
section.confirmationPayment .payment-method-select-items label:focus,
.day-list input:checked+label.button-primary-reverse:focus,
.day-list label:focus,
.rooms-card-list .card-footer label.button-primary-reverse:focus,
button.button-primary-reverse:hover,
button.button-primary-reverse:focus,
input[type=submit].button-primary-reverse:hover,
input[type=submit].button-primary-reverse:focus,
input[type=reset].button-primary-reverse:hover,
input[type=reset].button-primary-reverse:focus,
input[type=button].button-primary-reverse:hover,
input[type=button].button-primary-reverse:focus {
    color: var(--black);
    border-color: var(--white);
    background-color: var(--white);
}

.checkboxButtonReverse label:hover,
.checkboxButtonReverse label:focus {
    color: var(--black);
    border-color: var(--white);
    background-color: var(--primary-grey);
}

.button.button-secondary,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-secondary,
section.confirmationPayment .payment-method-select-items label.button-secondary,
.day-list input:checked+label.button-secondary,
.day-list label.button-secondary,
.rooms-card-list .card-footer label.button-secondary,
button.button-secondary,
input[type=submit].button-secondary,
input[type=reset].button-secondary,
input[type=button].button-secondary {
    color: #FFF;
    background-color: #DF3601;
    border-color: #DF3601;
}

.button.button-secondary:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-secondary:hover,
section.confirmationPayment .payment-method-select-items label.button-secondary:hover,
.day-list label.button-secondary:hover,
.rooms-card-list .card-footer label.button-secondary:hover,
.button.button-secondary:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-secondary:focus,
section.confirmationPayment .payment-method-select-items label.button-secondary:focus,
.day-list label.button-secondary:focus,
.rooms-card-list .card-footer label.button-secondary:focus,
button.button-secondary:hover,
button.button-secondary:focus,
input[type=submit].button-secondary:hover,
input[type=submit].button-secondary:focus,
input[type=reset].button-secondary:hover,
input[type=reset].button-secondary:focus,
input[type=button].button-secondary:hover,
input[type=button].button-secondary:focus {
    color: #FFF;
    background-color: #951800;
    border-color: #951800;
}

.button.button-danger,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-danger,
section.confirmationPayment .payment-method-select-items label.button-danger,
.day-list input:checked+label.button-danger,
.day-list label.button-danger,
.rooms-card-list .card-footer label.button-danger,
button.button-danger,
input[type=submit].button-danger,
input[type=reset].button-danger,
input[type=button].button-danger {
    color: #FFF;
    background-color: #C51A4B;
    border: 1px solid #C51A4B;
}

.button.button-danger:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-danger:hover,
section.confirmationPayment .payment-method-select-items label.button-danger:hover,
.day-list label.button-danger:hover,
.rooms-card-list .card-footer label.button-danger:hover,
.button.button-danger:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-danger:focus,
section.confirmationPayment .payment-method-select-items label.button-danger:focus,
.day-list label.button-danger:focus,
.rooms-card-list .card-footer label.button-danger:focus,
button.button-danger:hover,
button.button-danger:focus,
input[type=submit].button-danger:hover,
input[type=submit].button-danger:focus,
input[type=reset].button-danger:hover,
input[type=reset].button-danger:focus,
input[type=button].button-danger:hover,
input[type=button].button-danger:focus {
    color: #FFF;
    background-color: var(--primary-danger-dark);
    border-color: var(--primary-danger-dark);
}

.button.button-success,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-success,
section.confirmationPayment .payment-method-select-items label.button-success,
.day-list input:checked+label.button-success,
.day-list label.button-success,
.rooms-card-list .card-footer label.button-success,
button.button-success,
input[type=submit].button-success,
input[type=reset].button-success,
input[type=button].button-success {
    color: #FFF;
    background-color: #008764;
    border-color: #008764;
}

.button.button-success:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-success:hover,
section.confirmationPayment .payment-method-select-items label.button-success:hover,
.day-list label.button-success:hover,
.rooms-card-list .card-footer label.button-success:hover,
.button.button-success:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-success:focus,
section.confirmationPayment .payment-method-select-items label.button-success:focus,
.day-list label.button-success:focus,
.rooms-card-list .card-footer label.button-success:focus,
button.button-success:hover,
button.button-success:focus,
input[type=submit].button-success:hover,
input[type=submit].button-success:focus,
input[type=reset].button-success:hover,
input[type=reset].button-success:focus,
input[type=button].button-success:hover,
input[type=button].button-success:focus {
    color: #FFF;
    background-color: #006C50;
    border-color: #006C50;
}

.button.button-warning,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-warning,
section.confirmationPayment .payment-method-select-items label.button-warning,
.day-list input:checked+label.button-warning,
.day-list label.button-warning,
.rooms-card-list .card-footer label.button-warning,
button.button-warning,
input[type=submit].button-warning,
input[type=reset].button-warning,
input[type=button].button-warning {
    color: #474747;
    background-color: #FAB400;
    border-color: #FAB400;
}

.button.button-warning:hover,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-warning:hover,
section.confirmationPayment .payment-method-select-items label.button-warning:hover,
.day-list label.button-warning:hover,
.rooms-card-list .card-footer label.button-warning:hover,
.button.button-warning:focus,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.button-warning:focus,
section.confirmationPayment .payment-method-select-items label.button-warning:focus,
.day-list label.button-warning:focus,
.rooms-card-list .card-footer label.button-warning:focus,
button.button-warning:hover,
button.button-warning:focus,
input[type=submit].button-warning:hover,
input[type=submit].button-warning:focus,
input[type=reset].button-warning:hover,
input[type=reset].button-warning:focus,
input[type=button].button-warning:hover,
input[type=button].button-warning:focus {
    color: #474747;
    background-color: #C89000;
    border-color: #C89000;
}

.button svg,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label svg,
section.confirmationPayment .payment-method-select-items label svg,
.day-list input:checked+label svg,
.day-list label svg,
.rooms-card-list .card-footer label svg,
button svg {
    display: inline;
    margin: 0 0.25rem;
}

button:disabled,
input:disabled,
button[disabled],
input[disabled] {
    pointer-events: none;
    opacity: 0.5;
}


/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type=email],
input[type=number],
input[type=search],
input[type=text],
input[type=tel],
input[type=url],
input[type=time],
input[type=password],
textarea,
select {
    height: auto;
    padding: 8px 16px;
    /* The 6px vertically centers text on FF, ignored by Webkit */
    background-color: var(--input-bk);
    border: 1px solid #D1D1D1;
    border-radius: 0px;
    box-shadow: none;
    box-sizing: border-box;
    font-size: 16px;
    font-family: var(--font-stack);
}

/* Removes awkward default styles on some inputs for iOS */
input[type=email],
input[type=number],
input[type=search],
input[type=text],
input[type=time],
input[type=tel],
input[type=url],
input[type=password],
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

textarea {
    min-height: 65px;
    padding: 16px;
}

input[type=email]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=text]:focus,
input[type=time]:focus,
input[type=tel]:focus,
input[type=url]:focus,
input[type=password]:focus,
textarea:focus,
select:focus {
    border: 1px solid var(--primary-colour);
    outline: 0;
}

label,
legend {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

fieldset {
    padding: 0;
    border-width: 0;
}

input[type=checkbox],
input[type=radio] {
    display: inline;
}

label>.label-body {
    display: inline-block;
    margin-left: 0.5rem;
    font-weight: normal;
}

p,
.site-header .account .account-details label {
    text-align: left;
}

p.lead,
.site-header .account .account-details label.lead {
    font-weight: 600;
    color: var(--primary-colour);
}

.input-group {
    display: flex;
    flex-direction: column;
    position: relative;
}

@media (min-width: 768px) {
    .input-group {
        flex-direction: row;
        align-items: center;
    }
}

.input-group.onerow {
    flex-direction: row;
}

.input-group input[type=email],
.input-group input[type=number],
.input-group input[type=search],
.input-group input[type=text],
.input-group input[type=tel],
.input-group input[type=time],
.input-group input[type=url],
.input-group input[type=password] {
    flex-grow: 1;
}

@media screen and (max-width: 943px) {

    .input-group input[type=email],
    .input-group input[type=number],
    .input-group input[type=search],
    .input-group input[type=text],
    .input-group input[type=time],
    .input-group input[type=tel],
    .input-group input[type=url],
    .input-group input[type=password] {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media screen and (max-width: 765px) {

    .input-group input[type=email],
    .input-group input[type=number],
    .input-group input[type=search],
    .input-group input[type=text],
    .input-group input[type=time],
    .input-group input[type=tel],
    .input-group input[type=url],
    .input-group input[type=password] {
        flex: 100% 100% auto;
        flex-basis: 100%;
        width: 100%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.input-group button,
.input-group .button,
.input-group section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .input-group input[type=radio]:checked~label,
.input-group section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .input-group label,
.input-group .day-list input:checked+label,
.day-list .input-group input:checked+label,
.input-group .day-list label,
.day-list .input-group label,
.input-group .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .input-group label,
.input-group input[type=submit] {
    margin-bottom: 0 !important;
    width: 100%;
}

@media (min-width: 768px) {

    .input-group button,
    .input-group .button,
    .input-group section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .input-group input[type=radio]:checked~label,
    .input-group section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .input-group label,
    .input-group .day-list input:checked+label,
    .day-list .input-group input:checked+label,
    .input-group .day-list label,
    .day-list .input-group label,
    .input-group .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .input-group label,
    .input-group input[type=submit] {
        margin-left: 1em;
        width: auto;
    }
}

.input-group input[type=checkbox],
.input-group input[type=radio],
.checkboxToButton input[type=checkbox] {
    display: inline-block;
    margin-right: 0.5rem;
    margin-bottom: 0.5rem;
    width: auto !important;
}

.input-group input[type=checkbox]~label,
.input-group input[type=radio]~label,
.checkboxToButton input[type=checkbox]~label {
    flex-grow: 1;
    font-weight: 400;
}

.toolbar .input-group.columns {
    flex-direction: row !important;
}

.input-group input[type=checkbox] {
    margin-bottom: 0.5rem !important;
}

.checkbox-row {
    margin: 1.5rem 0;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.checkbox-row .input-group {
    background: var(--hero-area-colour);
    padding: 0.75rem;
    flex-flow: row nowrap;
    border-radius: 0px;
}

.checkbox-row label {
    margin: 0;
}

form .row {
    align-items: flex-start;
}

form .form-control.error {
    border: 1px solid #C51A4B;
    background-color: #F3D1DB;
}

form .form-half-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

@media (min-width: 768px) {
    form .form-half-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

form .form-two-col input,
form .form-two-col select,
form .form-half-col input,
form .form-half-col select,
form .form-four-col input,
form .form-four-col select,
form .form-five-col input,
form .form-five-col select,
form .form-full-col input,
form .form-full-col select {
    width: 100%;
}

form .form-full-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

form .form-two-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    form .form-two-col {
        flex: 16.667% 16.667% auto;
        flex-basis: 16.667%;
        width: 16.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

form .form-four-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    form .form-four-col {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

form .form-five-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    form .form-five-col {
        flex: 41.667% 41.667% auto;
        flex-basis: 41.667%;
        width: 41.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

form .form-group {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

form .form-full-col table td,
form .form-full-col table th {
    border: 0px solid #fff;
}

.number-entry {
    flex-direction: row;
    align-items: center;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .number-entry {
        margin-bottom: 0;
    }
}

.number-entry input.button-minus,
.number-entry input.button-plus {
    border-radius: 30px;
    padding: 0 16px;
    width: 41px;
    margin-bottom: 0;
}

.number-entry input[type=number] {
    margin: 0 16px;
    flex-grow: 0;
    width: 100px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Select Boxes
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.form-select,
.date-select-wrap input[type="text"],
.search-input-wrap input[type="search"] {
    appearance: none;
    background-color: transparent;
    border: none;
    margin: 0;
    width: 100%;
    font-family: inherit;
    font-size: inherit;
    cursor: inherit;
    line-height: inherit;
    z-index: 1;
    color: var(--black);
}

.form-select,
.date-select-wrap input[type="text"] {
    padding: 0 1.5rem 0 0;
}

.search-input-wrap input[type="search"] {
    padding: 0 0 0 2rem;
}

.form-select:focus,
.date-select-wrap input[type="text"]:focus,
.search-input-wrap input[type="search"]:focus {
    border: 0px solid white;
    outline: 0;
    color: var(--black) !important;
}

.form-select[multiple],
.form-select[size]:not([size="1"]) {
    padding-right: 10px;
    background-image: none;
}

.form-select:disabled,
.date-select-wrap input[type="text"]:disabled,
.search-input-wrap input[type="search"]:disabled {
    opacity: 0.5;
}

.form-select:-moz-focusring,
.date-select-wrap input[type="text"]:-moz-focusring,
.search-input-wrap input[type="search"]:-moz-focusring {
    color: transparent;
}

.form-select-wrap,
.date-select-wrap,
.search-input-wrap {
    display: flex;
    flex-flow: row;
    width: 100%;
    padding: 8px 16px;
    /* The 6px vertically centers text on FF, ignored by Webkit */
    font-size: 16px;
    font-family: var(--font-stack);
    color: #474747;
    background-color: var(--input-bk);
    background-repeat: no-repeat;
    border: 1px solid #D1D1D1;
    appearance: none;
    border-radius: 0px;
    position: relative;
    overflow: hidden;
    margin: 0;
    height: auto;
    cursor: pointer;
}

.form-select-wrap:focus-within,
.date-select-wrap:focus-within,
.search-input-wrap:focus-within {
    border: 1px solid var(--primary-colour);
    color: var(--black) !important;
}

.form-select-wrap:after,
.date-select-wrap:after,
.search-input-wrap:before {
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 18px;
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    color: var(--primary-colour);
    position: absolute;
    z-index: 0;
    cursor: pointer;
}

.form-select-wrap:after,
.date-select-wrap:after {
    right: 8px;
}

.search-input-wrap:before {
    left: 8px;
}


.form-select-wrap:after {
    content: "";
}

.date-select-wrap:after {
    content: "\f073";
}

.search-input-wrap:before {
    content: "\f002";
}

/*–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
    list-style: disc inside;
}

ol {
    list-style: decimal inside;
}

ol,
ul {
    padding-left: 0;
    margin: 1.5rem 0;
}

ul ul,
ul ol,
ol ol,
ol ul {
    margin-top: 0;
    margin-bottom: 0;
}

ul li,
ol li {
    vertical-align: baseline;
}

.list-group,
.site-header .account .user-account-menu .menu-items {
    display: flex;
    flex-direction: column;
}

.list-group-item,
.appointment-types-area .appointment-types-list .appointment-subtype {
    position: relative;
    display: block;
    padding: 0.5rem 0.25rem;
    text-decoration: none;
}

.list-group-item.active,
.appointment-types-area .appointment-types-list .active.appointment-subtype {
    z-index: 2;
    color: #fff;
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.list-group-item.disabled,
.appointment-types-area .appointment-types-list .disabled.appointment-subtype,
.list-group-item:disabled,
.appointment-types-area .appointment-types-list .appointment-subtype:disabled {
    color: #6c757d;
    pointer-events: none;
    background-color: #fff;
}

.list-group-item-action,
.site-header .account .user-account-menu .menu-items li {
    width: 100%;
    color: var(--primary-colour);
    text-align: inherit;
}

.list-group-item-action:hover,
.site-header .account .user-account-menu .menu-items li:hover,
.list-group-item-action:focus,
.site-header .account .user-account-menu .menu-items li:focus {
    z-index: 1;
    color: var(--primary-colour);
    text-decoration: none;
    background-color: var(--hero-area-colour);
}

.list-group-item-action:active,
.site-header .account .user-account-menu .menu-items li:active {
    color: var(--primary-colour);
    background-color: var(--hero-area-colour);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Blockquotes
–––––––––––––––––––––––––––––––––––––––––––––––––– */
blockquote {
    margin: 1.5rem 0;
    background: white;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    display: flex;
    padding: 16px;
    flex-direction: column;
    quotes: "“" "”" "‘" "’";
}

blockquote:before {
    content: open-quote;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
    padding: 0.2rem 0.5rem;
    margin: 0 0.2rem;
    font-size: 90%;
    white-space: nowrap;
    background: #F1F1F1;
    border: 1px solid #E1E1E1;
    border-radius: 4px;
    vertical-align: bottom;
}

pre>code {
    display: block;
    padding: 1rem 1.5rem;
    white-space: pre;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Headings 
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    color: var(--primary-colour);
    font-weight: 700;
    /* Change heading typefaces here */
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
table {
    border-spacing: 0px;
    border-collapse: collapse;
}

th,
td {
    padding: calc(1.75rem/2);
    text-align: left;
    font-size: 16px;
    font-size: 1rem;
    line-height: 16px;
    line-height: 1rem;
    border-bottom: 1px solid var(--hero-area-colour);
}

th:first-child,
td:first-child {
    padding-left: 0;
}

th:last-child,
td:last-child {
    padding-right: 0;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button,
section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items label,
.day-list input:checked+label,
.day-list label,
.rooms-card-list .card-footer label {
    margin-bottom: 1.5rem;
}

input,
textarea,
select,
fieldset {
    margin-bottom: 1.5rem;
}

pre,
blockquote,
dl,
figure,
table,
p,
.site-header .account .account-details label,
ul,
ol,
form {
    margin-bottom: 1.5rem;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
    margin: 1.5rem 0;
    border-width: 0;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Cards
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.card,
.modal .modal-card,
.location-card,
section.login .toolbar-body {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--white);
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
}

.card .card-body,
.card .modal .modal-body,
.modal .card .modal-body,
.modal .modal-card .card-body,
.modal .modal-card .modal-body,
.location-card .card-body,
.location-card .modal .modal-body,
.modal .location-card .modal-body,
section.login .toolbar-body .card-body,
section.login .toolbar-body .modal .modal-body,
.modal section.login .toolbar-body .modal-body {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.5rem;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Cardlist
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.card-list .card,
.card-list .modal .modal-card,
.modal .card-list .modal-card,
.card-list .location-card,
.card-list section.login .toolbar-body,
section.login .card-list .toolbar-body {
    position: relative;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.3), 0 3px 6px rgba(204, 204, 204, 0.22);
    background: #fff;
}

.card-list .card-header {
    text-decoration: none;
    font-weight: 700;
    margin-top: 0;
}

.card-list .card-header a {
    display: flex;
    text-decoration: none;
}

.card-list .card-header a span {
    flex-grow: 1;
}

.card-list .card-list-items {
    list-style: none;
    justify-content: flex-start;
    align-items: stretch;
}

.card-list .card-list-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: stretch;
}

.card-list .card-list-col .card,
.card-list .card-list-col .modal .modal-card,
.modal .card-list .card-list-col .modal-card,
.card-list .card-list-col .location-card,
.card-list .card-list-col section.login .toolbar-body,
section.login .card-list .card-list-col .toolbar-body {
    width: 100%;
}

@media (min-width: 768px) {
    .card-list .card-list-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 1038px) {
    .card-list .card-list-col {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.card-list a:after {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    content: "";
}

.card-list .card a:focus span,
.card-list .modal .modal-card a:focus span,
.modal .card-list .modal-card a:focus span,
.card-list .location-card a:focus span,
.card-list section.login .toolbar-body a:focus span,
section.login .card-list .toolbar-body a:focus span,
.card-list .card:hover a span,
.card-list .modal .modal-card:hover a span,
.modal .card-list .modal-card:hover a span,
.card-list .location-card:hover a span,
.card-list section.login .toolbar-body:hover a span,
section.login .card-list .toolbar-body:hover a span {
    text-decoration: underline;
}

.card-list .card:hover,
.card-list .modal .modal-card:hover,
.modal .card-list .modal-card:hover,
.card-list .location-card:hover,
.card-list section.login .toolbar-body:hover,
section.login .card-list .toolbar-body:hover {
    border: 2px solid var(--primary-colour);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Breadcrumb
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 8px;
    margin-bottom: 1.5rem;
    list-style: none;
    background-color: none;
}

.breadcrumb-item {
    float: left;
    overflow: auto;
    height: auto;
}

.breadcrumb-item+.breadcrumb-item::before {
    display: inline-block;
    padding-right: 8px;
    padding-left: 8px;
    color: var(--primary-colour);
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "";
    font-weight: 900;
    font-family: "Font Awesome 5 Free";
}

.breadcrumb-item+.breadcrumb-item:hover::before {
    text-decoration: underline;
}

.breadcrumb-item+.breadcrumb-item:hover::before {
    text-decoration: none;
}

.breadcrumb-item.active {
    color: #005C7C;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Alerts
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.alert-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.alert,
form label.error {
    position: relative;
    padding: 1.5rem 16px;
    margin-bottom: 1.5rem;
    border-radius: 0px;
    width: 100%;
}

.alert.warning,
form label.warning.error {
    border: 4px solid #FBC333;
    background: #FEF0CC;
}

.alert.warning h3,
form label.warning.error h3 {
    color: #D19909;
}

.alert.success,
form label.success.error {
    border: 4px solid #339F83;
}

.alert.success h3,
form label.success.error h3 {
    color: #097559;
}

.alert.danger,
form label.error {
    border: 4px solid #D1486F;
}

.alert.danger h3,
form label.error h3 {
    color: #A71E45;
}

.alert p:last-child,
.alert .site-header .account .account-details label:last-child,
.site-header .account .account-details .alert label:last-child,
form label.error p:last-child,
form label.error .site-header .account .account-details label:last-child,
.site-header .account .account-details form label.error label:last-child {
    margin: 0;
}

.alert h3,
form label.error h3 {
    margin-top: 0;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*SR Only
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.sr-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.visually-hidden {
    position: absolute;
    left: -100vw !important;
    /* Note, you may want to position the checkbox over top the label and set the opacity to zero instead. It can be better for accessibilty on some touch devices for discoverability. */
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Loading Row
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.loading-row {
    margin: 1.5rem 0;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    text-align: center;
}

.loading-row .loading-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    color: var(--primary-colour);
    text-align: center;
}

.loading-row .loading-col p,
.loading-row .loading-col .site-header .account .account-details label,
.site-header .account .account-details .loading-row .loading-col label {
    margin: 1.5rem 0;
    text-align: center;
    color: var(--black);
    font-weight: 600;
}

.loading-row hr {
    border-bottom: 1px solid #c7c7c7;
}

.loading-row {
    display: none;
}

.loading-row.show {
    display: flex;
}

.loading-row.hide {
    display: none;
}

@media(min-width: 1200px) {
    #Canvasloading.loading-row.show {
        margin-top: 15rem;
    }
}

/*Dynamic Questions
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.dynamic-question {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    display: flex;
    flex-flow: column wrap;
}

.dynamic-question .question_content {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
}

.dynamic-question .form-half-col input[type=button] {
    width: auto !important;
}

.dynamic-question fieldset {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
}

.dynamic-question fieldset .input-group {
    width: 100%;
    flex-flow: row nowrap;
}

.dynamic-question fieldset .form-half-col:last-child {
    margin-top: 1.5rem;
}

.dynamic-question textarea {
    width: 100%;
}


.dynamic-question .form-full-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.dynamic-question .form-half-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .dynamic-question .form-half-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.custom-questions .row .form-full-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Toolbars
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.toolbar {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
}

.toolbar-body {
    margin: 0 16px;
    padding: 1.5rem 16px;
    border-radius: 4px;
    overflow: hidden;
    margin: 0 0 1.5rem 0;
    background: var(--hero-area-colour);
}

.toolbar-body .row {
    align-items: flex-start;
}

.toolbar-body .row .toolbar-full-col,
.tabContent .row .toolbar-full-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.toolbar-body .row .toolbar-half-col,
.tabContent .row .toolbar-half-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .toolbar-body .row .toolbar-half-col,
    .tabContent .row .toolbar-half-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.toolbar-body .row .toolbar-five-col,
.tabContent .row .toolbar-five-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .toolbar-body .row .toolbar-five-col,
    .tabContent .row .toolbar-five-col {
        flex: 41.667% 41.667% auto;
        flex-basis: 41.667%;
        width: 41.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.toolbar-body .row .toolbar-four-col,
.tabContent .row .toolbar-four-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .toolbar-body .row .toolbar-four-col,
    .tabContent .row .toolbar-four-col {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.toolbar-body .row .toolbar-three-col,
.tabContent .row .toolbar-three-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .toolbar-body .row .toolbar-three-col,
    .tabContent .row .toolbar-three-col {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.toolbar-body .row .toolbar-fill-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .toolbar-body .row .toolbar-fill-col {
        flex-grow: 1;
        flex-basis: 0;
        width: auto;
        padding-right: 16px;
        padding-left: 16px;
    }
}


.toolbar-body .row .toolbar-full-col input[type=text],
.toolbar-body .row .toolbar-full-col select,
.toolbar-body .row .toolbar-half-col input[type=text],
.toolbar-body .row .toolbar-half-col select,
.tabContent .row .toolbar-full-col input[type=text],
.tabContent .row .toolbar-full-col select,
.tabContent .row .toolbar-half-col input[type=text],
.tabContent .row .toolbar-half-col select {
    width: 100%;
}

@media (min-width: 768px) {

    .toolbar-body .button,
    .toolbar-body section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .toolbar-body input[type=radio]:checked~label,
    .toolbar-body section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .toolbar-body label,
    .toolbar-body .day-list input:checked+label,
    .day-list .toolbar-body input:checked+label,
    .toolbar-body .day-list label,
    .day-list .toolbar-body label,
    .toolbar-body .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .toolbar-body label,
    .toolbar-body button,
    .toolbar-body p,
    .toolbar-body .site-header .account .account-details label,
    .site-header .account .account-details .toolbar-body label,
    .toolbar-body input {
        margin-bottom: 0;
    }
}

.toolbar-body .button-row span,
.toolbar-body .button-row div {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.toolbar-body .button-row button,
.toolbar-body .button-row .button,
.toolbar-body .button-row section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .toolbar-body .button-row input[type=radio]:checked~label,
.toolbar-body .button-row section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .toolbar-body .button-row label,
.toolbar-body .button-row .day-list label,
.day-list .toolbar-body .button-row label,
.toolbar-body .button-row .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .toolbar-body .button-row label,
.toolbar-body .button-row input[type=submit] {
    margin-bottom: 0 !important;
    width: 100%;
}

@media (min-width: 768px) {

    .toolbar-body .button-row button,
    .toolbar-body .button-row .button,
    .toolbar-body .button-row section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .toolbar-body .button-row input[type=radio]:checked~label,
    .toolbar-body .button-row section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .toolbar-body .button-row label,
    .toolbar-body .button-row .day-list label,
    .day-list .toolbar-body .button-row label,
    .toolbar-body .button-row .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .toolbar-body .button-row label,
    .toolbar-body .button-row input[type=submit] {
        width: auto;
    }
}

.toolbar-body .toolbar-fill-col input[type="text"] {
    width: 100%;
}


/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Rows
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.row {
    align-items: center;
    display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
    overflow: visible;
    position: relative;
    clear: both;
}

.row.row-stretch {
    align-items: stretch;
}

.three-button-row {
    display: flex;
    flex-flow: column;
    justify-content: center;
}


.three-button-row .button,
.three-button-row input {
    margin-left: 0px;
    margin-right: 0px;
}

@media screen and (min-width:600px) {
    .three-button-row {
        flex-flow: row nowrap;
        justify-content: flex-end;
    }

    .three-button-row .button,
    .three-button-row input {
        margin-left: 8px;
        margin-right: 8px;
    }
}

.three-button-row .button:first-child,
.three-button-row input:first-child {
    margin-left: 0;
}

.three-button-row .button:last-child,
.three-button-row input:last-child {
    margin-right: 0;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Accordion Headers
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.accordion-header {
    display: table;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: 100%;
    position: relative;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
}

@media (min-width: 768px) {
    .accordion-header {
        flex-direction: row;
        flex-wrap: nowrap;
    }
}

.accordion-header h2,
.accordion-header h3 {
    position: relative;
    display: table-cell;
    flex-grow: 1;
    max-width: 100%;
    width: 100%;
    text-align: left;
}

.accordion-header button,
.accordion-header .button,
.accordion-header section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .accordion-header input[type=radio]:checked~label,
.accordion-header section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .accordion-header label,
.accordion-header .day-list input:checked+label,
.day-list .accordion-header input:checked+label,
.accordion-header .day-list label,
.day-list .accordion-header label,
.accordion-header .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .accordion-header label {
    margin: 0;
    width: 100%;
}

@media (min-width: 768px) {

    .accordion-header button,
    .accordion-header .button,
    .accordion-header section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .accordion-header input[type=radio]:checked~label,
    .accordion-header section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .accordion-header label,
    .accordion-header .day-list input:checked+label,
    .day-list .accordion-header input:checked+label,
    .accordion-header .day-list label,
    .day-list .accordion-header label,
    .accordion-header .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .accordion-header label {
        width: auto;
    }
}

.accordion-header button.inactiveButton,
.accordion-header .button.inactiveButton,
.accordion-header section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label.inactiveButton,
section.confirmationPayment .payment-method-select-items .accordion-header input[type=radio]:checked~label.inactiveButton,
.accordion-header section.confirmationPayment .payment-method-select-items label.inactiveButton,
section.confirmationPayment .payment-method-select-items .accordion-header label.inactiveButton,
.accordion-header .day-list label.inactiveButton,
.day-list .accordion-header label.inactiveButton,
.accordion-header .rooms-card-list .card-footer label.inactiveButton,
.rooms-card-list .card-footer .accordion-header label.inactiveButton {
    opacity: 0;
    display: none;
}

.accordion-header .show {
    transform: rotate(180deg);
}

.accordion-header.timeslots-header {
    flex-direction: row !important;
}

.accordion-header.timeslots-header h2,
.accordion-header.timeslots-header h3 {
    width: 90% !important;
    flex-grow: 1 !important;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Hero/Breadcrumb Headers
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.hero-area {
    align-items: center;
    padding-bottom: 1.5rem;
}

.hero-area .row {
    align-items: flex-start;
}

.hero-area ol.breadcrumb {
    margin: 0;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    padding-top: 1.5rem;
}

.hero-breadcrumb {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 10;
    padding-bottom: 0px;
    position: inherit;
}

.hero-breadcrumb.fixed-stick {
    /* background: var(--background-colour); */
    box-shadow: 0px 3px 7px #0000007d;
}

.kingston-breadcrumb-wrap {
    margin-left: 5rem;
}

.hero-breadcrumb .row {
    display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
    align-items: flex-start;
    margin-bottom: 0.75rem;
}

@media (min-width: 768px) {
    .hero-breadcrumb .row {
        align-items: center;
    }
}

.hero-breadcrumb .cancel-button-col {
    position: relative;
    padding-right: 16px;
    padding-left: 16px;
    width: auto;
}

.hero-breadcrumb nav {
    position: relative;
    overflow: hidden;
    flex-grow: 1;
    padding-right: 16px;
    padding-left: 16px;
    flex-basis: 0;
    width: auto;
    padding-right: 16px;
    padding-left: 16px;
}

.hero-breadcrumb .cancel-button-col {
    padding-top: 1.5rem;
    text-align: right;
}

.hero-breadcrumb .cancel-button-col .button,
.hero-breadcrumb .cancel-button-col section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .hero-breadcrumb .cancel-button-col input[type=radio]:checked~label,
.hero-breadcrumb .cancel-button-col section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .hero-breadcrumb .cancel-button-col label,
.hero-breadcrumb .cancel-button-col .day-list label,
.day-list .hero-breadcrumb .cancel-button-col label,
.hero-breadcrumb .cancel-button-col .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .hero-breadcrumb .cancel-button-col label {
    margin: 0;
    position: relative;
}

.fixed-stick {
    position: fixed !important;
    width: 100%;
    z-index: 999;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Intro
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.intro-fullwidth,
.intro {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.intro-fullwidth {
    padding: 3rem 16px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Resource Selection
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.resource-selector .resource-selector-header {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.resource-selector .resource-selector-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.resource-selector .resource-selector-list li {
    border-bottom: 1px solid var(--hero-area-border-colour);
    padding: 1rem 0;
}

.resource-selector .resource-selector-list li:last-child {
    border-bottom: 0;
}

.resource-selector .resource-selector-list li .row {
    align-items: stretch;
}

.resource-selector .resource-selector-list .facility-name {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .resource-selector .resource-selector-list .facility-name {
        flex-grow: 1;
        flex-basis: 0;
        width: auto;
    }
}

.resource-selector .resource-selector-list .facility-amount {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-flow: column wrap;
}

.resource-selector .resource-selector-list .facility-amount label {
    flex-basis: 100%;
    text-align: left;
}



@media (min-width: 768px) {
    .resource-selector .resource-selector-list .facility-amount {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
        flex-flow: row wrap;
        justify-content: flex-end;
    }

    .resource-selector .resource-selector-list .facility-amount label {
        text-align: right;
    }
}

.resource-selector .catering-menu-select {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.resource-selector .catering-menu-item {
    flex: 50% 50% auto;
    flex-basis: 50%;
    width: 50%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-direction: column wrap;
}

@media (min-width: 768px) {
    .resource-selector .catering-menu-item {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
        flex-direction: row;
    }
}

.resource-selector .catering-menu-serving-time {
    flex: 60.667% 60.667% auto;
    flex-basis: 60.667%;
    width: 60.667%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .resource-selector .catering-menu-serving-time {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.resource-selector .catering-menu-serving-time input {
    width: 100%;
}

.resource-selector .catering-menu-row-actions {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-end;
    align-items: center;
    flex-grow: 1;
    padding: 0 16px;
}

.resource-selector .catering-menu-row-actions .button,
.resource-selector .catering-menu-row-actions section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .resource-selector .catering-menu-row-actions input[type=radio]:checked~label,
.resource-selector .catering-menu-row-actions section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .resource-selector .catering-menu-row-actions label,
.resource-selector .catering-menu-row-actions .day-list label,
.day-list .resource-selector .catering-menu-row-actions label,
.resource-selector .catering-menu-row-actions .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .resource-selector .catering-menu-row-actions label {
    margin: 0.5rem;
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 30px;
    line-height: 30px;
}

.resource-selector .resource-selector-actions {
    justify-content: flex-end;
}

.resource-selector .resource-selector-actions .cancel-button,
.resource-selector .resource-selector-actions .save-button,
.resource-selector .resource-selector-actions .upload-file {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.resource-selector .resource-selector-actions .cancel-button button,
.resource-selector .resource-selector-actions .cancel-button .button,
.resource-selector .resource-selector-actions .cancel-button section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .resource-selector .resource-selector-actions .cancel-button label,
.resource-selector .resource-selector-actions .cancel-button .day-list label,
.day-list .resource-selector .resource-selector-actions .cancel-button label,
.resource-selector .resource-selector-actions .cancel-button .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .resource-selector .resource-selector-actions .cancel-button label,
.resource-selector .resource-selector-actions .save-button button,
.resource-selector .resource-selector-actions .save-button .button,
.resource-selector .resource-selector-actions .save-button section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .resource-selector .resource-selector-actions .save-button label,
.resource-selector .resource-selector-actions .save-button .day-list label,
.day-list .resource-selector .resource-selector-actions .save-button label,
.resource-selector .resource-selector-actions .save-button .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .resource-selector .resource-selector-actions .save-button label {
    width: 100%;
}

@media (min-width: 768px) {

    .resource-selector .resource-selector-actions .cancel-button,
    .resource-selector .resource-selector-actions .save-button,
    .resource-selector .resource-selector-actions .upload-file {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
        margin: 1rem 0;
    }

    .resource-selector .resource-selector-actions .cancel-button button,
    .resource-selector .resource-selector-actions .cancel-button .button,
    .resource-selector .resource-selector-actions .cancel-button section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .resource-selector .resource-selector-actions .cancel-button label,
    .resource-selector .resource-selector-actions .cancel-button .day-list label,
    .day-list .resource-selector .resource-selector-actions .cancel-button label,
    .resource-selector .resource-selector-actions .cancel-button .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .resource-selector .resource-selector-actions .cancel-button label,
    .resource-selector .resource-selector-actions .save-button button,
    .resource-selector .resource-selector-actions .save-button .button,
    .resource-selector .resource-selector-actions .save-button section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .resource-selector .resource-selector-actions .save-button label,
    .resource-selector .resource-selector-actions .save-button .day-list label,
    .day-list .resource-selector .resource-selector-actions .save-button label,
    .resource-selector .resource-selector-actions .save-button .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .resource-selector .resource-selector-actions .save-button label {
        width: auto;
    }
}

/* @media (min-width: 768px) {
    .resource-selector .resource-selector-actions .save-button, .resource-selector .resource-selector-actions .upload-file {
        text-align: right;
    }
} */

.resource-selector .file-upload-col {
    border: 1px solid var(--hero-area-border-colour);
    padding: 16px;
}

#documentFileName,
#documentFileName:focus {
    background: transparent;
    border: 0px solid #fff;
    margin: 1.5rem 0;
}

.resource-selector .catering-menu-item .catering-description p {
    width: 100%;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* FONT AWESOME
/* -------------------------------------------------- */
@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("../webfonts/fa-regular-400.eot");
    src: url("../webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.woff") format("woff"), url("../webfonts/fa-regular-400.ttf") format("truetype"), url("../webfonts/fa-regular-400.svg#fontawesome") format("svg");
}

@font-face {
    font-family: "Font Awesome 5 Solid";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../webfonts/fa-solid-900.eot");
    src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.woff") format("woff"), url("../webfonts/fa-solid-900.ttf") format("truetype"), url("../webfonts/fa-solid-900.svg#fontawesome") format("svg");
}

.far {
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
}

.fas {
    font-family: "Font Awesome 5 Solid";
    font-weight: 900;
}

.fa,
.fas,
.far,
.fal,
.fad,
.fab {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.fa-lg {
    font-size: 1.3333333333em;
    line-height: 0.75em;
    vertical-align: -0.0667em;
}

.fa-xs {
    font-size: 0.75em;
}

.fa-sm {
    font-size: 0.875em;
}

.fa-1x {
    font-size: 1em;
}

.fa-2x {
    font-size: 2em;
}

.fa-3x {
    font-size: 3em;
}

.fa-4x {
    font-size: 4em;
}

.fa-5x {
    font-size: 5em;
}

.fa-6x {
    font-size: 6em;
}

.fa-7x {
    font-size: 7em;
}

.fa-8x {
    font-size: 8em;
}

.fa-9x {
    font-size: 9em;
}

.fa-10x {
    font-size: 10em;
}

.fa-fw {
    text-align: center;
    width: 1.25em;
}

.fa-ul {
    list-style-type: none;
    margin-left: 2.5em;
    padding-left: 0;
}

.fa-ul>li {
    position: relative;
}

.fa-li {
    left: -2em;
    position: absolute;
    text-align: center;
    width: 2em;
    line-height: inherit;
}

.fa-border {
    border: solid 0.08em #eee;
    border-radius: 0.1em;
    padding: 0.2em 0.25em 0.15em;
}

.fa-pull-left {
    float: left;
}

.fa-pull-right {
    float: right;
}

.fa.fa-pull-left,
.fas.fa-pull-left,
.far.fa-pull-left,
.fal.fa-pull-left,
.fab.fa-pull-left {
    margin-right: 0.3em;
}

.fa.fa-pull-right,
.fas.fa-pull-right,
.far.fa-pull-right,
.fal.fa-pull-right,
.fab.fa-pull-right {
    margin-left: 0.3em;
}

.fa-spin {
    animation: fa-spin 2s infinite linear;
}

.fa-pulse {
    animation: fa-spin 1s infinite steps(8);
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.fa-rotate-90 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    transform: rotate(90deg);
}

.fa-rotate-180 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
    transform: rotate(180deg);
}

.fa-rotate-270 {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
    transform: rotate(270deg);
}

.fa-flip-horizontal {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
    transform: scale(-1, 1);
}

.fa-flip-vertical {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
    transform: scale(1, -1);
}

.fa-flip-both,
.fa-flip-horizontal.fa-flip-vertical {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
    transform: scale(-1, -1);
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-flip-both {
    filter: none;
}

.fa-stack {
    display: inline-block;
    height: 2em;
    line-height: 2em;
    position: relative;
    vertical-align: middle;
    width: 2.5em;
}

.fa-stack-1x,
.fa-stack-2x {
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

.fa-stack-1x {
    line-height: inherit;
}

.fa-stack-2x {
    font-size: 2em;
}

.fa-inverse {
    color: #fff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.fa-500px:before {
    content: "";
}

.fa-accessible-icon:before {
    content: "";
}

.fa-accusoft:before {
    content: "";
}

.fa-acquisitions-incorporated:before {
    content: "";
}

.fa-ad:before {
    content: "";
}

.fa-address-book:before {
    content: "";
}

.fa-address-card:before {
    content: "";
}

.fa-adjust:before {
    content: "";
}

.fa-adn:before {
    content: "";
}

.fa-adversal:before {
    content: "";
}

.fa-affiliatetheme:before {
    content: "";
}

.fa-air-freshener:before {
    content: "";
}

.fa-airbnb:before {
    content: "";
}

.fa-algolia:before {
    content: "";
}

.fa-align-center:before {
    content: "";
}

.fa-align-justify:before {
    content: "";
}

.fa-align-left:before {
    content: "";
}

.fa-align-right:before {
    content: "";
}

.fa-alipay:before {
    content: "";
}

.fa-allergies:before {
    content: "";
}

.fa-amazon:before {
    content: "";
}

.fa-amazon-pay:before {
    content: "";
}

.fa-ambulance:before {
    content: "";
}

.fa-american-sign-language-interpreting:before {
    content: "";
}

.fa-amilia:before {
    content: "";
}

.fa-anchor:before {
    content: "";
}

.fa-android:before {
    content: "";
}

.fa-angellist:before {
    content: "";
}

.fa-angle-double-down:before {
    content: "";
}

.fa-angle-double-left:before {
    content: "";
}

.fa-angle-double-right:before {
    content: "";
}

.fa-angle-double-up:before {
    content: "";
}

.fa-angle-down:before {
    content: "";
}

.fa-angle-left:before {
    content: "";
}

.fa-angle-right:before {
    content: "";
}

.fa-angle-up:before {
    content: "";
}

.fa-angry:before {
    content: "";
}

.fa-angrycreative:before {
    content: "";
}

.fa-angular:before {
    content: "";
}

.fa-ankh:before {
    content: "";
}

.fa-app-store:before {
    content: "";
}

.fa-app-store-ios:before {
    content: "";
}

.fa-apper:before {
    content: "";
}

.fa-apple:before {
    content: "";
}

.fa-apple-alt:before {
    content: "";
}

.fa-apple-pay:before {
    content: "";
}

.fa-archive:before {
    content: "";
}

.fa-archway:before {
    content: "";
}

.fa-arrow-alt-circle-down:before {
    content: "";
}

.fa-arrow-alt-circle-left:before {
    content: "";
}

.fa-arrow-alt-circle-right:before {
    content: "";
}

.fa-arrow-alt-circle-up:before {
    content: "";
}

.fa-arrow-circle-down:before {
    content: "";
}

.fa-arrow-circle-left:before {
    content: "";
}

.fa-arrow-circle-right:before {
    content: "";
}

.fa-arrow-circle-up:before {
    content: "";
}

.fa-arrow-down:before {
    content: "";
}

.fa-arrow-left:before {
    content: "";
}

.fa-arrow-right:before {
    content: "";
}

.fa-arrow-up:before {
    content: "";
}

.fa-arrows-alt:before {
    content: "";
}

.fa-arrows-alt-h:before {
    content: "";
}

.fa-arrows-alt-v:before {
    content: "";
}

.fa-artstation:before {
    content: "";
}

.fa-assistive-listening-systems:before {
    content: "";
}

.fa-asterisk:before {
    content: "";
}

.fa-asymmetrik:before {
    content: "";
}

.fa-at:before {
    content: "";
}

.fa-atlas:before {
    content: "";
}

.fa-atlassian:before {
    content: "";
}

.fa-atom:before {
    content: "";
}

.fa-audible:before {
    content: "";
}

.fa-audio-description:before {
    content: "";
}

.fa-autoprefixer:before {
    content: "";
}

.fa-avianex:before {
    content: "";
}

.fa-aviato:before {
    content: "";
}

.fa-award:before {
    content: "";
}

.fa-aws:before {
    content: "";
}

.fa-baby:before {
    content: "";
}

.fa-baby-carriage:before {
    content: "";
}

.fa-backspace:before {
    content: "";
}

.fa-backward:before {
    content: "";
}

.fa-bacon:before {
    content: "";
}

.fa-bacteria:before {
    content: "";
}

.fa-bacterium:before {
    content: "";
}

.fa-bahai:before {
    content: "";
}

.fa-balance-scale:before {
    content: "";
}

.fa-balance-scale-left:before {
    content: "";
}

.fa-balance-scale-right:before {
    content: "";
}

.fa-ban:before {
    content: "";
}

.fa-band-aid:before {
    content: "";
}

.fa-bandcamp:before {
    content: "";
}

.fa-barcode:before {
    content: "";
}

.fa-bars:before {
    content: "";
}

.fa-baseball-ball:before {
    content: "";
}

.fa-basketball-ball:before {
    content: "";
}

.fa-bath:before {
    content: "";
}

.fa-battery-empty:before {
    content: "";
}

.fa-battery-full:before {
    content: "";
}

.fa-battery-half:before {
    content: "";
}

.fa-battery-quarter:before {
    content: "";
}

.fa-battery-three-quarters:before {
    content: "";
}

.fa-battle-net:before {
    content: "";
}

.fa-bed:before {
    content: "";
}

.fa-beer:before {
    content: "";
}

.fa-behance:before {
    content: "";
}

.fa-behance-square:before {
    content: "";
}

.fa-bell:before {
    content: "";
}

.fa-bell-slash:before {
    content: "";
}

.fa-bezier-curve:before {
    content: "";
}

.fa-bible:before {
    content: "";
}

.fa-bicycle:before {
    content: "";
}

.fa-biking:before {
    content: "";
}

.fa-bimobject:before {
    content: "";
}

.fa-binoculars:before {
    content: "";
}

.fa-biohazard:before {
    content: "";
}

.fa-birthday-cake:before {
    content: "";
}

.fa-bitbucket:before {
    content: "";
}

.fa-bitcoin:before {
    content: "";
}

.fa-bity:before {
    content: "";
}

.fa-black-tie:before {
    content: "";
}

.fa-blackberry:before {
    content: "";
}

.fa-blender:before {
    content: "";
}

.fa-blender-phone:before {
    content: "";
}

.fa-blind:before {
    content: "";
}

.fa-blog:before {
    content: "";
}

.fa-blogger:before {
    content: "";
}

.fa-blogger-b:before {
    content: "";
}

.fa-bluetooth:before {
    content: "";
}

.fa-bluetooth-b:before {
    content: "";
}

.fa-bold:before {
    content: "";
}

.fa-bolt:before {
    content: "";
}

.fa-bomb:before {
    content: "";
}

.fa-bone:before {
    content: "";
}

.fa-bong:before {
    content: "";
}

.fa-book:before {
    content: "";
}

.fa-book-dead:before {
    content: "";
}

.fa-book-medical:before {
    content: "";
}

.fa-book-open:before {
    content: "";
}

.fa-book-reader:before {
    content: "";
}

.fa-bookmark:before {
    content: "";
}

.fa-bootstrap:before {
    content: "";
}

.fa-border-all:before {
    content: "";
}

.fa-border-none:before {
    content: "";
}

.fa-border-style:before {
    content: "";
}

.fa-bowling-ball:before {
    content: "";
}

.fa-box:before {
    content: "";
}

.fa-box-open:before {
    content: "";
}

.fa-box-tissue:before {
    content: "";
}

.fa-boxes:before {
    content: "";
}

.fa-braille:before {
    content: "";
}

.fa-brain:before {
    content: "";
}

.fa-bread-slice:before {
    content: "";
}

.fa-briefcase:before {
    content: "";
}

.fa-briefcase-medical:before {
    content: "";
}

.fa-broadcast-tower:before {
    content: "";
}

.fa-broom:before {
    content: "";
}

.fa-brush:before {
    content: "";
}

.fa-btc:before {
    content: "";
}

.fa-buffer:before {
    content: "";
}

.fa-bug:before {
    content: "";
}

.fa-building:before {
    content: "";
}

.fa-bullhorn:before {
    content: "";
}

.fa-bullseye:before {
    content: "";
}

.fa-burn:before {
    content: "";
}

.fa-buromobelexperte:before {
    content: "";
}

.fa-bus:before {
    content: "";
}

.fa-bus-alt:before {
    content: "";
}

.fa-business-time:before {
    content: "";
}

.fa-buy-n-large:before {
    content: "";
}

.fa-buysellads:before {
    content: "";
}

.fa-calculator:before {
    content: "";
}

.fa-calendar:before {
    content: "";
}

.fa-calendar-alt:before {
    content: "";
}

.fa-calendar-check:before {
    content: "";
}

.fa-calendar-day:before {
    content: "";
}

.fa-calendar-minus:before {
    content: "";
}

.fa-calendar-plus:before {
    content: "";
}

.fa-calendar-times:before {
    content: "";
}

.fa-calendar-week:before {
    content: "";
}

.fa-camera:before {
    content: "";
}

.fa-camera-retro:before {
    content: "";
}

.fa-campground:before {
    content: "";
}

.fa-canadian-maple-leaf:before {
    content: "";
}

.fa-candy-cane:before {
    content: "";
}

.fa-cannabis:before {
    content: "";
}

.fa-capsules:before {
    content: "";
}

.fa-car:before {
    content: "";
}

.fa-car-alt:before {
    content: "";
}

.fa-car-battery:before {
    content: "";
}

.fa-car-crash:before {
    content: "";
}

.fa-car-side:before {
    content: "";
}

.fa-caravan:before {
    content: "";
}

.fa-caret-down:before {
    content: "";
}

.fa-caret-left:before {
    content: "";
}

.fa-caret-right:before {
    content: "";
}

.fa-caret-square-down:before {
    content: "";
}

.fa-caret-square-left:before {
    content: "";
}

.fa-caret-square-right:before {
    content: "";
}

.fa-caret-square-up:before {
    content: "";
}

.fa-caret-up:before {
    content: "";
}

.fa-carrot:before {
    content: "";
}

.fa-cart-arrow-down:before {
    content: "";
}

.fa-cart-plus:before {
    content: "";
}

.fa-cash-register:before {
    content: "";
}

.fa-cat:before {
    content: "";
}

.fa-cc-amazon-pay:before {
    content: "";
}

.fa-cc-amex:before {
    content: "";
}

.fa-cc-apple-pay:before {
    content: "";
}

.fa-cc-diners-club:before {
    content: "";
}

.fa-cc-discover:before {
    content: "";
}

.fa-cc-jcb:before {
    content: "";
}

.fa-cc-mastercard:before {
    content: "";
}

.fa-cc-paypal:before {
    content: "";
}

.fa-cc-stripe:before {
    content: "";
}

.fa-cc-visa:before {
    content: "";
}

.fa-centercode:before {
    content: "";
}

.fa-centos:before {
    content: "";
}

.fa-certificate:before {
    content: "";
}

.fa-chair:before {
    content: "";
}

.fa-chalkboard:before {
    content: "";
}

.fa-chalkboard-teacher:before {
    content: "";
}

.fa-charging-station:before {
    content: "";
}

.fa-chart-area:before {
    content: "";
}

.fa-chart-bar:before {
    content: "";
}

.fa-chart-line:before {
    content: "";
}

.fa-chart-pie:before {
    content: "";
}

.fa-check:before {
    content: "";
}

.fa-check-circle:before {
    content: "";
}

.fa-check-double:before {
    content: "";
}

.fa-check-square:before {
    content: "";
}

.fa-cheese:before {
    content: "";
}

.fa-chess:before {
    content: "";
}

.fa-chess-bishop:before {
    content: "";
}

.fa-chess-board:before {
    content: "";
}

.fa-chess-king:before {
    content: "";
}

.fa-chess-knight:before {
    content: "";
}

.fa-chess-pawn:before {
    content: "";
}

.fa-chess-queen:before {
    content: "";
}

.fa-chess-rook:before {
    content: "";
}

.fa-chevron-circle-down:before {
    content: "";
}

.fa-chevron-circle-left:before {
    content: "";
}

.fa-chevron-circle-right:before {
    content: "";
}

.fa-chevron-circle-up:before {
    content: "";
}

.fa-chevron-down:before {
    content: "";
}

.fa-chevron-left:before {
    content: "";
}

.fa-chevron-right:before {
    content: "";
}

.fa-chevron-up:before {
    content: "";
}

.fa-child:before {
    content: "";
}

.fa-chrome:before {
    content: "";
}

.fa-chromecast:before {
    content: "";
}

.fa-church:before {
    content: "";
}

.fa-circle:before {
    content: "";
}

.fa-circle-notch:before {
    content: "";
}

.fa-city:before {
    content: "";
}

.fa-clinic-medical:before {
    content: "";
}

.fa-clipboard:before {
    content: "";
}

.fa-clipboard-check:before {
    content: "";
}

.fa-clipboard-list:before {
    content: "";
}

.fa-clock:before {
    content: "";
}

.fa-clone:before {
    content: "";
}

.fa-closed-captioning:before {
    content: "";
}

.fa-cloud:before {
    content: "";
}

.fa-cloud-download-alt:before {
    content: "";
}

.fa-cloud-meatball:before {
    content: "";
}

.fa-cloud-moon:before {
    content: "";
}

.fa-cloud-moon-rain:before {
    content: "";
}

.fa-cloud-rain:before {
    content: "";
}

.fa-cloud-showers-heavy:before {
    content: "";
}

.fa-cloud-sun:before {
    content: "";
}

.fa-cloud-sun-rain:before {
    content: "";
}

.fa-cloud-upload-alt:before {
    content: "";
}

.fa-cloudflare:before {
    content: "";
}

.fa-cloudscale:before {
    content: "";
}

.fa-cloudsmith:before {
    content: "";
}

.fa-cloudversify:before {
    content: "";
}

.fa-cocktail:before {
    content: "";
}

.fa-code:before {
    content: "";
}

.fa-code-branch:before {
    content: "";
}

.fa-codepen:before {
    content: "";
}

.fa-codiepie:before {
    content: "";
}

.fa-coffee:before {
    content: "";
}

.fa-cog:before {
    content: "";
}

.fa-cogs:before {
    content: "";
}

.fa-coins:before {
    content: "";
}

.fa-columns:before {
    content: "";
}

.fa-comment:before {
    content: "";
}

.fa-comment-alt:before {
    content: "";
}

.fa-comment-dollar:before {
    content: "";
}

.fa-comment-dots:before {
    content: "";
}

.fa-comment-medical:before {
    content: "";
}

.fa-comment-slash:before {
    content: "";
}

.fa-comments:before {
    content: "";
}

.fa-comments-dollar:before {
    content: "";
}

.fa-compact-disc:before {
    content: "";
}

.fa-compass:before {
    content: "";
}

.fa-compress:before {
    content: "";
}

.fa-compress-alt:before {
    content: "";
}

.fa-compress-arrows-alt:before {
    content: "";
}

.fa-concierge-bell:before {
    content: "";
}

.fa-confluence:before {
    content: "";
}

.fa-connectdevelop:before {
    content: "";
}

.fa-contao:before {
    content: "";
}

.fa-cookie:before {
    content: "";
}

.fa-cookie-bite:before {
    content: "";
}

.fa-copy:before {
    content: "";
}

.fa-copyright:before {
    content: "";
}

.fa-cotton-bureau:before {
    content: "";
}

.fa-couch:before {
    content: "";
}

.fa-cpanel:before {
    content: "";
}

.fa-creative-commons:before {
    content: "";
}

.fa-creative-commons-by:before {
    content: "";
}

.fa-creative-commons-nc:before {
    content: "";
}

.fa-creative-commons-nc-eu:before {
    content: "";
}

.fa-creative-commons-nc-jp:before {
    content: "";
}

.fa-creative-commons-nd:before {
    content: "";
}

.fa-creative-commons-pd:before {
    content: "";
}

.fa-creative-commons-pd-alt:before {
    content: "";
}

.fa-creative-commons-remix:before {
    content: "";
}

.fa-creative-commons-sa:before {
    content: "";
}

.fa-creative-commons-sampling:before {
    content: "";
}

.fa-creative-commons-sampling-plus:before {
    content: "";
}

.fa-creative-commons-share:before {
    content: "";
}

.fa-creative-commons-zero:before {
    content: "";
}

.fa-credit-card:before {
    content: "";
}

.fa-critical-role:before {
    content: "";
}

.fa-crop:before {
    content: "";
}

.fa-crop-alt:before {
    content: "";
}

.fa-cross:before {
    content: "";
}

.fa-crosshairs:before {
    content: "";
}

.fa-crow:before {
    content: "";
}

.fa-crown:before {
    content: "";
}

.fa-crutch:before {
    content: "";
}

.fa-css3:before {
    content: "";
}

.fa-css3-alt:before {
    content: "";
}

.fa-cube:before {
    content: "";
}

.fa-cubes:before {
    content: "";
}

.fa-cut:before {
    content: "";
}

.fa-cuttlefish:before {
    content: "";
}

.fa-d-and-d:before {
    content: "";
}

.fa-d-and-d-beyond:before {
    content: "";
}

.fa-dailymotion:before {
    content: "";
}

.fa-dashcube:before {
    content: "";
}

.fa-database:before {
    content: "";
}

.fa-deaf:before {
    content: "";
}

.fa-deezer:before {
    content: "";
}

.fa-delicious:before {
    content: "";
}

.fa-democrat:before {
    content: "";
}

.fa-deploydog:before {
    content: "";
}

.fa-deskpro:before {
    content: "";
}

.fa-desktop:before {
    content: "";
}

.fa-dev:before {
    content: "";
}

.fa-deviantart:before {
    content: "";
}

.fa-dharmachakra:before {
    content: "";
}

.fa-dhl:before {
    content: "";
}

.fa-diagnoses:before {
    content: "";
}

.fa-diaspora:before {
    content: "";
}

.fa-dice:before {
    content: "";
}

.fa-dice-d20:before {
    content: "";
}

.fa-dice-d6:before {
    content: "";
}

.fa-dice-five:before {
    content: "";
}

.fa-dice-four:before {
    content: "";
}

.fa-dice-one:before {
    content: "";
}

.fa-dice-six:before {
    content: "";
}

.fa-dice-three:before {
    content: "";
}

.fa-dice-two:before {
    content: "";
}

.fa-digg:before {
    content: "";
}

.fa-digital-ocean:before {
    content: "";
}

.fa-digital-tachograph:before {
    content: "";
}

.fa-directions:before {
    content: "";
}

.fa-discord:before {
    content: "";
}

.fa-discourse:before {
    content: "";
}

.fa-disease:before {
    content: "";
}

.fa-divide:before {
    content: "";
}

.fa-dizzy:before {
    content: "";
}

.fa-dna:before {
    content: "";
}

.fa-dochub:before {
    content: "";
}

.fa-docker:before {
    content: "";
}

.fa-dog:before {
    content: "";
}

.fa-dollar-sign:before {
    content: "";
}

.fa-dolly:before {
    content: "";
}

.fa-dolly-flatbed:before {
    content: "";
}

.fa-donate:before {
    content: "";
}

.fa-door-closed:before {
    content: "";
}

.fa-door-open:before {
    content: "";
}

.fa-dot-circle:before {
    content: "";
}

.fa-dove:before {
    content: "";
}

.fa-download:before {
    content: "";
}

.fa-draft2digital:before {
    content: "";
}

.fa-drafting-compass:before {
    content: "";
}

.fa-dragon:before {
    content: "";
}

.fa-draw-polygon:before {
    content: "";
}

.fa-dribbble:before {
    content: "";
}

.fa-dribbble-square:before {
    content: "";
}

.fa-dropbox:before {
    content: "";
}

.fa-drum:before {
    content: "";
}

.fa-drum-steelpan:before {
    content: "";
}

.fa-drumstick-bite:before {
    content: "";
}

.fa-drupal:before {
    content: "";
}

.fa-dumbbell:before {
    content: "";
}

.fa-dumpster:before {
    content: "";
}

.fa-dumpster-fire:before {
    content: "";
}

.fa-dungeon:before {
    content: "";
}

.fa-dyalog:before {
    content: "";
}

.fa-earlybirds:before {
    content: "";
}

.fa-ebay:before {
    content: "";
}

.fa-edge:before {
    content: "";
}

.fa-edge-legacy:before {
    content: "";
}

.fa-edit:before {
    content: "";
}

.fa-egg:before {
    content: "";
}

.fa-eject:before {
    content: "";
}

.fa-elementor:before {
    content: "";
}

.fa-ellipsis-h:before {
    content: "";
}

.fa-ellipsis-v:before {
    content: "";
}

.fa-ello:before {
    content: "";
}

.fa-ember:before {
    content: "";
}

.fa-empire:before {
    content: "";
}

.fa-envelope:before {
    content: "";
}

.fa-envelope-open:before {
    content: "";
}

.fa-envelope-open-text:before {
    content: "";
}

.fa-envelope-square:before {
    content: "";
}

.fa-envira:before {
    content: "";
}

.fa-equals:before {
    content: "";
}

.fa-eraser:before {
    content: "";
}

.fa-erlang:before {
    content: "";
}

.fa-ethereum:before {
    content: "";
}

.fa-ethernet:before {
    content: "";
}

.fa-etsy:before {
    content: "";
}

.fa-euro-sign:before {
    content: "";
}

.fa-evernote:before {
    content: "";
}

.fa-exchange-alt:before {
    content: "";
}

.fa-exclamation:before {
    content: "";
}

.fa-exclamation-circle:before {
    content: "";
}

.fa-exclamation-triangle:before {
    content: "";
}

.fa-expand:before {
    content: "";
}

.fa-expand-alt:before {
    content: "";
}

.fa-expand-arrows-alt:before {
    content: "";
}

.fa-expeditedssl:before {
    content: "";
}

.fa-external-link-alt:before {
    content: "";
}

.fa-external-link-square-alt:before {
    content: "";
}

.fa-eye:before {
    content: "";
}

.fa-eye-dropper:before {
    content: "";
}

.fa-eye-slash:before {
    content: "";
}

.fa-facebook:before {
    content: "";
}

.fa-facebook-f:before {
    content: "";
}

.fa-facebook-messenger:before {
    content: "";
}

.fa-facebook-square:before {
    content: "";
}

.fa-fan:before {
    content: "";
}

.fa-fantasy-flight-games:before {
    content: "";
}

.fa-fast-backward:before {
    content: "";
}

.fa-fast-forward:before {
    content: "";
}

.fa-faucet:before {
    content: "";
}

.fa-fax:before {
    content: "";
}

.fa-feather:before {
    content: "";
}

.fa-feather-alt:before {
    content: "";
}

.fa-fedex:before {
    content: "";
}

.fa-fedora:before {
    content: "";
}

.fa-female:before {
    content: "";
}

.fa-fighter-jet:before {
    content: "";
}

.fa-figma:before {
    content: "";
}

.fa-file:before {
    content: "";
}

.fa-file-alt:before {
    content: "";
}

.fa-file-archive:before {
    content: "";
}

.fa-file-audio:before {
    content: "";
}

.fa-file-code:before {
    content: "";
}

.fa-file-contract:before {
    content: "";
}

.fa-file-csv:before {
    content: "";
}

.fa-file-download:before {
    content: "";
}

.fa-file-excel:before {
    content: "";
}

.fa-file-export:before {
    content: "";
}

.fa-file-image:before {
    content: "";
}

.fa-file-import:before {
    content: "";
}

.fa-file-invoice:before {
    content: "";
}

.fa-file-invoice-dollar:before {
    content: "";
}

.fa-file-medical:before {
    content: "";
}

.fa-file-medical-alt:before {
    content: "";
}

.fa-file-pdf:before {
    content: "";
}

.fa-file-powerpoint:before {
    content: "";
}

.fa-file-prescription:before {
    content: "";
}

.fa-file-signature:before {
    content: "";
}

.fa-file-upload:before {
    content: "";
}

.fa-file-video:before {
    content: "";
}

.fa-file-word:before {
    content: "";
}

.fa-fill:before {
    content: "";
}

.fa-fill-drip:before {
    content: "";
}

.fa-film:before {
    content: "";
}

.fa-filter:before {
    content: "";
}

.fa-fingerprint:before {
    content: "";
}

.fa-fire:before {
    content: "";
}

.fa-fire-alt:before {
    content: "";
}

.fa-fire-extinguisher:before {
    content: "";
}

.fa-firefox:before {
    content: "";
}

.fa-firefox-browser:before {
    content: "";
}

.fa-first-aid:before {
    content: "";
}

.fa-first-order:before {
    content: "";
}

.fa-first-order-alt:before {
    content: "";
}

.fa-firstdraft:before {
    content: "";
}

.fa-fish:before {
    content: "";
}

.fa-fist-raised:before {
    content: "";
}

.fa-flag:before {
    content: "";
}

.fa-flag-checkered:before {
    content: "";
}

.fa-flag-usa:before {
    content: "";
}

.fa-flask:before {
    content: "";
}

.fa-flickr:before {
    content: "";
}

.fa-flipboard:before {
    content: "";
}

.fa-flushed:before {
    content: "";
}

.fa-fly:before {
    content: "";
}

.fa-folder:before {
    content: "";
}

.fa-folder-minus:before {
    content: "";
}

.fa-folder-open:before {
    content: "";
}

.fa-folder-plus:before {
    content: "";
}

.fa-font:before {
    content: "";
}

.fa-font-awesome:before {
    content: "";
}

.fa-font-awesome-alt:before {
    content: "";
}

.fa-font-awesome-flag:before {
    content: "";
}

.fa-font-awesome-logo-full:before {
    content: "";
}

.fa-fonticons:before {
    content: "";
}

.fa-fonticons-fi:before {
    content: "";
}

.fa-football-ball:before {
    content: "";
}

.fa-fort-awesome:before {
    content: "";
}

.fa-fort-awesome-alt:before {
    content: "";
}

.fa-forumbee:before {
    content: "";
}

.fa-forward:before {
    content: "";
}

.fa-foursquare:before {
    content: "";
}

.fa-free-code-camp:before {
    content: "";
}

.fa-freebsd:before {
    content: "";
}

.fa-frog:before {
    content: "";
}

.fa-frown:before {
    content: "";
}

.fa-frown-open:before {
    content: "";
}

.fa-fulcrum:before {
    content: "";
}

.fa-funnel-dollar:before {
    content: "";
}

.fa-futbol:before {
    content: "";
}

.fa-galactic-republic:before {
    content: "";
}

.fa-galactic-senate:before {
    content: "";
}

.fa-gamepad:before {
    content: "";
}

.fa-gas-pump:before {
    content: "";
}

.fa-gavel:before {
    content: "";
}

.fa-gem:before {
    content: "";
}

.fa-genderless:before {
    content: "";
}

.fa-get-pocket:before {
    content: "";
}

.fa-gg:before {
    content: "";
}

.fa-gg-circle:before {
    content: "";
}

.fa-ghost:before {
    content: "";
}

.fa-gift:before {
    content: "";
}

.fa-gifts:before {
    content: "";
}

.fa-git:before {
    content: "";
}

.fa-git-alt:before {
    content: "";
}

.fa-git-square:before {
    content: "";
}

.fa-github:before {
    content: "";
}

.fa-github-alt:before {
    content: "";
}

.fa-github-square:before {
    content: "";
}

.fa-gitkraken:before {
    content: "";
}

.fa-gitlab:before {
    content: "";
}

.fa-gitter:before {
    content: "";
}

.fa-glass-cheers:before {
    content: "";
}

.fa-glass-martini:before {
    content: "";
}

.fa-glass-martini-alt:before {
    content: "";
}

.fa-glass-whiskey:before {
    content: "";
}

.fa-glasses:before {
    content: "";
}

.fa-glide:before {
    content: "";
}

.fa-glide-g:before {
    content: "";
}

.fa-globe:before {
    content: "";
}

.fa-globe-africa:before {
    content: "";
}

.fa-globe-americas:before {
    content: "";
}

.fa-globe-asia:before {
    content: "";
}

.fa-globe-europe:before {
    content: "";
}

.fa-gofore:before {
    content: "";
}

.fa-golf-ball:before {
    content: "";
}

.fa-goodreads:before {
    content: "";
}

.fa-goodreads-g:before {
    content: "";
}

.fa-google:before {
    content: "";
}

.fa-google-drive:before {
    content: "";
}

.fa-google-pay:before {
    content: "";
}

.fa-google-play:before {
    content: "";
}

.fa-google-plus:before {
    content: "";
}

.fa-google-plus-g:before {
    content: "";
}

.fa-google-plus-square:before {
    content: "";
}

.fa-google-wallet:before {
    content: "";
}

.fa-gopuram:before {
    content: "";
}

.fa-graduation-cap:before {
    content: "";
}

.fa-gratipay:before {
    content: "";
}

.fa-grav:before {
    content: "";
}

.fa-greater-than:before {
    content: "";
}

.fa-greater-than-equal:before {
    content: "";
}

.fa-grimace:before {
    content: "";
}

.fa-grin:before {
    content: "";
}

.fa-grin-alt:before {
    content: "";
}

.fa-grin-beam:before {
    content: "";
}

.fa-grin-beam-sweat:before {
    content: "";
}

.fa-grin-hearts:before {
    content: "";
}

.fa-grin-squint:before {
    content: "";
}

.fa-grin-squint-tears:before {
    content: "";
}

.fa-grin-stars:before {
    content: "";
}

.fa-grin-tears:before {
    content: "";
}

.fa-grin-tongue:before {
    content: "";
}

.fa-grin-tongue-squint:before {
    content: "";
}

.fa-grin-tongue-wink:before {
    content: "";
}

.fa-grin-wink:before {
    content: "";
}

.fa-grip-horizontal:before {
    content: "";
}

.fa-grip-lines:before {
    content: "";
}

.fa-grip-lines-vertical:before {
    content: "";
}

.fa-grip-vertical:before {
    content: "";
}

.fa-gripfire:before {
    content: "";
}

.fa-grunt:before {
    content: "";
}

.fa-guilded:before {
    content: "";
}

.fa-guitar:before {
    content: "";
}

.fa-gulp:before {
    content: "";
}

.fa-h-square:before {
    content: "";
}

.fa-hacker-news:before {
    content: "";
}

.fa-hacker-news-square:before {
    content: "";
}

.fa-hackerrank:before {
    content: "";
}

.fa-hamburger:before {
    content: "";
}

.fa-hammer:before {
    content: "";
}

.fa-hamsa:before {
    content: "";
}

.fa-hand-holding:before {
    content: "";
}

.fa-hand-holding-heart:before {
    content: "";
}

.fa-hand-holding-medical:before {
    content: "";
}

.fa-hand-holding-usd:before {
    content: "";
}

.fa-hand-holding-water:before {
    content: "";
}

.fa-hand-lizard:before {
    content: "";
}

.fa-hand-middle-finger:before {
    content: "";
}

.fa-hand-paper:before {
    content: "";
}

.fa-hand-peace:before {
    content: "";
}

.fa-hand-point-down:before {
    content: "";
}

.fa-hand-point-left:before {
    content: "";
}

.fa-hand-point-right:before {
    content: "";
}

.fa-hand-point-up:before {
    content: "";
}

.fa-hand-pointer:before {
    content: "";
}

.fa-hand-rock:before {
    content: "";
}

.fa-hand-scissors:before {
    content: "";
}

.fa-hand-sparkles:before {
    content: "";
}

.fa-hand-spock:before {
    content: "";
}

.fa-hands:before {
    content: "";
}

.fa-hands-helping:before {
    content: "";
}

.fa-hands-wash:before {
    content: "";
}

.fa-handshake:before {
    content: "";
}

.fa-handshake-alt-slash:before {
    content: "";
}

.fa-handshake-slash:before {
    content: "";
}

.fa-hanukiah:before {
    content: "";
}

.fa-hard-hat:before {
    content: "";
}

.fa-hashtag:before {
    content: "";
}

.fa-hat-cowboy:before {
    content: "";
}

.fa-hat-cowboy-side:before {
    content: "";
}

.fa-hat-wizard:before {
    content: "";
}

.fa-hdd:before {
    content: "";
}

.fa-head-side-cough:before {
    content: "";
}

.fa-head-side-cough-slash:before {
    content: "";
}

.fa-head-side-mask:before {
    content: "";
}

.fa-head-side-virus:before {
    content: "";
}

.fa-heading:before {
    content: "";
}

.fa-headphones:before {
    content: "";
}

.fa-headphones-alt:before {
    content: "";
}

.fa-headset:before {
    content: "";
}

.fa-heart:before {
    content: "";
}

.fa-heart-broken:before {
    content: "";
}

.fa-heartbeat:before {
    content: "";
}

.fa-helicopter:before {
    content: "";
}

.fa-highlighter:before {
    content: "";
}

.fa-hiking:before {
    content: "";
}

.fa-hippo:before {
    content: "";
}

.fa-hips:before {
    content: "";
}

.fa-hire-a-helper:before {
    content: "";
}

.fa-history:before {
    content: "";
}

.fa-hive:before {
    content: "";
}

.fa-hockey-puck:before {
    content: "";
}

.fa-holly-berry:before {
    content: "";
}

.fa-home:before {
    content: "";
}

.fa-hooli:before {
    content: "";
}

.fa-hornbill:before {
    content: "";
}

.fa-horse:before {
    content: "";
}

.fa-horse-head:before {
    content: "";
}

.fa-hospital:before {
    content: "";
}

.fa-hospital-alt:before {
    content: "";
}

.fa-hospital-symbol:before {
    content: "";
}

.fa-hospital-user:before {
    content: "";
}

.fa-hot-tub:before {
    content: "";
}

.fa-hotdog:before {
    content: "";
}

.fa-hotel:before {
    content: "";
}

.fa-hotjar:before {
    content: "";
}

.fa-hourglass:before {
    content: "";
}

.fa-hourglass-end:before {
    content: "";
}

.fa-hourglass-half:before {
    content: "";
}

.fa-hourglass-start:before {
    content: "";
}

.fa-house-damage:before {
    content: "";
}

.fa-house-user:before {
    content: "";
}

.fa-houzz:before {
    content: "";
}

.fa-hryvnia:before {
    content: "";
}

.fa-html5:before {
    content: "";
}

.fa-hubspot:before {
    content: "";
}

.fa-i-cursor:before {
    content: "";
}

.fa-ice-cream:before {
    content: "";
}

.fa-icicles:before {
    content: "";
}

.fa-icons:before {
    content: "";
}

.fa-id-badge:before {
    content: "";
}

.fa-id-card:before {
    content: "";
}

.fa-id-card-alt:before {
    content: "";
}

.fa-ideal:before {
    content: "";
}

.fa-igloo:before {
    content: "";
}

.fa-image:before {
    content: "";
}

.fa-images:before {
    content: "";
}

.fa-imdb:before {
    content: "";
}

.fa-inbox:before {
    content: "";
}

.fa-indent:before {
    content: "";
}

.fa-industry:before {
    content: "";
}

.fa-infinity:before {
    content: "";
}

.fa-info:before {
    content: "";
}

.fa-info-circle:before {
    content: "";
}

.fa-innosoft:before {
    content: "";
}

.fa-instagram:before {
    content: "";
}

.fa-instagram-square:before {
    content: "";
}

.fa-instalod:before {
    content: "";
}

.fa-intercom:before {
    content: "";
}

.fa-internet-explorer:before {
    content: "";
}

.fa-invision:before {
    content: "";
}

.fa-ioxhost:before {
    content: "";
}

.fa-italic:before {
    content: "";
}

.fa-itch-io:before {
    content: "";
}

.fa-itunes:before {
    content: "";
}

.fa-itunes-note:before {
    content: "";
}

.fa-java:before {
    content: "";
}

.fa-jedi:before {
    content: "";
}

.fa-jedi-order:before {
    content: "";
}

.fa-jenkins:before {
    content: "";
}

.fa-jira:before {
    content: "";
}

.fa-joget:before {
    content: "";
}

.fa-joint:before {
    content: "";
}

.fa-joomla:before {
    content: "";
}

.fa-journal-whills:before {
    content: "";
}

.fa-js:before {
    content: "";
}

.fa-js-square:before {
    content: "";
}

.fa-jsfiddle:before {
    content: "";
}

.fa-kaaba:before {
    content: "";
}

.fa-kaggle:before {
    content: "";
}

.fa-key:before {
    content: "";
}

.fa-keybase:before {
    content: "";
}

.fa-keyboard:before {
    content: "";
}

.fa-keycdn:before {
    content: "";
}

.fa-khanda:before {
    content: "";
}

.fa-kickstarter:before {
    content: "";
}

.fa-kickstarter-k:before {
    content: "";
}

.fa-kiss:before {
    content: "";
}

.fa-kiss-beam:before {
    content: "";
}

.fa-kiss-wink-heart:before {
    content: "";
}

.fa-kiwi-bird:before {
    content: "";
}

.fa-korvue:before {
    content: "";
}

.fa-landmark:before {
    content: "";
}

.fa-language:before {
    content: "";
}

.fa-laptop:before {
    content: "";
}

.fa-laptop-code:before {
    content: "";
}

.fa-laptop-house:before {
    content: "";
}

.fa-laptop-medical:before {
    content: "";
}

.fa-laravel:before {
    content: "";
}

.fa-lastfm:before {
    content: "";
}

.fa-lastfm-square:before {
    content: "";
}

.fa-laugh:before {
    content: "";
}

.fa-laugh-beam:before {
    content: "";
}

.fa-laugh-squint:before {
    content: "";
}

.fa-laugh-wink:before {
    content: "";
}

.fa-layer-group:before {
    content: "";
}

.fa-leaf:before {
    content: "";
}

.fa-leanpub:before {
    content: "";
}

.fa-lemon:before {
    content: "";
}

.fa-less:before {
    content: "";
}

.fa-less-than:before {
    content: "";
}

.fa-less-than-equal:before {
    content: "";
}

.fa-level-down-alt:before {
    content: "";
}

.fa-level-up-alt:before {
    content: "";
}

.fa-life-ring:before {
    content: "";
}

.fa-lightbulb:before {
    content: "";
}

.fa-line:before {
    content: "";
}

.fa-link:before {
    content: "";
}

.fa-linkedin:before {
    content: "";
}

.fa-linkedin-in:before {
    content: "";
}

.fa-linode:before {
    content: "";
}

.fa-linux:before {
    content: "";
}

.fa-lira-sign:before {
    content: "";
}

.fa-list:before {
    content: "";
}

.fa-list-alt:before {
    content: "";
}

.fa-list-ol:before {
    content: "";
}

.fa-list-ul:before {
    content: "";
}

.fa-location-arrow:before {
    content: "";
}

.fa-lock:before {
    content: "";
}

.fa-lock-open:before {
    content: "";
}

.fa-long-arrow-alt-down:before {
    content: "";
}

.fa-long-arrow-alt-left:before {
    content: "";
}

.fa-long-arrow-alt-right:before {
    content: "";
}

.fa-long-arrow-alt-up:before {
    content: "";
}

.fa-low-vision:before {
    content: "";
}

.fa-luggage-cart:before {
    content: "";
}

.fa-lungs:before {
    content: "";
}

.fa-lungs-virus:before {
    content: "";
}

.fa-lyft:before {
    content: "";
}

.fa-magento:before {
    content: "";
}

.fa-magic:before {
    content: "";
}

.fa-magnet:before {
    content: "";
}

.fa-mail-bulk:before {
    content: "";
}

.fa-mailchimp:before {
    content: "";
}

.fa-male:before {
    content: "";
}

.fa-mandalorian:before {
    content: "";
}

.fa-map:before {
    content: "";
}

.fa-map-marked:before {
    content: "";
}

.fa-map-marked-alt:before {
    content: "";
}

.fa-map-marker:before {
    content: "";
}

.fa-map-marker-alt:before {
    content: "";
}

.fa-map-pin:before {
    content: "";
}

.fa-map-signs:before {
    content: "";
}

.fa-markdown:before {
    content: "";
}

.fa-marker:before {
    content: "";
}

.fa-mars:before {
    content: "";
}

.fa-mars-double:before {
    content: "";
}

.fa-mars-stroke:before {
    content: "";
}

.fa-mars-stroke-h:before {
    content: "";
}

.fa-mars-stroke-v:before {
    content: "";
}

.fa-mask:before {
    content: "";
}

.fa-mastodon:before {
    content: "";
}

.fa-maxcdn:before {
    content: "";
}

.fa-mdb:before {
    content: "";
}

.fa-medal:before {
    content: "";
}

.fa-medapps:before {
    content: "";
}

.fa-medium:before {
    content: "";
}

.fa-medium-m:before {
    content: "";
}

.fa-medkit:before {
    content: "";
}

.fa-medrt:before {
    content: "";
}

.fa-meetup:before {
    content: "";
}

.fa-megaport:before {
    content: "";
}

.fa-meh:before {
    content: "";
}

.fa-meh-blank:before {
    content: "";
}

.fa-meh-rolling-eyes:before {
    content: "";
}

.fa-memory:before {
    content: "";
}

.fa-mendeley:before {
    content: "";
}

.fa-menorah:before {
    content: "";
}

.fa-mercury:before {
    content: "";
}

.fa-meteor:before {
    content: "";
}

.fa-microblog:before {
    content: "";
}

.fa-microchip:before {
    content: "";
}

.fa-microphone:before {
    content: "";
}

.fa-microphone-alt:before {
    content: "";
}

.fa-microphone-alt-slash:before {
    content: "";
}

.fa-microphone-slash:before {
    content: "";
}

.fa-microscope:before {
    content: "";
}

.fa-microsoft:before {
    content: "";
}

.fa-minus:before {
    content: "";
}

.fa-minus-circle:before {
    content: "";
}

.fa-minus-square:before {
    content: "";
}

.fa-mitten:before {
    content: "";
}

.fa-mix:before {
    content: "";
}

.fa-mixcloud:before {
    content: "";
}

.fa-mixer:before {
    content: "";
}

.fa-mizuni:before {
    content: "";
}

.fa-mobile:before {
    content: "";
}

.fa-mobile-alt:before {
    content: "";
}

.fa-modx:before {
    content: "";
}

.fa-monero:before {
    content: "";
}

.fa-money-bill:before {
    content: "";
}

.fa-money-bill-alt:before {
    content: "";
}

.fa-money-bill-wave:before {
    content: "";
}

.fa-money-bill-wave-alt:before {
    content: "";
}

.fa-money-check:before {
    content: "";
}

.fa-money-check-alt:before {
    content: "";
}

.fa-monument:before {
    content: "";
}

.fa-moon:before {
    content: "";
}

.fa-mortar-pestle:before {
    content: "";
}

.fa-mosque:before {
    content: "";
}

.fa-motorcycle:before {
    content: "";
}

.fa-mountain:before {
    content: "";
}

.fa-mouse:before {
    content: "";
}

.fa-mouse-pointer:before {
    content: "";
}

.fa-mug-hot:before {
    content: "";
}

.fa-music:before {
    content: "";
}

.fa-napster:before {
    content: "";
}

.fa-neos:before {
    content: "";
}

.fa-network-wired:before {
    content: "";
}

.fa-neuter:before {
    content: "";
}

.fa-newspaper:before {
    content: "";
}

.fa-nimblr:before {
    content: "";
}

.fa-node:before {
    content: "";
}

.fa-node-js:before {
    content: "";
}

.fa-not-equal:before {
    content: "";
}

.fa-notes-medical:before {
    content: "";
}

.fa-npm:before {
    content: "";
}

.fa-ns8:before {
    content: "";
}

.fa-nutritionix:before {
    content: "";
}

.fa-object-group:before {
    content: "";
}

.fa-object-ungroup:before {
    content: "";
}

.fa-octopus-deploy:before {
    content: "";
}

.fa-odnoklassniki:before {
    content: "";
}

.fa-odnoklassniki-square:before {
    content: "";
}

.fa-oil-can:before {
    content: "";
}

.fa-old-republic:before {
    content: "";
}

.fa-om:before {
    content: "";
}

.fa-opencart:before {
    content: "";
}

.fa-openid:before {
    content: "";
}

.fa-opera:before {
    content: "";
}

.fa-optin-monster:before {
    content: "";
}

.fa-orcid:before {
    content: "";
}

.fa-osi:before {
    content: "";
}

.fa-otter:before {
    content: "";
}

.fa-outdent:before {
    content: "";
}

.fa-page4:before {
    content: "";
}

.fa-pagelines:before {
    content: "";
}

.fa-pager:before {
    content: "";
}

.fa-paint-brush:before {
    content: "";
}

.fa-paint-roller:before {
    content: "";
}

.fa-palette:before {
    content: "";
}

.fa-palfed:before {
    content: "";
}

.fa-pallet:before {
    content: "";
}

.fa-paper-plane:before {
    content: "";
}

.fa-paperclip:before {
    content: "";
}

.fa-parachute-box:before {
    content: "";
}

.fa-paragraph:before {
    content: "";
}

.fa-parking:before {
    content: "";
}

.fa-passport:before {
    content: "";
}

.fa-pastafarianism:before {
    content: "";
}

.fa-paste:before {
    content: "";
}

.fa-patreon:before {
    content: "";
}

.fa-pause:before {
    content: "";
}

.fa-pause-circle:before {
    content: "";
}

.fa-paw:before {
    content: "";
}

.fa-paypal:before {
    content: "";
}

.fa-peace:before {
    content: "";
}

.fa-pen:before {
    content: "";
}

.fa-pen-alt:before {
    content: "";
}

.fa-pen-fancy:before {
    content: "";
}

.fa-pen-nib:before {
    content: "";
}

.fa-pen-square:before {
    content: "";
}

.fa-pencil-alt:before {
    content: "";
}

.fa-pencil-ruler:before {
    content: "";
}

.fa-penny-arcade:before {
    content: "";
}

.fa-people-arrows:before {
    content: "";
}

.fa-people-carry:before {
    content: "";
}

.fa-pepper-hot:before {
    content: "";
}

.fa-perbyte:before {
    content: "";
}

.fa-percent:before {
    content: "";
}

.fa-percentage:before {
    content: "";
}

.fa-periscope:before {
    content: "";
}

.fa-person-booth:before {
    content: "";
}

.fa-phabricator:before {
    content: "";
}

.fa-phoenix-framework:before {
    content: "";
}

.fa-phoenix-squadron:before {
    content: "";
}

.fa-phone:before {
    content: "";
}

.fa-phone-alt:before {
    content: "";
}

.fa-phone-slash:before {
    content: "";
}

.fa-phone-square:before {
    content: "";
}

.fa-phone-square-alt:before {
    content: "";
}

.fa-phone-volume:before {
    content: "";
}

.fa-photo-video:before {
    content: "";
}

.fa-php:before {
    content: "";
}

.fa-pied-piper:before {
    content: "";
}

.fa-pied-piper-alt:before {
    content: "";
}

.fa-pied-piper-hat:before {
    content: "";
}

.fa-pied-piper-pp:before {
    content: "";
}

.fa-pied-piper-square:before {
    content: "";
}

.fa-piggy-bank:before {
    content: "";
}

.fa-pills:before {
    content: "";
}

.fa-pinterest:before {
    content: "";
}

.fa-pinterest-p:before {
    content: "";
}

.fa-pinterest-square:before {
    content: "";
}

.fa-pizza-slice:before {
    content: "";
}

.fa-place-of-worship:before {
    content: "";
}

.fa-plane:before {
    content: "";
}

.fa-plane-arrival:before {
    content: "";
}

.fa-plane-departure:before {
    content: "";
}

.fa-plane-slash:before {
    content: "";
}

.fa-play:before {
    content: "";
}

.fa-play-circle:before {
    content: "";
}

.fa-playstation:before {
    content: "";
}

.fa-plug:before {
    content: "";
}

.fa-plus:before {
    content: "";
}

.fa-plus-circle:before {
    content: "";
}

.fa-plus-square:before {
    content: "";
}

.fa-podcast:before {
    content: "";
}

.fa-poll:before {
    content: "";
}

.fa-poll-h:before {
    content: "";
}

.fa-poo:before {
    content: "";
}

.fa-poo-storm:before {
    content: "";
}

.fa-poop:before {
    content: "";
}

.fa-portrait:before {
    content: "";
}

.fa-pound-sign:before {
    content: "";
}

.fa-power-off:before {
    content: "";
}

.fa-pray:before {
    content: "";
}

.fa-praying-hands:before {
    content: "";
}

.fa-prescription:before {
    content: "";
}

.fa-prescription-bottle:before {
    content: "";
}

.fa-prescription-bottle-alt:before {
    content: "";
}

.fa-print:before {
    content: "";
}

.fa-procedures:before {
    content: "";
}

.fa-product-hunt:before {
    content: "";
}

.fa-project-diagram:before {
    content: "";
}

.fa-pump-medical:before {
    content: "";
}

.fa-pump-soap:before {
    content: "";
}

.fa-pushed:before {
    content: "";
}

.fa-puzzle-piece:before {
    content: "";
}

.fa-python:before {
    content: "";
}

.fa-qq:before {
    content: "";
}

.fa-qrcode:before {
    content: "";
}

.fa-question:before {
    content: "";
}

.fa-question-circle:before {
    content: "";
}

.fa-quidditch:before {
    content: "";
}

.fa-quinscape:before {
    content: "";
}

.fa-quora:before {
    content: "";
}

.fa-quote-left:before {
    content: "";
}

.fa-quote-right:before {
    content: "";
}

.fa-quran:before {
    content: "";
}

.fa-r-project:before {
    content: "";
}

.fa-radiation:before {
    content: "";
}

.fa-radiation-alt:before {
    content: "";
}

.fa-rainbow:before {
    content: "";
}

.fa-random:before {
    content: "";
}

.fa-raspberry-pi:before {
    content: "";
}

.fa-ravelry:before {
    content: "";
}

.fa-react:before {
    content: "";
}

.fa-reacteurope:before {
    content: "";
}

.fa-readme:before {
    content: "";
}

.fa-rebel:before {
    content: "";
}

.fa-receipt:before {
    content: "";
}

.fa-record-vinyl:before {
    content: "";
}

.fa-recycle:before {
    content: "";
}

.fa-red-river:before {
    content: "";
}

.fa-reddit:before {
    content: "";
}

.fa-reddit-alien:before {
    content: "";
}

.fa-reddit-square:before {
    content: "";
}

.fa-redhat:before {
    content: "";
}

.fa-redo:before {
    content: "";
}

.fa-redo-alt:before {
    content: "";
}

.fa-registered:before {
    content: "";
}

.fa-remove-format:before {
    content: "";
}

.fa-renren:before {
    content: "";
}

.fa-reply:before {
    content: "";
}

.fa-reply-all:before {
    content: "";
}

.fa-replyd:before {
    content: "";
}

.fa-republican:before {
    content: "";
}

.fa-researchgate:before {
    content: "";
}

.fa-resolving:before {
    content: "";
}

.fa-restroom:before {
    content: "";
}

.fa-retweet:before {
    content: "";
}

.fa-rev:before {
    content: "";
}

.fa-ribbon:before {
    content: "";
}

.fa-ring:before {
    content: "";
}

.fa-road:before {
    content: "";
}

.fa-robot:before {
    content: "";
}

.fa-rocket:before {
    content: "";
}

.fa-rocketchat:before {
    content: "";
}

.fa-rockrms:before {
    content: "";
}

.fa-route:before {
    content: "";
}

.fa-rss:before {
    content: "";
}

.fa-rss-square:before {
    content: "";
}

.fa-ruble-sign:before {
    content: "";
}

.fa-ruler:before {
    content: "";
}

.fa-ruler-combined:before {
    content: "";
}

.fa-ruler-horizontal:before {
    content: "";
}

.fa-ruler-vertical:before {
    content: "";
}

.fa-running:before {
    content: "";
}

.fa-rupee-sign:before {
    content: "";
}

.fa-rust:before {
    content: "";
}

.fa-sad-cry:before {
    content: "";
}

.fa-sad-tear:before {
    content: "";
}

.fa-safari:before {
    content: "";
}

.fa-salesforce:before {
    content: "";
}

.fa-sass:before {
    content: "";
}

.fa-satellite:before {
    content: "";
}

.fa-satellite-dish:before {
    content: "";
}

.fa-save:before {
    content: "";
}

.fa-schlix:before {
    content: "";
}

.fa-school:before {
    content: "";
}

.fa-screwdriver:before {
    content: "";
}

.fa-scribd:before {
    content: "";
}

.fa-scroll:before {
    content: "";
}

.fa-sd-card:before {
    content: "";
}

.fa-search:before {
    content: "";
}

.fa-search-dollar:before {
    content: "";
}

.fa-search-location:before {
    content: "";
}

.fa-search-minus:before {
    content: "";
}

.fa-search-plus:before {
    content: "";
}

.fa-searchengin:before {
    content: "";
}

.fa-seedling:before {
    content: "";
}

.fa-sellcast:before {
    content: "";
}

.fa-sellsy:before {
    content: "";
}

.fa-server:before {
    content: "";
}

.fa-servicestack:before {
    content: "";
}

.fa-shapes:before {
    content: "";
}

.fa-share:before {
    content: "";
}

.fa-share-alt:before {
    content: "";
}

.fa-share-alt-square:before {
    content: "";
}

.fa-share-square:before {
    content: "";
}

.fa-shekel-sign:before {
    content: "";
}

.fa-shield-alt:before {
    content: "";
}

.fa-shield-virus:before {
    content: "";
}

.fa-ship:before {
    content: "";
}

.fa-shipping-fast:before {
    content: "";
}

.fa-shirtsinbulk:before {
    content: "";
}

.fa-shoe-prints:before {
    content: "";
}

.fa-shopify:before {
    content: "";
}

.fa-shopping-bag:before {
    content: "";
}

.fa-shopping-basket:before {
    content: "";
}

.fa-shopping-cart:before {
    content: "";
}

.fa-shopware:before {
    content: "";
}

.fa-shower:before {
    content: "";
}

.fa-shuttle-van:before {
    content: "";
}

.fa-sign:before {
    content: "";
}

.fa-sign-in-alt:before {
    content: "";
}

.fa-sign-language:before {
    content: "";
}

.fa-sign-out-alt:before {
    content: "";
}

.fa-signal:before {
    content: "";
}

.fa-signature:before {
    content: "";
}

.fa-sim-card:before {
    content: "";
}

.fa-simplybuilt:before {
    content: "";
}

.fa-sink:before {
    content: "";
}

.fa-sistrix:before {
    content: "";
}

.fa-sitemap:before {
    content: "";
}

.fa-sith:before {
    content: "";
}

.fa-skating:before {
    content: "";
}

.fa-sketch:before {
    content: "";
}

.fa-skiing:before {
    content: "";
}

.fa-skiing-nordic:before {
    content: "";
}

.fa-skull:before {
    content: "";
}

.fa-skull-crossbones:before {
    content: "";
}

.fa-skyatlas:before {
    content: "";
}

.fa-skype:before {
    content: "";
}

.fa-slack:before {
    content: "";
}

.fa-slack-hash:before {
    content: "";
}

.fa-slash:before {
    content: "";
}

.fa-sleigh:before {
    content: "";
}

.fa-sliders-h:before {
    content: "";
}

.fa-slideshare:before {
    content: "";
}

.fa-smile:before {
    content: "";
}

.fa-smile-beam:before {
    content: "";
}

.fa-smile-wink:before {
    content: "";
}

.fa-smog:before {
    content: "";
}

.fa-smoking:before {
    content: "";
}

.fa-smoking-ban:before {
    content: "";
}

.fa-sms:before {
    content: "";
}

.fa-snapchat:before {
    content: "";
}

.fa-snapchat-ghost:before {
    content: "";
}

.fa-snapchat-square:before {
    content: "";
}

.fa-snowboarding:before {
    content: "";
}

.fa-snowflake:before {
    content: "";
}

.fa-snowman:before {
    content: "";
}

.fa-snowplow:before {
    content: "";
}

.fa-soap:before {
    content: "";
}

.fa-socks:before {
    content: "";
}

.fa-solar-panel:before {
    content: "";
}

.fa-sort:before {
    content: "";
}

.fa-sort-alpha-down:before {
    content: "";
}

.fa-sort-alpha-down-alt:before {
    content: "";
}

.fa-sort-alpha-up:before {
    content: "";
}

.fa-sort-alpha-up-alt:before {
    content: "";
}

.fa-sort-amount-down:before {
    content: "";
}

.fa-sort-amount-down-alt:before {
    content: "";
}

.fa-sort-amount-up:before {
    content: "";
}

.fa-sort-amount-up-alt:before {
    content: "";
}

.fa-sort-down:before {
    content: "";
}

.fa-sort-numeric-down:before {
    content: "";
}

.fa-sort-numeric-down-alt:before {
    content: "";
}

.fa-sort-numeric-up:before {
    content: "";
}

.fa-sort-numeric-up-alt:before {
    content: "";
}

.fa-sort-up:before {
    content: "";
}

.fa-soundcloud:before {
    content: "";
}

.fa-sourcetree:before {
    content: "";
}

.fa-spa:before {
    content: "";
}

.fa-space-shuttle:before {
    content: "";
}

.fa-speakap:before {
    content: "";
}

.fa-speaker-deck:before {
    content: "";
}

.fa-spell-check:before {
    content: "";
}

.fa-spider:before {
    content: "";
}

.fa-spinner:before {
    content: "";
}

.fa-splotch:before {
    content: "";
}

.fa-spotify:before {
    content: "";
}

.fa-spray-can:before {
    content: "";
}

.fa-square:before {
    content: "";
}

.fa-square-full:before {
    content: "";
}

.fa-square-root-alt:before {
    content: "";
}

.fa-squarespace:before {
    content: "";
}

.fa-stack-exchange:before {
    content: "";
}

.fa-stack-overflow:before {
    content: "";
}

.fa-stackpath:before {
    content: "";
}

.fa-stamp:before {
    content: "";
}

.fa-star:before {
    content: "";
}

.fa-star-and-crescent:before {
    content: "";
}

.fa-star-half:before {
    content: "";
}

.fa-star-half-alt:before {
    content: "";
}

.fa-star-of-david:before {
    content: "";
}

.fa-star-of-life:before {
    content: "";
}

.fa-staylinked:before {
    content: "";
}

.fa-steam:before {
    content: "";
}

.fa-steam-square:before {
    content: "";
}

.fa-steam-symbol:before {
    content: "";
}

.fa-step-backward:before {
    content: "";
}

.fa-step-forward:before {
    content: "";
}

.fa-stethoscope:before {
    content: "";
}

.fa-sticker-mule:before {
    content: "";
}

.fa-sticky-note:before {
    content: "";
}

.fa-stop:before {
    content: "";
}

.fa-stop-circle:before {
    content: "";
}

.fa-stopwatch:before {
    content: "";
}

.fa-stopwatch-20:before {
    content: "";
}

.fa-store:before {
    content: "";
}

.fa-store-alt:before {
    content: "";
}

.fa-store-alt-slash:before {
    content: "";
}

.fa-store-slash:before {
    content: "";
}

.fa-strava:before {
    content: "";
}

.fa-stream:before {
    content: "";
}

.fa-street-view:before {
    content: "";
}

.fa-strikethrough:before {
    content: "";
}

.fa-stripe:before {
    content: "";
}

.fa-stripe-s:before {
    content: "";
}

.fa-stroopwafel:before {
    content: "";
}

.fa-studiovinari:before {
    content: "";
}

.fa-stumbleupon:before {
    content: "";
}

.fa-stumbleupon-circle:before {
    content: "";
}

.fa-subscript:before {
    content: "";
}

.fa-subway:before {
    content: "";
}

.fa-suitcase:before {
    content: "";
}

.fa-suitcase-rolling:before {
    content: "";
}

.fa-sun:before {
    content: "";
}

.fa-superpowers:before {
    content: "";
}

.fa-superscript:before {
    content: "";
}

.fa-supple:before {
    content: "";
}

.fa-surprise:before {
    content: "";
}

.fa-suse:before {
    content: "";
}

.fa-swatchbook:before {
    content: "";
}

.fa-swift:before {
    content: "";
}

.fa-swimmer:before {
    content: "";
}

.fa-swimming-pool:before {
    content: "";
}

.fa-symfony:before {
    content: "";
}

.fa-synagogue:before {
    content: "";
}

.fa-sync:before {
    content: "";
}

.fa-sync-alt:before {
    content: "";
}

.fa-syringe:before {
    content: "";
}

.fa-table:before {
    content: "";
}

.fa-table-tennis:before {
    content: "";
}

.fa-tablet:before {
    content: "";
}

.fa-tablet-alt:before {
    content: "";
}

.fa-tablets:before {
    content: "";
}

.fa-tachometer-alt:before {
    content: "";
}

.fa-tag:before {
    content: "";
}

.fa-tags:before {
    content: "";
}

.fa-tape:before {
    content: "";
}

.fa-tasks:before {
    content: "";
}

.fa-taxi:before {
    content: "";
}

.fa-teamspeak:before {
    content: "";
}

.fa-teeth:before {
    content: "";
}

.fa-teeth-open:before {
    content: "";
}

.fa-telegram:before {
    content: "";
}

.fa-telegram-plane:before {
    content: "";
}

.fa-temperature-high:before {
    content: "";
}

.fa-temperature-low:before {
    content: "";
}

.fa-tencent-weibo:before {
    content: "";
}

.fa-tenge:before {
    content: "";
}

.fa-terminal:before {
    content: "";
}

.fa-text-height:before {
    content: "";
}

.fa-text-width:before {
    content: "";
}

.fa-th:before {
    content: "";
}

.fa-th-large:before {
    content: "";
}

.fa-th-list:before {
    content: "";
}

.fa-the-red-yeti:before {
    content: "";
}

.fa-theater-masks:before {
    content: "";
}

.fa-themeco:before {
    content: "";
}

.fa-themeisle:before {
    content: "";
}

.fa-thermometer:before {
    content: "";
}

.fa-thermometer-empty:before {
    content: "";
}

.fa-thermometer-full:before {
    content: "";
}

.fa-thermometer-half:before {
    content: "";
}

.fa-thermometer-quarter:before {
    content: "";
}

.fa-thermometer-three-quarters:before {
    content: "";
}

.fa-think-peaks:before {
    content: "";
}

.fa-thumbs-down:before {
    content: "";
}

.fa-thumbs-up:before {
    content: "";
}

.fa-thumbtack:before {
    content: "";
}

.fa-ticket-alt:before {
    content: "";
}

.fa-tiktok:before {
    content: "";
}

.fa-times:before {
    content: "";
}

.fa-times-circle:before {
    content: "";
}

.fa-tint:before {
    content: "";
}

.fa-tint-slash:before {
    content: "";
}

.fa-tired:before {
    content: "";
}

.fa-toggle-off:before {
    content: "";
}

.fa-toggle-on:before {
    content: "";
}

.fa-toilet:before {
    content: "";
}

.fa-toilet-paper:before {
    content: "";
}

.fa-toilet-paper-slash:before {
    content: "";
}

.fa-toolbox:before {
    content: "";
}

.fa-tools:before {
    content: "";
}

.fa-tooth:before {
    content: "";
}

.fa-torah:before {
    content: "";
}

.fa-torii-gate:before {
    content: "";
}

.fa-tractor:before {
    content: "";
}

.fa-trade-federation:before {
    content: "";
}

.fa-trademark:before {
    content: "";
}

.fa-traffic-light:before {
    content: "";
}

.fa-trailer:before {
    content: "";
}

.fa-train:before {
    content: "";
}

.fa-tram:before {
    content: "";
}

.fa-transgender:before {
    content: "";
}

.fa-transgender-alt:before {
    content: "";
}

.fa-trash:before {
    content: "";
}

.fa-trash-alt:before {
    content: "";
}

.fa-trash-restore:before {
    content: "";
}

.fa-trash-restore-alt:before {
    content: "";
}

.fa-tree:before {
    content: "";
}

.fa-trello:before {
    content: "";
}

.fa-tripadvisor:before {
    content: "";
}

.fa-trophy:before {
    content: "";
}

.fa-truck:before {
    content: "";
}

.fa-truck-loading:before {
    content: "";
}

.fa-truck-monster:before {
    content: "";
}

.fa-truck-moving:before {
    content: "";
}

.fa-truck-pickup:before {
    content: "";
}

.fa-tshirt:before {
    content: "";
}

.fa-tty:before {
    content: "";
}

.fa-tumblr:before {
    content: "";
}

.fa-tumblr-square:before {
    content: "";
}

.fa-tv:before {
    content: "";
}

.fa-twitch:before {
    content: "";
}

.fa-twitter:before {
    content: "";
}

.fa-twitter-square:before {
    content: "";
}

.fa-typo3:before {
    content: "";
}

.fa-uber:before {
    content: "";
}

.fa-ubuntu:before {
    content: "";
}

.fa-uikit:before {
    content: "";
}

.fa-umbraco:before {
    content: "";
}

.fa-umbrella:before {
    content: "";
}

.fa-umbrella-beach:before {
    content: "";
}

.fa-uncharted:before {
    content: "";
}

.fa-underline:before {
    content: "";
}

.fa-undo:before {
    content: "";
}

.fa-undo-alt:before {
    content: "";
}

.fa-uniregistry:before {
    content: "";
}

.fa-unity:before {
    content: "";
}

.fa-universal-access:before {
    content: "";
}

.fa-university:before {
    content: "";
}

.fa-unlink:before {
    content: "";
}

.fa-unlock:before {
    content: "";
}

.fa-unlock-alt:before {
    content: "";
}

.fa-unsplash:before {
    content: "";
}

.fa-untappd:before {
    content: "";
}

.fa-upload:before {
    content: "";
}

.fa-ups:before {
    content: "";
}

.fa-usb:before {
    content: "";
}

.fa-user:before {
    content: "";
}

.fa-user-alt:before {
    content: "";
}

.fa-user-alt-slash:before {
    content: "";
}

.fa-user-astronaut:before {
    content: "";
}

.fa-user-check:before {
    content: "";
}

.fa-user-circle:before {
    content: "";
}

.fa-user-clock:before {
    content: "";
}

.fa-user-cog:before {
    content: "";
}

.fa-user-edit:before {
    content: "";
}

.fa-user-friends:before {
    content: "";
}

.fa-user-graduate:before {
    content: "";
}

.fa-user-injured:before {
    content: "";
}

.fa-user-lock:before {
    content: "";
}

.fa-user-md:before {
    content: "";
}

.fa-user-minus:before {
    content: "";
}

.fa-user-ninja:before {
    content: "";
}

.fa-user-nurse:before {
    content: "";
}

.fa-user-plus:before {
    content: "";
}

.fa-user-secret:before {
    content: "";
}

.fa-user-shield:before {
    content: "";
}

.fa-user-slash:before {
    content: "";
}

.fa-user-tag:before {
    content: "";
}

.fa-user-tie:before {
    content: "";
}

.fa-user-times:before {
    content: "";
}

.fa-users:before {
    content: "";
}

.fa-users-cog:before {
    content: "";
}

.fa-users-slash:before {
    content: "";
}

.fa-usps:before {
    content: "";
}

.fa-ussunnah:before {
    content: "";
}

.fa-utensil-spoon:before {
    content: "";
}

.fa-utensils:before {
    content: "";
}

.fa-vaadin:before {
    content: "";
}

.fa-vector-square:before {
    content: "";
}

.fa-venus:before {
    content: "";
}

.fa-venus-double:before {
    content: "";
}

.fa-venus-mars:before {
    content: "";
}

.fa-vest:before {
    content: "";
}

.fa-vest-patches:before {
    content: "";
}

.fa-viacoin:before {
    content: "";
}

.fa-viadeo:before {
    content: "";
}

.fa-viadeo-square:before {
    content: "";
}

.fa-vial:before {
    content: "";
}

.fa-vials:before {
    content: "";
}

.fa-viber:before {
    content: "";
}

.fa-video:before {
    content: "";
}

.fa-video-slash:before {
    content: "";
}

.fa-vihara:before {
    content: "";
}

.fa-vimeo:before {
    content: "";
}

.fa-vimeo-square:before {
    content: "";
}

.fa-vimeo-v:before {
    content: "";
}

.fa-vine:before {
    content: "";
}

.fa-virus:before {
    content: "";
}

.fa-virus-slash:before {
    content: "";
}

.fa-viruses:before {
    content: "";
}

.fa-vk:before {
    content: "";
}

.fa-vnv:before {
    content: "";
}

.fa-voicemail:before {
    content: "";
}

.fa-volleyball-ball:before {
    content: "";
}

.fa-volume-down:before {
    content: "";
}

.fa-volume-mute:before {
    content: "";
}

.fa-volume-off:before {
    content: "";
}

.fa-volume-up:before {
    content: "";
}

.fa-vote-yea:before {
    content: "";
}

.fa-vr-cardboard:before {
    content: "";
}

.fa-vuejs:before {
    content: "";
}

.fa-walking:before {
    content: "";
}

.fa-wallet:before {
    content: "";
}

.fa-warehouse:before {
    content: "";
}

.fa-watchman-monitoring:before {
    content: "";
}

.fa-water:before {
    content: "";
}

.fa-wave-square:before {
    content: "";
}

.fa-waze:before {
    content: "";
}

.fa-weebly:before {
    content: "";
}

.fa-weibo:before {
    content: "";
}

.fa-weight:before {
    content: "";
}

.fa-weight-hanging:before {
    content: "";
}

.fa-weixin:before {
    content: "";
}

.fa-whatsapp:before {
    content: "";
}

.fa-whatsapp-square:before {
    content: "";
}

.fa-wheelchair:before {
    content: "";
}

.fa-whmcs:before {
    content: "";
}

.fa-wifi:before {
    content: "";
}

.fa-wikipedia-w:before {
    content: "";
}

.fa-wind:before {
    content: "";
}

.fa-window-close:before {
    content: "";
}

.fa-window-maximize:before {
    content: "";
}

.fa-window-minimize:before {
    content: "";
}

.fa-window-restore:before {
    content: "";
}

.fa-windows:before {
    content: "";
}

.fa-wine-bottle:before {
    content: "";
}

.fa-wine-glass:before {
    content: "";
}

.fa-wine-glass-alt:before {
    content: "";
}

.fa-wix:before {
    content: "";
}

.fa-wizards-of-the-coast:before {
    content: "";
}

.fa-wodu:before {
    content: "";
}

.fa-wolf-pack-battalion:before {
    content: "";
}

.fa-won-sign:before {
    content: "";
}

.fa-wordpress:before {
    content: "";
}

.fa-wordpress-simple:before {
    content: "";
}

.fa-wpbeginner:before {
    content: "";
}

.fa-wpexplorer:before {
    content: "";
}

.fa-wpforms:before {
    content: "";
}

.fa-wpressr:before {
    content: "";
}

.fa-wrench:before {
    content: "";
}

.fa-x-ray:before {
    content: "";
}

.fa-xbox:before {
    content: "";
}

.fa-xing:before {
    content: "";
}

.fa-xing-square:before {
    content: "";
}

.fa-y-combinator:before {
    content: "";
}

.fa-yahoo:before {
    content: "";
}

.fa-yammer:before {
    content: "";
}

.fa-yandex:before {
    content: "";
}

.fa-yandex-international:before {
    content: "";
}

.fa-yarn:before {
    content: "";
}

.fa-yelp:before {
    content: "";
}

.fa-yen-sign:before {
    content: "";
}

.fa-yin-yang:before {
    content: "";
}

.fa-yoast:before {
    content: "";
}

.fa-youtube:before {
    content: "";
}

.fa-youtube-square:before {
    content: "";
}

.fa-zhihu:before {
    content: "";
}

.sr-only {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/* -------------------------------------------------- */
/* SITE HEADER
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header.site-header .wrap {
    overflow: visible;
}

header.site-header .header-grid {
    display: flex;
    justify-content: flex-start;
    flex-flow: column wrap;
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
    position: relative;
    overflow: visible;
}

@media (min-width: 768px) {
    header.site-header .header-grid {
        flex-flow: row nowrap;
        align-items: center;
    }
}

header.site-header .logo h1 {
    display: none;
}

header.site-header.default .logo {
    display: block;
    position: relative;
}

header.site-header.default .logo figure svg,
header.site-header.default .logo figure img {
    width: 100%;
    height: auto;
    max-width: 13rem;
}

.logo figure svg,
.logo figure img {
    margin: 0 auto;
}

header.site-header.default .logo a {
    display: block;
    position: relative;
}

header.site-header.default nav {
    flex: 50% 50% auto;
    flex-basis: 50%;
    width: 50%;
    padding: 0;
}

header.site-header.default .account {
    text-align: right;
}

header.site-header.default .account .button,
header.site-header.default .account section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items header.site-header.default .account label,
header.site-header.default .account .day-list label,
.day-list header.site-header.default .account label,
header.site-header.default .account .rooms-card-list .card-footer label,
.rooms-card-list .card-footer header.site-header.default .account label,
header.site-header.default .account button,
header.site-header.default .account input[type=submit] {
    margin-bottom: 0;
    position: relative;
}

header.site-header.default .logo,
header.site-header.default .account {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    header.site-header.default .logo,
    header.site-header.default .account {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Header Logo
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.logo figure {
    margin-bottom: 0;
    width: 100%;
    position: relative;
    overflow: hidden;
}

@media (min-width: 768px) {
    .logo figure {
        max-width: 250px;
    }
}

.logo figure svg {
    display: block;
    height: 100%;
    width: auto;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* SITE FOOTER
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.site-footer {
    padding: 2rem 0;
}

.site-footer p,
.site-footer .site-header .account .account-details label,
.site-header .account .account-details .site-footer label {
    margin-bottom: 0;
}

.login .site-footer,
.error .site-footer {
    background-color: #005C7C;
    color: #fafafa;
}

.login .site-footer p,
.login .site-footer .site-header .account .account-details label,
.site-header .account .account-details .login .site-footer label,
.error .site-footer p,
.error .site-footer .site-header .account .account-details label,
.site-header .account .account-details .error .site-footer label {
    text-align: center;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* SHARED STYLES ACROSS SUBPAGES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    border-top: 1px solid #ccc;
}

@media (min-width: 768px) {
    .confirmation-row {
        flex-direction: row;
        flex-wrap: nowrap;
    }
}

.confirmation-row .confirmation-text {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .confirmation-row .confirmation-text {
        flex-grow: 1;
    }
}

.confirmation-row .confirmation-text h2 {
    padding: 0;
}

.confirmation-row .confirmation-button {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .confirmation-row .confirmation-button {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
        text-align: right;
    }
}

.confirmation-row .confirmation-button .button,
.confirmation-row .confirmation-button section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .confirmation-row .confirmation-button input[type=radio]:checked~label,
.confirmation-row .confirmation-button section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .confirmation-row .confirmation-button label,
.confirmation-row .confirmation-button .day-list label,
.day-list .confirmation-row .confirmation-button label,
.confirmation-row .confirmation-button .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .confirmation-row .confirmation-button label,
.confirmation-row .confirmation-button button {
    width: 100%;
}

@media (min-width: 768px) {

    .confirmation-row .confirmation-button .button,
    .confirmation-row .confirmation-button section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .confirmation-row .confirmation-button input[type=radio]:checked~label,
    .confirmation-row .confirmation-button section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .confirmation-row .confirmation-button label,
    .confirmation-row .confirmation-button .day-list label,
    .day-list .confirmation-row .confirmation-button label,
    .confirmation-row .confirmation-button .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .confirmation-row .confirmation-button label,
    .confirmation-row .confirmation-button button {
        width: auto;
        margin: 0;
    }
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Login Page
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
section.login {
    text-align: center;
    width: 100%;
}

@media (min-width: 768px) {
    section.login {
        max-width: 500px;
        min-width: 300px;
        margin: 0 auto;
    }
}

section.login .toolbar-body {
    background: #fff;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
}

section.login .row {
    flex-direction: column;
    align-items: center;
    margin-bottom: 1.5rem;
}

section.login .row input,
section.login .row label {
    width: 100%;
}

section.login .row label {
    text-align: left;
}

section.login .row:last-child {
    margin-bottom: 0;
}

section.login .login-actions .button,
section.login .login-actions section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items section.login .login-actions label,
section.login .login-actions .day-list label,
.day-list section.login .login-actions label,
section.login .login-actions .rooms-card-list .card-footer label,
.rooms-card-list .card-footer section.login .login-actions label,
section.login .login-actions button,
section.login .login-actions input[type=submit] {
    width: 100%;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {

    section.login .login-actions .button,
    section.login .login-actions section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items section.login .login-actions label,
    section.login .login-actions .day-list label,
    .day-list section.login .login-actions label,
    section.login .login-actions .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer section.login .login-actions label,
    section.login .login-actions button,
    section.login .login-actions input[type=submit] {
        width: 100%;
    }
}

section.login form {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 0;
}

section.login .icon-wrap {
    width: 100%;
    position: relative;
}

section.login .icon-wrap input {
    padding-left: 2.5em;
    width: 100%;
    margin: 0;
}

section.login .icon-wrap:before {
    width: 40px;
    height: 40px;
    line-height: 40px;
    position: absolute;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    top: 50%;
    color: var(--hero-area-colour);
    transform: translateY(-50%);
}

section.login .icon-wrap.username:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "";
}

section.login .icon-wrap.password:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "";
}

section.login .icon-wrap:focus-within:before {
    color: var(--primary-colour);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*BOOKING SECTIONS
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (min-width: 768px) {
    #capacityNoResource {
        margin-top: 1.5rem;
        margin-bottom: 0;
    }
}

.appointment h1,
.appointment .h1,
.appointment h2,
.appointment .h2,
.appointment .calendar-instructions {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.appointment .calendar-instructions *:first-child {
    margin-top: 0;
}

.appointment .toolbar .location-search-bar,
.appointment .toolbar .datepicker-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .appointment .toolbar .location-search-bar,
    .appointment .toolbar .datepicker-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment .toolbar table {
    display: table;
}

.appointment .location-time-select {
    list-style: none;
}

.appointment .location-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .appointment .location-row {
        flex: 100% 100% auto;
        flex-basis: 100%;
        width: 100%;
        padding: 0;
    }
}

.appointment .location-row .row {
    flex-direction: column;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    margin: 0 16px;
    width: auto;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
}

@media (min-width: 768px) {
    .appointment .location-row .row {
        flex: 100% 100% auto;
        flex-basis: 100%;
        width: 100%;
        padding-right: 16px;
        padding-left: 16px;
        flex-direction: row;
        margin: 0;
        align-items: flex-start;
        background: transparent;
        border: 0px solid rgba(0, 0, 0, 0.125);
        border-radius: 0.25rem;
        box-shadow: none;
    }
}

.appointment .location-row .location-card-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .appointment .location-row .location-card-col {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding: 0;
    }
}

@media (min-width: 768px) {
    .appointment .location-row .location-card {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border: 1px solid rgba(0, 0, 0, 0.125);
        border-radius: 0.25rem;
        background: white;
        box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
    }
}

.appointment .location-row .location-card .card-body,
.appointment .location-row .location-card .modal .modal-body,
.modal .appointment .location-row .location-card .modal-body {
    padding: 1.5rem 0;
}

@media (min-width: 768px) {

    .appointment .location-row .location-card .card-body,
    .appointment .location-row .location-card .modal .modal-body,
    .modal .appointment .location-row .location-card .modal-body {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 1.5rem;
    }
}

.appointment .location-row .location-card .location-card .alert,
.appointment .location-row .location-card .location-card form label.error,
form .appointment .location-row .location-card .location-card label.error {
    display: block;
}

@media (min-width: 768px) {

    .appointment .location-row .location-card .location-card .alert,
    .appointment .location-row .location-card .location-card form label.error,
    form .appointment .location-row .location-card .location-card label.error {
        display: none;
    }
}

.appointment .location-row .time-select {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    position: relative;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .appointment .location-row .time-select {
        flex: 60.667% 60.667% auto;
        flex-basis: 60.667%;
        width: 60.667%;
        padding: 0;
    }
}

.appointment .location-row .time-select button.hide,
.appointment .location-row .time-select .button.hide,
.appointment .location-row .time-select section.confirmationPayment .payment-method-select-items label.hide,
section.confirmationPayment .payment-method-select-items .appointment .location-row .time-select label.hide,
.appointment .location-row .time-select .day-list label.hide,
.day-list .appointment .location-row .time-select label.hide,
.appointment .location-row .time-select .rooms-card-list .card-footer label.hide,
.rooms-card-list .card-footer .appointment .location-row .time-select label.hide {
    display: none;
}

.appointment .location-row .time-select .row {
    background: transparent;
    border: 0px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
    padding: 0 16px;
    margin: 0;
    box-shadow: none;
}

.appointment .location-row .time-select .row .button-row {
    position: relative;
    margin-top: 0.75rem;
}

.appointment .location-row .time-select .row .accordion-header {
    display: flex;
}

.appointment .location-row .time-select .row .accordion-header.unavailable {
    display: none;
}

.appointment .location-row .time-select input:checked~label {
    background: #008764;
    border: #008764;
    color: #fafafa;
}

.appointment .location-row .time-select input:disabled~label {
    background: #D1486F;
    border: 1px solid #D1486F;
    color: white;
    opacity: 0.25;
}

@media (min-width: 768px) {

    .appointment .location-row .time-select .accordion-header,
    .appointment .location-row .time-select .accordion-header.unavailable {
        display: none;
    }
}

.appointment .location-row .time-select .time-select-show {
    display: none;
}

.appointment .location-row .time-select .time-select-show.show {
    display: block;
}

.appointment .location-row .time-select .time-select-show.unavailable,
.appointment .location-row .time-select .time-select-show.unavailable.show {
    display: none;
}

.appointment .location-row .time-select .time-select-show .alert,
.appointment .location-row .time-select .time-select-show form label.error,
form .appointment .location-row .time-select .time-select-show label.error {
    height: 100%;
}

@media (min-width: 768px) {
    .appointment .location-row .time-select .time-select-show {
        display: block;
        height: 100%;
        margin-bottom: 1.5rem;
    }

    .appointment .location-row .time-select .time-select-show.show {
        display: block;
        height: 100%;
        margin-bottom: 1.5rem;
    }

    .appointment .location-row .time-select .time-select-show.unavailable,
    .appointment .location-row .time-select .time-select-show.unavailable.show {
        display: block;
    }
}

.appointment .location-row .time-select-items {
    list-style: none;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
}

.appointment .location-row .time-select-items li.hide {
    display: none;
}

.appointment .location-row .time-select-items label {
    padding: 0.25em 0.5em;
    margin: 0.75rem 8px;
    border-radius: 16px;
    background: #CCE7E0;
    border: 1px solid #339F83;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
    display: flex;
    flex-flow: row nowrap;
    transition: all 0.05s ease;
    cursor: pointer;
}

.appointment .location-row .time-select-items label:hover,
.appointment .location-row .time-select-items input:focus~label {
    background: #008764;
    color: white;
    transition: all 0.05s ease;
}

.appointment .location-row .time-select-items input:focus~label {
    outline: 2px solid var(--primary-colour);
}

.appointment #formTermsandConditions .row,
.appointment #formTermsandConditions .checkbox-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.appointment #bookingConfirmPage .alert.success,
.appointment #bookingConfirmPage form label.success.error,
form .appointment #bookingConfirmPage label.success.error {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 1rem 16px;
}

.appointment #bookingConfirmPage .alert.success h2,
.appointment #bookingConfirmPage form label.success.error h2,
form .appointment #bookingConfirmPage label.success.error h2 {
    flex-grow: 1;
    max-width: 100%;
    margin-left: 0.5rem;
    color: #006C50;
}

.appointment #bookingConfirmPage .alert.success .fas,
.appointment #bookingConfirmPage form label.success.error .fas,
form .appointment #bookingConfirmPage label.success.error .fas {
    color: #006C50;
}

.appointment #bookingConfirmPage .booking-complete-col {
    margin: auto;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/*Location/Time Select Styling
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.location-time-select {
    list-style: none;
    overflow: visible;
}

.location-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1.5rem;
}

.location-row .row {
    background: #fff;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
    align-items: flex-start;
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .location-row .row {
        background: transparent;
        box-shadow: none;
        padding-bottom: 0;
        width: calc(100% + 32px);
        margin: 0 -16px;
    }
}

.location-card-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .location-card-col {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.location-card {
    margin: 0 !important;
    border: none;
    background: transparent;
}

@media (min-width: 768px) {
    .location-card {
        background: #fff;
        border: 1px solid rgba(0, 0, 0, 0.125);
    }
}

.location-card h5 {
    color: #474747;
    font-weight: 400;
}

.location-card .alert,
.location-card form label.error,
form .location-card label.error {
    display: block;
}

@media (min-width: 768px) {

    .location-card .alert,
    .location-card form label.error,
    form .location-card label.error {
        display: none;
    }
}

.time-select {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .time-select {
        flex: 60.667% 60.667% auto;
        flex-basis: 60.667%;
        width: 60.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.time-select .row {
    background: transparent !important;
    box-shadow: none !important;
    padding-bottom: 0 !important;
}

.time-select .accordion-header {
    display: flex;
}

@media (min-width: 768px) {
    .time-select .accordion-header {
        display: none;
    }
}

.time-select .button-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.time-select label {
    padding: 0.25em 0.5em;
    margin: 0.75rem 8px;
    border-radius: 16px;
    background: #CCE7E0;
    border: 1px solid #86c6b5;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
    display: flex;
    flex-flow: row nowrap;
    transition: all 0.05s ease;
    cursor: pointer;
}

.time-select label:hover,
.time-select input:focus label {
    background: #339F83;
    color: white;
    transition: all 0.05s ease;
}

.time-select input:focus label {
    outline: 3px solid var(--primary-colour);
}

.time-select input:checked~label {
    background: #097559;
    border: 1px solid #097559;
    color: white;
}

.time-select input:disabled~label {
    background: #D1486F;
    border: 1px solid #D1486F;
    color: white;
    opacity: 0.25;
}

.time-select .time-select-show {
    display: none;
}

.time-select .time-select-show.show {
    display: block;
}

.time-select .time-select-show.show .alert,
.time-select .time-select-show.show form label.error,
form .time-select .time-select-show.show label.error {
    height: 100%;
}

@media (min-width: 768px) {

    .time-select .time-select-show,
    .time-select .time-select-show.show {
        display: block;
        height: 100%;
        margin-bottom: 1.5rem;
    }
}

.time-select .time-select-show.unavailable,
.time-select .time-select .time-select-show.unavailable.show {
    display: none;
}

@media (min-width: 768px) {

    .time-select .time-select-show.unavailable,
    .time-select .time-select .time-select-show.unavailable.show {
        display: block;
    }
}

.time-select-items {
    display: flex;
    flex-direction: row;
    list-style: none;
    flex-wrap: wrap;
}

.time-select-items li.hide {
    display: none;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Portal Booking Section
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
#portalBookingDiv h2,
#portalBookingDiv p,
#portalBookingDiv .site-header .account .account-details label,
.site-header .account .account-details #portalBookingDiv label,
#portalBookingDiv .venue-content {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

#portalBookingDiv .alert p,
#portalBookingDiv .alert .site-header .account .account-details label,
.site-header .account .account-details #portalBookingDiv .alert label,
#portalBookingDiv form label.error p,
#portalBookingDiv form label.error .site-header .account .account-details label,
.site-header .account .account-details #portalBookingDiv form label.error label,
form #portalBookingDiv label.error p,
form #portalBookingDiv label.error .site-header .account .account-details label,
.site-header .account .account-details form #portalBookingDiv label.error label {
    padding-left: 0;
    padding-right: 0;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Date Picker Styling
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.toolbar-body .row .toolbar-half-col #datepicker select {
    width: 45%;
}

.ui-widget.ui-widget-content,
.ui-datepicker .ui-datepicker-header {
    border: 0px solid #fafafa;
}

.ui-datepicker th {
    color: #474747;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
    background-color: var(--datepicker-default-bk);
    color: var(--datepicker-default-text);
}

.ui-state-default:hover,
.ui-widget-content .ui-state-default:hover,
.ui-widget-header .ui-state-default:hover,
.ui-button,
html .ui-button.ui-state-disabled:hover {
    background-color: var(--datepicker-hover-bk);
    color: var(--datepicker-hover-text);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    border: 1px solid var(--primary-colour);
    background: var(--datepicker-hover-bk) !important;
    color: var(--datepicker-hover-text) !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    color: var(--datepicker-active-text);
    background: var(--datepicker-active-bk);
    border: solid 1px var(--datepicker-active-border);
}

.ui-datepicker .ui-datepicker-header {
    background: var(--datepicker-header-bk);
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    background: var(--datepicker-highlight-bk);
    border: var(--datepicker-highlight-border);
    color: var(--datepicker-highlight-text);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Booking Portal Items
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.booking-types-list li {
    cursor: pointer;
    text-decoration: none;
    color: #305566;
}

.booking-types-list li:hover {
    text-decoration: underline;
    cursor: pointer;
}

#facilities .card-list-col {
    flex-basis: 25%;
    width: 25%;
}

.row.facility-amount-row {
    justify-content: flex-end;
}

.facility-amount-row a {
    padding: 1px;
    cursor: default;
    position: absolute;
    bottom: 2rem;
    left: 1.5rem;
}

.selectedFacility .card,
.selectedFacility .modal .modal-card,
.modal .selectedFacility .modal-card,
.selectedFacility section.login .toolbar-body,
section.login .selectedFacility .toolbar-body,
.selectedFacility .location-card,
.selectedFacility .card:hover {
    border: solid 3px #bd1717;
}

#facilityQuantity {
    position: absolute;
    right: 1rem;
    bottom: 0.5rem;
    border: solid 2px rgba(48, 85, 102, 0.5);
}

#facilityQuantity:active,
#facilityQuantity:hover {
    border: solid 2px #305566;
}

.capacity-input {
    margin-top: 1.5rem;
}

.appointment .toolbar .capacity-input input {
    padding: 0px 10px;
    margin-bottom: 1rem;
}

.capacity-danger {
    border: 1px solid #D1486F;
    border-radius: 2px;
    background: #F3D1DB;
    padding: 8px 15px;
}

.facility-unavailable {
    border: 2px solid #c51a4b;
}

.facilities-col,
.facility-button {
    margin-top: 1rem;
}

#roomHireSuccess {
    width: 50%;
    height: 50%;
}

.selectedRoom {
    border: solid 2px #b71644;
}

.room-list-col .card:hover,
.room-list-col .modal .modal-card:hover,
.modal .room-list-col .modal-card:hover,
.room-list-col section.login .toolbar-body:hover,
section.login .room-list-col .toolbar-body:hover,
.room-list-col .location-card:hover {
    border: solid 2px #b71644;
}

.room-list-col {
    list-style: none;
    flex-basis: 50%;
    width: 50%;
    padding-right: 16px;
    padding-left: 16px;
}

#timeSlotStart,
#timeSlotEnd {
    margin-left: 0.5rem;
    padding: 2px;
    cursor: pointer;
}

.portalBookings label {
    margin-top: 0.5rem;
}

.portal-booking-details {
    margin-top: 1.5rem;
    margin-bottom: -1rem;
}

#portalConfirm {
    margin-left: -1.5rem;
}

#changePortalTimeDiv {
    justify-content: space-between;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* BOOTSTRAP GRID SYSTEM
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.zip-widget {
    display: block;
    padding: 2rem;
    border: solid 1px #ccc;
    margin-bottom: 2rem;
    border-radius: 12px;
    background: #fff;
}

main *[class*=xs-col],
main *[class*=sm-col],
main *[class*=md-col],
main *[class*=lg-col] {
    padding: 0 16px;
    transition: 0.2s ease;
    -webkit-overflow-scrolling: touch;
    flex-shrink: 0 !important;
    flex-grow: 1;
}

main *[class*=col-1] {
    width: 8.33333333%;
}

main *[class*=col-2] {
    width: 16.66666667%;
}

main *[class*=col-3] {
    width: 25%;
}

main *[class*=col-4] {
    width: 33.33333333%;
}

main *[class*=col-5] {
    width: 41.66666667%;
}

main *[class*=col-6] {
    width: 50%;
}

main *[class*=col-7] {
    width: 58.33333333%;
}

main *[class*=col-8] {
    width: 66.66666667%;
}

main *[class*=col-9] {
    width: 75%;
}

main *[class*=col-10] {
    width: 83.33333333%;
}

main *[class*=col-11] {
    width: 91.66666667%;
}

main *[class*=col-12] {
    width: 100%;
}

@media (max-width: 650px) {
    main *[class*=sm-col] {
        width: 100%;
        min-width: 100%;
    }
}

@media (max-width: 768px) {
    main *[class*=md-col] {
        width: 100%;
        min-width: 100%;
    }
}

@media (max-width: 1200px) {
    main *[class*=lg-col] {
        width: 100%;
        min-width: 100%;
    }
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    font-size: 1px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Homepage
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#selectChildApplication .appointment-types-list li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    #selectChildApplication .appointment-types-list li {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

#selectChildApplication .appointment-subtype {
    width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Appointment Select Page
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.appointment-types-area h2,
.appointment-types-area .h2 {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.appointment-types-area .back-button-col,
.appointment-types-area .appointment-search-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .appointment-types-area .back-button-col {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 768px) {
    .appointment-types-area .appointment-search-col {
        flex: 75% 75% auto;
        flex-basis: 75%;
        width: 75%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment-types-area .appointment-search-col .row {
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
}

@media (min-width: 768px) {
    .appointment-types-area .appointment-search-col .row {
        flex-wrap: nowrap;
    }
}

.appointment-types-area .appointment-search-col p,
.appointment-types-area .appointment-search-col .site-header .account .account-details label,
.site-header .account .account-details .appointment-types-area .appointment-search-col label {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .appointment-types-area .appointment-search-col p,
    .appointment-types-area .appointment-search-col .site-header .account .account-details label,
    .site-header .account .account-details .appointment-types-area .appointment-search-col label {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment-types-area .appointment-search-col .appointment-search-bar {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.appointment-types-area .appointment-search-col .appointment-search-bar input[type=text] {
    width: 100%;
}

@media (min-width: 768px) {
    .appointment-types-area .appointment-search-col .appointment-search-bar {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment-types-area .appointment-search-col .search-button-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    text-align: left;
}

@media (min-width: 768px) {
    .appointment-types-area .appointment-search-col .search-button-col {
        flex: 16.667% 16.667% auto;
        flex-basis: 16.667%;
        width: 16.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment-types-area .appointment-types-list,
.appointment-types-area .appointment-subtypes-list {
    list-style: none;
    align-items: flex-start;
}

.appointment-types-area .appointment-types-list {
    align-items: stretch;
    padding: 0 16px;
    margin-top: 0;
}

.appointment-types-area .appointment-types-list .card,
.appointment-types-area .appointment-types-list .modal .modal-card,
.modal .appointment-types-area .appointment-types-list .modal-card,
.appointment-types-area .appointment-types-list section.login .toolbar-body,
section.login .appointment-types-area .appointment-types-list .toolbar-body,
.appointment-types-area .appointment-types-list .location-card {
    background-color: #fff !important;
    width: 100%;
}

.appointment-types-area .appointment-types-list .appointment-subtype p,
.appointment-types-area .appointment-types-list .appointment-subtype .site-header .account .account-details label,
.site-header .account .account-details .appointment-types-area .appointment-types-list .appointment-subtype label {
    margin-bottom: 0;
    flex-grow: 1;
    color: var(--primary-colour);
    margin-right: 0.5rem;
}

.appointment-types-area .appointment-types-list .card,
.appointment-types-area .appointment-types-list .modal .modal-card,
.modal .appointment-types-area .appointment-types-list .modal-card,
.appointment-types-area .appointment-types-list section.login .toolbar-body,
section.login .appointment-types-area .appointment-types-list .toolbar-body,
.appointment-types-area .appointment-types-list .location-card {
    position: relative;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
}

.appointment-types-area .appointment-types-list .card-header {
    text-decoration: none;
    margin-top: 0;
}

.appointment-types-area .appointment-types-list .appointment-types-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: stretch;
}

.appointment-types-area .appointment-types-list .appointment-types-col .card,
.appointment-types-area .appointment-types-list .appointment-types-col .modal .modal-card,
.modal .appointment-types-area .appointment-types-list .appointment-types-col .modal-card,
.appointment-types-area .appointment-types-list .appointment-types-col section.login .toolbar-body,
section.login .appointment-types-area .appointment-types-list .appointment-types-col .toolbar-body,
.appointment-types-area .appointment-types-list .appointment-types-col .location-card {
    width: 100%;
}

@media (min-width: 768px) {
    .appointment-types-area .appointment-types-list .appointment-types-col {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 1038px) {
    .appointment-types-area .appointment-types-list .appointment-types-col {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.appointment-types-area .appointment-types-list .appointment-subtype a {
    display: flex;
    align-items: center;
    color: #305566;
    text-decoration: none;
}

.appointment-types-area .appointment-types-list .appointment-subtype a:hover p,
.appointment-types-area .appointment-types-list .appointment-subtype a:hover .site-header .account .account-details label,
.site-header .account .account-details .appointment-types-area .appointment-types-list .appointment-subtype a:hover label,
.appointment-types-area .appointment-types-list .appointment-subtype a:focus p,
.appointment-types-area .appointment-types-list .appointment-subtype a:focus .site-header .account .account-details label,
.site-header .account .account-details .appointment-types-area .appointment-types-list .appointment-subtype a:focus label,
.appointment-types-area .appointment-types-list .appointment-subtype a:active p,
.appointment-types-area .appointment-types-list .appointment-subtype a:active .site-header .account .account-details label,
.site-header .account .account-details .appointment-types-area .appointment-types-list .appointment-subtype a:active label {
    text-decoration: underline;
}

.appointment-types-area .appointment-types-list .appointment-subtype a {
    align-items: flex-start !important;
}

.appointment-types-area .appointment-types-list .appointment-subtype a i {
    margin-top: 0.25em;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Modals
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.modal {
    display: none;
    padding: 0 !important;
}

.modal .modal-body {
    display: flex;
    flex-flow: column wrap;
}

.modal .modal-header {
    border-bottom: 1px solid var(--hero-area-colour);
    margin-bottom: 1rem;
    margin-right: -16px;
    margin-left: -16px;
    width: calc(100% + 32px);
}

.modal .modal-header h3,
.modal .modal-header h4,
.modal .modal-header .h3,
.modal .modal-header .h4 {
    margin-top: 0;
}

.modal .modal-header h3,
.modal .modal-header .h3 {
    margin-bottom: 0.75rem;
}

.modal table th {
    font-weight: bold;
    color: var(--primary-colour);
}

.modal table tr:last-child th,
.modal table tr:last-child td {
    border-bottom: 0px solid #fff;
}

.modal a.close-modal:focus {
    outline: 0px solid #fff;
    border: 0px solid #fff;
}

.modal .modal-description {
    margin: 0.5rem -16px;
    width: calc(100% + 32px);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Modal overlay fix
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.blocker {
    z-index: 10 !important;
    background-color: rgba(0, 0, 0, 0.75);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* User Account and Menu
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media (min-width: 768px) {
    .site-header .account {
        position: relative;
    }
}

.site-header .account .account-details {
    display: flex;
    flex-flow: row wrap;
    margin: 0;
    justify-content: space-between;
    overflow: visible;
}

@media (min-width: 768px) {
    .site-header .account .account-details {
        height: 2rem;
        justify-content: flex-end;
        margin-left: -16px;
        margin-right: -16px;
    }
}

.site-header .account .account-details label {
    color: var(--white);
    margin-bottom: 0;
    position: relative;
    width: 50%;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    margin: 0 16px;
}

.site-header .account .account-details label span {
    flex-grow: 1;
    padding-right: 25px;
}

@media (min-width: 768px) {
    .site-header .account .account-details label span {
        flex-grow: 0;
    }
}

@media (min-width: 768px) {
    .site-header .account .account-details label {
        justify-content: flex-end;
    }
}

.site-header .account .account-details label:after {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    display: block;
    right: 0;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Solid";
    font-weight: 400;
    transition: transform 0.25s ease-in-out;
    transform-origin: center;
    text-align: center;
}

.site-header .account .user-account-menu {
    display: none;
    width: 100%;
    left: 0;
    top: 9rem;
    z-index: 999;
    bottom: 0;
    background: var(--white);
    border: 1px solid var(--hero-area-colour);
}

@media (min-width: 768px) {
    .site-header .account .user-account-menu {
        position: relative;
        max-width: 28rem;
        top: 0.5rem;
        height: auto;
        bottom: auto;
    }
}

.site-header .account .user-account-menu-body {
    position: relative;
    padding: 1.5rem;
}

.site-header .account #accountMenuToggle:checked~label:after {
    transform: rotate(180deg);
}

.site-header .account #accountMenuToggle:checked~.user-account-menu {
    display: block;
}

.site-header .account .user-account-menu .menu-items {
    list-style: none;
    text-align: left;
    margin: 0;
}

.site-header .account .user-account-menu .menu-items li {
    border-bottom: 1px solid var(--hero-area-colour);
}

.site-header .account .user-account-menu .menu-items li a {
    padding: 0.75rem 0;
    display: block;
}

.site-header .account .user-account-menu .menu-items li:last-child {
    border-bottom: 0px solid var(--hero-area-colour);
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Room hire
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.room-hire-search h1,
.room-hire-search h2,
.room-hire-search h3,
.room-hire-search .h1,
.room-hire-search .h2,
.room-hire-search .h3,
.room-hire-search .room-hire-intro,
.available-venues h1,
.available-venues h2,
.available-venues h3,
.available-venues .h1,
.available-venues .h2,
.available-venues .h3,
.available-venues .room-hire-intro,
.about-event h1,
.about-event h2,
.about-event h3,
.about-event .h1,
.about-event .h2,
.about-event .h3,
.about-event .room-hire-intro,
.facilities h1,
.facilities h2,
.facilities h3,
.facilities .h1,
.facilities .h2,
.facilities .h3,
.facilities .room-hire-intro,
.catering h1,
.catering h2,
.catering h3,
.catering .h1,
.catering .h2,
.catering .h3,
.catering .room-hire-intro,
.person-details h1,
.person-details h2,
.person-details h3,
.person-details .h1,
.person-details .h2,
.person-details .h3,
.person-details .room-hire-intro,
.terms-conditions h1,
.terms-conditions h2,
.terms-conditions h3,
.terms-conditions .h1,
.terms-conditions .h2,
.terms-conditions .h3,
.terms-conditions .room-hire-intro,
.custom-questions h1,
.custom-questions h2,
.custom-questions h3,
.custom-questions .h1,
.custom-questions .h2,
.custom-questions .h3,
.custom-questions .room-hire-intro,
.confirm-details h3,
.confirm-details h2,
.confirm-details .confirm-description,
.terms_conditions h1,
.terms_conditions h2,
.terms_conditions h3,
.custom_questions h2,
.custom_questions h3,
.document_upload h2,
.document_upload h3,
.create-new-person h1,
.create-new-person h2,
.create-new-person h3,
.confirmationDetails_title h1,
.confirmationDetails_title h2,
.confirmationDetails_title h3,
.confirmationDetails_title h2,
.confirmationPayment h2 {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.room-hire-search .confirmrow,
.available-venues .confirmrow,
.about-event .confirmrow,
.facilities .confirmrow,
.catering .confirmrow,
.person-details .confirmrow,
.terms-conditions .confirmrow,
.custom-questions .confirmrow,
.confirm-details .confirmrow,
.terms_conditions .confirmrow,
.custom_questions .confirmrow,
.document_upload .confirmrow,
.other_facilities .confirmrow,
.confirmationPayment .confirmrow {
    padding-bottom: 1.5rem;
}

@media (min-width: 768px) {

    .room-hire-search .confirmrow,
    .available-venues .confirmrow,
    .about-event .confirmrow,
    .facilities .confirmrow,
    .catering .confirmrow,
    .person-details .confirmrow,
    .terms-conditions .confirmrow,
    .custom-questions .confirmrow,
    .confirm-details .confirmrow,
    .terms_conditions .confirmrow,
    .custom_questions .confirmrow,
    .document_upload .confirmrow,
    .other_facilities .confirmrow,
    .confirmationPayment .confirmrow {
        justify-content: flex-end;
    }

    .create-new-person .confirmrow {
        justify-content: space-between;
    }
}

.room-hire-search .confirmrow button,
.room-hire-search .confirmrow .button,
.room-hire-search .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .room-hire-search .confirmrow input[type=radio]:checked~label,
.room-hire-search .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .room-hire-search .confirmrow label,
.room-hire-search .confirmrow .day-list input:checked+label,
.day-list .room-hire-search .confirmrow input:checked+label,
.room-hire-search .confirmrow .day-list label,
.day-list .room-hire-search .confirmrow label,
.room-hire-search .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .room-hire-search .confirmrow label,
.available-venues .confirmrow button,
.available-venues .confirmrow .button,
.available-venues .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .available-venues .confirmrow input[type=radio]:checked~label,
.available-venues .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .available-venues .confirmrow label,
.available-venues .confirmrow .day-list input:checked+label,
.day-list .available-venues .confirmrow input:checked+label,
.available-venues .confirmrow .day-list label,
.day-list .available-venues .confirmrow label,
.available-venues .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .available-venues .confirmrow label,
.about-event .confirmrow button,
.about-event .confirmrow .button,
.about-event .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .about-event .confirmrow input[type=radio]:checked~label,
.about-event .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .about-event .confirmrow label,
.about-event .confirmrow .day-list input:checked+label,
.day-list .about-event .confirmrow input:checked+label,
.about-event .confirmrow .day-list label,
.day-list .about-event .confirmrow label,
.about-event .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .about-event .confirmrow label,
.facilities .confirmrow button,
.facilities .confirmrow .button,
.facilities .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .facilities .confirmrow input[type=radio]:checked~label,
.facilities .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .facilities .confirmrow label,
.facilities .confirmrow .day-list input:checked+label,
.day-list .facilities .confirmrow input:checked+label,
.facilities .confirmrow .day-list label,
.day-list .facilities .confirmrow label,
.facilities .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .facilities .confirmrow label,
.catering .confirmrow button,
.catering .confirmrow .button,
.catering .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .catering .confirmrow input[type=radio]:checked~label,
.catering .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .catering .confirmrow label,
.catering .confirmrow .day-list input:checked+label,
.day-list .catering .confirmrow input:checked+label,
.catering .confirmrow .day-list label,
.day-list .catering .confirmrow label,
.catering .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .catering .confirmrow label,
.person-details .confirmrow button,
.person-details .confirmrow .button,
.person-details .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .person-details .confirmrow input[type=radio]:checked~label,
.person-details .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .person-details .confirmrow label,
.person-details .confirmrow .day-list input:checked+label,
.day-list .person-details .confirmrow input:checked+label,
.person-details .confirmrow .day-list label,
.day-list .person-details .confirmrow label,
.person-details .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .person-details .confirmrow label,
.terms-conditions .confirmrow button,
.terms-conditions .confirmrow .button,
.terms-conditions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .terms-conditions .confirmrow input[type=radio]:checked~label,
.terms-conditions .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .terms-conditions .confirmrow label,
.terms-conditions .confirmrow .day-list input:checked+label,
.day-list .terms-conditions .confirmrow input:checked+label,
.terms-conditions .confirmrow .day-list label,
.day-list .terms-conditions .confirmrow label,
.terms-conditions .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .terms-conditions .confirmrow label,
.custom-questions .confirmrow button,
.custom-questions .confirmrow .button,
.custom-questions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .custom-questions .confirmrow input[type=radio]:checked~label,
.custom-questions .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .custom-questions .confirmrow label,
.custom-questions .confirmrow .day-list input:checked+label,
.day-list .custom-questions .confirmrow input:checked+label,
.custom-questions .confirmrow .day-list label,
.day-list .custom-questions .confirmrow label,
.custom-questions .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .custom-questions .confirmrow label,
.confirm_details .confirmrow .button,
.confirm_details .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .confirm_details .confirmrow input[type=radio]:checked~label,
.confirm_details .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .confirm_details .confirmrow label,
.confirm_details .confirmrow .day-list input:checked+label,
.day-list .confirm_details .confirmrow input:checked+label,
.confirm_details .confirmrow .day-list label,
.day-list .confirm_details .confirmrow label,
.confirm_details .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .confirm_details .confirmrow label,
.terms_conditions .confirmrow .button,
.terms_conditions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .terms_conditions .confirmrow input[type=radio]:checked~label,
.terms_conditions .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .terms_conditions .confirmrow label,
.terms_conditions .confirmrow .day-list input:checked+label,
.day-list .terms_conditions .confirmrow input:checked+label,
.terms_conditions .confirmrow .day-list label,
.day-list .terms_conditions .confirmrow label,
.terms_conditions .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .terms_conditions .confirmrow label,
.custom_questions .confirmrow .button,
.custom_questions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .custom_questions .confirmrow input[type=radio]:checked~label,
.custom_questions .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .custom_questions .confirmrow label,
.custom_questions .confirmrow .day-list input:checked+label,
.day-list .custom_questions .confirmrow input:checked+label,
.custom_questions .confirmrow .day-list label,
.day-list .custom_questions .confirmrow label,
.custom_questions .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .custom_questions .confirmrow label,
.document_upload .confirmrow .button,
.document_upload .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .document_upload .confirmrow input[type=radio]:checked~label,
.document_upload .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .document_upload .confirmrow label,
.document_upload .confirmrow .day-list input:checked+label,
.day-list .document_upload .confirmrow input:checked+label,
.document_upload .confirmrow .day-list label,
.day-list .document_upload .confirmrow label,
.document_upload .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .document_upload .confirmrow label,
.other_facilities .confirmrow .button,
.other_facilities .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .other_facilities .confirmrow input[type=radio]:checked~label,
.other_facilities .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .other_facilities .confirmrow label,
.other_facilities .confirmrow .day-list input:checked+label,
.day-list .other_facilities .confirmrow input:checked+label,
.other_facilities .confirmrow .day-list label,
.day-list .other_facilities .confirmrow label,
.other_facilities .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .other_facilities .confirmrow label,
.create-new-person .confirmrow .button,
.create-new-person .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .create-new-person .confirmrow input[type=radio]:checked~label,
.create-new-person .confirmrow section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .create-new-person .confirmrow label,
.create-new-person .confirmrow .day-list input:checked+label,
.day-list .create-new-person .confirmrow input:checked+label,
.create-new-person .confirmrow .day-list label,
.day-list .create-new-person .confirmrow label,
.create-new-person .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .create-new-person .confirmrow label,
.confirmationPayment .confirmrow .button,
section.confirmationPayment .confirmrow .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .confirmrow input[type=radio]:checked~label,
section.confirmationPayment .confirmrow .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .confirmrow label,
.confirmationPayment .confirmrow .day-list input:checked+label,
.day-list .confirmationPayment .confirmrow input:checked+label,
.confirmationPayment .confirmrow .day-list label,
.day-list .confirmationPayment .confirmrow label,
.confirmationPayment .confirmrow .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .confirmationPayment .confirmrow label {
    margin: 0;
    width: 100%;
}

@media (min-width: 768px) {

    .room-hire-search .confirmrow button,
    .room-hire-search .confirmrow .button,
    .room-hire-search .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .room-hire-search .confirmrow input[type=radio]:checked~label,
    .room-hire-search .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .room-hire-search .confirmrow label,
    .room-hire-search .confirmrow .day-list input:checked+label,
    .day-list .room-hire-search .confirmrow input:checked+label,
    .room-hire-search .confirmrow .day-list label,
    .day-list .room-hire-search .confirmrow label,
    .room-hire-search .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .room-hire-search .confirmrow label,
    .available-venues .confirmrow button,
    .available-venues .confirmrow .button,
    .available-venues .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .available-venues .confirmrow input[type=radio]:checked~label,
    .available-venues .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .available-venues .confirmrow label,
    .available-venues .confirmrow .day-list input:checked+label,
    .day-list .available-venues .confirmrow input:checked+label,
    .available-venues .confirmrow .day-list label,
    .day-list .available-venues .confirmrow label,
    .available-venues .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .available-venues .confirmrow label,
    .about-event .confirmrow button,
    .about-event .confirmrow .button,
    .about-event .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .about-event .confirmrow input[type=radio]:checked~label,
    .about-event .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .about-event .confirmrow label,
    .about-event .confirmrow .day-list input:checked+label,
    .day-list .about-event .confirmrow input:checked+label,
    .about-event .confirmrow .day-list label,
    .day-list .about-event .confirmrow label,
    .about-event .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .about-event .confirmrow label,
    .facilities .confirmrow button,
    .facilities .confirmrow .button,
    .facilities .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .facilities .confirmrow input[type=radio]:checked~label,
    .facilities .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .facilities .confirmrow label,
    .facilities .confirmrow .day-list input:checked+label,
    .day-list .facilities .confirmrow input:checked+label,
    .facilities .confirmrow .day-list label,
    .day-list .facilities .confirmrow label,
    .facilities .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .facilities .confirmrow label,
    .catering .confirmrow button,
    .catering .confirmrow .button,
    .catering .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .catering .confirmrow input[type=radio]:checked~label,
    .catering .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .catering .confirmrow label,
    .catering .confirmrow .day-list input:checked+label,
    .day-list .catering .confirmrow input:checked+label,
    .catering .confirmrow .day-list label,
    .day-list .catering .confirmrow label,
    .catering .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .catering .confirmrow label,
    .person-details .confirmrow button,
    .person-details .confirmrow .button,
    .person-details .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .person-details .confirmrow input[type=radio]:checked~label,
    .person-details .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .person-details .confirmrow label,
    .person-details .confirmrow .day-list input:checked+label,
    .day-list .person-details .confirmrow input:checked+label,
    .person-details .confirmrow .day-list label,
    .day-list .person-details .confirmrow label,
    .person-details .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .person-details .confirmrow label,
    .terms-conditions .confirmrow button,
    .terms-conditions .confirmrow .button,
    .terms-conditions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .terms-conditions .confirmrow input[type=radio]:checked~label,
    .terms-conditions .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .terms-conditions .confirmrow label,
    .terms-conditions .confirmrow .day-list input:checked+label,
    .day-list .terms-conditions .confirmrow input:checked+label,
    .terms-conditions .confirmrow .day-list label,
    .day-list .terms-conditions .confirmrow label,
    .terms-conditions .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .terms-conditions .confirmrow label,
    .custom-questions .confirmrow button,
    .custom-questions .confirmrow .button,
    .custom-questions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .custom-questions .confirmrow input[type=radio]:checked~label,
    .custom-questions .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .custom-questions .confirmrow label,
    .custom-questions .confirmrow .day-list input:checked+label,
    .day-list .custom-questions .confirmrow input:checked+label,
    .custom-questions .confirmrow .day-list label,
    .day-list .custom-questions .confirmrow label,
    .custom-questions .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .custom-questions .confirmrow label,
    .confirm_details .confirmrow .button,
    .confirm_details .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .confirm_details .confirmrow input[type=radio]:checked~label,
    .confirm_details .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .confirm_details .confirmrow label,
    .confirm_details .confirmrow .day-list input:checked+label,
    .day-list .confirm_details .confirmrow input:checked+label,
    .confirm_details .confirmrow .day-list label,
    .day-list .confirm_details .confirmrow label,
    .confirm_details .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .confirm_details .confirmrow label,
    .terms_conditions .confirmrow .button,
    .terms_conditions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .terms_conditions .confirmrow input[type=radio]:checked~label,
    .terms_conditions .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .terms_conditions .confirmrow label,
    .terms_conditions .confirmrow .day-list input:checked+label,
    .day-list .terms_conditions .confirmrow input:checked+label,
    .terms_conditions .confirmrow .day-list label,
    .day-list .terms_conditions .confirmrow label,
    .terms_conditions .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .terms_conditions .confirmrow label,
    .custom_questions .confirmrow .button,
    .custom_questions .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .custom_questions .confirmrow input[type=radio]:checked~label,
    .custom_questions .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .custom_questions .confirmrow label,
    .custom_questions .confirmrow .day-list input:checked+label,
    .day-list .custom_questions .confirmrow input:checked+label,
    .custom_questions .confirmrow .day-list label,
    .day-list .custom_questions .confirmrow label,
    .custom_questions .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .custom_questions .confirmrow label,
    .document_upload .confirmrow .button,
    .document_upload .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .document_upload .confirmrow input[type=radio]:checked~label,
    .document_upload .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .document_upload .confirmrow label,
    .document_upload .confirmrow .day-list input:checked+label,
    .day-list .document_upload .confirmrow input:checked+label,
    .document_upload .confirmrow .day-list label,
    .day-list .document_upload .confirmrow label,
    .document_upload .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .document_upload .confirmrow label,
    .other_facilities .confirmrow .button,
    .other_facilities .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .other_facilities .confirmrow input[type=radio]:checked~label,
    .other_facilities .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .other_facilities .confirmrow label,
    .other_facilities .confirmrow .day-list input:checked+label,
    .day-list .other_facilities .confirmrow input:checked+label,
    .other_facilities .confirmrow .day-list label,
    .day-list .other_facilities .confirmrow label,
    .other_facilities .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .other_facilities .confirmrow label,
    .create-new-person .confirmrow .button,
    .create-new-person .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .create-new-person .confirmrow input[type=radio]:checked~label,
    .create-new-person .confirmrow section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .create-new-person .confirmrow label,
    .create-new-person .confirmrow .day-list input:checked+label,
    .day-list .create-new-person .confirmrow input:checked+label,
    .create-new-person .confirmrow .day-list label,
    .day-list .create-new-person .confirmrow label,
    .create-new-person .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .create-new-person .confirmrow label,
    .confirmationPayment .confirmrow .button,
    section.confirmationPayment .confirmrow .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .confirmrow input[type=radio]:checked~label,
    section.confirmationPayment .confirmrow .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .confirmrow label,
    .confirmationPayment .confirmrow .day-list input:checked+label,
    .day-list .confirmationPayment .confirmrow input:checked+label,
    .confirmationPayment .confirmrow .day-list label,
    .day-list .confirmationPayment .confirmrow label,
    .confirmationPayment .confirmrow .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .confirmationPayment .confirmrow label {
        width: auto;
    }
}

.room-hire-search .confirmrow .confirmButton,
.available-venues .confirmrow .confirmButton,
.about-event .confirmrow .confirmButton,
.facilities .confirmrow .confirmButton,
.catering .confirmrow .confirmButton,
.person-details .confirmrow .confirmButton,
.terms-conditions .confirmrow .confirmButton,
.custom-questions .confirmrow .confirmButton,
.confirm-details .confirmButton,
.terms_conditions .confirmButton,
.custom_questions .confirmButton,
.document_upload .confirmButton,
.other_facilities .confirmButton,
.create-new-person .backButton,
.create-new-person .confirmButton,
.confirmationPayment .confirmButton {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .room-hire-search .confirmrow .confirmButton,
    .available-venues .confirmrow .confirmButton,
    .about-event .confirmrow .confirmButton,
    .facilities .confirmrow .confirmButton,
    .catering .confirmrow .confirmButton,
    .person-details .confirmrow .confirmButton,
    .terms-conditions .confirmrow .confirmButton,
    .custom-questions .confirmrow .confirmButton,
    .confirm-details .confirmButton,
    .terms_conditions .confirmButton,
    .custom_questions .confirmButton,
    .document_upload .confirmButton,
    .other_facilities .confirmButton,
    .create-new-person .confirmButton,
    .confirmationPayment .confirmButton {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
        text-align: right;
    }

    .create-new-person .backButton {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
        text-align: left;
    }
}

.confirmationDetails_title .applyButton {
    text-align: left;
    width: 100%;
}

.confirmationDetails_title .applyButton .button,
.confirmationDetails_title .applyButton section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .confirmationDetails_title .applyButton input[type=radio]:checked~label,
.confirmationDetails_title .applyButton section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .confirmationDetails_title .applyButton label,
.confirmationDetails_title .applyButton .day-list label,
.day-list .confirmationDetails_title .applyButton label,
.confirmationDetails_title .applyButton .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .confirmationDetails_title .applyButton label {
    width: 100%;
}

@media (min-width: 768px) {
    .confirmationDetails_title .applyButton {
        text-align: right;
    }
}

.confirmrow .button:last-child,
.confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:last-child,
section.confirmationPayment .payment-method-select-items .confirmrow input[type=radio]:checked~label:last-child,
.confirmrow section.confirmationPayment .payment-method-select-items label:last-child,
section.confirmationPayment .payment-method-select-items .confirmrow label:last-child,
.confirmrow .day-list label:last-child,
.day-list .confirmrow label:last-child,
.confirmrow .rooms-card-list .card-footer label:last-child,
.rooms-card-list .card-footer .confirmrow label:last-child {
    margin-top: 0.75rem;
}

@media (min-width: 768px) {

    .confirmrow .button:last-child,
    .confirmrow section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label:last-child,
    section.confirmationPayment .payment-method-select-items .confirmrow input[type=radio]:checked~label:last-child,
    .confirmrow section.confirmationPayment .payment-method-select-items label:last-child,
    section.confirmationPayment .payment-method-select-items .confirmrow label:last-child,
    .confirmrow .day-list label:last-child,
    .day-list .confirmrow label:last-child,
    .confirmrow .rooms-card-list .card-footer label:last-child,
    .rooms-card-list .card-footer .confirmrow label:last-child {
        margin: 0;
    }
}

.room-hire-search form {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
}

.room-hire-search .resource-category,
.room-hire-search .resource-category-subtype,
.room-hire-search .search-range-start,
.room-hire-search .search-range-end,
.room-hire-search .capacity {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .room-hire-search .resource-category,
    .room-hire-search .resource-category-subtype,
    .room-hire-search .search-range-start,
    .room-hire-search .search-range-end,
    .room-hire-search .capacity {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.room-hire-search .row {
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .room-hire-search .row {
        margin-bottom: 0.75rem;
    }
}

.room-hire-search .toolbar-body {
    margin-bottom: 0;
}

.available-venues .venue-list,
.about-event .rooms-card-list {
    list-style: none;
    flex: 100% 100% auto;
    flex-basis: 96%;
    width: 96%;
    padding: 0;
    margin: 20px auto;
}

.available-venues .venue-list:first-child,
.about-event .rooms-card-list:first-child {
    margin-top: 0;
}

.available-venues .venue-list li {
    display: flex;
    flex-flow: column wrap;
}

@media (min-width: 768px) {
    .available-venues .venue-list li {
        flex-flow: row wrap;
    }
}

.available-venues .venue-list li:last-child hr {
    display: none;
}

.available-venues .venue-header {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    margin: 0.75rem 0;
}

@media (min-width: 768px) {
    .available-venues .venue-header {
        flex-flow: row nowrap;
    }
}

.available-venues .venue-header .venue-name {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .available-venues .venue-header .venue-name {
        flex-grow: 1;
        flex-basis: 0;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.venue-header .venue-description {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {
    .venue-header .venue-description {
        flex-grow: 1;
        padding: 0 16px;
    }
}

.available-venues .venue-header h3,
.available-venues .venue-header .h3 {
    margin: 0;
}

.available-venues .venue-map {
    display: inline-block;
    position: relative;
    overflow: hidden;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    padding: 0.5rem 0px 0.5rem 20px;
    margin: 0px 16px;
}

@media (min-width: 768px) {
    .available-venues .venue-map {
        flex: 16.667% 16.667% auto;
        flex-basis: 16.667%;
        width: 16.667%;
        padding: 0;
        padding: 0.5rem 0px 0.5rem 20px;
        margin: 0px 16px;
    }
}

.available-venues .venue-map:before {
    content: "";
    width: 25px;
    height: 25px;
    position: absolute;
    top: 50%;
    transform: translatey(-50%);
    line-height: 25px;
    left: 0px;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "";
}

.rooms-card-list {
    display: flex;
    flex-flow: row wrap;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    list-style: none;
}

.rooms-card-list li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1rem;
}

@media (min-width: 624px) {
    .rooms-card-list li {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 1120px) {
    .rooms-card-list li {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.rooms-card-list .card,
.rooms-card-list .modal .modal-card,
.modal .rooms-card-list .modal-card,
.available-venues .rooms-card-list section.login .toolbar-body,
section.login .available-venues .rooms-card-list .toolbar-body,
.available-venues .rooms-card-list .location-card {
    background: white;
    display: flex;
    flex-direction: column;
    margin-bottom: 0.75rem;
    width: 100%;
}

.rooms-card-list .card-body,
.rooms-card-list .modal .modal-body,
.modal .rooms-card-list .modal-body {
    padding: 1.25rem;
    display: flex;
    flex-flow: column wrap;
}

.rooms-card-list .card-image {
    position: relative;
    overflow: hidden;
}

.rooms-card-list .card-image figure {
    margin: 0;
    width: 100%;
    position: relative;
    display: block;
    padding-bottom: 56.25%;
    background: var(--hero-area-colour);
}

.rooms-card-list .card-image figure img {
    overflow: hidden;
    position: absolute;
    inset: 0px;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.rooms-card-list .card-image figure:after {
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    color: var(--hero-area-border-colour);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f03e";
    z-index: 0;
    font-size: 2rem;
}

.rooms-card-list .card-info {
    margin-bottom: 1rem;
    flex-grow: 1;
}

.rooms-card-list .card-footer {
    text-align: center;
}

.rooms-card-list .card-footer .button,
.rooms-card-list .card-footer section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer input[type=radio]:checked~label,
.rooms-card-list .card-footer section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .day-list input:checked+label,
.day-list .rooms-card-list .card-footer input:checked+label,
.rooms-card-list .card-footer label,
.rooms-card-list .card-footer button {
    margin: 0 auto;
}

.rooms-card-list .card-footer label {
    margin: 0 auto !important;
    padding-left: 50px;
    padding-right: 15px;
    position: relative;
}

.rooms-card-list .card-footer label:before,
.card-footer label:before {
    width: 30px;
    height: 30px;
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 30px;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
}

.rooms-card-list .card-footer input:checked~label:before,
.card-footer input:checked~label:before {
    content: "";
    font-weight: 900;
}

.rooms-card-list .card-info h4,
.rooms-card-list .card-info .h4 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.rooms-card-list .card-info .card-links {
    display: flex;
    flex-flow: column nowrap;
    list-style: none;
}

.rooms-card-list .card-info .card-links li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    font-size: 14px;
    font-size: 0.875rem;
    line-height: 16px;
    line-height: 1rem;
    margin-bottom: 0.5rem;
}

.rooms-card-list .card-info .card-links li a,
.rooms-card-list .card-info .card-links li p,
.rooms-card-list .card-info .card-links li .site-header .account .account-details label,
.site-header .account .account-details .rooms-card-list .card-info .card-links li label {
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding-left: 25px;
}

.rooms-card-list .card-info .card-links li p,
.rooms-card-list .card-info .card-links li .site-header .account .account-details label,
.site-header .account .account-details .rooms-card-list .card-info .card-links li label {
    margin-bottom: 0;
}

.rooms-card-list .card-info .card-links li a:before,
.rooms-card-list .card-info .card-links li p:before,
.rooms-card-list .card-info .card-links li .site-header .account .account-details label:before,
.site-header .account .account-details .rooms-card-list .card-info .card-links li label:before {
    width: 20px;
    height: 20px;
    line-height: 20px;
    top: 0;
    left: 0;
    display: block;
    content: "";
    position: absolute;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    text-align: center;
}

.rooms-card-list .card-info .card-links li a.room-openingtimes:before {
    content: "";
}

.rooms-card-list .card-info .card-links li a.room-charges.gbp:before {
    content: "";
}

.rooms-card-list .card-info .card-links li a.room-charges.euro:before {
    content: "";
}

.rooms-card-list .card-info .card-links li a.room-charges.aus:before {
    content: "";
}

.rooms-card-list .card-info .card-links li a.room-moreinfo:before {
    content: "";
}

.rooms-card-list .card-info .card-links li a.room-showavailability:before {
    content: "";
}

.rooms-card-list .card-info .card-links li p.room-capacity,
.rooms-card-list .card-info .card-links li .site-header .account .account-details label.room-capacity,
.site-header .account .account-details .rooms-card-list .card-info .card-links li label.room-capacity {
    color: var(--black);
    opacity: 0.75;
}

.rooms-card-list .card-info .card-links li p.room-capacity:before,
.rooms-card-list .card-info .card-links li .site-header .account .account-details label.room-capacity:before,
.site-header .account .account-details .rooms-card-list .card-info .card-links li label.room-capacity:before {
    content: "";
}

.about-event form .row {
    align-items: flex-start;
}

@media (min-width: 768px) {
    .about-event form .row {
        align-items: stretch;
    }
}

.about-event .event-details,
.about-event .event-notes {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.about-event .event-details input[type=text],
.about-event .event-details textarea,
.about-event .event-notes input[type=text],
.about-event .event-notes textarea {
    width: 100%;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* About Your Event - date availability selector
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.about-event .resource-selector li .row {
    align-items: center;
}

.dateselect-date,
.dateselect-bookbutton {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.dateselect-availability {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-end;
    position: relative;
}

@media (min-width: 768px) {
    .dateselect-availability {
        flex: 66.667% 66.667% auto;
        flex-basis: 66.667%;
        width: 66.667%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.dateselect-availability .alert {
    margin: 0 16px;
}

.dateselect-availability .row {
    align-items: flex-end !important;
}

@media (min-width: 768px) {
    .dateselect-date {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 768px) {

    .dateselect-date h5,
    .dateselect-date .h5 {
        margin: 0;
    }
}

.dateselect-bookbutton .button,
.dateselect-bookbutton section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
section.confirmationPayment .payment-method-select-items .dateselect-bookbutton input[type=radio]:checked~label,
.dateselect-bookbutton section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items .dateselect-bookbutton label,
.dateselect-bookbutton .day-list input:checked+label,
.day-list .dateselect-bookbutton input:checked+label,
.dateselect-bookbutton .day-list label,
.day-list .dateselect-bookbutton label,
.dateselect-bookbutton .rooms-card-list .card-footer label,
.rooms-card-list .card-footer .dateselect-bookbutton label,
.dateselect-bookbutton button {
    margin: 0;
}

@media (min-width: 768px) {
    .dateselect-bookbutton {
        flex: 25% 25% auto;
        flex-basis: 25%;
        width: 25%;
        padding-right: 16px;
        padding-left: 16px;
        text-align: center;
    }

    .dateselect-bookbutton .button,
    .dateselect-bookbutton section.confirmationPayment .payment-method-select-items input[type=radio]:checked~label,
    section.confirmationPayment .payment-method-select-items .dateselect-bookbutton input[type=radio]:checked~label,
    .dateselect-bookbutton section.confirmationPayment .payment-method-select-items label,
    section.confirmationPayment .payment-method-select-items .dateselect-bookbutton label,
    .dateselect-bookbutton .day-list input:checked+label,
    .day-list .dateselect-bookbutton input:checked+label,
    .dateselect-bookbutton .day-list label,
    .day-list .dateselect-bookbutton label,
    .dateselect-bookbutton .rooms-card-list .card-footer label,
    .rooms-card-list .card-footer .dateselect-bookbutton label,
    .dateselect-bookbutton button {
        margin: 0 auto;
    }
}

.dateselect-timeslots {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    display: flex;
    flex-flow: row nowrap;
}

@media (min-width: 768px) {
    .dateselect-timeslots {
        flex: 75% 75% auto;
        flex-basis: 75%;
        width: 75%;
        padding: 0;
    }
}

@media (min-width: 768px) {
    .dateselect-timeslots .form-select-wrap {
        margin-bottom: 0;
    }
}

.dateselect-starttime,
.dateselect-endtime {
    flex: 50% 50% auto;
    flex-basis: 50%;
    width: 50%;
    padding-right: 16px;
    padding-left: 16px;
}

.user-first-name,
.user-last-name {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .user-first-name,
    .user-last-name {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.user-first-name input[type=text],
.user-last-name input[type=text] {
    width: 100%;
}

.organisationName {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.organisationName input[type=text] {
    width: 100%;
}

.searchUser,
.searchOrganisation {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    text-align: right;
}

.createNewPerson {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    text-align: right;
    margin-bottom: 0.75rem;
}

@media (min-width: 768px) {
    .createNewPerson {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
        margin-bottom: 0;
    }
}

.search-result-header {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    margin-top: 1.5rem;
}

.search-result-header .search-result-number,
.search-result-header h3,
.search-result-header .h3 {
    flex: 50% 50% auto;
    flex-basis: 50%;
    width: 50%;
    padding-right: 16px;
    padding-left: 16px;
}

.search-result-header h3,
.search-result-header .h3 {
    margin: 0;
    padding: 0;
}

.search-result-number {
    text-align: right;
    margin: 0;
    font-weight: 600;
}

.search-results-row {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.confirm-details .confirm-row {
    text-align: right;
}

.terms_conditions .condition_description {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.document_upload .document_upload_description {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Tabbed container
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.tabbed-filters,
.booking-tabs {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.tabbed-filters ul.tabs,
.booking-tabs ul.tabs {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    list-style: none;
    display: flex;
    flex-flow: column;
    padding: 0;
    width: calc(100% + 32px);
    margin: 0 -16px;
}

@media (min-width: 768px) {

    .tabbed-filters ul.tabs,
    .booking-tabs ul.tabs {
        flex-flow: row nowrap;
    }
}

.booking-tabs ul.tabs {
    margin-top: 0.5rem !important;
}

.tabbed-filters ul.tabs li,
.booking-tabs ul.tabs li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
    text-align: center;
}

.tabbed-filters ul.tabs a,
.booking-tabs ul.tabs a {
    /*! color: var(--black); */
    background-color: white;
    justify-content: space-between;
    padding: 16px 16px;
    font-weight: 600;
    margin-bottom: 0.75rem;
    display: flex;
    position: relative;
    text-align: center;
}

.booking-tabs ul.tabs a {
    border: 1px solid var(--primary-colour);
    border-radius: 5px;
}


.tabbed-filters ul.tabs a:after {
    width: 20px;
    height: 20px;
    content: "";
    text-align: center;
    display: block;
    position: absolute;
    right: 16px;
    transform-origin: center;
    transition: transform 0.2s ease-in-out;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

.tabbed-filters ul.tabs a:hover,
.booking-tabs ul.tabs a:hover {
    background: #ccc;
    color: var(--black);
}

.tabbed-filters ul.tabs a.active,
.booking-tabs ul.tabs a.active,
.tabbed-filters ul.tabs a.active,
.booking-tabs ul.tabs a.active {
    background: var(--primary-colour);
    color: var(--white);
    border: 1px solid var(--primary-colour);
    font-weight: 600;
}

@media (min-width: 768px) {

    .tabbed-filters ul.tabs a.active,
    .booking-tabs ul.tabs a.active {
        flex-grow: 1;
    }
}

.tabbed-filters ul.tabs a.active:after {
    transform: rotate(180deg);
}

.tabbed-filters .tabContent,
.booking-tabs .tabContent {
    background: var(--hero-area-border-colour);
    padding: 1rem;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.tabbed-filters .tabContent>div:not(:first-child),
.booking-tabs .tabContent>div:not(:first-child) {
    display: none;
}

.tabbed-filters .location-select,
.tabbed-filters .facility-select,
.tabbed-filters .day-select {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.tabbed-filters table {
    width: calc(100% - 32px);
    margin: 0 16px;
    border-collapse: collapse;
    table-layout: fixed;
}

.tabbed-filters table thead,
.tabbed-filters table tbody,
.tabbed-filters table tr {
    width: 100%;
}

@media screen and (max-width: 723px) {
    .tabbed-filters table table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .tabbed-filters table table tr {
        border-bottom: 3px solid var(--hero-area-colour);
        display: block;
    }

    .tabbed-filters table table td {
        border-bottom: 1px solid var(--hero-area-colour);
        display: block;
        text-align: right;
    }

    .tabbed-filters table table td::before {
        content: attr(data-label);
        float: left;
    }
}

@media (min-width: 768px) {
    .tabbed-filters #userOrganisationSearch .tabbed-container li {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 768px) {
    .tabbed-filters #roomHireSearch .tabbed-container li {
        flex: 33.333% 33.333% auto;
        flex-basis: 33.333%;
        width: 33.333%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.tabbed-filters .row.filters .filter-search,
.tabbed-filters .row.filters .filter-sort {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .tabbed-filters .row.filters .filter-search,
    .tabbed-filters .row.filters .filter-sort {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Custom Checkbox Items
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.search-results-wrap {
    background: white;
    height: 15rem;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    overflow-y: scroll;
    margin-top: 1.5rem;
    border-radius: 8px;
    position: relative;
    margin-bottom: 1.5rem;
}

.location-list,
.facility-list,
.day-list,
.other-facility-list {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    padding: 16px 0;
    display: flex;
    flex-flow: row wrap;
    list-style: none;
}

.location-list,
.facility-list,
.other-facility-list {
    margin-top: 0;
    margin-bottom: 0;
}

.location-list li,
.facility-list li,
.other-facility-list li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    .location-list li,
    .facility-list li,
    .other-facility-list li {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.location-list .input-group,
.facility-list .input-group,
.other-facility-list .input-group {
    flex-direction: row !important;
    align-items: center;
}

.day-list {
    margin: 0;
}

/* .day-list li {
        padding: 0.5rem;
        min-width: 10rem;
    } */

/* .day-list li:first-child {
            padding-left: 0;
        }

        .day-list li:last-child {
            padding-right: 0;
        }*/

.day-list label {
    font-weight: 600 !important;
    margin-left: 0 !important;
}


.location-list label,
.facility-list label,
.other-facility-list label {
    position: relative;
    font-weight: 400;
    padding-left: 35px;
}

.location-list label:before,
.facility-list label:before,
.other-facility-list label:before {
    height: 20px;
    width: 20px;
    display: block;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    border: 1px solid var(--primary-colour);
    content: "";
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    text-align: center;
    color: white;
    line-height: 1.5;
    font-size: 0.85rem;
    border-radius: 4px;
}

.location-list input[type=checkbox]:checked~label:before,
.facility-list input[type=checkbox]:checked~label:before,
.other-facility-list input[type=checkbox]:checked~label:before {
    content: "";
    border: 1px solid var(--primary-colour);
    background: var(--primary-colour);
}

.location-list input[type=radio]:checked~label:before,
.facility-list input[type=radio]:checked~label:before,
.other-facility-list input[type=radio]:checked~label:before {
    content: "";
    border: 1px solid var(--primary-colour);
    background: var(--primary-colour);
}

.confirmationDetails_breakdown {
    margin-top: 15px;
}

section.confirmationDetails_breakdown .row {
    align-items: stretch;
    flex-flow: row wrap;
}

section.confirmationDetails_breakdown .breakdown-card {
    background: white;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    margin-bottom: 1.5rem;
    overflow: hidden;
    position: relative;
}

section.confirmationDetails_breakdown .breakdown-card table {
    width: 100%;
    margin: 0;
}

/* section.confirmationDetails_breakdown .breakdown-card table tr {
    display: flex;
    flex-flow: row nowrap;
}

section.confirmationDetails_breakdown .breakdown-card table th {
    flex-grow: 1;
    min-width: 50%;
} */

section.confirmationDetails_breakdown .breakdown-card table td {
    text-align: left;
    line-height: 1.5;
}

section.confirmationDetails_breakdown .breakdown-card table td,
section.confirmationDetails_breakdown .breakdown-card table th {
    font-size: 16px;
    border-bottom: 0px solid #fff !important;
    line-height: 1.5;
}

section.confirmationDetails_breakdown .breakdown-card table td {
    word-wrap: break-word;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-body {
    padding: 1.5rem;
    display: flex;
    flex-flow: column;
    height: 100%;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header {
    margin-bottom: 1.5rem;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .row {
    flex-flow: row nowrap;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header h2,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .h2 {
    margin-bottom: 1.5rem;
    margin-top: 0;
    flex-grow: 1;
    padding: 0 16px;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header button,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .button,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header section.confirmationPayment .payment-method-select-items label,
section.confirmationPayment .payment-method-select-items section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header label,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .rooms-card-list .card-footer label,
.rooms-card-list .card-footer section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header label,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .day-list label,
.day-list section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header label,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header input[type=submit] {
    margin-bottom: 0;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .button-col {
    padding: 0 16px;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-details {
    flex: 1;
}

section.confirmationDetails_breakdown .breakdown-card .breakdown-receipt-footer {
    border-top: 1px solid var(--hero-area-colour);
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

section.confirmationDetails_breakdown .receipt {
    display: flex;
    flex-flow: column;
}

section.confirmationDetails_breakdown .receipt .breakdown-card {
    flex-grow: 1;
}

section.confirmationDetails_breakdown .receipt,
section.confirmationDetails_breakdown .other-details {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media (min-width: 768px) {

    section.confirmationDetails_breakdown .receipt,
    section.confirmationDetails_breakdown .other-details {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

section.confirmationDetails_breakdown .other-details.single-col {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    flex-flow: column;
    margin-top: 1rem;
}

section.confirmationDetails_breakdown .booking-info,
section.confirmationDetails_breakdown .event-details,
section.confirmationDetails_breakdown .facilities,
section.confirmationDetails_breakdown .other-facilities,
section.confirmationDetails_breakdown .catering,
section.confirmationDetails_breakdown .your-details {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
}

section.confirmationDetails_breakdown .booking-info td,
section.confirmationDetails_breakdown .booking-info th,
section.confirmationDetails_breakdown .event-details td,
section.confirmationDetails_breakdown .event-details th,
section.confirmationDetails_breakdown .facilities td,
section.confirmationDetails_breakdown .facilities th,
section.confirmationDetails_breakdown .other-facilities td,
section.confirmationDetails_breakdown .other-facilities th,
section.confirmationDetails_breakdown .catering td,
section.confirmationDetails_breakdown .catering th,
section.confirmationDetails_breakdown .your-details td,
section.confirmationDetails_breakdown .your-details th {
    width: 50%;
}

section.confirmationPayment .payment-method-select {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

section.confirmationPayment .payment-method-select-items {
    display: flex;
    flex-flow: row nowrap;
    list-style: none;
    margin: 0;
}

section.confirmationPayment .payment-method-select-items li {
    padding: 0.5rem;
}

section.confirmationPayment .payment-method-select-items li:first-child {
    padding-left: 0;
}

section.confirmationPayment .payment-method-select-items li:last-child {
    padding-right: 0;
}

section.confirmationPayment .payment-method-select-items label {
    background: white;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

section.confirmationPayment .cash-reference {
    display: none;
}

section.confirmationPayment input[type=radio]#cash:checked .cash-reference {
    display: block;
}

section.success .alert.success {
    margin: 1.5rem;
}

section.success .alert.success h2 {
    color: #19726C;
    flex-grow: 1;
    padding-left: 6rem;
    display: flex;
    flex-flow: row;
    align-items: center;
}

section.success .alert.success h2:before {
    content: "";
    width: 5rem;
    height: 5rem;
    position: absolute;
    left: 16px;
    text-align: center;
    line-height: 1.75;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin: 0;
}

section.success .intro {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

section.successHome .confirmrow {
    align-items: center;
    flex-flow: column;
}

.hide

/* ,.col-hidden*/
    {
    display: none !important;
}



/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Floor Plan Display
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */


.slot-time-select p,
.slot-time-select .input-group {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
}



.slot-time-select p {
    margin: 0.75rem 0;
    padding-right: 16px;
    padding-left: 16px;
    display: block;
}


.slot-time-select p strong {
    font-weight: 600;
}

.slot-time-select .input-group {
    margin-bottom: 0.75rem;
}

@media screen and (min-width:768px) {
    .slot-time-select .input-group {
        margin-bottom: 0rem;
    }
}

.slot-time-select .input-group .time-position {
    padding: 0 16px;
    flex: 50% 50% auto;
    flex-basis: 50%;
    width: 50%;
}

.wrap.floor-plan-wrap {
    max-width: 100vw !important;
    margin-top: 0 !important;
    padding: 0;
}

.floor-plan-container {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.floor-plan-controls {
    display: block;
    position: absolute;
    top: 16px;
    right: 0px;
    width: 53px;
    height: 120px;
    z-index: 1;
}

@media(min-width: 767px) {
    .floor-plan-controls {
        right: 32px;
    }
}

@media(min-width: 1200px) {
    .floor-plan-controls {
        right: 64px;
    }
}

.zoomControls {
    display: flex;
    flex-flow: column nowrap;
    width: 2rem;
}

.zoomControls input[type="button"] {
    font-size: 2rem;
    padding: 0;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.canvas-wrap {
    background: #fff;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-flow: column;
}

#dvFloorPlanBookingInfo {
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: rgba(0, 0, 0, 0.2);
}

.canvas-container,
.lower-canvas,
.upper-canvas {
    flex-grow: 1;
    display: block;
    width: 100vw !important;
    height: 80vw !important;
    /* ratio = 4/5 * 100 = 80 */
}


.floor-plan-key {
    display: block;
    position: absolute;
    top: 16px;
    left: 16px;
    width: 42rem;
    height: 15rem;
    z-index: 1;
    pointer-events: none;
}

@media screen and (min-width:768px) {
    .floor-plan-key {
        left: 32px;
    }
}



.floor-plan-key-items {
    width: 100%;
    border-radius: 4px;
    display: none;
}

@media screen and (min-width:768px) {
    .floor-plan-key-items {
        display: flex;
        flex-flow: column;
        width: 42vw;
        max-width: 550px;
    }
}

.floor-plan-key-items ul {
    order: 1;
    list-style: none;
    padding: 0;
    margin-top: 0;
    margin-bottom: 0.5rem;
    display: flex;
    flex-flow: row wrap;
    padding: 16px;
    border: 1px solid #ccc;
    background: white;
}

.floor-plan-key-items p {
    order: 2;
    margin-bottom: 0;
}

.floor-plan-key-items ul li {
    position: relative;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 2.5rem;
    padding-right: 0.5rem;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}

.floor-plan-key-items ul li:before {
    content: '';
    background-size: 100%;
    background-repeat: no-repeat;
    display: block;
    width: 2rem;
    height: 2rem;
    left: 0;
    position: absolute;
}

.floor-plan-key-items ul li p {
    margin-bottom: 0;
    flex-grow: 1;
    font-weight: 600;
}

.floor-plan-key-items ul li.booked-inuse:before {
    background-image: url('../content/images/circle_red.svg');
}

.floor-plan-key-items ul li.available:before {
    background-image: url('../content/images/circle_green.svg');
}

.floor-plan-key-items ul li.unavailable:before {
    background-image: url('../content/images/circle_grey.svg');
}

.floor-plan-key-items ul li.your-desk:before {
    background-image: url('../content/images/circle_blue.svg');
}

.floor-plan-key-items ul li.related:before {
    background-image: url('../content/images/circle_gold.svg');
}

.floor-plan-key-items ul li.partially-booked:before {
    background-image: url('../content/images/circle_gold.svg');
}


.multiple-booking-dates-list input {
    padding: 0 10px;
    right: 0;
    position: absolute;
    margin-right: 2rem;
}

.multiple-booking-dates-list li {
    line-height: 2;
    margin-bottom: 1rem;
}

.multiple-date-choice {
    padding: 15px 0px;
}

.multiple-date-choice label {
    font-weight: 700;
    font-size: 1.2rem;
    margin-right: 0.5rem;
}


/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Room Layout
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.room-layout-table td p {
    text-align: center;
}

.room-layout-table th {
    width: 50%;
}

.resource-icon {
    width: 40px;
    margin-right: 0.2rem;
}

.resource-icon-row {
    margin-left: 0;
    margin-top: 1.5rem;
}

#dvFacilities {
    overflow: visible;
}

/*rememberMe styling fixes for login page*/
#rememberMeInput {
    align-items: start;
    flex-direction: inherit;
}

#rememberMeInput label {
    width: 25%;
}

#rememberMeInput .icon-wrap {
    justify-content: start;
    width: 10%;
}

.card-links li a:hover,
#ShowMap:hover {
    cursor: pointer;
    text-decoration: underline;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Booking Complete
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

section.booking-complete-page {
    margin: auto;
    padding-top: 2rem;
    padding-left: 16px;
    padding-right: 16px;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Room Layout Modal
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.modal.modal-hotdesk {
    width: 100%;
    max-width: 100vw;
}

@media screen and (min-width:25rem) {
    .modal.modal-hotdesk {
        max-width: 80vw;
    }
}


@media screen and (min-width:100rem) {
    .modal.modal-hotdesk {
        max-width: 50vw;
    }
}

@media screen and (min-width:768px) {
    .modal.modal-hotdesk .row.roomdesk-details {
        align-items: flex-start !important;
    }
}

.modal.modal-hotdesk .modal-roomdesk-attributes,
.modal.modal-hotdesk .modal-roomdesk-photo {
    width: 100%;
    flex: 100% 100% auto;
    flex-basis: 100% !important;
    padding: 0 16px;
}

@media screen and (min-width:768px) {
    .modal.modal-hotdesk .modal-roomdesk-attributes {
        order: 2;
        width: 70%;
        flex: 70% 70% auto;
        flex-basis: 70% !important;
    }

    .modal.modal-hotdesk .modal-roomdesk-photo {
        order: 1;
        width: 30%;
        flex: 30% 30% auto;
        flex-basis: 30% !important;
    }
}


.modal.modal-hotdesk .modal-roomdesk-photo {
    position: relative;
    overflow: hidden;
}

.modal.modal-hotdesk .modal-roomdesk-photo figure {
    height: 0;
    width: 100%;
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
}

.modal.modal-hotdesk .modal-roomdesk-photo figure img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.modal.modal-hotdesk .modal-roomdesk-attributes .resource-selector-list .row {
    flex-flow: row wrap;
}

.modal.modal-hotdesk .dateselect-date {
    width: 100%;
    flex: 100% 100% auto;
    flex-basis: 100% !important;
}

.modal.modal-hotdesk .dateselect-date h5,
.modal.modal-hotdesk .dateselect-date .h5 {
    margin-bottom: 0.5rem;
}

.modal.modal-hotdesk .toolbar-body {
    padding: 0;
    background: transparent !important;
}

.modal .features-list,
.my-booking .features-list {
    width: 100%;
    flex: 100% 100% auto;
    flex-basis: 100% !important;
    display: flex;
    flex-flow: row wrap;
    list-style: none;
    margin: 0;
}

.modal .features-list {
    padding: 0 16px;
}

.modal .features-list li,
.my-booking .features-list li {
    padding: 0 0.25rem;
}

.modal .features-list li:first-child,
.my-booking .features-list li:first-child {
    padding-left: 0;
}

.modal .features-list li:last-child,
.my-booking .features-list li:last-child {
    padding-right: 0;
}


.modal .features-list p,
.my-booking .features-list p {
    display: inline-block;
    background: #d6ecf3;
    padding: 8px 16px;
    border-radius: 4px;
    color: #333;
    font-weight: 600;
}


.modal .dateselect-availability {
    flex-grow: 1;
    flex-basis: 100%;
    width: 66.667%;
    padding: 0 16px;
}

.modal .dateselect-timeslots {
    flex-flow: row wrap !important;
}

@media screen and (min-width:968px) {
    .modal .dateselect-timeslots {
        flex-flow: row nowrap !important;
    }
}


.modal .dateselect-starttime,
.modal .dateselect-endtime {
    flex: 50% 50% auto;
    flex-basis: 50% !important;
    width: 50% !important;
}

@media screen and (min-width:968px) {

    .modal .dateselect-starttime,
    .modal .dateselect-endtime {
        flex: 33% 33% auto;
        flex-basis: 33% !important;
        width: 35% !important;
    }
}

.modal .dateselect-starttime p,
.modal .dateselect-endtime p {
    margin-bottom: 0;
}

.modal .dateselect-timeslots {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
}

.modal .toolbar {
    padding: 0;
}

.modal .confirmButton {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    display: flex;
    justify-content: flex-end;
}

.modal .dateselect-availableslot {
    padding-right: 16px;
    padding-left: 16px;
}

.dateselect-availableslot .alert {
    margin: 0 !important;
}

.modal .dateselect-starttime,
.modal .dateselect-endtime {
    display: flex;
    flex-flow: column;
}

.modal .dayBookingDetails {
    display: table;
    width: 100%;
    border-collapse: collapse;
}

@media screen and (min-width:760px) {
    .modal .dayBookingDetails {
        table-layout: fixed;
    }
}


@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {

    .modal .dayBookingDetails,
    .modal .dayBookingDetails thead,
    .modal .dayBookingDetails tbody,
    .modal .dayBookingDetails th,
    .modal .dayBookingDetails td,
    .modal .dayBookingDetails tr {
        display: block;
    }

    .modal .dayBookingDetails thead tr {
        position: absolute !important;
        top: -9999px;
        left: -9999px;
    }

    .modal .dayBookingDetails td {
        /* Behave  like a "row" */
        border: none;
        position: relative;
        padding-top: 2rem;
        padding-left: 0;
    }

    .modal .dayBookingDetails td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 100%;
        padding-right: 10px;
        white-space: nowrap;
        font-weight: bold;
        color: var(--primary-colour);
    }

    /*
	Label the data
	*/
    .modal .dayBookingDetails td:nth-of-type(1):before {
        content: "ID";
    }

    .modal .dayBookingDetails td:nth-of-type(2):before {
        content: "Name";
    }

    .modal .dayBookingDetails td:nth-of-type(3):before {
        content: "From";
    }

    .modal .dayBookingDetails td:nth-of-type(4):before {
        content: "To";
    }
}



/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* ROOM CARD LIST
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
.rooms-card-list .card-image figure img {
    object-fit: fill !important;
}

.rooms-card-list .card,
.rooms-card-list .modal .modal-card,
.modal .rooms-card-list .modal-card,
.available-venues .rooms-card-list section.login .toolbar-body,
section.login .available-venues .rooms-card-list .toolbar-body,
.available-venues .rooms-card-list .location-card {
    margin-bottom: 0rem !important;
}

.rooms-card-list .card-image figure svg {
    overflow: hidden;
    position: absolute;
    inset: 0px;
    display: flex;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* BOOKING HISTORY
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Style tab links */
.tablink {
    cursor: pointer;
}

.pagination li {
    display: inline-block;
    padding: 5px;
}

.booking-history ul.list {
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
    overflow: visible;
    position: relative;
    clear: both;
    list-style: none;
}


.booking-history ul.list li {
    padding: 0.5rem 0;
}

.booking-history ul.list li:first-child {
    padding-top: 0rem;
}

.booking-history ul.list li:last-child {
    padding-bottom: 0rem;
}

.booking-history ul.list li .card {
    margin: 0 1em;
    background: white;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
}


.booking-history ul.list li .card-body {
    display: flex;
    flex-flow: column wrap;
    position: relative;
    padding-right: 12px;
}

@media screen and (min-width:768px) {
    .booking-history ul.list li .card-body {
        display: flex;
        flex-flow: row wrap;
        align-items: center;
        gap: 14px;
    }
}

/* .booking-history .card .booking-information,
.booking-history .card .booking-location,
.booking-history .card .booking-status,
.booking-history .card .booking-link,
.booking-history .card .booking-type,
.booking-history .card .booking-client,
.booking-history .card .booking-capacity,
.booking-history .card .booking-status-name,
.booking-history .card .booking-topay {
    padding: 0 16px;
} */

@media screen and (min-width:768px) {
    .booking-history .card .booking-location {
        flex-grow: 1;
    }
}

.booking-history li a{
    color: var(--black);
    text-decoration: none;
}

@media(max-width:768px){
    .booking-history .card{
        align-items: flex-start;
    }

    .booking-history .card .card-body{
        padding-top: 0;
        padding-bottom: 0;
    }
}

.booking-history .booking-link-text:after {
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.5rem;
    display: block;
    width: 40px;
    height: 100%;
    line-height: 72px;
    transform: translateY(-50%);
    text-align: center;
    color: var(--black);
    z-index: 0;
    cursor: pointer;
    content: '\f054';
    right: 8px;
    position: absolute;
}


/* .booking-history .booking-link a:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
} */

.booking-history .booking-information .upcomingDate,
.booking-history .booking-information .pastDate,
.booking-history .booking-information .bookingDate {
    font-weight: 600;
}

.booking-history .booking-status {
    width: 100%;
}

.booking-history .booking-status .alert {
    padding: 0.5rem 16px;
    background: white;
}

.booking-history .booking-status .alert p {
    font-weight: 600;
    text-align: center;
}

.booking-history .booking-status .alert.danger p {
    color: #D1486F;
}

.booking-history .booking-status .alert.success p {
    color: #339F83;
}

@media screen and (min-width:768px) {
    .booking-history .booking-status {
        width: 20%;
    }

    .booking-history .booking-status .alert {
        margin-bottom: 0;
    }

    .booking-history .booking-information p,
    .booking-history .booking-location p,
    .booking-history .booking-type p,
    .booking-history .booking-client p,
    .booking-history .booking-capacity p,
    .booking-history .booking-status-name p,
    .booking-history .booking-topay p {
        margin: 0;
    }
}

/* Pay for bookings */

.payForBookings .card .card-header {
    padding: 16px;
    background-color: #ebebeb;
    transition: .3s ease;
    position: relative;
}

.payForBookings .card .card-header span {
    padding: 0;
    display: block;
}

.payForBookings .card .card-header .booking-location {
    padding: 0;
}

.payForBookings .card .card-header .bookingDate {
    font-weight: 600;
}

.payForBookings .card .card-header i {
    position: absolute;
    top: 20px;
    right: 16px;
}

.payForBookings .card .card-body {
    padding: 12px 16px;
    border-top: 1px solid white;
    box-sizing: border-box;
    transition: .3s ease;
}

.payForBookings .card:hover>.card-header,
.payForBookings .card:hover>.card-body {
    background-color: #d3d3d3;
}

.payForBookings .card .card-body .bookingStatus,
.payForBookings .card .card-body .bookingToPay {
    font-weight: 600;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* MANAGE BOOKING
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.manage-booking .manage-booking-back-link {
    position: relative;
    display: block;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 40px;
}

.manage-booking .manage-booking-back-link:before {
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1em;
    display: block;
    width: 40px;
    height: 100%;
    line-height: 40px;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    color: var(--primary-colour);
    z-index: 0;
    cursor: pointer;
    content: '\f053';
    left: 0px;
    position: absolute;
}


.manage-booking .card {
    background: white !important;
    box-shadow: 0 3px 6px rgba(204, 204, 204, 0.9), 0 3px 6px rgba(204, 204, 204, 0.22);
    margin-top: 1.5rem;
}

.manage-booking .booking-photo,
.manage-booking .booking-details {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}


@media screen and (min-width:768px) {
    .manage-booking .booking-photo {
        flex: 33% 33% auto;
        flex-basis: 33%;
        width: 33%;
    }

    .manage-booking .booking-details {
        flex: 66% 66% auto;
        flex-basis: 66%;
        width: 66%;
    }

    .booking-details h3:first-child {
        margin-top: 0;
    }
}


.manage-booking .card .row {
    align-items: flex-start;
}

.manage-booking .booking-photo figure,
.manage-booking .booking-location-map figure,
.my-booking .booking-photo figure {
    display: block;
    visibility: visible;
    height: 0;
    position: relative;
    margin-bottom: 0;
}

.manage-booking .booking-photo figure,
.my-booking .booking-photo figure {
    background: var(--background-colour);
}

.manage-booking .booking-location-map figure {
    border: 1px solid var(--background-colour);
    overflow: hidden;
    background: white;
}


.manage-booking .booking-photo figure,
.my-booking .booking-photo figure {
    padding-bottom: 56.25%;
}

.manage-booking .booking-location-map figure {
    padding-bottom: 100%;
}

.manage-booking .booking-photo figure img,
.my-booking .booking-photo figure img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.booking-details .booking-time h3,
.booking-details .your-details h3,
.booking-details .booking-notes h3,
.booking-location h2 {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

.booking-details table {
    display: table;
    width: 100%;
}

.manage-booking .booking-location,
.manage-booking .booking-location-map {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
}

.manage-booking .booking-location-map #divCanvas svg {
    fill: var(--primary-colour);
}

.manage-booking .booking-location-map figure {
    width: 60%;
    padding-bottom: 50%;
    margin: auto;
}

.swal2-styled.swal2-confirm,
.swal2-styled.swal2-cancel {
    line-height: 1.1;
}



/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* MY BOOKING
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.my-booking .card .row {
    align-items: flex-start;
}

.my-booking .booking-photo,
.my-booking .booking-details,
.my-booking #checkInButtons,
.my-booking #checkedInButtons {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
}

@media screen and (min-width:768px) {
    .my-booking .booking-photo {
        flex: 33% 33% auto;
        flex-basis: 33%;
        width: 33%;
    }

    .my-booking .booking-details {
        flex: 66% 66% auto;
        flex-basis: 66%;
        width: 66%;
    }

    .booking-details h3:first-child {
        margin-top: 0;
    }
}

.my-booking #checkInButtons,
.my-booking #checkedInButtons {
    display: flex;
    flex-flow: column;
}

@media screen and (min-width:768px) {
    .my-booking #checkInButtons {
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-between;
    }

    .my-booking #checkedInButtons {
        display: flex;
        flex-flow: row nowrap;
        justify-content: flex-end;
    }
}

/*-----------------------------------*/
/* CONFIRMATION PAGE */
/*-----------------------------------*/
.confirmationDetails_breakdown .wrap {
    background: transparent;
}

#ConfirmationDetails {
    border-radius: 2px;
    margin: 1rem 4rem;
    min-height: 600px;
    padding: 10px 30px;
}

.confirmation-text {
    color: black;
    margin-bottom: 1rem;
}

.fa-icon {
    text-align: center;
    margin-right: 2rem;
    width: 25px;
}

.confirmation-wrap {
    margin-left: 5rem;
    margin-right: 5rem;
}

.confirmation-breakdown {
    border: solid white 5px;
    border-radius: 50px;
}

#bookingConfirmPage .alert.success {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}

#bookingConfirmPage .alert.success h2 {
    flex-grow: 1;
    color: var(--black);
}

#bookingConfirmPage .alert.success i {
    margin-right: 1rem;
    color: #339F83;
}


/*-----------------------------------*/
/* HOME PAGE */
/*-----------------------------------*/

#BedfordContainer h1 {
    text-align: center;
}

#BedfordContainer {
    background: white;
    padding: 1rem;
    border-radius: 0px;
    width: calc(100% - 40px);
    max-width: 1000px;
    margin: auto;
    margin-top: auto;
    height: auto;
    position: relative;
    margin-top: 5rem;
    border: 1px solid var(--hero-area-colour);
}

#selectChildApplication {
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
}

#selectChildApplication .homepage-row {
    justify-content: center;
}

@media(min-width:650px) {
    .md-col-4 {
        padding: 0 16px;
        width: 33.33333333%;
    }
}

@media screen and (max-width: 1050px) {
    .homepage-row {
        margin: 0;
    }
}

.zip-widget {
    margin: 0;
    display: block;
    padding: 24px;
}

.zip-widget .btn-primary {
    background-color: var(--primary-colour);
    border: 4px solid var(--primary-colour);
    font-weight: 700;
    padding: 0.625rem 0.75rem;
    transition: background-color 0.1s ease-out, border-color 0.1s ease-out, color 0.1s ease-out;
    border-radius: 0.25rem;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: auto;
    display: inline-block;
    text-align: center;
    text-decoration: none !important;
    line-height: 1.2;
    cursor: pointer;
    vertical-align: middle;
    float: none;
    height: auto;
    color: white;
}

.zip-navigation {
    display: none;
}

/*-----------------------------------*/
/* /* Confirmation page- fire safety styling*/
/*-----------------------------------*/

.fire-safety-header {
    width: 100%;
}

.fire-safety-wrap {
    margin: 0 8rem 5rem 8rem;
}

.fire-descriptive-text {
    margin: 1rem 0;
}

.fire-safety-icon {
    text-align: center;
    width: 25px;
    height: 25px;
    font-size: x-large;
    margin-right: 0.5rem;
    margin-bottom: 1rem;
}

.fire-hider-text {
    cursor: pointer;
    width: 100%;
    margin: auto;
}

.fire-html {
    width: 100%;
    margin-bottom: .5rem;
    padding: 15px;
    background: white;
    border: 1px solid white;
    border-radius: 5px;
}

li.c5.c7.li-bullet-0 {
    margin-bottom: 1rem;
}

table .c24 {
    margin-bottom: 0;
}

.c5 {
    margin: 0 0.5rem;
}

.c0 {
    margin: 0 2rem;
}

.li-bullet-0 {
    margin-bottom: 1rem;
    display: block;
}

.li-bullet-0:before {
    font-size: 4px;
    content: "o";
    margin-right: 0.5rem;
    border: solid 1px black;
    padding: 0px 1px;
    background: black;
    border-radius: 48px;
    color: black;
    vertical-align: middle;
    margin-left: -1rem;
}

/*-----------------------------------*/
/* ZIPPORAH HEADER
/*-----------------------------------*/

.site-header {
    background: var(--primary-colour);
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
}

.site-header .wrap {
    margin-top: 0;
    margin-bottom: 0;
    overflow: visible;
    position: relative;
}

.site-header .row {
    justify-content: space-between;
}

.site-header .logo {
    padding: 0 16px;
    width: 100%;
    flex-basis: 100%;
    text-align: center;
    margin-bottom: 1rem;
}

@media screen and (min-width:600px) {
    .site-header .logo {
        width: 50%;
        flex-basis: 50%;
        text-align: left;
        margin-bottom: 0rem;
    }
}

.site-header .logo figure {
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (min-width:600px) {
    .site-header .logo figure {
        margin-left: 0;
        margin-right: 0;
    }
}

.site-header .logo .st0 {
    fill: #009ACE;
}

.site-header .logo .st1 {
    fill: #FFFFFF;
}


/*-----------------------------------*/
/* ZIPPORAH ACCOUNT
/*-----------------------------------*/

.site-header .account {
    width: 100%;
    flex-basis: 100%;
    padding: 0 16px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

@media screen and (min-width:600px) {
    .site-header .account {
        width: 50%;
        flex-basis: 50%;
        justify-content: flex-end;
        margin-bottom: 0;
    }
}

.site-header .account .button {
    margin-bottom: 0;
}

.site-header .accountNameText,
.site-header .account_control {
    padding: 0 16px;
}

.site-header .accountNameText {
    display: flex;
    flex-flow: row;
    align-items: center;
    position: relative;
    padding: 0;
    margin: 0;
}

@media screen and (min-width:600px) {
    .site-header .accountNameText {
        padding: 0 16px;
    }
}

.site-header .accountNameText span:hover,
.site-header .accountNameText span:active,
.site-header .accountNameText span:focus-within {
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    border-radius: 7px;
}

.site-header .accountNameText span {
    font-weight: 600;
    color: white;
    padding: 8px;
}

@media screen and (min-width:600px) {
    .site-header .accountNameText {
        justify-content: flex-end;
    }
}



/*-----------------------------------*/
/* ZIPPORAH NAVIGATION - hamburger menu updated
/*-----------------------------------*/

.site-header .logo {
	width: auto;
    flex-basis: auto;
    margin: 0;
    display: flex;
    align-items: center;
    flex-flow: row nowrap;
}

.site-header .account {
	width: auto;
    flex-basis: auto;
    color: white;
}

@media(max-width: 799px){
    .site-header .usernameHeader {
        font-size: 13px;
    }
}

@media(max-width: 499px){
    .site-header .account {
        width: 100%;
        margin: 0;
    }

    .site-header .wrap {
        margin-bottom: 0;
    }
}

.site-header #siteMenuToggle:checked~.site-main-menu {
    display: flex;
}

.site-main-menu {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 3;
    top: 0;
    right: 0;
    overflow-x: hidden;
    transition: 0.5s;
    box-shadow: -5px 0px 7px rgba(0, 0, 0, 0.45);
    background: var(--menu-background-colour);
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    padding-bottom: 30px;
}

.site-main-menu .wrap {
    width: 375px;
    padding: 0 16px;
    margin-right: 0;
    margin-left: 0;
}

.closeMenuIcon{
    font-size: 26px;
    color: white;
    margin-top: 16px;
    cursor: pointer;
    transition: .3s ease;
}

.menuIcon {
	margin: 16px 0 16px 16px;
	color: white;
	font-size: 20px;
    transition: .3s ease;
    cursor: pointer;
}

.closeMenuIcon:hover,
.closeMenuIcon:focus,
.menuIcon:hover,
.menuIcon:focus{
    opacity: .6;
}

#loginMenu a.button{
    line-height: 20px;
}

#loginMenu span{
    color: white;
    margin-bottom: 12px;
    font-size: 16px;
    display: block;
}


.slideLeft {
    animation: .5s slideLeft;
}

@keyframes slideLeft {
    from {
        margin-right: -350px;
    }

    to {
        margin-right: 0;
    }
}

.site-main-menu ul {
    padding: 0 16px;
    width: 100%;
    flex-basis: 100%;
}

.site-main-menu ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    display: flex;
    flex-flow: row nowrap;
}

.site-main-menu ul .list-group-item {
    padding: 0;
    display: flex;
    flex-flow: row nowrap;
}

.site-main-menu ul li:last-child {
    border-bottom: 0px solid white;
}

.site-main-menu .list-group-item-action:hover,
.site-main-menu .list-group-item-action:active,
.site-main-menu .list-group-item-action:focus-within {
    background: var(--menu-links-hover-colour);
    color: white;
}

.site-main-menu a,
.site-main-menu a:visited {
    color: var(--menu-link-colour);
    text-decoration: none;
    display: block;
    padding: 0.5rem 0.25rem;
}

.site-main-menu a:not(.button) {
	flex-grow: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/*-----------------------------------*/
/* PERSON SEARCH RESULTS
/*-----------------------------------*/

#PersonSearchResults .tabContent .location-list .input-group {
    margin-bottom: 1rem;
}

#PersonSearchResults .tabContent .location-list .input-group p {
    flex-grow: 1;
}

#PersonSearchResults .tabContent .location-list .input-group .button-primary {
    width: 30%;
}

input[disabled=disabled] {
    opacity: 0.75;
}

.input-group .button-small,
.toolbar-body .search-results-wrap .location-list .input-group .button-small {
    padding: 0 16px;
    font-weight: 400;
    font-size: 14px;
    height: 30px;
    line-height: 16px;
    margin-top: -8px;
}

.catering .button-small {
    margin-top: 1rem;
}

#PersonSearchResults .input-group p {
    margin-bottom: 0.5rem;
    width: 50%
}

.small-textbox {
    width: 50%;
}

#PersonSearchResults .tabContent {
    background: var(--hero-area-border-colour);
    border: solid var(--hero-area-border-colour) 3px;
    border-radius: 3px;
    padding: 0 8px;
    margin-top: 1rem;
}

#PersonSearchResults .search-results-wrap {
    margin: 1rem 0;
}

#new-person-details {
    width: 100%;
}

.resource-selector .catering-description {
    width: 100%;
    flex-basis: 40%;
}

.catering-menu-title {
    margin-bottom: 0.5rem;
}

.catering-wrap {
    margin: 1rem 0;
}

.catering-menu-item input[type=number],
.catering-menu-item input[type=time] {
    width: 50%;
}

.catering-menu-item select {
    margin-bottom: 0;
}

.catering-item-quantity {
    margin-top: 0.5rem;
    margin-right: 0.5rem;
}

.catering-menu-item.catering-description label {
    margin-right: 16px;
    max-width: 50%;
}

.catering-menu-item {
    width: 100%;
}

.catering-menu-item p {
    font-style: italic;
}

.catering-bookings {
    padding: 0 16px;
}

.catering-bookings table {
    margin: 0;
}

.catering-bookings .catering-booking-row {
    padding-top: 0;
}

.catering-bookings table th {
    padding-bottom: 0;
}

.catering-booking-rows select {
    margin-bottom: 0;
}

#catering-hire-list li {
    background-color: #d2d2d2;
    box-sizing: border-box;
    margin: 0 16px;
    padding: 16px;
    border-radius: 7px;
    flex-basis: 100%;
    margin-bottom: 12px;
}

#catering-hire-list .input-group {
    justify-content: space-between;
}

#catering-hire-list .input-group input[type="button"] {
    margin: 0;
}

/*more info image styling*/
.moreinfo-large-image {
    width: calc(100% + 32px);
    justify-content: center;
    display: flex;
    margin-bottom: 0.5rem;
    margin-right: -16px;
    margin-left: -16px;
}

.moreinfo-large-image img {
    width: 100%;
}

.moreinfo-images {}

.moreinfo-images img.moreinfo-small-image {
    width: 33%;
    padding: 5px;
}

.moreinfo-images img.moreinfo-small-image.selected {
    padding: 3px;
    border: 2px solid black;
}

.modal .modal-body .rooms-card-list li {
    width: 50%;
}

/*Generic Fixes*/
.appointment .dateselect-toolbar .row {
    align-items: baseline;
}

.select2-search__field {
    margin-bottom: 0;
}

@media screen and (max-width:600px) {
    .site-header .logo figure {
        margin-left: 0.5rem;
    }
}

.appointment .checkbox-row input[type="checkbox"] {
    margin-left: 0.5rem;
    margin-top: 0.4rem;
}

.your-details .alert {
    margin-top: 1rem;
}

/*Date picker media queries*/
@media screen and (min-width:1160px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 72%;
        flex-basis: 72.5%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 23%;
        flex-basis: 23%;
    }
}

@media screen and (max-width:1160px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 70%;
        flex-basis: 70%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:1130px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 69%;
        flex-basis: 69%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (min-width: 1120px) and (min-width: 968px) {
    .full_width_ui section.room-hire-search {
        width: 33%;
        max-width: 300px;
        margin: 0;
        position: sticky;
        top: 0rem;
        height: fit-content;
    }
}

.appointment .dateselect-toolbar .row .datepicker-col {
    width: 25%;
    flex-basis: 25%;
}



@media screen and (max-width:980px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 65%;
        flex-basis: 65%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:940px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 64%;
        flex-basis: 64%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:910px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 62%;
        flex-basis: 62%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:880px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 60%;
        flex-basis: 60%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:840px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 57%;
        flex-basis: 57%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:790px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 55%;
        flex-basis: 55%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:740px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 52%;
        flex-basis: 52%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:710px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 49%;
        flex-basis: 49%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:660px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 46%;
        flex-basis: 46%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:640px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 44%;
        flex-basis: 44%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:600px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 42%;
        flex-basis: 42%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:580px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 38%;
        flex-basis: 38%;
    }

    .full_width_ui .toolbar-full-col.row-spacebetween {
        flex-flow: column;
    }
}

.terms_conditions .input-group input[type=checkbox] {
    margin-bottom: 0 !important;
}


.appointment .dateselect-toolbar .row .datepicker-col {
    width: 25%;
    flex-basis: 25%;
}



@media screen and (max-width:520px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 100%;
        flex-basis: 100%;
        margin-bottom: 1rem;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 100%;
        flex-basis: 100%;
        margin-bottom: 2rem;
    }
}


@media screen and (max-width:1080px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 68%;
        flex-basis: 68%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:1040px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 67%;
        flex-basis: 67%;
    }

    .appointment .dateselect-toolbar .row .datepicker-col {
        width: 25%;
        flex-basis: 25%;
    }
}

@media screen and (max-width:1000px) {
    .appointment .dateselect-toolbar .row .location-search-bar {
        width: 66%;
        flex-basis: 66%;
    }
}

/*If side menu is active*/
.full_width_ui {
    display: flex;
    flex-flow: column;
}

@media(min-width: 968px) {
    #searchBarWhen #dateSelector span {
        display: block;
    }

    #searchBarWhen label[for="singleDate"],
    #searchBarWhen label[for="multipleDate"] {
        width: calc(50% - 3px);
    }

}

@media(min-width: 1068px) {
    #searchBarWhen #dateSelector span {
        display: inline-block;
    }

    #searchBarWhen label[for="singleDate"],
    #searchBarWhen label[for="multipleDate"] {
        width: auto;
    }
}

@media screen and (min-width: 968px) {
    .full_width_ui {
        flex-flow: 1;
        flex-flow: row;
        justify-content: space-between;
    }
}

@media (min-width: 968px) {
    .full_width_ui {
        max-width: 75rem;
        margin: 0 auto;
    }

    .full_width_ui section.room-hire-search,
    .full_width_ui section.available-venues {
        width: 100%;
        flex-basis: 100%;
    }

    .full_width_ui section.room-hire-search {
        margin-bottom: 1rem;
    }
}

@media (min-width: 968px) {
    .full_width_ui section.room-hire-search {
        width: 40%;
        max-width: 350px;
        margin: 0;
        position: sticky;
        top: 0rem;
        height: fit-content;
    }
}

/*@media screen and (min-width: 968px) {
    .full_width_ui section.room-hire-search .toolbar-body {
        background: transparent;
    }
}*/

@media screen and (min-width: 599px) {
    .full_width_ui section.room-hire-search .toolbar .row {
        flex-wrap: wrap;
    }
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .toolbar-half-col,
    .full_width_ui section.room-hire-search .search-range-start,
    .full_width_ui section.room-hire-search .search-range-end {
        width: 100% !important;
        flex-basis: 100% !important;
    }
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .search-range-start .input-group,
    .full_width_ui section.room-hire-search .search-range-end .input-group {
        flex-wrap: wrap;
    }
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .search-range-start .input-group button,
    .full_width_ui section.room-hire-search .search-range-end .input-group button {
        margin-left: 0 !important;
        padding: 0 0.5rem;
    }
}

@media screen and (min-width: 769px) {
    .full_width_ui section.room-hire-search .search-range-start {
        padding-bottom: 1rem !important;
    }
}

.full_width_ui section.available-venues .rooms-card-list {
    display: flex;
    flex-flow: row wrap;
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding: 0;
    list-style: none;
}

.full_width_ui section.available-venues .rooms-card-list li {
    flex: 100% 100% auto;
    flex-basis: 100%;
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 1rem;
}

@media (min-width: 624px) {
    .full_width_ui section.available-venues .rooms-card-list li {
        flex: 50% 50% auto;
        flex-basis: 50%;
        width: 50%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (min-width: 1120px) {
    .full_width_ui section.available-venues .rooms-card-list li {
        flex: 33% 33% auto;
        flex-basis: 33%;
        width: 33%;
        padding-right: 16px;
        padding-left: 16px;
    }
}

.full_width_ui section.available-venues .venue-header {
    align-items: center;
}

.full_width_ui section.available-venues .venue-list li {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.125);
}

.full_width_ui section.available-venues .venue-list li ul li {
    width: 100% !important;
    border: 0px solid white;
}

.full_width_ui section.available-venues .card-links li {
    padding: 0 !important;
}

@media screen and (min-width: 968px) {

    .full_width_ui .location-list li,
    .full_width_ui .facility-list li,
    .full_width_ui .other-facility-list li {
        width: 100%;
        flex-basis: 100%;
    }

    .full_width_ui .tabbed-filters ul.tabs {
        flex-flow: column;
    }

    .full_width_ui .toolbar-full-col.row-spacebetween {
        flex-flow: column;
    }
}




.full_width_ui section.room-hire-search .responsive-tabs,
.full_width_ui section.event-sidebar .responsive-tabs {
    display: flex;
    flex-flow: column;
    width: 100%;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs,
    .full_width_ui section.event-sidebar .responsive-tabs {
        flex-flow: row wrap;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs,
    .full_width_ui section.event-sidebar .responsive-tabs {
        flex-flow: column wrap;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton {
    width: 100%;
    flex-basis: 100%;
    padding: 0 1rem;
    overflow: hidden;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton {
        width: 33%;
        flex-basis: 33%;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton {
        width: 100%;
        flex-basis: 100%;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton .tabContent,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton .tabContent {
    font-family: var(--font-stack);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    background-color: var(--primary-button-bk);
    border-radius: 4px;
    color: var(--primary-button-text);
    border: var(--primary-button-bk);
    cursor: pointer;
    box-sizing: border-box;
    transition: all 0.25s ease;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 100%;
    padding: 1rem 0.5rem;
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton .tabContent,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton .tabContent {
        background: transparent;
        color: var(--primary-colour);
        padding: 1rem 0;
        font-size: 1.125rem;
        font-weight: bold;
        box-shadow: 0px 0px #fff;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton span.tabContent,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton span.tabContent {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
}

/*  .full_width_ui section.room-hire-search .responsive-tabs .tabButton span.tabContent:after, .full_width_ui section.event-sidebar .responsive-tabs .tabButton span.tabContent:after {
        content: "";
        font-family: "Font Awesome 5 Free Solid";
        display: block;
        width: 20px;
        height: 20px;
        text-align: center;
        transform-origin: 0, 0;
        transition: all 250ms linear;
    }*/
.full_width_ui section.room-hire-search .responsive-tabs .tabButton span.tabContent:after,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton span.tabContent:after {
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 18px;
    display: block;
    width: 20px;
    height: 20px;
    /*line-height: 20px;*/
    top: 50%;
    /*transform: translateY(-50%);*/
    text-align: center;
    /*position: absolute;*/
    z-index: 0;
    cursor: pointer;
    content: "";
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton .tabContent p,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton .tabContent p {
    margin: 0;
    flex-grow: 1;
}

.full_width_ui section.room-hire-search .responsive-tabs .filter-content,
.full_width_ui section.event-sidebar .responsive-tabs .filter-content {
    display: none;
    flex-basis: 100%;
    width: 100%;
    padding: 0 1rem;
    margin: 1rem 0;
}

.full_width_ui section.room-hire-search .responsive-tabs .filter-content .toolbar-full-col,
.full_width_ui section.event-sidebar .responsive-tabs .filter-content .toolbar-full-col {
    padding: 0;
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]:checked+label.tabButton .tabContent span:after,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]:checked+label.tabButton .tabContent span:after {
    transform: rotate(180deg);
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByLocation,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByLocation {
    order: 0;
}

.full_width_ui section.room-hire-search .responsive-tabs .filter-content#byLocation,
.full_width_ui section.event-sidebar .responsive-tabs .filter-content#byLocation {
    order: 1;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs .filter-content#byLocation,
    .full_width_ui section.event-sidebar .responsive-tabs .filter-content#byLocation {
        order: 3;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .filter-content#byLocation,
    .full_width_ui section.event-sidebar .responsive-tabs .filter-content#byLocation {
        order: 1;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByFacilities,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByFacilities {
    order: 2;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByFacilities,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByFacilities {
        order: 1;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByFacilities,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByFacilities {
        order: 2;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .filter-content#byFacilities,
.full_width_ui section.event-sidebar .responsive-tabs .filter-content#byFacilities {
    order: 3;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs .filter-content#byFacilities,
    .full_width_ui section.event-sidebar .responsive-tabs .filter-content#byFacilities {
        order: 4;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .filter-content#byFacilities,
    .full_width_ui section.event-sidebar .responsive-tabs .filter-content#byFacilities {
        order: 3;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByDay,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByDay {
    order: 4;
}

@media screen and (min-width: 599px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByDay,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByDay {
        order: 2;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton#filterByDay,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton#filterByDay {
        order: 4;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .filter-content#byDay,
.full_width_ui section.event-sidebar .responsive-tabs .filter-content#byDay {
    order: 5;
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]#filterByLocation:checked~.filter-content#byLocation,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]#filterByLocation:checked~.filter-content#byLocation {
    display: block;
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]#filterByFacilities:checked~.filter-content#byFacilities,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]#filterByFacilities:checked~.filter-content#byFacilities {
    display: block;
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]#filterByDay:checked~.filter-content#byDay,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]#filterByDay:checked~.filter-content#byDay {
    display: block;
}

.full_width_ui section.room-hire-search .responsive-tabs .day-select,
.full_width_ui section.room-hire-search .responsive-tabs #byFacilities .toolbar-full-col,
.full_width_ui section.room-hire-search .responsive-tabs #byLocation .toolbar-full-col,
.full_width_ui section.event-sidebar .responsive-tabs .day-select,
.full_width_ui section.event-sidebar .responsive-tabs #byFacilities .toolbar-full-col,
.full_width_ui section.event-sidebar .responsive-tabs #byLocation .toolbar-full-col {
    margin: 0 1rem;
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .responsive-tabs #byLocation .row-spacebetween,
    .full_width_ui section.event-sidebar .responsive-tabs #byLocation .row-spacebetween {
        flex-flow: column;
        align-items: flex-start;
    }
}

@media screen and (min-width: 978px) {

    .full_width_ui section.room-hire-search .responsive-tabs #byLocation .location-list li,
    .full_width_ui section.event-sidebar .responsive-tabs #byLocation .location-list li {
        width: 100%;
        flex-basis: 100%;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton .tabContent,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton .tabContent {
    font-family: var(--font-stack);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    background-color: var(--primary-grey);
    border-radius: 4px;
    color: var(--primary-colour);
    border: var(--primary-button-bk);
    cursor: pointer;
    box-sizing: border-box;
    transition: all 0.25s ease;
    width: 100%;
    padding: 1rem 0.5rem;
    box-shadow: none;
}

.full_width_ui section.room-hire-search .responsive-tabs .tabButton span.tabContent,
.full_width_ui section.event-sidebar .responsive-tabs .tabButton span.tabContent {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]:checked+label.tabButton span.tabContent:after,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]:checked+label.tabButton span.tabContent:after {
    transform: rotate(180deg);
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .search-range-start .input-group,
    .full_width_ui section.room-hire-search .search-range-end .input-group,
    .full_width_ui section.room-hire-search .capacity .input-group,
    .full_width_ui section.event-sidebar .search-range-start .input-group,
    .full_width_ui section.event-sidebar .search-range-end .input-group,
    .full_width_ui section.event-sidebar .capacity .input-group {
        flex-wrap: nowrap !important;
        align-items: center;
    }
}

@media screen and (min-width: 968px) {

    .full_width_ui section.room-hire-search .toolbar-body,
    .full_width_ui section.event-sidebar .toolbar-body {
        background: transparent;
        padding-top: 0px;
        padding-bottom: 0px;
        margin: 0;
    }
}

.full_width_ui section.room-hire-search .responsive-tabs input[type=radio]:checked+label.tabButton .tabContent,
.full_width_ui section.event-sidebar .responsive-tabs input[type=radio]:checked+label.tabButton .tabContent {
    background: white;
    color: var(--primary-colour);
    margin-bottom: 0.3rem;
}

section.available-venues .venue-list {
    background: white;
}


/* –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* FLOORPLAN INTERFACE
/* –––––––––––––––––––––––––––––––––––––––––––––––––– */

.wrap.floor-plan-ui {
    max-width: none;
}

@media screen and (min-width:75rem) {
    .wrap.floor-plan-ui {
        flex-grow: 1;
        height: 100%;
    }
}

.floor-plan-ui .row.ui-wrapper {
    display: flex;
    flex-flow: column;
}

@media screen and (min-width:75rem) {
    .floor-plan-ui .row.ui-wrapper {
        display: flex;
        flex-flow: row nowrap !important;
        align-items: stretch;
        height: 100%;
        position: relative;
    }
}

.floor-plan-sidebar,
.floor-plan-outer {
    padding: 1rem 16px;
    width: 100%;
}

@media screen and (min-width:75rem) {
    .floor-plan-sidebar {
        width: 28vw;
        min-width: 500px;
        max-width: 500px;
        background: white;
        position: sticky;
        top: 0;
    }

    .floor-plan-sidebar .toolbar-body {
        background: transparent !important;
    }


    .floor-plan-outer {
        flex-grow: 1;
        display: flex;
        position: relative;
        padding: 0;
        align-items: stretch;
        flex-flow: column;
        overflow: hidden;
        width: 100%;
    }
}

.floor-plan-outer .available-venues {
    flex-grow: 1 !important;
    display: flex;
    flex-flow: column;
}

.floor-plan-wrap {
    display: flex;
    flex-flow: column;
    flex-grow: 1;
}

.floor-plan-container {
    flex-grow: 1;
}

.search-results-wrap {
    background: var(--input-bk) !important;
    border: 1px solid #d1d1d1 !important;
}

#timeFields {
    width: 100%;
}

#dvFloorPlanPlaceholder .row.fill-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}

#dvFloorPlanPlaceholder .row.fill-container .placeholder-message {
    position: relative;
    display: flex;
    flex-flow: column;
    width: 25rem;
    margin: 0 auto;
}

#dvFloorPlanPlaceholder .row.fill-container .placeholder-message .placeholder-image {
    position: relative;
    display: block;
    visibility: visible;
}

#dvFloorPlanPlaceholder .row.fill-container .placeholder-message .placeholder-image figure {
    width: 100%;
    padding-bottom: 56.25%;
    position: relative;
    margin-bottom: 0;
}

#dvFloorPlanPlaceholder .row.fill-container .placeholder-image figure img,
#dvFloorPlanPlaceholder .row.fill-container .placeholder-image figure svg {
    position: absolute;
    width: 100%;
    height: 100%;
}


#dvFloorPlanPlaceholder .row.fill-container .placeholder-message .placeholder-caption {
    flex-grow: 1;
    padding: 1rem;
}

#dvFloorPlanPlaceholder .row.fill-container .placeholder-message .placeholder-caption p {
    margin: 0;
}

.site-header .logo figure {
    max-width: 250px;
    padding: 16px;
    width: 135px;
}

#logoImg {
    background: white;
}


/*Coffs Harbour Custom CSS*/

.room-hire-search .toolbar {
    background: var(--hero-area-colour);
    border: solid 1px var(--hero-area-colour);
    border-radius: 5px;
}

.room-hire-search .wrap .toolbar {
    background: transparent;
    border: none;
    border-radius: 0px;
}

.full_width_ui .room-hire-search {
    margin-right: 2px;
    margin-top: 4.8rem;
}

.hero-breadcrumb,
.hero-breadcrumb .breadcrumb,
.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a {
    background: var(--breadcrumb-bk);
    color: var(--black);
}

.breadcrumb-item+.breadcrumb-item::before {
    color: var(--black);
}

.site-footer {
    padding: 0px;
}

.site-footer .wrap {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.site-footer,
.site-footer a,
.site-footer .h4 {
    background: var(--primary-colour-dark);
    color: var(--menu-link-colour);
    text-decoration: none;
}

.site-footer,
.site-footer a {
    font-size: small;
}

.site-footer .row {
    align-items: start;
}

@media screen and (min-width: 800px) {
    .site-footer .form-four-col {
        width: 33%;
        flex-basis: 33%;
        padding: 2px;
    }
}

@media screen and (max-width: 800px) {
    .site-footer .form-four-col {
        width: 100%;
        flex-basis: 100%;
    }
}

.site-footer p {
    flex-flow: wrap;
    display: flex;
}

.site-footer p label {
    padding-right: 2px;
    font-weight: 700;
}

.site-footer .h4,
.site-footer .h4 a {
    font-size: large;
    margin: 1rem 0;
}

.full_width_ui h2.h2 {
    margin-top: 0;
    margin-bottom: 1.5rem;
}

.modal .modal-body .modal-roomdesk-attributes .rooms-card-list li {
    width: 75%;
}

.modal .modal-body .modal-roomdesk-attributes .room-layout-header .h3 {
    margin: 1.5rem 0 0 1rem;
}

.modal-roomdesk-attributes .resource-selector .resource-selector-list li {
    border: 1px solid white;
}

.resource-selector .resource-selector-list li.alert {
    padding: 1rem 16px;
    margin-bottom: 0.5rem;
}

li.alert.success {
    border: 1px solid #339F83;
}

li.alert.warning {
    border: 1px solid #FBC333;
}

li.alert.danger {
    border: 1px solid #D1486F;
}


.full_width_ui #PartialSeachView .confirmrow .confirmButton {
    padding-right: 32px;
}

.full_width_ui #PartialSeachView {
    background-color: #ebebeb;
    border-radius: 5px;
}

.full_width_ui #MultipleAvailalbeResourceCategories .confirmButton {
    width: 30%;
    flex-basis: 30%;
}

.full_width_ui #hasListBeenUpdated {
    width: 70%;
    margin-bottom: 0;
    padding: 0.5rem 16px;
    font-weight: 900;
}

#selectMultipleBookings {
    margin-top: 0.3rem;
}

ul.resource-selector-list li .dateselect-availability .card-footer {
    width: 20%;
}


/* Multiple Bookings */

/* Search bar styling */

#roomHireSearchHeader div div p {
    margin-bottom: 0;
}

#roomHireSearchHeader {
    margin-bottom: 10px;
}

#searchBarMain {
    overflow-x: hidden;
    overflow-y: scroll;
    height: 800px;
    mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent 17px, black 17px);
    mask-size: 100% 20000px;
    mask-position: left bottom;
    -webkit-mask-image: linear-gradient(to top, transparent, black), linear-gradient(to left, transparent 17px, black 17px);
    -webkit-mask-size: 100% 20000px;
    -webkit-mask-position: left bottom;
    transition: mask-position 0.3s, -webkit-mask-position 0.3s;
    scrollbar-width: thin;
    padding-bottom: 300px;
}

#searchBarMain:hover {
    -webkit-mask-position: left top;
}



#searchTitle h2 {
    margin: 0;
    padding: 1.5rem 16px;
    background-color: #ebebeb;
    box-shadow: 0px 15px 10px -15px #888;
    z-index: 2;
    position: relative;
}

@media (max-width:967px) {
    #searchBarMain {
        height: fit-content;
        padding-bottom: 0;
    }

    #searchTitle h2 {
        box-shadow: none;
        padding-bottom: 0;
    }

    #hlSearch {
        display: none;
    }
}

/* Chrome and Edge adjustments */

#searchBarMain::-webkit-scrollbar {
    width: 8px;
}

#searchBarMain::-webkit-scrollbar-track {
    background: transparent;
}

#searchBarMain::-webkit-scrollbar-thumb {
    background-color: rgba(155, 155, 155, 0.5);
    border-radius: 20px;
    border: transparent;
}


.form-select-wrap {
    margin-bottom: 5px;
}

.eventStartDate,
.eventEndDate {
    margin-right: 10px;
}

#selectSingleBooking,
#selectMultipleBookings {
    display: inline-block;
    border: 0;
}

#selectionTypeSelector {
    width: 380px;
}

.toolbar-body .row {
    display: block;
}

.toolbarSelectBooking {
    width: 400px;
}

.toolbarSearch {
    display: inline-block;
    width: 400px !important;
    margin-top: 15px;
}

.toobarSort {
    display: inline-block;
    width: 250px !important;
}

@media(max-width:685px) {
    #multipleBookingsToolbar .toolbarSearch {
        width: 100% !important;
    }

    #multipleBookingsToolbar .toobarSort {
        width: 100% !important;
    }
}

@media(max-width:768px) {
    .input-group #filterSearchButton {
        width: 100px;
        padding: 0;
        display: inline-block;
    }
}

.dateselect-availability .row {
    display: flex
}

.toolbarSearch .input-group {
    flex-direction: row;
}

@media (min-width: 968px) {

    #byFacilities,
    #byDay,
    #byLocation {
        max-width: 310px;
    }
}


/*  */

.dateselect-availability .input-group label:hover,
label[for="selectAllDates"]:hover {
    background-color: var(--primary-button-hover-bk);
}


.greyButton {
    box-sizing: border-box;
    background-color: var(--primary-grey) !important;
    color: var(--primary-colour) !important;
}

.greyButton:hover {
    background-color: var(--primary-grey-dark) !important;
    border-color: var(--primary-grey-dark) !important;
    color: white !important;
}

#TermsAndConditionsSubmit,
#confirmBookingInformation {
    background-color: var(--primary-green);
    border: 1px solid var(--primary-green);
}

#TermsAndConditionsSubmit:hover,
#confirmBookingInformation:hover {
    color: var(--primary-green);
    background-color: var(--primary-grey);
}

.confirmation-header .resource-selector-header h2 {
    color: var(--primary-green);
    font-weight: 500;
}



.facilitiesCard {
    background: #fbfafa;
    border-radius: 10px;
    margin-bottom: 1rem;
    padding: 1rem;
}

.add-facilities-section {
    display: flex;
}

.add-facilities-section .itemSummary {
    flex: 1;
}

.add-facilities-section .facilitiesOptions {
    flex: 2;
}

.facilityOption {
    display: flex;
    justify-content: space-between;
}

.facilityOption p,
.facilityOption input {
    margin-bottom: 0;
}

.facilitiesOptions hr {
    margin: 1rem;
}

.facility-hide {
    display: none;
}

/* Multiple Bookings */

#searchBarWhen h3 {
    padding: 0;
}

.checkboxToButton input[type=checkbox] {
    display: none !important;
}

#recurrenceDate {
    padding: 16px;
}

#recurrenceSelector div {
    display: inline-block;
    width: 48%;
}

#recurrenceSelector div label {
    width: 100%;
}

#recurrenceSelector div label #text {
    vertical-align: middle;
}

#onSelectedDateDiv label {
    padding: 0 0 0 3px;
}

#weekdaysSelector {
    margin-top: 20px;
}

#searchCalendar .search-range-end {
    padding: 0;
}

#dateSelections .checkboxToButton {
    margin: 0 16px;
}

.search-range-end label {
    margin: 0;
}

.hiddenUI {
    display: none !important;
}

.infoHint p,
.hint {
    font-weight: 400;
    color: var(--primary-grey-dark);
    font-size: 13px;
}

.hintIcon {
    color: var(--primary-grey-dark);
    font-size: 13px;
}

#weekdays ul {
    list-style: none;
    margin-top: 10px;
}

#weekdays ul li input,
#weekdays ul li label {
    display: inline;
    font-weight: 400;
}

.recurrenceSelector {
    margin-bottom: 20px;
}

#dateSelector div label {
    flex-grow: 0;
    padding: 0 10px;
    display: inline-block;
}

#searchBarWhen {
    width: 100%;
}

#singleDateDiv,
#multipleDateDiv {
    display: inline;
}

#selectedDateRows li input[type=button] {
    position: static;
    margin: 0 0 0 10px
}

.interactiveSectionHeader {
    color: var(--primary-colour);
    padding: 0 !important;
    margin-bottom: 5px;
    font-weight: 700;
    margin-top: 15px;
}

.normalLabelHeader {
    color: var(--black);
    font-weight: 400;
}

.interactiveSpan {
    color: var(--primary-colour);
    font-weight: 600;
}

.defaultOption {
    color: var(--primary-grey-dark) !important;
}

#recurrenceDate p {
    margin-bottom: 10px;
}

.recurrenceSelector p {
    margin-bottom: 10px !important;
}

#DailyRecurrenceNumber,
#WeeklyRecurrenceNumber,
#MonthlyRecurrenceNumber {
    width: 100%;
}

#monthlyRecurrenceSelector {
    margin-bottom: 30px;
}

#monthlyRecurrenceSelector div {
    margin-top: 15px;
}

#monthlyRecurrenceSelector div span select {
    margin-bottom: 10px;
}

#byDay div div .day-list li {
    padding: 0;
    margin-bottom: 10px;
    margin-right: 10px;
    width: 46%;
}

#byDay div div .day-list li div label {
    padding: 0;
}

@media (max-width: 967px) {
    #byDay div div .day-list li {
        width: auto;
    }

    #byDay div div .day-list li div label {
        padding: 0 10px;
    }

    .full_width_ui section.room-hire-search .responsive-tabs .tabButton .tabContent,
    .full_width_ui section.event-sidebar .responsive-tabs .tabButton .tabContent {
        border: 1px solid var(--primary-colour);
    }
}

#bookingTypeSelection {
    margin-top: 10px;
    margin-bottom: 20px
}

#bookingTypeSelection .toolbar-half-col {
    margin-bottom: 10px;
}

.facilitiesHeader .pageTitle {
    padding: 0;
    color: var(--primary-colour);
    font-weight: 700;
    font-size: 1.6875rem;
    margin-bottom: 10px;
}

.facilitiesHeader h2 {
    padding: 0;
    color: var(--primary-colour);
    font-weight: 700;
    font-size: 1.1.3125rem;
}

#facilityHireSection .wrap {
    padding: 0;
}

#facilityHireSection .toolbar-body {
    margin: 0;
}

#facility-list li {
    padding-left: 16px;
}

#facility-list .facility-name {
    padding: 0;
}

#facility-hire-list .resource-selector {
    padding: 16px 32px;
}

.facility-info {
    width: fit-content;
    display: inline-block;
}

#facility-list .facility-name {
    font-weight: 600;
    color: var(--primary-colour);
}

#facility-list .facility-amount {
    display: inline-block;
    width: fit-content;
}

#facility-list .facility-amount .number-entry {
    margin: 0;
}

@media (max-width: 488px) {
    #facility-list .facility-amount {
        display: block;
        padding: 0;
    }
}

#facility-list p {
    margin: 0;
}

#facility-list .facility-amount .number-entry-wrap label {
    text-align: left;
    display: inline-block;
}

#facility-list .facility-amount .number-entry-wrap .number-entry {
    text-align: left;
    display: inline-block;
}

#dvGetAvailability .confirmrow .confirmButton {
    flex-grow: 100%;
}

#dvGetAvailability .confirmrow .confirmButton a {
    margin-left: 10px;
}

.main-loader {
    min-width: 100%;
}

.dynamic-question-header h2 {
    margin-bottom: 10px;
    padding: 0;
}

.dynamic-question-header {
    margin-bottom: 30px;
}

.multipleBookingButton {
    margin-bottom: 2px;
}

.multipleBookingButton::before {
    top: 48% !important;
}

.form-full-col {
    padding: 0;
}

#eventStartDate,
#eventEndDate {
    width: 100%;
}

.hl {
    border-bottom: 1px solid #CACACA;
}

#hlSearch {
    margin: 0 16px;
    border-bottom: 1px solid var(--primary-colour);
    z-index: 1;
}

.timeUnavailable {
    border: 2px solid #ad0000;
}

#facility-hire-list .cancel-button,
#facility-hire-list .save-button {
    width: fit-content;
    display: inline-block;
}

#facility-hire-list #cancelFacilityHire,
#facility-hire-list #cancelFacilityEdit,
#facility-hire-list #submitFacility,
#facility-hire-list #submitFacilityEdit {
    width: 230px;
}

/* Search bar buttons adjustment */

#searchBarMain .checkboxToButton label:hover,
#searchBarMain button:hover,
#searchBarMain .confirmButton #aGetAvailabiliy:hover,
.day-list input:checked+label:hover,
#searchBarMain .button-plus:hover,
#searchBarMain .button-minus:hover,
#selectSingleBooking:hover,
#selectMultipleBookings:hover,
#filterSearchButton:hover {
    background-color: var(--primary-button-hover-bk);
    color: var(--white) !important;
}


/* Style adjustments */

#BreadcrumbSticky nav ol.breadcrumb,
#BreadcrumbSticky #CancelButtonToggle {
    padding-top: 0.8rem !important;
}

#roomHireSearchHeader {
    margin: 15px 0;
}

#roomHireSearchHeader .row {
    margin-bottom: 0;
}

#dvGetAvailability .row h2 {
    margin-top: 1.5rem;
    margin-bottom: 0px;
}

.full_width_ui .room-hire-search {
    margin-top: 0;
}


#OrganisationsSearchResults .location-list {
    padding: 0;
}

#OrganisationsSearchResults .location-list li {
    border-bottom: 1px solid #ebebeb;
    flex-basis: 100%;
}

#OrganisationsSearchResults .location-list li .input-group {
    justify-content: space-between;
    height: 50px;
    align-items: center;
    padding: 10px 0;
}

#OrganisationsSearchResults .location-list li .input-group p {
    margin: 0;
}

#OrganisationsSearchResults .location-list li .input-group input {
    margin-top: 1px;
}

section.confirmationDetails_breakdown .breakdown-card {
    background: #ebebeb;
    box-shadow: none;
    border-radius: 5px;
}

@media (max-width: 768px) {

    #dateSelections .input-group button,
    #dateSelections .input-group #eventStartDate {
        margin-bottom: 10px !important;
    }
}

/* Hot desks fixes */


.hero-breadcrumb {
    padding: 1px;
}

.booking-items-area #fromFacilities .resource-selector-actions .upload-file {
    text-align: left;
}

.breakdown-details h3 i {
    margin-right: 10px;
}

#hotDeskConfirmation {
    display: flex;
    flex-flow: row wrap;
    gap: 20px;
    align-items: baseline;
    justify-content: right;
}

@media (max-width:700px) {
    #hotDeskConfirmation {
        justify-content: left;
    }
}

#roomHireSearch {
    padding: 0 16px;
}

#roomHireSearch .confirmButton {
    width: 100%;
}

.resource-selector .resource-selector-list .facility-amount {
    padding-left: 0;
}

#submitFacilities {
    border: 1px solid var(--primary-colour);
    background: white;
    color: var(--primary-colour);
    box-sizing: border-box;
}

#submitFacilities:hover {
    border-color: white;
}

#roomHireSearch .button:hover,
#tabs .button:hover,
#searchOrganisationsButton:hover,
#continueFacilities:hover,
#OrganisationsPersonDv #searchOrganisationsButton:hover {
    background-color: white;
    color: var(--primary-colour);
}

#confirmBookingInformation:hover {
    background-color: white;
    color: var(--primary-green);
}

.search-results-wrap .button:hover {
    background-color: var(--primary-grey) !important;
    color: var(--primary-colour);
}

#hotDeskConfirmation .button-danger:hover {
    background-color: white;
    color: var(--primary-danger-dark);
}

#searchBarMain .toolbar-body {
    padding: 0;
}

#formSearchPerson .toolbar-body,
#formSearchOrganisation .toolbar-body {
    background: transparent;
}

.ui-tabs-nav,
#tabs {
    background: transparent;
    border: 0;
}

#tabs #tabs-1,
#tabs #tabs-2,
#tabs #tabs-3 {
    padding-left: 0;
    padding-right: 0;
    background: var(--primary-grey);
}

#tabs .ui-state-active a,
#tabs .ui-state-active a:link,
#tabs .ui-state-active a:visited,
#tabs .ui-state-hover a {
    color: white !important;
}

#submitSelectedClientForm:hover,
#roomBookingPersonSubmit #submitPerson:hover,
#submitOrganisation:hover {
    background-color: var(--primary-grey) !important;
}

#dvPersonSearchResults,
#dvOrganisationSearchResults {
    padding-right: 16px;
    padding-left: 16px;
}

.row.confirmrow.sticky-div {
    position: fixed;
    bottom: -75px;
    background: var(--primary-colour);
    width: 100%;
    left: 16px;
    padding: 1rem;
    z-index: 900000;
    justify-content: center;
    box-shadow: 0 -5px 10px #0000004f;
}


.row.confirmrow .confirmButton.sticky-div {
    position: fixed;
    bottom: -75px;
    background: var(--primary-colour);
    width: 100%;
    left: 0px;
    padding: 1rem;
    z-index: 900000;
    justify-content: center;
    box-shadow: 0 -5px 10px #0000004f;

    flex-basis: 100%;
    width: 100%;
    justify-content: flex-end;
    display: flex;
}

.row.confirmrow .confirmButton.sticky-div .continueBookingButton {
    background-color: white;
    border: 1px solid white;
    color: var(--primary-colour);
}

.row.confirmrow .confirmButton.sticky-div .continueBookingButton:hover {
    background-color: var(--primary-colour-dark);
    color: white;
}

.row.confirmrow .confirmButton.sticky-div .showMoreResourcesButton {
    background-color: var(--primary-colour);
    border: 1px solid white;
    color: white;
}

.row.confirmrow .confirmButton.sticky-div .showMoreResourcesButton:hover {
    background-color: var(--primary-colour-dark);
}

/* Manage Bokoings fixes */

.manage-booking .booking-details .row {
    margin: 0;
}

.manage-booking .booking-details .row h3 {
    padding-left: 0;
    margin-bottom: 5px;
}

.manageBookingButtons {
    gap: 16px;
    margin-bottom: 1.5rem !important;
}

.manageBookingButtons #checkInButtons,
.manageBookingButtons #checkedInButtons {
    display: flex;
    flex-flow: row wrap;
    gap: 16px;
}

.manageBookingButtons input[type="button"] {
    margin-bottom: 0;
    min-width: 175px;
}

label[for="selectAllDates"]::before {
    top: 20px;
    left: 5px;
    padding-right: 5px;
}

label[for="selectAllDates"] {
    padding-right: 10px !important;
}

.breakdown-details table td {
    width: 50%;
    padding-left: 0;
}

@media (max-width:900px) {

    .breakdown-details table th,
    .breakdown-details table td {
        font-size: 14px !important;
    }
}

.manage-booking #tabs .ui-tabs-panel {
    background-color: var(--hero-area-colour);
    padding: 0;
}



.booking-questions .form-full-col {
    padding: 0 16px;
}

.booking-tasks .toolbar-body {
    margin-bottom: 0;
}


@media screen and (max-width: 1135px) {

    .booking-tasks table tbody th,
    .booking-tasks hr {
        display: none;
    }

    .booking-tasks table {
        width: 100%;
    }

    .booking-tasks table tbody tr td {
        width: 100%;
        display: block;
        padding: 10px 0 10px 10px
    }

    .booking-tasks table tbody tr td:before {
        font-weight: 700;
    }

    .booking-tasks table tbody tr td[data-label="Description"] {
        border-radius: 4px;
        background-color: var(--table-mobile-top-cell-bk);
        font-weight: 700;
        color: var(--primary-colour);
        border-top: 1px solid var(--hero-area-border-colour);
        line-height: 20px;
    }

    .booking-tasks table tbody tr td[data-label="Complete by"]:before {
        content: "Deadline:";
    }

    .booking-tasks table tbody tr td[data-label="Complete by"] div {
        display: inline-flex;
    }

    .booking-tasks table tbody tr td[data-label="Created"]:before {
        content: "Created on:";
    }

    .booking-tasks table tbody tr td[data-label="Complete?"]:before {
        content: "Is complete?";
    }

    .booking-tasks table tbody tr td[data-label="Username"]:before {
        content: "Created by:";
    }

    .taskActions {
        padding-bottom: 30px !important;
    }

}

.taskActionsBtn {
    text-decoration: none;
    padding: 5px;
    background: var(--table-button-bk);
    color: var(--primary-colour) !important;
    border: 2px solid var(--primary-colour);
    border-radius: 4px;
    font-weight: 600;
    transition: 0.3s ease;
}

.taskActionsBtn:hover,
.taskActionsBtn:focus {
    background: var(--primary-colour-light);
    color: white !important;
    border-color: var(--primary-colour-light);
}



/* Accordion menu */

.accordion {
    margin: auto;
    width: 100%;
}

.accordion .infoHint {
    margin-bottom: 5px;
}

.accordion input[name="accordion"] {
    display: none;
}


.box {
    position: relative;
    background: white;
    height: 68px;
    transition: all .15s ease-in-out;
    margin-bottom: 7px;
    border-radius: 6px;
    border: 2px solid var(--accordion-border-color);
}

.box::before {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
    box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .24);
}

header.box {
    background: var(--app-gradient);
    z-index: 100;
    cursor: initial;
    box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px -2px rgba(0, 0, 0, .12), 0 2px 4px -4px rgba(0, 0, 0, .24);
}

header .box-title {
    margin: 0;
    font-weight: normal;
    font-size: 16pt;
    color: white;
    cursor: initial;
}

.box-title div {
    line-height: 22px;
}


.box-title {
    width: calc(100% - 40px);
    min-height: 64px;
    line-height: 64px;
    padding: 0 20px;
    display: inline-block;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.box-content {
    width: 100%;
    padding: 0px 20px;
    font-size: 11pt;
    color: var(--font-default-black);
    display: none;
}

.box-content p {
    margin-bottom: 15px;
}

.box-close {
    position: absolute;
    height: 64px;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    display: none;
    background: transparent;
}

.accordion input:checked+.box {
    height: auto;
    margin: 16px 0;
    border: 2px solid var(--accordion-border-color-active);
}

.accordion input:checked+.box .box-content,
.accordion input:checked+.box .box-close {
    display: inline-block;
}

.arrows section .box-title {
    padding-left: 44px;
    width: 100%;
    background: var(--lightgrey);
    margin: 0;
    display: flex;
    align-items: center;
    border-radius: 7px;
}

.arrows section .box-title:before {
    position: absolute;
    display: block;
    content: '\203a';
    font-size: 18pt;
    left: 20px;
    top: -2px;
    transition: transform .15s ease-in-out;
    color: rgba(0, 0, 0, .54);
}

.box-close,
.box-title {
    margin: 0;
}

.accordion input:checked+section.box .box-title:before {
    transform: rotate(90deg);
}

.accordion input .box-close:hover>.box-title {
    background: var(--mid-grey);
}


.optionName {
    font-weight: 700;
    color: var(--primary-colour);
}

.box input[type="submit"] {
    display: block;
    margin-top: 16px;
}

.box-content table td,
.box-content table th {
    font-size: 15px;
    line-height: 22px;
}


/* Input type file */

.fileBox input[type="file"] {
    display: none !important;
}

.fileBox .js input[type="file"] {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.fileBox input[type="file"]+label {
    font-size: 16px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 10px;
    line-height: 14px;
    border-radius: 4px;
    margin-left: 0;
}

.fileBox .no-js input[type="file"]+label {
    display: none;
}

.fileBox input[type="file"]:focus+label,
.fileBox input[type="file"].has-focus+label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

.fileBox input[type="file"]+label * {
    /* pointer-events: none; */
    /* in case of FastClick lib use */
}

.fileBox input[type="file"]+label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}


.fileBox input[type="file"]+label {
    color: var(--primary-colour);
    transition: .3s ease;
}

.fileBox input[type="file"]+label {
    border: 1px solid var(--hero-area-border-colour);
    background-color: white;
    /* padding: 0; */
}

.fileBox input[type="file"]:focus+label,
.fileBox input[type="file"].has-focus+label,
.fileBox input[type="file"]+label:hover {
    background-color: var(--input-file-grey-hover);
}

.fileBox input[type="file"]+label span,
.fileBox input[type="file"]+label strong {
    padding: 0.625rem 1.25rem;
    /* 10px 20px */
    border-radius: 4px;
    font-weight: 600;
    font-size: 14px;
}

.fileBox input[type="file"]+label span {
    width: 200px;
    min-height: 38px;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
}

.fileBox input[type="file"]+label strong {
    height: 38px;
    color: #f1e5e6;
    background-color: var(--primary-colour);
    display: inline-block;
    transition: .3s ease;
    border: 2px solid white;
}

.fileBox input[type="file"]:focus+label strong,
.fileBox input[type="file"].has-focus+label strong,
.fileBox input[type="file"]+label:hover strong {
    background-color: var(--primary-colour-light);
    color: white;
    border: 2px solid var(--primary-colour-light);
}

@media screen and (max-width: 585px) {
    .fileBox input[type="file"]+label {
        min-width: 100%;
    }

    .fileBox input[type="file"]+label strong {
        display: block;
        text-align: center;
    }
}

.dateselect-availability .input-group label:hover,
label[for="selectAllDates"]:hover {
    background-color: var(--primary-button-hover-bk);
}

label[for="selectAllDates"]::before {
    top: 20px;
    left: 5px;
    padding-right: 5px;
}

label[for="selectAllDates"] {
    padding-right: 10px !important;
}

.label-selectAllResource:hover {
    background-color: var(--primary-button-hover-bk) !important;
}

.label-selectAllResource::before {
    top: 20px !important;
    left: 5px !important;
    padding-right: 5px !important;
}

#ui-datepicker-div {
    z-index: 100 !important;
}




/* MY CONTACTS */

/* search bar */

#myContactsList .searchRow,
#contactSearchList .searchRow {
    padding: 0;
}

#myContactsList .search-input-wrap,
#contactSearchList .search-input-wrap {
    width: 60%;
    margin: auto;
    height: 50px;
    border: 0px;
    border-radius: 10px;
    background-color: #ebebeb;
}

#myContactsList #search-contact,
#contactSearchList #search-contact {
    border: 0px;
    position: relative;
    margin: 0;
    background: transparent;
    padding-left: 30px;
}

#myContactsList .card,
#contactSearchList .card {
    border: 0;
    border-radius: 20px;
    box-shadow: none;
    padding: 16px;
    box-sizing: border-box;
}

#myContactsList .list .card,
#myContactsList .contact-info-header .card {
    background-color: #ebebeb;
}

#myContactsList .card-body,
#contactSearchList .card-body {
    align-items: center;
    justify-content: center;
}

#contactSearchList .card-body div {
    flex-grow: 0;
}

#myContactsList .card-body .contact-image {
    max-width: 100px;
}

.manage-booking-back-link {
    margin-bottom: 20px;
}

#myContactsList {
    margin-top: 12px;
}

/* initial content */

#noContactsList .contact-image {
    margin: auto 10px auto 0px;
}

#myContactsList .contact-image {
    margin: auto 50px auto 0px;
}

#myContactsList .contact-image .fa {
    font-size: 5rem;
}

#noContactsList .contact-image {
    text-align: center;
}

.contact-message-noitems p {
    margin: 0;
    text-align: center;
}

@media(max-width:435px) {
    #myContactsList .contact-image {
        margin: auto 20px auto 0px;
    }

    #myContactsList .contact-image .fa {
        font-size: 4rem;
    }
}

#myContactsList .contact-message-noitems p {
    margin: 0;
}

#noContactsList {
    margin-top: 50px;
    margin-bottom: 50px;
}

@media(max-width:1240px) {
    #noContactsList {
        margin-top: 0px;
        margin-bottom: 0px;
    }
}

/* My contacts suggestions/dropdown */

#ui-id-1 {
    background-color: white;
    border: 1px solid #c7c7c7;
}

#ui-id-1 li {
    background-color: white;
}

#ui-id-1 li:hover {
    background-color: #EEF1E6;
}

#ui-id-1 li div {
    align-items: center;
}

#ui-id-1 li div:hover {
    background-color: #EEF1E6;
    border-color: #EEF1E6;
    color: #333;
    font-weight: 400;
}

#ui-id-1 li div a {
    color: #333;
    font-weight: 400;
}

#ui-id-1 li img {
    margin-right: 25px;
}

#ui-id-1 li span {
    flex-grow: 1;
}

#ui-id-1 li a {
    text-decoration: none;
}

#ui-id-1 li a i {
    border: 1px solid black;
    padding: 5px;
    border-radius: 50%;
}

.ui-menu .ui-menu-item {
    padding-left: 20px;

}

#ui-id-1 .ui-state-active {
    background-color: #EEF1E6;
    border: none;
    color: black;
    font-weight: 400;
}

#ui-id-1 {
    width: 40rem !important;
    left: auto !important;
    align-self: center;
}

@media(max-width: 700px) {
    #ui-id-1 {
        width: 95% !important;
    }

    #myContactsList .search-input-wrap,
    #contactSearchList .search-input-wrap {
        width: 90%;
    }
}

@media(max-width: 500px) {
    #ui-id-1 li {
        font-size: 11pt;
        padding-left: 10px;
    }

    #ui-id-1 li img {
        margin-right: 5px;
    }

}

#alreadyContactLabel {
    text-align: right;
    font-style: italic;
}

/* Return button/link */

#myContactsList .full-row a,
#contactSearchList .full-row a {
    display: block;
}

/* search results */

#myContactsList .card-body,
#contactSearchList .card-body {
    align-items: center;
    justify-content: initial;
}

#myContactsList .contact-arrow-right,
#contactSearchList .contact-arrow-right {
    float: right;
}


.contact-name {
    flex-grow: 3;
}

#contactSearchList .search-header h2 {
    margin: 40px 0;
}

#searchResultsRow .list {
    margin-top: 0;
}

#searchResultsRow .card-body div {
    flex-grow: 1;
}

#myContactsList .card-body .contact-name,
#searchResultsRow .card-body .contact-name {
    flex-grow: 3;
}

#searchResultsRow .contact-image {
    max-width: 150px;
}

#myContactsList .contact-image img,
#searchResultsRow .contact-image img {
    margin-left: 30px;
    vertical-align: middle;
}

@media(max-width: 650px) {

    #myContactsList .contact-image img,
    #searchResultsRow .contact-image img {
        margin-left: 0px;
    }

    #myContactsList .contact-image .name,
    #searchResultsRow .contact-name .name {
        margin-left: 15px;
    }
}

/* Contact page */

#myContactsList .contact-buttons button {
    margin-left: 30px;
}

#myContactsList .contact-name .name {
    line-height: 2.5;
}

#contact-remove-favorite i,
#contact-add-favorite i {
    margin-top: 40px;
}

@media(max-width: 820px) {
    .contact-info-header img {
        width: 60px;
        height: 60px;
    }

    #myContactsList .contact-name .name {
        line-height: 1;
    }

    #contact-remove-favorite i,
    #contact-add-favorite i {
        margin-top: 20px;
        margin-right: 10px;
    }
}

@media(max-width:750px) {
    #myContactsList .contact-buttons button {
        max-width: 200px;
        height: 70px;
        white-space: normal;
        line-height: 20px;
    }
}

@media(max-width:592px) {
    #myContactsList .contact-buttons button {
        width: 200px;
        height: 55px;
        white-space: normal;
    }
}

@media(max-width: 596px) {
    .contact-info-header .card-body {
        flex-wrap: wrap;
    }

    #myContactsList .contact-info-header .card-body div {
        flex-grow: 0;
    }

    #myContactsList .contact-info-header .contact-buttons button {
        margin-top: 20px;
    }
}

@media(max-width:400px) {
    #myContactsList .contact-image {
        margin-right: 10px;
    }

    #myContactsList #contactInformation {
        padding-left: 10px;
    }
}

/* Upcoming Bookings Table */

.upcoming-bookings-header h2 {
    color: var(--black);
}

#upcomingBookingsCard {
    border-radius: 70px !important;
    margin-top: 40px;
}

@media(max-width:750px) {
    #upcomingBookingsCard {
        margin-top: 10px;
    }

}

#upcomingBookingsCard table {
    margin: auto auto 50px auto;
}

#upcomingBookingsCard table .upcomingBookings-column2 {
    padding-left: 180px;
}


#upcomingBookingsCard table th {
    text-align: center;
}

#upcomingBookingsCard table td {
    border-bottom: 1px solid lightgrey;
}

@media(max-width:875px) {
    #upcomingBookingsCard table .upcomingBookings-column2 {
        padding-left: 30px;
    }
}

@media(max-width:500px) {
    #upcomingBookingsCard table .upcomingBookings-column2 {
        padding-left: 10px;
    }
}

/*Scrollbar for MyContacts page*/
#ui-id-1.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
    max-height: 40rem;
    overflow: auto;
}

@media(max-width: 564px) {}

.label-selectAllResource {
    padding-right: 10px !important;
}

.booking-item-topay {
    cursor: pointer;
}

.booking-item-topay.selected {
    background-color: lightblue !important;
}

.manage-booking .booking-details .status-paid {
    color: var(--primary-green);
}

table tr.current-booking>td {
    background-color: #66ff66;
}

.related-bookings .multiple-booking-id,
.related-bookings .bookings-count {
    padding-right: 12px;
}

.related-bookings .toolbar-body .row {
    width: auto;
    margin-bottom: 10px !important;
}

#aGetAvailabiliy.disabled {
    pointer-events: none;
    color: #ccc;
}

/*fixed for input type 'Number' so up/down arrows always shows*/
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.ui-tabs-nav li a {
    background-color: transparent !important;
}

.ui-tabs-anchor {
    width: auto !important;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
    color: var(--text-highlight-color);
    border: 0 !important;
}

.manage-booking #tabs #ui-id-1 {
    width: auto !important;
}

.manage-booking {
    margin-top: 10px;
}

/* Facilities and Catering adjstments - ex.77649 */

#dvAboutEvent #dvFacilities:not(:empty),
#dvAboutEvent #dvOptionalFees:not(:empty),
#dvAboutEvent #dvCatering:not(:empty),
#dvAboutEvent #dvDocuments:not(:empty) {
    margin-top: 16px;
    background-color: var(--hero-area-colour);
    border-radius: 7px;
    padding: 22px 16px;
}

#dvAboutEvent #dvDocuments .resource-selector,
#dvAboutEvent #dvDocuments .resource-selector h3 {
    padding: 0;
}

#cancelMultipleFacilityHire {
    margin-bottom: 0;
}

/* Manage Bookings - Catering */

#fromCatering .resource-selector-actions {
    padding: 0 16px;
}

#fromCatering .resource-selector-actions .upload-file {
    padding: 0;
}

.resource-selector-list .row.catering-bookings {
    background-color: #fbfafa;
    border-radius: 10px;
}

#dvAboutEvent #dvCatering .catering .resource-selector-list li,
#dvAboutEvent #dvCatering .catering .resource-selector-list li th {
    border: 0;
}

#dvAboutEvent #dvCatering .catering .resource-selector-list li td {
    padding-top: 0;
    padding-bottom: 0;
}

#tabs #dvCatering h2 {
    padding: 0;
}

#tabs #dvCatering h3 {
    padding: 0;
    margin: 12px 0;
}

#catering-main-div .toolbar-body .fourColLayout {
    display: flex;
    flex-flow: row nowrap;
    box-sizing: border-box
}

#catering-main-div .toolbar-body .fourColLayout:nth-child(odd) {
    background-color: var(--hero-area-border-colour);
}

#catering-main-div .toolbar-body .fourColLayoutHeader {
    background-color: var(--primary-colour) !important;
    color: white;
    border-radius: 7px 7px 0 0;
}

#catering-main-div .toolbar-body .fourColLayout:last-child {
    border-radius: 0 0 7px 7px;
}

#catering-main-div .toolbar-body .fourColLayout .fourCol {
    width: calc(25% - 16px);
    flex-grow: 1;
    box-sizing: border-box;
    padding: 10px 8px 10px 8px;
}

#catering-main-div .toolbar-body .fourColLayout .itemQuantity {
    width: 40px;
    flex-grow: 0;
}

/* Manage bookings - Related bookings */

#dvRelatedBookings .toolbar-body .row {
    margin: 0;
    width: 100%;
}

.alert i,
.alert h2 {
    display: inline-block;
    margin-right: 10px;
}

#multipleStartDateDisplay {
    margin-bottom: 12px;
}

.genericPageContent {
    margin-top: 16px;
}

.toolbar-body .genericSearch {
    display: flex;
    flex-flow: row wrap;
}

#divTimeSelection .room-hire-intro {
    padding: 0 32px;
}

.update-user-intro {
    margin-bottom: 12px;
}

/* Accessibility fixes */

.required:after {
    color: var(--primary-danger);
    content: " *";
}

body img {
    text-indent: -9999px;
}

.contact-item-no-contacts .card-body .my-contact-page-icon,
.contact-search-item-no-results .card-body .my-contact-page-icon {
    flex-grow: 0;
}

.contact-item-no-contacts .card-body,
.contact-item .card-body,
.contact-search-item-no-results .card-body {
    flex-flow: row nowrap !important;
}

.contact-item .card-body .contact-name {
    flex-basis: auto !important;
    max-width: 80% !important;
}


#aGetAvailabiliy.disabled {
    pointer-events: none;
    color: rgb(53, 53, 53);
    font-weight: 400;
    background-color: #b3b3b3;
    border-color: transparent;
}

/* === Start: Data Tables Plugin === */

.dataTables_wrapper {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    margin-bottom: 24px;
}

.dataTables_wrapper>* {
    order: 10;
}

.dataTables_wrapper>.dataTables_filter {
    order: 1;
    text-align: left;
    flex: 0 1 50%;
}

.dataTables_wrapper>.dataTables_length {
    order: 2;
    text-align: right;
    flex: 1 1 auto;
}

.dataTables_wrapper>.dataTables_length>label,
.dataTables_wrapper>.dataTables_filter>label {
    display: block;
    font-weight: normal;
    font-size: 0;
    margin: 0;
    position: relative;
}

.dataTables_wrapper>.dataTables_filter>label:after {
    display: inline-block;
    content: url(../content/images/zip-search-icon.svg);
    width: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 8px;
}

.dataTables_wrapper>.dataTables_length>label>select {
    font-size: 14px;
    padding: 8px;
    margin: 0 8px;
    width: auto;
    border-radius: 0;
}

.dataTables_wrapper>.dataTables_filter>label>input[type="search"] {
    font-size: 14px;
    padding: 8px;
    margin: 0;
    border-radius: 0;
    border: none;
    background-color: rgba(0, 0, 0, 0.1);
    padding-left: 32px;
}

.dataTables_wrapper>.dt-buttons {
    order: 3;
    flex: 0 1 auto;
    text-align: right;
}

button.dt-button,
div.dt-button,
a.dt-button {
    margin: 0;
    padding: 12px;
    border-radius: 2px;
    line-height: 1;
    color: #222222 !important;
}

.dataTables_wrapper>table {
    order: 4;
    flex: 0 0 100%;
    display: block;
    overflow: auto;
    margin: 16px 0;
}

table.dataTable tbody th,
table.dataTable tbody td,
table.dataTable thead th,
table.dataTable thead td {
    font-size: 13px;
    padding: 8px;
    text-align: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

table.dataTable thead th,
table.dataTable thead td {
    padding-right: 24px;
}

table.dataTable.noStyle,
table.dataTable.noStyle tbody,
table.dataTable.noStyle thead,
table.dataTable.noStyle tr,
table.dataTable.noStyle td {
    display: inline;
    padding: 0;
    background: transparent;
    border: none;
    width: 100% !important;
}

table.dataTable.noStyle thead td {
    font-size: 0;
}

table.dataTable.noStyle .btn,
table.dataTable.noStyle input[type="button"],
table.dataTable.noStyle input[type="submit"],
table.dataTable.noStyle input.btn,
table.dataTable.noStyle button {
    display: inline-block;
    width: auto;
    padding: 12px !important;
}

.dataTables_info {
    font-weight: 600;
}

.dataTables_paginate.paging_simple_numbers {
    text-align: right;
    flex: 1 1 auto;
}

.dataTables_paginate.paging_simple_numbers a.paginate_button {
    padding: 0;
    display: inline-block;
    border: none !important;
    background: transparent !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    border-radius: 200px;
    color: #222222 !important;
    opacity: 0.7;
}

.dataTables_paginate.paging_simple_numbers a.paginate_button.current,
.dataTables_paginate.paging_simple_numbers a.paginate_button:hover {
    opacity: 1.0;
    color: #222222 !important;
}

.dataTables_paginate.paging_simple_numbers a.paginate_button.disabled {
    display: none;
}

.dataTables_paginate.paging_simple_numbers a.paginate_button.previous,
.dataTables_paginate.paging_simple_numbers a.paginate_button.next {
    border: none !important;
    padding: 0;
}

.dataTables_wrapper>table {
    display: table !important;
    width: 100%;
}

/* Fixes to Manage booking */

.manageBookerDetails {
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-flow: row wrap;
    padding: 8px 0;
    border-bottom: 1px solid var(--primary-grey);
}

.manageBookerDetails input {
    flex-grow: 1;
    margin: 0;
}

.manageBookerDetails.editDetails {
    border-bottom: 0;
}

.manageBookerDetails p,
.manageBookerDetails div {
	margin: 0;
    flex-grow: 1;
}

.manageBookerDetails strong {
	width: 120px;
}

.manageBookerDetails div{
    display: flex;
    flex-flow: row wrap;
    gap: 12px;
}

@media(max-width: 1049px){
    .manageBookerDetails div{
        flex-flow: column nowrap;
    }
}

#updatePersonalDetailsButton{
    margin-top: 12px;
}

/* === End: Data Tables Plugin === */

/* === End: Data Tables Plugin === */

/* fix to booking confirmation */

section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header h2,
section.confirmationDetails_breakdown .breakdown-card .breakdown-card-header .h2 {
    margin-bottom: 0;
}

.multipleBookingBreakdownCard {
    background-color: #d7d7d7;
    border-radius: 7px;
    padding: 12px;
}

.multipleBookingBreakdownCard div {
    display: flex;
    flex-flow: row wrap;
    gap: 16px;
    justify-content: space-between;
    align-items: baseline;
    border-bottom: 1px solid #B0B0B0;
    padding-bottom: 10px;
}

.multipleBookingBreakdownCard div a {
    margin: 0;
}

.multipleBookingBreakdownCard th,
.multipleBookingBreakdownCard td {
    padding-top: 10px;
    padding-bottom: 10px;
}


/* Core Accessibility - Alert clearing (refer to case 80552) */

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span{
    font-size: 12px;
}

.styleSelect{
    padding: 10px;
    background-color: white;
    width: 100%;
}

.styleSelect::after{
    color: var(--black);
}

#dvRoomLayouts fieldset,
.venue-list fieldset,
.time-select fieldset{
    width: 100%;
}

#costs strong{
    display: block;
}

.bookingNoteRow{
    padding: 10px;
    border-bottom: 1px solid #d6d6d6;
    width: 100%;
}

#slotRows h3{
    padding: 0;
}

/* Client footer */

#site-footer{
    width: 100%;
    background-color: var(--primary-grey-dark);
}

#site-footer .wrap{
    display: flex;
    flex-flow: row wrap;
    gap: 12px;
    justify-content: space-between;
    color: white;
    min-height: 88px;
    align-items: center;
    padding: 16px;
    box-sizing: border-box;
}

#site-footer a{
    color: white;
}


#homeLinks{
	list-style-type: none;
	display: flex;
	flex-flow: row wrap;
	gap: 1rem;
}

#homeLinks li{
	width: calc(100% / 3 - 1rem);
	min-width: 280px;
	display: flex;
	justify-content: center;
	flex-grow: 1;
	flex-flow: column nowrap;
}

#homeLinks li a{
	width: 100%;
}

.homeIcon {
	padding: 36px;
	border-radius: 100px;
	height: 150px;
	width: 150px;
	background-color: #3c8067; 
	margin:auto;
	margin-bottom: 16px;
}

#homeLinks li a button{
	width: 100%;
}

#homeLinks.unauthenticated li,
#homeLinks li.last{
	flex-grow: 0;
}

#homeLinks.unauthenticated a{
	text-align: center
}

@media(max-width: 960px){
	#homeLinks.unauthenticated li,
	#homeLinks li.last{
		flex-grow: 1;
	}
}