:root {
    --color-green: #44a17e;
    --color-orange: #e27350;
    --color-teal: #309A9f;
    --color-gold: #595245;
    --color-white: #ffffff;
    --color-grey: #f7f7f7;
    --color-black: #171717;
    --font-weight-heavy: 700;
    --font-weight-medium: 500;
    --font-weight-light: 300;
    --font-family-headings: 'Arcon Rounded', sans-serif;
    --font-family-body: 'Arcon Rounded', sans-serif;
    --font-family-buttons: 'Arcon Rounded', sans-serif;
}

/* Fonts */

@font-face {
  font-family: 'Arcon Rounded';
  src: url('../../assets/site_resources/arcon-rounded-regular.eot'); /* IE9 Compat Modes */
  src: url('../../assets/site_resources/arcon-rounded-regular.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../assets/site_resources/arcon-rounded-regular.woff') format('woff'), /* Pretty Modern Browsers */
       url('../../assets/site_resources/arcon-rounded-regular.svg') format('svg'); /* Legacy iOS */
}

::selection {
    color: var(--color-white);
    background-color: var(--color-orange);
}

body {
    color: var(--color-gold);
    background: var(--color-white);
    font-family: var(--font-family-body);
    margin: 0;
    font-size: 1.25rem;
    text-align: left;
    overflow-x: hidden
}

.cke_editable {
  color: #000;
}

/* Content */

.content-inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 2rem;
}

@media (min-width: 1300px) {
  .content-inner {
    width: 1200px;
    padding-left: 0;
    padding-right: 0;
  }
}

/* Background colours */

.bg-black, .bg-black::before, .bg-black::after {
  background-color: var(--color-black);
  color: var(--color-white);
}

.bg-black a {
  color: var(--color-white);
}

.bg-black a:focus, .bg-black a:hover {
  color: var(--color-orange);
}

.bg-gold, .bg-gold::before, .bg-gold::after {
  background-color: var(--color-gold);
  color: var(--color-white);
}

.bg-gold a {
  color: var(--color-white);
}

.bg-gold a:focus, .bg-gold a:hover {
  color: var(--color-orange);
}

.bg-orange, .bg-orange::before, .bg-orange::after {
  background-color: var(--color-orange);
  color: var(--color-black);
}

.bg-orange a {
  color: var(--color-black);
}

.bg-orange a:focus, .bg-orange a:hover {
  color: var(--color-white);
}

.bg-teal, .bg-teal::before, .bg-teal::after {
  background-color: var(--color-teal);
  color: var(--color-black);
}

.bg-teal a {
  color: var(--color-black);
}

.bg-teal a:focus, .bg-teal a:hover {
  color: var(--color-white);
}

.bg-white, .bg-white::before, .bg-white::after {
  background-color: var(--color-white);
  color: var(--color-gold);
}

.bg-white a {
  color: var(--color-gold);
}

.bg-white a:focus, .bg-white a:hover {
  color: var(--color-green);
}

.bg-green, .bg-green::before, .bg-green::after {
  background-color: var(--color-green);
  color: var(--color-black);
}

.bg-green a {
  color: var(--color-black);
}

.bg-green a:focus, .bg-green a:hover {
  color: var(--color-white);
}

.button.bg-green {
  color: var(--color-white);
}

.button.bg-green:focus, .button.bg-green:hover {
  color: var(--color-black);
}

.bg-grey, .bg-grey::before, .bg-grey::after {
  background-color: var(--color-grey);
  color: var(--color-gold);
}

.bg-grey a {
  color: var(--color-gold);
}

.bg-grey a:focus, .bg-grey a:hover {
  color: var(--color-green);
}

/* Background images - shapes */

*[class*=" shapes-"], *[class^="shapes-"] {
  background-repeat: repeat;
  background-size: 540px 540px;
}

.shapes-black {
  background-image: url('bg-shapes-black.svg');
}

.shapes-gold {
  background-image: url('bg-shapes-gold.svg');
}

.shapes-green {
  background-image: url('bg-shapes-green.svg');
}

.shapes-grey {
  background-image: url('bg-shapes-grey.svg');
}

.shapes-orange {
  background-image: url('bg-shapes-orange.svg');
}

.shapes-teal {
  background-image: url('bg-shapes-teal.svg');
}

.shapes-white {
  background-image: url('bg-shapes-white.svg');
}

/* Background classes - pile */

div[class*=" pile-"], div[class^="pile-"],
section[class*=" pile-"], section[class^="pile-"] {
  position: relative;
}

div[class*=" pile-"] > div[class*=" pile-"],
div[class*=" pile-"] > div[class^="pile-"],
div[class^="pile-"] > div[class^="pile-"],
div[class^="pile-"] > div[class*=" pile-"],
section[class*=" pile-"] > div[class*=" pile-"],
section[class*=" pile-"] > div[class^="pile-"],
section[class^="pile-"] > div[class^="pile-"],
section[class^="pile-"] > div[class*=" pile-"] {
  position: absolute;
  width: 200px;
  height: 200px;
  left: 1rem;
  bottom: 1rem;
  background-repeat: no-repeat;
  background-size: 200px;
  background-color: transparent;
  margin: 0;
}

.pile-bottom-left.pile-top-left, 
.pile-bottom-left.pile-top-right,
.pile-bottom-right.pile-top-left, 
.pile-bottom-right.pile-top-right {
  min-height: 500px;
}

.pile-top-left-inner {
  top: 1rem !important;
  left: 1rem !important;
  bottom: unset !important;
  transform: rotate(90deg) !important;
}

.pile-top-right-inner {
  top: 1rem !important;
  left: unset !important;
  right: 1rem !important;
  bottom: unset !important;
  transform: rotate(180deg) !important;
}

.pile-bottom-left-inner {
  bottom: 1rem !important;
  left: 1rem !important;
}

.pile-bottom-right-inner {
  right: 1rem !important;
  bottom: 1rem !important;
  left: unset !important;
  transform: rotate(270deg) !important;
}

.pile-black > div[class*=" pile-"], .pile-black > div[class^="pile-"] {
  background-image: url('pile-black.svg');
}

.pile-gold > div[class*=" pile-"], .pile-gold > div[class^="pile-"]  {
  background-image: url('pile-gold.svg');
}

.pile-green > div[class*=" pile-"], .pile-green > div[class^="pile-"]  {
  background-image: url('pile-green.svg');
}

.pile-grey > div[class*=" pile-"], .pile-grey > div[class^="pile-"]  {
  background-image: url('pile-grey.svg');
}

.pile-orange > div[class*=" pile-"], .pile-orange > div[class^="pile-"]  {
  background-image: url('pile-orange.svg');
}

.pile-teal > div[class*=" pile-"], .pile-teal > div[class^="pile-"]  {
  background-image: url('pile-teal.svg');
}

.pile-white > div[class*=" pile-"], .pile-white > div[class^="pile-"]  {
  background-image: url('pile-white.svg');
}

/* Gradient backgrounds */

.bg-black-gold {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-gold) 50%);
}

.bg-black-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-black-gold::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-green {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-green) 50%);
}

.bg-black-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-black-green::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-grey {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-grey) 50%);
}

.bg-black-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-black-grey::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-orange {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-orange) 50%);
}

.bg-black-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-black-orange::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-teal {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-teal) 50%);
}

.bg-black-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-black-teal::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-transparent {
  background-image: linear-gradient(black 50%, transparent 50%);
}

.bg-black-transparent::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-black-white {
  background-image: linear-gradient(var(--color-black) 50%, var(--color-white) 50%);
}

.bg-black-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-black-white::before {
  background-color: var(--color-black);
  bottom: 50%;
}

.bg-gold-black {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-black) 50%);
}

.bg-gold-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-gold-black::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-green {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-green) 50%);
}

.bg-gold-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-gold-green::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-grey {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-grey) 50%);
}

.bg-gold-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-gold-grey::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-orange {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-orange) 50%);
}

.bg-gold-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-gold-orange::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-teal {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-teal) 50%);
}

.bg-gold-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-gold-teal::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-transparent {
  background-image: linear-gradient(gold 50%, transparent 50%);
}

.bg-gold-transparent::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-gold-white {
  background-image: linear-gradient(var(--color-gold) 50%, var(--color-white) 50%);
}

.bg-gold-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-gold-white::before {
  background-color: var(--color-gold);
  bottom: 50%;
}

.bg-green-black {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-black) 50%);
}

.bg-green-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-green-black::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-gold {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-gold) 50%);
}

.bg-green-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-green-gold::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-grey {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-grey) 50%);
}

.bg-green-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-green-grey::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-orange {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-orange) 50%);
}

.bg-green-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-green-orange::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-teal {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-teal) 50%);
}

.bg-green-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-green-teal::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-transparent {
  background-image: linear-gradient(green 50%, transparent 50%);
}

.bg-green-transparent::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-green-white {
  background-image: linear-gradient(var(--color-green) 50%, var(--color-white) 50%);
}

.bg-green-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-green-white::before {
  background-color: var(--color-green);
  bottom: 50%;
}

.bg-grey-black {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-black) 50%);
}

.bg-grey-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-grey-black::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-gold {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-gold) 50%);
}

.bg-grey-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-grey-gold::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-green {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-green) 50%);
}

.bg-grey-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-grey-green::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-orange {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-orange) 50%);
}

.bg-grey-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-grey-orange::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-teal {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-teal) 50%);
}

.bg-grey-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-grey-teal::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-transparent {
  background-image: linear-gradient(grey 50%, transparent 50%);
}

.bg-grey-transparent::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-grey-white {
  background-image: linear-gradient(var(--color-grey) 50%, var(--color-white) 50%);
}

.bg-grey-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-grey-white::before {
  background-color: var(--color-grey);
  bottom: 50%;
}

.bg-orange-black {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-black) 50%);
}

.bg-orange-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-orange-black::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-gold {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-gold) 50%);
}

.bg-orange-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-orange-gold::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-green {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-green) 50%);
}

.bg-orange-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-orange-green::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-grey {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-grey) 50%);
}

.bg-orange-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-orange-grey::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-teal {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-teal) 50%);
}

.bg-orange-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-orange-teal::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-transparent {
  background-image: linear-gradient(orange 50%, transparent 50%);
}

.bg-orange-transparent::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-orange-white {
  background-image: linear-gradient(var(--color-orange) 50%, var(--color-white) 50%);
}

.bg-orange-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-orange-white::before {
  background-color: var(--color-orange);
  bottom: 50%;
}

.bg-teal-black {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-black) 50%);
}

.bg-teal-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-teal-black::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-gold {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-gold) 50%);
}

.bg-teal-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-teal-gold::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-green {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-green) 50%);
}

.bg-teal-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-teal-green::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-grey {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-grey) 50%);
}

.bg-teal-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-teal-grey::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-orange {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-orange) 50%);
}

.bg-teal-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-teal-orange::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-transparent {
  background-image: linear-gradient(teal 50%, transparent 50%);
}

.bg-teal-transparent::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-teal-white {
  background-image: linear-gradient(var(--color-teal) 50%, var(--color-white) 50%);
}

.bg-teal-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-teal-white::before {
  background-color: var(--color-teal);
  bottom: 50%;
}

.bg-transparent-black {
  background-image: linear-gradient(transparent 50%, var(--color-black) 50%);
}

.bg-transparent-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-transparent-gold {
  background-image: linear-gradient(transparent 50%, var(--color-gold) 50%);
}

.bg-transparent-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-transparent-green {
  background-image: linear-gradient(transparent 50%, var(--color-green) 50%);
}

.bg-transparent-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-transparent-grey {
  background-image: linear-gradient(transparent 50%, var(--color-grey) 50%);
}

.bg-transparent-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-transparent-orange {
  background-image: linear-gradient(transparent 50%, var(--color-orange) 50%);
}

.bg-transparent-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-transparent-teal {
  background-image: linear-gradient(transparent 50%, var(--color-teal) 50%);
}

.bg-transparent-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-transparent-white {
  background-image: linear-gradient(transparent 50%, var(--color-white) 50%);
}

.bg-transparent-white::after {
  background-color: var(--color-white);
  top: 50%;
}

.bg-white-black {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-black) 50%);
}

.bg-white-black::after {
  background-color: var(--color-black);
  top: 50%;
}

.bg-white-black::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-gold {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-gold) 50%);
}

.bg-white-gold::after {
  background-color: var(--color-gold);
  top: 50%;
}

.bg-white-gold::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-green {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-green) 50%);
}

.bg-white-green::after {
  background-color: var(--color-green);
  top: 50%;
}

.bg-white-green::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-grey {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-grey) 50%);
}

.bg-white-grey::after {
  background-color: var(--color-grey);
  top: 50%;
}

.bg-white-grey::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-orange {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-orange) 50%);
}

.bg-white-orange::after {
  background-color: var(--color-orange);
  top: 50%;
}

.bg-white-orange::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-teal {
  background-image: linear-gradient(var(--color-white) 50%, var(--color-teal) 50%);
}

.bg-white-teal::after {
  background-color: var(--color-teal);
  top: 50%;
}

.bg-white-teal::before {
  background-color: var(--color-white);
  bottom: 50%;
}

.bg-white-transparent {
  background-image: linear-gradient(white 50%, transparent 50%);
}

.bg-white-transparent::before {
  background-color: var(--color-white);
  bottom: 50%;
}


/* Text colours */

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

.clr-gold {
  color: var(--color-gold);
}

.clr-green {
  color: var(--color-green);
}

.clr-grey {
  color: var(--color-grey);
}

.clr-orange {
  color: var(--color-orange);
}

.clr-teal {
  color: var(--color-teal);
}

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


/* Hover colours */

.hvr-black:hover {
  color: var(--color-black);
}

.hvr-gold:hover {
  color: var(--color-gold);
}

.hvr-green:hover {
  color: var(--color-green);
}

.hvr-grey:hover {
  color: var(--color-grey);
}

.hvr-orange:hover {
  color: var(--color-orange);
}

.hvr-teal:hover {
  color: var(--color-teal);
}

.hvr-white:hover {
  color: var(--color-white);
}

/* Headings */

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-headings);
  font-weight: var(--font-weight-light);
  line-height: 1;
}

h1:first-child, .h1:first-child, h2:first-child, .h2:first-child, h3:first-child, .h3:first-child, h4:first-child, .h4:first-child, h5:first-child, .h5:first-child, h6:first-child, .h6:first-child {
  margin-top: 0;
}

h1:last-child, .h1:last-child, h2:last-child, .h2:last-child, h3:last-child, .h3:last-child, h4:last-child, .h4:last-child, h5:last-child, .h5:last-child, h6:last-child, .h6:last-child {
  margin-bottom: 0;
}

h1, .h1 {
  font-size: clamp(2.5rem, 8vw, 4rem);
}

h2, .h2 {
  font-size: clamp(1.75rem, 4vw, 2rem);
}

h2::before, .h2::before {
  content: '';
  display: inline-block;
  margin-right: 0.5rem;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: var(--color-gold);
}

.bg-green h2::before, .bg-green .h2::before,
.bg-orange h2::before, .bg-orange .h2::before,
.bg-teal h2::before, .bg-teal .h2::before {
  background: var(--color-black);
}

.bg-gold h2::before, .bg-gold .h2::before,
.bg-black h2::before, .bg-black .h2::before {
  background: var(--color-white);
}

h2.clr-white::before, .clr-white h2::before, .h2.clr-white::before, .clr-white .h2::before {
  background: var(--color-white);
}

h2.clr-grey::before, .clr-grey h2::before, .h2.clr-grey::before, .clr-grey .h2::before {
  background: var(--color-grey);
}

h2.clr-black::before, .clr-black h2::before, .h2.clr-black::before, .clr-black .h2::before {
  background: var(--color-black);
}

h2.clr-orange::before, .clr-orange h2::before, .h2.clr-orange::before, .clr-orange .h2::before {
  background: var(--color-orange);
}

h2.clr-teal::before, .clr-teal h2::before, .h2.clr-teal::before, .clr-teal .h2::before {
  background: var(--color-teal);
}

h2.clr-gold::before, .clr-gold h2::before, .h2.clr-gold::before, .clr-gold .h2::before {
  background: var(--color-gold);
}

h2.clr-green::before, .clr-green h2::before, .h2.clr-green::before, .clr-green .h2::before {
  background: var(--color-green);
}

h3, .h3 {
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

h4, .h4 {
  font-size: 1.25rem
  font-weight: var(--font-weight-light);
}

ol.feature > li::before {
  font-family: var(--font-family-headings);
}

.msl-resourcelist .msl-resourcetitle, .msl_admin_page .vp_form .title, .msl_admin_page .vp_form input.button {
  font-weight: var(--font-weight-heavy);
}

.msl-resourcetitle::after,body,span.skin-attached,span.template-attached {
  font-weight: var(--font-weight-medium);
}

.vp_form legend {
  color: #081e47;
    font-style: normal;
    background: 0 0;
    padding: 0;
    display: contents
}

.msl_info {
    background: #fff
}

.dropdown-title {
    font-family: var(--font-family-buttons);
    font-weight: var(--font-weight-medium);
}

.msl-sso-login-link {
    font-weight: var(--font-weight-heavy);
}

*,::after,::before {
    box-sizing: border-box
}

html,sub,sup {
    position: relative
}

html {
    font-family: sans-serif;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
    overflow-x: hidden
}

#explore-container.has-items,article,aside,figcaption,figure,footer,header,hgroup,main,nav,section {
    display: block
}

/* Page banner */

.msl-pagebanner {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% calc(100% - 1rem));
}

/* Page description */

.msl-pagedescription {
  position: relative;
  padding-bottom: 4rem;
  padding-left: 2rem;
}

.msl-pagedescription::before {
  content: '';
  width: 1rem;
  height: 1rem;
  display: inline-block;
  background: var(--color-gold);
  border-radius: 50%;
  position: absolute;
  top: 0.65rem;
  left: 0;
}

.msl-pagedescription::after {
  content: '';
  width: 4rem;
  height: 4rem;
  display: block;
  background: url('chevron-gold.svg');
  right: 0;
  position: absolute;
  bottom: 0;
}

.bg-gold .msl-pagedescription::before,
.bg-black .msl-pagedescription::before {
  background: var(--color-white);
}

.bg-green .msl-pagedescription::before,
.bg-orange .msl-pagedescription::before,
.bg-teal .msl-pagedescription::before {
  background: var(--color-black);
}

.bg-gold .msl-pagedescription::after,
.bg-black .msl-pagedescription::after {
  background: url('chevron-white.svg');
}

.bg-green .msl-pagedescription::after,
.bg-orange .msl-pagedescription::after,
.bg-teal .msl-pagedescription::after {
  background: url('chevron-black.svg');
}

/* Breadcrumbs */

.breadcrumb-return {
  display: flex;
  align-items: center;
}

.breadcrumb-return::before {
  content: '\f111';
  font-family: 'Font Awesome 5 Free';
  font-size: 0.8rem;
  margin-right: 1rem;
  color: var(--color-white);
}

.bg-white .breadcrumb-return::before {
  color: var(--color-green);
}

/* Font styles */

.text-underline {
  border-bottom: 1px solid;
}

/* Socials */

.socials {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0;
  margin: 0;
}

.socials a {
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.socials a::before {
  margin-right: 0;
}

/* Nav */

nav {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 1rem;
  height: 90px;
}

nav .logo-container img {
  width: 3rem;
}

.nav-middle {
  max-width: 100%;
  flex-grow: 1;
}

.nav-right {
  flex-shrink: 0;
}

#navigation {
  display: none;
  width: 100%;
  position: absolute;
  top: 90px;
  left: 0;
  z-index: 1000;
}

.msl_admin {
  min-height: unset;
  padding: 0;
  background: transparent;
}

.msl_navbar {
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 1rem;
}

@media (min-width: 1300px) {
    .nav-middle {
      /*width: 1200px;
      flex-grow: unset;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      pointer-events: none;*/
    }
}

/* Hamburger */

.hamburger {
  position: relative;
  display: block;
  width: 4rem;
  height: 4rem;
  padding: 0;
  margin: 0;
  border: 0;
  cursor: pointer;
  background: transparent;
  justify-self: flex-end;
  z-index: 1;
  pointer-events: auto;
}

.hamburger-inner {
    width: 100%;
    height: 100%
}

.hamburger-inner::after, .hamburger-inner::before {
    height: 4px;
    width: 50%;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: all .3s cubic-bezier(.68,-.55, .265,1.55);
    transition-property: top,transform;
    transition-delay: .075s;
    background: var(--color-gold);
}

.hamburger-inner::before {
    top: calc(50% - 4px);
}

.hamburger-inner::after {
    top: calc(50% + 4px);
}

.hamburger.active .hamburger-inner::after, .hamburger.active .hamburger-inner::before {
    top: 50%
}

.hamburger.active .hamburger-inner::before {
    transform: translate(-50%,-50%); rotate(-225deg);
}

.hamburger.active .hamburger-inner::after {
    transform: translate(-50%,-50%); rotate(225deg);
}

/* Admin bar */

#controls-container {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  font-size: 1rem;
}

.control-item {
  display: block;
  padding: 0.5rem;
  color: var(--color-gold);
}

.control-item:hover {
  color: var(--color-green);
}

/* Hide drop-downs by default */

.control-menu {
  position: fixed;
  top: 0;
  width: 100%;
  right: -100%;
  text-align: left;
  background: var(--color-black);
  color: var(--color-white);
  padding: 1rem;
  overflow-x: hidden;
  height: 100%;
  z-index: 10000;
  transition: 0.2s all ease-in-out;
  line-height: 2;
}

.control-menu h3 {
  color: var(--color-white);
}

.control-menu .msl_add::before {
  content: unset;
}

@media (min-width: 574px) {
  .control-menu {
    width: 350px;
    box-shadow: -10px 0px 30px 1px rgba(0, 0, 0, 0.15);
  }
}

.control-menu.active {
  right: 0;
}

.control-menu a {
  color: var(--color-white);
}

.control-menu a:hover {
  color: var(--color-orange);
}

.control-close {
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 2rem;
  display: inline-block;
}

.control-close:hover, .control-close:focus {
  color: var(--color-orange);
}

/* Search bar */

#search-container, .search-container {
  display: none;
}

#ctl00_search_pnlSearch {
  display: flex;
}

#ctl00_search_btnSubmit {
  margin: 0;
}

#ctl00_search_txtSearchStr {
  padding: 1rem;
  margin: 0;
  background: transparent;
}

/* MSL overrides */

#msl_admin li {
  margin: 0;
  padding: 0;
}

#controlpanel + .mslwidget {
  margin-top: 2rem;
}

.collapse {
    padding: inherit;
    display: inherit;
    background: inherit
}

#to-top {
    display: none;
    position: fixed;
    bottom: 4rem;
    right: 2rem;
    z-index: 99;
    border: 1px solid;
    outline: 0;
    cursor: pointer;
    padding: 1rem
}

dl,ol,p,ul {
    margin-top: 0;
    margin-bottom: 1rem
}

ul li+li>h3,ul li+li>h4 {
    margin-top: 2rem!important
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

hr {
    border: 0;
    height: 3px
}

code,kbd,pre,samp {
    font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    font-size: 1em
}

pre {
    padding: 1rem;
    white-space: pre-wrap
}

section,footer {
    position: relative;
    z-index: 1;
}

.footer-logo {
    max-height: 5rem;
}

footer[class*=" bg-"]::before,footer[class^=bg-]::before,section[class*=" bg-"]::before,section[class^=bg-]::before {
    content: "";
    position: absolute;
    top: 0;
    left: -9999px;
    right: -9999px;
    bottom: 0;
    z-index: -1
}

.site-credit {
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 85%
}

/* Cards */

.cards-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 -1rem;
}

.col-10 .cards-container .card, .col-20 .cards-container .card, .col-25 .cards-container .card, .col-30 .cards-container .card, .col-33 .cards-container .card, .col-40 .cards-container .card, .col-50 .cards-container .card, .col-60 .cards-container .card, .col-66 .cards-container .card, .col-70 .cards-container .card, .col-75 .cards-container .card, .col-80 .cards-container .card {
    flex: 0 0 calc(100% - 2rem);
}

@media (min-width: 992px) {
    .col-10 .cards-container .card, .col-20 .cards-container .card, .col-25 .cards-container .card, .col-30 .cards-container .card, .col-33 .cards-container .card, .col-40 .cards-container .card, .col-50 .cards-container .card, .col-60 .cards-container .card, .col-66 .cards-container .card, .col-70 .cards-container .card, .col-75 .cards-container .card, .col-80 .cards-container .card {
        flex: 0 0 calc(50% - 2rem);
    }
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 0 0 calc(100% - 2rem);
    padding: 2rem;
    overflow: hidden;
    z-index: 1;
    transition: .3s transform cubic-bezier(.68,-.55, .265,1.55);
    margin: 4rem 0;
    border: 1px solid;
}

.card[class*=" bg-"], .card[class^="bg-"] {
    border: 0;
}

a.card:hover {
    transform: scale(1.1);
}

.cards-center .card {
    text-align: center
}

.card+.card, .card+.cards-container {
    margin-top: 2rem
}

.cards-container .card {
    margin: 1rem;
}

.card.img-first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.card > img:first-child:not(.card-circle img) {
    margin: -2rem -2rem 0;
    max-width: calc(100% + 10rem);
}

.card .image-chevron {
    margin: -2rem -2rem 0;
    width: calc(100% + 4rem);
    max-width: unset;
}

.image-chevron {
    position: relative;
}

.image-chevron::after {
    content: '';
    width: 25%;
    height: 100%;
    background-position: center bottom;
    background-repeat: no-repeat;
    position: absolute;
    right: 1rem;
    bottom: 1rem;
}

.chevron-white::after {
    background-image: url('chevron-white.svg');
}

.chevron-green::after {
    background-image: url('chevron-green.svg');
}

.chevron-teal::after {
    background-image: url('chevron-teal.svg');
}

.chevron-orange::after {
    background-image: url('chevron-orange.svg');
}

.chevron-grey::after {
    background-image: url('chevron-grey.svg');
}

.chevron-gold::after {
    background-image: url('chevron-gold.svg');
}

.chevron-black::after {
    background-image: url('chevron-black.svg');
}

.card img+p {
    margin-top: 1rem
}

img.card-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    max-width: unset;
    min-width: 110%;
    min-height: 110%;
    opacity: .2;
    z-index: -1;
    margin: 0!important;
}

.card-bg+.h2, .card-bg+.h3, .card-bg+.h4, .card-bg+.h5, .card-bg+.h6, .card-bg+h2, .card-bg+h3, .card-bg+h4, .card-bg+h5, .card-bg+h6 {
    margin-top: 0
}

.card-circle:first-child {
    position: relative;
    width: calc(100% + 2rem);
    margin: -2rem;
    padding: 3rem 2rem
}

.card-circle:first-child::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    display: block;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem
}

.card-circle:first-child img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1
}

.card-circle img {
    width: 6rem!important;
    border-radius: 50%;
    height: 6rem!important;
    object-fit: cover
}

.card-circle+h3, .card-circle+h4 {
    margin-top: 4rem;
    z-index: 1
}

@media (min-width:768px) {
    .cards-container .card {
        flex: 0 0 calc(50% - 2rem);
    }

    .cards-nudge {
        align-items: flex-start
    }

    .cards-nudge .card:nth-child(2n) {
        margin-top: 10rem
    }
}

@media (min-width:992px) {
    .cards-container .card {
        flex: 0 0 calc(33.333% - 2rem);
    }
}

/* Columns */

.columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: -1rem;
    margin-right: -1rem;
}

.col-100, .col-10, .col-20, .col-25, .col-30, .col-33, .col-40, .col-50, .col-60, .col-66, .col-70, .col-75, .col-80, .col-90 {
    margin: 1rem;
    flex: 0 0 calc(100% - 2rem);
    width: calc(100% - 2rem);
}

@media (min-width:768px) {
    .col-10, .col-10.card {
        flex: 0 0 calc(10% - 2rem);
        width: calc(10% - 2rem);
    }

    .col-20, .col-20.card {
        flex: 0 0 calc(20% - 2rem);
        width: calc(20% - 2rem);
    }

    .col-25, .col-25.card {
        flex: 0 0 calc(25% - 2rem);
        width: calc(25% - 2rem);
    }

    .col-30, .col-30.card {
        flex: 0 0 calc(30% - 2rem);
        width: calc(35% - 2rem);
    }

    .col-33, .col-33.card {
        flex: 0 0 calc(33.333% - 2rem);
        width: calc(33.333% - 2rem);
    }

    .col-40, .col-40.card {
        flex: 0 0 calc(40% - 2rem);
        width: calc(40% - 2rem);
    }

    .col-50, .col-50.card {
        flex: 0 0 calc(50% - 2rem);
        width: calc(50% - 2rem);
    }

    .col-60, .col-60.card {
        flex: 0 0 calc(60% - 2rem);
        width: calc(60% - 2rem);
    }

    .col-66, .col-66.card {
        flex: 0 0 calc(66.666% - 2rem);
        width: calc(66.666% - 2rem);
    }

    .col-70, .col-70.card {
        flex: 0 0 calc(70% - 2rem);
        width: calc(70% - 2rem);
    }

    .col-75, .col-75.card {
        flex: 0 0 calc(75% - 2rem);
        width: calc(75% - 2rem);
    }

    .col-80, .col-80.card {
        flex: 0 0 calc(80% - 2rem);
        width: calc(80% - 2rem);
    }

    .col-90, .col-90.card {
        flex: 0 0 calc(90% - 2rem);
        width: calc(90% - 2rem);
    }
}

.breakout {
    padding: 2rem
}

/* Padding classes */

.p-0 {
    padding: 0!important
}

.p-1 {
    padding: 1rem!important
}

.p-2 {
    padding: 2rem!important
}

.p-3 {
    padding: 3rem!important
}

.p-4 {
    padding: 4rem!important
}

.p-5 {
    padding: 5rem!important
}

.pl-0 {
    padding-left: 0!important
}

.pl-1 {
    padding-left: 1rem!important
}

.pl-2 {
    padding-left: 2rem!important
}

.pl-3 {
    padding-left: 3rem!important
}

.pl-4 {
    padding-left: 4rem!important
}

.pl-5 {
    padding-left: 5rem!important
}

.pr-0 {
    padding-right: 0!important
}

.pr-1 {
    padding-right: 1rem!important
}

.pr-2 {
    padding-right: 2rem!important
}

.pr-3 {
    padding-right: 3rem!important
}

.pr-4 {
    padding-right: 4rem!important
}

.pr-5 {
    padding-right: 5rem!important
}

.pt-0 {
    padding-top: 0!important
}

.pt-1 {
    padding-top: 1rem!important
}

.pt-2 {
    padding-top: 2rem!important
}

.pt-3 {
    padding-top: 3rem!important
}

.pt-4 {
    padding-top: 4rem!important
}

.pt-5 {
    padding-top: 5rem!important
}

.pb-0 {
    padding-bottom: 0!important
}

.pb-1 {
    padding-bottom: 1rem!important
}

.pb-2 {
    padding-bottom: 2rem!important
}

.pb-3 {
    padding-bottom: 3rem!important
}

.pb-4 {
    padding-bottom: 4rem!important
}

.pb-5 {
    padding-bottom: 5rem!important
}

.py-0 {
    padding-top: 0!important;
    padding-bottom: 0!important
}

.py-1 {
    padding-top: 1rem!important;
    padding-bottom: 1rem!important
}

.py-2 {
    padding-top: 2rem!important;
    padding-bottom: 2rem!important
}

.py-3 {
    padding-top: 3rem!important;
    padding-bottom: 3rem!important
}

.py-4 {
    padding-top: 4rem!important;
    padding-bottom: 4rem!important
}

.py-5 {
    padding-top: 5rem!important;
    padding-bottom: 5rem!important
}

.px-0 {
    padding-left: 0!important;
    padding-right: 0!important
}

.px-1 {
    padding-left: 1rem!important;
    padding-right: 1rem!important
}

.px-2 {
    padding-left: 2rem!important;
    padding-right: 2rem!important
}

.px-3 {
    padding-left: 3rem!important;
    padding-right: 3rem!important
}

.px-4 {
    padding-left: 4rem!important;
    padding-right: 4rem!important
}

.px-5 {
    padding-left: 5rem!important;
    padding-right: 5rem!important
}

/* Margin classes */

.m-0 {
    margin: 0!important
}

.m-1 {
    margin: 1rem!important
}

.m-2 {
    margin: 2rem!important
}

.m-3 {
    margin: 3rem!important
}

.m-4 {
    margin: 4rem!important
}

.m-5 {
    margin: 5rem!important
}

.ml-0 {
    margin-left: 0!important
}

.ml-1 {
    margin-left: 1rem!important
}

.ml-2 {
    margin-left: 2rem!important
}

.ml-3 {
    margin-left: 3rem!important
}

.ml-4 {
    margin-left: 4rem!important
}

.ml-5 {
    margin-left: 5rem!important
}

.mr-0 {
    margin-right: 0!important
}

.mr-1 {
    margin-right: 1rem!important
}

.mr-2 {
    margin-right: 2rem!important
}

.mr-3 {
    margin-right: 3rem!important
}

.mr-4 {
    margin-right: 4rem!important
}

.mr-5 {
    margin-right: 5rem!important
}

.mt-0 {
    margin-top: 0!important
}

.mt-1 {
    margin-top: 1rem!important
}

.mt-2 {
    margin-top: 2rem!important
}

.mt-3 {
    margin-top: 3rem!important
}

.mt-4 {
    margin-top: 4rem!important
}

.mt-5 {
    margin-top: 5rem!important
}

.form-set>label, .mb-0 {
    margin-bottom: 0!important
}

.mb-1 {
    margin-bottom: 1rem!important
}

.mb-2 {
    margin-bottom: 2rem!important
}

.mb-3 {
    margin-bottom: 3rem!important
}

.mb-4 {
    margin-bottom: 4rem!important
}

.mb-5 {
    margin-bottom: 5rem!important
}

.my-0 {
    margin-top: 0!important;
    margin-bottom: 0!important
}

.my-1 {
    margin-top: 1rem!important;
    margin-bottom: 1rem!important
}

.my-2 {
    margin-top: 2rem!important;
    margin-bottom: 2rem!important
}

.my-3 {
    margin-top: 3rem!important;
    margin-bottom: 3rem!important
}

.my-4 {
    margin-top: 4rem!important;
    margin-bottom: 4rem!important
}

.my-5 {
    margin-top: 5rem!important;
    margin-bottom: 5rem!important
}

.mx-0 {
    margin-left: 0!important;
    margin-right: 0!important
}

.mx-1 {
    margin-left: 1rem!important;
    margin-right: 1rem!important
}

.mx-2 {
    margin-left: 2rem!important;
    margin-right: 2rem!important
}

.mx-3 {
    margin-left: 3rem!important;
    margin-right: 3rem!important
}

.mx-4 {
    margin-left: 4rem!important;
    margin-right: 4rem!important
}

.mx-5 {
    margin-left: 5rem!important;
    margin-right: 5rem!important
}

@media (min-width: 768px) {
    .extra-slim .pl-0 {
        margin-left: -20vw
    }

    .extra-slim .pr-0 {
        margin-right: -20vw
    }

    .pl-20 {
        padding-left: 20%
    }

    .pl-25 {
        padding-left: 25%
    }

    .pl-30 {
        padding-left: 30%
    }

    .pl-33 {
        padding-left: 33%
    }

    .pl-50 {
        padding-left: 50%
    }

    .pl-66 {
        padding-left: 66%
    }

    .pl-75 {
        padding-left: 75%
    }

    .pr-20 {
        padding-right: 20%
    }

    .pr-25 {
        padding-right: 25%
    }

    .pr-30 {
        padding-right: 30%
    }

    .pr-33 {
        padding-right: 33%
    }

    .pr-50 {
        padding-right: 50%
    }

    .pr-66 {
        padding-right: 66%
    }

    .pr-75 {
        padding-right: 75%
    }

    .ml-20 {
        margin-left: 20%
    }

    .ml-25 {
        margin-left: 25%
    }

    .ml-30 {
        margin-left: 30%
    }

    .ml-33 {
        margin-left: 33%
    }

    .ml-50 {
        margin-left: 50%
    }

    .ml-66 {
        margin-left: 66%
    }

    .ml-75 {
        margin-left: 75%
    }

    .mr-20 {
        margin-right: 20%
    }

    .mr-25 {
        margin-right: 25%
    }

    .mr-30 {
        margin-right: 30%
    }

    .mr-33 {
        margin-right: 33%
    }

    .mr-50 {
        margin-right: 50%
    }

    .mr-66 {
        margin-right: 66%
    }

    .mr-75 {
        margin-right: 75%
    }
}

img {
    vertical-align: middle;
    border-style: none;
    max-width: 100%;
    height: auto!important
}

.img-circle, .img-circle img {
    border-radius: 50%;
    overflow: hidden
}

.video-wrapper {
    margin-bottom: 2rem;
    position: relative;
    padding-bottom: 56.25%;
    height: 0
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

a {
    text-decoration: none;
    background-color: transparent;
    color: var(--color-green);
    font-family: var(--font-family-headings);
}

input,optgroup,select,textarea {
    font-size: inherit
}

button,input,optgroup,select,textarea {
    margin: 0;
    font-family: inherit;
    line-height: inherit;
}

.checkbox td,a,input[type=submit] {
    cursor: pointer;
}

input.textbox,select,textarea {
    padding: 1.5rem;
    border: 0;
    width: 100%;
}

.input-container {
    display: block;
    position: relative;
    padding-left: 2.5rem;
    margin-right: 1.5rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.columns>.input-container {
    margin: 1rem;
    padding: 0;
}

.input-container input[type=checkbox] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkmark {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    height: 1.5rem;
    width: 1.5rem;
}

.checkmark::after {
    content: "";
    position: absolute;
    display: none
}

.input-container .checkmark::after {
    top: 50%;
    left: 50%;
    width: 5px;
    height: 10px;
    border-style: solid;
    border-width: 0 3px 3px 0;
    -webkit-transform: translate(-50%,-50%) rotate(45deg);
    -ms-transform: translate(-50%,-50%) rotate(45deg);
    transform: translate(-50%,-50%) rotate(45deg);
}

.input-container input:checked~.checkmark:after {
    display: block
}

.button, button, input.button, .msl-loginbutton {
  display: inline-block;
  padding: 0.5rem 1rem;
  border: 0;
  font-size: inherit;
  font-weight: 600;
  margin: 2rem 0;
  background: var(--color-green);
  color: var(--color-white);
  font-family: var(--font-family-headings);
}

.button:first-child, button:first-child, input.button:first-child, .msl-loginbutton:first-child {
    margin-top: 0
}

.button:last-child, button:last-child, input.button:last-child, .msl-loginbutton:last-child  {
    margin-bottom: 0
}

.msl-loginbutton {
  margin-left: 1rem;
}

.msl-loginbutton:hover, .msl-loginbutton:focus {
  background-color: var(--color-black);
}

.button.external::after,input.button::after {
    content: "?";
    font-family: "Font Awesome 5 Free";
    font-weight: 800;
    margin-left: .5rem
}

/* Paragraphs */

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

.lead {
  line-height: 1.5;
  font-size: 1.25rem;
  font-size: calc(1.25rem + .25vw);
  font-family: var(--font-family-headings);
}

.big {
    font-size: 150%
}

.small {
    font-size: 80%
}

.weight-light {
  font-weight: var(--font-weight-light) !important;
}

.weight-medium {
  font-weight: var(--font-weight-medium) !important;
}

.weight-heavy {
  font-weight: var(--font-weight-heavy) !important;
}

.text-lowercase {
  text-transform: lowercase !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-default {
  text-transform: none !important;
}

.icon-info {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6rem;
    height: 6rem;
    margin: 0 auto;
    font-size: 200%;
    font-weight: 500;
    border: 5px solid;
    border-radius: 50%
}

.sr-only {
    border: 0;
    clip: rect(0,0,0,0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

.text-center {
    text-align: center
}

.form label, .text-left {
    text-align: left
}

.text-right {
    text-align: right
}

/* Quotes */

blockquote {
  text-align: center;
  font-size: 200%;
  width: 600px;
  margin: 8rem auto;
}

/* Tables */

.table-container {
    overflow-x: auto
}

table {
    width: 100%;
    margin: 2rem 0;
    border-spacing: 0;
    border-collapse: collapse
}

td,th {
    padding: 1rem
}

td {
    border-width: 0;
    border-style: solid
}

#admin_page_content {
    padding-top: 8rem
}

.msl_admin_page .vp_form fieldset {
    padding: 2rem;
    margin: 4rem 0;
    border: 0
}

.msl_admin_page .vp_form .title {
    text-align: left;
    padding-left: 1rem;
    float: none
}

.msl_admin_page .vp_form input.large, .vp_form textarea.max {
    max-width: 100%;
    width: unset!important
}

.msl_admin_page .vp_form fieldset .vpFormSubmit {
    width: 100%;
    display: block;
    margin: 1rem 0 0;
    padding: 1rem 0
}

.msl_admin_page .vp_form input.button {
    padding: 1rem 2rem
}

.msl_admin_page .hint-text, .msl_admin_page .iconopenhints {
    display: block;
    margin: 1rem 0;
    clear: both;
    padding: 1rem;
    width: 100%
}

.msl_admin_page .vp_form .hint-text span {
    position: relative;
    left: unset;
    width: auto;
    height: auto
}

.msl_admin_page .vp_form .hint-text span::before {
    content: "?";
    font-family: "Font Awesome 5 Free";
    font-weight: 500;
    margin-right: .5rem
}

.msl_admin_page .hint-text:hover, .msl_admin_page .iconclosehints, .msl_admin_page .vp_highlight .hint-text {
    padding: 0;
    display: block;
    background: 0 0;
    margin: 1rem 0
}

.msl_admin_page .hint-text:hover span, .msl_admin_page .vp_form .defaultdisplay span, .msl_admin_page .vp_form .vp_highlight .hint-text span {
    border: 0;
    box-shadow: none;
    padding: 1rem;
    top: unset;
    border-radius: 0;
    line-height: inherit;
    position: relative;
    width: 100%;
    left: unset
}

.msl_admin_page .vp_form textarea {
    float: none
}

.msl_admin_page table.msl_table {
    border: 0;
    width: 100%;
    margin: 1rem 0;
    font-size: 1rem
}

.msl_admin_page .msl_table .msl_altrow, .msl_admin_page table.msl_table th {
    color: inherit
}

.error, .msl_admin_page table.msl_table th {
    border: 0;
    padding: 1rem
}

.msl_admin_page .msl_table .msl_row {
    background: 0 0;
    color: inherit
}

.msl_admin_page .vp_form .checkbox {
    margin-left: 0
}

.msl_admin_page .vp_form .checkbox label {
    padding-left: 2rem;
    margin: 0
}

.error {
    padding: 2rem;
    margin: 2rem 0
}

#edit_body .panel_options a[class^=msl_], .msl_table a[class^=msl_] {
    position: relative;
    padding: 0;
    overflow: auto;
    text-indent: unset;
    font-size: 0;
    background: 0 0
}

#edit_body .panel_options a[class^=msl_]::before, .msl_table a[class^=msl_]::before {
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-family: "Font Awesome 5 Free";
    font-weight: 800;
    font-size: 1rem
}

#edit_page_buttons a[class^=msl_]::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 800;
    font-size: 1rem;
    margin-right: .5rem
}

#page_tree table {
    width: auto;
    margin: 0
}

#page_tree table tr {
    border-top: 1px solid #fff
}

#page_tree table td {
    border: 0;
    padding: .5rem
}

.msl_table .msl_checkbox_unchecked::before {
  content: '\f0c8';
}

.msl_table .msl_checkbox_checked::before {
  content: '\f14a';
}

.msl_table .msl_view:before, .button_key .msl_view:before, #edit_page_buttons .msl_view:before {
  content: '\f002';
}

.msl_table .msl_edit:before, .button_key .msl_edit:before, #edit_page_buttons .msl_properties:before {
  content: '\f303';
}

.msl_table .msl_compare:before, .button_key .msl_compare:before {
  content: '\f2f1';
}

.msl_table .msl_ticket:before, .button_key .msl_ticket:before {
  content: '\f3ff';
}

.msl_table .msl_tick:before, .button_key .msl_tick:before {
  content: '\f52b';
}

.msl_table .msl_report:before, .button_key .msl_report:before {
  content: '\f249';
}

.msl_table .msl_delete:before, .button_key .msl_delete:before {
  content: '\f2ed';
}

.msl_table .msl_copy:before, .button_key .msl_copy:before, #edit_page_buttons .msl_documents:before {
  content: '\f0c5';
}

.msl_table .msl_sales:before, .button_key .msl_sales:before {
  content: '\f543';
}

#edit_body .panel_options .msl_image:before {
  content: '\f1c5';
}

#edit_body .panel_options .msl_document:before {
  content: '\f574';
}

#edit_page_buttons .msl_webpage:before {
  content: '\f1ea';
}

#edit_page_buttons .msl_history:before {
  content: '\f1da';
}

#edit_page_buttons .msl_pagestyle:before {
  content: '\f53f';
}

#edit_page_buttons .msl_security:before {
  content: '\f023';
}

.form {
    display: block;
    margin: 2rem 0
}

.form-set {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.form-set+.form-set, .form-wrap label+label {
    margin-top: 2rem
}

.form label {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.5rem;
    font-weight: 500
}

.form-set>input, .form-wrap>label>input {
    flex: 0 0 66.66%
}

.form-set>label {
    flex: 0 0 33.33%
}

.form input, .form select, .form textarea {
    border: 0;
    font-size: 1.5rem
}

.form input[type=date], .form input[type=text], .form select {
    padding: .5rem 0
}

.vp_form fieldset {
    position: relative;
    padding: 2rem
}

.msl_notification {
    padding: 1rem;
    background: 0 0
}

.msl_info {
    margin: 0;
    padding: 1rem;
    border: 0
}

.msl_notification .msl-info {
    padding: 0
}

.image-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    list-style: none;
    margin: 2rem 0;
    padding: 0
}

.image-gallery:first-child {
    margin-top: 0
}

.image-gallery:last-child {
    margin-bottom: 0
}

.image-gallery>li {
    flex: 1 1 auto;
    height: 300px;
    cursor: pointer;
    position: relative
}

.image-gallery li img {
    object-fit: cover;
    width: 100%;
    height: 100%!important;
    vertical-align: middle
}

/* Icons */

.msl_add, .msl_edit, .msl_filter, .window, .window_sidebar, .document, .membership, .person, .group, .friends, .email, .web, .post, .phone, .print, .index, .message, .message_unread, .messagecentre, .edit, .ok, .add, .home, .search, .attachment, .message_send, .message_send_disabled, .message_em, .message_pm, .message_sm, .message_am, .msl-message-status-sending, .msl-message-status-sent, .msl-message-status-scheduled, .reset, .warning, .enable, .disable, .stop, .help, .purchases, .mail_delete, .mail_read, .mail_deleted, .mail_move, .mail_sent, .mail_write, .contact, .delete, .deleted, .undelete, .view, .save, .back, .foward, .collapse, .expand, .pm, .update, .cancel, .basket, .checkout, .delivery, .report, .forums, .forum, .forum_watching, .forum_watching_new, .forum_reply, .forum_newtopic, .forum_quote, .forum_moderate, .sitemap, .cal, .tickets, .msl_election_posts, .msl_election_candidates, .msl_security, .msl_tools, .msl_report, .msl_copy {
  background: none;
}

.add:not(.button), .msl_add:not(.button), .msl_edit:not(.button), .msl_filter:not(.button), .warning:not(.button), .email:not(.button), .phone:not(.button), .search:not(.button), .tickets:not(.button), .basket:not(.button), .home:not(.button) {
  padding: 0;
  background: none;
}

.facebook::before, .instagram::before, .twitter::before, .youtube::before, .linkedin::before, .snapchat::before, .tiktok::before {
  font-family: "Font Awesome 5 Brands";
  font-weight: 800;
  margin-right: 1rem;
}

.facebook::before {
  content: '\f39e';
}

.instagram::before {
  content: '\f16d';
}

.twitter::before {
  content: '\e61b';
}

.tiktok::before {
  content: '\e07b';
}

.youtube::before {
  content: '\f167';
}

.linkedin::before {
  content: '\f0e1';
}

.snapchat::before {
  content: '\f2ac';
}

.add::before, .msl_edit::before, .msl_add::before, .phone::before, .email::before, .location::before, .calendar::before, .clock::before, .download::before, .profile::before, .warning::before, .question::before, .image::before, .search::before, .tick::before, .cross::before, .basket::before, .tickets::before, .award::before, .trophy::before, .arrow-left::before, .arrow-up::before, .msl_nav_up::before, .arrow-down::before, .msl_nav_down::before, .home::before, .banned::before, .chat::before, .msl_election_posts::before, .msl_election_candidates::before, .msl_security::before, .msl_tools::before, .msl_report::before, .msl_copy::before, #ctl00_ctl00_Main_AdminPageContent_RecurrenceOptions1_lbRecurrenceOptions::before, .form_hint::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 800;
  margin-right: 1rem;
}

.arrow-right::after {
  content: '';
  width: 1rem;
  height: 0.75rem;
  background: url('https://www.ravesu.co.uk/stylesheet/Sheffield2023/icon-arrow-white-right.svg');
  display: inline-block;
  margin-left: 0.5rem;
  background-repeat: no-repeat;
}

.sidepanel .msl_add, .sidepanel .msl_edit {
  display: flex;
  align-items: center;
}

.phone::before {
  content: '\f095';
}

.email::before {
  content: "\f0e0";
  font-weight: 400;
}

.location::before {
  content: "\f3c5";
}

.calendar::before, #ctl00_ctl00_Main_AdminPageContent_RecurrenceOptions1_lbRecurrenceOptions::before {
  content: "\f073";
  font-weight: 400;
}

.clock::before {
  content: "\f017";
  font-weight: 400;
}

.download::before {
  content: "\f56d";
}

.profile::before {
  content: "\f007";
}

.warning::before, .form_hint::before {
  content: "\f06a";
}

.question::before {
  content: "\f128";
}

.image::before {
  content: "\f03e";
}

.search::before {
  content: "\f002";
}

.tick::before {
  content: "\f00c";
}

.cross::before {
  content: "\f00d";
}

.basket::before {
  content: "\f291";
}

.tickets::before {
  content: "\f3ff";
}

.award::before {
  content: '\f559';
}

.trophy::before {
  content: '\f091';
}

.arrow-left::before {
  content: '\f30a';
}

.arrow-up::before, .msl_nav_up::before {
  content: '\f30c';
}

.arrow-down::before, .msl_nav_down::before {
  content: '\f309';
}

.home::before {
  content: '\f015';
}

.banned::before {
  content: '\f05e';
}

.chat::before {
  content: '\f590';
}

.settings::before {
  content: '\f013';
}

.msl_add::before, .msl-addnew a::before {
  content: '\f067';
}

.msl_edit::before {
  content: '\f303';
}

.msl_note_edit::before {
  content: '\f013';
}

.msl_filter::before {
  content: '\f0b0';
}

.msl_election_posts::before {
  content: '\f007';
}

.msl_election_candidates::before {
  content: '\f0c0';
}

.msl_security::before {
  content: '\f023';
}

.msl_tools::before {
  content: '\f013';
}

.msl-addnew a, .msl_admin_page .msl_add, .msl_admin_page .msl_edit, #ctl00_ctl00_Main_AdminPageContent_RecurrenceOptions1_lbRecurrenceOptions {
  border: 1px solid;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.8rem;
}

.msl-addnew a:hover, .msl-addnew a:focus,
.msl_admin_page .msl_add:hover, .msl_admin_page .msl_add:focus,
.msl_admin_page .msl_edit:hover, .msl_admin_page .msl_edit:focus,
#ctl00_ctl00_Main_AdminPageContent_RecurrenceOptions1_lbRecurrenceOptions:hover, #ctl00_ctl00_Main_AdminPageContent_RecurrenceOptions1_lbRecurrenceOptions:focus {
  background: var(--color-pink);
  color: var(--color-white);
  border-color: var(--color-pink);
}

.msl_admin_page table .msl_edit, .msl_admin_page table .msl_edit:focus, .msl_admin_page table .msl_edit:hover {
  border: 0;
  background: transparent;
}

.cards-center .card, .chevron {
    justify-content: center;
    align-items: center
}

.chevron {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    border: 2px solid;
    border-radius: 50%;
    display: inline-flex;
    margin-right: .5rem
}

.chevron::before {
    border-style: solid;
    border-width: 2px 2px 0 0;
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    transform: rotate(-45deg);
    margin-left: 2px
}

.chevron.chevron-right:before {
    left: 0;
    transform: rotate(45deg);
}

.chevron.chevron-bottom:before {
    top: 0;
    transform: rotate(135deg);
}

.chevron.chevron-left:before {
    left: .25em;
    transform: rotate(-135deg);
}

.chevron, .position-relative {
    position: relative
}

.rotation-container {
    position: relative;
    max-width: 7rem
}

.rotation-fixed, .rotation-full {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.rotation-full {
    z-index: -1;
    width: 50%;
    max-width: unset
}

.rotation-fixed {
    width: 100%
}

/* Feature lists */

.feature {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    padding: 0;
    margin: 0
}

ul.feature li {
  position: relative;
  padding: 0.25rem 1rem;
  border: 2px solid;
  margin: 0.5rem;
  z-index: 1;
  background: var(--color-orange);
}

ol.feature>li {
    position: relative;
    padding-top: 6rem;
    padding-bottom: 6rem;
    padding-left: 4rem;
    flex: 0 0 100%
}

ol.feature>li {
    padding-top: 3rem;
    padding-bottom: 3rem;
    padding-left: 5rem
}

ol.feature {
    counter-reset: custom-numbers
}

ol.feature li {
    counter-increment: custom-numbers
}

ol.feature > li::before {
  content: counter(custom-numbers);
  position: absolute;
  top: 2rem;
  left: 0;
  font-size: 300%;
  color: var(--color-green);
}

.bg-green ol.feature > li::before,
.bg-orange ol.feature > li::before,
.bg-teal ol.feature > li::before {
  color: var(--color-white);
}

.bg-black ol.feature > li::before,
.bg-gold ol.feature > li::before {
  color: var(--color-orange);
}

@media (min-width:992px) {
    .feature>li {
        flex: 0 0 calc(50% - 4rem);
        margin: 2rem
    }
}

.dropdown {
    padding: 2rem;
    cursor: pointer;
    border: 1px solid;
}

.dropdown + .dropdown {
    border-top: 0;
}

.dropdown-title {
    align-items: center;
    font-size: 1.5rem;
    line-height: 1.2;
    display: flex
}

.dropdown-title:focus {
    outline: 0
}

.dropdown-title::before {
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: 800;
    font-size: 1rem;
    margin-right: 1rem;
    transition: .2s transform ease-in-out
}

.dropdown-title.active::before {
    transform: rotate(90deg);
}

.dropdown-title>* {
    margin: 0
}

.dropdown-content {
    display: none;
    margin-top: 2rem;
    border-radius: 0;
    transition: .4s border-radius ease-in-out
}

.dropdown-content>:last-child {
    margin-bottom: 0
}

.dropdown-content+.dropdown-title {
    margin-top: 4rem
}

.full-width {
  position: relative;
  padding-top: 4rem;
  padding-bottom: 4rem;
  z-index: 1
}

.full-width + .full-width {
  margin-top: 1rem;
}

.content-inner .full-width {
  margin-left: -1rem;
  margin-right: -1rem;
}

.content-inner .full-width > *:not(blockquote) {
  margin-left: 2rem;
  margin-right: 2rem;
}

@media (min-width: 1300px) {
    .content-inner .full-width {
      margin-left: calc(-50vw + 600px + 1rem);
      margin-right: calc(-50vw + 600px + 1rem);
    }

    .content-inner .full-width > *:not(blockquote) {
      width: 1200px;
      margin: 0 auto;
    }
}

/*

.full-width::after, .full-width::before {
    content: "";
    position: absolute;
    top: 0;
    left: -2000px;
    right: -2000px;
    bottom: 0;
    z-index: -1
}

*/

@media (min-width:992px) {
    .full-width {
        padding-top: 5rem;
        padding-bottom: 5rem
    }
}

@media (min-width:1200px) {
    .full-width {
        padding-top: 7rem;
        padding-bottom: 7rem
    }
}

@media (min-width:1300px) {
    .full-width {
        margin-left: calc(-50vw + 600px);
        margin-right: calc(-50vw + 600px);
    }
}

@media (min-width:1500px) {
    .full-width {
        padding-top: 9rem;
        padding-bottom: 9rem
    }
}

/* Clipped */

.clipped {
  margin: 1rem;
}

.clipped-top {
  clip-path: polygon(0% 0%, calc(50% - 0.5rem) 1rem, calc(50% - 0.5rem) 2rem, 100% 3rem, 100% 100%, 0% 100%);
  padding-top: 6rem !important;
  margin: 1rem;
}

.clipped-bottom {
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, calc(50% + 0.5rem) calc(100% - 1rem), calc(50% + 0.5rem) calc(100% - 2rem), 0% calc(100% - 3rem));
  padding-bottom: 6rem !important;
  margin: 1rem;
}

.clipped-top.clipped-bottom {
  clip-path: polygon(0% 0%, calc(50% - 0.5rem) 1rem, calc(50% - 0.5rem) 2rem, 100% 3rem, 100% 100%, calc(50% + 0.5rem) calc(100% - 1rem), calc(50% + 0.5rem) calc(100% - 2rem), 0% calc(100% - 3rem));
}

.clipped-bottom + .clipped-top {
  margin-top: -3rem;
}

#ctl00_Main_VacancyDetailsCtl_job_vacancy>h1,#ctl00_Main_VacancyDetailsCtl_job_vacancy>p,#explore-container, .hide-in-new-template {
    display: none
}

#ctl00_Main_VacancyDetailsCtl_job_vacancy {
    display: flex;
    flex-wrap: wrap;
    margin: 0-1rem
}

#ctl00_Main_VacancyDetailsCtl_job_vacancy>* {
    flex: 0 0 calc(100% - 2rem);
    margin: 1rem
}

#ctl00_Main_VacancyDetailsCtl_pnlApplying {
    position: relative;
    padding: 2rem
}

@media (min-width:768px) {
    #ctl00_Main_VacancyDetailsCtl_job_vacancy>* {
        flex: 0 0 calc(50% - 2rem);
    }

    #ctl00_Main_VacancyDetailsCtl_pnlApplying,#ctl00_Main_VacancyDetailsCtl_pnlDetails {
        flex: 0 0 calc(100% - 2rem);
    }
}

.show-in-new-template {
    display: block!important
}

.show-in-new-template.columns {
    display: flex!important
}

.event_tickets {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    margin: 0;
    width: 100%
}

.event_tickets>* {
    flex: 0 0 calc(100% - 2rem);
    margin: 1rem
}

.event_ticket {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    margin: 0
}

.event_ticket>* {
    flex: 0 0 calc(100% - 2rem);
    margin: 1rem
}

.event_ticket>span {
    order: -1
}

.event_ticket>.button {
    margin: 1rem;
    padding: 1rem
}

@media (min-width:768px) {
    .event_ticket>.button, .event_ticket>select {
        flex: 0 0 calc(50% - 2rem);
        padding: .5rem;
        margin: 1rem!important
    }
}

@media (min-width:1200px) {
    .event_ticket {
        align-items: center
    }

    .event_ticket>span {
        flex: 0 0 calc(20% - 2rem);
    }

    .event_ticket>.button, .event_ticket>select {
        flex: 0 0 calc(40% - 2rem);
    }
}

.event-detail-wrap {
    margin-top: 3rem
}

.event-detail-wrap h3, .login a {
    font-size: 1rem
}

.event-detail-wrap p {
    margin-left: 2rem
}

.event-socials {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.event-socials li {
    cursor: pointer
}

.event-detail-wrap h3::before, .event-socials li::before {
    display: inline-block;
    width: 1rem
}

.event-socials li+li {
    margin-top: .5rem
}

@media (min-width:768px) {
    .event_tickets #ctl00_Main_ctl01_ddTickets {
        flex: 0 0 calc(66.666% - 2rem);
        margin: 0 1rem
    }

    .event_tickets #ctl00_Main_ctl01_btnAddTicket {
        flex: 0 0 calc(33.333% - 2rem);
        margin: 0 1rem
    }
}

/* News list */

.msl-news {
  display: grid;
  gap: 1.5rem;
}

.msl-item {
  display: flex;
  gap: 1.5rem;
  flex-direction: column;
  position: relative;
  border: 1px solid var(--color-orange);
  padding: 1.5rem 1.5rem 4rem;
}

.bg-orange .msl-item {
  border: 1px solid var(--color-white);
}

.msl-item:hover .msl-title a::after, .msl-item:focus .msl-title a::after {
  color: var(--color-orange);
}

.bg-orange .msl-item:hover .msl-title a::after, .bg-orange .msl-item:focus .msl-title a::after {
  color: var(--color-white);
}

.msl-title {
  margin-top: 0;
}

.msl-title a {
  color: var(--color-gold);
}

.bg-gold .msl-title a {
  color: var(--color-white);
}

.msl-title a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.msl-title a::after {
  content: 'Read article';
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  font-size: 1rem;
  font-weight: var(--font-weight-heavy);
}

.msl-image {
  overflow: hidden;
  display: block;
}

.msl-image img {
  transition: 0.2s ease-in-out;
}

.msl-leader {
  margin: 4rem 0 0;
}

.msl-item-details {
  display: none;
}

.news_all a {
  display: inline-block;
  background: var(--color-orange);
  color: var(--color-white);
  font-family: var(--font-family-headings);
  padding: 0.5rem 1rem;
  margin-top: 1rem;
}

.news_all a:hover, .news_all a:focus {
  background: var(--color-gold);
}

@media (min-width: 992px) {

    .msl-news {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
      gap: 1.5rem;
    }
}

/* News list - scroller */

.news-scroller {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 auto;
  margin-right: calc(-50vw + 45%);
}

.news-scroller-inner {
  display: inline-block;
  animation: marquee 40s linear infinite;
}

.news-scroller .msl-item-list-1 {
  position: relative;
  left: 0%;
  animation: swap 40s linear infinite;
}

.news-scroller .msl-item-list + .msl-item-list {
  margin-left: 2rem;
}

.news-scroller .msl-news {
  display: inline-block;
}

.news-scroller .msl-item {
  display: inline-block;
  border: 0;
  padding: 0;
  width: fit-content;
}

.news-scroller .msl-item:focus, .news-scroller .msl-item:hover {
  border-bottom: 2px solid;
}

.news-scroller .msl-item + .msl-item {
  margin-left: 2rem;
}

.news-scroller .msl-title {
  margin: 0;
}

.news-scroller .msl-title a::after {
  content: none;
}

.news-scroller .news_all, .news-scroller .killfloat {
  display: none;
}

/* Transition */
@keyframes marquee {
  0% {
    transform: translateX(0)
  }
  100% {
    transform: translateX(-100%)
  }
}

@keyframes swap {
  0%, 50% {
    left: 0%;
  }
  50.01%,
  100% {
    left: 100%;
  }
}

/* News pages */

#news .msl-tags, #news h1 {
  display: none;
}

/* Image navigation */

.msl-imagenav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.no-images img {
  display: none;
}

/* Image navigation - section nav */

#section-navigation::before {
  content: 'In this section';
  display: block;
  font-weight: var(--font-weight-light);
  font-family: var(--font-family-headings);
  margin-bottom: 1rem;
}

#section-navigation li + li {
  margin-top: 1rem;
}

#section-navigation a {
  display: block;
}

#section-navigation a::after {
  content: '';
  height: 2px;
  display: block;
  background: linear-gradient(90deg, var(--color-white) 50%, var(--color-black) 50%);
  background-size: 200% 200%;
  background-position: 100%;
  transition: 0.2s ease-in-out;
  margin-top: 0.5rem;
}

#section-navigation a:hover::after {
  background-position: 0%;
}

.bg-white #section-navigation a:hover, #section-navigation a:focus {
  color: var(--color-green);
}

.bg-white #section-navigation a::after {
  background-image: linear-gradient(90deg, var(--color-green) 50%, var(--color-black) 50%);
}

.bg-green #section-navigation a:hover, #section-navigation a:focus {
  color: var(--color-white);
}

.bg-green #section-navigation a::after {
  background-image: linear-gradient(90deg, var(--color-white) 50%, var(--color-black) 50%);
}

.bg-orange #section-navigation a:hover, #section-navigation a:focus {
  color: var(--color-white);
}

.bg-orange #section-navigation a::after {
  background-image: linear-gradient(90deg, var(--color-white) 50%, var(--color-black) 50%);
}

/* Login */

.msl-sso-login-link {
    display: inline-block;
    padding: .5rem 1.5rem;
    border: 0;
    font-size: inherit;
    margin: 2rem 0
}

.login, .login label {
    margin-top: 1rem
}

.login a {
    display: inline-block;
    margin: .5rem 0;
    border-bottom: 2px solid;
    text-transform: uppercase;
    margin-right: 100%;
    white-space: pre
}

.login label {
    font-size: 1rem;
    font-weight: var(--font-weight-medium);
    display: block
}

.msl_linkgrid {
    display: flex!important;
    flex-wrap: wrap;
    margin: 0-1rem!important;
    padding: 0
}

#msl ul.msl_linkgrid li {
    flex: 0 0 calc(50% - 2rem);
    margin: 1rem
}

#msl ul.msl_linkgrid li a {
    float: none;
    padding: 1rem;
    background: 0 0;
    font-size: 1rem;
    font-weight: 400;
    width: 100%
}

#msl ul.msl_linkgrid li a::before {
    display: block;
    font-size: 2rem;
    font-family: "Font Awesome 5 Free";
    font-weight: 800
}

#msl ul.msl_linkgrid li a:hover {
    background-color: transparent
}

.msl_linkgrid_details::before {
  content: '\f085';
}

.msl_linkgrid_pages::before {
  content: '\f15c';
}

.msl_linkgrid_news::before {
  content: '\f1ea';
}

.msl_linkgrid_events::before {
  content: '\f073';
}

.msl_linkgrid_email::before {
  content: '\f0e0';
}

.msl_linkgrid_members::before {
  content: '\f0c0';
}

.msl_linkgrid_groups::before {
  content: '\f4fe';
}

.msl_linkgrid_signups::before {
  content: '\f328';
}

.msl_linkgrid_poll::before {
  content: '\f681';
}

.msl_linkgrid_reports::before {
  content: '\f15c';
}

.msl_linkgrid_resources::before {
  content: '\f1c6';
}

.msl_linkgrid_sgf::before {
  content: '\f51e';
}

.msl_linkgrid_newpage::before {
  content: '\f067';
}

.msl_linkgrid_editpage::before {
  content: '\f044';
}

.msl_linkgrid_sitedesign::before {
  content: '\f247';
}

.msl_linkgrid_sitenavigation::before {
  content: '\f0c9';
}

.msl_linkgrid_sitetoolbars::before {
  content: '\f7d9';
}

.msl_linkgrid_siteimages::before {
  content: '\f03e';
}

.msl_linkgrid_terms::before {
  content: '\f036';
}

.msl_linkgrid_recaptcha::before {
  content: '\f021';
}

.msl_linkgrid_hub::before {
   content: '\f51c';
}

@media (min-width: 992px) {
    #msl ul.msl_linkgrid li {
      flex: 0 0 calc(33.333% - 2rem);
    }
}

@media (min-width: 1200px) {
    #msl ul.msl_linkgrid li {
      flex: 0 0 calc(25% - 2rem);
    }
}

@media (min-width: 1500px) {
    #msl ul.msl_linkgrid li {
      flex: 0 0 calc(20% - 2rem);
    }
}

.parallax-xl, .parallax-xr {
    will-change: transform;
    transition: transform .6s cubic-bezier(0,0,0,1);
}

.d-flex {
    display: flex
}

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

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

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

.align-end {
    align-items: flex-end
}

.justify-start {
    justify-content: flex-start
}

.justify-space-between {
    justify-content: space-between
}

.justify-space-around {
    justify-content: space-around
}

.justify-center {
    justify-content: center
}

.justify-end {
    justify-content: flex-end
}

.flex-column {
    flex-direction: column
}

.flex-row {
    flex-direction: row
}

.flex-wrap {
    flex-wrap: wrap
}

.align-self-start {
    align-self: flex-start
}

.align-self-end {
    align-self: flex-end
}

.align-self-center {
    align-self: center
}

/* Events */

.msl_eventlist > div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

.eventlist_day + .eventlist_day {
  margin-top: 4rem;
}

.eventlist_day h4 {
  color: var(--color-orange);
}

.msl_eventlist dl {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
}

.msl_eventlist dd {
  padding: 0;
  margin: 0;
  font-size: 1rem;
}

.msl_event_name {
  font-weight: var(--font-weight-heavy);
  letter-spacing: 1px;
  font-size: 1.5rem;
  padding: 0.5rem 1rem 0 1rem;
  margin-left: -1rem;
  display: block;
  background: var(--color-white);
  z-index: 1;
  position: relative;
  width: fit-content;
}

.msl_event_name:hover {
  color: var(--color-orange) !important;
}

.event_item {
  position: relative;
  display: block;
  padding: 1rem;
  height: 100%;
  background: var(--color-white);
}

.event_item .msl_ticket {
  position: absolute;
  bottom: -1rem;
  padding: 0.25rem 0.5rem 0.3rem;
  background: var(--color-white);
  color: var(--color-dark-grey);
  font-family: var(--font-family-headings);
  text-transform: uppercase;
  font-size: 1rem;
}

.msl_event_image {
  display: block;
  margin: -1rem -1rem -2rem -1rem;
  width: calc(100% + 2rem);
}

.msl_event_location {
  order: 1;
  margin-top: 1rem !important;
}

.event_item > dl > dt > a::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

@media (min-width: 768px) {
  .msl_eventlist > div {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 992px) {
  .msl_eventlist > div {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* Show / hide */

.hide {
  display: none;
}