:root {
    --grey-dark:#4c4c4e;
--grey-mid:#b6b6b7;
--grey-light:#eeeff0;
--grey-tint:#f6f7f7;
--brand-color-1:#181d44;
--brand-color-2:#d3127f;
--brand-color-3:#f17fb2;
--brand-color-4:#a42d91;
--brand-color-5:#ec7f37;
--brand-black:#000000;
--brand-white:#ffffff;
--brand-gray:#efefef;
    --colour-default-text: var(--brand-black);
    --colour-default-headers: var(--brand-color-4);
    --colour-default-hover: $mainMenuHoverColour;
    --colour-default-link: var(--brand-color-1);
    --colour-default-link-hover: var(--brand-color-1);
    --colour-feature-link: var(--brand-color-5);
    --colour-feature-link-hover: var(--grey-tint);
    --colour-block-colour-text: var(--brand-white);
    /*TODO FILTER
--colour-feature-filter: var(--colour-filter-orange-light);
--colour-feature-filter-mid: var(--colour-filter-orange-mid);
--colour-feature-svg-filter: var(--colour-filter-svg-orange-mid);*/
    --mobile-menu-default-bg-colour: var(--brand-color-4);
    --mobile-menu-open-bg-colour: var(--brand-color-2);
    --mobile-menu-bg1: var(--brand-white);
    --mobile-menu-link-colour: $mobileMenuLinkColour;
    --mobile-menu-link-hover-colour: var(--brand-color-2);
    /*TODO FILTER
--colour-bullet-ul: var(--colour-filter-orange-light);*/
    --colour-bullet-ol: var(--brand-color-5);
    --colour-article-link: ;
    --colour-listing-news: ;
    --colour-listing-type1: $webinarListArticleTopBorderColour;
    --colour-listing-type2: $conferenceListArticleTopBorderColour;
    --colour-image-background: ;
    --colour-quote-author: ;
    --font-face-base: base;
    --font-face-feature: feature;
    --background-colour-agenda-block: ;
    --text-colour-agenda-block: ;
    --colour-agenda-block-default-session-background-colour: ;
    --colour-agenda-block-default-session-text-colour: ;
    --colour-agenda-block-grouped-sessions-background-colour: ;
    --colour-agenda-block-keynote-outline: ;
    --colour-agenda-block-break-or-meal-background: ;
    --colour-agenda-block-break-or-meal-text: ;
    --colour-agenda-block-announcement-background: ;
    --colour-agenda-block-announcement-text: ;
    --colour-hero-btn-background: $heroButtonBackgroundColour;
    --colour-hero-btn-text: $heroButtonTextColour;
    --colour-hero-btn-background-hover: $heroButtonBackgroundHoverColour;
    --colour-hero-btn-text-hover: $heroButtonTextHoverColour;
    --colour-hero-btn-page-name: $heroButtonPageNameColour;
    --colour-hero-btn-page-name-hover: $heroButtonPageNameHoverColour;
    --svg-colour1: var(--brand-color-4);
    --svg-colour2: var(--grey-dark);
    --svg-colour3: var(--brand-white);
}
    /*TODO
    $link-icon-filter: var(--colour-filter-blue-light);
--link-icon-filter: $$*/
}

@font-face { font-family: base; font-style: normal; font-weight: 300;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-light.ttf') format("truetype"); }.base-300 { font-weight: 300;}@font-face { font-family: base; font-style: normal; font-weight: 400;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-regular.ttf') format("truetype"); }.base-400 { font-weight: 400;}@font-face { font-family: base; font-style: normal; font-weight: 500;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-medium.ttf') format("truetype"); }.base-500 { font-weight: 500;}@font-face { font-family: base; font-style: normal; font-weight: 600;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-semibold.ttf') format("truetype"); }.base-600 { font-weight: 600;}@font-face { font-family: base; font-style: normal; font-weight: 700;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-bold.ttf') format("truetype"); }.base-700 { font-weight: 700;}@font-face { font-family: base; font-style: normal; font-weight: 900;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-black.ttf') format("truetype"); }.base-900 { font-weight: 900;}@font-face { font-family: feature; font-style: normal; font-weight: 300;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-light.ttf') format("truetype"); }.feature-300 { font-weight: 300;}@font-face { font-family: feature; font-style: normal; font-weight: 500;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-medium.ttf') format("truetype"); }.feature-500 { font-weight: 500;}@font-face { font-family: feature; font-style: normal; font-weight: 600;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-semibold.ttf') format("truetype"); }.feature-600 { font-weight: 600;}@font-face { font-family: feature; font-style: normal; font-weight: 700;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-bold.ttf') format("truetype"); }.feature-700 { font-weight: 700;}@font-face { font-family: feature; font-style: normal; font-weight: 900;  src: url('/events/553b69dd-99b5-4522-bfb6-cfcca328f145/fonts/roboto-black.ttf') format("truetype"); }.feature-900 { font-weight: 900;}
/* ------------------ */
/* --- BASE --- */
/* ------------------ */
html, body {
    color: var(--colour-default-text);
    font-family: var(--font-face-base)
}

/*TODO
[class*="icon-"] .ic::before {
    filter: var(--colour-feature-filter);
}*/

[class*="icon-"] .ic::after {
    filter: var(--colour-filter-orange-mid);
}

h1.divider::after,
h2.divider::after,
h3.divider::after,
h4.divider::after,
h5.divider::after,
h6.divider::after {
    background: var(--colour-default-underline);
}

.t-c-grey-dark, .hover\:t-c-grey-dark:hover, .hover\:t-c-grey-dark:focus, .hover\:t-c-grey-dark:active {color:var(--grey-dark);} .t-c-grey-mid, .hover\:t-c-grey-mid:hover, .hover\:t-c-grey-mid:focus, .hover\:t-c-grey-mid:active {color:var(--grey-mid);} .t-c-grey-light, .hover\:t-c-grey-light:hover, .hover\:t-c-grey-light:focus, .hover\:t-c-grey-light:active {color:var(--grey-light);} .t-c-grey-tint, .hover\:t-c-grey-tint:hover, .hover\:t-c-grey-tint:focus, .hover\:t-c-grey-tint:active {color:var(--grey-tint);} .t-c-brand-color-1, .hover\:t-c-brand-color-1:hover, .hover\:t-c-brand-color-1:focus, .hover\:t-c-brand-color-1:active {color:var(--brand-color-1);} .t-c-brand-color-2, .hover\:t-c-brand-color-2:hover, .hover\:t-c-brand-color-2:focus, .hover\:t-c-brand-color-2:active {color:var(--brand-color-2);} .t-c-brand-color-3, .hover\:t-c-brand-color-3:hover, .hover\:t-c-brand-color-3:focus, .hover\:t-c-brand-color-3:active {color:var(--brand-color-3);} .t-c-brand-color-4, .hover\:t-c-brand-color-4:hover, .hover\:t-c-brand-color-4:focus, .hover\:t-c-brand-color-4:active {color:var(--brand-color-4);} .t-c-brand-color-5, .hover\:t-c-brand-color-5:hover, .hover\:t-c-brand-color-5:focus, .hover\:t-c-brand-color-5:active {color:var(--brand-color-5);} .t-c-brand-black, .hover\:t-c-brand-black:hover, .hover\:t-c-brand-black:focus, .hover\:t-c-brand-black:active {color:var(--brand-black);} .t-c-brand-white, .hover\:t-c-brand-white:hover, .hover\:t-c-brand-white:focus, .hover\:t-c-brand-white:active {color:var(--brand-white);} .t-c-brand-gray, .hover\:t-c-brand-gray:hover, .hover\:t-c-brand-gray:focus, .hover\:t-c-brand-gray:active {color:var(--brand-gray);}

.bg-grey-dark, .hover\:bg-grey-dark:hover, .hover\:bg-grey-dark:focus, .hover\:bg-grey-dark:active, .simple.hover\:bg-grey-dark:hover, .simple.hover\:bg-grey-dark:focus, .simple.hover\:bg-grey-dark:active {background-color:var(--grey-dark);} .bg-grey-mid, .hover\:bg-grey-mid:hover, .hover\:bg-grey-mid:focus, .hover\:bg-grey-mid:active, .simple.hover\:bg-grey-mid:hover, .simple.hover\:bg-grey-mid:focus, .simple.hover\:bg-grey-mid:active {background-color:var(--grey-mid);} .bg-grey-light, .hover\:bg-grey-light:hover, .hover\:bg-grey-light:focus, .hover\:bg-grey-light:active, .simple.hover\:bg-grey-light:hover, .simple.hover\:bg-grey-light:focus, .simple.hover\:bg-grey-light:active {background-color:var(--grey-light);} .bg-grey-tint, .hover\:bg-grey-tint:hover, .hover\:bg-grey-tint:focus, .hover\:bg-grey-tint:active, .simple.hover\:bg-grey-tint:hover, .simple.hover\:bg-grey-tint:focus, .simple.hover\:bg-grey-tint:active {background-color:var(--grey-tint);} .bg-brand-color-1, .hover\:bg-brand-color-1:hover, .hover\:bg-brand-color-1:focus, .hover\:bg-brand-color-1:active, .simple.hover\:bg-brand-color-1:hover, .simple.hover\:bg-brand-color-1:focus, .simple.hover\:bg-brand-color-1:active {background-color:var(--brand-color-1);} .bg-brand-color-2, .hover\:bg-brand-color-2:hover, .hover\:bg-brand-color-2:focus, .hover\:bg-brand-color-2:active, .simple.hover\:bg-brand-color-2:hover, .simple.hover\:bg-brand-color-2:focus, .simple.hover\:bg-brand-color-2:active {background-color:var(--brand-color-2);} .bg-brand-color-3, .hover\:bg-brand-color-3:hover, .hover\:bg-brand-color-3:focus, .hover\:bg-brand-color-3:active, .simple.hover\:bg-brand-color-3:hover, .simple.hover\:bg-brand-color-3:focus, .simple.hover\:bg-brand-color-3:active {background-color:var(--brand-color-3);} .bg-brand-color-4, .hover\:bg-brand-color-4:hover, .hover\:bg-brand-color-4:focus, .hover\:bg-brand-color-4:active, .simple.hover\:bg-brand-color-4:hover, .simple.hover\:bg-brand-color-4:focus, .simple.hover\:bg-brand-color-4:active {background-color:var(--brand-color-4);} .bg-brand-color-5, .hover\:bg-brand-color-5:hover, .hover\:bg-brand-color-5:focus, .hover\:bg-brand-color-5:active, .simple.hover\:bg-brand-color-5:hover, .simple.hover\:bg-brand-color-5:focus, .simple.hover\:bg-brand-color-5:active {background-color:var(--brand-color-5);} .bg-brand-black, .hover\:bg-brand-black:hover, .hover\:bg-brand-black:focus, .hover\:bg-brand-black:active, .simple.hover\:bg-brand-black:hover, .simple.hover\:bg-brand-black:focus, .simple.hover\:bg-brand-black:active {background-color:var(--brand-black);} .bg-brand-white, .hover\:bg-brand-white:hover, .hover\:bg-brand-white:focus, .hover\:bg-brand-white:active, .simple.hover\:bg-brand-white:hover, .simple.hover\:bg-brand-white:focus, .simple.hover\:bg-brand-white:active {background-color:var(--brand-white);} .bg-brand-gray, .hover\:bg-brand-gray:hover, .hover\:bg-brand-gray:focus, .hover\:bg-brand-gray:active, .simple.hover\:bg-brand-gray:hover, .simple.hover\:bg-brand-gray:focus, .simple.hover\:bg-brand-gray:active {background-color:var(--brand-gray);}
/* ------------------ */
/* --- chrome --- */
/* ------------------ */
footer.sitefooter h2 {
    color: var(--colour-feature-link);
}

/* ------------------ */
/* --- TYPOGRAPHY --- */
/* ------------------ */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-face-feature);
}

ul > li::before {
    /*TODO
        filter: $colour-bullet-ul;
    */
}

ol > li:before {
    color: var(--colour-bullet-ol);
}

/* ------------------ */
/* ----- FORMS ------ */
/* ------------------ */

.faq-form button.clearfaqs::before,
.faq-form button.clearfaqs::after {
    background: var(--colour-default-text);
}

form:not(.mktoForm) button.block {
    background: var(--colour-default-link);
}

form:not(.mktoForm) button.block:hover,
form:not(.mktoForm) button.block:focus,
form:not(.mktoForm) button.block:active {
    background: var(--colour-default-link-hover);
}

.searchresults article.searchitem .breadcrumbs a::after {
    background: var(--colour-default-link);
}

.searchresults #search-paging a.selected-page {
    background-color: var(--colour-default-link);
}

/* ------------------ */
/* --- SKIP LINKS --- */
/* ------------------ */
.skiplinks a {
    background: var(--colour-feature-link);
}

/* ---------------- */
/* --- MAIN NAV --- */
/* ---------------- */
header.siteheader .topline .right ul {
    background-color: var(--mobile-menu-bg1);
    background-image: none;
}

@media (min-width: 1200px) {
    header.siteheader .topline .right ul {
        background-color: transparent;
    }
}

header.siteheader .topline .right label,
header.siteheader .topline .right a {
    color: var(--mobile-menu-link-colour);
}

header.siteheader .topline .right label:hover,
header.siteheader .topline .right label:focus,
header.siteheader .topline .right label:active,
header.siteheader .topline .right a:hover,
header.siteheader .topline .right afocus,
header.siteheader .topline .right a:active {
    color: var(--mobile-menu-link-hover-colour);
}

header.siteheader .topline .right a.basket,
header.siteheader .topline .right a.login,
header.siteheader .topline .right label[for="toggle_search"] {
    border-color: var(--colour-feature-link);
}

header.siteheader .topline .right a.basket:hover,
header.siteheader .topline .right a.login :hover,
header.siteheader .topline .right label[for="toggle_search"]:hover,
header.siteheader .topline .right a.basket:focus,
header.siteheader .topline .right a.login:focus,
header.siteheader .topline .right label[for="toggle_search"]:focus,
header.siteheader .topline .right a.basket:active,
header.siteheader .topline .right a.login:active,
header.siteheader .topline .right label[for="toggle_search"]:active {
    border-color: var(--colour-feature-link-hover);
    background-color: var(--colour-feature-link-hover);
}

@media (min-width: 1200px) {
    header.siteheader .topline .right a.login {
        background-color: var(--colour-feature-link);
    }

    header.siteheader .topline .right a.login:hover,
    header.siteheader .topline .right a.login:focus,
    header.siteheader .topline .right a.login:active {
        color: var(--colour-default-text);
        background-color: var(--colour-feature-link-hover);
    }
}

header.siteheader .topline .right label[for="toggle_menu"] {
    background-color: var(--mobile-menu-default-bg-colour);
}

header.siteheader .topline .right label[for="toggle_menu"]:hover {
    background-color: var(--mobile-menu-open-bg-colour);
}

header.siteheader .topline .right label[for="toggle_menu"] span:hover {
    background-color: var(--mobile-menu-open-bg-colour);
}

header.siteheader input#toggle_menu:checked ~ .topline .right label[for="toggle_menu"] {
    background-color: var(--mobile-menu-open-bg-colour);
}

header.siteheader .searchblock {
    background-color: var(--colour-feature-link);
}

ul.social a:hover,
ul.social a:focus,
ul.social a:active {
    filter: var(--colour-feature-filter);
}

/* ---------------- */
/* --- LINKS ------ */
/* ---------------- */
a {
    color: var(--colour-default-link);
}

a:hover,
a:focus,
a:active {
    color: var(--colour-default-link-hover);
}

a.download {
    background: var(--colour-default-link);
}

a.download:hover,
a.download:focus,
a.download:active {
    background: var(--colour-default-link-hover);
}

a.link-arrow.simple,
a > span.link-arrow.simple {
    color: var(--colour-block-colour-text);
}

.simple hover:bg-white {
    color: var(--colour-default-text);
}

a.link-block.bg-image {
    background-color: var(--colour-image-background);
}

a.link-arrow.simple:not([class*="hover:bg-"])
a > span.link-arrow.simple:not([class*="hover:bg-"]) {
    background-color: var(--colour-feature-link);
}

a.link-arrow.simple:not([class*="hover:bg-"]):hover,
a > span.link-arrow.simple:not([class*="hover:bg-"]):hover,
a.link-arrow.simple:not([class*="hover:bg-"]):focus,
a > span.link-arrow.simple:not([class*="hover:bg-"]):focus,
a.link-arrow.simple:not([class*="hover:bg-"]):active,
a > span.link-arrow.simple:not([class*="hover:bg-"]):active {
    background-color: var(--colour-feature-link-hover);
}

a.link-listing,
a.link-article,
div.link-listing a,
div.link-article a {
    color: var(--colour-default-text);
}

a.link-listing .image,
a.link-article .image,
div.link-listing a .image,
div.link-article a .image {
    background-color: var(--colour-image-background);
}

a.link-article,
div.link-article a {
    background: var(--colour-article-link);
}

a.link-article .article p.type,
div.link-article a .article p.type {
    background: var(--colour-default-link);
}

a.link-article .excerpt,
div.link-article a .excerpt {
    background: var(--colour-feature-link);
}

a.link-article .excerpt p.type,
div.link-article a .excerpt p.type {
    /*TODO checkcolour*/
    color: var(--colour-default-link);
}

a.link-article .excerpt p.type,
div.link-article a .excerpt p.type {
    /*TODO
    background-image: linear-gradient(180deg, rgba(red($colour-feature-link),green($colour-feature-link),blue($colour-feature-link),0) 0%, rgba(red($colour-feature-link),green($colour-feature-link),blue($colour-feature-link),1) 50%, $colour-feature-link 100%);
*/
    background-image: none;
    background-color: var(--colour-feature-link);
}

a.link-listing.type-news, div.link-listing.type-news a {
    border-color: var(--colour-listing-news);
}

a.link-listing.type-webinar, div.link-listing.type-webinar a {
    border-color: var(--colour-listing-type1);
}

a.link-listing.type-conference, div.link-listing.type-conference a {
    border-color: var(--colour-listing-type2);
}

a.link-listing, div.link-listing a {
    border-top-color: var(--colour-default-text);
}

a.link-listing:hover .article h3,
div.link-listing a:hover .article h3,
a.link-listing:focus .article h3,
div.link-listing a:focus .article h3,
a.link-listing:active .article h3,
div.link-listing a:active .article h3 {
    color: var(--colour-feature-link-hover);
}

/* ---------------- */
/* -- QUOTE BLOCK-- */
/* ---------------- */
.quote-block .quote-author-details {
    color: var(--colour-quote-author);
}

/* ---------------- */
/* ---- MODALS ---- */
/* ---------------- */
.detail-modal h3 {
    color: var(--colour-default-headers);
}

.detail-modal .close {
    background: var(--colour-default-link);
}

.detail-modal .close:hover {
    background: var(--colour-default-link-hover);
}

.detail-modal .close:hover::before,
.detail-modal .close:hover::after {
    /*TODO checkcolour*/
    background-color: var(--colour-default-link);
}

/* ---------------- */
/* --- ARTICLES --- */
/* ---------------- */
.article-filter .filter h3 {
    color: var(--colour-feature-link);
}

.article-filter .filter h3:hover,
.article-filter .filter h3:focus,
.article-filter .filter h3:active {
    color: var(--colour-feature-link-hover);
}

.article-filter .filter h3:hover label::before,
.article-filter .filter h3:focus label::before,
.article-filter .filter h3:active label::before {
    color: var(--colour-feature-link-hover);
}

.article-filter .filter h3 label::before {
    background-color: var(--colour-feature-link);
}

.article-filter .filter .filter-item > input:checked ~ label::before {
    color: var(--colour-feature-link);
}

.article-index .item-paging > app-paging > div.active {
    background: var(--colour-feature-link);
}

.article-index .item-paging > app-paging > div:hover,
.article-index .item-paging > app-paging > div:focus,
.article-index .item-paging > app-paging > div:active {
    background-color: var(--colour-feature-link);
}

.article-index .item-paging > app-paging > div.load-more {
    background: var(--colour-feature-link);
}

.article-index .item-paging > app-paging > div.load-more:hover,
.article-index .item-paging > app-paging > div.load-more:focus,
.article-index .item-paging > app-paging > div.load-more:active {
    background-color: var(--colour-feature-link-hover);
}

article.info-article header.header-article h1 {
    color: var(--colour-default-text);
}

article.info-article header.header-article p span::after {
    border-left-color: var(--colour-default-link);
}

article.info-article aside.meta time {
    background-color: var(--colour-article-link);
}

.featured-article a:hover h3,
.featured-article a:focus h3,
.featured-article a:active h3 {
    color: var(--colour-feature-link-hover);
}

.featured-article p.featured {
    background-color: var(--colour-default-link);
}

.agenda-block .agenda-block-tabs .agenda-block-tab {
    border-color: var(--background-colour-agenda-block);
    color: var(--background-colour-agenda-block);
}

.agenda-block .agenda-block-tabs .agenda-block-tab.agenda-block-tab-active {
    background-color: var(--background-colour-agenda-block);
    color: var(--text-colour-agenda-block);
}

.agenda-block .agenda-block-tabs .agenda-block-tab:hover {
    background-color: var(--background-colour-agenda-block);
    color: var(--text-colour-agenda-block);
}

.agenda-block .agenda-block-date .agenda-block-header {
    background-color: var(--background-colour-agenda-block);
    color: var(--text-colour-agenda-block);
}

.agenda-block .agenda-block-group {
  background-color: var(--colour-agenda-block-grouped-sessions-background-colour);
}

.agenda-block .agenda-block-content {
  background-color: var(--colour-agenda-block-default-session-background-colour);
  color:  var(--colour-agenda-block-default-session-text-colour);
}

.agenda-block .agenda-block-content.agenda-block-keynote {
  border: 2px solid var(--colour-agenda-block-keynote-outline);
}

.agenda-block .agenda-block-content.agenda-block-break-or-meal {
  background-color: var(--colour-agenda-block-break-or-meal-background);
  color: var(--colour-agenda-block-break-or-meal-text)
}

.agenda-block .agenda-block-content.agenda-block-announcement {
  background-color: var(--colour-agenda-block-announcement-background);
  color: var(--colour-agenda-block-announcement-text)
}

header.page-header .hero-button {
  background-color: var(--colour-hero-btn-background);
  color: var(--colour-hero-btn-text);
}

header.page-header .hero-button:hover {
  background-color: var(--colour-hero-btn-background-hover);
  color: var(--colour-hero-btn-text-hover);
}

header.page-header .hero-button:hover::after {
  -webkit-filter: none;
          filter: none;
}

header.page-header .hero-button::after {
  -webkit-filter: none;
          filter: none;
}

header.page-header .hero-button-page-name {
  color: var(--colour-hero-btn-page-name);
}

header.page-header .hero-button-page-name:hover {
  color: var(--colour-hero-btn-page-name-hover);
}