@charset "UTF-8";

/*
Theme Name: Best Fit Forward
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: mediaBunker
Author URI: https://mediabunker.co.uk
Description: Bespoke theme created for Best Fit Forward
Requires at least: 5.3
Tested up to: 6.0
Requires PHP: 5.6
Version: 1.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bestfitforward
Tags: accessibility-ready, custom-colors, custom-menu, featured-images

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer https://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

article, aside, details, figcaption, figure, footer, header, main, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

caption, th, td {
  font-weight: normal;
  text-align: left;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
}

blockquote, q {
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  quotes: none;
}

a:hover, a:active {
  outline: 0;
}

a img {
  border: 0;
}

input:focus, select:focus, textarea:focus, button:focus {
  outline: none;
}

/**************************************/
/*** Best Fit Forward Styling ***/
/**************************************/

/*** Base Styles ***/
html {
	scroll-behavior: smooth;
}

body {
  font-family: "Cabin", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "wdth" 100;
  font-size: 19px; font-size: 1.9rem;

	-webkit-font-smoothing: antialiased; /* Makes certain fonts look less heavy! */
	-moz-osx-font-smoothing: grayscale;
	color: #6f6f6f;
	background-color: #ffffff;
	text-align: left;
	line-height: 140%;
  letter-spacing: 0;
	min-width: 320px;
	height: 100%;
}

h1 {
  font-family: "Zain", Arial, sans-serif;
  font-size: 35px; font-size: 3.5rem; /* Two sizes defined */
  font-weight: 800;
  font-style: normal;
  line-height: 125%;
  letter-spacing: 0;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

h2 {
  font-family: "Zain", Arial, sans-serif;
	font-size: 35px; font-size: 3.5rem;
  font-weight: 800;
	line-height: 125%;
  letter-spacing: 0;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

h3 {
  font-family: "Zain", Arial, sans-serif;
	font-size: 29px; font-size: 2.9rem;
  font-weight: 800;
	line-height: 125%;
  letter-spacing: 0;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

h4 {
  font-weight: 700; /* Bold */
  font-size: 15px; font-size: 1.5rem;
}

h5 {
  font-weight: 700; /* Bold */
  line-height: 125%;
  font-size: 13px; font-size: 1.3rem;
}

h1.noUnderline, h2.noUnderline, h3.noUnderline {
  margin-bottom: 0;
}

h1::after, h2::after, h3::after {
  content: "";
  position: absolute;
  border-top: 3px solid #CADFBD;
  bottom: 5px;
  left: 0;
  margin-left: 0;
  width: 50px;
  height: 0;
}

h1.noUnderline::after, h2.noUnderline::after, h3.noUnderline::after {
  border-top: none;
}

.centerAll h1::after, .centerAll h2::after, .centerAll h3::after {
  left: 50%;
  margin-left: -25px;
}



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

  body {
    font-size: 19px; font-size: 1.9rem;
    font-style: normal;
  }

  h1 {
    font-size: 40px; font-size: 4.0rem;
  }
  
  h2 {
    font-size: 35px; font-size: 3.5rem;
  }

  h3 {
    font-size: 29px; font-size: 2.9rem;
  }

  .centerOnWideDevicesOnly h1::after, .centerOnWideDevicesOnly h2::after, .centerOnWideDevicesOnly h3::after {
    left: 50%;
    margin-left: -25px;
  }
}

a, a:link, a:visited {
  text-decoration: underline;
  color: inherit;
  font-weight: normal;
  cursor: pointer;
}

a.noUnderline, a.noUnderline:link, a.noUnderline:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a.cta, span.cta, button.cta {
  display: inline-block;
  color: #ffffff;
  background-color: #2B7077;
  font-family: "Zain", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-size: 26px; font-size: 2.6rem;
  text-decoration: none;
  text-transform: lowercase;
  font-variant: small-caps;
  padding: 3px 15px 3px 15px; 
  margin: 20px 0px 0px 0px;
  line-height: 1;
  border-radius: 30px;

  cursor: pointer;
  white-space: nowrap;
  -webkit-transition: all 0.5s 0s ease;
  -moz-transition: all 0.5s 0s ease;
  -o-transition: all 0.5s 0s ease;
  transition: all 0.5s 0s ease;
}

a.cta.alt, span.cta.alt, button.cta.alt {
  background-color: #CBE0BE;
  color: #004241;
}

a.cta.invert, span.cta.invert, button.cta.invert {
  background-color: #ffffff;
  color: #004241;
}

a.cta:hover, a:hover span.cta, a:hover button.cta {
  background-color: #004241;
}

a.cta.alt:hover, a:hover span.cta.alt, a:hover button.cta.alt {
  background-color: #2B7077;
  color:#ffffff;
}

a.cta.invert:hover, a:hover span.cta.invert, a:hover button.cta.invert {
  color: #004241;
  background-color: #CBE0BE;
}

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

  a.cta, span.cta, button.cta {
    font-size: 29px; font-size: 2.9rem;
  }
}

i, em {
  font-style: italic;
}

strong {
  font-weight: 700;
}

img, svg {
  display: inline-block;
  color: transparent;
  max-width: 100%;
  height: auto;
}

p {
  margin-bottom: 18px;
}

p:last-child {
  margin-bottom: 0;
}

section ul {
  margin-bottom: 18px;
}

section li {
  margin-bottom: 5px;
}

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

  p {
    margin-bottom: 20px;
  }
  
  li {
    margin-bottom: 5px;
  } 
}

/*** Columns & Responsive Setup ***/
section {
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}

section#introduction {
    margin-top: 0;
}

section .columnsWrapper {
    margin:	0 auto;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    position: relative;
    justify-content: stretch;
}

section .columnsWrapper.restrictWidth {
    max-width: 1200px;
}

section .columnsWrapper.extremeRestrictWidth {
  max-width: 800px;
}

section .column {
  flex-grow: 1;
  margin: 0 auto 0;
  flex-basis: 100%;
  overflow: hidden;
  position: relative; 
}

section .column .contentWrapper {
  display: block;
  padding: 40px 20px;
  overflow: hidden;
}

section .column .contentWrapper.removeTopPadding {
  padding-top: 0;
}

section .column .contentWrapper.removeBottomPadding {
  padding-bottom: 0;
}

section .column .contentWrapper.removeTopAndBottomPadding {
  padding-top: 0;
  padding-bottom: 0;
}

section .column .contentWrapper.expandedPeripheral {
  padding: 60px 20px;
}

section.fiveColumns .column {
  flex-basis: 50%;
}

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

  section .column .contentWrapper, section.twoColumns .column:first-child .contentWrapper {
    padding: 80px 20px;
  }

  section.twoColumns .column, section.fourColumns .column {
    flex-basis: 50%;
  }

  section.threeColumns .column {
    flex-basis: 33.3333%;
  }

  section.fiveColumns .column {
    flex-basis: 33.3333%;
  }

  section .column .contentWrapper.expandedPeripheral {
    padding: 80px 20px;
  }
}

@media only screen and (min-width: 1024px) {
    
  section.fourColumns .column {
    flex-basis: 25%;
  }

  section.fiveColumns .column {
    flex-basis: 20%;
  }
}

/*** Header & Navigation ***/
@keyframes menuBackgroundFade {
    
  0% { 
    opacity: 0; 
    margin-top: -15px;
  }

  100% { 
    opacity: 1; 
    margin-top: -10px;
  }
}

header#navigation {
  display: block;
  z-index: 500;
  position: fixed;
  top: 0;
  width: 100%;
  min-width: 320px;
  padding: 10px 20px 0 20px;
  
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0px,0px,0px); /* Fix to allow instant fixed nav on ios (not just after finger release) */
  -webkit-transition: all .1s ease-in-out;
  -ms-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

header#navigation.hidden {
  margin-top: -200px;
}

header#navigation nav {
  background-color: #fff;
  background-color: rgba(255,255,255,0.8);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-radius: 104px;

  position: relative;
  margin:	0 auto;
  padding: 10px 20px 10px 10px;
  overflow: visible;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  max-width: 1250px;
}

header#navigation nav ul {
  display: flex;
  align-items: center; 
  justify-content: space-between;
}

header#navigation nav ul li {
  margin: 0;
}

header#navigation nav ul li.logo a {
  display: block;
  min-width: 100px;
  max-width: 120px;
}

header#navigation nav ul li.logo a img {
  display: block;
}

header#navigation nav ul li h2 {
  color: #004141;
  padding-bottom: 0;
  font-size: 17px; font-size: 1.7rem;
}

header#navigation nav ul li h2 span {
  color: #2A7077;
}


header#navigation nav ul li.menu.full {
  width: 65%;
  display: none;
}

header#navigation nav ul li.menu.full ul {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

header#navigation nav ul li.menu.full ul li a {
  position:relative;
  color: #2A337B;
  font-family: "Zain", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
  font-size: 20px; font-size: 2.0rem;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  -webkit-transition: all 0.5s 0s ease;
  -moz-transition: all 0.5s 0s ease;
  -o-transition: all 0.5s 0s ease;
  transition: all 0.5s 0s ease;
}

header#navigation nav ul li.menu.full ul li a:hover {
  color: #CADFBD;
}

header#navigation nav ul li.menu.compact #hamburgerIcon {
  width: 34px;
  height: 20px;
  position: relative;
  cursor: pointer;
} 

header#navigation nav ul li.menu.compact #hamburgerIcon span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #2A7077;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

header#navigation nav ul li.menu.compact a:hover #hamburgerIcon span {
  /* background-color: #B02F21; */
  -webkit-transition: all 0.5s 0s ease;
  -moz-transition: all 0.5s 0s ease;
  -o-transition: all 0.5s 0s ease;
  transition: all 0.5s 0s ease;
}

header#navigation nav ul li.menu.compact #hamburgerIcon span:nth-child(1) {
  top: 0px;
}

header#navigation nav ul li.menu.compact #hamburgerIcon span:nth-child(2) {
  top: 50%;
}

header#navigation nav ul li.menu.compact #hamburgerIcon span:nth-child(3) {
  top: 100%;
}

header#navigation nav ul li.menu.compact .active #hamburgerIcon span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -4px;
  left: 6px;
}

header#navigation nav ul li.menu.compact .active #hamburgerIcon span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

header#navigation nav ul li.menu.compact .active #hamburgerIcon span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 20px;
  left: 6px;
}

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

  header#navigation {
    padding: 20px 20px 0 20px;
  }

  header#navigation nav {
    border-radius: 104px;
    padding: 12px 50px 12px 14px;
  }

  header#navigation nav ul li.logo a {
    min-width: 140px;
    max-width: 160px;
  }

  header#navigation nav ul li h2 {
    font-size: 27px; font-size: 2.7rem;
  }
  
  header#navigation nav ul li.menu.compact #hamburgerIcon {
    width: 44px;
    height: 32px;
  } 

  header#navigation nav ul li.menu.compact #hamburgerIcon span {
    height: 4px;
  }

  header#navigation nav ul li.menu.compact .active #hamburgerIcon span:nth-child(1) {
    top: -4px;
    left: 6px;
  }

  header#navigation nav ul li.menu.compact .active #hamburgerIcon span:nth-child(3) {
    top: 26px;
    left: 6px;
  }
}

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

  header#navigation nav ul li.menu.full {
    display: initial;
  }
  
  header#navigation nav ul li.menu.compact {
    display: none;
  };
}

/*** WordPress Default Wysiwyg Editor Styling ***/

/* Spacing */
:root { 
  --global--spacing-unit: 20px;
  --global--spacing-measure: unset;
  --global--spacing-horizontal: 25px;
  --global--spacing-vertical: 30px;

  --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6);
  --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal));
  --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal));
  --responsive--alignfull-width: 100%;
  --responsive--alignright-margin: var(--global--spacing-horizontal);
  --responsive--alignleft-margin: var(--global--spacing-horizontal);
}

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

  :root {
    --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), 610px);
    --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal));
    --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
    --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width)));
  }
}
@media only screen and (min-width: 822px) {

  :root {
    --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 610px);
    --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1240px);
  }
}

.alignleft {
  /*rtl:ignore*/
  text-align: left;
  margin-top: 0;
}

.entry-content > .alignleft {
  max-width: var(--responsive--aligndefault-width);
}

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

  .alignleft {
    /*rtl:ignore*/
    float: left;
    /*rtl:ignore*/
    margin-right: var(--global--spacing-horizontal);
    margin-bottom: var(--global--spacing-vertical);
  }

  .entry-content > .alignleft {
    max-width: calc(50% - var(--responsive--alignleft-margin));
  }
}

.aligncenter {
  clear: both;
  display: block;
  float: none;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.alignright {
  margin-top: 0;
  margin-bottom: var(--global--spacing-vertical);
}

.entry-content > .alignright {
    max-width: var(--responsive--aligndefault-width);
}

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

  .alignright {
    /*rtl:ignore*/
    float: right;
    /*rtl:ignore*/
    margin-left: var(--global--spacing-horizontal);
  }

  .entry-content > .alignright {
      max-width: calc(50% - var(--responsive--alignright-margin));
  }
}

[class*=inner-container] > .alignleft + *,
[class*=inner-container] > .alignright + * {
  margin-top: 0;
}

.alignwide, .alignfull {
clear: both;
}

.has-left-content {
  justify-content: flex-start;
}

.has-right-content {
  justify-content: flex-end;
}

.has-parallax {
  background-attachment: fixed;
}

.has-drop-cap:not(:focus)::first-letter {
  font-family: var(--heading--font-family);
  font-weight: var(--heading--font-weight);
  line-height: 0.66;
  text-transform: uppercase;
  font-style: normal;
  float: left;
  margin: 0.1em 0.1em 0 0;
  font-size: calc(1.2 * var(--heading--font-size-h1));
}

.has-drop-cap:not(:focus)::after {
  content: "";
  display: table;
  clear: both;
  padding-top: 14px;
}

.desktop-only {
  display: none;
}

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

  .desktop-only {
    display: block;
  }
}

/*** Section: Generic ***/
main section {
  background-color: #E7EFF0;
}

main section.alt {
  background-color: #ffffff;
}

section img.background {
  width: auto;
  height: auto;
  max-width: 100% !important;
  min-height: 100%;
  /* min-width: 100vw; */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

@supports ( object-fit: cover ) {
  section img.background {
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      object-fit: cover;
      transform: none;
      overflow: hidden;
  }
}

section .backgroundOverlay {
  width:100%; 
  height:100%;
  position: relative;
  z-index: 2;
  display: block;
}

main section h1, main section h2, main section h3 {
  color: #2A7077;
}

main section li {
  margin-left: 1.2em;
  margin-bottom: 10px;
  list-style: disc;
}

section.singleColumn .preColumnsWrapper + .columnsWrapper > .column .contentWrapper,
section.twoColumns .preColumnsWrapper + .columnsWrapper,
section.threeColumns .preColumnsWrapper + .columnsWrapper,
section .preColumnsWrapper + .multiBlockSlider.columnsWrapper {
  padding-top: 0;
}

section h2.preColumnsWrapper, section h3.preColumnsWrapper {
  text-align: center;
  padding: 40px 20px 10px 20px;
}

section h2.preColumnsWrapper::after, section h3.preColumnsWrapper::after {
  left: 50%;
  margin-left: -25px;
}

section h2.preColumnsWrapper.removeTopPadding,
section h3.preColumnsWrapper.removeTopPadding,
section.twoColumns .columnsWrapper.removeTopPadding,
section.threeColumns .columnsWrapper.removeTopPadding,
section .multiBlockSlider.columnsWrapper.removeTopPadding {
  padding-top: 0;
}

section h2.preColumnsWrapper.removeBottomPadding,
section h3.preColumnsWrapper.removeBottomPadding,
section.twoColumns .columnsWrapper.removeBottomPadding,
section.threeColumns .columnsWrapper.removeBottomPadding,
section .multiBlockSlider.columnsWrapper.removeBottomPadding {
  padding-bottom: 0;
}

section h2.preColumnsWrapper.removeTopAndBottomPadding,
section h3.preColumnsWrapper.removeTopAndBottomPadding,
section.twoColumns .columnsWrapper.removeTopAndBottomPadding,
section.threeColumns .columnsWrapper.removeTopAndBottomPadding,
section .multiBlockSlider.columnsWrapper.removeTopAndBottomPadding {
  padding-top: 0;
  padding-bottom: 0;
}

section .callToActionWrapper {
  margin: 0 auto;
  text-align: center;
  padding: 0 20px 20px 20px;
}

section .callToActionWrapper .cta {
  margin-top: 20px;
}

section.centerAll .contentWrapper *,
section .column.centerAll .contentWrapper {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

section.centerAll .contentWrapper ul,
section .column.centerAll .contentWrapper ul {
  list-style-position: inside;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

section.centerAll .contentWrapper ul li,
section .column.centerAll .contentWrapper ul li {
  text-align: left;
}

section.centerAll .contentWrapper ul.hideBullets li,
section .column.centerAll .contentWrapper ul.hideBullets li {
  text-align: center;
}

section .columnsWrapper .contentWrapper .innerContentWrapper.widerMargins {
  margin-bottom: 20px;
}

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

  section h2.preColumnsWrapper, section h3.preColumnsWrapper {
    padding: 90px 20px 10px 20px;
  }

  section .callToActionWrapper {
    padding: 0 20px 30px 20px;
  }

  section .callToActionWrapper .cta {
    margin-top: 30px;
  }

  section.centerOnWideDevicesOnly .contentWrapper *,
  section .column.centerOnWideDevicesOnly .contentWrapper * {
      text-align: center !important;
      margin-left: auto !important;
      margin-right: auto !important;
  }
  
  section.centerOnWideDevicesOnly .contentWrapper ul,
  section .column.centerOnWideDevicesOnly .contentWrapper ul {
      list-style-position: inside;
      margin-left: auto;
      margin-right: auto;
      width: 80%;
  }

  section.centerOnWideDevicesOnly .contentWrapper ul li,
  section .column.centerOnWideDevicesOnly .contentWrapper ul li {
      text-align: left;
  }
  
  section.centerOnWideDevicesOnly .contentWrapper ul.hideBullets li,
  section .column.centerOnWideDevicesOnly .contentWrapper ul.hideBullets li {
      text-align: center;
  }

  section .columnsWrapper .contentWrapper .innerContentWrapper.widerMargins {
    margin: 30px 120px;
  }
}

/*** Section: Introduction ***/
section#introduction {
  background-color: #ffffff;
}

section#introduction.introSlider .slick-track {
  display: flex !important;
}

section#introduction.introSlider .slick-track .slick-slide {
  display: flex;
  height: auto;
  align-items: center;
  justify-content: center;
}

section#introduction.introSlider .slick-track .slick-slide .columnsWrapper {
  height: 100%;
}

section#introduction.introSlider .slick-track .slick-slide .column {
  display: flex;
  align-items: center;
  justify-content: left;
  width: 100%;
}

section#introduction .columnsWrapper {
  padding-top: calc(320px - 7vw);
}

section#introduction.home .columnsWrapper {
  padding-top: calc(40px + 10vw);
}

section#introduction .titlesWrapper {
  float: left;
  padding: 25px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(0,0,0, 0.2);
  -webkit-border-radius: 35px;
  -moz-border-radius: 35px;
  border-radius: 35px;
  cursor: pointer;
  color: #ffffff;
}

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

  section#introduction .columnsWrapper {
    padding-top: calc(50px + 10vw);
    padding-bottom: 8vw;
  }

  section#introduction.home .columnsWrapper {
      padding-top: calc(70px + 4vw);
      padding-bottom: calc(5px + 1vw);
  }

  section#introduction .contentWrapper {
      max-width: 50%;
  }

  section#introduction .titlesWrapper {
    padding: 45px;
  }
}

section#introduction .titlesWrapper h1 {
  color: #fff;
}

section#introduction .titlesWrapper h1::after {
  border-color: #CADFBD;
}

/*** Section: Introduction (Video Configuration) ***/
section video.background {
  width: auto;
  height: auto;
  max-width: 100% !important;
  min-height: 100%;
  /* min-width: 100vw; */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

@supports ( object-fit: cover ) {
  section video.background {
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      object-fit: cover;
      transform: none;
      overflow: hidden;
  }
}

/*** Section: 2 Column Content ***/
section.twoColumns .columnsWrapper {
  padding-top: 40px;
  padding-bottom: 40px;
}

section.twoColumns .columnsWrapper .column {
  width: 100%;
  min-height: 300px;
}

section.twoColumns .columnsWrapper.reverseColumns {
  flex-direction: column-reverse;
}

section.twoColumns .column.verticallyAlign,
section.twoColumns .column.verticallyAlign .backgroundOverlay {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
}

@media only screen and (min-width: 690px) {
  section.twoColumns .columnsWrapper {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  section.twoColumns .columnsWrapper.reverseColumns {
    flex-direction: initial;
  }

  section.twoColumns .columnsWrapper .column {
    width: 100%;
    min-height: unset;
  }
}

/*** Section: 3 Column Content ***/
section.threeColumns .columnsWrapper {
  padding-top: 40px;
  padding-bottom: 40px;
}

section.threeColumns.centerAll .contentWrapper * {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

section.threeColumns.centerAll .contentWrapper .cta {
  text-align: left !important;
}

section.threeColumns.centerAll .contentWrapper ul  {
  list-style-position: inside;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

section.threeColumns.centerAll .contentWrapper ul li {
  text-align: left;
}

section.threeColumns.centerAll .contentWrapper ul.hideBullets li {
  text-align: center;
}

section.threeColumns.reducedSpacing {
  margin-top: -20px;
}

section.threeColumns .columnsWrapper.reverseColumns {
  flex-direction: column-reverse;
}

@media only screen and (max-width: 689px) {
  
  section.threeColumns.reducedSpacing {
    margin-top: 0;
  }

  section.threeColumns.reducedSpacing .columnsWrapper .column .contentWrapper {
    padding-top: 0;
  }

  section.threeColumns .columnsWrapper .column .contentWrapper.reducedSpacing {
    padding-top: 30px;
  }

  section.threeColumns .columnsWrapper .column:first-child .contentWrapper.reducedSpacing {
    padding-top: 0;
  }

  section.threeColumns.center .contentWrapper .cta {
    margin-left: auto;
    margin-right: auto;
  }

  section.threeColumns.center .contentWrapper form {
      width: 100% !important;
      display: inline-block;
  }

  section.threeColumns .columnsWrapper.reverseColumns .column:last-child .contentWrapper {
      padding-bottom: 0;
  }
  
  section.threeColumns .columnsWrapper.reverseColumns .column:first-child .contentWrapper {
      padding-bottom: 30px;
  }

  section.threeColumns.reducedSpacing .columnsWrapper.reverseColumns .column:first-child .contentWrapper {
    padding-top: 30px;
  }

  section.threeColumns.reducedSpacing .columnsWrapper.reverseColumns .column:last-child .contentWrapper {
    padding-top: 0;
  }
}

section.threeColumns .column.verticallyAlign {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
}

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

  section.threeColumns .columnsWrapper {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  section.threeColumns .columnsWrapper.reverseColumns {
      flex-direction: initial;
  }
  
  section.threeColumns.centerOnWideDevicesOnly .contentWrapper * {
      text-align: center !important;
      margin-left: auto !important;
      margin-right: auto !important;
  }
  
  section.threeColumns.centerOnWideDevicesOnly .contentWrapper ul  {
      list-style-position: inside;
      margin-left: auto;
      margin-right: auto;
      width: 80%;
  }

  section.threeColumns.centerOnWideDevicesOnly .contentWrapper ul li {
      text-align: left;
  }
  
  section.threeColumns.centerOnWideDevicesOnly .contentWrapper ul.hideBullets li {
      text-align: center;
  }
}

/*** Section: 3 Columns Blog Summary ***/
section.blogSummary .column {
  padding: 0 20px 20px 20px;
  flex-grow: 0;
  margin: 0;
}

section.blogSummary a.singlePost {
  display: inline-block;
  background-color: #ffffff;
  text-decoration: none;
  height: 100%;
  text-align: left;
}

section.blogSummary .column .imageWrapper {
  height: 250px;
  position: relative;
  z-index: 2;
  overflow: hidden;
}

section.blogSummary .column .imageWrapper .imageOverlay {
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  width: 100%;
  height: 100%;
  z-index: 3;
  position: relative;
  background-color: rgba(0,0,0, 0.0);
}

section.blogSummary .column:hover .imageWrapper .imageOverlay {
  background-color: rgba(0,0,0, 0.3);
}

section.blogSummary .column .imageWrapper img {
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

section.blogSummary .column:hover .imageWrapper img {
  transform: scale(1.03); 
  overflow: hidden;
}

section.blogSummary .column .contentWrapper {
  padding: 20px; 
}

section.blogSummary .column .contentWrapper h2::after {
  left: 0;
  margin-left: 0;
}

section.blogSummary .column .contentWrapper h4 {
  margin-top: -10px;
}

section.blogSummary .column .contentWrapper * {
  text-align: left !important;
}

section.blogSummary .innerWrapper {
  margin-top: 15px;
}

section.blogSummary .column.noPosts {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

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

  section.blogSummary .column {
    padding: 0 20px 40px 20px;
  }

  section.blogSummary.nonPostPage .column {
    padding-bottom: 0;
  }

  section.blogSummary .column .contentWrapper {
    padding: 30px;
  }

  section.blogSummary .innerWrapper {
    margin-top: 10px;
  }

  section.blogSummary .callToActionWrapper .cta {
    margin-top: 0px;
  }
}

/*** Section: Multi Block Slider (Base for variants) ***/
section.blockSlider .columnsWrapper {
  display: block;  /* Fix if slides to show equals total slides */
  padding-top: 40px;
  padding-bottom: 40px;
}

section.blockSlider .slick-track {
   display: flex;
}

section.blockSlider .slick-prev,
section.blockSlider .slick-next {
    top: 50%;
    margin-top: -22px;
}

section.blockSlider .slick-dots {
  position: relative;
  
}

section.blockSlider .slick-dots li button:before {
  color: #2A7077;
}

section.blockSlider .slick-dots li.slick-active button:before {
  color: #2A7077;
}

section.blockSlider .slick-list {
  padding: 0;
}

section.blockSlider .column {
  display: flex;
  height: auto;
  align-items: center;
  justify-content: center;
  min-height: 250px;
  margin-left: 20px;
  margin-right: 20px;
}

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

  section.blockSlider .slick-prev {
    left: 25px;
  }
  section.blockSlider .slick-next {
    right: 25px;
  }
  
  section.blockSlider .column {
    min-height: 300px;
  }
}

/*** Section: Multi Block Slider - Image & Text ***/
section.blockSlider.imageText a.backgroundOverlay {
  display: block;
  font-weight: 400;
  text-decoration: none;
}

section.blockSlider.imageText .column .imageWrapper {
  min-height: 150px;
  position: relative;
  z-index: 2;
  overflow: hidden;
  padding: 40px;
}

section.blockSlider.imageText .column .imageWrapper.contain img.background {
  object-fit: contain;
  
}

section.blockSlider.imageText .column.hasLink .imageWrapper .imageOverlay {
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  width: 100%;
  height: 100%;
  z-index: 3;
  position: relative;
  background-color: rgba(0,0,0, 0.0);
}

section.blockSlider.imageText .column.hasLink:hover .imageWrapper .imageOverlay {
  background-color: rgba(0,0,0, 0.3);
}

section.blockSlider.imageText .column.hasLink .imageWrapper img {
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

section.blockSlider.imageText .column.hasLink:hover .imageWrapper img {
  transform: scale(1.03); 
  overflow: hidden;
}

section.blockSlider.imageText .column .contentWrapper {
  padding-top: 10px;
}

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

  section.blockSlider.imageText .column .imageWrapper {
  
  }
}

/*** Section: Total Sponsored Memberships (Special) ***/
section.totalSponsoredMemberships span.total {
  color: #26A3DD;
  font-family: "Zain", Arial, sans-serif;
  font-size: 65px; font-size: 6.5rem; /* Two sizes defined */
  font-weight: 800;
  font-style: normal;
  line-height: 125%;
  letter-spacing: 0;
}

section.totalSponsoredMemberships p {
  color: #2A337B;
  font-family: "Zain", Arial, sans-serif;
  font-weight: 800;
  font-style: normal;
  line-height: 125%;
  letter-spacing: 0;
}

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

  section.totalSponsoredMemberships span.total {
    margin-top: -25px;
    display: inline-block;
  }

  section.totalSponsoredMemberships .innerContentWrapper {
    display: flex;
    align-items: center;
  }

  section.totalSponsoredMemberships .innerContentWrapper div {
    flex: 1;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  section.totalSponsoredMemberships .innerContentWrapper div:first-child {
    text-align: right;
    padding-right: 40px;
  }

  section.totalSponsoredMemberships .innerContentWrapper div:first-child h2::after {
    left: auto;
    right: 0;
    margin-right: 0;
  }

  section.totalSponsoredMemberships .innerContentWrapper div:last-child {
    text-align: left;
    padding-left: 36px;
    border-left: 4px solid #E6E7ED;
  }
}

/*** Pagination - Blog Index & Single Post Page ***/
section .pagination {
  width: 100%;
  text-align: center;
  margin: 50px 20px 20px 20px;
}

section.singlePost .pagination {
  margin: 50px 0 0 0;
}

section .pagination .cta,
section .pagination .cta:hover {
  display: inline-block;
  margin-top: 10px;
  margin-bottom: 10px;
}

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

  section .pagination {
    margin: 50px 20px 20px 20px;
  }

  section .pagination .cta.previous {
    float: right;
  }
   
  section .pagination .cta.next {
    float: left;
  }

  section.singlePost .pagination .cta.previous {
    float: left;
  }
   
  section.singlePost .pagination .cta.next {
    float: right;
  }
}

/*** Generic Forms ***/
form {
  /* padding-left: 10px;
  padding-right: 10px; */
}

section.centerAll .contentWrapper form * {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

section.centerAll .contentWrapper form h1::after, section.centerAll .contentWrapper form h2::after, section.centerAll .contentWrapper form h3::after {
  border-color: #CADFBD;
  left: 0;
  margin-left: 0;
  width: 50px;
}

form input, form select, form textarea {
  font-family: "Cabin", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "wdth" 100;
  font-size: 19px; font-size: 1.9rem;
  color: #6F6F6F !important;
  outline: none;
  width: 100%;
  border: 2px solid #fff;
  -webkit-border-radius:0 !important; 
  border-radius:0 !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;   
  text-align: left !important;
}

section .column .contentWrapper form input,
section .column .contentWrapper form textarea { /* Override for forced centralised content */
  text-align: left !important;
}

form input, form select {
  line-height: 20px !important;
  padding: 0 9px 0 9px;
  height: 3.9em !important;
  position: relative;
  display: block;
}

form :focus {
  border: 1px solid #26A3DD !important;
}

form .choices.is-focused .choices__inner {
  border: 1px solid #26A3DD !important;
  border-radius: 0 !important;
}

form input.choices__input:focus {
  border: none !important;
}

form select {
  text-align: left !important;
}

form textarea {
  padding: 9px;
  resize: vertical;
}

form input::-moz-focus-inner { /* Remove weird border around button in Firefox */
  padding: 0;
  border: 0
}

::-webkit-input-placeholder {
  color: #9B9EA0 !important;
}

:-moz-placeholder {
  color: #9B9EA0 !important;
}

::-moz-placeholder {
  color: #9B9EA0 !important;
}

:-ms-input-placeholder {
  color: #9B9EA0 !important;
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
  color: transparent !important;
}

input:focus:-moz-placeholder, textarea:focus:-moz-placeholder {
  color: transparent !important;
}

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
  color: transparent !important;
}

input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {
  color: transparent !important;
}

input:-webkit-autofill, input:-webkit-autofill:focus { /*  Prevent autofill fields going yellow */
  -webkit-box-shadow: 0 0 0 1000px white inset;
  -webkit-text-fill-color: #333;
}

/*** Fluent Forms ***/
.fluentform .ff-el-group.sectionTitle {
  margin-top: 50px;
  margin-bottom: 0;
}

.fluentform.ff-default .ff-el-form-control {
  font-family: "Cabin", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "wdth" 100;
  font-size: 19px; font-size: 1.9rem;
  border-color: #fff;
  padding: 15px 15px;
}

.ff-el-group.custom-form-label-style.custom-multiple-choice {
  text-align: left !important;
}

.ff-el-input--content.__flow-synced-hover__,
.choices.__flow-synced-hover__,
.choices__inner.__flow-synced-hover__,
.choices__list.choices__list--multiple.__flow-synced-hover__,
.choices__item {
  text-align: left !important;
}

.fluentform .ff-el-is-error .ff-el-form-control {
  border-color: #CE2E1D !important;
}

.fluentform .ff-el-is-error .text-danger {
  font-size: 16px; font-size: 1.6rem !important;
  color: #CE2E1D !important;
  text-align: left !important;
}

.frm-fluent-form .choices {
  margin-bottom: 0 !important;
}

.frm-fluent-form .choices[data-type*=select-multiple] .choices__input {
  font-size: 16px !important; font-size: 1.6rem !important;
}

.frm-fluent-form .choices__list--multiple .choices__item {
  background-color: #CE2E1D !important;
  border: 1px solid #CE2E1D !important;
  font-size: 16px !important; font-size: 1.6rem !important;
  font-weight: 400 !important;
}

.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after {
  margin-left: -2px !important;
}

.frm-fluent-form .choices__list--multiple .choices__item {
 margin-right: 5px !important;
}

.frm-fluent-form .choices__list--dropdown .choices__item {
  font-size: 16px !important; font-size: 1.6rem !important;
}

.frm-fluent-form .choices__list--dropdown {
  border: 1px solid #CE2E1D !important;
}
 
.fluentform .ff-el-group.custom-form-checkbox-style {
  display: flex;
  align-items: center;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.fluentform .custom-form-checkbox-style .ff-el-input--label {
  padding: 0 10px 0 0 !important;
  text-align: left !important;
  flex-basis: 270px !important;
}

.fluentform .custom-form-checkbox-style .ff-el-input--label label {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}

.fluentform .custom-form-checkbox-style .ff-el-input--content {
	margin-left: 0 !important;
	flex: 1 !important;
}
.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label::after {
	display: none;
}
.fluentform .ff-el-group.custom-margin-one {
  margin-bottom: 30px;
}

.fluentform .ff-el-form-check.ff-el-form-check- {
  text-align: left !important;
  padding-left: 0 !important;
}

.fluentform .ff-el-form-check label {
  position: relative;
  margin-right: 8px !important;
  height: 21px !important;
  display: inline-block;
}
.fluentform .ff-el-form-check label span {
  display: none;
}
.fluentform .ff-el-form-check label.ff-el-form-check-label::before {
  left: 1px;
  top: 2px;
  width: 19px;
  height: 19px;
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  transition: all .2s;
  opacity: 0;
  background: url(/images/form-tick.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 3px !important;
}
.fluentform .ff-el-form-check.ff_item_selected label.ff-el-form-check-label::before {
  opacity: 1;
  z-index: 1;
}
.fluentform .ff-el-form-check label.ff-el-form-check-label::after {
  background: #fff;
  height: 21px;
  width: 21px;
  margin-left: 0;
  margin-top: 3px !important;
  content: "";
  position: absolute;
  top: 0 !important;
  transition: all .2s;
}
.fluentform input[type="checkbox"] {
	display: none !important;
}

.fluentform .ff-message-success {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border: none;
  margin-top: 35px;
  margin-bottom: 35px;
}

.fluentform button.ff-btn-submit {
  color: #ffffff;
  background-color: #2A7077 !important;
  font-family: "Zain", Arial, sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-size: 29px; font-size: 2.9rem;
  text-decoration: none;
  text-transform: lowercase;
  font-variant: small-caps;
  padding: 3px 15px 3px 15px; 
  /* margin: 20px 0px 0px 0px; */
  line-height: 1;
  border-radius: 30px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-transition: all 0.5s 0s ease;
  -moz-transition: all 0.5s 0s ease;
  -o-transition: all 0.5s 0s ease;
  transition: all 0.5s 0s ease;
}

.fluentform button.ff-btn-submit:hover {
  opacity: 1;
  background-color: #004241 !important;
}

/*** Footer ***/
footer {
  /* background-color: #050D4D; */
  background-image: url('./assets/images/footer-background.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position:right;
  color: #ffffff;
}

footer a.logo {
  display: block;
  max-width: 280px;
  margin-bottom: 30px;
}

footer a.cookieReset {
  display: block;
  margin-top: 20px;
  font-size: 15px; font-size: 1.5rem;
}

footer section.copyright {
  border-top: 1px solid #fff;
  border-top: 1px solid rgba(255,255,255,0.3);
  padding: 35px 3%;
  text-align: center;
}

/* Justified Gallery Plugin Overrides */
.dgwt-jg-caption__font--14 {
  letter-spacing: -0.2px !important;
}

.dgwt-jg-effect-standard .dgwt-jg-caption {
  background-color: rgba(56,62,66,0.7) !important;
}

.justified-gallery {
  margin: 0;
}