/* Font-primary */
@font-face {
    font-family: 'Gilroy';
    src: url('/media/00qp4fvj/gilroy-extrabold.ttf');
    font-weight: 400;
}
 
@font-face {
    font-family: 'Gilroy';
    src: url('/media/00qp4fvj/gilroy-extrabold.ttf');
    font-weight: 700;
}
 
 
/* Font-secondary */
@font-face {
    font-family: 'Gilroy';
    src: url('/media/jefnmhqb/gilroy-regular.ttf');
    font-weight: 400;
}
 
@font-face {
    font-family: 'Gilroy';
    src: url('/media/jefnmhqb/gilroy-regular.ttf');
    font-weight: 500;
}
 
@font-face {
    font-family: 'Gilroy';
    src: url('/media/jefnmhqb/gilroy-regular.ttf');
    font-weight: 600;
}
 
@font-face {
    font-family: 'Gilroy';
    src: url('/media/ckejupap/gilroy-medium.ttf');
    font-weight: 700;
}
 
 
:root {
    /* Brand colours */
    --primary-color: #00b8b0;
    --secondary-color: #004e59;
    --tertiary-color: #007398;
    --bg-dark: #004e59;
    --bg-light: #f1f0f1;
 
    /* Text colours */
    --label-dark: #004e59;
    --label-light: #ffffff;
    --alternate-label-dark: #ffffff;
    --alternate-label-light: #004e59;
    --headline-dark: #004e59;
    --headline-light: #ffffff;
    --alternate-headline-dark: #ffffff;
    --alternate-headline-light: #004e59;
    --body-text-dark: #004e59;
    --body-text-light: #ffffff;
    --alternate-body-text-dark: #ffffff;
    --alternate-body-text-light: #004e59;
		--footer-logo-size: 140px;
		--header-logo-scale: 1.5;
 
    /* UI elements colours */
    --extra-light-color: #f1f0f1;
    --light-color: #dedddf;
    --medium-color: #dedddf;
    --strong-color: #dedddf;
 
    /* Link colours */
    --link-color: #004e59;
    --link-icon-color: #00b8b0;
    --link-underline-color: #00b8b0;
    --link-light-color: #ffffff;
    --link-light-icon-color: #ffffff;
    --link-light-underline-color: #ffffff;
 
    /* Buttons colours */
    --primary-button-color: #00b8b0;
    --primary-button-text-color: #00343b;
    --primary-button-hover-color: #00343b;
    --primary-button-hover-text-color: #ffffff;
    --primary-button-outline-color: transparent;
    --primary-light-button-color: #00b8b0;
    --primary-light-button-text-color: #00343b;
    --primary-light-button-hover-color: #f1f0f1;
    --primary-light-button-hover-text-color: #00343b;
    --primary-light-button-outline-color: transparent;
    --secondary-button-color: #ffffff;
    --secondary-button-text-color: #004e59;
    --secondary-button-hover-color: #00343b;
    --secondary-button-hover-text-color: #ffffff;
    --secondary-button-outline-color: #004e59;
    --secondary-light-button-color: #ffffff;
    --secondary-light-button-text-color: #004e59;
    --secondary-light-button-hover-color: #f1f0f1;
    --secondary-light-button-hover-text-color: #004e59;
    --secondary-light-button-outline-color: #004e59;
    --tertiary-button-color: #007398;
    --tertiary-button-text-color: #ffffff;
    --tertiary-button-hover-color: #0c0c0c;
    --tertiary-button-hover-text-color: #ffffff;
    --tertiary-button-outline-color: transparent;
    --tertiary-light-button-color: #007398;
    --tertiary-light-button-text-color: #ffffff;
    --tertiary-light-button-hover-color: #0c0c0c;
    --tertiary-light-button-hover-text-color: #ffffff;
    --tertiary-light-button-outline-color: transparent;
 
    /* Lightbox colours */
    --lightbox-bg-color: #01191c;
    --lightbox-opacity: 80%;
 
    /* Table colours */
    --table-header-text-color: #004e59;
 
    /* Header colours */
    --header-bar-color: #ffffff;
    --header-text-color: #004e59;
    --header-hover-color: #004e59;
    --header-underline-color: #00b8b0;
    --header-separator-line: #dedddf;
    --utility-bar-color: #ffffff;
    --utility-text-color: #004e59;
    --utility-hover-color: #004e59;
    --share-price-color: #00b8b0;
    --dropdown-nav-color: #ffffff;
    --dropdown-title-color: #00b8b0;
    --dropdown-text-color: #004e59;
    --dropdown-hover-color: #004e59;
 
    /* Breadcrumbs colours */
    --breadcrumbs-bg-color: #ffffff;
    --breadcrumbs-text-color: #004e59;
    --breadcrumbs-separator-line: #00b8b0;
 
    /* Footer colours */
    --footer-bg-color: #f1f0f1;
    --footer-text-color: #004e59;
    --copyright-bar-color: #004e59;
    --copyright-text-color: #ffffff;
    --footer-accent-color: #bf311a;
    --footer-link-underline-color: #00b8b0;
    --footer-separator-line: #dedddf;
 
    /* Footer Back to top button colours */
    --footer-button-color: var(--secondary-button-color);
    --footer-button-text-color: var(--secondary-button-text-color);
    --footer-button-hover-color: var(--secondary-button-hover-color);
    --footer-button-hover-text-color: var(--secondary-button-hover-text-color);
    --footer-button-outline-color: var(--secondary-button-outline-color);
 
    /* Play video colours */
    --play-button-color: var(--primary-light-button-color);
    --play-button-text-color: var(--primary-light-button-text-color);
    --play-button-hover-color: var(--primary-light-button-hover-color);
    --play-button-hover-text-color: var(--primary-light-button-hover-text-color);
    --play-button-outline-color: var(--primary-light-button-outline-color);
 
    /* Lightbox button colours */
    --lightbox-button-color: var(--tertiary-button-color);
    --lightbox-button-text-color: var(--tertiary-button-text-color);
    --lightbox-button-hover-color: var(--tertiary-button-hover-color);
    --lightbox-button-hover-text-color: var(--tertiary-button-hover-text-color);
    --lightbox-button-outline-color: var(--tertiary-button-outline-color);
 
    /* Download image card button */
    --download-button-color: var(--primary-button-color);
    --download-button-text-color: var(--primary-button-text-color);
    --download-button-hover-color: var(--primary-button-hover-color);
    --download-button-hover-text-color: var(--primary-button-hover-text-color);
    --download-button-outline-color: var(--primary-button-outline-color);
 
    /* Download image popup button */
    --popup-download-button-color: var(--tertiary-button-color);
    --popup-download-button-text-color: var(--tertiary-button-text-color);
    --popup-download-button-hover-color: var(--tertiary-button-hover-color);
    --popup-download-button-hover-text-color: var(--tertiary-button-hover-text-color);
    --popup-download-button-outline-color: var(--tertiary-button-outline-color);
 
    /* Copy link button */
    --copy-link-color: var(--primary-button-color);
    --copy-link-text-color: var(--primary-button-text-color);
    --copy-link-hover-color: var(--primary-button-hover-color);
    --copy-link-hover-text-color: var(--primary-button-hover-text-color);
    --copy-link-outline-color: var(--primary-button-outline-color);
 
    /* Search submit button */
    --search-button-color: var(--tertiary-button-color);
    --search-button-text-color: var(--tertiary-button-text-color);
    --search-button-hover-color: var(--tertiary-button-hover-color);
    --search-button-hover-text-color: var(--tertiary-button-hover-text-color);
    --search-button-outline-color: var(--tertiary-button-outline-color);
 
    /* Typography */
    --primary-font-family: 'Gilroy';
    --secondary-font-family: 'Gilroy';
    --primary-root-size: 18;
    --secondary-root-size: 20;
    --primary-letter-spacing: 0;
    --secondary-letter-spacing: 0;
    --primary-line-height: 1.2;
    --secondary-line-height: 1.4;
 
    --heading-font-weight: 800;
    --buttons-font-weight: 800;
 
    /* Typography parameters necessary for calculating a fluid grid for desktop - not editable */
    --window-width: 1920;
    --primary-ratio: calc(var(--window-width) / var(--primary-root-size));
    --secondary-ratio: calc(var(--window-width) / var(--secondary-root-size));
}
 
/* Button icons */
.icon--accordion-plus::after {
    content: '\f275';
}
 
.icon--accordion-minus::after {
    content: '\f270';
}
 
.icon--btn-right {
    display: block !important;
}
 
.icon--btn-right::after {
    content: '\f301';
}
 
.icon--link-right {
    display: block !important;
}
 
.icon--link-right::after {
    content: '\f1a3';
}
 
.icon--text-link-right {
    display: block !important;
}
 
.icon--text-link-right::after {
    content: '\f301';
}
 
.icon--add-calendar-right {
    display: block !important;
}
 
.icon--add-calendar-right::after {
    content: '\f32f';
}
 
.icon--copy-link-right {
    display: block !important;
}
 
.icon--copy-link-right::after {
    content: '\f18e';
}
 
.icon--download-right {
    display: block !important;
}
 
.icon--download-right::after {
    content: '\f220';
}
 
.icon--transcript-right {
    display: block !important;
}
 
.icon--transcript-right::after {
    content: '\f220';
}
 
.icon--back-to-top-right {
    display: block !important;
}
 
.icon--back-to-top-right::after {
    content: '\f303';
}
 
.icon--play-right {
    display: block !important;
}
 
.icon--play-right::after {
    content: '\f3a8';
}
 
 
/* Fluid font sizes for devices larger than 1200px */
@media screen and (min-width: 1200px) {
    .rte h1,
    .h1 {
    	--max-desktop-size: calc(4.5rem * 1.4);
    	--relative-size: calc(4.5 * 100vw / var(--primary-ratio));
    	font-size: clamp(3.75rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte h2,
    .h2 {
    	--max-desktop-size: calc(3.75rem * 1.4);
    	--relative-size: calc(3.75 * 100vw / var(--primary-ratio));
    	font-size: clamp(2.5rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte h3,
    .h3 {
    	--max-desktop-size: calc(3rem * 1.4);
    	--relative-size: calc(3 * 100vw / var(--primary-ratio));
    	font-size: clamp(2rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte h4,
    .h4 {
    	--max-desktop-size: calc(2.25rem * 1.4);
    	--relative-size: calc(2.25 * 100vw / var(--primary-ratio));
   	font-size: clamp(1.75rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte h5,
    .h5 {
    	--max-desktop-size: calc(1.875rem * 1.4);
    	--relative-size: calc(1.875 * 100vw / var(--primary-ratio));
    	font-size: clamp(1.25rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte h6,
    .h6 {
    	--max-desktop-size: calc(1.25rem * 1.4);
    	--relative-size: calc(1.25 * 100vw / var(--primary-ratio));
    	font-size: clamp(1.125rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte p,
    .text {
    	--max-desktop-size: calc(1rem * 1.4);
    	--relative-size: calc(1 * 100vw / var(--secondary-ratio));
    	font-size: clamp(1rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .standfirst,
    .standfirst {
    	--max-desktop-size: calc(1.25rem * 1.4);
    	--relative-size: calc(1.25 * 100vw / var(--secondary-ratio));
    	font-size: clamp(1.25rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .text-large,
    .text-large {
    	--max-desktop-size: calc(1.125rem * 1.4);
    	--relative-size: calc(1.125 * 100vw / var(--secondary-ratio));
    	font-size: clamp(1.125rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .text-small,
    .text-small {
    	--max-desktop-size: calc(0.875rem * 1.4);
    	--relative-size: calc(0.875 * 100vw / var(--secondary-ratio));
    	font-size: clamp(0.875rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .caption,
    .caption {
    	--max-desktop-size: calc(0.75rem * 1.4);
    	--relative-size: calc(0.75 * 100vw / var(--secondary-ratio));
    	font-size: clamp(0.75rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .btn,
    .btn {
    	--max-desktop-size: calc(1rem * 1.4);
    	--relative-size: calc(1 * 100vw / var(--primary-ratio));
    	font-size: clamp(1rem, var(--relative-size), var(--max-desktop-size));
    }
 
    .rte .btn--sm,
    .btn--sm {
    	--max-desktop-size: calc(0.875rem * 1.4);
    	--relative-size: calc(0.875 * 100vw / var(--primary-ratio));
    	font-size: clamp(0.875rem, var(--relative-size), var(--max-desktop-size));
    }
}
 
/* Header and Footer Logo */
@media screen and (min-width: 1200px) {
    .header__logo {
    	--max-desktop-size-width: calc(140px * var(--header-logo-scale));
    	--max-desktop-size-height: calc(40px * var(--header-logo-scale));
    	--max-desktop-size-margin: calc(-10px * var(--header-logo-scale));
    	--relative-size-width: calc(((140 * var(--header-logo-scale)) * 100vw) / var(--window-width));
    	--relative-size-height: calc(((40 * var(--header-logo-scale)) * 100vw) / var(--window-width));
    	--relative-size-margin: calc(((-10 * var(--header-logo-scale)) * 100vw) / var(--window-width));
        max-width: clamp(calc(var(--max-desktop-size-width) * 0.75), var(--relative-size-width), var(--max-desktop-size-width));
        max-height: clamp(calc(var(--max-desktop-size-height) * 0.75), var(--relative-size-height), var(--max-desktop-size-height));
        margin-top: clamp(var(--max-desktop-size-margin), var(--relative-size-margin), calc(var(--max-desktop-size-margin) * 0.75));
        margin-bottom: clamp(var(--max-desktop-size-margin), var(--relative-size-margin), calc(var(--max-desktop-size-margin) * 0.75));
    }
}
 
@media screen and (max-width: 1199px) {
    .header__logo {
        width: calc(140px * var(--header-logo-scale));
        max-height: calc(40px * var(--header-logo-scale));
        margin-top: calc(-10px * var(--header-logo-scale));
        margin-bottom: calc(-10px * var(--header-logo-scale));
    }
}
 
@media screen and (min-width: 1200px) {
    .footer__logo {
		--footer-logo-var: 140;
    	--relative-size: calc((var(--footer-logo-var) * 100vw) / var(--window-width));
     width: clamp(calc(var(--footer-logo-size) * 0.75), var(--relative-size), var(--footer-logo-size));
    }
}