/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}


/* fonts */
 
 @font-face {
     font-family: "maven-pro";
     src: url('../fonts/mavenpro-regular-webfont.woff2') format('woff2'),
          url('../fonts/mavenpro-regular-webfont.woff') format('woff'),
          url('../fonts/mavenpro-regular-webfont.ttf') format('truetype');
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
     font-family: "maven-pro";
     src: url('../fonts/mavenpro-medium-webfont.woff2') format('woff2'),
          url('../fonts/mavenpro-medium-webfont.woff') format('woff'),
          url('../fonts/mavenpro-medium-webfont.ttf') format('truetype');
     font-weight: 500;
     font-style: normal;
 }
 
 @font-face {
     font-family: "maven-pro";
     src: url('../fonts/mavenpro-bold-webfont.woff2') format('woff2'),
          url('../fonts/mavenpro-bold-webfont.woff') format('woff'),
          url('../fonts/mavenpro-bold-webfont.ttf') format('truetype');
     font-weight: bold;
     font-style: normal;
 }
 
 /* some normalize overrides */
 b, strong {
     font-weight: bold;
 }
 
 sup {
     font-size: 50%;
     vertical-align: super;
 }
 
 .section--copy sup {
   font-size: 80%;
   top: -0.2em;
 }
 
 .copy-block__text sup {
   font-size: 0.8em;
   top: -0.2em;
 }

 .timeline__content-desc sup {
  font-size: 0.8em;
 }
 

 /* box-sixing */
 html {
   box-sizing: border-box;
 }
 
 *, *:before, *:after {
   box-sizing: inherit;
 }
 
 body {
   /* better font-rendering */
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   font-family: "maven-pro", tahoma, sans-serif;
 }
 
 h1, h2 {
   font-family: "maven-pro", tahoma;
   font-weight: 500;
   text-align: inherit;
 }
 
 p {
   line-height: 1.8;
   font-weight: 300;
   margin-bottom: 0.8rem;
   hyphens: none;
 }
 
 ul {
   padding: 0;
   line-height: 1.8;
   margin-bottom: 2rem;
 }
 
 ol {
   padding: 0;
   line-height: 1.8;
   margin-bottom: 2rem;
 }
 
 li {
   font-weight: 300;
   hyphens: none;
 }
 
 a {
   color: inherit;
 }
 

 .u-bold {
  font-weight: bold;
 }
 
 .copy-block {
   /*padding-bottom: 20px;*/
   width: 80%;
   margin: 0 auto;
   /*padding-top: 30px;*/
   color: #353535;
 }
 
.competition-download .copy-block {
  width: 100%;
}

 
 @media screen and (min-width: 40em) {
 
   .copy-block {
     width: 100%;
     margin: 0;
   }
 
 }
 
 
 .copy-block--col-right {
 
 }
 
 .copy-block--col-centre {
 
 }
 

 .copy-block__image {
   margin: 0 2em 2em 0;
   width: 100%;
 }
 
 .copy-block__image-src {
   width: 100%;
 }

 @media screen and  (min-width: 630px) {


  .copy-block__image {
   margin: 0 2.5em 3em 0;
    width: auto;
 }
 
 .copy-block__image--left {
   float: left;
   margin-left: 0;
   margin-right: 1rem;
 }
 
 .copy-block__image--right {
   float: right;
   margin-left: 1rem;
   margin-right: 0;
 }
 
 
 .copy-block__image--left .copy-block__image-src {
   width: auto;
 }
 
 .copy-block__image--right .copy-block__image-src {
   width: 250px;
 }


 }
 
 
 .copy-block__action {
   text-align: center;
 }

 .copy-block__pdf-link {
    margin-bottom: 1.6rem;
 }

 .copy-block__sidebar {
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem;
}

.copy-block__sidebar > :first-child {
  flex-grow: 1;
}

.copy-block__sidebar > :last-child {
  flex-basis: 0;
  flex-grow: 999;
  min-inline-size: 50%;
}
 
 @media screen and (min-width: 45em) {
 
   .copy-block {
     width: 70%;
     margin: 0 auto;
     max-width: 45em;
   }
  
  .competition-timeline .copy-block {
      width: 100%;
      margin: 0 auto;
      max-width: 65em;
  }
  
  .competition-download .copy-block {
      width: 100%;
      margin: 0 auto;
      max-width: 65em;
  }
 
 
   .copy-block--col-right {
     width: 70%;
     float: right;
   }
 
   .copy-block--col-centre {
     width: 70%;
     margin: 0 auto;
   }
 
 
 }
 
 
 /* default styles for paragraphs etc in a main copy block */
 /* not BEM as it's hard to put BEM classes in the CMS rich text blocks */
 
 .copy-block h2 {
   font-size: 2em;
   margin-top: 1.3em;
   margin-bottom: 0.4em;
   letter-spacing: -1px;
 }
 
 .copy-block__text *:first-child, h2:first-child {
   margin-top: 0;
 }
 
.copy-block__text--align-center {
  text-align: center;
}

.copy-block__text--align-right {
  text-align: right;
}

.copy-block__text--highlight {
  border: 1px solid #cccccc;
  background-color: #eee;
  padding: 1.2rem;
  margin-bottom: 1.5rem;
}

.copy-block__text table {

}


.copy-block__text table {
  color: #333;
  background: white;
  border: 1px solid grey;
  font-size: 12pt;
  border-collapse: collapse;
}
.copy-block__text table thead th,
.copy-block__text table tfoot th {
  color: #777;
  background: rgba(0,0,0,.1);
}
.copy-block__text table caption {
  padding:.5em;
}
.copy-block__text table th,
.copy-block__text table td {
  padding: .5em;
  border: 1px solid lightgrey;
}


.copy-block-references__text p {
 font-size: 0.8em;
 text-align: left !important;
}
 
 .copy-block ul {
   padding: 0;
   list-style: none;
   margin-bottom: 1.2em;
   color: #444;
 }
 
 .copy-block ul > li {
   line-height: 1.8;
   padding-left: 1.3em;
   text-indent: -1.4em;
   margin-bottom: 0.6em;
 }
 
 .copy-block ul > li::before {
   content: "•";
   color: #145DA9;
   margin-right: 0.45em;
   text-indent: 0;
   line-height: 1;
   padding-top: 2px;
   vertical-align: top;
   display: inline-block;
   font-size: 1.6em;
 }

 .copy-block ul[class] > li::before {
  display: none;
 }

  .copy-block ul[class] > li {
   line-height: 1.8;
   padding-left: 0;
   text-indent: 0;
   margin-bottom: 0;
 }

 
 .copy-block ol > li {
   counter-increment: ref-num;
   list-style-type: none;
   line-height: 1.8;
   padding-left: 1.6em;
   text-indent: -1.55em;
   margin-bottom: 0.6em;
 }
 
 .copy-block ol > li::before {
   content: counter(list-item) ".";
   font-weight: bold;
   margin-right: 0.3em;
   text-indent: 0;
   display: inline-block;
   width: 1.3em;
 }
 

  .copy-block__video {
    margin-bottom: 2.4rem;
  }

  .copy-block__video:last-child {
    margin-bottom: 0;
  }
 
 .copy-block__video-silo {
   position: relative;
   width: 100%;
   height: 0;
   padding-bottom: 56.25%;
 }
 
 .copy-block__embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }

 .copy-block__image-caption-text {
  font-weight: bold;
 }
 
 
 .copy-block blockquote {
   line-height: 1.8;
   padding: 0;
   margin: 0;
   font-weight: 300;
   font-style:italic;
 }
 
 .copy-block__pull-quote {
   font-family: "din-condensed", tahoma;
   text-transform: uppercase;
   font-weight: normal;
   font-size: 2.4em;
   width: 22%;
   text-align: center;
   margin-left: 2rem;
   margin-right: 0.5rem;
   position: absolute;
   padding: 28px 0 38px 0;
   left: 0;
   color: #A7A9AC;
   background: url(/img/just-quotes-open.svg) center top/50px no-repeat, url(/img/just-quotes-close.svg) center bottom/50px no-repeat;
 }
 
 .copy-block__pull-quote p {
   line-height: 1;
 }
 
 
 .copy-block__review-quote {
   font-size: 2.4em;
   padding: 12px 50px 12px 50px;
   /*background: url(/img/just-quotes-open.svg) left top/50px no-repeat, url(/img/just-quotes-close.svg) right bottom/50px no-repeat;*/
 }
 
 @media screen and (min-width: 60em) {
 
   .copy-block__review-quote {
     width: 125%;
     padding-left: 18%;
   }
 
   .copy-block__review-quote--pull-right {
     padding-left: 0;
     padding-right: 18%;
   }
 
 }
 
 .copy-block__quote-mark {
   display: inline-block;
   padding-top: 6px;
   margin-left: -53px;
   margin-right: -10px;
   text-indent: -9999px;
   width: 50px;
   background: url(/img/just-quotes-open-line.svg) 0 -6px no-repeat;
 }
 
 
 .copy-block__quote-mark--right {
   margin-left: -6px;
   margin-right: 0;
   padding-top: 0;
   padding-bottom: 12px;
   background: url(/img/just-quotes-close-line.svg) 0 8px no-repeat;
 }
 
 .copy-block__quote-mark--white {
   background-image: url(/img/just-quotes-open-line-white.svg);
 }
 
 .copy-block__quote-mark--white-right {
   background-image: url(/img/just-quotes-close-line-white.svg);
 }
 
 
 .copy-block__star-rating {
 
 }
 
 .copy-block__star-rating .svg-icon {
   width: 20px;
   fill: #105ea6;
 }
 
 .copy-block__cta {
   margin-top: 36px;
   /*margin-bottom: 26px;*/
 }
 
 .container {
   width: 95%;
   margin: 0 auto;
   /*overflow: hidden;*/
   /*background-color: rgba(200,200,200,0.6)*/;
 }
 
 
 
 .container--tight {
   width: 100%;
 }
 
 .container--relative {
   position: relative;
 }
 
 .container--copy-block {
   position: relative;
 }
 
 /* container break points */ 
 
 @media screen and (min-width: 75em) {
   
   .container {
     width: 1200px;
     padding: 0 1.75rem;
   }
 
 }
 
 .u-hide-text {
   position: absolute; 
   overflow: hidden; 
   clip: rect(0 0 0 0); 
   height: 1px;
   width: 1px; 
   margin: -1px;
   padding: 0;
   border: 0; 
 }
 
 .u-center {
   text-align: center;
 }
 
 
 .design-underlay {
   position: absolute;
   top: 0;
   left: -50%;
   z-index: -10;
   width: 200%;
   height: 100%;
 }
 
 .design-underlay__img {
   display: block;
   margin: 0 auto;
 }
 
 header {
   height: 112px;
   position: relative;
   z-index: 22;
 }
 
 .flags {
   position: absolute;
   z-index: 10;
   top: 13px;
   right: 18px;
 }
 
 .flags__img {
   width: 32px;
 }
 
 section {
   padding: 30px 0;
 }

 .section--nested {
  padding-top: 0;
 }
 
 .section--contrast {
   background-color: #e6e7e8;
   overflow:auto;
   margin-bottom: 16px;
 }
 
 .section--timeline {
   background-color: #f2f3f3;
   margin-bottom: 60px;
 }
 
 .section--contrast.campaign {
     background-color: #87bedd;
 }
 
 .section--tight {
   padding: 0;
   margin-top: -17px;
 }
 
 .section--breakout {
   width: 98vw;
   position: relative;
   left: 50%;
   right: 50%;
   margin-left: -49vw;
   margin-right: -49vw;
 }
 
 .section--copy {
   padding-top: 0;
   padding-bottom: 0;
   margin-top: 1rem;
 }
 
 .section--accordian {
   padding-bottom: 20px;
   padding-top: 0;
 }
 
 .section__title {
   text-align: center;
   font-size: 2.1em;
 }
 
.section__intro {
  text-align: center;
}

 .section__title--banner {
   margin-top: -129px;
   padding-bottom: 70px;
   color: #EEE;
 }
 
 .section--event-times {
   margin-bottom: -60px;
 }
 
 
 
 
 .logo {
   margin-left: 12px;
   position: relative;
   z-index: 10;
   pointer-events: all;
   margin-top: 6px;
 }
 
 .logo__img {
   width: 120px;
 }
 
 .logo__img--footer {
   width: 240px;
 }
 
 /* navigations */
 
 .container--nav {
   pointer-events: none;
 }
 
 .nav {
   
 }
 
 .nav::before {
   content: "";
   display: block;
   position: absolute;
   width: 97%;
   height: 112px;
   background-color: #FFF;
   z-index: 2;
   top: 0;
 }
 
 .nav__list {
 
  list-style: none;
  padding: 20px 0 12px 20px;
  margin: 0;
  z-index: 1;
  background-color: #006bc4;
 }
 
 
 
 @media screen and (max-width: 60em) {
 
 /* menu toggle states etc.. */
 
 .js .nav__list {
   transition: transform 120ms linear;
   transform: translateY(-100%);
 }
 .js .nav__list.is-active {
   transform: translateY(0);
 }
 
 }
 
 .nav__item {
   margin-bottom: 0.4rem;
   pointer-events: all;
 }
 
 .nav__item--cart {
   margin-left: 0.8rem;
 }
 
 .nav__cart-icon {
   width: 40px;
 }
 
 .nav__link {
   padding: 0.8rem 0.25rem;
   margin: 0 0.4rem;
   text-decoration: none;
   color: #FFF;
   font-size: 1.2em;
 }
 
 
 .site-tagline {
   background-color: #006bc4;
   color: #FFF;
   font-size: 0.9em;
   font-weight: 500;
   text-transform: uppercase;
   position: relative;
   z-index: 4;
   height: 41px;
 }
 
 .site-tagline p {
   color: #FFF;
   margin: 0 0 16px 0;
   padding-left: 16px;
   /*display: none;*/
   padding-top: 9px;
   font-size: 0.85em;
 }
 
 
 .nav__sub-list {
   list-style: none;
   padding: 0 0 0 36px;
   margin: 0;
 }
 
 .nav__sub-item {
   padding: 4px 20px;
   color: #FFF;
 }
 
 .nav__sub-item:hover {
   /*background-color: #006bc4;*/
 }
 
 .nav__sub-item:hover a {
   /*color: #FFF;*/
   border-bottom: 1px solid #006bc4;
 }
 
 .nav__sub-item.active {
   font-weight: bold;
 }
 
 .nav__sub-item a {
   text-decoration: none;
 }
 
 
 @media screen and (min-width: 23.12em) {
 
   .site-tagline p {
     padding-top: 7px;
     font-size: 1em;
   }
 
 }
 
 /* nav break point */
 
 @media screen and (min-width: 60em) {
     
   header {
     height: auto;
   }
 
 
   .site-tagline p {
     margin-left: 157px;
     margin-bottom: 0;
   }
   
   .logo {
     margin-left: 0px;
   }
   
   .logo--main {
     margin-left: -30px;
     padding: 26px 32px 0px 12px;
     border-radius: 0 55% 58% 0%;
     margin-top: -42px;
     background-color: #FFF;
     margin-right: -57px;
     height: 154px;
   }
   
   .logo--main:before {
     content: " ";
     display: block;
     position: absolute;
     height: 42px;
     background-color: #FFF;
     top: 0;
     left: -5000px;
     width: 5000px;
   }
   
   
   .logo__img {
     width: 155px;
   }
   
   .logo__img--footer {
     width: 220px;
   }
   
   .container--nav {
     display: flex;
     justify-content: flex-start;
     height: 100px;
   }
   
   .menu-toggle {
     display: none;
   }
   
   .nav {
     padding-top: 0em;
     margin-left: 38px;
   }
   
   .nav::before {
     display: none;
     width: 0;
     height: 0;
   }
   
   .nav__list {
    display: flex;
    flex-wrap: nowrap;
    width: auto;
    margin: 0 0 0 0;
    padding: 0;
    background-color: #FFF;
   }
 
   .nav__item {
     display: inline-flex;
     margin-bottom: 0;
     border-left: 1px solid #d6d9da;
     /*width: 140px;*/
   }
 
   .nav__item:last-child {
     border-right: 1px solid #d6d9da;
   }
 
   .nav__item--cart {
     margin-left: 0;
   }
 
   .nav__sub-item {
     color: #333;
   }
   
   .nav__link {
     padding: 1.6rem 1rem;
     margin: 0;
     font-size: 1em;
     font-weight: bold;
     width: 100%;
     text-align: center;
     color: #333;
     line-height: 1.1;
   }
   
   .nav__link:hover, .active .nav__link {
     background-color: #0e5da5;
     color: #FFF;
   }
   
   /* nav colour variants */
   #nav-preservative-free .nav__link:hover, #nav-preservative-free.active .nav__link {
     background-color: #819f27;
   }
   
   #nav-events .nav__link:hover, #nav-events.active .nav__link {
     background-color: #b70f82;
   }
   
   #nav-news .nav__link:hover, #nav-news.active .nav__link {
     background-color: #b69d5b;
   }
   
   #nav-about-us .nav__link:hover, #nav-about-us.active .nav__link {
     background-color: #DC8747;
   }
   
   #nav-contact-us .nav__link:hover, #nav-contact-us.active .nav__link {
     background-color: #0e5da5;
   }
   
  
   
   
   
   
   
   .nav__item:first-child .nav__link {
     padding-left: 34px;
   }
 
 
   .nav__sub-list {
     position: absolute;
     margin-top: 80px;
     background-color: #e6e7e8;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     width: 100%;
     left: 0;
     min-height: 37px;
     z-index: 10;
   }
   
 }
 
 
 @media screen and (min-width: 64.375em) {
 
   .nav__link {
     padding: 1.9rem 1.3rem;
   }
 
 }
 
 .icon-btn {
   border: none;
   background: transparent;
   height: 1.4rem;
   width: 1.4rem;
   padding: 0;
 }
 
 .icon-btn.basket__button {
   border: none;
   background: transparent;
   height: 1.4rem;
   width: 2.0rem;
   padding: 0;
 }
 
 /* Menu button */
 
 .menu-toggle {
   margin: 0 12px 0 0;
   padding: 0;
   cursor: pointer;
   color: inherit;
   border: 0;
   background-color: transparent;
   position: relative;
   z-index: 10;
   float: right;
   margin-top: -41px;
   pointer-events: all;
 }
 
 .menu-toggle__box {
   position: relative;
   display: inline-block;
   width: 2.6em;
   height: 1.4em;
 }
 
 .menu-toggle__lines,  .menu-toggle__lines::before, .menu-toggle__lines::after {
   position: absolute;
   background-color: #006bc4;
   width: 2.6em;
   height: 4px;
   border-radius: 4px;
   transition-property: transform;
 }
 
 /* menu button transition - adapted from https://jonsuh.com/hamburgers/ */
 
 .menu-toggle__lines {
   display: block;
   top: 50%;
   /* animation - for when the menu is switched back from active */
   transition-timing-function: cubic-bezier(.55,.055,.675,.19);
   transition-duration: 75ms;
 }
 
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines {
   /* animation - menu is active - rotate but wait until the other lines have finished moving */
   transform: rotate(45deg);
   transition-timing-function: cubic-bezier(.215,.61,.355,1);
   transition-delay: 120ms;
 }
 
 .menu-toggle__lines::before {
   display: block;
   content: "";
   top: -10px;
   /* on switch back from active delay top movement until after rotation */
   transition: top 75ms ease 120ms,opacity 75ms ease;
 }
 
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines::before {
   top: 0;
   opacity: 0;
   /* on switch to active - move immediately, delay opacity */
   transition: top 75ms ease,opacity 75ms ease 120ms;
 }
 
 .menu-toggle__lines::after {
   display: block;
   content: "";
   bottom: -10px;
   /* on switch back from active delay top movement until after rotation - but rotate immediately */
   transition: bottom 75ms ease 120ms,transform 75ms cubic-bezier(.55,.055,.675,.19);
 }
 
 .menu-toggle[aria-expanded="true"] .menu-toggle__lines::after {
   bottom: 0;
   /* on switch to active - move immediately, delay rotation */
   transition: bottom 75ms ease,transform 75ms cubic-bezier(.215,.61,.355,1) 120ms;
   transform: rotate(-90deg);
 }
 
 
 /* Search box */
 
 .search-box {
   display: inline-flex;
   float: right;
   margin-top: -44px;
   margin-right: 63px;
   position: relative;
   background-color: #006bc4;
 }
 
 
 .search-box__toggle {
   position: relative;
   z-index: 10;
   margin-left: 0.5rem;
   margin-top: 0.3rem;
 }
 
 .search-box__form {
   display: inline-flex;
 }
 
 .js .search-box__form {
 	/*display: none;*/
   /*
   -webkit-transform: translateX(100%);
   transform: translateX(100%);
   transition: transform 300ms linear;
   will-change: transform;
   */
   width: 0.1px;
   opacity: 0.8;
   border-radius: 1em;
   overflow: hidden;
   transition: all 200ms linear;
 }
 .js .search-box__form.is-active {
 	/*display: block;*/
   /*
   -webkit-transform: none;
   transform: none;
   transition: transform 300ms linear;
   */
   opacity: 1;
   width: 214px;
 }
 
 .search-box__input {
   margin-left: 0.5em;
   background-color: #FFF;
   border: none;
   border-radius: 1em;
   padding: 0.5em 1em;
   width: 140px;
 }
 
 .search-box__label {
   margin-left: 0.5em;
   display: none;
 }
 
 .search-box__btn {
   margin-left: 0.5em;
   text-transform: uppercase;
   background-color: #FFF;
   border: none;
   border-radius: 1em;
 }
 
 @media screen and (min-width: 60em) {
 
   .search-box {
     margin-top: -28px;
   }
 
 }
 
 /* banner / slider / */
 
 .banner {
   width: 100%;
   height: 460px;
   position: relative;
   overflow: hidden;
 }
 
.banner--scale {
  height: auto;
  padding-bottom: 24px;
  background-color: #000;
}

 .banner--no-carousel {
   height: 250px;
 }
 
 .banner--plain {
   height: 330px;
   background: #228596 url(/img/plain-banner-water.png) no-repeat center center;
   background-size: cover;
   display: flex;
   justify-content: center;
   align-items: center;
 }
 
 .banner--404 {
   background-color: #000;
   border-top: 2px solid #FFF;
 }
 
 .banner__title {
   position: relative;
   color: #FFF;
   z-index: 10;
   text-align: center;
   padding-top: 7%;
   margin: 0 auto;
   font-weight: normal;
   font-size: 3em;
   line-height: 0.85;
   width: 84%;
 }
 
 .banner__title sup {
   font-size: 0.4em;
   vertical-align: super;
 }
 
 .banner__inline-img {
   display: block;
   margin: 4rem auto 0 auto;
 }
 
 .banner__copy--contrast {
     color: #444;
     fill: #444;
 }
 
 .banner__quote {
   font-family: "din-condensed", tahoma;
   text-transform: uppercase;
   line-height: 1;
   font-size: 7em;
   padding: 0;
   margin: 10% 0 0 0;
 }
 
 .banner__source {
   font-family: "din-condensed", tahoma;
   text-transform: uppercase;
   line-height: 1;
   font-size: 3em;
   padding: 0;
   margin: 0;
 }
 
 .banner--plain .banner__title {
   margin: 0;
   padding: 0;
 }


.banner__bottom-tagline {
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
}

.banner__bottom-tagline span{
  display: inline-block;
  background-color: #105ea6;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0.4rem 2rem;
  font-size: 1.5rem;
}
 
 /* thea B2B banner styles */
 
#webinar-preservative-free {
	margin-top: 70px !important;
	margin-bottom: 70px !important;
}

 .banner__container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
 }
 
 .banner__content {
   position: relative;
   z-index: 10;
   width: 96%;
 }
 
.banner__content--bottom {
  padding-top: 24%;
}

 
 .banner__header {
   color: #FFF;
 }
 
.banner__header.mission {
  color: #353535;
  text-align:center;
}

.extended .banner__header.mission {
  color: #353535;
  text-align:center;
  width:100%;
  margin: 0 auto;
  margin-bottom: 30px;
}

.extended .logo-pf {
	display:block;
	width: 100%;
	float:left;
	margin-bottom:40px;
}

.copy-block .banner__header.mission h2{
	margin-top: 0.5em;
	margin-bottom: 0em;
}

.copy-block .extended .banner__header.mission h2 {
	color:#FFFFFF;
}

.extended .banner__copy {
   margin: 0 auto 0 auto;
}

 .banner__headline {
   margin: 0;
   font-size: 1.7em;
   text-transform: uppercase;
   font-weight: bold;
   line-height: 1.1;
   text-shadow: 2px 2px 15px black;
 }
 
@media screen and (min-width: 40em) {
	.banner__headline {
	  font-size: 2.1em;
	}

}

.banner--slim.extended {
	height:1120px;
	background:#000;
}

.banner__headline--lowercase {
  text-transform: none;
  text-shadow: none;
  padding-bottom: 24px;
}

 .banner__headline--slim {
   font-size: 2.6em;
   text-align: center;
 }
 
 .banner__top-tagline {
   margin: 0;
   font-size: 1.6em;
 }
 
 .banner__copy {
   color: #FFF;
 }
 
 .banner__copy--slim {
   text-align: center;
 }
 
.banner__copy--padding {
  padding-bottom: 18px;
}

 
 .banner__actions {
   text-align: center;
   display: flex;
   justify-content: center;
 }
 
 .banner__cta {
   margin: 0 2% 0 0;
   /*width: 30%;*/
 }
 
 .banner__cta:last-child {
   margin: 0;
 }
 
 
 @media screen and (min-width: 320px) {
   
   .banner__title {
     font-size: calc(7.5vw + 7.5vh + 1vmin);
   }
   
 }
 
 @media screen and (min-width: 42.5em) {
 
   .banner__copy {
     width: 50%;
   }
 
 }
 
 @media screen and (min-width: 62.5em) {
   
   .banner__title {
     font-size: 8em;
   }
 
   .banner__headline {
    
   }
 
   .banner__headline {
     font-size: 3.2em;
     line-height: 1;
     /*width: 80%;*/
   }
 
   .banner__headline--full {
     width: 100%;
   }
 
   .banner__headline--slim {
     font-size: 2.6em;
   }
 
 
  .banner__copy--slim {
    width: 80%;
    margin: 0 auto;
  }
 
 
  .banner__copy {
     color: #FFF;
     width: 60%;
   }
 
  .banner__copy--scale {
    width: 90%;
    max-width: 70rem;
    text-align: center;
    margin: 0 auto;
  }

   
 }
 
 .banner__carousel {
   z-index: 18;
 }
 
 .banner__slide {
   position: relative;
   margin: 0 auto;
   background-color: black;
   height: 460px;
   overflow: hidden;
 }
 
 .banner__action {
   position: absolute;
   text-align: center;
   width: 100%;
   z-index: 10;
   top: 180px;
   left: 0;
 }
 
 .banner__action-link {
   margin: 0 auto;
   font-size: 1.6em;
   padding: 0.5rem 1.6rem;
   border-radius: 2rem;
   background-color: #FFF;
   font-family: "din-condensed";
   text-align: center;
   text-transform: uppercase;
   text-decoration: none;
   color: #0083c2;
 }
 
 .banner__image-silo {
   position: absolute;
   width: 600%;
   left: -250%;
 }
 
 .banner__image {
   display: block;
   width: 1500px;
   margin: 0 auto;
   /* positioning for small screen */
   /*margin-left: -40%;*/
 }
 
.banner__image--scale {
  width: 100vw;
}

.extended .banner__image {
  width: 750px;
  margin-top:-80px;
}
 
 
 /* re-position banner image for bigger screens */

@media screen and (min-width: 50em) {
  
  .banner__image {
    margin-left: auto;
  }

  .banner__image--scale {
    /*width: 1500px;*/
  }

}

 @media screen and (min-width: 40em) {
  
  .extended .banner__image {
    margin-left: auto;
  width: 1500px;
  margin-top:0px;
  }

}
 
 /* for desktop sized screens reset image position */
 
 
 
 
 /* make the banner image scale above 1500px */
 @media screen and (min-width: 1500px) {
 
 
   .banner__image-silo {
     position: absolute;
     width: 200%;
     left: -50%;
   }
 
   .banner__image {
     /*width: 50%;*/
   }
 
 }
 
 
 .banner__img {
   display: block;
   position: absolute;
   top: 0;
   /*left: -30%;*/
   transition: opacity 500ms ease-in-out;
   height: 460px;
    object-fit: cover;
    width: 100%;
 }
 
 .banner__img--static {
   width: 187%;
   left: -46%;
 }
 
 .banner__bg-img {
   position: absolute;
   width: 1500px;
   margin: 0 auto;
 }
 
 .banner__slide:hover .banner__img {
 }
 
 .banner__img--active {
   opacity: 0;
 }
 
 .banner__slide[aria-hidden="false"] .banner__img--active {
   opacity: 1;
   transition-delay: 1500ms;
 }
 
 /* carousel CSS - specific to https://github.com/ganlanyuan/tiny-slider */
 
 /* for main page carousel */
 
 .tns-controls {
   display: none;
 }
 
 .tns-controls button {
   position: absolute;
   z-index: 20;
   border: 0;
   top: 88%;
   left: 0;
   right: auto;
   margin-top: -1.5rem;
   height: 3rem;
   width: 3rem;
   margin-left: 20px;
   background: transparent url(/img/carousel/arrow-left.svg) 0 0;
 }
 
 .tns-controls button[data-controls="next"] {
   right: 0;
   left: auto;
   margin-left: 0;
   margin-right: 20px;
   background: transparent url(/img/carousel/arrow-right.svg) 0 0;
 }
 
 .tns-controls button span {
   position: absolute; 
   overflow: hidden; 
   clip: rect(0 0 0 0); 
   height: 1px;
   width: 1px; 
   margin: -1px;
   padding: 0;
   border: 0; 
 }
 
 .tns-nav {
   position: absolute;
   z-index: 20;
   bottom: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   padding-bottom: 20px;
 }

 .banner__carousel--tagline .tns-nav {
  padding-bottom: 72px;
 }


@media screen and (min-width: 560px) {

  .banner__carousel--tagline .tns-nav {
    padding-bottom: 52px;
  }

}
 
 .tns-nav button {
   display: inline-flex;
   margin: 0 5px;
   padding: 0;
   border: 1px solid #FFF;
   border-radius: 50%;
   width: 30px;
   height: 30px;
   background-color: transparent;
   position: relative;
 }
 
 .tns-nav button::before {
   content: "";
   position: absolute;
   border-radius: 50%;
   width: 20px;
   height: 20px;
   top: 4px;
   left: 4px;
   background-color: #FFF;
   opacity: 0;
   transition: opacity 300ms ease-in-out;
 }
 
.extended .banner__top-tagline {
	text-align:center
}

.extended .banner__headline {
	text-align:center
}


 button.tns-nav-active::before {
   opacity: 1;
 }
 
.banner__header--slim.extended {
  margin-bottom:50px;
}

 /* breakpoints for carousel */
 
 @media screen and (min-width: 60em) {
   
   
   .banner {
     width: 100%;
     height: 460px;
     position: relative;
     margin-top: 17px;
   }
 
   .banner--slim {
     height: 460px;
   }
   
  .banner--slim.extended {
    height: 1080px;
	margin-top:0px;
	margin-bottom:40px;
	background:#000;
  }
  
  .banner__header--slim.extended {
    margin-bottom:210px;
  }
  
   .banner--product {
     height: 420px;
   }
 
   .banner--extra-slim {
     height: 350px;
   }

  .banner--super-slim {
     height: 150px;
   }

 
   .banner--plain {
     height: 330px;
   }

  .banner--scale {
    height: auto;
  }
   
   .banner__static {
     
   }
 
   .banner__slide {
     height: 460px;
   }
 
   .banner__content {
     width: 84%;
   }
  
  .extended .banner__content {
    width: 84%;
	margin-top:75px;
  }
 
   .tns-controls button {
     top: 50%;
     left: 0;
   }
   
   .tns-controls {
     display: block;
   }
   
   .tns-controls button[data-controls="next"] {
     right: 0;
     left: auto;
   }
   
   
   .banner__action {
     top: 412px;
   }
   
   .banner__img {
     max-width: 1500px;
     top: 0;
     left: 0;
   }
   
   .banner--product .banner__img {
     height: 420px;
   }
   
   .banner--extra-slim .banner__img {
     height: 350px;
   }
   
   .banner--slim .banner__img {
     height: 460px;
   }
  
   .banner__action-link { 
     font-size: 2em;
     padding: 0.7rem 2rem;
     border-radius: 2rem;
   }
  
  
  .tns-nav {
    padding-bottom: 20px;
  }
   
 }
 
 @media screen and (min-width: 75em) {
 
    .banner__carousel, .banner__static {
     position: absolute;
     top: 50%;
     left: 50%;
     width: 1496px;
     height: 460px;
     margin-top: -230px; /* Half the height */
     margin-left: -748px; /* Half the width */
     z-index: 18;
   }
 
    .tns-controls button {
     left: 160px;
   }
   
   
   .tns-controls button[data-controls="next"] {
     right: 160px;
     left: auto;
   }
 
 }
 
 
 /* for timeline carousel */
 .milestones {
   position: relative;
   /*border: 1px solid red;*/
 }
 
 .milestones *:focus {
   outline: none;
 }
 
 .milestones:before {
   content: " ";
   display: block;
   position: absolute;
   top: 50%;
   left: 5%;
   height: 1px;
   padding-top: 0px;
   border-bottom: 1px solid silver;
   width: 90%;
   z-index: 1000;
 }
 
 .milestones:after {
   content: " ";
   display: block;
   position: absolute;
   top: 50%;
   left: 5%;
   height: 20px;
   width: 90%;
   z-index: 1000;
   background-size: 14%;
   background-repeat: repeat-x;
   background-image: linear-gradient(to right, silver 1px, transparent 1px, transparent);
   background-position: left 30px top;
   margin-top: -9px;
 }
 
 /*
 background-size: 50px 50px;
 background-repeat: repeat-x;
 background-image: linear-gradient(to right, black 1px, transparent 1px, transparent),
                   linear-gradient(to right, black 1px, transparent 1px, transparent),
                   linear-gradient(60deg, transparent 25px, black 25px, transparent 26px, transparent);
 background-position: left 30px top,
                      left 5px bottom,
                      left 5px center;
 */
 
 .milestones__list {
 
 }
 
 .milestones__item-group {
   /*border: 1px solid green;*/
   margin-left: 1%;
   margin-right: -1%;
   position: relative;
 }
 
 .milestones__item-group.tns-slide-active + .milestones__item-group:after {
   content: " ";
   display: block;
   position: absolute;
   width: 47%;
   height: 50%;
   background: rgb(243,243,243);
 background: linear-gradient(90deg, rgba(243,243,243,0) 0%, rgba(243,243,243,1) 70%);
   bottom: 0;
   right: 0;
 }
 
 
 
 .milestones__item {
   overflow: hidden;
   width: 85%;
   float:left;
   /*border: 1px solid blue;*/
   height: 267px;
 }
 
 .milestones__item:first-child {
   margin-left: -12%;
 }
 
 
 .milestones__item:nth-child(2) {
   margin-top: 330px;
   margin-left: -60%;
 }
 
 /*
 .milestones__item:nth-child(3) {
   margin-left: -4%;
 }
 
 .milestones__item:nth-child(4) {
   margin-left: -36%;
   margin-top: 270px;
 }
 */
 
 
 
 
 .milestones__img {
   width: 40%;
   float: left;
   border: 1px solid #d9d9d9;
 }
 
 .milestones__body {
   width: 60%;
   float: left;
   padding-left: 12px;
 }
 
 .milestones__body h3 {
   margin: 0;
 }
 
 .milestones .tns-nav button {
   border: 1px solid blue;
 }
 
 @media screen and (min-width: 45em) {
 
   .milestones .tns-controls {
     display: block;
   }
 
 }
 
 
 .milestones .tns-controls button {
   position: absolute;
   z-index: 20;
   border: 0;
   top: 50%;
   left: 0;
   right: auto;
   margin-top: -1.5rem;
   height: 3rem;
   width: 3rem;
   margin-left: 0;
   background: transparent url(/img/carousel/arrow-left-blue.svg) 0 0;
 }
 
 .milestones .tns-controls button[data-controls="next"] {
   right: 0;
   left: auto;
   margin-left: 0;
   margin-right: 0px;
   background: transparent url(/img/carousel/arrow-right-blue.svg) 0 0;
 }
 
 
 
 @media screen and (min-width: 50em) {
   
   .intro {
     margin: 0 auto;
   }
   
 }
 
.download-template .intro {
  text-align: left;
}

.download-template .intro BUTTON {
  float: right;
}

.download-template .form {
  padding-top: 84px !important;
}

.download-template .form {
  padding-bottom: 110px !important;
}

 .intro {
   text-align: center;
   padding-bottom: 10px;
 }
 
 .intro p, .intro h1 {
   text-align: center;
 }
 
 .section--intro {
 }
 
 .badges {
   background: transparent url(/img/water-splash.png) center top no-repeat;
   margin-top: -256px;
   padding-top: 139px;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: baseline;
   padding-bottom: 74px;
 }
 
 .badges__item {
   width: 150px;
   margin: 0 40px;
 }
 
 .badges__label {
   text-align: center;
   font-family: "din-condensed";
   text-transform: uppercase;
   font-size: 1.5em;
   line-height: 1;
 }
 
 .section--expert-eye-care {
   background: transparent url(/img/section-gradient-eye-care.png) center top no-repeat;
   background-size: cover;
   overflow: hidden;
   padding-bottom: 0;
   position: relative;
   min-height: 489px;
 }
 
 .section--preservative-free {
   background: transparent url(/img/section-gradient-preservative-free.jpg) center top no-repeat;
   background-size: cover;
   overflow: hidden;
   padding-bottom: 0;
   margin-top: -80px;
   position: relative;
   min-height: 498px;
 }
 
 .panel-lrg__copy {
   padding-left: 1.6rem;
   padding-right: 1.6rem;
 }
 
 .panel-lrg__copy p {
   color: #FFF;
 }
 
 
 .panel-lrg__header {
   display: flex;
   align-items: center;
 }
 
 .panel-lrg__headline {
   color: #FFF;
   font-size: 3.6rem;
   font-weight: normal;
   line-height: 0.85;
   word-spacing: -0.1em;
   font-family: "din-condensed";
   text-transform: uppercase;
   margin: 0;
   padding-left: 1.5rem;
 }
 
 .panel-lrg__badge {
   /* safari fix for mobile - flex image item does not shrink correctly */
   max-width: 50%;
 }
 
 /*
 
 .panel-lrg__badge {
   position: absolute;
   top: 0;
   right: 0;
   margin-top: -25px;
 }
 
 */
 
 
 @media screen and (min-width: 42em) {
   
   .panel-lrg__copy {
     width: 50%;
     float: left;
     padding-left: 2rem;
     padding-right: 2rem;
   }
   
   .panel-lrg__headline {
     font-size: 7.6rem;
   }
   
   
   .panel-lrg__headline--narrow {
     width: 60%; 
   }
   
   
 }
 
 @media screen and (min-width: 58.75em) {
   
   .panel-lrg__header {
     display: block;
     position: relative;
   }
 
   .panel-lrg__badge {
     position: absolute;
     top: 0;
     right: -25px;
     margin-top: -25px;
   }
   
   
 }
 
 
 /* story panels */
 
 .stories {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
   padding: 4px 0 0 0;
   margin-bottom: 40px;
 }
 
 .stories__panel {
   position: relative;
   color: #FFF;
   width: 100%;
   max-width: 420px;
 }
 
 .stories__copy {
   position: absolute;
   width: 60%;
   padding-top: 1em;
   padding-left: 1em;
   color: #FFF;
   fill: #FFF;
   z-index: 2;
   right: 0;
 }
 
 .stories__copy--contrast {
   color: #444;
   fill: #444;
 }
 
 .stories__quote {
   color: inherit;
   padding: 0;
   margin: 0;
   font-size: 1.3em;
 }
 
 .stories__quote .pull-double {
   margin-left: -0.4em;
 }
 
 .stories__person {
   color: inherit;
   line-height: 1.3;
   margin: 0.2em 0 0 0;
   padding: 0;
   font-size: 0.9em;
   font-weight: bold;
   text-transform: uppercase;
 }
 
 .stories__event {
   color: inherit;
   line-height: 1.3;
   margin: 0.2em 0.2em 0.2em 0;
   padding: 0;
   font-size: 1em;
   font-weight: bold;
   text-transform: uppercase;
 }
 
 
 
 .stories__rating {
   color: inherit;
   margin: 0;
   padding: 0;
 }
 
 .stories__rating .svg-icon {
   fill: inherit;
   width: 1em;
 }
 
 .stories__cta-holder {
   position: relative;
   height: 0;
   padding-bottom: 97.5%;
 }
 
 .stories__cta-holder--simple {
   padding-bottom: 78%;
 }
 
 .stories__img {
   width: 100%;
   position: absolute;
 }
 
 .stories__cta {
     position: absolute;
     z-index: 10;
     bottom: 0;
     width: 100%;
     height: 3.5rem;
     background: rgba(10,10,10,0.4) url(/img/icon-quotes.svg) 0.8rem center no-repeat;
     background-size: 2.6rem;
     padding-left: 4rem;
     color: #FFF;
     font-family: "din-condensed";
     text-transform: uppercase;
     font-size: 1.2em;
     text-decoration: none;
     display: block;
     line-height: 2.8em;
 }
 
.stories__cta.stories__cta--webinar {
    top: 0;
    height: 2.5rem;
}

 .stories__cta--play {
   background-image: url(/img/icon-play.svg);
 }
 
 .stories__cta--read {
   background-image: url(/img/icon-read.svg);
 }
 
 .stories__cta--simple {
   background-image: none;
   padding-left: 1em;
 }
 
 .stories__cta--video {
   background-image: none;
   padding-left: 1em;
   padding-right: 1em;
   line-height: 1.1;
   padding-top: 0.4em;
   text-align: center;
 }
 
 .cta-link  {
   /*margin: 0 auto;*/
   font-size: 1em;
   font-weight: bold;
   border-radius: 2rem;
   background-color: #FFF;
   padding: 0.5rem 1.6rem;
   text-align: center;
   text-transform: uppercase;
   text-decoration: none;
   color: #0e5da5;
   display: inline-block;
   line-height: 1.4;
   border: none;
 }
 
 .cta-link--contrast {
 	background: #135ea8;
 	color: #fff;
 }
 
 .cta-link--btn {
  border: 1px solid transparent;
 }
 
 .cta-link--extra {
   padding: 0.5rem 3rem;
 }
 
 .cta-link--symptom {
   font-size: 1.4em;
   padding: 0.3rem 1.4rem;
 }

 .cta-link--large {
   font-size: 1.3rem;
 }
 
 .cta-link--line {
     margin-bottom: 12px;
 }
 
 .cta-link--line:last-child {
   margin-right: 0;
 }
 
 .cta-link__icon {
   display: inline-block;
   width: 1.3em;
   vertical-align: sub;
 
 }
 
 .cta-link--notice {
   color: #000;
   font-weight: bold;
   padding: 0.1rem 1.4rem;
 }
 
 @media screen and (max-width: 45em) {
 
   .cta-link--line {
     display: inline-block;
     padding-top: 0.2rem;
     padding-bottom: 0.2rem;
   }
 
 }
 
 
 .cta-link--inactive {
   opacity: 0.4;
 }
 
 .cta-link--inactive:hover {
   opacity: 1;
 }
 .location__field {
   margin: 0 auto;
   width: 40%;
 }
 
 .location__field:after {
   content: "";
   display: table;
   clear: both;
 }
 
 .location__input {
   float: left;
   width: 100%;
   border: 0;
   font-size: 1.3em;
   border-radius: 2em;
   padding: 0.5em 1em;
   background-color: #FFF;
   color: #333;
   box-shadow: 0px 0px 13px 7px rgba(160,160,160,0.3);
   margin-bottom: 40px;
 }
 
 .location__button {
   text-transform: uppercase;
   background-color: none;
   border: none;
   border-radius: 50%;
   margin-left: -45px;
   margin-top: 2px;
   width: 40px;
   height: 45px;
 }
 
 .location__button img {
   width: 20px;
 }
 
 img.basket__button {
   width: 45px;
 }
 
 /* stories breakpoints */
 
 @media screen and (min-width: 40.63em) {
   
   .stories__panel {
     max-width: none;
     width: 50%;
   }
   
 }
 
 
 /* make stories fit 4 on a line*/
 
 @media screen and (min-width: 60.63em) {
   
   .stories__panel {
     width: 25%;
   }
 
   /* or 3 for the simple variant */
 
   .stories__panel--simple {
     width: 33.3333%;
   }
   
 }
 
 
 
 .svg-icon {
   width: 2rem;
 }
 
 .logo--footer {
   padding: 0 0 0 0px;
   margin: 0 0 12px 0;
 }
 
 .footer {
   background-color: #105ea6;
   padding: 30px 0;
   overflow: hidden;
   font-size: 0.9em;
 }
 
 .footer__notice {
   background-color: #000;
   color: #FFF;
   margin-top: -30px;
   padding: 20px 0;
   margin-bottom: 20px;
 }
 
 .footer__notice-text {
   font-size: 1.8em;
   font-weight: bold;
   text-align: center;
   padding: 0;
   margin: 0;
 }
 
 
 
 .footer-info {
   border-bottom: 1px solid #FFF;
   margin-bottom: 0px;
 }
 
 .footer-info p {
   color: #FFF;
 }
 
 .footer-info .adr {
   margin-top: 0;
 }
 
 .footer-info .adr span {
   display: block;
 }
 
 .footer-info__item {
   color: #FFF;
   width: 33%;
   grid-column: col 1 / span 4;
   border-top: 1px solid #777;
   overflow: hidden;
   padding-top: 12px;
   margin-bottom: 12px;
 }
 
 .footer-info__item:first-child {
   border-top: none;
 }
 
 .footer-info__item:nth-child(2) {
   grid-column: col 5 / span 4;
 }
 
 .footer-info__item:nth-child(3) {
   grid-column: col 9 / span 4;
   border-right: none;
 }
 
 .footer-info__item:nth-child(4) {
   grid-column: col 11 / span 2;
 }
 
.competition-timeline-info__item {
  color: #006bc4;
  width: 100%;
  grid-column: col 1 / span 3;
  border-top: none;
  overflow: hidden;
  padding-top: 12px;
  margin-bottom: 12px;
}

.competition-timeline-graphic__item {
	width: 100%;
}

.competition-timeline-graphic__item img {
	width: 100%;
}

.competition-timeline-info__item h4 {
  font-size: 1.5em;
  font-weight: 600 !important;
  margin: 24px 0 12px 0;
}

.competition-timeline-info__item:first-child {
  border-top: none;
}

.competition-timeline-info__item:nth-child(2) {
  grid-column: col 4 / span 3;
}

.competition-timeline-info__item:nth-child(3) {
  grid-column: col 7 / span 3;
  border-right: none;
}

.competition-timeline-info__item:nth-child(4) {
  grid-column: col 10 / span 3;
}

.competition-download-info__item {
  color: #FFF;
  width: 100%;
  grid-column: col 1 / span 6;
  border-top: none;
  overflow: hidden;
  padding: 0px;
  margin: 0px;
}

.competition-download-info__item.left .competition-download-graphic__item {
	width: 35%;
	padding: 16px 0 16px 0;
	float:left;
}

.competition-download-info__item.left .competition-download-text__item {
	width: 65%;
	padding: 16px 20px 16px 20px;
	float:right;
}

.competition-download-info__item .competition-download-text__item h4 {
	font-size: 1.4em;
	padding: 0 0 0 0;
	margin: 6px 0 0 0;
}

.competition-download-info__item .competition-download-text__item p {
	padding: 0 0 0 0;
	margin: 10px 0 10px 0;
	line-height: 1.5;
}

.competition-download-graphic__item img {
	width: 100%;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

.competition-download-info__item.right .competition-download-graphic__item {
	width: 35%;
	padding: 16px 0 16px 0;
	float:right;
}

.competition-download-info__item.right .competition-download-text__item {
	width: 65%;
	padding: 16px 20px 16px 20px;
	float:left;
}

.competition-download-info__item:first-child {
  border-top: none;
}

.competition-download-info__item:nth-child(2) {
  grid-column: col 7 / span 6;
}

 .footer-info__title {
   color: #FFF;
   font-size: 1.2em;
   font-weight: 400;
   text-transform: none;
 }
 
 p.footer-info__sub-title {
   color: #FFF;
 }
 
 .footer-info__list {
   list-style: none;
   padding: 0 0 0 0;
   margin-bottom: 2rem;
 }
 
 .footer-info__list li {
   line-height: 1.8;
   font-weight: 300;
   margin-bottom: 6px;
 }
 .footer-info__article-item {
 
 }
 
 .footer-info__article-item span {
   font-size: 0.8em;
   display: block;
   text-decoration: none;
 }
 
 .footer-info__list--social {
   overflow: hidden;
 }
 
 .footer-info__social-item {
  width: 40px;
  height: 45px;
  float: left;
  padding: 0;
  margin: 0 6px 0 0;
  border: 0;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
 }
 
 .footer-org {
   border-top: 1px solid #777;
   border-bottom: 1px solid #777;
   
 }
 
 .footer-org p {
   color: #FFF;
 }
 
 .footer-copyright {
   float: left;
 }
 
 .footer-copyright p {
   color: #FFF;
 }
 
 .footer-nav {
   margin-top: 1em;
   padding-right: 30px;
 }
 
 .footer-nav__list {
   list-style: none;
   padding: 0;
   margin: 0;  
 }
 
 @media screen and (min-width: 37.5em) {
   
 
   .footer-info__item {
     border-right: 1px solid #FFF;
   }
 
   .footer-grid {
   	display: grid;
   	grid-template-columns: repeat(12, [col] 1fr );
   	grid-template-rows: repeat(2, [row] auto);
   	grid-column-gap: 30px;
   	grid-row-gap: 0px;
     padding: 0 30px;
   }
   
  .competition-timeline-grid {
  	display: grid;
  	grid-template-columns: repeat(12, [col] 1fr );
  	grid-template-rows: repeat(2, [row] auto);
  	grid-column-gap: 30px;
  	grid-row-gap: 0px;
    padding: 0 30px;
  }
  
  .competition-download-grid {
  	display: grid;
  	grid-template-columns: repeat(12, [col] 1fr );
  	grid-template-rows: repeat(2, [row] auto);
  	grid-column-gap: 0px;
  	grid-row-gap: 0px;
    padding: 0 0px;
  }
  
  .competition-download-info__item:first-child {
    border-right: 2px white solid;
  }

  .competition-download-info__item:nth-child(2) {
    border-left: 2px white solid;
  }
  
   .footer-nav {
     float: right;
   }
   
   .footer-nav__list {
     margin-left: 0;
   }
   
   .logo--footer {
     padding: 0 0 0 30px;
   }
   
   
   .footer-copyright {
     padding-left: 30px;
   }
   
 }
 
section.competition-download {
  background:#006bc4;
  padding: 0 0 0 0 !important;
  margin: 0 0 24px 0 !important;
}

section.competition-download .intro {
  background:#006bc4;
  padding: 0 0 0 0 !important;
  margin: 0 0 0 0 !important;
}

 .footer-nav__item {
   color: #FFF;
   font-weight: 500;
   float: left;
   font-size: 1em;
   line-height: 1.8;
   padding: 0 12px 0 12px;
   border-right: 1px solid #FFF;
   margin-bottom: 11px;
 }
 
 .footer-nav__item:last-child {
   padding-right: 0;
 }
 
 .footer-nav__item a {
   text-decoration: none;
 }
 
 .footer-nav__item:last-child {
   border: none;
   padding-right: 0;
 }
 
 /* footer accordian for small screens */
 .footer-toggle {
   width: 36px;
   height: 36px;
   position: relative;
   border: none;
   border-radius: 50%;
   background-color: #76165E;
   float: right;
   margin-top: -42px;
 }
 
 .js .footer-accordian {
   /*display: none;*/
   /*transform: translateY(-100%);*/
   margin: 0;
   max-height: 0;
   transition: max-height 220ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
   overflow: hidden;
 }
 
 .footer-accordian.js-show-mobile {
   /*display: block;*/
   /*transform: translateY(0);*/
   max-height: 600px;
   height: auto;
 }
 
 .js .footer-accordian > *:last-child {
   /* margin-bottom: 2rem;*/
 }
 
 /* switch off toggle for larger screens */
 @media screen and (min-width: 600px) {
   
   .footer-toggle {
     display: none;
   }
   
   .footer-info__item {
     border-top: none;
     /*padding: 0;*/
   }
   
   .js .footer-accordian, .footer-accordian.js-show-mobile{
     height: auto;
     max-height: none;
   }
   
   
 }
 
 
 .footer-toggle {
   border: 1px solid #FFF;
   border-radius: 50%;
   background-color: transparent;
 }
 
 .footer-toggle__lines, .footer-toggle__lines::before {
   position: absolute;
   background-color: #FFF;
   width: 70%;
   height: 2px;
   border-radius: 4px;
   left: 15%;
   transition-property: transform;
   transition-timing-function: ease-in-out;
   transition-duration: 220ms;
 }
 
 .footer-toggle__lines {
   transform: rotate(0deg);
 }
 
 .footer-toggle[aria-expanded="true"] .footer-toggle__lines {
   transform: rotate(180deg);
 }
 
 .footer-toggle__lines::before {
   content: "";
   display: block;
   transform: rotate(-90deg);
   width: 100%;
   left: 0;
 }
 
 .footer-toggle[aria-expanded="true"] .footer-toggle__lines::before {
   transform: rotate(0deg);
 }
 
 .symptoms {
   position: relative;
   display: flex;
   flex-wrap: wrap;
   align-items: flex-start;
 }
 
 
 .symptoms__grouping {
   width: 20%;
   height: 270px;
 }
 
 .js .symptoms__grouping.active {
   height: 940px;
 }
 
 .js .symptoms__details {
   display: none;
   position: absolute;
   background-color: #FFF;
   left: -200%;
   width: 500%;
   opacity: 0;
   transition: opacity 200ms ease-in;
 }
 
 .js .active .symptoms__details {
   display: block;
   opacity: 1;
   transition: opacity 200ms ease-in;
 }
 
 
 .symptoms__toggle {
   display: block;
   padding: 0;
   background-color: transparent;
   border: none;
   width: 130px;
   text-align: center;
   font-family: "din-condensed";
   text-transform: uppercase;
   font-size: 1.2em;
   line-height: 1;
   text-align: center;
   position: relative;
   height: 230px;
   padding-top: 125px;
   z-index: 10;
   margin: 0 auto;
 }
 
 .js .active .symptoms__toggle::after {
   content: " ";
   display: block;
   position: absolute;
   bottom: -30px;
   left: 25%;
   width: 50%;
   height: 0;
   border-left: 32px solid transparent;
   border-right: 32px solid transparent;
   border-top: 30px solid #e6e7e8;
 }
 
 .symptoms__icon {
   display: block;
   background-color: #FFF;
   height: 130px;
   width: 130px;
   border-radius: 50%;
   margin-bottom: 12px;
   position: absolute;
   top: 0;
   border: 4px solid transparent;
 }
 
 .js .active .symptoms__icon {
   border: 4px solid red;
 }
 
 .symptoms__trait-frame {
   
 }
 
 .symptoms_trait-list {
   display: flex;
   justify-content: center;
 }
 
 .symptoms__trait {
   width: 33.3333%;
   padding: 0 22px;
   text-align: center;
   position: relative;
   font-size: 0.9em;
 }
 
 .symptoms__trait-label, .symptoms__title {
   font-family: "din-condensed";
   font-weight: normal;
   text-transform: uppercase;
   font-size: 2.4em;
   text-align: center;
   margin: 12px 0 12px 0;
 }
 
 .symptoms__title {
   margin-top: 30px;
 }
 
 .symptoms__footer {
  
 }
 
 .symptoms__result {
   background-color: #2FB133;
   color: #FFF;
   font-family: "din-condensed";
   font-size: 1.2em;
   line-height: 1.2;
   text-transform: uppercase;
   border-radius: 18px;
   width: 90%;
   margin: 0 auto;
   padding: 6px 12px;
 }
 
 .symptoms__result--alt-2 {
   background-color: #145DA9;
 }
 
 .symptoms__result--alt-3 {
   background-color: #EF8201;
 }
 
 .symptoms__footnote {
   text-align: center;
   margin-top: 50px;
 }
 
 .product-nav {
   border-top: 1px solid #FFF;
   height: 3rem;
   background-color: #CFDFED;
   margin-top: -30px;
   margin-bottom: 20px;
 }
 
 
 .locator {
   overflow: hidden;
 }
 
 .locator__map {
   width: 100%;
   height: 700px;
 }
 
 .locator__map--results {
   width: 60%;
   height: 700px;
   float: left;
 }
 
 .locator__list {
   list-style: none;
   padding: 0;
   margin: 0;
   width: 40%;
   float: left;
   padding-right: 1rem;
 }
 
 .locator__item {
   /*border-top: 1px solid #555;*/
   border-bottom: 1px solid #555;
   padding: 1.2rem 0.5rem;
 }
 
 .locator__item:first-child {
   padding-top: 0;
 }
 
 .locator__name {
   display: block;
 }
 
 .locator__tel {
   
 }
 
 .locator__distance {
   float: right;
 }
   
 
 .therapy-areas {
   background-color: #54ccd4;
 }
 
 .therapy-areas__list {
   list-style: none;
   padding: 60px 0;
   width: 80%;
   margin: 0 auto;
   display: flex;
   flex-wrap: wrap;
   align-items: flex-start;
   justify-content: center;
 }
 
 
 .therapy-areas__item {
   height: 250px;
   width: 25%;
   font-family: "din-condensed";
   font-weight: normal;
   text-transform: uppercase;
   font-size: 1.6em;
   text-align: center;
 }
 
 .therapy-areas__icon {
   display: block;
   background-color: #FFF;
   border-radius: 50%;
   margin: 0 auto 24px auto;
   text-align: center;
   width: 155px;
   height: 155px;
 }
 
 .therapy-areas__icon img {
   margin-top: 47px;
 }
 
 .section-slider {
   width: 84%;
   margin: 0 auto;
 }
 
 .media {
   
 }
 
 .media__figure {
   width: 50%;
 }
 
 .media__figure:last-child {
 
 }
 
 .media__content {
   width: 100%;
 }
 
 @media screen and (min-width: 45em) {
 
   .media {
   display: flex;
   align-items: flex-start;
   }
 
   .media__figure {
     margin-right: 1.6em;
     margin-left: 0;
     flex: 1;
   }
 
   .media__figure:last-child {
     margin-right: 0;
     margin-left: 1.6em;
   }
 
   .media__content {
     flex: 1;
   }
 
 }
 
 
 .product-panel-list {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
 }
 
 .product-panel {
   width: 90%;
   margin-bottom: 46px;
 }
 
 
 @media screen and (min-width: 30em) {
   
   .product-panel {
     width: 50%;
   }
 
 }
 
 @media screen and (min-width: 48.75em) {
 
   .product-panel {
     width: 33.3333%;
     max-width: 340px;
   }
 
 }
 
 
 
 .product-panel__pack-frame {
   height: 200px;
   text-align: center;
 }
 
 .product-panel__pack-img {
   /*width: 100%;*/
   height: 200px;
 }
 
 .product-panel__symbol {
   width: 19%;
   float: left;
   margin-top: -43px;
   margin-right: 17px;
 }
 
 .product-panel__symbol svg {
   width: 100%;
   position: relative;
 }
 
 .product-panel__title {
   text-align: center;
   font-size: 1.8em;
 }
 
 .product-panel__title--therapy {
   text-align: left;
 }
 
 .product-panel__title a {
   text-decoration: none;
 }
 
 .product-panel__cta {
   text-align: center;
 }
 
 .product-panel__cta--therapy {
   text-align: left;
 }
 
 .hcp-check {
   background-color: #0d72c6;
   color: #FFF;
   margin-top: 40px;
   padding: 40px 0;
   margin-bottom: 30px;
 }

 .hcp-check--v2 {
   background-color: #064ddb;
   background-image: url(/img/hcp-check-bg.jpg);
   background-repeat: no-repeat;
   background-size: cover;
 }
 
 .hcp-check__body {
   width: 90%;
   max-width: 720px;
   margin: 0 auto;
   text-align: center;
   overflow: hidden;
 }

 .hcp-check__title {
  font-size: 3.8rem;
  font-weight: bold;
}

 
 .hcp-check__logo {
   display: block;
   width: 260px;
   margin: 0 auto;
 }
 
 .hcp-check__heading-shout {
   display: block;
   font-size: 1em;
   font-weight: bold;
   text-transform: uppercase;
   padding-top: 0.3em;
 }
 
 @media screen and (min-width: 28em) {
   .hcp-check__heading-shout {
     font-size: 1.4em;
   }
 }
 
 .hcp-check__forms {
  max-width: 40ch;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
 }

 .hcp-check__form {
   width: 45%;
 }
 
 .hcp-check__form--no {
   border-right: none;
 }
 
 .hcp-check__button {
   border: none;
   width: 75px;
   height: 110px;
   float: right;
   background: transparent url(../img/hcp-thumbs-up.png) 0 0 no-repeat;
   margin-right: 30px;
   cursor: pointer;
 }
 
 .hcp-check__button span {
   position: absolute; 
   overflow: hidden; 
   clip: rect(0 0 0 0); 
   height: 1px;
   width: 1px; 
   margin: -1px;
   padding: 0;
   border: 0;
 }
 
 .hcp-check__button--no {
   background: transparent url(../img/hcp-thumbs-down.png) 0 0 no-repeat;
   float: left;
   margin-right: 0px;
   margin-left: 30px;
 }
 
 .non-hcp {
 
 }
 
 .non-hcp__list {
   list-style: none;
 }
 
 .non-hcp__item {
   padding: 6px 16px;
 }
 
 .non-hcp__item:nth-child(odd) {
   background-color: #f2f3f3;
 }
 
 .non-hcp__title {
   font-weight: bold;
   margin: 0;
 }
 
 .non-hcp__link {
   margin: 0;
 }

  .non-hcp__consumer {
   margin: 0;
  }
 
 .non-hcp__docs {
   padding-top: 0px;
   margin: 0;
 }
 
 @media screen and (min-width: 45em) {
 
   .non-hcp__item {
     padding: 14px 20px;
     display: flex;
     gap: 0.7rem;
   }

   .non-hcp__item  > p {
    flex-basis: 18%;
   }
 
   .non-hcp__title {
 
   }
 
   .non-hcp__consumer {

   }

   .non-hcp__link {

   }
 
   .non-hcp__docs {
     flex-grow: 1;
     display: inline-flex;
     flex-wrap: wrap;
     justify-content: flex-start;
     gap: 0.5rem;
   }
 
 }
 
 
 @media screen and (min-width: 62em) {
 
   .non-hcp__item {
     padding: 14px 60px;
   }
 
   .non-hcp__title {
     
    
   }
 
   .non-hcp__link {
   
   }
 
   .non-hcp__docs {
     
   }
 
 }
 
 
 .product-banner {
   /*background-color: #3084c5;*/
   /*background: rgb(156,64,152);
   background: linear-gradient(297deg, rgba(156,64,152,1) 0%, rgba(187,133,187,1) 51%, rgba(187,133,187,1) 59%, rgba(156,64,152,1) 100%);*/
   /*background: rgb(156,64,152);
   background: linear-gradient(186deg, rgba(156,64,152,1) 0%, rgba(187,133,187,1) 55%, rgba(187,133,187,1) 63%, rgba(156,64,152,1) 100%);*/
   background: #9C4098;
   background: linear-gradient(111deg, #9C4098 34%, #BB85BB 100%); 
 }

 .product-banner--preservative-free {
   background: #819f27;
 }
 
 /*#9C4098; fill: #BB85BB*/
 
 .product-banner__container {
   position: relative;
   height: 85px;
 }
 
 .product-banner__hero {
   position: absolute;
   bottom: 38px;
   right: 140px;
   display: none;
 }
 
 @media screen and (min-width: 42.5em) {
 
   .product-banner__hero {
     display: block;
   }
 
 }
 
 
 .product-banner__hero img {
   width: auto;
 }
 
 .product-banner__symbol {
   position: absolute;
   color: red;
   fill: pink;
   width: 105px;
   bottom: 6px;
   right: 0;
 }
 
 .product-files {
   padding-top: 24px;
   margin-bottom: -32px;
   margin-left: -10px;
 }
 
 
 .product-badges {
 
 }
 
 @media screen and (min-width: 40em) {
 
   .product-badges {
     float: right;
     /*margin-right: -71px;*/
     margin-left: 29px;
   }
 }
 
 
 
 .product-badges img {
   display: block;
   margin: 0 auto 22px auto;
 }
 
 .product-feature-image {
  text-align: center;
  padding-top: 33px;
 }
 
 .product-feature-image img {
  
 }
 
 
 /* general case for accordian set up */
 
 .accordian {
   /* holding element for accordian */
   position: relative;
   /*padding: 0;*/
 }
 
 .accordian__title, .copy-block h2.accordian__title {
   padding-left: 42px;
   margin-top: 0;
   font-weight: bold;
   font-size: 1.7em;
 }
 
 .accordian__title--first, .copy-block h2.accordian__title--first {
   margin-top: 60px;
 }
 
 .accordian__toggle {
   width: 40px;
   height: 40px;
   position: absolute;
   border: 1px solid #135ea8;
   border-radius: 50%;
   background-color: transparent;
   /*float: left;*/
   /*margin-top: -51px;*/
   margin-left: -10px;
   top: -5px;
 }
 
 .accordian__lines, .accordian__lines::before {
   position: absolute;
   background-color: #135ea8;
   width: 70%;
   height: 2px;
   border-radius: 4px;
   left: 15%;
   transition-property: transform;
   transition-timing-function: ease-in-out;
   transition-duration: 420ms;
 }
 
 .accordian__lines {
   transform: rotate(0deg);
 }
 
 .accordian__toggle[aria-expanded="true"] .accordian__lines {
   transform: rotate(180deg);
 }
 
 .accordian__lines::before {
   content: "";
   display: block;
   transform: rotate(-90deg);
   width: 100%;
   left: 0;
 }
 
 .accordian__toggle[aria-expanded="true"] .accordian__lines::before {
   transform: rotate(0deg);
 }
 
 /* js accordian behavior */
 
 .js .accordian__box {
   /*display: none;*/
   /*transform: translateY(-100%);*/
   margin: 0;
   display: grid;
   grid-template-rows: 0fr;
   transition:  grid-template-rows 420ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
 }
 
 .accordian__box.js-show {
   /*display: block;*/
   /*transform: translateY(0);*/
   grid-template-rows: 1fr;
 }

 .accordian__content {
    overflow: hidden;
    padding-top: 1rem;
 }

 .accordian__content :first-child {
    margin-top: 0;
 }
 
 .js .accordian__box > *:last-child {
   /*margin-bottom: 2rem;*/
 }
 
 
 /* enquiry forms */
 
 .form {
   padding-bottom: 60px;
 }
 
 .form__form {
 
 }
 
 .form__control {
   overflow: hidden;
   margin-bottom: 20px;
 }
 
 .form__label {
   float: left;
   width: 30%;
   margin-top: 0.5em;
 }
 
 .form__field {
   float: left;
   width: 67%;
   border: none;
   background-color: #e6e7e8;
   padding: 8px;
 }
 
 .form__field--textarea {
   padding: 0;
   height: 10em;
 }
 
 .form__error-list {
   list-style: none;
   clear: both;
   padding-top: 10px;
   margin-bottom: 0;
 }
 
 .form__error-item {
   color: red;
 }
 
 .form__submit {
   margin-top: 40px;
 }
 
 
 .contact__container {
   width: 84%;
   margin: 0 auto;
   overflow: hidden;
   padding-bottom: 60px;
 }
 
 .contact__nav {
   margin-bottom: 60px;
   /*margin-top: -60px;*/
   text-align: center;
 }
 
 .contact__form {
   
 }
 
 .contact__details {
  
 }
 
 .contact__title {
   margin-top: 0;
 }
 
 .contact__social-list {
   list-style: none;
 }
 
 .contact__social-item {
  width: 40px;
  height: 45px;
  float: left;
  padding: 0;
  margin: 0 6px 0 0;
  border: 0;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
 }
 
 .contact__block {
    padding-left: 50px;
 }
 
 .contact__block--last {
   padding-bottom: 30px;
 }
 
 .contact__icon {
   width: 40px;
   float: left;
   margin-left: -50px;
 }
 
 @media screen and (min-width: 45em) {


  .contact__container--resource {
    max-width: 44rem;
  }

 
   .contact__form {
     width: 70%;
     float: left;
   }


 
   .contact__details {
     width: 30%;
     float: left;
   }
 
 }
 
 .article-list {
   overflow: hidden;
   display: flex;
   justify-content: flex-start;
   flex-wrap: wrap;
 }
 
 .article-list__item {
   width: 90%;
   margin: 0 auto;
   margin-bottom: 36px;
   position: relative;
 }
 
 
 @media screen and (min-width: 39.4em) {
 
 
 .article-list__item {
  width: 47%;
  margin: 0;
  margin-bottom: 36px;
  margin-right: 36px;
  position: relative;
  display: flex;
  flex-direction: column;
}
 
 .article-list__item:nth-child(2n) {
   margin-right: 0;
 }

  .article-list__item-body {
     display: flex;
  flex-direction: column;
  height: 100%;

  }
 
 .article-list__cta {
    margin-top: auto;
 }
 
 

 }
 

@media screen and (min-width: 48em) {
 
 
.article-list__item {
  width: 30%;
  margin-bottom: 36px;
  margin-right: 36px;
  position: relative;
}
 
 .article-list__item:nth-child(2n) {
   margin-right: 36px;
 }
 
 .article-list__item:nth-child(3n) {
   margin-right: 0;
 }
 
}
 
 
 
 .article-list__img {
   width: 100%;
 }
 
 .article-list__item-body {
 
 }
 
 .article-list__item-body h3 {
   margin-bottom: 0;
  font-weight: 500;
 }
 
 .article-list__date {
   margin: 0;
   font-size: 0.9em;
 }
 
 
 
 .events {
 
 }
 
 .events__item {
   list-style: none;
   border-bottom: 1px solid #135ea8;
   padding: 20px 0px;
   margin-bottom: 20px;
 }
 
 
 .events__img {
   flex: 0.6;
 }
 
 .events__title {
   font-weight: bold;
   font-size: 1.2em;
 }
 
 .events__info {
   font-weight: bold;
   text-transform: uppercase;
   font-size: 0.9em;
   color: #777;
   margin: -1em 0 0.8em 0;
 }
 
 .events__date {
   margin-top: -0.7em;
 }
 
 
 .dropdown {
   display: block;
   width: 200px;
   margin: 0 auto;
 }
 
 .dropdown > .dropdown--summary{
   color: #FFF;
   width: 100%;
   display: list-item;
 }
 
 .dropdown > .filter-nav {
   list-style: none;
   background-color: #fff;
   border: 1px solid #cecece;
   border-radius: 15px;
   padding: 8px;
   position: absolute;
   top: 2.5em;
   z-index: 1;
   width: 100%;
   min-width: 100%;
 }
 
 .filter-nav__item {
   margin-right: 2em;
   width: 100%;
 }
 
 .filter-nav__item.active {
   font-weight: bold;
 }
 
 .filter-nav__link {
   font-weight: inherit;
   text-decoration: none;
 }
 
 
 .notice-box.inactive {
   display: none;
 }
 
 .notice-box {
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   width: 100%;
   height: 100%;
   z-index: 100;
   display: block;
   opacity: 0;
   z-index: -10;
   background-color: rgba(16,116,201,0.94);
 }
 
 .notice-box__close {
   background-color: transparent;
   border-radius: 100%;
   border: 1px solid #FFF;
   color: rgb(0, 0, 0);
   cursor: pointer;
   height: 36px;
   width: 36px;
   float: right;
   opacity: 0.9;
   outline-color: rgb(0, 0, 0);
   outline-style: none;
   outline-width: 0px;
   transition-delay: 0s;
   transition-duration: 0.1s;
   transition-property: all;
   transition-timing-function: ease;
   z-index: 10;
   margin: -10px 0 0 0;
 }
 
 
 .notice-box__close:after {
   content: "";
   display: table;
   clear: both;
 }
 
 .notice-box__close svg {
   height: 18px;
   width: 15px;
   fill: #fff;
   vertical-align: top;
 }
 
 .notice-box__close:hover {
   background: rgba(255,255,255,.2);
 }
 
 .notice-box.active {
 
   display: block;
   opacity: 1;
   z-index: 120;
 }
 
 /* lock scrolling underneath the notice */
 .notice-box.active + .core {
   overflow: hidden;
   height: 100vh;
 }
 
 
 
 .notice-box__body {
   width: 96%;
   max-width: 700px;
   margin: 0 auto;
   /*border: 2px solid red;*/
   z-index: 1;
   background-color: transparent;
   padding: 52px 20px 30px 20px;
   opacity: 0;
   animation-name: infoHide;
   animation-duration: 0.6s;
   animation-timing-function: linear;
   animation-iteration-count: 1;
   color: #fff;
 }
 
 .notice-box.active .notice-box__body {
   opacity: 1;
 }
 
 
 .notice-box__copy {
   margin-top: 20px;
   height: 80vh;
   overflow-y: scroll;
   width: 100%;
   padding: 0 21px;
   background-color: transparent;
   scrollbar-color: rgba(120,120,120,0.7) transparent;
 }
 
 .notice-box__copy::-webkit-scrollbar-track
 {
     border-radius: 3px;
     background-color: transparent;
 }
 
 .notice-box__copy::-webkit-scrollbar
 {
     width: 6px;
     background-color: transparent;
 }
 
 .notice-box__copy::-webkit-scrollbar-thumb
 {
     border-radius: 3px;
     background-color: rgba(100,100,100,0.5);
 }
 
 .notice-box__title {
   margin-top: 0px;
   font-weight: bold;
   text-align: left;
 }
 
 
 .library {
   width: 96%;
   margin: 0 auto;
 }
 
 .library__item {
   border-bottom: 1px solid silver;
   padding-bottom: 1rem;
   margin-bottom: 2rem;
 }
 
 .library__item:after {
   content: "";
   display: table;
   clear: both;
 }
 
 .library__img-silo {
   display: block;
   position: relative;
   overflow: hidden;
   width: 160px;
   margin: 0 auto;
 }
 
 .library__img {
   display: block;
   margin: 0 auto;
 }
 
 .library__img--soon {
   filter: grayscale(80%);
   opacity: 0.7;
 }
 
 .library__item-body {
   margin-top: 1rem;
 }
 
 .library__badge {
   position: absolute;
   background-color: rgba(19,94,168,0.8);
   color: #FFF;
   display: block;
   padding: 6px;
   width: 140%;
   text-align: center;
   top: -18px;
   transform: rotate(-40deg) translateX(-35%);
 }
 
 .library__coming-soon {
   font-weight: bold;
   font-style: italic;
 }
 
 
 @media screen and (min-width: 35em) {
 
   .library__item {
     padding-bottom: 2rem;
     margin-bottom: 3rem;
   }
 
   .library__item:after {
     content: "";
     display: table;
     clear: both;
   }
 
   .library__img-silo {
       float: left;
       width: 21%;
   }
 
   .library__img {
       width: 100%;
   }
 
     .library__item-body {
       float: left;
       margin-left: 3rem;
       width: 70%;
       max-width: 700px;
       margin-top: -1rem;
   }
 
 }
 
 
 @media screen and (min-width: 37.5em) {
 
   .library {
     max-width: 50rem;
   }
 }
 
 
 .library-download {
  margin-top: 2rem;
  margin-bottom: 2rem;
 }
 
 
 
.content-updated {
  margin: -12px 0 44px 0;
  font-size: 0.9em;
}


.section--intro.social {
  clear:both;
  display:block;
  width: 100%;
  overflow:auto;
}


.social-sharing {
  overflow:auto;
}

.social-sharing p {
  display:block;
  float:left !important;
  width: auto !important;
}

.social-sharing .icon {
  display:block;
  float:left;
}

.social-sharing .icon img {
  width: 50%;
}

.logo-pf {
  display:block;
  width: 100%;
  float:left;
}

.logo-pf p {
  width: 77% !important;
  float:left;
}

.logo-pf figure {
  width: 17%;
  float:right;
  padding:0px 0px 0px 0px;
  margin: 16px 0px 0px 16px;
}

.logo-pf figure img {
  width: 100%;
}

.extended .logo-pf h2 {
  width: 100%;
  font-size:1.5em;
}

.extended .logo-pf figure {
  width: 100%;
  text-align:center;
  margin-bottom: 24px;
}

.extended .logo-pf figure img {
  width: 35%;
}

.extended .banner__copy {
  text-align:center;
  width: 100%;
  font-size: 1.0em;
}

.banner--slim.extended {
  margin-bottom: 30px;
}


@media screen and (min-width: 40em) {

  .extended .logo-pf h2 {
    width: 77% !important;
    float:left !important;
    font-size:2.0em;
  }
  .extended .logo-pf figure {
    width: 19%;
    float:right;
    padding:0px 0px 0px 0px;
    margin: 28px 0px 0px 0px;
  }
  .extended .logo-pf figure img {
    width: 100%;
  }
  .extended .banner__copy {
    text-align:center;
    width: 70%;
    font-size: 1.2em;
  }
  
}


/* input styling */

.form__error {
  color: red;
  margin-bottom: 20px;
}

.fancy-input {
  margin-bottom: 20px;
  position: relative;;
}
/*
-.fancy-input__label {
-  display: block;
-}
-
-.fancy-input__field {
-  border: none;
-  border-bottom: 1px solid #ADADAD;
-  padding: 4px;
-  width: 100%;
-}
-*/

.fancy-input__field {
  color: #585856;
  font-size:18px;
  padding: 10px 10px 10px 0px;
  display:block;
  width: 100%;
  border:none;
  border-bottom: 1px solid #ADADAD;
  outline: none;
  position: relative;
  background-color: rgba(255,255,255,0.0001);
  z-index: 12;
}

.fancy-input__field:invalid {
  border: none;
  box-shadow: none;
}

.fancy-input__field--alt-1 {
  color: #FFF;
  border-bottom: 1px solid #FFF;
}

.fancy-input__req {
  display: inline-block;
  vertical-align: top;
}

.fancy-input__checkbox {
  float: left;
}

.fancy-input__checkbox-label {
  color: #585856; 
  font-size: 0.9em;
  line-height: 1.4;
  float: left;
  margin-left: 1.3em;
  margin-top: -1.1em;
  margin-bottom: 1em;
}




/* LABEL ======================================= */
.fancy-input__label {
  color:#999; 
  font-size: 1em;
  font-weight:normal;
  position:absolute;
  background-color: transparent;
  pointer-events: none;
  left:0px;
  top:10px;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

/* active state */
.js-fancy--focus .fancy-input__label, .js-fancy--filled .fancy-input__label {
  top:-20px;
  font-size: 0.8em;
  color: #76165E;
}

.fancy-input__label--alt-1 {
  color: #FFF;
}

.js-fancy--focus .fancy-input__label--alt-1, .js-fancy--filled .fancy-input__label--alt-1 {
  color: #FFF;
}


.fancy-input--error .fancy-input__label {
  color: red;
}



/* place holder hidden - then shown on focus */

::-webkit-input-placeholder { color: transparent; } /* Chrome/Opera/Safari */

::-moz-placeholder { color: transparent; } /* Firefox 19+ */

:-ms-input-placeholder { color: transparent; } /* IE 10+ */

:-moz-placeholder { color: transparent; } /* Firefox 18- */

.fancy-input__field:focus::-webkit-input-placeholder { color: #888; } /* Chrome/Opera/Safari */

.fancy-input__field:focus::-moz-placeholder {  color: #888;  } /* Firefox 19+ */

.fancy-input__field:focus:-ms-input-placeholder {  color: #888;  } /* IE 10+ */

.fancy-input__field:focus:-moz-placeholder {  color: #888;  } /* Firefox 18- */



/* BOTTOM BARS ================================= */
.fancy-input__bar { position: relative; display: block; width: 100%; }
.fancy-input__bar:before, .fancy-input__bar:after {
  content: '';
  height: 1px; 
  width: 0;
  bottom: 0px; 
  position: absolute;
  z-index: 14;
  background: #76165E; 
  transition: 0.2s ease all; 
  -moz-transition: 0.2s ease all; 
  -webkit-transition: 0.2s ease all;
}

.fancy-input__bar--alt-1:before, .fancy-input__bar--alt-1:after {
  background: #FFF;
}

.fancy-input--error .fancy-input__bar:before, .fancy-input--error .fancy-input__bar:after {
  background-color: red;
}

.fancy-input__bar:before {
  left: 50%;
}
.fancy-input__bar:after {
  right: 50%; 
}

/* active state */
.fancy-input__field:focus ~ .fancy-input__bar:before, .fancy-input__field:focus ~ .fancy-input__bar:after {
  width: 50%;
}

.js-fancy--filled .fancy-input__bar:before, .js-fancy--filled  .fancy-input__bar:after {
  width: 50%;
}

/* HIGHLIGHTER ================================== */
.fancy-input__highlight {
  position: absolute;
  height: 60%; 
  width: 100px; 
  top: 25%; 
  left: 0;
  pointer-events: none;
  opacity: 0.5;
}
/* when to bring in grid ? */

/* active state */
.fancy-input__field:focus ~ .fancy-input__highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}
@keyframes inputHighlighter {
  from { background:#5264AE; }
  to  { width:0; background:transparent; }
}

.fancy-input__error-list, .main-copy .fancy-input__error-list {
  list-style: none;
  padding: 0;
  margin: 0;
  color: red;
  font-size: 0.8em;
  margin-top: 6px;
  /*margin-bottom: -20px;*/
}

.fancy-input__error-list li {
  display: inline-block;
}

.fancy-input__error-list li:before {
  display: none;
}

 
.fancy-input__error {
  display: block;
  color: red;
  font-size: 0.8em;
  margin-top: 6px;
}


.top-login {
  background-color: #006bc5;
  position: absolute;
  top: 120px;
  z-index: 10;
  margin-bottom: 40px;
  width: 100%;
}

.top-login a {
  color: #FFF;
}

.top-login__title {
  margin-top: 30px;
}

.top-login__slide {
  padding: 40px 0 0 0;
  overflow: hidden;
  color: #FFF;
  height: 400px;
  transition: height 250ms ease-in;
  position: relative;
}

.js .top-login__slide {
  /*margin-top: -400px;*/
  height: 0;
}

.top-login__slide.is-active {
  /*margin-top: 0;*/
  height: 400px;
  transition: height 250ms ease-in;
}

.top-login__slide h1, .top-login__slide p {
  color: #FFF;
}


.top-login__copy {
  grid-column: 2 / span 3;
  width: 25%;
  margin-left: 8.3333%;
}

.top-login__form {
  grid-column: 7 / span 5;
  width: 41.6667%;
  margin-left: 16.6667%;
}

 .top-login__button {
  border: none;
  font-size: 1em;
  padding: 9px 0;
  color: #FFF;
  display: block;
  width: 100%;
  text-align: center;
  background-color: #006bc5;
  position: relative;
  z-index: 10;
  margin: 0 auto;
  position: absolute;
  bottom: 0;
  outline: none;
}

 
.top-login__button b {
  font-weight: normal;
}

 
.top-login__button--close {
  z-index: 8;
  margin-top: 15px;
}
 
.top-login__button b:nth-child(2) {
  display: none;
 }
 
.top-login__button[aria-expanded="true"] b:first-child {
  display: none;
}
 
.top-login__button[aria-expanded="false"] b:last-child {
  display: none;
}
 

.double-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
 
.page-panel {
  position: relative;
  background-color: #ced1d6;
  overflow: hidden;
}
 
.page-panel--alt-1 {
  background-color: #e6e7e9;
}
 
.page-panel__bg-silo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
 
.page-panel__bg {
  width: 50vw;
}
 
.page-panel__content {
  position: relative;
  z-index: 10;
  width: 50vw;
  max-width: 600px;
  padding: 24px;
  padding-top: 60%;
  padding-bottom: 50px;
}
 
.page-panel__content--first {
  float: right;
}


.timeline {
  display: flex;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: column;
  max-width: 920px;
  position: relative;
  padding-top: 40px;
}

.timeline__content {
  width: 100%;
}

.timeline__content-title {
  font-family: "Archer A", "Archer B";
  font-style: normal;
  font-weight: 600;
  font-size: 66px;
  margin: -10px 0 0 0;
  transition: 0.4s;
  padding: 0 10px;
  box-sizing: border-box;
  position: relative;
  padding-top: 40px;
}
.timeline__content-desc {
  margin: 0;
  font-size: 15px;
  box-sizing: border-box;
  font-weight: normal;
  line-height: 25px;
}
.timeline:before {
  position: absolute;
  left: 50%;
  top: 0;
  width: 2px;
  height: 100%;
  margin-left: -1px;
  content: "";
  background: #828282;
}
@media only screen and (max-width: 767px) {
  .timeline:before {
    left: 40px;
  }
}
.timeline-item {
  padding: 8px 0;
  opacity: 0.3;
  filter: blur(2px);
  transition: 0.5s;
  box-sizing: border-box;
  width: calc(50% - 90px);
  display: flex;
  position: relative;
  transform: translateY(-80px);
  color: #333;
}

/*
.timeline-item:before {
  content: attr(data-text);
  letter-spacing: 3px;
  width: 100%;
  position: absolute;
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
  font-family: "Pathway Gothic One", sans-serif;
  border-left: 2px solid rgba(255, 255, 255, 0.5);
  top: 70%;
  margin-top: -5px;
  padding-left: 15px;
  opacity: 0;
  right: calc(-100% - 56px);
}
*/



.timeline-item:nth-child(even) {
  align-self: flex-end;
}
.timeline-item:nth-child(even):before {
  right: auto;
  text-align: right;
  left: calc(-100% - 56px);
  padding-left: 0;
  border-left: none;
  border-right: 2px solid rgba(255, 255, 255, 0.5);
  padding-right: 15px;
}

.timeline__content-title:before {
  content: " ";
  position: absolute;
  width: 120px;
  height: 50px;
  right: -100px;
  bottom: -2px;
  background-image: url(/img/timeline-dot-right.png);
  background-repeat: no-repeat;
  background-size: 120px;
}


.timeline-item:nth-child(even) .timeline__content-title:before {
  right: initial;
  left: -100px;
  background-image: url(/img/timeline-dot-left.png);
}

.timeline-item--active {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0px);
}
.timeline-item--active:before {
  top: 50%;
  transition: 0.3s all 0.2s;
  opacity: 1;
}
.timeline-item--active .timeline__content-title {
  margin: -50px 0 20px 0;
}


@media only screen and (max-width: 767px) {


  .timeline-item {
    align-self: baseline !important;
    width: 100%;
    padding: 0 30px 150px 80px;
  }

  .timeline-item:before {
    left: 10px !important;
    padding: 0 !important;
    top: 50px;
    text-align: center !important;
    width: 60px;
    border: none !important;
  }

  .timeline-item:last-child {
    padding-bottom: 40px;
  }

  .timeline__content-title:before {
    right: initial;
    left: -50px;
    background-image: url(/img/timeline-dot-left.png);
  }


.timeline-item:nth-child(even) .timeline__content-title:before {
    right: initial;
    left: -50px;
    background-image: url(/img/timeline-dot-left.png);
  }

}

.timeline__img-silo {
  width: 100%;
  text-align: right;
}

.timeline-item:nth-child(even) .timeline__img-silo {
  text-align: left;
}

.timeline__img {
  max-width: 100%;
  /*box-shadow: 0 10px 15px rgba(0, 0, 0, 0.4);*/
}

.timeline-container {
  width: 100%;
  position: relative;
  padding: 0;
  transition: 0.3s ease 0s;
  background-image: url(/img/timeline-bg.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #cdcfd1;
}

.timeline-container:before {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
}

.timeline-header {
  width: 100%;
  text-align: center;
  margin-bottom: 80px;
  position: relative;
}

.timeline-header__title {
  color: #fff;
  font-size: 46px;
  font-weight: normal;
  margin: 0;
}

.timeline-header__subtitle {
  color: rgba(255, 255, 255, 0.5);
  font-size: 16px;
  letter-spacing: 5px;
  margin: 10px 0 0 0;
  font-weight: normal;
}



.copy-block__section-title--about {
  font-weight: bold;
  text-transform: uppercase;
  color: #105ea6;
}


 
 
/* when to bring in grid - keep this section last to avoid any overides */

@media screen and (min-width: 37.5em) {
  
  /* set up simple 12 column grid 2 row grid */
  .footer-grid {
    display: grid;
    grid-template-columns: repeat(12, [col] 1fr );
    grid-template-rows: repeat(2, [row] auto);
    grid-column-gap: 30px;
    grid-row-gap: 0px;
  }

  /* set up simple 12 column grid 2 row grid */
  .grid {
    display: grid;
    grid-template-columns: repeat(12, [col] 1fr );
    grid-template-rows: repeat(2, [row] auto);
    grid-column-gap: 30px;
    grid-row-gap: 0px;
  }
  
}

.signpost {
  background-image: url(/img/signpost-bg-water.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  color: #fff;
  text-align: center;
  padding: 1.5rem 0;
  margin-top: 0.5rem;
  font-size: 1.2rem;
}

.signpost__title {
  font-weight: bold;
  text-transform: uppercase;
}


section.references {
  margin: 0;
  padding: 0;
}

.references__list {
  list-style: none;
  font-size: 0.9em;
}

.references__item {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 0.95em;
}

.references__item p {
  margin: 0;
}

.references__item span {
  font-weight: bold;
}

.material-ref {
  font-weight: bold;
}


/* switch off any widths used on grid items - they are for the fall back grid */
@supports (display:grid) {
  
  .footer-grid > * {
    width: auto !important;
    height: auto;
    margin-left: 0 !important;
  }

  .grid > * {
    width: auto !important;
    height: auto;
    margin-left: 0 !important;
  }
  
}

figure.thea-sas-logo {
	width: 175px;
	float:right;
	margin: 0px;
}

.thea-sas-logo img {
	width: 100% !important;
	padding-top: 24px;
}