@charset "UTF-8";

@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,300;0,400;0,700;0,800;1,300;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:opsz@9..40&display=swap");

@import url('tcs-london.css');
@import url('wimbledon.css');
@import url('edgbaston.css');
@import url('middlesbroughfc.css');
@import url('wembleypark.css');
@import url('wembleyquintain.css');
@import url('arsenal.css');
@import url('uefa.css');
@import url('cwg.css');
@import url('bha.css');
@import url('bbc.css');
@import url('bbc-sunderland.css');
@import url('bbc-luton.css');
@import url('reading-festival.css');
@import url('newcastle.css');   
@import url('rwc2025.css');
@import url('kasabian.css');

/* CTR BRANDING */
/* UEFA BRANDING */
/* Common Wealth Games BRANDING */
/* BDL BRANDING */
/* PTP BRANDING */
/* BHA BRANDING */
/* WEMBLEY PARK BRANDING */
/* BBC BRANDING */
/* BBC LUTON BRANDING */
/* BBC PRESTON BRANDING */
/* ARSENAL BRANDING */
/* BBC SUNDERLAND BRANDING */
/*

MIXINS

*/
/**
 * Output font size using rem and fallback
 *
   `@include font-size(10px);`
 *
 */
/**
 * Output font size using rem and colour
 *
   `@include font-size-colour (10px, ffffff);`
 *
 */
/**
 * Output uppercase with some letter spacing
 *
   `@include uppercase(0.1em);`
 *
 */
/**
 * Output vendor-prefixed rules
 *
   `@include prefix(border-radius, 4px);`
 *
 */
/**
 * Output clearfix rules
 *
   `@include clearfix;`
 *
 */
/**
 * Output media query block
 *
   `@include media-query(min, 640px);`
 *
 */
/**
 * Output media query block
 *
   `@include media-query-height(min, 640px);`
 *
 */
/**
 * Output media query block with min and max limits
 *
   `@include media-query-bracket(640px, 960px);`
 *
 */
/**
 * Output rule for offscreen image replacement
 *
   `@include offscreen();`
 *
 */
/**
 * Output color using rgba and fallback
 *
   `@include alpha(border-color, rgba(black,0.1), white);`
 *
 */
/**
 * Output percentage using px
 *
   `@include pxtopercent(500px, 1000px);`
 *
 */
/**
 * Set the opacity for all browsers and provide a filter fallback for IE8.
 *
   `@include opacity(0.8);`
 *
 */
/**
 * Center-align a block level element
 *
   `@include center-block;`
 *
 */
/**
 * Absolute Positioned
 *
   `@include abs-pos(10px, 10px, 5px, 15px);`
 *
 */
/**
 * Vertical Align anything
 *
   `@include vertical-align();`
 *
 */
/**
 * Set float direction and width
 *
   `@include fl-width(left, 100%);`
 *
 */
/**
* Full size background image
*
  `@include full-page-img('image.jpg');`
*
*/
/**
* keyframes mixin
*
  `@include keyframes(bgcolor)`
*
*/
/* RESET */
/*

NORMALIZE

*/
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/*
 * Corrects `block` display not defined in IE 8/9.
 */
@import url(https://fonts.googleapis.com/css?family=Fira+Sans:300,700|Lato:300,400,700);
@import url(https://fonts.googleapis.com/css?family=Comfortaa:300,400,700);
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap");
@import url(https://use.typekit.net/ksl3ybk.css);
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

/*
 * Corrects `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
    display: inline-block;
}

/*
 * Prevents modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/*
 * Addresses styling for `hidden` attribute not present in IE 8/9.
 */
[hidden] {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */
/*
 * 1. Sets default font family to sans-serif.
 * 2. Prevents iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
    font-family: sans-serif;
    /* 1 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
    -ms-text-size-adjust: 100%;
    /* 2 */
}

/*
 * Removes default margin.
 */
body {
    margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */
/*
 * Addresses `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
    outline: thin dotted;
}

/*
 * Improves readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
    outline: none;
}

/* ==========================================================================
   Typography
   ========================================================================== */
/*
 * Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
 * Safari 5, and Chrome.
 */
h1 {
    font-size: 2em;
}

/*
 * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
    border-bottom: 1px dotted;
}

/*
 * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
    font-weight: bold;
}

/*
 * Addresses styling not present in Safari 5 and Chrome.
 */
dfn {
    font-style: italic;
}

/*
 * Addresses styling not present in IE 8/9.
 */
mark {
    background: #ff0;
    color: #000;
}

/*
 * Corrects font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em;
}

/*
 * Improves readability of pre-formatted text in all browsers.
 */
pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/*
 * Sets consistent quote types.
 */
q {
    quotes: "“" "”" "‘" "’";
}

/*
 * Addresses inconsistent and variable font size in all browsers.
 */
small {
    font-size: 80%;
}

/*
 * Prevents `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */
/*
 * Removes border when inside `a` element in IE 8/9.
 */
img {
    border: 0;
}

/*
 * Corrects overflow displayed oddly in IE 9.
 */
svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */
/*
 * Addresses margin not present in IE 8/9 and Safari 5.
 */
figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */
/*
 * Define consistent border, margin, and padding.
 */
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
}

/*
 * 1. Corrects font family not being inherited in all browsers.
 * 2. Corrects font size not being inherited in all browsers.
 * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
 */
button,
input,
select,
textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 2 */
    margin: 0;
    /* 3 */
}

/*
 * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
    line-height: normal;
}

/*
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type=primary-btn],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
}

/*
 * Re-set default cursor for disabled elements.
 */
button[disabled],
input[disabled] {
    cursor: default;
    opacity: 0.7;
}

/*
 * 1. Addresses box sizing set to `content-box` in IE 8/9.
 * 2. Removes excess padding in IE 8/9.
 */
input[type=checkbox],
input[type=radio] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/*
 * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type=search] {
    -webkit-appearance: textfield;
    /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    /* 2 */
    box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/*
 * Removes inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE 8/9.
 * 2. Improves readability and alignment in all browsers.
 */
textarea {
    overflow: auto;
    /* 1 */
    vertical-align: top;
    /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */
/*
 * Remove most spacing between table cells.
 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/*

RESET

*/
/**
* Let’s make the box model all nice, shall we…?
*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

/**
 * The usual...
 */
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
dl, dd, ol, ul,
form, fieldset, legend,
table, th, td, caption,
hr {
    margin: 0;
    padding: 0;
}

/**
 * Give a help cursor to elements that give extra info on `:hover`.
 */
abbr[title], dfn[title] {
    cursor: help;
}

/**
 * Remove underlines from potentially troublesome elements.
 */
a, u, ins {
    text-decoration: none;
}

/**
 * Apply faux underline via `border-bottom`.
 */
ins {
    border-bottom: 1px solid;
}

/**
 * So that `alt` text is visually offset if images don’t load.
 */
img {
    font-style: italic;
    display: block;
    width: 100%;
}

/**
 * Give form elements some cursor interactions...
 */
label,
input,
textarea,
button,
select,
option {
    cursor: pointer;
}

.text-input:active,
.text-input:focus,
textarea:active,
textarea:focus {
    cursor: text;
    outline: none;
}

/* REBOOT */
/* ====== BASE STYLES ====== */
/* ======
BASE STYLES
    - TYPOGRAPHY STYLES
    - GENERAL SECTION STYLES
    - CONTENT SECTION STYLES
====== */
/* ==========================================================================
$   TYPOGRAPHY STYLES
========================================================================== */
:root {
    --newcastle: black;
    --newcastle-primary: #0a55ff;
    --newcastle-primary-600: #0843cc;
    --newcastle-secondary: #00e1ad;
    --rwc2025: #000000;
    --rwc2025-primary: #e1b300;
    --rwc2025-primary-600: #a57e00;
    --rwc2025-secondary: #bf0091;
    --rwc2025-secondary-600: #990074;
    --rwc2025-hn-font-family: rwc, sans-serif;
    --rwc2025-base-font-family: DM Sans, sans-serif;
    --reading-festival: #000000;
    --reading-festival-primary: #c4161c;
    --reading-festival-primary-600: #c4161c;
    --reading-festival-secondary: #ffcb05;
    --reading-festival-secondary-600: #ffcb05;
    --reading-festival-hn-font-family: Helvetica Neue, Helvetica, sans-serif;
    --reading-festival-base-font-family: Helvetica Neue, Helvetica, sans-serif;
    --wimbledon: #1c1c1c;
    /* Primary (green) */
    --wimbledon-primary: #00703c;
    --wimbledon-primary-hover: #00894a; /* lighter */
    --wimbledon-primary-600: #1c1c1c;
    /* Secondary (purple) */
    --wimbledon-secondary: #4e2683;
    --wimbledon-secondary-hover: #6430a8; /* lighter */
    --wimbledon-secondary-600: #4e2683;
    --wimbledon-hn-font-family: 'Gotham', 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --wimbledon-base-font-family: 'Gotham', 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --bbc-sunderland: #000;
    /* Primary (red) */
    --bbc-sunderland-primary: #FF003D;
    --bbc-sunderland-primary-600: #FF003D;
    --bbc-sunderland-primary-dark: #CC0030;
    /* Secondary (purple) */
    --bbc-sunderland-secondary: #401721;
    --bbc-sunderland-secondary-hover: #401732;
    --bbc-sunderland-secondary-600: #401721;
    --bbc-sunderland-hn-font-family: Poppins, sans-serif;
    --bbc-sunderland-base-font-family: Poppins, sans-serif;
    /* Primary (white) */
    --tcs-london-primary: #000000;
    --tcs-london-primary-600: #000033;
    --tcs-london-primary-dark: #000000;
    /* Secondary (black) */
    --tcs-london-secondary: #E00066;
    --tcs-london-secondary-hover: #E00066;
    --tcs-london-secondary-600: #E00066;
    --tcs-london-hn-font-family: Poppins, sans-serif;
    --tcs-london-base-font-family: Poppins, sans-serif;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, #order-total .line-item label, h5, .h5, h6, .h6 label {
    color: #333333;
    font-family: "Poppins", sans-serif;
    position: relative;
    padding-bottom: 15px;
    font-weight: 300;
}

h1, .h1 {
    line-height: 1.3em;
    padding-bottom: 0.5em;
    font-weight: 300;
}
@media screen and (min-width: 0) and (max-width: 599px) {
    h1, .h1 {
        font-size: 24px;
        font-size: 1.7142857143rem;
    }
}

h2, .h2 {
    font-size: 22px;
    font-size: 1.5714285714rem;
}
@media screen and (min-width: 600px) {
    h2, .h2 {
        font-size: 26px;
        font-size: 1.8571428571rem;
    }
}
@media screen and (min-width: 900px) {
    h2, .h2 {
        font-size: 30px;
        font-size: 2.1428571429rem;
    }
}

h3, .h3 {
    line-height: 1.4em;
    font-size: 20px;
    font-size: 1.4285714286rem;
}
@media screen and (min-width: 600px) {
    h3, .h3 {
        font-size: 26px;
        font-size: 1.8571428571rem;
    }
}
@media screen and (min-width: 900px) {
    h3, .h3 {
        font-size: 28px;
        font-size: 2rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 899px) {
    h4, .h4, #order-total .line-item label {
        font-size: 20px;
        font-size: 1.4285714286rem;
    }
}
@media screen and (min-width: 0) and (max-width: 599px) {
    h4, .h4, #order-total .line-item label {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}

h5, .h5 {
    font-family: "Noto Sans", sans-serif;
    font-weight: 700;
}
@media screen and (min-width: 0) and (max-width: 599px) {
    h5, .h5 {
        font-size: 14px;
        font-size: 1rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 899px) {
    h6, .h6 {
        font-size: 20px;
        font-size: 1.4285714286rem;
    }
}
@media screen and (min-width: 0) and (max-width: 599px) {
    h6, .h6 {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}

a:hover, a:active, a:focus {
    outline: none;
}

a {
    color: #4681b8;
    font-weight: 400;
    outline: none;
}
a:hover {
    color: #4681b8;
}

p {
    font-size: 14px;
    font-family: "Noto Sans", sans-serif;
    font-weight: 400;
    line-height: 22px;
}

p.primary {
    color: #4681b8;
}

.text-center, .ta-c {
    text-align: center;
}

.break {
    zoom: 1;
}
.break:before, .break:after {
    content: "";
    display: table;
}
.break:after {
    clear: both;
}

@media screen and (min-width: 900px) and (max-width: 119999px) {
    .desk-break {
        zoom: 1;
    }
    .desk-break:before, .desk-break:after {
        content: "";
        display: table;
    }
    .desk-break:after {
        clear: both;
    }
}

@media screen and (min-width: 600px) and (max-width: 899px) {
    .lap-break {
        zoom: 1;
    }
    .lap-break:before, .lap-break:after {
        content: "";
        display: table;
    }
    .lap-break:after {
        clear: both;
    }
}

@media screen and (min-width: 0) and (max-width: 599px) {
    .palm-break {
        zoom: 1;
    }
    .palm-break:before, .palm-break:after {
        content: "";
        display: table;
    }
    .palm-break:after {
        clear: both;
    }
}

.small-txt {
    color: #9B9B9B;
    font-size: 12px;
    font-size: 0.8571428571rem;
}

/* ==========================================================================
$   GENERAL SECTION STYLES
========================================================================== */
body {
    background: white;
    font-family: "Noto Sans", sans-serif, Arial, Helvetica, sans-serif;
    font-size: 14px;
    min-width: 320px;
}
body.noscroll {
    overflow: hidden;
}

blockquote > p {
    color: #9B9B9B;
    font-family: Georgia, serif;
    margin: 0;
    padding: 0;
}

blockquote p:before {
    content: open-quote;
}

blockquote p:after {
    content: close-quote;
}

blockquote {
    display: block;
    font-style: italic;
    font-weight: 100;
    margin: 0.5em;
    padding-left: 22px;
    position: relative;
}
blockquote:before {
    background: #4681b8;
    content: " ";
    height: 100%;
    left: 0;
    position: absolute;
    width: 2px;
}
blockquote p {
    font-weight: 300;
}

.fw {
    zoom: 1;
    width: 100%;
}
.fw:before, .fw:after {
    content: "";
    display: table;
}
.fw:after {
    clear: both;
}

.right-col, .left-col {
    display: block;
    width: 100%;
}
@media screen and (min-width: 600px) {
    .right-col, .left-col {
        display: inline-block;
        width: 50%;
    }
}

.colour-bg p, .primary-bg p, .colour-bg a, .primary-bg a, .colour-bg h6, .primary-bg h6, .colour-bg label, .primary-bg label {
    color: #ffffff;
}

.white-bg {
    background-color: #ffffff;
}
.white-bg p, .white-bg a {
    color: #9B9B9B;
}

.primary-bg {
    background-color: #4681b8;
}
.primary-bg h2, .primary-bg h3, .primary-bg p, .primary-bg a, .primary-bg h5, .primary-bg label, .primary-bg blockquote {
    color: #ffffff;
}
.primary-bg h2:after, .primary-bg .h2:after, .primary-bg h3:after, .primary-bg .h3:after {
    background-color: #ffffff;
}

.secondary-bg {
    background-color: #f1f1f2;
}

.tertiary-bg {
    background-color: #30355a;
}

.full-bg {
    background-position: right center;
    background-repeat: no-repeat;
    background-size: cover;
}

.close {
    display: inline-block;
    float: left;
    height: 35px;
    position: absolute;
    right: 2em;
    top: 2em;
    width: 35px;
    z-index: 5000;
}
@media screen and (min-width: 0) and (max-width: 599px) {
    .close {
        right: 1em;
        top: 1em;
        width: 30px;
    }
}
.close span {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background-color: #ffffff;
    display: block;
    height: 3px;
    margin-bottom: 3px;
    position: absolute;
    right: 0;
    top: 10px;
    width: 35px;
}
.close span:last-child {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.close:hover {
    cursor: pointer;
}

/* ==========================================================================
$   CONTENT SECTION STYLES
========================================================================== */
.centered {
    zoom: 1;
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1024px;
    position: relative;
    width: 100%;
}
.centered:before, .centered:after {
    content: "";
    display: table;
}
.centered:after {
    clear: both;
}

.content-wrapper {
    zoom: 1;
}
.content-wrapper:before, .content-wrapper:after {
    content: "";
    display: table;
}
.content-wrapper:after {
    clear: both;
}

.container {
    margin: 0 auto;
    max-width: 1440px;
    position: relative;
}

.container-inner {
    zoom: 1;
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1024px;
    width: 100%;
}
.container-inner:before, .container-inner:after {
    content: "";
    display: table;
}
.container-inner:after {
    clear: both;
}

.ta-j p, .ta-j, section.main .ta-j p {
    text-align: justify;
}

.-middle {
    left: 0;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translate(0px, -50%);
    -moz-transform: translate(0px, -50%);
    -ms-transform: translate(0px, -50%);
    -o-transform: translate(0px, -50%);
    transform: translate(0px, -50%);
}

.primary {
    color: #4681b8;
}

/*

HELPERS

*/
/*
 * Clearfix
 */
.clearfix,
.cf {
    zoom: 1;
}
.clearfix:before, .clearfix:after,
.cf:before,
.cf:after {
    content: "";
    display: table;
}
.clearfix:after,
.cf:after {
    clear: both;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */
.invisible {
    visibility: hidden;
}

.visible {
    display: block !important;
    visibility: visible;
}

/*
 * For menu toggling
 */
.is-closed {
    border: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    overflow: hidden;
    padding: 0 !important;
}

.is-open {
    height: auto;
    overflow: visible;
}

/*
 * Breakpoint based hiding
 */
.palm {
    display: none !important;
}

.lap {
    display: none !important;
}

.not-desk {
    display: none !important;
}

@media screen and (min-width: 0px) {
    .desk {
        display: none !important;
    }

    .not-desk {
        display: inherit !important;
    }

    .lap {
        display: none !important;
    }

    .not-lap {
        display: inherit !important;
    }

    .palm {
        display: inherit !important;
    }

    .not-palm {
        display: none !important;
    }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
    .desk {
        display: none !important;
    }

    .not-desk {
        display: inherit !important;
    }

    .lap {
        display: inherit !important;
    }

    .not-lap {
        display: none !important;
    }

    .palm {
        display: none !important;
    }

    .not-palm {
        display: inherit !important;
    }
}
@media screen and (min-width: 900px) {
    .desk {
        display: inherit !important;
    }

    .not-desk {
        display: none !important;
    }

    .lap {
        display: none !important;
    }

    .not-lap {
        display: inherit !important;
    }

    .palm {
        display: none !important;
    }

    .not-palm {
        display: inherit !important;
    }
}
/*
    * Overrides for emergency use only ;)
*/
.float--right, .fr {
    float: right !important;
}

.float--left, .fl {
    float: left !important;
}

.text--left {
    text-align: left !important;
}

.text--center {
    text-align: center !important;
}

.text--right {
    text-align: right !important;
}

.flush {
    margin: 0 !important;
}

.flush--top {
    margin-top: 0 !important;
}

.flush--right {
    margin-right: 0 !important;
}

.flush--bottom {
    margin-bottom: 0 !important;
}

.flush--left {
    margin-left: 0 !important;
}

.flush--ends {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.flush--sides {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.clear--both, .cb {
    clear: both !important;
}

/* OBJECTS */
/*
OBJECTS
- Media
- Buttons
- Icons
- Todo: Grid
- Todo: Nav
- Todo: Pagination
- Todo: Block List
- Todo: Sprite
*/
/*========================================
$ NAVS
========================================*/
.nav, .button-group, .nav--breadcrumb, .nav--tabbed, .nav--stacked, .nav--inline {
    zoom: 1;
    margin-left: 0;
    list-style: none;
}
.nav:before, .button-group:before, .nav--breadcrumb:before, .nav--tabbed:before, .nav--stacked:before, .nav--inline:before, .nav:after, .button-group:after, .nav--breadcrumb:after, .nav--tabbed:after, .nav--stacked:after, .nav--inline:after {
    content: "";
    display: table;
}
.nav:after, .button-group:after, .nav--breadcrumb:after, .nav--tabbed:after, .nav--stacked:after, .nav--inline:after {
    clear: both;
}
.nav > li, .button-group > li, .nav--breadcrumb > li, .nav--tabbed > li, .nav--stacked > li, .nav--inline > li {
    float: left;
}
.nav > li + li, .button-group > li + li, .nav--breadcrumb > li + li, .nav--tabbed > li + li, .nav--stacked > li + li, .nav--inline > li + li {
    margin-left: 22px;
}
.nav > li > a, .button-group > li > a, .nav--breadcrumb > li > a, .nav--tabbed > li > a, .nav--stacked > li > a, .nav--inline > li > a {
    display: inline-block;
}
.nav > li.active > a, .button-group > li.active > a, .nav--breadcrumb > li.active > a, .nav--tabbed > li.active > a, .nav--stacked > li.active > a, .nav--inline > li.active > a {
    cursor: default;
}

.nav--inline > li {
    float: none;
    display: inline-block;
}

.nav--stacked > li {
    float: none;
    display: block;
    margin: 0;
}
.nav--stacked > li + li {
    margin-left: 0;
}
.nav--stacked > li > a {
    display: block;
}

.nav--tabbed {
    margin-bottom: 22px;
    border-bottom: 1px solid #cccccc;
}
.nav--tabbed > li {
    margin-bottom: -1px;
}
.nav--tabbed > li + li {
    margin-left: 11px;
}
.nav--tabbed > li > a {
    border: 1px solid #cccccc;
    border-bottom: none;
    padding: 10px;
    border-radius: 9px 9px 0 0;
    background: #f2f2f2;
    font-weight: bold;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
}
.nav--tabbed > li.active > a {
    border-bottom: 1px solid white;
    background: none;
    color: inherit;
}

.tabbed--full {
    text-align: center;
}
.tabbed--full > li + li {
    margin-left: 0;
}
.tabbed--full > li > a {
    display: block;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}
.tabbed--full > li:first-child > a {
    -webkit-border-radius: 9px 0 0 0;
    -moz-border-radius: 9px 0 0 0;
    -ms-border-radius: 9px 0 0 0;
    -o-border-radius: 9px 0 0 0;
    border-radius: 9px 0 0 0;
}
.tabbed--full > li:last-child > a {
    -webkit-border-radius: 0 9px 0 0;
    -moz-border-radius: 0 9px 0 0;
    -ms-border-radius: 0 9px 0 0;
    -o-border-radius: 0 9px 0 0;
    border-radius: 0 9px 0 0;
}

.tabbed-2 > li {
    width: 50%;
}

.tabbed-3 > li {
    width: 33.33333%;
}

.tabbed-4 > li {
    width: 25%;
}

.tab__body {
    zoom: 1;
    margin-bottom: 22px;
}
.tab__body:before, .tab__body:after {
    content: "";
    display: table;
}
.tab__body:after {
    clear: both;
}
.tab__body > :last-child {
    margin-bottom: 0;
}

.nav--breadcrumb > li + li {
    margin-left: 5.5px;
}
.nav--breadcrumb > li + li:before {
    content: "→";
    display: inline-block;
    margin-right: 5.5px;
}
@media screen and (max-width: 599px) {
    .nav--breadcrumb > li {
        display: none;
    }
    .nav--breadcrumb > li:nth-last-child(2) {
        display: block;
        float: none;
    }
    .nav--breadcrumb > li a {
        display: block;
    }
    .nav--breadcrumb > li + li {
        margin-left: 0;
    }
    .nav--breadcrumb > li + li:before {
        content: "←";
        float: left;
    }
}

/*========================================
$ FLYOUT
========================================*/
.flyout,
.flyout--rev,
.flyout--alt {
    position: relative;
}
.flyout__body {
    position: absolute;
    top: 100%;
    left: -9999px;
    z-index: 1;
    border: 1px solid #cccccc;
    background: white;
    white-space: nowrap;
}
.flyout__body li {
    float: none;
    display: block;
}

.flyout:hover > .flyout__body {
    left: 0;
}

.flyout--rev:hover > .flyout__body {
    left: auto;
    right: 0;
}

.flyout--alt:hover > .flyout__body {
    left: 0;
    top: auto;
    bottom: 100%;
}

/*========================================
$ MEDIA
========================================*/
.media {
    zoom: 1;
    display: block;
}
.media:before, .media:after {
    content: "";
    display: table;
}
.media:after {
    clear: both;
}

.media > a {
    display: block;
}

.media__img {
    float: left;
    margin-right: 22px;
}

.media__img--rev {
    float: right;
    margin-left: 22px;
}

.media__img img,
.media__img--rev img {
    display: block;
}

.media__body {
    overflow: hidden;
}

.media__body,
.media__body > :last-child {
    margin-bottom: 0;
}

/*========================================
$ PANEL
========================================*/
.panel, .notice {
    margin-bottom: 22px;
    padding: 22px;
    background: white;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.panel > :first-child, .notice > :first-child {
    /*padding-top: 0;*/
}
.panel .full, .notice .full {
    margin-right: -22px;
    margin-left: -22px;
}

.panel__title {
    margin: -22px -22px 22px;
    border-bottom: 1px solid #cccccc;
    padding: 22px;
    font-size: 28px;
    font-size: 2rem;
    line-height: 1;
}
.panel__title + * {
    padding-top: 0;
}

.panel__body > :last-child {
    margin-bottom: 0;
}

.panel__footer {
    margin: 22px -22px -22px;
    border-top: 1px solid #F6F7F8;
    padding: 22px;
    background: #f2f2f2;
}

.panel--bordered, .notice, .panel--cta {
    border: 1px solid #cccccc;
    padding: 21px;
}
.panel--bordered .full, .notice .full, .panel--cta .full {
    margin-right: -21px;
    margin-left: -21px;
}
.panel--bordered .panel__title, .notice .panel__title, .panel--cta .panel__title {
    margin: -21px -21px 22px;
}
.panel--bordered .panel__footer, .notice .panel__footer, .panel--cta .panel__footer {
    margin: 22px -21px -21px;
}

.panel--cta {
    border-color: #4681b8;
    background: #f2f2f2;
}
.panel--cta .panel__title {
    border-bottom: 0;
    background: #4681b8;
    color: white;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
}
.panel--cta hr {
    border-color: #cccccc;
}

/*========================================
$ NOTICE
========================================*/
.notice {
    padding-top: 11px;
    padding-bottom: 11px;
}
.notice > :first-child {
    padding-top: 0;
}
.notice > :last-child {
    margin-bottom: 0;
}

.notice--alert {
    background: white;
    border-color: #ff9d1a;
}
.notice--alert .panel__title {
    border-color: #ff9d1a;
}

.notice--success {
    background: white;
    border-color: #4681b8;
}
.notice--success .panel__title {
    border-color: #4681b8;
}

.notice--failure {
    background: white;
    border-color: #e01d2a;
}
.notice--failure .panel__title {
    border-color: #e01d2a;
}

/*========================================
$ MODAL
========================================*/
.modal {
    display: none;
    position: fixed;
    left: 11px;
    right: 11px;
    top: 11px;
    z-index: 21;
    padding: 22px;
    height: auto;
    background: #fff;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    -ms-border-radius: 9px;
    -o-border-radius: 9px;
    border-radius: 9px;
}
@media screen and (min-width: 600px) {
    .modal {
        left: 50%;
        right: auto;
        top: 10%;
        margin-left: -240px;
        width: 480px;
    }
}
.modal > :last-child {
    margin-bottom: 0;
}

@media screen and (min-width: 900px) {
    .modal--large {
        margin-left: -450px;
        width: 900px;
    }
}

.modal__close {
    position: absolute;
    top: 11px;
    right: 11px;
    width: 22px;
    height: 22px;
    text-align: center;
}

.modal__title {
    margin-bottom: 22px;
    border-bottom: 1px solid #cccccc;
    padding-top: 0;
    padding-bottom: 11px;
}

.modal-bg {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    background: #000;
    background: rgba(0, 0, 0, 0.75);
}

/*========================================
$ TOOLTIP
========================================*/
.tooltip:before {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 10px;
    display: inline-block;
    border-color: #cccccc transparent;
    border-style: solid;
    border-width: 7px 7px 0;
}

.tooltip:after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 10px;
    display: inline-block;
    border-color: white transparent;
    border-style: solid;
    border-width: 7px 7px 0;
}

/*========================================
$ BUTTONS
========================================*/
.button-bar {
    zoom: 1;
}
.button-bar:before, .button-bar:after {
    content: "";
    display: table;
}
.button-bar:after {
    clear: both;
}
.button-bar .button-group {
    float: left;
    margin-right: 11px;
    margin-bottom: 0;
}

.button-group {
    white-space: nowrap;
}
.button-group > li + li {
    margin-left: -1px;
}
.button-group .button {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}
.button-group > li:first-child .button {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.button-group > li:last-child .button {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

/*========================================
$ ICONS
========================================*/
.stat {
    color: #818181;
    text-align: right;
}

.stat__count {
    font-size: 30px;
    font-size: 2.1428571429rem;
}

.stat__title {
    display: block;
    font-size: 11px;
    font-size: 0.7857142857rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/*========================================
$ ICONS
========================================*/
[class^=icon-] span, [class*=" icon-"] span {
    position: absolute;
    left: -9999px;
}

/*========================================
$ GRID
========================================*/
.wrapper {
    clear: both;
    width: 100%;
}

.grid {
    zoom: 1;
    margin-left: -4%;
}
.grid:before, .grid:after {
    content: "";
    display: table;
}
.grid:after {
    clear: both;
}
@media screen and (min-width: 900px) {
    .grid {
        margin-left: -2%;
    }
}

.grid--padded-top, .grid--padded {
    padding-top: 22px;
}

.grid--padded-bottom, .grid--padded {
    padding-bottom: 22px;
}

[class*=span],
.grid__cell {
    position: relative;
    float: left;
    display: inline;
    padding-left: 4%;
    width: 100%;
    min-height: 1px;
}
@media screen and (min-width: 900px) {
    [class*=span],
    .grid__cell {
        padding-left: 2%;
    }
}

@media screen and (max-width: 599px) {
    .palm-4-1 {
        width: 25%;
    }

    .palm-4-2 {
        width: 50%;
    }

    .palm-4-3 {
        width: 75%;
    }

    .palm-4-4 {
        width: 100%;
    }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
    .lap-4-1 {
        width: 25%;
    }

    .lap-4-2 {
        width: 50%;
    }

    .lap-4-3 {
        width: 75%;
    }

    .lap-4-4 {
        width: 100%;
    }

    .lap-5-1 {
        width: 20%;
    }

    .lap-5-2 {
        width: 40%;
    }

    .lap-5-3 {
        width: 60%;
    }

    .lap-5-4 {
        width: 80%;
    }

    .lap-5-5 {
        width: 100%;
    }
}
@media screen and (min-width: 900px) {
    .desk-6-1 {
        width: 16.6666666667%;
    }

    .desk-6-2 {
        width: 33.3333333333%;
    }

    .desk-6-3 {
        width: 50%;
    }

    .desk-6-4 {
        width: 66.6666666667%;
    }

    .desk-6-5 {
        width: 83.3333333333%;
    }

    .desk-6-6 {
        width: 100%;
    }

    .desk-8-1 {
        width: 12.5%;
    }

    .desk-8-2 {
        width: 25%;
    }

    .desk-8-3 {
        width: 37.5%;
    }

    .desk-8-4 {
        width: 50%;
    }

    .desk-8-5 {
        width: 62.5%;
    }

    .desk-8-6 {
        width: 75%;
    }

    .desk-8-7 {
        width: 87.5%;
    }

    .desk-8-8 {
        width: 100%;
    }
}
/* THEME */
/* ====== BASE STYLES ====== */
/* ======
BASE STYLES
	- TYPOGRAPHY STYLES
	- GENERAL SECTION STYLES
	- CONTENT SECTION STYLES
====== */
/* ==========================================================================
$	TYPOGRAPHY STYLES
========================================================================== */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, #order-total .line-item label, h5, .h5, h6, .h6 label {
    color: #2c3256;
    font-family: "Poppins", sans-serif;
    position: relative;
    padding-bottom: 15px;
    letter-spacing: 0.07rem;
}

h1, .h1 {
    font-size: 24px;
    font-size: 1.7142857143rem;
    color: #2c3256;
    font-weight: 800;
    line-height: 1.3em;
    padding-bottom: 0.5em;
}
@media screen and (min-width: 600px) {
    h1, .h1 {
        font-size: 30px;
        font-size: 2.1428571429rem;
    }
}
@media screen and (min-width: 900px) {
    h1, .h1 {
        font-size: 40px;
        font-size: 2.8571428571rem;
    }
}

h2, .h2 {
    color: #2c3256;
    font-weight: 800;
    font-size: 22px;
    font-size: 1.5714285714rem;
}
@media screen and (min-width: 600px) {
    h2, .h2 {
        font-size: 26px;
        font-size: 1.8571428571rem;
    }
}
@media screen and (min-width: 900px) {
    h2, .h2 {
        font-size: 30px;
        font-size: 2.1428571429rem;
    }
}

h3, .h3 {
    color: #2c3256;
    line-height: 1.4em;
    font-size: 20px;
    font-size: 1.4285714286rem;
}
@media screen and (min-width: 600px) {
    h3, .h3 {
        font-size: 26px;
        font-size: 1.8571428571rem;
    }
}
@media screen and (min-width: 900px) {
    h3, .h3 {
        font-size: 28px;
        font-size: 2rem;
    }
}

h4, .h4, #order-total .line-item label {
    color: #2c3256;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    font-size: 1.1428571429rem;
}
@media screen and (min-width: 600px) {
    h4, .h4, #order-total .line-item label {
        font-size: 20px;
        font-size: 1.4285714286rem;
    }
}
@media screen and (min-width: 900px) {
    h4, .h4, #order-total .line-item label {
        font-size: 22px;
        font-size: 1.5714285714rem;
    }
}

h5, .h5 {
    color: #2c3256;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 14px;
}
@media screen and (min-width: 600px) {
    h5, .h5 {
        font-size: 16px;
    }
}
@media screen and (min-width: 900px) {
    h5, .h5 {
        font-size: 18px;
    }
}

@media screen and (min-width: 600px) and (max-width: 899px) {
    h6, .h6 {
        font-size: 20px;
        font-size: 1.4285714286rem;
    }
}
@media screen and (min-width: 0) and (max-width: 599px) {
    h6, .h6 {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}

a:hover, a:active, a:focus {
    outline: none;
}

/* Focus styles for accessibility */
a:focus-visible {
    outline: 2px solid #1a73e8;
    outline-offset: 2px;
}

a {
    color: #4681b8;
    font-weight: 400;
    outline: none;
}
a:hover {
    color: #4681b8;
    cursor: pointer;
}

p {
    font-size: 13px;
    font-family: "Noto Sans", sans-serif;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 10px;
}
@media screen and (min-width: 600px) {
    p {
        font-size: 14px;
    }
}
p a {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    color: #ffffff;
    padding: 0 0.25em;
    position: relative;
    display: inline-block;
    outline: none;
    vertical-align: bottom;
    text-decoration: none;
    white-space: nowrap;
}
p a:hover {
    color: #ffffff;
}

p.primary {
    color: #4681b8;
}

.text-center, .ta-c {
    text-align: center;
}

.break {
    zoom: 1;
}
.break:before, .break:after {
    content: "";
    display: table;
}
.break:after {
    clear: both;
}

@media screen and (min-width: 900px) and (max-width: 119999px) {
    .desk-break {
        zoom: 1;
    }
    .desk-break:before, .desk-break:after {
        content: "";
        display: table;
    }
    .desk-break:after {
        clear: both;
    }
}

@media screen and (min-width: 600px) and (max-width: 899px) {
    .lap-break {
        zoom: 1;
    }
    .lap-break:before, .lap-break:after {
        content: "";
        display: table;
    }
    .lap-break:after {
        clear: both;
    }
}

@media screen and (min-width: 0) and (max-width: 599px) {
    .palm-break {
        zoom: 1;
    }
    .palm-break:before, .palm-break:after {
        content: "";
        display: table;
    }
    .palm-break:after {
        clear: both;
    }
}

.small-txt {
    color: #9B9B9B;
    font-size: 12px;
    font-size: 0.8571428571rem;
}

/* ==========================================================================
$	GENERAL SECTION STYLES
========================================================================== */
html {
    position: relative;
}

body {
    background-color: #F4F4F4;
    font-family: "Noto Sans", sans-serif, Arial, Helvetica, sans-serif;
    font-size: 13px;
    min-width: 320px;
}
@media screen and (min-width: 600px) {
    body {
        font-size: 14px;
    }
}
body.noscroll {
    overflow: hidden;
}

blockquote > p {
    color: #9B9B9B;
    font-family: Georgia, serif;
    margin: 0;
    padding: 0;
}

blockquote p:before {
    content: open-quote;
}

blockquote p:after {
    content: close-quote;
}

blockquote {
    display: block;
    font-style: italic;
    font-weight: 100;
    margin: 0.5em;
    padding-left: 22px;
    position: relative;
}
blockquote:before {
    background: #4681b8;
    content: " ";
    height: 100%;
    left: 0;
    position: absolute;
    width: 2px;
}
blockquote p {
    font-weight: 300;
}

.fw {
    zoom: 1;
    width: 100%;
}
.fw:before, .fw:after {
    content: "";
    display: table;
}
.fw:after {
    clear: both;
}

.right-col {
    width: 50%;
}
@media screen and (min-width: 600px) {
    .right-col {
        float: right;
    }
}

.left-col {
    width: 50%;
}
@media screen and (min-width: 600px) {
    .left-col {
        float: left;
    }
}

.right-col, .left-col {
    display: inline-block;
}
@media screen and (min-width: 0) and (max-width: 599px) {
    .right-col, .left-col {
        width: 100%;
    }
}

.colour-bg p, .primary-bg p, .colour-bg a, .primary-bg a, .colour-bg h6, .primary-bg h6, .colour-bg label, .primary-bg label {
    color: #ffffff;
}

.white-bg {
    background-color: #ffffff;
}
.white-bg p, .white-bg a {
    color: #9B9B9B;
}

.primary-bg {
    background-color: #4681b8;
}
.primary-bg h2, .primary-bg h3, .primary-bg p, .primary-bg a, .primary-bg h5, .primary-bg label, .primary-bg blockquote {
    color: #ffffff;
}
.primary-bg h2:after, .primary-bg .h2:after, .primary-bg h3:after, .primary-bg .h3:after {
    background-color: #ffffff;
}

.secondary-bg {
    background-color: #f1f1f2;
}

.tertiary-bg {
    background-color: #30355a;
}

.full-bg {
    background-position: right center;
    background-repeat: no-repeat;
    background-size: cover;
}

.close {
    display: inline-block;
    float: left;
    height: 35px;
    position: absolute;
    right: 2em;
    top: 2em;
    width: 35px;
    z-index: 5000;
}
@media screen and (min-width: 0) and (max-width: 599px) {
    .close {
        right: 1em;
        top: 1em;
        width: 30px;
    }
}
.close span {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background-color: #ffffff;
    display: block;
    height: 3px;
    margin-bottom: 3px;
    position: absolute;
    right: 0;
    top: 10px;
    width: 35px;
}
.close span:last-child {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.close:hover {
    cursor: pointer;
}

/* ==========================================================================
$	CONTENT SECTION STYLES
========================================================================== */
.centered {
    zoom: 1;
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1024px;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
}
.centered:before, .centered:after {
    content: "";
    display: table;
}
.centered:after {
    clear: both;
}
@media screen and (min-width: 768px) {
    .centered {
        padding-left: 2em;
        padding-right: 2em;
    }
}
@media screen and (min-width: 1060px) {
    .centered {
        padding-left: 0;
        padding-right: 0;
    }
}

.content-wrapper {
    zoom: 1;
}
.content-wrapper:before, .content-wrapper:after {
    content: "";
    display: table;
}
.content-wrapper:after {
    clear: both;
}

.container {
    margin: 0 auto;
    position: relative;
}

.container-inner {
    zoom: 1;
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 1024px;
    width: 100%;
}
.container-inner:before, .container-inner:after {
    content: "";
    display: table;
}
.container-inner:after {
    clear: both;
}

.ta-j p, .ta-j, section.main .ta-j p {
    text-align: justify;
}

.sub_title {
    font-size: 18px;
    font-size: 1.2857142857rem;
    font-family: "Poppins", sans-serif;
    font-style: italic;
    margin-bottom: 1em;
}

hr {
    border-top: 1px dashed #2c3256;
    border-bottom: none;
    margin-bottom: 10px;
    margin-top: 10px;
}

.u-screen-reader {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.u-hide {
    display: none !important;
}

.title_holder {
    width: 100%;
    padding-bottom: 0.5em;
}
@media screen and (min-width: 600px) {
    .title_holder {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}
.title_holder h1, .title_holder h2 {
    margin: 0;
    padding: 0;
}
.title_holder a, .title_holder input[type=submit] {
    width: auto;
    margin-top: 10px;
    font-size: 12px;
    font-size: 0.8571428571rem;
}
@media screen and (min-width: 600px) {
    .title_holder a, .title_holder input[type=submit] {
        font-size: 16px;
        font-size: 1.1428571429rem;
        margin-top: 0;
    }
}

.accessible,
.bg-accessible {
    background-color: #13a9ff;
    color: #ffffff;
}

/* ====== BUTTONS ====== */
/* ======
BUTTONS
	- BASE STYLES
	- PRIMARY BUTTON
	- SECONDARY BUTTON
	- TERTIARY BUTTON
	- GHOST BUTTON
	- FORM BUTTON
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
.actions {
    zoom: 1;
    clear: both;
    display: block;
    margin-top: 20px;
}
.actions:before, .actions:after {
    content: "";
    display: table;
}
.actions:after {
    clear: both;
}

.btn, .ghost-btn, .tertiary-btn, .secondary-btn,
form input[type=submit].secondary-btn,
form input.secondary-btn, .primary-btn, .button,
input[type=primary-btn],
input[type=submit].primary-btn, input[type=submit].secondary-btn, .btn-primary {
    -webkit-transition: opacity 0.25s ease-in-out;
    -moz-transition: opacity 0.25s ease-in-out;
    -ms-transition: opacity 0.25s ease-in-out;
    -o-transition: opacity 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out;
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    box-shadow: none;
    color: #ffffff;
    display: inline-block;
    opacity: 1;
    font-weight: 700;
    padding: 10px 20px;
    text-align: center;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
@media screen and (min-width: 900px) {
    .btn, .ghost-btn, .tertiary-btn, .secondary-btn,
    form input[type=submit].secondary-btn,
    form input.secondary-btn, .primary-btn, .button,
    input[type=primary-btn],
    input[type=submit].primary-btn, input[type=submit].secondary-btn, .btn-primary {
        padding: 12px 25px;
    }
}
.btn a, .ghost-btn a, .tertiary-btn a, .secondary-btn a,
form input.secondary-btn a, .primary-btn a, .button a,
input[type=primary-btn] a,
input[type=submit].primary-btn a, input[type=submit].secondary-btn a, .btn-primary a {
    color: #ffffff;
}
.btn svg, .ghost-btn svg, .tertiary-btn svg, .secondary-btn svg,
form input.secondary-btn svg, .primary-btn svg, .button svg,
input[type=primary-btn] svg,
input[type=submit].primary-btn svg, input[type=submit].secondary-btn svg, .btn-primary svg {
    display: none;
}
.btn:hover, .ghost-btn:hover, .tertiary-btn:hover, .secondary-btn:hover, .primary-btn:hover, .button:hover,
input[type=primary-btn]:hover,
input[type=submit].primary-btn:hover, input[type=submit].secondary-btn:hover, .btn-primary:hover {
    color: #ffffff;
    opacity: 0.92;
}
.btn:hover a, .ghost-btn:hover a, .tertiary-btn:hover a, .secondary-btn:hover a,
form input[type=submit].secondary-btn:hover a, .primary-btn:hover a, .button:hover a,
input[type=primary-btn]:hover a, .btn-primary:hover a {
    color: #ffffff;
    text-decoration: none;
}

.button,
input[type=primary-btn],
input[type=submit].primary-btn,
input[type=submit].button,
input[type=submit][type=primary-btn], input[type=submit].secondary-btn {
    -webkit-transition: background 0.2s;
    -moz-transition: background 0.2s;
    -ms-transition: background 0.2s;
    -o-transition: background 0.2s;
    transition: background 0.2s;
    display: inline-block;
    text-decoration: none;
    border: none;
}

button[disabled].button,
input[type=primary-btn][disabled],
input[type=submit][disabled].primary-btn, input[disabled].secondary-btn, input[disabled] {
    opacity: 0.5;
}

button[disabled].button:hover,
input[type=primary-btn][disabled]:hover,
input[type=submit][disabled].primary-btn:hover, input[disabled].secondary-btn:hover, input[disabled]:hover {
    background-color: inherit;
    cursor: hand;
}

button[disabled].button:hover,
input[type=primary-btn][disabled]:hover,
input[type=submit][disabled].primary-btn:hover,
input[type=submit][disabled].button:hover,
input[type=submit][disabled].secondary-btn:hover {
    background-color: #4681b8;
}

button[disabled].button:hover,
input[type=secondary-btn][disabled]:hover,
input[type=submit][disabled].secondary-btn:hover {
    background-color: #f1f1f2;
}

/* ==========================================================================
$	PRIMARY BUTTON
========================================================================== */
.primary-btn, .button,
input[type=primary-btn],
input[type=submit].primary-btn, input[type=submit].secondary-btn, .btn-primary {
    -webkit-transition: background 0.2s;
    -moz-transition: background 0.2s;
    -ms-transition: background 0.2s;
    -o-transition: background 0.2s;
    transition: background 0.2s;
    background: #4681b8;
    border: 1px solid #4681b8;
    display: inline-block;
    outline: none;
    position: relative;
    text-decoration: none;
    vertical-align: bottom;
    white-space: nowrap;
    overflow-y: hidden;
}
.primary-btn:hover, .button:hover,
input[type=primary-btn]:hover,
input[type=submit].primary-btn:hover, input[type=submit].secondary-btn:hover, .btn-primary:hover {
    color: #4681b8;
    background: none;
}

/* ==========================================================================
$	SECONDARY BUTTONS
========================================================================== */
.secondary-btn,
form input[type=submit].secondary-btn,
form input.secondary-btn {
    -webkit-transition: background 0.2s;
    -moz-transition: background 0.2s;
    -ms-transition: background 0.2s;
    -o-transition: background 0.2s;
    transition: background 0.2s;
    background: none;
    border: 1px solid #4681b8;
    color: #4681b8;
    display: inline-block;
    outline: none;
    position: relative;
    text-decoration: none;
}
.secondary-btn:hover,
form input[type=submit].secondary-btn:hover,
form input.secondary-btn:hover {
    color: #ffffff;
    background: #4681b8;
}

/* ==========================================================================
$	TERTIARY BUTTONS
========================================================================== */
.tertiary-btn {
    background-color: #30355a;
}
.tertiary-btn:hover {
    background-color: #4681b8;
    text-decoration: none;
}

/* ==========================================================================
$	GHOST BUTTONS
========================================================================== */
.ghost-btn {
    -webkit-transition: background 0.25s ease-in-out;
    -moz-transition: background 0.25s ease-in-out;
    -ms-transition: background 0.25s ease-in-out;
    -o-transition: background 0.25s ease-in-out;
    transition: background 0.25s ease-in-out;
    background: none;
    border: 1px solid #ffffff;
}
.ghost-btn:hover {
    background-color: #ffffff;
    color: #4681b8;
    text-decoration: none;
}

/* ==========================================================================
$	FORM BUTTONS
========================================================================== */
.action-holder {
    margin-bottom: 2em;
    margin-top: 2em;
}

.personal_details .primary-btn, .personal_details .button,
.personal_details input[type=primary-btn],
.personal_details input[type=submit].primary-btn, .personal_details input[type=submit].secondary-btn, .anpr_details .primary-btn, .anpr_details .button,
.anpr_details input[type=primary-btn],
.anpr_details input[type=submit].primary-btn, .anpr_details input[type=submit].secondary-btn, .input-group.actions .primary-btn, .input-group.actions .button,
.input-group.actions input[type=primary-btn], .input-group.actions input[type=submit].secondary-btn {
    display: block;
    width: auto;
    margin: 0 auto;
    float: right;
}

@media screen and (max-width: 599px) {
    .logout.action a {
        font-size: 12px;
        font-size: 0.8571428571rem;
        padding: 10px 35px;
    }
}

@media screen and (max-width: 599px) {
    .modalPopup .primary-btn, .modalPopup .button,
    .modalPopup input[type=primary-btn],
    .modalPopup input[type=submit].primary-btn, .modalPopup input[type=submit].secondary-btn, .modalPopup .secondary-btn {
        width: auto;
    }
}

.edit-btn {
    color: #2c3256;
    text-decoration: underline;
}

.delete-btn {
    background-position: 0 0;
    background-image: url(img/trash.png);
    background-repeat: no-repeat;
    background-size: 15px;
    width: 20px;
    overflow: hidden;
    text-indent: -9999px;
    position: absolute;
    right: 7px;
    bottom: 13px;
    height: 20px;
}
.delete-btn:hover {
    background-position: 0 -24px;
}

#paymentform .primary-btn, #paymentform .button,
#paymentform input[type=primary-btn], #paymentform input[type=submit].secondary-btn, .padlock-btn {
    background-position: calc(100% - 17px) center;
    background-repeat: no-repeat;
    background-image: url(img/padlock.png);
    background-size: 23px;
    padding-right: 50px;
    float: none;
}
@media screen and (min-width: 600px) {
    #paymentform .primary-btn, #paymentform .button,
    #paymentform input[type=primary-btn], #paymentform input[type=submit].secondary-btn, .padlock-btn {
        float: right;
    }
    #paymentform .primary-btn:hover, #paymentform .button:hover,
    #paymentform input[type=primary-btn]:hover, #paymentform input[type=submit].secondary-btn:hover, .padlock-btn:hover {
        background-image: url(img/padlock-primary.png);
    }
}

#divaddbasketitems .action .back-btn {
    float: left;
    padding: 10px 20px !important;
}

.paypal-btn {
    background: #ffc439;
    border-color: #ffc439;
}
.paypal-btn:before {
    content: "";
    display: inline-block;
    background-image: url(/Content/img/pp-logo-150px.png);
    width: 126px;
    height: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ====== FOOTER ====== */
/* ======
FOOTER
	- BASE STYLES
	- MOBILE MENU
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
footer.bottom {
    background-color: #30355a;
    padding-bottom: 2em;
    padding-top: 3em;
    position: relative;
    font-size: 15px;
    color: #ffffff;
    text-align: center;
}
footer.bottom .copyright {
    float: right;
}
footer.bottom address {
    font-style: normal;
}
footer.bottom .build-by {
    font-size: 10px;
    margin-top: 20px;
}
footer.bottom .build-by a {
    font-size: 10px;
}
footer.bottom #footerContact {
    margin-top: 20px;
}
footer.bottom #footerContact a:first-child {
    margin-right: 10px;
}
footer.bottom strong {
    display: block;
    margin-bottom: 5px;
}
footer.bottom a {
    color: white;
    font-size: 16px;
    padding-bottom: 10px;
    padding-top: 10px;
}
footer.bottom nav {
    margin-bottom: 20px;
}
footer.bottom nav ul {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
footer.bottom nav li {
    list-style: none;
    margin-bottom: 5px;
}
footer.bottom nav li a {
    padding-left: 10px;
    padding-right: 10px;
}
footer.bottom nav li:first-child a {
    padding-left: 0;
}
footer.bottom .right-col, footer.bottom .left-col {
    text-align: center;
    margin-top: 20px;
    display: block;
    width: 100%;
}
footer.bottom #footerContact {
    margin-top: 20px;
}
footer.bottom #footerContact strong {
    display: block;
}
footer.bottom a {
    color: white;
    text-decoration: none;
}
footer.bottom h5 {
    color: white;
    font-size: 16px;
}

.site-footer {
    background: #fff;
    color: #1a1a1a;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

.footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 20px 28px;
}

.footer-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 56px;
    /* gives the airy top spacing like the screenshot */
    /* Responsive */
}
@media (max-width: 768px) {
    .footer-top {
        align-items: flex-start;
    }
    .footer-top .social-nav ul {
        gap: 14px;
    }
    .footer-top .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

/* Brand area */
.brand-group {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}

.brand-group img {
    display: block;
    height: auto;
    filter: none;
    width: 52px;
}

.brand-divider {
    width: 1px;
    height: 24px;
    background: #e7e7e7;
}

.footer-sep {
    border: 0;
    border-top: 1px solid #e7e7e7;
    margin: 14px 0 18px;
}

/* Bottom row */
.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.copyright {
    margin: 0;
    color: #6e6e6e;
}

.footer-links {
    display: inline-flex;
    gap: 22px;
}
.footer-links a {
    color: #0a5a38;
    text-decoration: none;
    font-weight: 500;
}
.footer-links a:focus-visible, .footer-links a:hover {
    text-decoration: underline;
    outline: none;
}

/* ====== HEADER ====== */
/* ======
HEADER
	- BASE STYLES
	- MOBILE MENU
	- BASKET
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
header.top {
    background-color: #ffffff;
    height: 70px;
    padding: 1em 0 1em 0;
    width: 100%;
}
@media screen and (min-width: 600px) {
    header.top {
        height: 85px;
        padding: 1em 0 1em 0;
    }
}
header.top .centered {
    position: relative;
    vertical-align: middle;
}
@media screen and (min-width: 600px) {
    header.top .centered {
        padding-left: 2em;
        padding-right: 2em;
    }
}
header.top .logo {
    background-image: url(/Content/img/Park-live-dark.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    height: 38px;
    display: block;
    width: 130px;
}
@media screen and (min-width: 600px) {
    header.top .logo {
        width: 160px;
        height: 50px;
    }
}
@media screen and (min-width: 900px) {
    header.top .logo {
        height: 70px;
        display: inline-block;
        vertical-align: middle;
        width: 200px;
    }
}
header.top .logout.action {
    display: none;
}
@media screen and (min-width: 900px) {
    header.top .logout.action {
        display: block;
        position: absolute;
        right: 1em;
        top: 0;
    }
}

#theMenuDiv {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #4681b8;
    z-index: 100;
}
.nav-is-visible #theMenuDiv {
    display: block;
}
@media screen and (min-width: 900px) {
    #theMenuDiv {
        display: inline-block;
        position: relative;
        background: none;
        vertical-align: middle;
        margin-left: 3em;
        width: auto;
    }
}
#theMenuDiv ul.nav, #theMenuDiv ul.nav--inline, #theMenuDiv ul.nav--stacked, #theMenuDiv ul.nav--tabbed, #theMenuDiv ul.nav--breadcrumb, #theMenuDiv ul.button-group {
    display: table;
    text-align: center;
    margin: 0 auto;
    margin-top: 50px;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav, #theMenuDiv ul.nav--inline, #theMenuDiv ul.nav--stacked, #theMenuDiv ul.nav--tabbed, #theMenuDiv ul.nav--breadcrumb, #theMenuDiv ul.button-group {
        display: block;
        text-align: left;
        margin: 0;
    }
}
#theMenuDiv ul.nav > li, #theMenuDiv ul.nav--inline > li, #theMenuDiv ul.nav--stacked > li, #theMenuDiv ul.nav--tabbed > li, #theMenuDiv ul.nav--breadcrumb > li, #theMenuDiv ul.button-group > li {
    display: block;
    float: none;
    text-align: center;
    margin: 0;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav > li, #theMenuDiv ul.nav--inline > li, #theMenuDiv ul.nav--stacked > li, #theMenuDiv ul.nav--tabbed > li, #theMenuDiv ul.nav--breadcrumb > li, #theMenuDiv ul.button-group > li {
        display: inline-block;
        vertical-align: middle;
        text-align: left;
        position: relative;
        margin-left: 15px;
        padding: 0 10px 5px 10px;
    }
}
#theMenuDiv ul.nav > li:first-child, #theMenuDiv ul.nav--inline > li:first-child, #theMenuDiv ul.nav--stacked > li:first-child, #theMenuDiv ul.nav--tabbed > li:first-child, #theMenuDiv ul.nav--breadcrumb > li:first-child, #theMenuDiv ul.button-group > li:first-child {
    margin-left: 0;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav > li.logout, #theMenuDiv ul.nav--inline > li.logout, #theMenuDiv ul.nav--stacked > li.logout, #theMenuDiv ul.nav--tabbed > li.logout, #theMenuDiv ul.nav--breadcrumb > li.logout, #theMenuDiv ul.button-group > li.logout {
        display: none;
    }
}
#theMenuDiv ul.nav > li > a, #theMenuDiv ul.nav--inline > li > a, #theMenuDiv ul.nav--stacked > li > a, #theMenuDiv ul.nav--tabbed > li > a, #theMenuDiv ul.nav--breadcrumb > li > a, #theMenuDiv ul.button-group > li > a {
    color: #ffffff;
    font-size: 22px;
    font-weight: 500;
    padding-bottom: 8px;
    padding-top: 8px;
    font-weight: 800;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav > li > a, #theMenuDiv ul.nav--inline > li > a, #theMenuDiv ul.nav--stacked > li > a, #theMenuDiv ul.nav--tabbed > li > a, #theMenuDiv ul.nav--breadcrumb > li > a, #theMenuDiv ul.button-group > li > a {
        font-size: 15px;
        color: #2c3256;
    }
}
#theMenuDiv ul.nav > li > a:after, #theMenuDiv ul.nav--inline > li > a:after, #theMenuDiv ul.nav--stacked > li > a:after, #theMenuDiv ul.nav--tabbed > li > a:after, #theMenuDiv ul.nav--breadcrumb > li > a:after, #theMenuDiv ul.button-group > li > a:after {
    -webkit-transition: width 0.25s ease-in-out;
    -moz-transition: width 0.25s ease-in-out;
    -ms-transition: width 0.25s ease-in-out;
    -o-transition: width 0.25s ease-in-out;
    transition: width 0.25s ease-in-out;
    background-color: #4681b8;
    content: "";
    width: 0%;
    height: 2px;
    display: block;
}
#theMenuDiv ul.nav > li > a:hover:after, #theMenuDiv ul.nav--inline > li > a:hover:after, #theMenuDiv ul.nav--stacked > li > a:hover:after, #theMenuDiv ul.nav--tabbed > li > a:hover:after, #theMenuDiv ul.nav--breadcrumb > li > a:hover:after, #theMenuDiv ul.button-group > li > a:hover:after {
    width: 100%;
}
#theMenuDiv ul.nav > li ul, #theMenuDiv ul.nav--inline > li ul, #theMenuDiv ul.nav--stacked > li ul, #theMenuDiv ul.nav--tabbed > li ul, #theMenuDiv ul.nav--breadcrumb > li ul, #theMenuDiv ul.button-group > li ul {
    display: none;
    padding-top: 5px;
    z-index: 100;
    margin-top: 0;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav > li ul, #theMenuDiv ul.nav--inline > li ul, #theMenuDiv ul.nav--stacked > li ul, #theMenuDiv ul.nav--tabbed > li ul, #theMenuDiv ul.nav--breadcrumb > li ul, #theMenuDiv ul.button-group > li ul {
        background-color: #ffffff;
    }
}
#theMenuDiv ul.nav > li ul li, #theMenuDiv ul.nav--inline > li ul li, #theMenuDiv ul.nav--stacked > li ul li, #theMenuDiv ul.nav--tabbed > li ul li, #theMenuDiv ul.nav--breadcrumb > li ul li, #theMenuDiv ul.button-group > li ul li {
    display: block;
    width: 100%;
    margin-left: 0;
}
#theMenuDiv ul.nav > li ul li a, #theMenuDiv ul.nav--inline > li ul li a, #theMenuDiv ul.nav--stacked > li ul li a, #theMenuDiv ul.nav--tabbed > li ul li a, #theMenuDiv ul.nav--breadcrumb > li ul li a, #theMenuDiv ul.button-group > li ul li a {
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 5px;
}
#theMenuDiv ul.nav > li:hover ul, #theMenuDiv ul.nav--inline > li:hover ul, #theMenuDiv ul.nav--stacked > li:hover ul, #theMenuDiv ul.nav--tabbed > li:hover ul, #theMenuDiv ul.nav--breadcrumb > li:hover ul, #theMenuDiv ul.button-group > li:hover ul {
    display: block;
}
@media screen and (min-width: 900px) {
    #theMenuDiv ul.nav > li:hover ul, #theMenuDiv ul.nav--inline > li:hover ul, #theMenuDiv ul.nav--stacked > li:hover ul, #theMenuDiv ul.nav--tabbed > li:hover ul, #theMenuDiv ul.nav--breadcrumb > li:hover ul, #theMenuDiv ul.button-group > li:hover ul {
        position: absolute;
        top: 100%;
        left: 0;
        width: 200px;
    }
}

.main-menu_trigger {
    display: block;
    float: right;
    padding: 0 1em;
    text-align: right;
    height: 100%;
    display: table;
    position: absolute;
    right: 1em;
    top: 4px;
    z-index: 101;
}
@media screen and (min-width: 900px) {
    .main-menu_trigger {
        display: none;
    }
}

/* ==========================================================================
$	MENU STYLES
========================================================================== */
.more-menu {
    cursor: pointer;
    display: table-cell;
    vertical-align: middle;
    padding: 0;
    -webkit-transition: all 275ms ease 0s;
    -moz-transition: all 275ms ease 0s;
    -ms-transition: all 275ms ease 0s;
    -o-transition: all 275ms ease 0s;
    transition: all 275ms ease 0s;
}
.more-menu.active {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.more-menu.active span {
    background: #ffffff;
}
    .more-menu.active span.bar1 {
        width: 20px;
        -webkit-transform: rotate(0deg) translateY(5px);
        -moz-transform: rotate(0deg) translateY(5px);
        -ms-transform: rotate(0deg) translateY(5px);
        -o-transform: rotate(0deg) translateY(5px);
        transform: rotate(0deg) translateY(5px);
    }
    .more-menu.active span.bar2 {
        width: 20px;
        opacity: 0 !important;
    }
    .more-menu.active span.bar3 {
        width: 20px;
        -webkit-transform: rotate(-90deg) translateX(13.5px);
        -moz-transform: rotate(-90deg) translateX(13.5px);
        -ms-transform: rotate(-90deg) translateX(13.5px);
        -o-transform: rotate(-90deg) translateX(13.5px);
        transform: rotate(-90deg) translateX(13.5px);
    }
.more-menu span {
    background: none repeat scroll 0 0 #9B9B9B;
    display: block;
    height: 3px;
    margin-bottom: 0.4em;
    transition: all 275ms ease 0s;
    width: 30px;
    -webkit-border-radius: 0.2em;
    -moz-border-radius: 0.2em;
    -ms-border-radius: 0.2em;
    -o-border-radius: 0.2em;
    border-radius: 0.2em;
    -webkit-animation-name: pulse;
    -moz-animation-name: pulse;
    -ms-animation-name: pulse;
    -o-animation-name: pulse;
    animation-name: pulse;
    -webkit-animation-duration: 3s;
    -moz-animation-duration: 3s;
    -ms-animation-duration: 3s;
    -o-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-delay: 5s;
    -moz-animation-delay: 5s;
    -ms-animation-delay: 5s;
    -o-animation-delay: 5s;
    animation-delay: 5s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

/* ==========================================================================
$	BASKET STYLES
========================================================================== */
.header_basket {
    -webkit-transition: background 0.25s ease-in-out;
    -moz-transition: background 0.25s ease-in-out;
    -ms-transition: background 0.25s ease-in-out;
    -o-transition: background 0.25s ease-in-out;
    transition: background 0.25s ease-in-out;
    border: 2px solid #2c3256;
    display: inline-block;
    border-radius: 5px;
    padding: 10px 15px;
    position: absolute;
    right: 75px;
    top: 0;
}
@media screen and (min-width: 600px) {
    .header_basket {
        padding: 15px 20px;
    }
    .header_basket:hover {
        background-color: #F4F4F4;
    }
}
@media screen and (min-width: 900px) {
    .header_basket {
        right: 25px;
    }
}
.header_basket .basket {
    background-image: url(img/basket.png);
    background-position: center center;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 18px;
    margin-right: 7px;
    position: relative;
}
.header_basket .number {
    border-radius: 10px;
    background-color: #4681b8;
    color: #ffffff;
    width: 16px;
    height: 16px;
    font-size: 10px;
    position: absolute;
    z-index: 1;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    /* NEW, Spec - Firefox, Chrome, Opera */
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    right: -7px;
    top: -4px;
}
.header_basket .total {
    display: inline-block;
    vertical-align: middle;
}
.header_basket .total a {
    color: #2c3256;
    font-weight: 600;
    border-bottom: 2px solid #2e2c32;
}
@media screen and (min-width: 600px) {
    .header_basket:hover a {
        border-color: #F4F4F4;
    }
}

.booking-session {
    display: none;
    position: absolute;
    right: 160px;
    top: 0;
    width: 120px;
    font-size: 12px;
}
.booking-session .description {
    display: none;
}
@media screen and (min-width: 440px) {
    .booking-session {
        display: block;
    }
    .booking-session .description {
        display: block;
    }
}
@media screen and (min-width: 600px) {
    .booking-session {
        top: 4px;
        right: 165px;
    }
}
.booking-session .time {
    font-size: 13px;
    font-weight: bold;
    padding-top: 2px;
}

/* ====== FORM STYLES ====== */
/* ======
FORM STYLES
	- BASE STYLES
	- MESSAGE STYLES
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
.required-icon {
    color: red;
    padding: 15px 0;
    position: absolute;
    right: 20px;
}

.required-text {
    color: red;
}

form {
    font-size: 16px;
}
form .field {
    position: relative;
}
form input, form textarea {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    background-color: #EAEAEA;
    border: none;
    color: #000000;
    padding: 10px;
    width: 100%;
}
@media screen and (min-width: 600px) {
    form input, form textarea {
        padding: 15px;
    }
}
form input.error, form textarea.error {
    border: 1px solid red;
}
form input::placeholder {
    color: #9B9B9B;
}
form input:-ms-value {
    background: none;
}
form textarea {
    min-height: 150px;
}
form label {
    font-size: 16px;
    font-weight: 300;
    display: block;
    margin-left: 10px;
    margin-bottom: 10px;
}
form select {
    width: 100%;
}

.anpr_wrapper input {
    background-color: #ffffff;
    border: 1px solid #D2D2D2;
}

select:focus::-ms-value {
    color: #2c3256;
    background: none;
}

.styled-select {
    background-image: url("/Content/img/arrow_black.png");
    background-repeat: no-repeat;
    background-position: right center;
    overflow: hidden;
    background-color: #ffffff;
    border: 1px solid #D2D2D2;
    width: 100%;
    padding: 5px 10px 2px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    border-radius: 8px;
}

.styled-select select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    background: none;
    border: none;
    font-size: 14px;
    height: 33px;
    padding: 5px;
    /* If you add too much padding here, the options won't show in IE */
    width: 110%;
    cursor: pointer;
}

/* Mobile-specific select improvements */
@media (max-width: 600px) {
    .styled-select select {
        font-size: 16px; /* Prevents auto-zoom on iOS */
        height: auto;
        min-height: 40px;
        padding: 10px 5px;
    }

    .styled-select {
        padding: 2px 10px;
        background-position: right 10px center;
        background-size: 12px;
    }
}

.fields {
    display: block;
    width: 100%;
}
.fields .field {
    margin-top: 1em;
    width: 100%;
}
@media screen and (min-width: 600px) {
    .fields .field {
        margin-bottom: 1em;
    }
}
.fields.center {
    display: flex;
    align-content: center;
    align-items: center;
}
@media screen and (min-width: 600px) {
    .fields.split .field {
        display: inline-block;
        margin-left: 5%;
        vertical-align: top;
        width: 46.5%;
    }
    .fields.split .field:first-child {
        margin-left: 0;
    }
}

.split.terms span {
    display: inline-block;
}

.fields.action-holder .field {
    width: 100%;
}
@media screen and (min-width: 768px) {
    .fields.action-holder .actions {
        display: inline-block;
        margin-top: 0;
        width: 35%;
    }
}

.filter_actions .action {
    display: inline-block;
}
.filter_actions .action:first-child {
    margin-right: 1em;
}

/* ==========================================================================
$	MESSAGE STYLES
========================================================================== */
.message-holder {
    display: block;
    float: left;
    line-height: 1.4em;
    margin: auto 0 15px;
    width: 100%;
}
.message-holder p {
    margin-bottom: 0;
}

.message {
    font-size: 12px;
    font-size: 0.8571428571rem;
    border: none;
    display: block;
    padding: 12px 15px;
    width: 100%;
}

.message.success {
    color: #4681b8;
}

.message.success p {
    color: #4681b8;
}

.message.error {
    color: #e01d2a;
}

.message.error p {
    color: #e01d2a;
}

.notification {
    background: #4681b8;
    border-radius: 0.4rem;
    margin-bottom: 1em;
    margin-top: 1em;
    padding: 1.5em;
}
.notification.alert {
    background: #ff9d1a;
}
.notification p {
    font-size: 15px;
    font-size: 1.0714285714rem;
    position: relative;
    padding: 0 0 0 45px;
    margin: 0;
}
.notification p:before {
    content: "";
    display: block;
    background-image: url(./img/alert.png);
    height: 30px;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    background-size: contain;
    z-index: 100;
    background-position: center;
}
@media screen and (min-width: 768px) {
    .notification p:before {
        height: 45px;
        top: -12px;
        width: 45px;
    }
}
@media screen and (min-width: 768px) {
    .notification p {
        font-size: 16px;
        font-size: 1.1428571429rem;
        padding: 0 0 0 60px;
    }
}
@media screen and (min-width: 900px) {
    .notification p {
        font-size: 18px;
        font-size: 1.2857142857rem;
    }
}

div.price div.booking-fee span.label, div.price div.booking-fee span.price {
    font-size: 15px;
}
div.price div.booking-fee .price, div.price div.booking-fee .price span, div.price div.booking-fee span.copy {
    font-size: 15px;
}

/* ==========================================================================
$	LOGIN STYLES
========================================================================== */
.login_wrapper {
    align-items: center;
    display: flex;
    height: calc(100vh - 60px);
    min-height: 550px;
    justify-content: center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1188e5+0,239BF8+100 */
    background: #1188e5;
    /* Old browsers */
    background: -moz-linear-gradient(45deg, #1188e5 0%, #239BF8 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, #1188e5 0%, #239BF8 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, #1188e5 0%, #239BF8 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#1188e5", endColorstr="#239BF8",GradientType=1 );
    /* IE6-9 fallback on horizontal gradient */
}

.login-holder {
    background-color: #ffffff;
    border-radius: 5px;
    display: block;
    margin: 0 auto;
    max-width: 500px;
    padding: 3em 2em;
    width: 100%;
}
.login-holder h1 {
    margin-bottom: 20px;
    text-align: center;
}
.login-holder .actions {
    text-align: right;
    margin-top: 2em;
    width: 100%;
}
.login-holder .actions a {
    text-decoration: underline;
    display: inline-block;
    color: blue;
    margin-left: 20px;
}
.login-holder .actions a:first-child {
    border-right: 1px solid black;
    padding-right: 20px;
    margin-left: 0;
}
.login-holder #MainContent_LabelError {
    width: 100%;
    display: block;
    text-align: center;
    margin-top: 1em;
    color: red;
}

/* ====== CMS STYLES ====== */
/* ======
CMS STYLES
	- BASE STYLES
	- ANPR STYLES
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
.dashboard_wrapper {
    padding-top: 3em;
    padding-bottom: 3em;
}
@media screen and (min-width: 600px) {
    .dashboard_wrapper {
        min-height: 600px;
    }
}

.location-selector {
    margin-bottom: 1em;
    max-width: 450px;
    margin: 0 auto;
}

.parking_actions {
    margin-bottom: 1em;
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}
.parking_actions .action {
    display: inline-block;
    margin-bottom: 1em;
}
@media screen and (min-width: 600px) {
    .parking_actions .action {
        margin-right: 1em;
    }
}

.results {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3em;
    margin-top: 2em;
    padding-left: 1em;
    padding-right: 1em;
    max-width: 1024px;
}
@media screen and (min-width: 600px) {
    .results {
        margin-top: 3em;
    }
}
@media screen and (min-width: 1024px) {
    .results {
        padding: 0;
    }
}

.table_wrapper {
    overflow-x: auto;
    width: 100%;
}

.results table {
    min-width: 500px;
}

table {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    word-wrap: break-word;
}
table th {
    font-size: 10px;
    font-size: 0.7142857143rem;
    background-color: #f1f1f2;
    color: #ffffff;
}
@media screen and (min-width: 600px) {
    table th {
        font-size: 14px;
        font-size: 1rem;
    }
}
table th,
table td {
    font-size: 13px;
    border-left: none;
    border-right: 1px solid #ECECEC;
    border-bottom: 1px solid #ECECEC;
    padding: 10px;
    text-align: center;
    font-weight: 400;
}
@media screen and (min-width: 600px) {
    table th,
    table td {
        padding: 15px 10px;
    }
}
table td {
    background-color: #ffffff;
}
table tr.even td {
    background-color: #F6F7F8;
}

.delete img {
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    width: 17px;
}

/* ==========================================================================
$	ANPR STYLES
========================================================================== */
.anpr_wrapper {
    padding-bottom: 3em;
    padding-top: 3em;
}
.anpr_wrapper .intro {
    margin-bottom: 2em;
}
.anpr_wrapper .personal_details, .anpr_wrapper .anpr_details {
    display: block;
    max-width: 800px;
    margin-bottom: 3em;
}

.modalPopup {
    border: 1px solid #4681b8;
    position: fixed;
    z-index: 100002;
    background-color: #ffffff;
    border-radius: 5px;
    display: block;
    margin: 0 auto;
    padding: 3em 2em;
    width: 100%;
    left: 0;
    top: 0;
}
@media screen and (min-width: 450px) {
    .modalPopup {
        width: 450px;
    }
}
.modalPopup .body {
    margin-bottom: 1em;
}
.modalPopup .actions {
    text-align: center;
}
.modalPopup .action {
    display: inline-block;
    vertical-align: middle;
    margin-left: 15px;
    margin-right: 15px;
}

.google-charts {
    margin-top: 2em;
    text-align: center;
}
.google-charts .chart {
    background-color: #ffffff;
    margin-bottom: 1em;
    padding: 1em;
}
@media screen and (min-width: 600px) {
    .google-charts .chart {
        display: inline-block;
        width: 48%;
        margin-right: 1%;
    }
    .google-charts .chart:nth-child(even) {
        margin-left: 1%;
        margin-right: 0;
    }
}
.google-charts .chart.fw {
    width: 98.5%;
    margin-right: 0;
}

.cms_wrapper.page {
    padding-bottom: 1.5em;
    padding-top: 1.5em;
}
@media screen and (min-width: 600px) {
    .cms_wrapper.page {
        padding-bottom: 3em;
        padding-top: 3em;
    }
}
.cms_wrapper.page .centered {
    background: #ffffff;
    padding: 20px;
}
@media screen and (min-width: 600px) {
    .cms_wrapper.page .centered {
        padding: 40px 30px 30px 30px;
    }
}
.cms_wrapper .question {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #2e2c32;
}
.cms_wrapper .question:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}
.cms_wrapper .question h4 {
    font-weight: 700;
    font-size: 18px;
    padding-bottom: 5px;
    margin-bottom: 0;
}
.cms_wrapper ul {
    margin-bottom: 20px;
    margin-left: 20px;
}
.cms_wrapper li {
    margin-bottom: 5px;
}
.cms_wrapper a {
    color: #4681b8;
}
.cms_wrapper a:hover {
    color: #4681b8;
    text-decoration: underline;
}

div[class^="cms_wrapper faq-"] {
    padding-bottom: 3em;
    padding-top: 3em;
}

.blue_badge_venues {
    padding-bottom: 2em;
    padding-top: 2em;
}
@media screen and (min-width: 600px) {
    .blue_badge_venues {
        display: grid;
        grid-gap: 20px 50px;
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (min-width: 900px) {
    .blue_badge_venues {
        grid-template-columns: repeat(3, 1fr);
    }
}
.blue_badge_venues .venue {
    background: #ffffff;
    padding: 1em;
}

.helpdesk, .helpdesk-cwg {
    padding-bottom: 3em;
    padding-top: 3em;
}
.helpdesk .blocks-list, .helpdesk-cwg .blocks-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    list-style: none;
    padding: 0;
}
@media screen and (min-width: 600px) {
    .helpdesk .blocks-list, .helpdesk-cwg .blocks-list {
        margin: 0 -15px;
    }
}
.helpdesk .blocks-item, .helpdesk-cwg .blocks-item {
    box-sizing: border-box;
    color: #4681b8;
    display: flex;
    flex: 1 0 300px;
    flex-direction: column;
    justify-content: center;
    margin: 0 0 30px;
    max-width: 100%;
    text-align: center;
    border: 2px solid #4681b8;
    background: #ffffff;
    border-radius: 0px;
    transition: 0.25s;
}
@media screen and (min-width: 600px) {
    .helpdesk .blocks-item, .helpdesk-cwg .blocks-item {
        margin: 0 15px 30px;
    }
}
.helpdesk .blocks-item:hover, .helpdesk .blocks-item:focus, .helpdesk .blocks-item:active, .helpdesk-cwg .blocks-item:hover, .helpdesk-cwg .blocks-item:focus, .helpdesk-cwg .blocks-item:active {
    background-color: #000000;
}
.helpdesk .blocks-item:hover *, .helpdesk .blocks-item:focus *, .helpdesk .blocks-item:active *, .helpdesk-cwg .blocks-item:hover *, .helpdesk-cwg .blocks-item:focus *, .helpdesk-cwg .blocks-item:active * {
    color: #ffffff;
}
.helpdesk .blocks-item-link, .helpdesk-cwg .blocks-item-link {
    color: #4681b8;
    padding: 20px 30px;
}
.helpdesk .blocks-item-title, .helpdesk-cwg .blocks-item-title {
    margin-bottom: 0px;
    margin-top: 0px;
    padding-bottom: 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-size: 18px;
    font-size: 1.2857142857rem;
}
@media screen and (min-width: 600px) {
    .helpdesk .blocks-item-title, .helpdesk-cwg .blocks-item-title {
        font-size: 22px;
        font-size: 1.5714285714rem;
    }
}

/* ====== BOOKINH STYLES ====== */
/* ======
BOOKING STYLES
	- BASE STYLES
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
div.price {
    margin-bottom: 1.5em;
    border-top: 1px dashed #2c3256;
    padding-top: 1em;
    border-bottom: 1px dashed #2c3256;
    padding-bottom: 1em;
}
div.price span.label {
    font-size: 16px;
    font-size: 1.1428571429rem;
    display: block;
    font-weight: 500;
}
div.price span.price, div.price span.price span {
    font-size: 22px;
    font-size: 1.5714285714rem;
    font-weight: 500;
}
div.price span.copy {
    font-size: 13px;
    font-size: 0.9285714286rem;
}

div.places {
    margin-bottom: 1.5em;
    border-bottom: 1px dashed #2c3256;
    padding-bottom: 1em;
}
div.places span.label {
    font-size: 16px;
    font-size: 1.1428571429rem;
    display: block;
    font-weight: 500;
}
div.places span.price, div.places span.price span {
    font-size: 22px;
    font-size: 1.5714285714rem;
    font-weight: 500;
}
div.places span.copy {
    font-size: 13px;
    font-size: 0.9285714286rem;
}

.order_details {
    padding-bottom: 1em;
}

.personal_details {
    margin-top: 1em;
}

.car_details {
    margin-bottom: 2em;
}
.car_details__line h4 {
    text-align: center;
}
@media screen and (min-width: 900px) {
    .car_details__line h4 {
        font-size: 24px;
        font-size: 1.7142857143rem;
    }
}
.car_details__line tr {
    background: #ffffff;
    display: block;
    margin-bottom: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
}
.car_details__line td {
    display: inline-block;
    width: 100%;
}
.car_details__line td.checkbox {
    text-align: left;
}
.car_details__line td:nth-child(3) {
    border-right: none;
}
.car_details__line td:nth-child(4) {
    border-bottom: none;
}
.car_details__line td:nth-child(5) {
    border-bottom: none;
}
.car_details__line td.heading_holder {
    width: 100%;
}
@media screen and (min-width: 600px) {
    .car_details__line td {
        width: 49%;
    }
}
.car_details__line td span {
    display: block;
    padding-bottom: 10px;
    text-align: left;
}
.car_details__line td span.car_label {
    font-size: 16px;
    font-size: 1.1428571429rem;
    text-align: center;
}
@media screen and (min-width: 900px) {
    .car_details__line td span.car_label {
        font-size: 22px;
        font-size: 1.5714285714rem;
    }
}
.car_details__line td span.error {
    padding: 0;
    color: #FF1B12;
}
.car_details__line label {
    margin-bottom: 10px;
    text-align: left;
}
.car_details__line .h4, .car_details__line #order-total .line-item label, #order-total .line-item .car_details__line label {
    margin-bottom: 0;
}
.car_details__line input[type=checkbox] {
    width: auto;
}
.car_details__line .post_delivery input,
.car_details__line .post_delivery span {
    display: inline-block;
    vertical-align: middle;
}
.car_details__line .post_delivery span {
    margin-right: 5px;
}

.upper_map_images {
    margin-top: 30px;
}
.upper_map_images .image {
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    margin-bottom: 20px;
}

.edit_orders_wrapper.pending_orders_wrapper .booking_account {
    max-width: none;
}
.edit_orders_wrapper.pending_orders_wrapper .orders .order {
    width: 100%;
    min-height: 0 !important;
}
@media screen and (min-width: 768px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order {
        display: flex;
        justify-content: space-between;
        margin-bottom: 3%;
        padding: 20px;
        font-size: 0;
    }
}
.edit_orders_wrapper.pending_orders_wrapper .orders .order .details {
    margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order .details {
        margin-bottom: 0;
        padding-right: 20px;
        width: 40%;
    }
}
.edit_orders_wrapper.pending_orders_wrapper .orders .order .actions {
    border-top: 1px solid black;
    padding-top: 20px;
    margin-top: 15px;
}
@media screen and (min-width: 768px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order .actions {
        border-top: none;
        padding-top: 0;
        border-left: 1px solid black;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 0;
        padding-left: 20px;
    }
}
.edit_orders_wrapper.pending_orders_wrapper .orders .order .actions a {
    margin-bottom: 10px;
    width: auto;
    float: none;
}
@media screen and (min-width: 768px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order .actions a {
        margin-bottom: 0;
        margin-right: 10px;
    }
}
@media screen and (max-width: 767px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order .actions a:first-child {
        margin-right: 10px;
    }
}
@media screen and (min-width: 768px) {
    .edit_orders_wrapper.pending_orders_wrapper .orders .order .actions a:last-child {
        margin-right: 0;
    }
}

.platform-credit {
    color: #0a5a38;
    font-weight: 500;
    margin: 0;
    white-space: nowrap;
    float: right;
}

/* ====== PENDING ORDERS ====== */
/* ======
PENDING ORDERS
	- BASE STYLES
	- MOBILE MENU
====== */
/* ==========================================================================
$	BASE STYLES
========================================================================== */
.pending_orders_wrapper {
    padding-bottom: 1em;
    padding-top: 1em;
}
@media screen and (min-width: 600px) {
    .pending_orders_wrapper {
        padding-bottom: 3em;
        padding-top: 3em;
    }
}
.pending_orders_wrapper .orders {
    margin-bottom: 20px;
    margin-top: 20px;
    font-size: 0;
}
.pending_orders_wrapper .orders .order {
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #D2D2D2;
    margin-bottom: 15px;
    padding: 10px;
    position: relative;
}
@media screen and (min-width: 600px) {
    .pending_orders_wrapper .orders .order.event {
        padding-bottom: 50px;
    }
    .pending_orders_wrapper .orders .order.event .actions {
        position: absolute;
        left: 20px;
        bottom: 20px;
    }
}
@media screen and (max-width: 599px) {
    .pending_orders_wrapper .orders .order {
        display: block;
        margin: 0 auto 15px auto;
        max-width: 300px;
    }
}
@media screen and (min-width: 600px) {
    .pending_orders_wrapper .orders .order {
        display: inline-block;
        vertical-align: top;
        margin-bottom: 3%;
        padding: 20px;
        font-size: 0;
        width: 48.5%;
    }
    .pending_orders_wrapper .orders .order.event {
        min-height: 400px;
    }
    .pending_orders_wrapper .orders .order:nth-child(odd) {
        margin-right: 3%;
    }
}
@media screen and (min-width: 900px) {
    .pending_orders_wrapper .orders .order {
        margin-right: 3%;
        width: 31%;
    }
    .pending_orders_wrapper .orders .order:nth-child(3n) {
        margin-right: 0;
    }
}
.pending_orders_wrapper .orders .order.success {
    border-color: green;
}
.pending_orders_wrapper .orders .order.error {
    border-color: red;
}
.pending_orders_wrapper .orders .order .message {
    background: #eee;
    margin-bottom: 10px;
}
.pending_orders_wrapper .orders .order .message.success {
    color: green;
}
.pending_orders_wrapper .orders .order .message.error {
    color: red;
}
.pending_orders_wrapper .orders .order .message a {
    color: #4681b8;
    text-decoration: underline;
}
.pending_orders_wrapper .orders .order .details {
    display: block;
    vertical-align: top;
}
.pending_orders_wrapper .orders .order .details > div {
    font-size: 15px;
    margin-bottom: 5px;
}
.pending_orders_wrapper .orders .order .details > div span {
    font-size: 14px;
}
.pending_orders_wrapper .orders .order .divavaliable {
    margin-top: 10px;
}
.pending_orders_wrapper .orders .order .divdisplayinfo ul {
    margin-left: 20px;
    margin-top: 20px;
}
.pending_orders_wrapper .orders .order .divdisplayinfo li {
    margin-bottom: 5px;
}
.pending_orders_wrapper .orders .order .actions a:first-child {
    margin-right: 15px;
}
.pending_orders_wrapper .orders .order h3,
.pending_orders_wrapper .orders .order h4 {
    font-size: 18px;
    line-height: 1.4em;
}
.pending_orders_wrapper .orders .image {
    display: block;
    margin-bottom: 20px;
}
.pending_orders_wrapper .orders .actions__cta {
    display: none;
}
.pending_orders_wrapper .orders .divdisplayinfo a {
    text-decoration: underline;
}
@media screen and (min-width: 600px) {
    .pending_orders_wrapper .event_title__holder {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: flex-start;
    }
}
.pending_orders_wrapper .event__cta {
    max-width: 320px;
    width: 100%;
}
@media screen and (min-width: 600px) {
    .pending_orders_wrapper .event__cta {
        max-width: 340px;
    }
}

@media screen and (min-width: 600px) {
    #MainContent_divcarparkslist .order .actions {
        position: absolute;
        bottom: 20px;
        left: 20px;
    }
}
#MainContent_divcarparkslist .order .details {
    position: relative;
}
@media screen and (min-width: 600px) {
    #MainContent_divcarparkslist .order .details {
        margin-bottom: 50px;
    }
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details {
        padding-right: 70px;
    }
}
#MainContent_divcarparkslist .order .details h4 {
    padding-right: 65px;
}
#MainContent_divcarparkslist .order .details:before {
    content: "";
    display: block;
    background-image: url(./img/car.png);
    height: 45px;
    background-repeat: no-repeat;
    position: absolute;
    right: 5px;
    top: 0;
    width: 23px;
    background-size: contain;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details:before {
        width: 28px;
    }
}
#MainContent_divcarparkslist .order .details.bus:before {
    background-image: url(./img/bus.png);
}
#MainContent_divcarparkslist .order .details.minibus:before {
    background-image: url(./img/minibus.png);
}
#MainContent_divcarparkslist .order .details.wheelchair:before {
    background-image: url(./img/wheelchair.png);
}
#MainContent_divcarparkslist .order .details.wheelchair_white:before {
    background-image: url(./img/wheelchair_white.png);
}
#MainContent_divcarparkslist .order .details.bike:before {
    background-image: url(./img/bike.png);
}
@media screen and (min-width: 900px) {
    #MainContent_divcarparkslist .order .details.bike:before {
        width: 40px;
    }
}
#MainContent_divcarparkslist .order .details.bus-walk:before {
    background-image: url(./img/bus-walk.png);
    width: 52px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.bus-walk:before {
        width: 65px;
    }
}
#MainContent_divcarparkslist .order .details.car-walk:before {
    background-image: url(./img/car-walk.png);
    width: 52px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.car-walk:before {
        width: 65px;
    }
}
#MainContent_divcarparkslist .order .details.car-walk-bus:before {
    background-image: url(./img/car-walk-bus.png);
    width: 65px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.car-walk-bus:before {
        width: 80px;
    }
}
#MainContent_divcarparkslist .order .details.ecar:before {
    background-image: url(./img/ecar.png);
    width: 35px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.ecar:before {
        width: 38px;
    }
}
#MainContent_divcarparkslist .order .details.ecar-walk:before {
    background-image: url(./img/ecar-walk.png);
    width: 52px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.ecar-walk:before {
        width: 65px;
    }
}
#MainContent_divcarparkslist .order .details.car-bus:before {
    background-image: url(./img/car-bus_cwg.png);
    width: 52px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.car-bus:before {
        width: 68px;
    }
}
#MainContent_divcarparkslist .order .details.ecar-bus:before {
    background-image: url(./img/ecar-bus.png);
    width: 52px;
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details.ecar-bus:before {
        width: 68px;
    }
}
@media screen and (min-width: 1024px) {
    #MainContent_divcarparkslist .order .details {
        padding-bottom: 75px;
    }
}

.announcement {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 20px;
    padding: 10px;
}
@media screen and (min-width: 768px) {
    .announcement {
        padding: 24px;
        margin-bottom: 30px;
    }
}
.announcement h3 {
    color: #1C4587;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4em;
}
@media screen and (min-width: 600px) {
    .announcement h3 {
        font-size: 22px;
    }
}
@media screen and (min-width: 768px) {
    .announcement h3 {
        font-size: 30px;
    }
}
.announcement h4 {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4em;
}
@media screen and (min-width: 768px) {
    .announcement h4 {
        font-size: 24px;
    }
}
.announcement p {
    font-size: 16px;
}

/* ====== BASKET STYLES ====== */
/* ======
BASKET STYLES
	- BASE STYLES
	- BASKET
====== */
/* ==========================================================================
$	BASKET STYLES
========================================================================== */
.basket_wrapper h2 {
    font-size: 18px;
    font-size: 1.2857142857rem;
    font-weight: 400;
}

.action.addmore {
    display: none;
}

.loader {
    -webkit-transition: opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -moz-transition: opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -ms-transition: opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -o-transition: opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    transition: opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url(/Content/img/Spinner-1s-200px.gif);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    z-index: 10;
    background-color: rgba(238, 238, 238, 0.7);
    opacity: 0;
    max-height: 0;
}
.loader.processing {
    opacity: 1;
    max-height: 2000px;
}

#confirmation {
    display: none;
    background-color: #fff;
    padding: 3em 2em;
    max-width: 600px;
    width: 100%;
}
#confirmation.response {
    display: block;
}
#confirmation.response.success .success {
    display: block;
}
#confirmation.response.error .error {
    display: block;
}
#confirmation .success, #confirmation .error {
    display: none;
}

@media screen and (min-width: 900px) {
    .basket_holder {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6, BB7 */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
        display: flex;
        /* NEW, Spec - Firefox, Chrome, Opera */
        -webkit-flex-direction: row;
        -moz-flex-direction: row;
        -ms-flex-direction: row;
        -o-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

@media screen and (min-width: 900px) {
    .basket_items {
        order: 2;
        width: 100%;
    }
    .basket_items .basket_items_inner {
        background-color: #ffffff;
        padding: 3em 2em 2em 2em;
    }
}
.basket_items .orders {
    list-style: none;
}
.basket_items .orders .line-item {
    border-bottom: 1px dashed #2c3256;
    position: relative;
}
.basket_items .orders .line-item:nth-child(odd) {
    background-color: #EDEDED;
}
.basket_items .orders .line-item:first-child {
    border-top: 1px dashed #2c3256;
}

@media screen and (min-width: 900px) {
    #order-total {
        width: 50%;
        margin-left: 50%;
    }
}
#order-total .alert {
    text-decoration: underline;
    font-weight: bold;
    font-size: 15px;
    margin: 0;
    font-family: gineso, sans-serif;
    text-transform: uppercase;
}
#order-total .actions {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    width: 100%;
}
#order-total .actions a {
    margin-left: 2em;
}
#order-total .actions.payment-actions {
    justify-content: center;
}

.line-item {
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 1em;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    /* NEW, Spec - Firefox, Chrome, Opera */
}
.line-item .image {
    width: 70px;
    height: 70px;
}
.line-item .label {
    flex: 1;
    padding-left: 10px;
    text-align: left;
}
.line-item .location {
    padding-right: 35px;
}
.line-item h4 {
    margin-bottom: 0;
    padding-bottom: 5px;
}
@media screen and (min-width: 900px) {
    .line-item h4 {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}
.line-item p {
    font-size: 14px;
    font-size: 1rem;
}
.line-item .count, .line-item .price {
    padding-left: 10px;
    align-self: right;
    text-align: right;
}
.line-item .price {
    color: #4681b8;
    font-weight: 500;
}
.line-item .actions {
    margin-top: 10px;
    width: 100%;
}

#order-total .line-item {
    padding-bottom: 0;
}
#order-total .line-item:last-child {
    border-top: 1px dashed #2c3256;
    margin-top: 10px;
    padding-bottom: 1em;
}
@media screen and (min-width: 900px) {
    #order-total .line-item.subtotal label {
        font-size: 14px;
        font-size: 1rem;
    }
}
@media screen and (min-width: 900px) {
    #order-total .line-item.total label {
        font-size: 19px;
        font-size: 1.3571428571rem;
    }
}
#order-total .line-item label {
    padding-bottom: 0;
    flex: 1;
    text-align: left;
}
@media screen and (min-width: 900px) {
    #order-total .line-item label {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}
#order-total .line-item span {
    font-size: 14px;
    font-size: 1rem;
    color: #4681b8;
    font-weight: 500;
}

.payment_details {
    margin-top: 1em;
}
@media screen and (min-width: 900px) {
    .payment_details {
        order: 1;
        flex: 1;
        padding-right: 5vw;
    }
}
.payment_details .actions {
    text-align: center;
}

/* ==========================================================================
$	BASKET ITEMS STYLES
========================================================================== */
.basket_items_wrapper #divaddbasketitems {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    /* NEW, Spec - Firefox, Chrome, Opera */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (min-width: 900px) {
    .basket_items_wrapper .centered {
        max-width: 1440px;
    }
}
@media screen and (min-width: 900px) {
    .basket_items_wrapper .basketitem,
    .basket_items_wrapper .car_details {
        width: 50%;
    }
}
@media screen and (min-width: 900px) {
    .basket_items_wrapper .image {
        width: 25%;
    }
}
@media screen and (min-width: 900px) {
    .basket_items_wrapper .label {
        width: 74%;
    }
}
.basket_items_wrapper .image {
    display: inline-block;
    width: 20%;
    vertical-align: middle;
}
.basket_items_wrapper .label {
    display: inline-block;
    padding-left: 10px;
    vertical-align: middle;
    width: 78%;
}
.basket_items_wrapper .spaces {
    margin-bottom: 0.5em;
}
.basket_items_wrapper .spaces span {
    font-size: 16px;
    font-size: 1.1428571429rem;
}
.basket_items_wrapper .basketitem {
    width: 100%;
}
@media screen and (min-width: 768px) {
    .basket_items_wrapper .basketitem {
        padding-right: 1em;
        width: 40%;
    }
}
.basket_items_wrapper .car_details {
    width: 100%;
}
@media screen and (min-width: 768px) {
    .basket_items_wrapper .car_details {
        padding-left: 1em;
        width: 60%;
    }
}
.basket_items_wrapper .car_details span,
.basket_items_wrapper .car_details input {
    font-size: 14px;
    font-size: 1rem;
}
.basket_items_wrapper .car_details input {
    padding: 10px !important;
}
.basket_items_wrapper h2 {
    font-size: 18px;
    font-size: 1.2857142857rem;
    border-bottom: 1px dashed;
    font-weight: 400;
    margin-bottom: 1em;
}
.basket_items_wrapper #MainContent_LabelParkingPlaces {
    color: #4681b8;
}
.basket_items_wrapper .qty {
    font-size: 16px;
    font-size: 1.1428571429rem;
}
.basket_items_wrapper #MainContent_orderlist {
    border-top: 1px dashed;
    padding-top: 18px;
    margin-top: 20px;
}
.basket_items_wrapper #MainContent_orderlist > span:first-child {
    display: block;
    margin-bottom: 0.5em;
}
.basket_items_wrapper .qtyactions > input {
    -webkit-transition: background-color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s, color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -moz-transition: background-color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s, color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -ms-transition: background-color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s, color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    -o-transition: background-color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s, color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    transition: background-color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s, color 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) 0.1s;
    background-color: #4681b8;
    border-radius: 50%;
    color: #ffffff;
    padding: 0;
    height: 25px;
    width: 25px;
}
.basket_items_wrapper .qtyactions > input:hover {
    color: #2c3256;
    background-color: #f1f1f2;
}
.basket_items_wrapper .qtyactions span {
    font-size: 30px;
    font-size: 2.1428571429rem;
    padding-left: 5px;
    padding-right: 5px;
}

.StripeElement {
    height: 40px;
    padding: 10px 12px;
    color: #32325d;
    background-color: white;
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    -moz-transition: box-shadow 150ms ease;
    -ms-transition: box-shadow 150ms ease;
    -o-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.bookmore {
    margin-top: 20px;
}
.bookmore p {
    font-size: 16px;
}
.bookmore a {
    color: #4681b8;
    text-decoration: underline;
}
.bookmore a:hover {
    color: #4681b8;
    opacity: 0.8;
}
.basket_items .bookmore {
    margin-top: 0;
    margin-bottom: 20px;
}

.booking_slots {
    border-bottom: 1px dashed #2c3256;
    margin-top: 10px;
    padding-bottom: 20px;
}
@media screen and (min-width: 900px) {
    .booking_slots {
        margin-top: 20px;
    }
}
.booking_slots tr {
    display: inline-block;
}
.booking_slots td {
    background: none;
    padding: 0 20px 0 0;
}
.booking_slots label {
    background: #ffffff;
    border: 1px solid #2c3256;
    margin: 0;
    padding: 20px;
}
.booking_slots p {
    color: #333;
}
.booking_slots input[type=radio]:checked + label {
    background-color: #4681b8;
}
.booking_slots input {
    display: none;
}

.payment__options {
    border-top: 1px solid #ECECEC;
    padding-top: 20px;
    max-width: 600px;
}
.payment__options .radio-wrapper {
    border-top: 1px solid #ECECEC;
    padding: 20px;
    position: relative;
    zoom: 1;
    display: table;
    box-sizing: border-box;
    width: 100%;
}
.payment__options .radio__input {
    display: table-cell;
    padding-right: 0.75em;
    white-space: nowrap;
}
.payment__options .radio__input input {
    width: 18px;
    height: 18px;
}
.payment__options .radio__label {
    cursor: pointer;
    vertical-align: middle;
    display: table-cell;
    width: 100%;
}
.payment__options .radio__label label {
    cursor: inherit;
    font-family: inherit;
    vertical-align: top;
    display: table-cell;
    width: 100%;
}
.payment__options .payment_option__fields {
    border-top: 1px solid #ECECEC;
    padding-top: 20px;
}
.payment__options .payment_option__fields p {
    text-align: center;
}

.payment-method {
    border-top: 1px solid #ECECEC;
    padding-top: 20px;
    margin-top: 20px;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    font-size: 1.2857142857rem;
}
@media screen and (min-width: 600px) {
    .payment-method {
        font-size: 16px;
        font-size: 1.1428571429rem;
    }
}

.anpr_wrapper input[type=checkbox] {
    width: 20px;
}

.accessiblity_needs {
    padding-top: 10px;
}
.accessiblity_needs a {
    color: #4681b8;
}
.accessiblity_needs a:hover {
    text-decoration: underline;
}

.basket_waze_cta .cta__inner {
    background: white;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
.basket_waze_cta .cta__drive {
    display: none;
    vertical-align: middle;
}
@media screen and (min-width: 1024px) {
    .basket_waze_cta .cta__drive {
        display: flex;
        width: 15%;
    }
}
.basket_waze_cta .cta__graphic {
    display: none;
    vertical-align: middle;
    background: url(/Content/img/waze_game_blue.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 25%;
}
@media screen and (min-width: 600px) {
    .basket_waze_cta .cta__graphic {
        display: flex;
    }
}
@media screen and (min-width: 900px) {
    .basket_waze_cta .cta__graphic {
        width: 15%;
    }
}
.basket_waze_cta .cta__graphic img {
    width: 100%;
}
.basket_waze_cta .cta__map {
    display: none;
    vertical-align: middle;
}
@media screen and (min-width: 900px) {
    .basket_waze_cta .cta__map {
        display: flex;
        background: white;
        width: 50%;
        padding: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .basket_waze_cta .cta__map {
        width: 40%;
    }
}
.basket_waze_cta .cta .iframe_container {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
}
.basket_waze_cta .cta iframe {
    height: 100%;
    width: 100%;
}
.basket_waze_cta .cta__app {
    display: flex;
    vertical-align: middle;
    width: 100%;
}
@media screen and (min-width: 600px) {
    .basket_waze_cta .cta__app {
        width: 75%;
    }
}
@media screen and (min-width: 900px) {
    .basket_waze_cta .cta__app {
        width: 35%;
    }
}
@media screen and (min-width: 1024px) {
    .basket_waze_cta .cta__app {
        width: 30%;
    }
}
.basket_waze_cta .cta__app__inner {
    width: 100%;
    background: white;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
@media screen and (min-width: 600px) {
    .basket_waze_cta .cta__app__inner {
        align-items: flex-start;
    }
}
@media screen and (min-width: 900px) {
    .basket_waze_cta .cta__app__inner {
        padding: 20px 20px 20px 0;
    }
}
.basket_waze_cta .cta__app h5 {
    font-weight: bold;
    font-size: 26px;
}
@media screen and (min-width: 600px) {
    .basket_waze_cta .cta__app h5 {
        font-size: 30px;
    }
}
@media screen and (min-width: 1024px) {
    .basket_waze_cta .cta__app h5 {
        font-size: 36px;
    }
}
.basket_waze_cta .app_info {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    /* align-content: center; */
    justify-content: space-around;
    align-items: center;
}
@media screen and (min-width: 600px) {
    .basket_waze_cta .app_info {
        align-items: flex-start;
    }
}
.basket_waze_cta .app__reviews {
    margin-bottom: 1em;
    max-width: 300px;
}
.basket_waze_cta .app_downloads {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
}
.basket_waze_cta .app_downloads img {
    width: auto;
}
.basket_waze_cta .waze__download_apple img {
    height: 40px;
}
.basket_waze_cta .waze__download_play img {
    height: 58px;
}

.iframe_container {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;
    /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/* ====== BANNER STYLES ====== */
/* ======
BANNER STYLES
	- BASE STYLES
	- BANNER
====== */
/* ==========================================================================
$	BANNER STYLES
========================================================================== */
.banner {
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    background-image: url(/Content/img/main-ep-sm.jpg);
    background-color: #30355a;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    /* NEW, Spec - Firefox, Chrome, Opera */
    min-height: 300px;
}
@media screen and (min-width: 768px) {
    .banner {
        background-image: url(/Content/img/main-ep.jpg);
        min-height: 400px;
    }
}
@media screen and (min-width: 900px) {
    .banner {
        background-size: contain;
        min-height: 500px;
    }
}
.banner h1, .banner p {
    color: #ffffff;
}
.banner .banner_inner {
    width: 100%;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight: 600;
}
.banner .banner_inner h1 {
    text-transform: uppercase;
    max-width: 745px;
}
@media screen and (min-width: 600px) {
    .banner .banner_inner h1 {
        font-size: 40px;
    }
}
@media screen and (min-width: 900px) {
    .banner .banner_inner h1 {
        font-size: 50px;
    }
}

.page-header {
    background-color: #4681b8;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3.5rem 1rem 3.5rem 1rem;
    min-height: 0;
    position: relative;
    overflow: hidden;
    text-align: center;
}
@media screen and (min-width: 600px) {
    .page-header {
        padding-top: 6.5rem;
        padding-bottom: 6.5rem;
    }
}
@media screen and (min-width: 768px) {
    .page-header {
        min-height: 18rem;
        padding: 4rem 11rem 4rem 11rem;
    }
    .page-header:before {
        height: 50%;
        width: 30%;
    }
}
.page-header h1 {
    color: #ffffff;
}
.page-header h2 {
    margin-top: 1em;
}
@media screen and (min-width: 768px) {
    .page-header h2 {
        font-size: 24px;
        font-size: 1.7142857143rem;
    }
}
.page-header h3 {
    font-weight: 400;
}
.page-header__background-left, .page-header__background-right {
    display: none;
}

/* hero-banner */
.hero-banner {
    position: relative;
}
    .hero-banner img {
        width: 100%;
        height: 310px;
        object-fit: cover;
        display: block;
        object-position: bottom left; 
    }

.hero-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.15));
}

.hero-banner-content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: end;
    padding: 1rem;
    color: #fff;
    padding-left: 5rem;
}

.hero-banner-title {
    font-size: clamp(1.25rem, 2.2vw + .5rem, 2rem);
    font-weight: 800;
    color: white !important;
}

.hero-banner-sub {
    opacity: 0.9;
    color: white !important;
}

/* ====== BANNER STYLES ====== */
/* ======
CALENDAR STYLES
	- BASE STYLES
====== */
/* ==========================================================================
$	CALENDAR STYLES
========================================================================== */
.calendar__wrapper h1, .calendar__wrapper h3 {
    padding-bottom: 0;
    padding-left: 1em;
    padding-right: 1em;
}
@media screen and (min-width: 600px) {
    .calendar__wrapper h1, .calendar__wrapper h3 {
        padding-left: 0;
        padding-right: 0;
    }
}
.calendar__wrapper .centered {
    padding-left: 0;
    padding-right: 0;
}
@media screen and (min-width: 600px) {
    .calendar__wrapper .centered {
        padding-left: 1em;
        padding-right: 1em;
    }
}

.calendar__holder__inner {
    position: relative;
}

.calendar__holder {
    background-color: white;
    border-radius: 10px;
    padding: 1em;
    margin-top: 1em;
}
.calendar__holder .scroller__wrap {
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}
.calendar__holder .currentmonth {
    border-radius: 10px;
    color: #1C4587;
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    text-transform: uppercase;
}
.calendar__holder .month_nav {
    border-top: 1px solid #cccccc;
    font-size: 20px;
    text-align: center;
}
@media screen and (min-width: 600px) {
    .calendar__holder .month_nav {
        display: grid;
        overflow: hidden;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 1fr;
        grid-column-gap: 5px;
        grid-row-gap: 5px;
        text-align: left;
    }
}
.calendar__holder .month_nav > div {
    border-left: 1px solid #cccccc;
    display: inline-block;
    padding: 0.25em;
    width: 50%;
}
.calendar__holder .month_nav > div:first-child {
    border-left: none;
    border-bottom: 1px solid #cccccc;
    display: block;
    width: 100%;
}
@media screen and (min-width: 600px) {
    .calendar__holder .month_nav > div {
        border-bottom: none;
        display: flex;
        align-items: center;
        padding: 0.5em;
        width: 100%;
    }
}
@media screen and (min-width: 900px) {
    .calendar__holder .month_nav > div {
        padding: 1em;
    }
}
.calendar__holder .month_nav input {
    background: #4681b8;
    color: white;
    border: none;
    border-radius: 25px;
    font-size: 14px;
    padding: 0.5em;
}
@media screen and (min-width: 600px) {
    .calendar__holder .month_nav input {
        font-size: 20px;
    }
}
.calendar__holder table {
    min-width: unset;
}
.calendar__holder td {
    outline: solid 1px #cccccc;
    border: none;
    padding: 0.5em;
}
@media screen and (min-width: 600px) {
    .calendar__holder td {
        padding: 1.25em;
    }
}
.calendar__holder .theader {
    color: #818181;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    text-align: center;
}
@media screen and (min-width: 600px) {
    .calendar__holder .theader {
        font-size: 16px;
    }
}
.calendar__holder .tdday {
    color: #818181;
    font-size: 14px;
    padding: 1em 0.5em 1em 0.5em;
    text-align: center;
    vertical-align: top;
}
.calendar__holder .tdday.past, .calendar__holder .tdday.no-spaces {
    background-color: #f2f2f2;
}
.calendar__holder .tdday.today span.day {
    background: #4681b8;
    height: 25px;
    width: 25px;
    text-align: center;
    color: white;
    border-radius: 50%;
    margin-top: 0;
    margin-bottom: 0;
}
@media screen and (min-width: 600px) {
    .calendar__holder .tdday.today span.day {
        height: 30px;
        width: 30px;
    }
}
.calendar__holder .tdday span.spaces {
    margin-bottom: 10px;
    display: block;
    margin-top: 10px;
    border-bottom: 1px dashed;
    padding-bottom: 10px;
    text-align: center;
}
.calendar__holder .tdday span.day {
    display: table;
    margin-bottom: 0.5em;
    margin-top: 0.5em;
    font-size: 13px;
}
@media screen and (min-width: 600px) {
    .calendar__holder .tdday span.day {
        margin-top: 0;
        font-size: 20px;
    }
}
.calendar__holder .tdday span.day span {
    display: table-cell;
    vertical-align: middle;
}
.calendar__holder .event-menu {
    display: block;
    margin-top: 0.5em;
}
.calendar__holder .event-menu:after {
    content: "܅";
    color: #f7e734;
    font-size: 50px;
    line-height: 0;
}
@media screen and (min-width: 600px) {
    .calendar__holder .event-menu {
        display: none;
    }
}
.calendar__holder .events__wrapper {
    display: none;
}
@media screen and (max-width: 599px) {
    .calendar__holder .events__wrapper.show {
        background: rgba(0, 0, 0, 0.5);
        position: absolute;
        display: flex;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        align-items: center;
        justify-content: center;
    }
}
@media screen and (min-width: 600px) {
    .calendar__holder .events__wrapper {
        display: block;
    }
    .calendar__holder .events__wrapper .close {
        display: none;
    }
}
@media screen and (max-width: 599px) {
    .calendar__holder .events__inner {
        position: relative;
        width: 90%;
        background: white;
        padding: 2em;
        border-radius: 10px;
    }
}
.calendar__holder .events {
    margin-bottom: 5px;
    margin-top: 10px;
}
.calendar__holder .events hr {
    margin-top: 15px;
}
.calendar__holder .events a {
    text-decoration: underline;
    margin-top: 10px;
    background: #f7e734;
    display: inline-block;
    padding: 3px 5px;
    border-radius: 5px;
    color: white;
}
.calendar__holder .events a:first-child {
    margin-top: 0;
}
.calendar__holder .events a:last-child {
    margin-top: 5px;
}
.calendar__holder .events a:hover {
    opacity: 0.8;
    text-decoration: none;
}
/* ====== BANNER STYLES ====== */
/* ======
CALENDAR STYLES
	- BASE STYLES
====== */
/* ==========================================================================
$	CALENDAR STYLES
========================================================================== */
.carpark__inner,
.events__inner {
    padding-top: 2em;
}
@media screen and (min-width: 768px) {
    .carpark__inner,
    .events__inner {
        padding-top: 4em;
    }
}

.pending_orders_wrapper.carpark_wrapper,
.pending_orders_wrapper.events_wrapper {
    padding-top: 0;
}
.pending_orders_wrapper.carpark_wrapper .order,
.pending_orders_wrapper.events_wrapper .order {
    font-size: 16px;
    font-size: 1.1428571429rem;
}
@media screen and (min-width: 768px) {
    .pending_orders_wrapper.carpark_wrapper .order,
    .pending_orders_wrapper.events_wrapper .order {
        font-size: 18px;
        font-size: 1.2857142857rem;
    }
}

.car_park_list .carpark.accessible {
    background-color: #325aaa;
    color: #ffffff;
}
.car_park_list .carpark.accessible h4 {
    color: #ffffff;
}
.car_park_list .carpark.electric-charging-point {
    background-color: #90c341;
}

.carpark_details {
    border-top: 1px dashed #2c3256;
    margin-top: 10px;
}
.carpark_details h5 {
    font-size: 13px;
    font-size: 0.9285714286rem;
    font-family: "Noto Sans", sans-serif;
    margin-bottom: 5px;
    padding-bottom: 0;
    padding-top: 10px;
}
.carpark_details ul {
    margin-left: 0;
}
.carpark_details li {
    list-style: none;
    margin-bottom: 2px;
}

:root {
    --delay-time: .5s;
}

#carparkMap {
    min-height: 350px;
    height: 100%;
}
@media screen and (min-width: 768px) {
    #carparkMap {
        min-height: 450px;
    }
}
@media screen and (min-width: 900px) {
    #carparkMap {
        min-height: 500px;
    }
}

#mapContainer {
    height: 100%;
    margin: 20px 0 20px 0;
}
@media screen and (max-width: 599px) {
    #mapContainer {
        margin: 40px 0 40px 0;
    }
}

@keyframes drop {
    0% {
        transform: translateY(-200px) scaleY(0.9);
        opacity: 0;
    }
    5% {
        opacity: 0.7;
    }
    50% {
        transform: translateY(0px) scaleY(1);
        opacity: 1;
    }
    65% {
        transform: translateY(-17px) scaleY(0.9);
        opacity: 1;
    }
    75% {
        transform: translateY(-22px) scaleY(0.9);
        opacity: 1;
    }
    100% {
        transform: translateY(0px) scaleY(1);
        opacity: 1;
    }
}
.drop {
    animation: drop 0.3s linear forwards var(--delay-time);
}



/* ====== BDL STYLES ====== */
/* ======
BASE STYLES
    - TYPOGRAPHY STYLES
    - HEADER
====== */
.birmingham-diamond-league header.top .logo {
    background-image: url(/Content/img/bdl_logo.png);
}
.birmingham-diamond-league .primary-btn, .birmingham-diamond-league .button,
.birmingham-diamond-league input[type=primary-btn],
.birmingham-diamond-league input[type=submit].primary-btn, .birmingham-diamond-league input[type=submit].secondary-btn,
.birmingham-diamond-league .btn-primary {
    background-color: #2b395b;
    border: none;
    color: #ffffff;
}
.birmingham-diamond-league .primary-btn:hover, .birmingham-diamond-league .button:hover,
.birmingham-diamond-league input[type=primary-btn]:hover, .birmingham-diamond-league input[type=submit].secondary-btn:hover,
.birmingham-diamond-league .btn-primary:hover {
    background-color: #81201B;
    color: #ffffff;
}
.birmingham-diamond-league .secondary-btn,
.birmingham-diamond-league form input[type=submit].secondary-btn,
.birmingham-diamond-league form input.secondary-btn {
    background-color: #b3322b;
    border: none;
    color: #ffffff;
}
.birmingham-diamond-league .secondary-btn:hover,
.birmingham-diamond-league form input[type=submit].secondary-btn:hover,
.birmingham-diamond-league form input.secondary-btn:hover {
    background-color: #1B253D;
    color: #ffffff;
}
.birmingham-diamond-league button[disabled].button:hover,
.birmingham-diamond-league input[type=primary-btn][disabled]:hover,
.birmingham-diamond-league input[type=submit][disabled].primary-btn:hover,
.birmingham-diamond-league input[type=submit][disabled].button:hover,
.birmingham-diamond-league input[type=submit][disabled].secondary-btn:hover {
    background-color: #dd534b;
}
.birmingham-diamond-league button[disabled].button:hover,
.birmingham-diamond-league input[type=secondary-btn][disabled]:hover,
.birmingham-diamond-league input[type=submit][disabled].secondary-btn:hover {
    background-color: #b3322b;
}
.birmingham-diamond-league .paypal-btn {
    background: #ffc439;
    border-color: #ffc439;
}

/* ====== BDL STYLES ====== */
/* ======
BASE STYLES
    - TYPOGRAPHY STYLES
    - HEADER
====== */
.prep-the-pool header.top .logo {
    background-image: url(/Content/img/prep-the-pool.png);
}
.prep-the-pool .primary-btn, .prep-the-pool .button,
.prep-the-pool input[type=primary-btn],
.prep-the-pool input[type=submit].primary-btn, .prep-the-pool input[type=submit].secondary-btn,
.prep-the-pool .btn-primary {
    background-color: #00b6f8;
    border: none;
    color: #ffffff;
}
.prep-the-pool .primary-btn:hover, .prep-the-pool .button:hover,
.prep-the-pool input[type=primary-btn]:hover, .prep-the-pool input[type=submit].secondary-btn:hover,
.prep-the-pool .btn-primary:hover {
    background-color: #81201B;
    color: #ffffff;
}
.prep-the-pool .secondary-btn,
.prep-the-pool form input[type=submit].secondary-btn,
.prep-the-pool form input.secondary-btn {
    background-color: #e8308a;
    border: none;
    color: #ffffff;
}
.prep-the-pool .secondary-btn:hover,
.prep-the-pool form input[type=submit].secondary-btn:hover,
.prep-the-pool form input.secondary-btn:hover {
    background-color: #1B253D;
    color: #ffffff;
}
.prep-the-pool button[disabled].button:hover,
.prep-the-pool input[type=primary-btn][disabled]:hover,
.prep-the-pool input[type=submit][disabled].primary-btn:hover,
.prep-the-pool input[type=submit][disabled].button:hover,
.prep-the-pool input[type=submit][disabled].secondary-btn:hover {
    background-color: #e3e3e3;
}
.prep-the-pool button[disabled].button:hover,
.prep-the-pool input[type=secondary-btn][disabled]:hover,
.prep-the-pool input[type=submit][disabled].secondary-btn:hover {
    background-color: #e8308a;
}
.prep-the-pool .paypal-btn {
    background: #ffc439;
    border-color: #ffc439;
}

}



.mkdons .notification {
    background-color: #fc4020;
}