:root {
    --font_family: "Akkurat", sans-serif;

    --cookie_bar_background: #fff5b9;
    --cookie_bar_text_colour: #00006b;
    --cookie_bar_control: #800080;
    --cookie_bar_control_copy: #FFFFFF;
    --cookie_bar_switch_active: #2196F3;
    --cookie_bar_switch_active_copy: #FFFFFF;
    --cookie_bar_switch_inactive: #cccccc;
    --cookie_bar_switch_inactive_copy: #666666;

    --navbar_main_logo_width: 200px;
    --navbar_main_logo_height: 50px;
    --navbar_main_logo_margin_top: 0px;
    --navbar_main_background: #FFFFFF;
    --navbar_main_link_colour: #00006B;
    --navbar_main_link_hover_colour: rgba(0,0,107,1);
    --navbar_main_border: #FFFFFF;
    --navbar_main_border_size: 0px;
    --navbar_main_link_active_colour: #00006B;
    --navbar_main_alignment: right;

    --navbar_main_hamburger: #00006B;
    --navbar_main_hamburger_background: #FFFFFF;

    --navbar_top_background: #FFFFFF;
    --navbar_top_text_colour: #FFFFFF;
    --navbar_top_link_colour: #FFFFFF;
    --navbar_top_link_background_colour: #FFFFFF;
    --navbar_top_link_hover_colour: #660000;
    --navbar_top_link_background_hover_colour: #660000;
    --navbar_top_link_active_colour: #660000;
    --navbar_top_link_background_active_colour: #FFFFFF;
    --navbar_top_link_focus_colour: #660000;
    --navbar_top_link_background_focus_colour: #FFFFFF;

    --navbar_bottom_background: #FFF5B9;
    --navbar_bottom_text_colour: #00006B;
    --navbar_bottom_link_colour: #00006B;
    --navbar_bottom_link_background_colour: #FFF5B9;
    --navbar_bottom_link_hover_colour: #00006B;
    --navbar_bottom_link_background_hover_colour: #FFF5B9;
    --navbar_bottom_link_active_colour: #00006B;
    --navbar_bottom_link_background_active_colour: #FFF5B9;
    --navbar_bottom_link_focus_colour: #00006B;
    --navbar_bottom_link_background_focus_colour: #FFF5B9;

    --side_menu_header_background: #FFFFFF;
    --side_menu_main_background: #00006B;
    --side_menu_title_colour: #000000;
    --side_menu_title_font_size: 16px;
    --side_menu_close_background_colour: #00006B;
    --side_menu_close_forefront_colour: #FFFFFF;
    --side_menu_item_background_colour: transparent;
    --side_menu_item_border_colour: #EAEDF2;
    --side_menu_item_copy_colour: #FFFFFF;
    --side_menu_item_font_size: 16px;

    --banner_position: center;
    --banner_height: 36vw;
    --banner_margin_top: 0px;
    --banner_margin_bottom: 0px;
    --banner_hero_width: 801px;
    --banner_hero_background: transparent;
    --banner_hero_colour: #FFFFFF;
    --banner_hero_title_font_size: 60px;
    --banner_hero_content_font_size: 20px;
    --banner_overlay_colour: rgba(0,0,0,.2);
    --banner_hero_title_text_shadow: 2px 2px 3px rgba(0,0,0,0.3);
    --banner_hero_content_text_shadow: 2px 2px 3px rgba(0,0,0,0.3);

    --mobile_banner_height: 80vw;
    --mobile_banner_hero_title_font_size: 30px;
    --mobile_banner_hero_content_font_size: 14px;

    --content_background_colour: #FFFFFF;
    --content_link_colour: #00006B;
    --content_font_colour: #00006B;
    --content_bold_colour: #00006B;
    --content_italics_colour: #00006B;
    --content_form_label_colour: #00006B;
    --content_general_font_size: 18px;
    --content_header_h1_colour: #00006B;
    --content_header_h1_font_size: 30px;
    --content_header_h2_colour: #00006B;
    --content_header_h2_font_size: 24px;
    --content_header_h3_colour: #00006B;
    --content_header_h3_font_size: 18px;
    --content_header_h4_colour: #00006B;
    --content_header_h4_font_size: 18px;
    --content_header_h5_colour: #00006B;
    --content_header_h5_font_size: 15px;

    --footer_background: #00006b;
    --footer_text_colour: #FFFFFF;
    --footer_link_colour: #FFFFFF;
    --footer_link_hover_colour: #FFFFFF;
    --footer_link_active_colour: #FFFFFF;

    --primary_buttons_background: #4AF0BA;
    --primary_buttons_colour: #00006B;
    --primary_buttons_active_background: #4AF0BA;
    --primary_buttons_active_colour: #00006B;
    --primary_buttons_hover_background: #4AF0BA;
    --primary_buttons_hover_colour: #00006B;
    --primary_buttons_font_size: 18px;
    --primary_buttons_padding_vertical: 10px;
    --primary_buttons_padding_horizontal: 20px;
    --primary_buttons_radius: 30px;
    --primary_buttons_height: 41px;
    --primary_buttons_width: auto;

    --secondary_buttons_background: #FFF5B9;
    --secondary_buttons_colour: #00006B;
    --secondary_buttons_active_background: #00006b;
    --secondary_buttons_active_colour: #FFFFFF;
    --secondary_buttons_hover_background: #00006B;
    --secondary_buttons_hover_colour: #FFFFFF;
    --secondary_buttons_font_size: 18px;
    --secondary_buttons_padding_vertical: 10px;
    --secondary_buttons_padding_horizontal: 20px;
    --secondary_buttons_radius: 30px;
    --secondary_buttons_height: 41px;
    --secondary_buttons_width: auto;

    --raf_main_header: #00006B;
    --raf_sub_header: #009900;
    --raf_success_panel: #006106;
    --raf_success_panel_copy: #FFFFFF;
    --raf_info_panel: #d9f1ff;
    --raf_info_panel_copy: '##raf_info_panel_copy##';
}



body {
    font-family: var(--font_family);
}

/* region Cookie */
.cookie-banner-container .cookie-banner-control {
    color: var(--cookie_bar_control_copy);
    border-bottom-color: var(--cookie_bar_control);
}

.cookie-banner-container .cookie-banner-module .cookie-banner-content {
    background-color: var(--cookie_bar_background);
    color: var(--cookie_bar_text_colour) !important;
}

.cookie-banner-container .cookie-banner-module .cookie-banner-content a {
    color: var(--cookie_bar_text_colour) !important;
}

.slider-container .slider-control-simple {
    background-color: var(--cookie_bar_switch_inactive) !important;
}

.cookie-banner-container .slider-container .slider-control-simple:before {
    color: var(--cookie_bar_switch_inactive_copy) !important;
}

.slider-container input:checked + .slider-control-simple {
    background-color: var(--cookie_bar_switch_active) !important;
}

.cookie-banner-container .slider-container input:checked + .slider-control-simple:before {
    color: var(--cookie_bar_switch_active_copy) !important;
}

/* endregion */

/* region Nav Logo */
.nav-logo img {
    max-width: var(--navbar_main_logo_width);
    max-height: var(--navbar_main_logo_height);
    margin-top: var(--navbar_main_logo_margin_top);
    height: auto;
    width: auto;
}

/* endregion */

/* region Brand Nav Bar */
.brand-nav.navbar-head {
    background-color: var(--navbar_main_background)
}

.brand-nav.navbar-head a span {
    color: var(--navbar_main_link_colour)
}

.brand-nav.navbar-head a:hover {
    border-color: var(--navbar_main_border);
    border-bottom-width: var(--navbar_main_border_size)
}

.brand-nav.navbar-head a:hover span {
    color: var(--navbar_main_link_hover_colour);
}

.brand-nav.navbar-head a:active {
    color: var(--navbar_main_link_active_colour);
    border-color: var(--navbar_main_border);
    border-bottom-width: var(--navbar_main_border_size)
}

.navbar.has-border {
    border-bottom-color: var(--navbar_main_border);
    border-bottom-width: var(--navbar_main_border_size);
}

.navbar-main .main-nav ul li.active a,
.navbar-main .main-nav ul li:active a,
.navbar-main .main-nav ul li:hover a {
    border-color: var(--navbar_main_border);
    border-bottom-width: var(--navbar_main_border_size);
}

.brand-nav.navbar-head li.active a span,
.brand-nav.navbar-head li:active a span,
.brand-nav.navbar-head li:hover a span {
    color: var(--navbar_main_link_active_colour);
}

.navbar-main .main-nav ul {
    float: var(--navbar_main_alignment);
}

/* endregion */

/* region Side Menu */
.off-canvas-wrap .right-off-canvas-menu {
    background-color: var(--side_menu_main_background);
}

.side-menu .side-menu-header {
    background-color: var(--side_menu_header_background);
}

.side-menu .side-menu-header h1.menu-text {
    color: var(--side_menu_title_colour);
    font-size: var(--side_menu_title_font_size);
}

.side-menu .side-menu-header .close-menu {
    background-color: var(--side_menu_close_background_colour);
}

.side-menu .side-menu-header .close-menu .line-1,
.side-menu .side-menu-header .close-menu .line-2 {
    background-color: var(--side_menu_close_forefront_colour);
}

.side-menu ul li {
    background-color: var(--side_menu_item_background_colour);
    border-bottom-color: var(--side_menu_item_border_colour);
}

.side-menu ul li a {
    color: var(--side_menu_item_copy_colour);
    font-size: var(--side_menu_item_font_size);
}

/* endregion */

/* region Nav Top Bar */
.brand-nav.nav-top-bar {
    background-color: var(--navbar_top_background)
}

.brand-nav.nav-top-bar li > span {
    color: var(--navbar_top_text_colour);
}

.brand-nav.nav-top-bar li > a {
    color: var(--navbar_top_link_colour);
    background-color: var(--navbar_top_link_background_colour);
}

.brand-nav.nav-top-bar li:hover a {
    color: var(--navbar_top_link_hover_colour);
    background-color: var(--navbar_top_link_background_hover_colour);
}

.brand-nav.nav-top-bar li:active a,
.brand-nav.nav-top-bar li.active a {
    color: var(--navbar_top_link_active_colour);
    background-color: var(--navbar_top_link_background_active_colour);
}

.brand-nav.nav-top-bar li:focus a {
    color: var(--navbar_top_link_focus_colour);
    background-color: var(--navbar_top_link_background_focus_colour);
}

/* endregion */

/* region Bottom Nav Bar*/
.brand-nav.nav-bottom-bar {
    background-color: var(--navbar_bottom_background)
}

.brand-nav.nav-bottom-bar li > span {
    color: var(--navbar_bottom_text_colour);
}

.brand-nav.nav-bottom-bar li > a {
    color: var(--navbar_bottom_link_colour);
    background-color: var(--navbar_bottom_link_background_colour);
}

.brand-nav.nav-bottom-bar li:hover a {
    color: var(--navbar_bottom_link_hover_colour);
    background-color: var(--navbar_bottom_link_background_hover_colour);
}

.brand-nav.nav-bottom-bar li:active a,
.brand-nav.nav-bottom-bar li.active a {
    color: var(--navbar_bottom_link_active_colour);
    background-color: var(--navbar_bottom_link_background_active_colour);
}

.brand-nav.nav-bottom-bar li:focus a {
    color: var(--navbar_bottom_link_focus_colour);
    background-color: var(--navbar_bottom_link_background_focus_colour);
}

/* endregion */

/* region Hamburger */
.navbar-mobile .hamburger {
    color: var(--navbar_main_hamburger);
    background-color: var(--navbar_main_hamburger_background);
}

.navbar-mobile .hamburger span:after {
    box-shadow: 0 0 0 3px var(--navbar_main_hamburger), 0 12px 0 3px var(--navbar_main_hamburger), 0 24px 0 3px var(--navbar_main_hamburger);
}

/* endregion */

/* region Banner */
.banner {
    margin-top: var(--banner_margin_top);
    margin-bottom: var(--banner_margin_bottom);
}

.banner .banner-overlay {
    background-color: var(--banner_overlay_colour);
}

.banner .banner-image {
    background-position: var(--banner_position);
    min-height: var(--mobile_banner_height);
}

.banner .banner-promo .hero,
.banner .banner-promo .hero h1,
.banner .banner-promo .hero p,
.banner .banner-promo .hero .hero-content {
    color: var(--banner_hero_colour);
}

.banner .banner-promo .hero h1 {
    font-size: var(--mobile_banner_hero_title_font_size);
}

.banner .banner-promo .hero .hero-content {
    font-size: var(--mobile_banner_hero_content_font_size);
}

.banner .banner-promo .hero h1.__ts {
    text-shadow: var(--banner_hero_title_text_shadow);
}

.banner .banner-promo .hero .hero-content.__ts p {
    text-shadow: var(--banner_hero_content_text_shadow);
}

.banner .banner-promo .hero {
    background-color: var(--banner_hero_background);
}


@media (min-width: 768px) {
    .banner .banner-promo .hero {
        width: var(--banner_hero_width);
    }

    .banner .banner-image {
        min-height: var(--banner_height);
    }
}


@media (min-width: 1080px) {
    .banner .banner-promo .hero h1 {
        font-size: var(--banner_hero_title_font_size);
    }

    .banner .banner-promo .hero .hero-content {
        font-size: var(--banner_hero_content_font_size);
    }
}

/* endregion */

/* region Footer */
.footer {
    background-color: var(--footer_background);
    color: var(--footer_text_colour);
}

.footer .footer-nav > li > a {
    color: var(--footer_link_colour);
}

.footer .footer-nav > li > a:hover {
    color: var(--footer_link_hover_colour);
}

.footer .footer-nav > li > a:active {
    color: var(--footer_link_active_colour);
}

/* endregion */

/* region Buttons */
.btn.btn-primary {
    color: var(--primary_buttons_colour);
    background-color: var(--primary_buttons_background);
    border-radius: var(--primary_buttons_radius);
    padding: var(--primary_buttons_padding_vertical) var(--primary_buttons_padding_horizontal);
    font-size: var(--primary_buttons_font_size);
    width: var(--primary_buttons_width);
    height: var(--primary_buttons_height);
}

.btn.btn-primary:active,
.btn.btn-primary.active {
    color: var(--primary_buttons_active_colour);
    background-color: var(--primary_buttons_active_background);
}

.btn.btn-primary:hover {
    color: var(--primary_buttons_hover_colour);
    background-color: var(--primary_buttons_hover_background);
}

.btn.btn-secondary {
    color: var(--secondary_buttons_colour);
    background-color: var(--secondary_buttons_background);
    border-radius: var(--secondary_buttons_radius);
    padding: var(--secondary_buttons_padding_vertical) var(--secondary_buttons_padding_horizontal);
    font-size: var(--secondary_buttons_font_size);
    width: var(--secondary_buttons_width);
    height: var(--secondary_buttons_height);
}

.btn.btn-secondary:active,
.btn.btn-secondary.active {
    color: var(--secondary_buttons_active_colour);
    background-color: var(--secondary_buttons_active_background);
}

.btn.btn-secondary:hover {
    color: var(--secondary_buttons_hover_colour);
    background-color: var(--secondary_buttons_hover_background);
}

/* endregion */

/* region Content */
#main-content .main-content-copy h1,
#main-content .main-content-copy .h1,
#main-content .main-content-copy .primary {
    color: var(--content_header_h1_colour);
    font-size: var(--content_header_h1_font_size);
}

#main-content .main-content-copy h2,
#main-content .main-content-copy .h2,
#main-content .main-content-copy .secondary {
    color: var(--content_header_h2_colour);
    font-size: var(--content_header_h2_font_size);
}

#main-content .main-content-copy h3,
#main-content .main-content-copy .h3 {
    color: var(--content_header_h3_colour);
    font-size: var(--content_header_h3_font_size);
}

#main-content .main-content-copy h4,
#main-content .main-content-copy .h4 {
    color: var(--content_header_h4_colour);
    font-size: var(--content_header_h4_font_size);
}

#main-content .main-content-copy h5,
#main-content .main-content-copy .h5 {
    color: var(--content_header_h5_colour);
    font-size: var(--content_header_h5_font_size);
}

#main-content .main-content-copy a:not(.btn) {
    color: var(--content_link_colour)
}

#main-content .main-content-copy label:not(.btn, .control-label) {
    color: var(--content_font_colour);
    font-size: var(--content_general_font_size);
}

#main-content .main-content-copy li,
#main-content .main-content-copy p {
    color: var(--content_font_colour);
    font-size: var(--content_general_font_size);
}

#main-content .main-content-copy strong {
    color: var(--content_bold_colour)
}

#main-content .main-content-copy em {
    color: var(--content_italics_colour)
}

#main-content .main-content-copy label.control-label {
    color: var(--content_form_label_colour)
}

#content {
    background-color: var(--content_background_colour)
}

/* endregion */

/* region RAF */
.raf-content h1 {
    color: var(--raf_main_header) !important;
}

.raf-content h3 {
    color: var(--raf_sub_header) !important;
}

.raf .panel-success .panel-body {
    background-color: var(--raf_success_panel);
}

.raf .panel-success .panel-body p,
.raf .panel-success .panel-body li {
    color: var(--raf_success_panel_copy) !important;
}

.raf .panel-success .panel-body h1 {
    color: var(--raf_success_panel_copy) !important;
}

.raf .panel-info .panel-body {
    background-color: var(--raf_info_panel);
}

/* endregion */