/******************************************************************

Stylesheet: Main Stylesheet

******************************************************************/
/* =============================================================================
  Helpers
========================================================================== */
/* =============================================================================
  Browser Resets - https://piccalil.li/blog/a-modern-css-reset/
========================================================================== */
/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box; }

/* Remove default margin and padding */
blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul {
  margin: 0;
  padding: 0; }

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none; }

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth; }

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5; }

/* A elements that don't have a class get default styles */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
  text-decoration-skip-ink: auto; }

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block; }

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit; }

/* List stuff */
ul, ol {
  list-style: none; }

/* Table Stuff */
table {
  border-collapse: collapse;
  border-spacing: 0; }

/* Pre Stuff */
pre {
  white-space: pre-wrap; }

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important; } }

/* =============================================================================
  Utils
========================================================================== */
/* =============================================================================
  Text
========================================================================== */
.text-center {
  justify-content: center; }

.text-right {
  justify-content: right; }

/* =============================================================================
  Colours
========================================================================== */
/* =============================================================================
    Colour
  ========================================================================== */
.primary {
  color: var(--colour-primary); }

.secondary {
  color: var(--colour-secondary); }

.accent {
  color: var(--colour-accent); }

.black {
  color: var(--colour-black); }

.dark {
  color: var(--colour-dark); }

.medium {
  color: var(--colour-medium); }

.light {
  color: var(--colour-light); }

.white {
  color: var(--colour-white); }

/* =============================================================================
    Background Colour
  ========================================================================== */
.bg-primary {
  background-color: var(--colour-primary); }

.bg-secondary {
  background-color: var(--colour-secondary); }

.bg-accent {
  background-color: var(--colour-accent); }

.bg-black {
  background-color: var(--colour-black); }

.bg-dark {
  background-color: var(--colour-dark); }

.bg-medium {
  background-color: var(--colour-medium); }

.bg-light {
  background-color: var(--colour-light); }

.bg-white {
  background-color: var(--colour-white); }

/******************************************************************

Stylesheet: Mixins & Constants Stylesheet

This is where you can take advantage of Sass' great features:
Mixins & Constants.

******************************************************************/
/*********************
TOOLS
*********************/
.image-replacement {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden; }

/*********************
COLORS
*********************/
/* =============================================================================
Padding
========================================================================== */
/* =============================================================================
Aspect Ratio
========================================================================== */
/* =============================================================================
Clearfix
========================================================================== */
/* =============================================================================
Site Margins
========================================================================== */
/*********************
TYPOGRAPHY
*********************/
span.amp {
  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important;
  font-style: italic; }

/* =============================================================================
	Fluid Type
========================================================================== */
/*
$min_width: map-get($breakpoints, medium)
$max_width: map-get($breakpoints, xxlarge)
$min_font: 16px;
$max_font: 24px;

.large-fluid {
  @include fluid-type($min_width, $max_width, $min_font, $max_font);
}
*/
/* =============================================================================
	Fluid Padding
========================================================================== */
/*
	$direction: vertical,horizontal,both;
	$min-vw: map-get($breakpoints, medium)
	$max-vw: map-get($breakpoints, xxlarge);
	$min-padding: 16px;
	$max-padding: 38px;


	*/
/* =============================================================================
	Fluid Attribute
========================================================================== */
/*
	$attribute: margin-bottom;
	$min-vw: map-get($breakpoints, medium);
	$max-vw: map-get($breakpoints, xxlarge);
	$min-value: 16px;
	$max-value: 38px;


	*/
/*********************
CSS3 GRADIENTS.
*********************/
/* @include css-gradient(#dfdfdf,#f8f8f8); */
/* =============================================================================
	Burgers
========================================================================== */
/* =============================================================================
    Spacing
  ========================================================================== */
.mt {
  margin-top: var(--layout-spacing); }
  .mt-sm {
    margin-top: calc(var(--layout-spacing) * 0.5); }
  .mt-lg {
    margin-top: calc(var(--layout-spacing) * 2); }

.mb {
  margin-bottom: var(--layout-spacing); }
  .mb-sm {
    margin-bottom: calc(var(--layout-spacing) * 0.5); }
  .mb-lg {
    margin-bottom: calc(var(--layout-spacing) * 2); }

.pt {
  padding-top: var(--layout-spacing); }
  .pt-sm {
    padding-top: calc(var(--layout-spacing) * 0.5); }
  .pt-lg {
    padding-top: calc(var(--layout-spacing) * 2); }

.pb {
  padding-bottom: var(--layout-spacing); }
  .pb-sm {
    padding-bottom: calc(var(--layout-spacing) * 0.5); }
  .pb-lg {
    padding-bottom: calc(var(--layout-spacing) * 2); }

/* =============================================================================
  Flexbox related
========================================================================== */
.is-flex {
  display: flex !important; }

/* =============================================================================
    Align
  ========================================================================== */
.align-bottom {
  align-items: flex-end; }

.align-top {
  align-items: flex-start; }

.align-center {
  align-items: center; }

.align-left {
  align-items: start; }

.align-right {
  align-items: end; }

/* =============================================================================
  Settings
========================================================================== */
/* =============================================================================
  Breakpoints & Flexbox Grid (http://sassflexboxgrid.com/views/classes.html)
========================================================================== */
/* =============================================================================
    CSS Variables
  ========================================================================== */
:root {
  /* =============================================================================
        Colours
      ========================================================================== */
  --colour-primary: #3FA2F7;
  --colour-secondary: #323D4F;
  --colour-accent: #F5508C;
  --colour-white: #ffffff;
  --colour-black: #000000;
  --colour-light: #f2f2f2;
  --colour-medium: #333333;
  --colour-dark: #666666;
  --colour-info: #e86b03;
  --colour-success: #419b01;
  --colour-warning: #ffbd08;
  --colour-danger: #ed0059;
  /* =============================================================================
        Layout
      ========================================================================== */
  --layout-body-margin: 0;
  --layout-container-margin: 2rem;
  --layout-container-width: calc(100% - (var(--layout-container-margin) * 2));
  --layout-container-max-width: 100%;
  /* =============================================================================
        Spacing
      ========================================================================== */
  --layout-spacing: 2rem;
  /* =============================================================================
        Components
      ========================================================================== */
  --layout-grid-gap: 1rem;
  --element-block-spacing: 2rem;
  --element-box-padding: 1rem;
  --navbar-link-color: var(--colour-black);
  --navbar-link-current-color: var(--colour-primary);
  /* =============================================================================
        Typography
        ========================================================================== */
  --typography-header-font: sans-serif;
  --typography-header-weight: bold;
  --typography-header-line-height: 1.2;
  --typography-h1-size: 50px;
  --typography-h2-size: 40px;
  --typography-h3-size: 30px;
  --typography-h4-size: 28px;
  --typography-h5-size: 24px;
  --typography-h6-size: 20px;
  --typography-body-font: sans-serif;
  --typography-body-weight: normal;
  --typography-body-size: 100%;
  --typography-body-line-height: 1.2; }

/* =============================================================================
      Responsive Vars
    ========================================================================== */
@media (min-width: 76.5625rem) {
  :root {
    --layout-body-margin: 0;
    --layout-container-width: 100%;
    --layout-container-max-width: 76.5625rem;
    --layout-container-margin: auto;
    --layout-grid-gap: 3rem; } }

/* =============================================================================
      Demo Styles - TO BE REMOVED
    ========================================================================== */
.scroll-monitor {
  opacity: 0;
  transform: translateX(50px);
  transition: transform 500ms ease, opacity 500ms ease;
  transition-delay: 500ms; }
  .scroll-monitor.in-viewport {
    opacity: 1;
    transform: translateX(0); }

/* =============================================================================
  Helpers
========================================================================== */
/* =============================================================================
  CSS Grid
========================================================================== */
.grid {
  display: grid; }
  .grid:not(.no-gap) {
    gap: var(--layout-grid-gap); }
  .grid:not([class*=" grid-col-"]) {
    grid-template-columns: repeat(12, 1fr); }
    .grid:not([class*=" grid-col-"]) > * {
      grid-column-start: span 12; }
  .grid.grid-col-2 {
    grid-template-columns: 1fr 1fr; }
  .grid.grid-col-3 {
    grid-template-columns: 1fr 1fr 1fr; }
  .grid .col-xs-1 {
    grid-column-start: span 1; }
  .grid .col-xs-2 {
    grid-column-start: span 2; }
  .grid .col-xs-3 {
    grid-column-start: span 3; }
  .grid .col-xs-4 {
    grid-column-start: span 4; }
  .grid .col-xs-5 {
    grid-column-start: span 5; }
  .grid .col-xs-6 {
    grid-column-start: span 6; }
  .grid .col-xs-7 {
    grid-column-start: span 7; }
  .grid .col-xs-8 {
    grid-column-start: span 8; }
  .grid .col-xs-9 {
    grid-column-start: span 9; }
  .grid .col-xs-10 {
    grid-column-start: span 10; }
  .grid .col-xs-11 {
    grid-column-start: span 11; }
  .grid .col-xs-12 {
    grid-column-start: span 12; }
  @media (min-width: 42.6875rem) {
    .grid .col-sm-1 {
      grid-column-start: span 1; }
    .grid .col-sm-2 {
      grid-column-start: span 2; }
    .grid .col-sm-3 {
      grid-column-start: span 3; }
    .grid .col-sm-4 {
      grid-column-start: span 4; }
    .grid .col-sm-5 {
      grid-column-start: span 5; }
    .grid .col-sm-6 {
      grid-column-start: span 6; }
    .grid .col-sm-7 {
      grid-column-start: span 7; }
    .grid .col-sm-8 {
      grid-column-start: span 8; }
    .grid .col-sm-9 {
      grid-column-start: span 9; }
    .grid .col-sm-10 {
      grid-column-start: span 10; }
    .grid .col-sm-11 {
      grid-column-start: span 11; }
    .grid .col-sm-12 {
      grid-column-start: span 12; } }
  @media (min-width: 64.9375rem) {
    .grid .col-md-1 {
      grid-column-start: span 1; }
    .grid .col-md-2 {
      grid-column-start: span 2; }
    .grid .col-md-3 {
      grid-column-start: span 3; }
    .grid .col-md-4 {
      grid-column-start: span 4; }
    .grid .col-md-5 {
      grid-column-start: span 5; }
    .grid .col-md-6 {
      grid-column-start: span 6; }
    .grid .col-md-7 {
      grid-column-start: span 7; }
    .grid .col-md-8 {
      grid-column-start: span 8; }
    .grid .col-md-9 {
      grid-column-start: span 9; }
    .grid .col-md-10 {
      grid-column-start: span 10; }
    .grid .col-md-11 {
      grid-column-start: span 11; }
    .grid .col-md-12 {
      grid-column-start: span 12; } }
  @media (min-width: 76.5625rem) {
    .grid .col-lg-1 {
      grid-column-start: span 1; }
    .grid .col-lg-2 {
      grid-column-start: span 2; }
    .grid .col-lg-3 {
      grid-column-start: span 3; }
    .grid .col-lg-4 {
      grid-column-start: span 4; }
    .grid .col-lg-5 {
      grid-column-start: span 5; }
    .grid .col-lg-6 {
      grid-column-start: span 6; }
    .grid .col-lg-7 {
      grid-column-start: span 7; }
    .grid .col-lg-8 {
      grid-column-start: span 8; }
    .grid .col-lg-9 {
      grid-column-start: span 9; }
    .grid .col-lg-10 {
      grid-column-start: span 10; }
    .grid .col-lg-11 {
      grid-column-start: span 11; }
    .grid .col-lg-12 {
      grid-column-start: span 12; } }
  @media (min-width: 107.25rem) {
    .grid .col-xl-1 {
      grid-column-start: span 1; }
    .grid .col-xl-2 {
      grid-column-start: span 2; }
    .grid .col-xl-3 {
      grid-column-start: span 3; }
    .grid .col-xl-4 {
      grid-column-start: span 4; }
    .grid .col-xl-5 {
      grid-column-start: span 5; }
    .grid .col-xl-6 {
      grid-column-start: span 6; }
    .grid .col-xl-7 {
      grid-column-start: span 7; }
    .grid .col-xl-8 {
      grid-column-start: span 8; }
    .grid .col-xl-9 {
      grid-column-start: span 9; }
    .grid .col-xl-10 {
      grid-column-start: span 10; }
    .grid .col-xl-11 {
      grid-column-start: span 11; }
    .grid .col-xl-12 {
      grid-column-start: span 12; } }

/* =============================================================================
    Remove gaps on cells
  ========================================================================== */
.no-gap-t {
  margin-top: calc(var(--layout-grid-gap) * -1); }

.no-gap-b {
  margin-bottom: calc(var(--layout-grid-gap) * -1); }

.no-gap-l {
  margin-left: calc(var(--layout-grid-gap) * -1); }

.no-gap-r {
  margin-right: calc(var(--layout-grid-gap) * -1); }

/* =============================================================================
  Flexbox Grid
========================================================================== */
/* =============================================================================
  Generica Elements
========================================================================== */
/* =============================================================================
    Close
  ========================================================================== */
.close {
  display: block;
  font-size: 2rem;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  color: var(--colour-white);
  border: 2px solid currentColor;
  background-color: transparent;
  position: relative;
  cursor: pointer; }
  .close:after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "\00d7"; }

/* =============================================================================
    Block
  ========================================================================== */
.block:not(:last-child) {
  margin-bottom: var(--element-block-spacing); }

/* =============================================================================
    Box
  ========================================================================== */
.box {
  padding: var(--element-box-padding); }
  .box-header {
    background-color: var(--colour-primary);
    color: var(--colour-white);
    margin: calc(var(--element-box-padding) * -1);
    margin-bottom: var(--element-box-padding);
    padding: var(--element-box-padding); }

/* =============================================================================
    Widescreen Videos
  ========================================================================== */
iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="vimeo.com"] {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9; }

.button {
  -webkit-user-select: none;
  user-select: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 0.375em;
  box-shadow: none;
  display: inline-flex;
  font-size: 1rem;
  height: 2.5em;
  cursor: pointer;
  justify-content: center;
  padding-bottom: calc(0.5em - 1px);
  padding-left: 1em;
  padding-right: 1em;
  padding-top: calc(0.5em - 1px);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  border-color: transparent;
  background-color: var(--colour-primary);
  color: var(--colour-white); }
  .button.is-large {
    font-size: 1.5rem; }
  .button.is-secondary {
    background-color: var(--colour-secondary);
    color: var(--colour-white); }

.buttons-wrapper {
  margin-top: var(--layout-spacing); }

/* =============================================================================
  Tabs
========================================================================== */
/*:root {
    --tab-padding: 2rem 3rem;
  }*/
.tabs-wrapper:not(.simple) .tabs {
  border-bottom: var(--tabs-border-bottom, 2px solid var(--colour-dark)); }

.tabs-wrapper:not(.simple) .tab {
  cursor: pointer;
  border: none;
  border-radius: 0;
  background-color: var(--colour-light);
  padding: var(--tab-padding, 0.625rem 1.5rem); }
  .tabs-wrapper:not(.simple) .tab.is-active {
    background-color: var(--colour-dark);
    color: var(--colour-white);
    text-decoration: none; }

.tabs {
  margin-bottom: var(--tabs-margin-bottom, 1rem); }

.tab {
  border: none;
  background: none;
  border-radius: 0; }
  .tab.is-active {
    text-decoration: underline; }

.content-tabs {
  margin-bottom: var(--content-tabs-margin-bottom, 1rem); }

.content-tab {
  display: none; }
  .content-tab.is-active {
    display: block; }

/* =============================================================================
Card
========================================================================== */
.card {
  background-color: var(--colour-light);
  box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.2);
  max-width: 100%;
  position: relative;
  border-radius: var(--card-radius, 6px);
  overflow: hidden; }

.card-image {
  display: block;
  position: relative; }
  .card-image figure {
    aspect-ratio: 3/2; }
    .card-image figure img, .card-image figure video {
      width: 100%;
      height: 100%;
      object-fit: cover; }

.card-content {
  display: block;
  background-color: transparent;
  color: var(--colour-medium);
  padding: var(--card-spacing, 1.5rem);
  font-size: 0.875rem; }
  .card-content > * {
    display: inherit; }

.card-media {
  align-items: flex-start;
  display: flex;
  text-align: inherit; }
  .card-media .image {
    width: 3rem;
    height: 3rem; }
  .card-media:not(:last-child) {
    margin-bottom: 1.5rem; }

.card-media-left {
  flex-basis: auto;
  flex-grow: 0;
  flex-shrink: 0;
  margin-right: 1rem; }

.card-media-content {
  flex-basis: auto;
  flex-grow: 1;
  flex-shrink: 1;
  text-align: inherit; }

.card-title {
  display: block;
  color: var(--colour-dark);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.125; }
  .card-title:not(:last-child) {
    margin-bottom: 1.25rem; }
  .card-title:not(.is-spaced) + .card-subtitle {
    margin-top: -1.25rem; }

.card-subtitle {
  color: var(--colour-primary);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.25; }

.card-meta {
  margin-top: var(--card-spacing, 1.5rem); }

time {
  font-style: italic; }

/* =============================================================================
  Accordion
========================================================================== */
.accordion details summary {
  cursor: pointer;
  padding: var(--accordion-summary-pad, 1rem 2rem);
  background-color: var(--colour-primary);
  color: var(--colour-white); }

.accordion details summary::-webkit-details-marker {
  display: none; }

.accordion-content {
  padding: var(--accordion-summary-pad, 1rem 2rem); }

/* =============================================================================
  Header
========================================================================== */
header {
  top: -0.5px;
  margin-top: 0;
  background-color: var(--colour-light);
  height: var(--layout-header-height, 100px);
  display: flex;
  align-items: center; }
  header.is-stuck {
    border-bottom: 1px solid transparent; }

#header-logo {
  max-height: var(--layout-header-logo-height, 80px);
  height: auto;
  max-width: 100%; }

/* =============================================================================
  Footer
========================================================================== */
#footer {
  background-color: var(--colour-dark);
  color: var(--colour-white); }
  #footer a {
    color: var(--colour-white); }

/* =============================================================================
  Burgess
========================================================================== */
.burger {
  position: relative;
  margin-top: 8px;
  margin-bottom: 8px;
  -webkit-user-select: none;
  user-select: none;
  /*&.is-active {
    @include burger-to-cross;
  }*/ }
  .burger, .burger:before, .burger:after {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #444;
    transition-property: background-color, transform;
    transition-duration: 0.3s; }
  .burger:before, .burger:after {
    position: absolute;
    content: ""; }
  .burger:before {
    top: -8px; }
  .burger:after {
    top: 8px; }

/* =============================================================================
  Navigation
========================================================================== */
.navbar {
  position: relative;
  z-index: 30;
  align-items: stretch;
  display: flex;
  align-items: center;
  justify-content: space-between; }

.navbar-brand, .navbar-tabs {
  align-items: stretch;
  display: flex;
  flex-shrink: 0;
  min-height: calc(var(--layout-header-height, 100px) / 2); }

.navbar-menu {
  display: none; }

.navbar-item a, .navbar-link {
  color: var(--navbar-link-color);
  display: block;
  line-height: 1.5;
  padding: 0.5rem 0.75rem;
  position: relative;
  cursor: pointer; }

.navbar-item {
  flex-grow: 0;
  flex-shrink: 0; }
  .navbar-item.has-dropdown {
    padding: 0;
    position: relative; }
    .navbar-item.has-dropdown > a {
      padding-right: 2.5em;
      align-items: center;
      display: flex; }
      .navbar-item.has-dropdown > a:after {
        border: 3px solid transparent;
        border-radius: 2px;
        border-right: 0;
        border-top: 0;
        content: " ";
        display: block;
        height: 0.625em;
        margin-top: -0.4375em;
        pointer-events: none;
        position: absolute;
        top: 50%;
        transform: rotate(-45deg);
        transform-origin: center;
        width: 0.625em;
        border-color: var(--navbar-link-color);
        right: 1.125em; }
    .navbar-item.has-dropdown.is-active > a:after {
      transform: rotate(135deg);
      margin-top: -0.375em; }
  .navbar-item.is-current > a, .navbar-item.is-current-ancestor > a {
    color: var(--navbar-link-current-color); }

.navbar-dropdown {
  font-size: .875rem;
  padding-bottom: 0.5rem;
  padding-top: 0.5rem; }

/* =============================================================================
    Breakpoints
  ========================================================================== */
@media (min-width: 64.9375rem) {
  .navbar-burger {
    display: none; }
  .navbar, .navbar-end, .navbar-menu, .navbar-start {
    align-items: stretch;
    display: flex; }
  .navbar-menu {
    flex-grow: 1;
    flex-shrink: 0;
    align-items: center; }
  .navbar-start {
    justify-content: flex-start;
    margin-right: auto; }
  .navbar-item, .navbar-link {
    align-items: center;
    display: flex;
    position: relative; }
  .navbar-item.has-dropdown {
    align-items: stretch; }
    .navbar-item.has-dropdown.is-active .navbar-dropdown {
      display: block; }
  .navbar-dropdown {
    background-color: #fff;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-top: 2px solid #dbdbdb;
    box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
    display: none;
    font-size: .875rem;
    left: 0;
    min-width: 12.5rem;
    position: absolute;
    top: 100%;
    z-index: 20; } }

/* =============================================================================
  Modal
========================================================================== */
.modal {
  align-items: center;
  display: none;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 40; }
  .modal.is-activating {
    display: flex; }
  .modal.is-active {
    display: flex; }
    .modal.is-active .modal-background {
      opacity: 1;
      transition-delay: 0s; }
    .modal.is-active .modal-card, .modal.is-active .modal-content {
      transition: transform 250ms ease, opacity 150ms ease;
      transition-delay: 250ms;
      transform: translateY(0) scale(1);
      opacity: 1; }
    .modal.is-active.is-closing .modal-card, .modal.is-active.is-closing .modal-content {
      transform: translateY(-150px) scale(0.5);
      opacity: 0;
      transition-delay: 0s; }
    .modal.is-active.is-closing .modal-background {
      opacity: 0;
      transition-delay: 250ms; }
  .modal.image-modal .modal-content {
    max-width: 90vw;
    width: auto;
    text-align: center; }

.modal-background {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  background-color: rgba(10, 10, 10, 0.86);
  opacity: 0;
  transition: opacity 250ms ease;
  transition-delay: 250ms; }

.modal-card, .modal-content {
  display: block;
  margin: 0 20px;
  max-height: calc(100vh - 160px);
  overflow: auto;
  position: relative;
  width: 100%;
  transform: translateY(-150px) scale(0.5);
  opacity: 0;
  transition: transform 250ms ease, opacity 150ms ease;
  transition-delay: 0s; }
  .modal-card .close, .modal-content .close {
    margin: 0 auto 1.875rem; }
  .modal-card figcaption, .modal-content figcaption {
    margin-top: 1rem;
    color: var(--colour-white); }

@media (min-width: 76.5625rem) {
  .modal-card, .modal-content {
    margin: 0 auto;
    max-height: calc(100vh - 40px);
    width: 640px; } }

/* =============================================================================
  Pagination
========================================================================== */
.pagination-wrapper {
  padding-top: var(--layout-spacing); }

.pagination-ellipsis, .pagination-link, .pagination-next, .pagination-previous {
  -moz-appearance: none;
  -webkit-appearance: none;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 0.375em;
  box-shadow: none;
  display: inline-flex;
  font-size: 1rem;
  height: 2.5em;
  line-height: 1.5;
  padding-bottom: calc(0.5em - 1px);
  padding-left: calc(0.75em - 1px);
  padding-right: calc(0.75em - 1px);
  padding-top: calc(0.5em - 1px);
  position: relative;
  vertical-align: top;
  justify-content: center;
  margin: 0.25rem;
  text-align: center; }
  .pagination-ellipsis.is-current, .pagination-link.is-current, .pagination-next.is-current, .pagination-previous.is-current {
    border-color: var(--colour-secondary);
    background-color: var(--colour-secondary);
    color: var(--colour-white); }

.pagination, .pagination-list {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center; }

ul.pagination-list {
  list-style: none; }

.pagination {
  justify-content: space-between;
  margin-bottom: 0;
  margin-top: 0; }

.pagination-link, .pagination-next, .pagination-previous {
  border-color: var(--colour-dark);
  color: var(--color-white);
  min-width: 2.5em; }

.pagination-next, .pagination-previous {
  padding-left: 0.75em;
  padding-right: 0.75em;
  white-space: nowrap; }

@media (min-width: 76.5625rem) {
  .pagination-list {
    flex-grow: 1;
    flex-shrink: 1;
    justify-content: flex-start;
    order: 1; }
  .pagination-previous {
    order: 2; }
  .pagination-next {
    order: 3; } }

/*! Flickity v2.1.1
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
  position: relative; }

.flickity-enabled:focus {
  outline: none; }

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: 100%; }

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
  margin-bottom: 1.875rem; }

/* draggable */
.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
  -webkit-user-select: none;
  user-select: none; }

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: grab; }

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: grabbing; }

/* ---- flickity-button ---- */
.flickity-button {
  position: relative;
  display: inline-block;
  /*position: absolute;
  background: hsla(0, 0%, 100%, 0.75);
  border: none;
  color: #333;*/ }

.flickity-button:hover {
  background: white;
  cursor: pointer; }

.flickity-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #19F; }

.flickity-button:active {
  opacity: 0.6; }

.flickity-button:disabled {
  opacity: 0.3;
  cursor: auto;
  /* prevent disabled button from capturing pointer up event. #716 */
  pointer-events: none; }

.flickity-button-icon {
  fill: #333; }

/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
  width: 44px;
  height: 44px;
  /* vertically center */ }

.flickity-prev-next-button.previous {
  left: 10px; }

.flickity-prev-next-button.next {
  right: 10px; }

/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px; }

.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px; }

.flickity-prev-next-button .flickity-button-icon {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%; }

/* ---- page dots ---- */
.flickity-page-dots {
  position: absolute;
  width: auto;
  bottom: -25px;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1; }

.flickity-rtl .flickity-page-dots {
  direction: rtl; }

.flickity-page-dots .dot {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 8px 0 0;
  background: var(--colour-white);
  border-radius: 50%;
  cursor: pointer; }

.flickity-page-dots .dot.is-selected {
  background: var(--colour-dark); }

/* =============================================================================
  Visiblity
========================================================================== */
@media screen and (min-width: 42.6875rem) {
  .is-hide-sm {
    display: none !important; } }

@media screen and (min-width: 64.9375rem) {
  .is-hide-md {
    display: none !important; } }

@media screen and (min-width: 76.5625rem) {
  .is-hide-lg {
    display: none !important; } }

@media screen and (min-width: 107.25rem) {
  .is-hide-xl {
    display: none !important; } }

@media screen and (max-width: 41.6875rem) {
  .is-hide-xs-only {
    display: none !important; } }

@media screen and (min-width: 42.6875rem) and (max-width: 63.9375rem) {
  .is-hide-sm-only {
    display: none !important; } }

@media screen and (min-width: 64.9375rem) and (max-width: 75.5625rem) {
  .is-hide-md-only {
    display: none !important; } }

@media screen and (min-width: 76.5625rem) and (max-width: 106.25rem) {
  .is-hide-lg-only {
    display: none !important; } }

@media screen and (min-width: 107.25rem) {
  .is-hide-xl-only {
    display: none !important; } }

/* =============================================================================
    Device type
  ========================================================================== */
.is-show-touch, .is-show-mouse, .is-show-touch-mouse {
  display: none; }

/* mobile device */
@media (pointer: coarse) {
  .is-show-touch {
    display: inherit; }
  .is-hide-touch {
    display: inherit !important; } }

/* desktop */
@media (pointer: fine), (pointer: none) {
  .is-show-mouse {
    display: inherit; }
  .is-hide-mouse {
    display: none !important; } }

/* touch desktop */
@media (pointer: fine) and (any-pointer: coarse) {
  .is-show-touch-mouse {
    display: inherit; }
  .is-hide-touch-mouse {
    display: none !important; } }

/* =============================================================================
  Layout
========================================================================== */
html {
  scroll-behavior: smooth; }

@media (prefers-reduced-motion) {
  html {
    scroll-behavior: auto; } }

body {
  margin: var(--layout-body-margin);
  opacity: 0;
  transition: opacity 250ms ease;
  overflow: auto; }
  body.is-loaded {
    opacity: 1; }

.container {
  width: var(--layout-container-width);
  max-width: var(--layout-container-max-width);
  margin-left: var(--layout-container-margin);
  margin-right: var(--layout-container-margin); }

[id] {
  scroll-margin-top: var(--layout-header-height, 2rem); }

/* =============================================================================
    Sticky
  ========================================================================== */
.is-sticky {
  position: sticky;
  z-index: 30; }

/* =============================================================================
    Credits
  ========================================================================== */
.indigo-credits {
  display: block; }
  .indigo-credits img {
    display: inline-block; }

/* =============================================================================
  Typography
========================================================================== */
/* =============================================================================
    Main
  ========================================================================== */
body {
  font-family: var(--typography-body-font);
  font-weight: var(--typography-body-weight);
  line-height: var(--typography-body-line-height);
  font-size: var(--typography-body-size); }

/* =============================================================================
    Headers
  ========================================================================== */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-family: var(--typography-header-font);
  font-weight: var(--typography-header-weight);
  line-height: var(--typography-header-line-height);
  font-size: var(--typography-h1-size);
  margin-bottom: clamp(1rem, 0.5em, 1.875rem); }

h1, .h1 {
  font-size: var(--typography-h1-size); }

h2, .h2 {
  font-size: var(--typography-h2-size); }

h3, .h3 {
  font-size: var(--typography-h3-size); }

h4, .h4 {
  font-size: var(--typography-h4-size); }

h5, .h5 {
  font-size: var(--typography-h5-size); }

h6, .h6 {
  font-size: var(--typography-h6-size); }

/* =============================================================================
    Links
  ========================================================================== */
a, a:visited {
  transition: color 500ms ease;
  text-decoration: none; }
  a:link, a:visited:link {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3); }

/* =============================================================================
    Content Styles
  ========================================================================== */
.content p:not(:last-child), .mce-content-body p:not(:last-child) {
  margin-bottom: var(--element-block-spacing); }

.content sup, .content sub, .mce-content-body sup, .mce-content-body sub {
  font-size: 75%; }

.content ul, .mce-content-body ul {
  list-style: disc outside;
  margin-left: 2em;
  margin-top: 1em; }
  .content ul:not(:last-child), .mce-content-body ul:not(:last-child) {
    margin-bottom: var(--element-block-spacing); }

.content ol:not([type]), .mce-content-body ol:not([type]) {
  list-style-position: outside;
  margin-left: 2em;
  margin-top: 1em; }
  .content ol:not([type]):not([type]), .mce-content-body ol:not([type]):not([type]) {
    list-style-type: decimal; }
  .content ol:not([type]):not(:last-child), .mce-content-body ol:not([type]):not(:last-child) {
    margin-bottom: var(--element-block-spacing); }

.content dl dd, .mce-content-body dl dd {
  margin-left: 2rem; }

.content dl:not(:last-child), .mce-content-body dl:not(:last-child) {
  margin-bottom: var(--element-block-spacing); }

.content blockquote, .mce-content-body blockquote {
  background-color: var(--colour-light);
  border-left: 5px solid var(--colour-medium);
  padding: 1.25em 1.5em;
  font-size: 1.25em; }
  .content blockquote:not(:last-child), .mce-content-body blockquote:not(:last-child) {
    margin-bottom: var(--element-block-spacing); }

.content code, .content pre, .mce-content-body code, .mce-content-body pre {
  -moz-osx-font-smoothing: auto;
  -webkit-font-smoothing: auto;
  font-family: monospace;
  overflow-x: auto;
  padding: 1.25em 1.5em;
  white-space: pre;
  word-wrap: normal;
  background-color: var(--colour-light);
  font-size: .875em; }
  .content code:not(:last-child), .content pre:not(:last-child), .mce-content-body code:not(:last-child), .mce-content-body pre:not(:last-child) {
    margin-bottom: var(--element-block-spacing); }

.content table, .mce-content-body table {
  width: 100%; }
  .content table td, .content table th, .mce-content-body table td, .mce-content-body table th {
    padding: 0.5em 0.75em;
    vertical-align: top; }
  .content table thead th, .mce-content-body table thead th {
    background-color: var(--colour-dark);
    color: var(--colour-white); }
    .content table thead th:not([align]), .mce-content-body table thead th:not([align]) {
      text-align: inherit; }
  .content table:not(:last-child), .mce-content-body table:not(:last-child) {
    margin-bottom: var(--element-block-spacing); }
  .content table.striped tr:nth-child(even) td, .mce-content-body table.striped tr:nth-child(even) td {
    background-color: var(--colour-light); }

.content figure, .mce-content-body figure {
  text-align: center; }
  .content figure img, .mce-content-body figure img {
    display: inline-block; }
  .content figure figcaption, .mce-content-body figure figcaption {
    font-style: italic; }
  .content figure:not(:last-child), .mce-content-body figure:not(:last-child) {
    margin-bottom: var(--element-block-spacing); }

.content img, .mce-content-body img {
  max-width: 100%;
  height: auto;
  margin: 1.5em 0; }

.content p:first-child > img, .mce-content-body p:first-child > img {
  margin-top: 0; }

.content .alignleft, .content img.alignleft, .mce-content-body .alignleft, .mce-content-body img.alignleft {
  margin-right: 1.5em;
  display: inline;
  float: left; }
  .content .alignleft:after, .content img.alignleft:after, .mce-content-body .alignleft:after, .mce-content-body img.alignleft:after {
    content: "";
    display: table;
    clear: both; }

.content .alignright, .content img.alignright, .mce-content-body .alignright, .mce-content-body img.alignright {
  margin-left: 1.5em;
  display: inline;
  float: right; }
  .content .alignright:after, .content img.alignright:after, .mce-content-body .alignright:after, .mce-content-body img.alignright:after {
    content: "";
    display: table;
    clear: both; }

.content .aligncenter, .content img.aligncenter, .mce-content-body .aligncenter, .mce-content-body img.aligncenter {
  margin-right: auto;
  margin-left: auto;
  display: block;
  clear: both; }

.content video, .content object, .mce-content-body video, .mce-content-body object {
  max-width: 100%;
  height: auto; }

@media (min-width: 76.5625rem) {
  .alignleft, img.alignleft, .alignright, img.alignright {
    max-width: 50%; } }