/* Normalize, reset */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

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

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

 html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }
  
  /* Sections
     ========================================================================== */
  
  /**
   * Remove the margin in all browsers.
   */
  
  body {
    margin: 0;
  }
  
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  
  /* Grouping content
     ========================================================================== */
  
  /**
   * Add the correct box sizing in Firefox.
   */
  
  hr {
    box-sizing: content-box;
    height: 0;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /* Text-level semantics
     ========================================================================== */
  
  /**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
   */
  
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  
  b,
  strong {
    font-weight: bolder;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /**
   * Add the correct font size in all browsers.
   */
  
  small {
    font-size: 80%;
  }
  
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  
  sub {
    bottom: -0.25em;
  }
  
  sup {
    top: -0.5em;
  }
  
  /* Forms
     ========================================================================== */
  
  /**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
  
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    line-height: inherit;
    margin: 0; /* 2 */
  }
  
  /**
   * Remove the inheritance of text transform in Edge and Firefox.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  
  button,
  select { /* 1 */
    text-transform: none;
  }
  
  /**
   * Correct the inability to style clickable types in iOS and Safari.
   */
  
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  
  /**
   * Remove the inner border and padding in Firefox.
   */
  
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  
  /**
   * Restore the focus styles unset by the previous rule.
   */
  
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  
  /**
   * Correct the padding in Firefox.
   */
  
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  
  /**
   * Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers.
   */
  
  legend {
    padding: 0;
  }
  
  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  
  progress {
    vertical-align: baseline;
  }
  
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  
  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */
  
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  
  /* Interactive
     ========================================================================== */
  
  /*
   * Add the correct display in Edge and Firefox.
   */
  
  details {
    display: block;
  }
  
  /*
   * Add the correct display in all browsers.
   */
  
  summary {
    display: list-item;
  }
*, 
*:before, 
*:after {
  box-sizing: border-box;
}

figure {
    margin: 0;
}

img {
  max-width: 100%;
  display: block;
}
/* 1. Sticky on scroll */
/* ********************************************** */

html:not(.hs-inline-edit) .sticky-on-scroll.is-sticky .sticky-inner {
  position: fixed;
  left: 0; right: 0;
  z-index: 1001;
}

/* Modal workaround - double position fixed issue */
html:not(.hs-inline-edit) body.modal-open .sticky-on-scroll.is-sticky .sticky-inner {
  position: static;
}

/* Global styles */
@media (min-width: 1024px) {
    html, body {
        width: 100%;
        height: 100%;
    }
    body > .body-wrapper {
        min-height: 100%;
        display: grid;
        grid-template-rows: auto 1fr auto;
        grid-template-columns: 100%;
    }
}
/* 
    CSS typography stylesheet

    Table of contents
    1. Headlines

*/

/* 1. Headlines */
/* ********************************************** */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin: 0 0 16px;
}

.h1-topline,
.h2-topline {
  font-size: 1.375rem;
  line-height: 1.36;
}
.h3-topline {
  font-size: 1.375rem;
  line-height: 1.5;
}

.h5.subline,
.subline {
  display: block;
  margin-bottom: 1.75rem;
}


/* 2. Paragraph */
/* ********************************************** */

@media (max-width: 767px) {
  html {
      font-size: 95%;
  }
}
@media (max-width: 424px) {
  html {
      font-size: 90%;
  }
}


p {
  margin: 0 0 16px 0;
}
p+h6, p+.h6 {
  margin-top: 2.5rem;
}


/* 3. List */
/* ********************************************** */

ol {
  counter-reset: list;
  padding: 0;
  margin-bottom: 1.25rem;
  margin-left: 0;
}
ol li {
  list-style-type: none;
  counter-increment: list;
  position: relative;
}
ol li:before {
  color: var(--color-primary-blue);
  content: counter(list) ".";
  left: 0;
  position: absolute;
  text-align: right;
  width: 1.6em;
  font-weight: 600;
}
ul { margin-top: 0; margin-bottom: 1.25rem; }
ul>li, ol>li {
  padding: 0 0 1.25rem 2em;
}
ul>li>ul, ul>li>ol, 
ol>li>ul, ol>li>ol {
  margin: 0;
  padding-top: .3125rem;
}
ul>li>ul li, 
ul>li>ol li, 
ol>li>ul li, 
ol>li>ol li {
  padding-bottom: .3125rem;
}
ul>li:last-child, 
ol>li:last-child {
  padding-bottom: 0;
}

.custom-list ul {
  padding: 0;
}
.custom-list ul li {
  position: relative;
  list-style-type: none;
}
.custom-list ul > li:before {
  content: "";
  position: absolute;
  top: .21em;
  left: 0;
  speak: never;
  font-style: normal;
  font-weight: 400;
  font-size: 1.2em;
  width: 1.8em;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* List angle */
.custom-list.list-angle ul li:before,
.custom-list.sublist-angle ul > li > ul li:before {
  content: "\e90b";
  font-family: 'Prototypo'!important;
  font-size: .8em;
  width: 2em;
  font-weight: 700;
  text-align: center;
  top: 0.59em;
}
/* List arrow */
.custom-list.list-arrow ul li:before,
.custom-list.sublist-arrow ul > li > ul li:before{
  content: "\e90f";
  font-family: 'Prototypo'!important;
}
.custom-list.list-check ul li:before,
.custom-list.sublist-check ul > li > ul li:before{
  content: "\e91a";
  font-family: 'Prototypo'!important;
  font-size: 1em;
  top: 0.3em;
}
.custom-list.list-minus ul > li:before,
.custom-list.sublist-minus ul > li > ul li:before{
  content: "\2013";
  top: 2px;
  width: 1.6em;
  text-align: center;
  display: block;
}
.custom-list .list-heading {
  display: block;
  margin-bottom: 1.25rem;
}

/* 4. Links */

a.link-area {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
}
/* 
    CSS forms stylesheet

    Table of contents
    1. Inputs, textarea
      1.1 Custom date input icon
      1.2 Custom Checkboxes, radio buttons
    2. Form labels
    3. Fieldset 
    4. Legal consent
    5. Validation

*/



/* 1. Inputs */
/* ********************************************** */

input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="date"],
input[type="phone"],
input[type="tel"],
select,
textarea {
  width: 100%!important;
}
textarea {
  resize: none;
  min-height: 160px;
}

.hs-input.disabled {
  pointer-events: none; 
  cursor: default;
}

/* Select */
select {
  display: inline-block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: none;
  padding-right: 4.25rem;
  cursor: pointer;
}
.hs-fieldtype-select .input {
  position: relative;
}
.hs-fieldtype-select .input:before {
  content: "\e909";
  font-family: 'Prototypo'!important;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  position: absolute;
  right: 0;
  width: 4.25rem;
  pointer-events: none;
  z-index: 1;
  transform: translateY(-50%);
  top: 50%;
  padding-bottom: 1rem;
  font-size: 1.125rem;
  text-align: center;
}


/* 1.1 Custom date input icon */
/* ********************************************** */

.hs-dateinput {
  position: relative;
}
.hs-dateinput:before {
  content: "\e914";
  width: 3rem;
  font-size: 1.5625rem;
  pointer-events: none;
  color: inherit;
  font-family: 'Prototypo'!important;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  position: absolute;
  height: 100%;
  top: calc(50% + 1.25rem); right: 0;
  transform: translateY(-50%);
}
.hs-dateinput input[type="text"],
.hs-dateinput input[type="date"] {
  padding-right: 4.6875rem;
}
.hs-dateinput input[type="date"]::-webkit-inner-spin-button,
.hs-dateinput input[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}
.hs-dateinput input[type="date"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  text-align: left;
  min-height: 54px;
}


/* 1.2 Custom multi checkboxes and radio buttons */
/* ********************************************** */

.multistep-form form .inputs-list.multi-container {
  display: flex;
  margin-left: -0.5rem; margin-right: -0.5rem;
  flex-wrap: wrap;
}
.multistep-form form .inputs-list.multi-container li {
  width: 100%;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 1rem;
}
@media (min-width: 768px) {
  .multistep-form form .inputs-list.multi-container li {
    width: 50%;
  }
}
@media (min-width: 1024px) {
  .multistep-form form .inputs-list.multi-container li {
    width: 33.3%;
  }
}
.multistep-form form .inputs-list.multi-container li label {
  cursor: pointer;
  width: 100%; height: 100%;
  text-align: center;
  margin-bottom: 1rem;
  border: 2px solid #ABB5B5;
  background: #F6F6F6;
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-left: 0;
  position: relative;
  padding: 20px;
}
.multistep-form form .inputs-list.multi-container li label.is-checked,
.multistep-form form .inputs-list.multi-container li label:hover,
.multistep-form form .inputs-list.multi-container li label:focus {
  border-color: #003764;
}
.multistep-form .hs-fieldtype-booleancheckbox .inputs-list li label.is-checked,
.multistep-form form .inputs-list li label.is-checked {
  background: #003764;
  color: #fff;
}
.multistep-form form .inputs-list.multi-container li input[type="checkbox"],
.multistep-form form .inputs-list.multi-container li input[type="radio"]{
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100%; height: 100%;
  cursor: pointer;
  z-index: 1;
}
.multistep-form form .inputs-list.multi-container  li label img {
  max-width: 120px;
  max-height: 120px;
  width: 100%; height: 100%;
  margin-bottom: 1.25rem;
}
.multistep-form form .inputs-list.multi-container  li label > span {
  display: block;
  margin-bottom: 1.25rem;
  font-size: 1.25rem;
  font-weight: 700;
}


/* 1.3 Custom single checkbox */
/* ********************************************** */

.hs-form-booleancheckbox-display {
  margin: 0;
  cursor: pointer;
  font-size: 1rem;
  user-select: none;
  display: flex;
  gap: 8px;
}

#email-prefs-form .fakelabel {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

#email-prefs-form input[type="checkbox"],
.hs-form-booleancheckbox-display .hs-input[type="checkbox"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  display:inline-block;
  width: 1.25rem !important;
  height: 1.25rem !important;
  position:relative;
  top:0;
  border-radius: 4px;
  border: 1px solid #ABB5B5;
  background-color: #F6F6F6;
  cursor: pointer;
  vertical-align: middle;
}

#email-prefs-form input[type="checkbox"]:checked:after,
.hs-form-booleancheckbox-display input[type="checkbox"]:checked:after {
  border-radius: 4px;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#email-prefs-form input[type="checkbox"]:checked:before,
.hs-form-booleancheckbox-display input[type="checkbox"]:checked:before {
  content: "";
  position: absolute;
  width: 150%;
  height: 150%;
  top: -4px;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url('data:image/svg+xml;utf8,<svg fill="0A385E" viewBox="0 0 256 256" id="Flat" xmlns="http://www.w3.org/2000/svg" stroke="0A385E"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M103.99951,188.00012a3.98852,3.98852,0,0,1-2.82812-1.17139l-56-55.9956a3.99992,3.99992,0,0,1,5.65625-5.65723l53.17187,53.16748L213.17139,69.1759a3.99992,3.99992,0,0,1,5.65625,5.65723l-112,111.9956A3.98855,3.98855,0,0,1,103.99951,188.00012Z"></path> </g></svg>');
}

.hs-form-booleancheckbox-display > span {
  width: calc(100% - 1.5rem - 8px); /* minus checkbox size of 1.5rem and gap of 8px */
}

#globalunsub {
  margin-right: 0.5rem;
}

/* 2. Form labels */
/* ********************************************** */

form label {
  margin-bottom: 6px;
  margin-left: 1.5625rem;
}


/* 3. Form fieldset */
/* ********************************************** */

form fieldset {
  max-width: 100%!important;
}
form fieldset .hs-form-field:last-child .input {
  margin-right: 0!important;
}

@media (min-width: 768px) {
  form fieldset.form-columns-2 .hs-form-field .input,
  form fieldset.form-columns-3 .hs-form-field .input,
  form fieldset.form-columns-4 .hs-form-field .input,
  form fieldset.form-columns-5 .hs-form-field .input,
  form fieldset.form-columns-6 .hs-form-field .input {
    margin-right: 32px;
  }
}


/* 4. Inputs list */
/* ********************************************** */

.inputs-list {
  list-style: none;
  padding: 0;
  margin-top: 0;
}
.inputs-list li {
  padding: 0;
}


/* 5. Legal consent */
/* ********************************************** */

.hs-form .legal-consent-container {
  margin-bottom: 2rem;
}
.hs-form .legal-consent-container,
.hs-form .legal-consent-container .hs-form-booleancheckbox-display {
  font-size: 14px;
}
.hs-form .legal-consent-container .hs-form-booleancheckbox-display > span {
  display: inline-block;
  margin-left: 0!important;
}
.hs-form .legal-consent-container .field.hs-form-field {
  margin: 0.5rem 0;
}


/* 6. Validation */
/* ********************************************** */

.hs-form .hs-error-msg.hs-main-font-element {
  display: inline-block;
}
/* 
    CSS buttons stylesheet

    Table of contents
    1. Button

*/

.btn, .hs-button {
  text-decoration: none;
  display: inline-block;
  width: auto;
  border: none;
  text-align: center;
  cursor: pointer;
  min-width: 80px;
  outline: none;
  border-width: 1px;
  border-style: solid;
} 

/* button group */
.button-group .btn {
  margin-right: 1rem;
  margin-bottom: 1rem;
}
.button-group .button-icon-wrapper {
  margin-right: 1rem;
  margin-bottom: 1rem;
  display: inline-block;
}
.button-group .btn:last-child {
  margin: 0;
}
@media (min-width: 768px) {
  .button-group .btn {
    margin-right: 2rem;
  }
}

/* Button icon */
.btn.btn-icon {
  transition: none;
}
.btn-icon {
  position: relative;
  min-width: 0;
  padding: 0.387813rem 1.7083333333rem 0.387813rem 3.8125rem!important;
  border-radius: 50px;
  min-height: 2.5625rem;
  text-align: left;
}
.btn-icon .button-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 2.5625rem; min-height: 2.5625rem;
  border-radius: 50px;
  /* transform: translateY(-50%); */
  transition: width .4s;
  text-align: center;
  font-size: 1.5375rem;
  display: flex;
  align-items: center;
}
.link-area:hover ~ .button-wrapper .btn-icon .button-icon,
.btn-icon:hover .button-icon {
  width: 100%;
}
.btn-icon .button-icon:before {
  content: "";
  width: 12.3px;
  height: 12.3px;
  border-top: 2px solid;
  border-right: 2px solid;
  border-color: #fff;
  display: block;
  transform: rotate(45deg);
  margin: 0 auto;
  position: absolute;
  left: 12px;
  transition: all .4s;
}
@media (max-width: 767px) {
  .btn-icon .button-icon:before {
    left: 10px;
  }
}
.link-area:hover ~ .button-wrapper .btn-icon .button-icon:before,
.btn-icon:hover .button-icon:before {
  left: 1.845rem;
}
.btn-icon .button-icon:after {
  content: "";
  width: 18.45px;
  left: 5.7px;
  height: 2px;
  /* top: 19px; */
}
.link-area:hover ~ .button-wrapper .btn-icon .button-icon:after,
.btn-icon:hover .button-icon:after {
  background-color: #fff;
  position: absolute;
  left: 1.45rem;
  transition: all .4s;
}

.btn-icon .button-text {
  font-weight: 700;
  position: relative;
  z-index: 1;
  transition: color .4s;
}

/*  Button link */
.btn-link {
  background: transparent;
  border: none;
  padding-left: 0!important; padding-right: 0!important;
  font-weight: 600;
  display: flex;
  align-items: center;
}
.btn-link .link-icon {
  margin-left: 15px;
  font-size: 1.5625rem;
}
/* 
    CSS sliders stylesheet

    Table of contents
    1. Arrows (Left / Right controls )
    2. Dots (Pagination)
    3. Splide slides

*/



/* 1. Arrows (Left / Right controls ) */
/* ********************************************** */

.splide .splide__arrow {
  background: transparent;
  border: none;
  cursor: pointer;
  width: 4.25rem; height: 4.25rem;
  font-size: 3.1875rem;
  transition: all .3s;
}
.splide.has-pagination .splide__arrow {
  top: calc(50% - 1.5rem);
  opacity: 1;
}
.splide.has-pagination .splide__arrow:hover,
.splide.has-pagination .splide__arrow:focus {
  opacity: .7;
}
.splide .splide__arrow:disabled {
  opacity: 0;
  visibility: hidden;
}
.splide .splide__arrow:before {
  font-family: 'Prototypo'!important;
  speak: never;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  color: #697575;
}
.splide .splide__arrow.splide__arrow--prev {
  left: -6rem;
}
.splide .splide__arrow.splide__arrow--next {
  right: -6rem;
}
.splide .splide__arrow.splide__arrow--prev:before {
  content: "\e90a";
}
.splide .splide__arrow.splide__arrow--next:before {
  content: "\e90b";
}
.splide .splide__arrow svg {
  display: none;
}


/* 2. Dots (Pagination) */
/* ********************************************** */

.splide.has-pagination {
  padding-bottom: 3rem;
}
.splide .splide__pagination {
  bottom: 0;
}
.splide .splide__pagination ul li {
  padding: 0;
}
.splide__pagination .splide__pagination__page {
  cursor: pointer;
  width: 1rem; height: 1rem;
  background: #bcc4c4;
  transition: background .2s;
  border: none;
  margin: 0 .5rem; 
}
.splide__pagination .splide__pagination__page.is-active {
  background: #E54456;
  transform: none;
}


/* 3. Splide pagination */
/* ********************************************** */

.splide .splide__slide {
  padding: 0;
}
.splide__pagination li {
  padding: 0;
}
/* From Wave Background section */
/* ********************************************** */

.form-wave-background-section {
  position: relative;
}
.form-wave-background-section:before {
  content: "";
  background: url(https://content.css.de/hubfs/Website%202023/Images/Backgrounds/form_wave/bg-mobile.svg);
  position: absolute;
  background-size: cover;
  background-position: top left;
  background-repeat: repeat;
  z-index: -1;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100%; height: 100%;
}
@media (min-width: 768px) {
  .form-wave-background-section:before {
    background: url(https://content.css.de/hubfs/Website%202023/Images/Backgrounds/form_wave/bg-desktop.svg);
    background-position: left;
    background-repeat: no-repeat;
    background-size: cover;
    width: 57%;
    top: 0; right: 0;
    bottom: 0;
    left: auto;
  }
}


/* Wave Top section */
/* ********************************************** */

.wave-top-section {
  position: relative;
  min-height: 500px;
  background: linear-gradient(to bottom,#f0f0f0 55%, #ffffff 70%)!important;
}
.wave-top-section .row-fluid .row-fluid-wrapper {
  position: relative;
  z-index: 1;
}
.wave-top-section .row-fluid .span12 .row-fluid-wrapper:first-child {
  position: static;
}
.wave-top-section .wave-wrapper {
  position: absolute; 
  top: 0; left: 0; right: 0;
}


/* Wave Bottom section */
/* ********************************************** */

.wave-bottom-section {
  position: relative;
  min-height: 500px;
  background: linear-gradient(to top,#f0f0f0 60%, #ffffff 95%);
}
.wave-bottom-section .row-fluid .row-fluid-wrapper {
  position: relative;
  z-index: 1;
}
.wave-bottom-section .row-fluid .span12 .row-fluid-wrapper:first-child {
  position: static;
}
.wave-bottom-section .wave-wrapper {
  position: absolute; 
  top: auto; bottom: 0; left: 0; right: 0;
}



@media(min-width: 767px) and (max-width: 1024px) {
  .cards-social-section .row-fluid .row-fluid-wrapper > .row-fluid {
    flex-wrap: wrap;
  }
  .cards-social-section .span8,
  .cards-social-section .span4 {
    width: 100%!important;
  }
}
/* Search (Search Icon) */
/* ********************************************** */

.site-search .search-trigger {
  background: transparent;
  border: none;
  text-align: center;
  cursor: pointer;
}


/* Search (Search Header box) */
/* ********************************************** */

.header-wrapper .site-search .hs-search-field {
  padding: 1rem;
  position: absolute;
  cursor: default;
  background: #fff;
  border: 1px solid #f6f6f6;
  z-index: 99;
  border-top: none;
  width: 100%;
  box-shadow: 0 3px 10px 0 rgba(0,0,0,.16);
  transform: translateY(15px);
  visibility: hidden;
  opacity: 0;
  transition: all .1s ease-in-out 0s;
  left: 0; right: 0;
  top: 100%;
  max-width: 1200px;
  margin-left: auto; margin-right: auto;
}

body.searchbar-open .header-wrapper .site-search .hs-search-field {
  transform: translateY(0px);
  visibility: visible;
  opacity: 1;
}
.site-search:not(.advanced-search) .hs-search-field__input {
  margin: 0!important;
}

.site-search .hs-search-field__bar form {
  position: relative;
}
.site-search .search-btn {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  cursor: pointer;
}
.site-search i {
  font-size: 1.125rem;
}
.site-search .search-btn i {
  font-weight: 400;
  font-size: 1.328125rem;
}
.hs-search-field {
  position: relative;
}
.hs-search-field__input {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
}
.hs-search-field__bar button svg {
  height: 10px;
}
.hs-search-field__suggestions {
  margin: 0;
  padding: 0;
  list-style: none;
}
.hs-search-field--open .hs-search-field__suggestions {
  border: 1px solid #000;
}
.hs-search-field__suggestions li {
  display: block;
  margin: 0;
  padding: 0;
}
.hs-search-field__suggestions #results-for {
  font-weight: bold;
}
.hs-search-field__suggestions a,
.hs-search-field__suggestions #results-for {
  display: block;
}
.hs-search-field__suggestions a:hover,
.hs-search-field__suggestions a:focus {
  background-color: rgba(0, 0, 0, 0.1);
  outline: none;
}

/* Search results */
.hs-search-results__pagination {
  margin-top: 1.25rem;
}
.hs-search-results__pagination .link-icon  {
  display: inline-block;
  vertical-align: middle;
}
.hs-search-results__pagination .hs-search-results__prev-page .link-icon {
  transform: rotate(180deg);
  vertical-align: middle;
  margin-right: 0.5rem;
}
.hs-search-results__pagination .hs-search-results__next-page .link-icon {
  margin-left: 0.5rem;
}
.hs-search-results__pagination .link-icon {
  display: inline-block;
  font-size: 1.5625rem;
}
.hs-search-results__pagination .pagination-label {
  font-weight: 600;
  font-size: 1rem;
  color: var(--color-body-font);
}
.hs-search-results__pagination .pagination-label:focus,
.hs-search-results__pagination .pagination-label:hover {
  color: var(--color-secondary-red);
}


/* Advanced Search */
/* ********************************************** */

.advanced-search .advanced-search-btn {
  height: 56px; width: 56px;
  border-radius: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  font-size: 1.125rem;
  cursor: pointer;
  transition: .2s all;
}


/* Advanced Search (Grid search) */
/* ********************************************** */

.advanced-search-wrapper {
  -webkit-box-shadow: var(--box-shadow);
  box-shadow: var(--box-shadow);
}
.advanced-search.grid-search .form-row {
  align-items: center;
}
@media (min-width: 1024px) {
  .advanced-search.grid-search .advanced-search-btn {
    margin-top: 2.25rem;
  }
}
.advanced-search input,
.advanced-search select {
  margin-bottom: 0!important;
}
.advanced-search .hs-fieldtype-select .input:before {
  transform: translateY(-28%);
}

/* Utilities */
/* 
    Versatile theme helper classes

    Table of contents 
    1. Colors 
    2. Alignment 
    3. Font weight
    4. Display helper classes
    5. Spacing classes (padding, margin)
    6. Screen reader

*/


/* 1. Colors */
/* ********************************************** */ 
  .bg-white {
    background-color: #FFFFFF!important;
  }
  .color-white {
    color: #FFFFFF!important;
  }
  .fill-white {
    fill: #FFFFFF!important;
  }
   
  .bg-black {
    background-color: #000000!important;
  }
  .color-black {
    color: #000000!important;
  }
  .fill-black {
    fill: #000000!important;
  }
   
  .bg-primary-green {
    background-color: #82BC00!important;
  }
  .color-primary-green {
    color: #82BC00!important;
  }
  .fill-primary-green {
    fill: #82BC00!important;
  }
   
  .bg-secondary-red {
    background-color: #E54456!important;
  }
  .color-secondary-red {
    color: #E54456!important;
  }
  .fill-secondary-red {
    fill: #E54456!important;
  }
   
  .bg-primary-blue {
    background-color: #003764!important;
  }
  .color-primary-blue {
    color: #003764!important;
  }
  .fill-primary-blue {
    fill: #003764!important;
  }
   
  .bg-secondary-petrol {
    background-color: #19837B!important;
  }
  .color-secondary-petrol {
    color: #19837B!important;
  }
  .fill-secondary-petrol {
    fill: #19837B!important;
  }
   
  .bg-light-grey {
    background-color: #F2F3F4!important;
  }
  .color-light-grey {
    color: #F2F3F4!important;
  }
  .fill-light-grey {
    fill: #F2F3F4!important;
  }
   
  .bg-dark-grey {
    background-color: #5C6670!important;
  }
  .color-dark-grey {
    color: #5C6670!important;
  }
  .fill-dark-grey {
    fill: #5C6670!important;
  }
   
  .bg-grey {
    background-color: #C3C6C8!important;
  }
  .color-grey {
    color: #C3C6C8!important;
  }
  .fill-grey {
    fill: #C3C6C8!important;
  }
   
  .bg-negative {
    background-color: #ff0000!important;
  }
  .color-negative {
    color: #ff0000!important;
  }
  .fill-negative {
    fill: #ff0000!important;
  }
   
  .bg-success {
    background-color: #28a745!important;
  }
  .color-success {
    color: #28a745!important;
  }
  .fill-success {
    fill: #28a745!important;
  }
   
  .bg-warning {
    background-color: #ffc107!important;
  }
  .color-warning {
    color: #ffc107!important;
  }
  .fill-warning {
    fill: #ffc107!important;
  }
   
  .bg-info {
    background-color: #17a2b8!important;
  }
  .color-info {
    color: #17a2b8!important;
  }
  .fill-info {
    fill: #17a2b8!important;
  }
  /* CSS Color variables */
:root { 
      --color-white: #FFFFFF;
     
      --color-black: #000000;
     
      --color-primary-green: #82BC00;
     
      --color-secondary-red: #E54456;
     
      --color-primary-blue: #003764;
     
      --color-secondary-petrol: #19837B;
     
      --color-light-grey: #F2F3F4;
     
      --color-dark-grey: #5C6670;
     
      --color-grey: #C3C6C8;
     
      --color-negative: #ff0000;
     
      --color-success: #28a745;
     
      --color-warning: #ffc107;
     
      --color-info: #17a2b8;
    --color-grey-primary: #F6F6F6;
  --color-body-font: #697575;
  --box-shadow: 0 3px 10px 0 rgba(0,0,0,.16);
}


/* 2. Alignment */
/* ********************************************** */

.text-left,
.align-left {
    text-align: left; 
}
.text-center,
.align-center {
    text-align: center;
}
.text-right,
.align-right {
    text-align: right;
}

.text-sm-left,
.align-sm-left {
  text-align: left;
}
.text-sm-center,
.align-sm-center {
  text-align: center;
}
.text-sm-right,
.align-sm-right {
  text-align: right;
}
@media (min-width: 768px) {
   .text-md-left,
   .align-md-left {
       text-align: left;
    }
   .text-md-center,
   .align-md-center {
       text-align: center;
    }
   .text-md-right,
   .align-md-right {
       text-align: right;
   }
}
@media (min-width: 1024px) {
   .text-lg-left,
   .align-lg-left {
       text-align: left;
    }
   .text-lg-center,
   .align-lg-center {
       text-align: center;
    }
   .text-lg-right,
   .align-lg-right {
       text-align: right;
   }
}


/* 3. Font weight / style */
/* ********************************************** */

.font-thin {
    font-weight: 100!important;
}
.font-extralight {
    font-weight: 200!important;
}
.font-light {
    font-weight: 300!important;
}
.font-normal,
.font-regular {
    font-weight: 400!important;
}
.font-medium {
    font-weight: 500!important;
}
.font-semibold {
    font-weight: 600!important;
}
.font-bold {
    font-weight: 700!important;
}
.font-extrabold {
    font-weight: 800!important;
}
.font-black {
    font-weight: 900!important;
}
.font-style-normal {
  font-style: normal;
}
.font-style-italic {
  font-style: italic;
}


/* 4. Display helper classes */
/* ********************************************** */

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-block {
    display: block !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-row {
    display: table-row !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
  .d-sm-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-sm-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
  .d-md-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-md-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 1024px) {
  .d-lg-none {
    display: none !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-block {
    display: block !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-row {
    display: table-row !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
  .d-lg-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-lg-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}


/* 5. Spacing classes (padding, margin) */
/* ********************************************** */


/* margins - size 0px */
.mt-0 {
  margin-top: 0px!important;
}
.mb-0 {
  margin-bottom: 0px!important;
}
.ml-0 {
  margin-left: 0px!important;
}
.mr-0 {
  margin-right: 0px!important;
}

/* margins - size 16px */
.mt-1 {
  margin-top: 16px!important;
}
.mb-1 {
  margin-bottom: 16px!important;
}
.ml-1 {
  margin-left: 16px!important;
}
.mr-1 {
  margin-right: 16px!important;
}

/* margins - size 32px */
.mt-2 {
  margin-top: 32px!important;
}
.mb-2 {
  margin-bottom: 32px!important;
}
.ml-2 {
  margin-left: 32px!important;
}
.mr-2 {
  margin-right: 32px!important;
}

/* margins - size 48px */
.mt-3 {
  margin-top: 48px!important;
}
.mb-3 {
  margin-bottom: 48px!important;
}
.ml-3 {
  margin-left: 48px!important;
}
.mr-3 {
  margin-right: 48px!important;
}

/* margins - size 64px */
.mt-4 {
  margin-top: 64px!important;
}
.mb-4 {
  margin-bottom: 64px!important;
}
.ml-4 {
  margin-left: 64px!important;
}
.mr-4 {
  margin-right: 64px!important;
}

/* margins - size 80px */
.mt-5 {
  margin-top: 80px!important;
}
.mb-5 {
  margin-bottom: 80px!important;
}
.ml-5 {
  margin-left: 80px!important;
}
.mr-5 {
  margin-right: 80px!important;
}

/* margins - size 96px */
.mt-6 {
  margin-top: 96px!important;
}
.mb-6 {
  margin-bottom: 96px!important;
}
.ml-6 {
  margin-left: 96px!important;
}
.mr-6 {
  margin-right: 96px!important;
}



/* paddings - size 0px */
.pt-0 {
  padding-top: 0px!important;
}
.pb-0 {
  padding-bottom: 0px!important;
}
.pl-0 {
  padding-left: 0px!important;
}
.pr-0 {
  padding-right: 0px!important; 
}

/* paddings - size 16px */
.pt-1 {
  padding-top: 16px!important;
}
.pb-1 {
  padding-bottom: 16px!important;
}
.pl-1 {
  padding-left: 16px!important;
}
.pr-1 {
  padding-right: 16px!important; 
}

/* paddings - size 32px */
.pt-2 {
  padding-top: 32px!important;
}
.pb-2 {
  padding-bottom: 32px!important;
}
.pl-2 {
  padding-left: 32px!important;
}
.pr-2 {
  padding-right: 32px!important; 
}

/* paddings - size 48px */
.pt-3 {
  padding-top: 48px!important;
}
.pb-3 {
  padding-bottom: 48px!important;
}
.pl-3 {
  padding-left: 48px!important;
}
.pr-3 {
  padding-right: 48px!important; 
}

/* paddings - size 64px */
.pt-4 {
  padding-top: 64px!important;
}
.pb-4 {
  padding-bottom: 64px!important;
}
.pl-4 {
  padding-left: 64px!important;
}
.pr-4 {
  padding-right: 64px!important; 
}

/* paddings - size 80px */
.pt-5 {
  padding-top: 80px!important;
}
.pb-5 {
  padding-bottom: 80px!important;
}
.pl-5 {
  padding-left: 80px!important;
}
.pr-5 {
  padding-right: 80px!important; 
}

/* paddings - size 96px */
.pt-6 {
  padding-top: 96px!important;
}
.pb-6 {
  padding-bottom: 96px!important;
}
.pl-6 {
  padding-left: 96px!important;
}
.pr-6 {
  padding-right: 96px!important; 
}


/* mobile spacing */

  /* margins - size 0px */
  .mt-0,
  .mt-sm-0 {
    margin-top: 0px!important;
  }
  .mb-0,
  .mb-sm-0 {
    margin-bottom: 0px!important;
  }
  .ml-0,
  .ml-sm-0 {
    margin-left: 0px!important;
  }
  .mr-0,
  .mr-sm-0 {
    margin-right: 0px!important;
  }
  
  /* margins - size 16px */
  .mt-1,
  .mt-sm-1 {
    margin-top: 16px!important;
  }
  .mb-1,
  .mb-sm-1 {
    margin-bottom: 16px!important;
  }
  .ml-1,
  .ml-sm-1 {
    margin-left: 16px!important;
  }
  .mr-1,
  .mr-sm-1 {
    margin-right: 16px!important;
  }
  
  /* margins - size 32px */
  .mt-2,
  .mt-sm-2 {
    margin-top: 32px!important;
  }
  .mb-2,
  .mb-sm-2 {
    margin-bottom: 32px!important;
  }
  .ml-2,
  .ml-sm-2 {
    margin-left: 32px!important;
  }
  .mr-2,
  .mr-sm-2 {
    margin-right: 32px!important;
  }
  
  /* margins - size 48px */
  .mt-3,
  .mt-sm-3 {
    margin-top: 48px!important;
  }
  .mb-3,
  .mb-sm-3 {
    margin-bottom: 48px!important;
  }
  .ml-3,
  .ml-sm-3 {
    margin-left: 48px!important;
  }
  .mr-3,
  .mr-sm-3 {
    margin-right: 48px!important;
  }
  
  /* margins - size 64px */
  .mt-4,
  .mt-sm-4 {
    margin-top: 64px!important;
  }
  .mb-4,
  .mb-sm-4 {
    margin-bottom: 64px!important;
  }
  .ml-4,
  .ml-sm-4 {
    margin-left: 64px!important;
  }
  .mr-4,
  .mr-sm-4 {
    margin-right: 64px!important;
  }
  
  /* margins - size 80px */
  .mt-5,
  .mt-sm-5 {
    margin-top: 80px!important;
  }
  .mb-5,
  .mb-sm-5 {
    margin-bottom: 80px!important;
  }
  .ml-5,
  .ml-sm-5 {
    margin-left: 80px!important;
  }
  .mr-5,
  .mr-sm-5 {
    margin-right: 80px!important;
  }
  
  /* margins - size 96px */
  .mt-6,
  .mt-sm-6 {
    margin-top: 96px!important;
  }
  .mb-6,
  .mb-sm-6 {
    margin-bottom: 96px!important;
  }
  .ml-6,
  .ml-sm-6 {
    margin-left: 96px!important;
  }
  .mr-6,
  .mr-sm-6 {
    margin-right: 96px!important;
  }
  
  
  /* paddings - size 0px */
  .pt-sm-0 {
    padding-top: 0px!important;
  }
  .pb-sm-0 {
    padding-bottom: 0px!important;
  }
  .pl-sm-0 {
    padding-left: 0px!important;
  }
  .pr-sm-0 {
    padding-right: 0px!important;
  }

  /* paddings - size 16px */
  .pt-sm-1 {
    padding-top: 16px!important;
  }
  .pb-sm-1 {
    padding-bottom: 16px!important;
  }
  .pl-sm-1 {
    padding-left: 16px!important;
  }
  .pr-sm-1 {
    padding-right: 16px!important;
  }

  /* paddings - size 32px */
  .pt-sm-2 {
    padding-top: 32px!important;
  }
  .pb-sm-2 {
    padding-bottom: 32px!important;
  }
  .pl-sm-2 {
    padding-left: 32px!important;
  }
  .pr-sm-2 {
    padding-right: 32px!important;
  }

  /* paddings - size 48px */
  .pt-sm-3 {
    padding-top: 48px!important;
  }
  .pb-sm-3 {
    padding-bottom: 48px!important;
  }
  .pl-sm-3 {
    padding-left: 48px!important;
  }
  .pr-sm-3 {
    padding-right: 48px!important;
  }

  /* paddings - size 64px */
  .pt-sm-4 {
    padding-top: 64px!important;
  }
  .pb-sm-4 {
    padding-bottom: 64px!important;
  }
  .pl-sm-4 {
    padding-left: 64px!important;
  }
  .pr-sm-4 {
    padding-right: 64px!important;
  }

  /* paddings - size 80px */
  .pt-sm-5 {
    padding-top: 80px!important;
  }
  .pb-sm-5 {
    padding-bottom: 80px!important;
  }
  .pl-sm-5 {
    padding-left: 80px!important;
  }
  .pr-sm-5 {
    padding-right: 80px!important;
  }

  /* paddings - size 96px */
  .pt-sm-6 {
    padding-top: 96px!important;
  }
  .pb-sm-6 {
    padding-bottom: 96px!important;
  }
  .pl-sm-6 {
    padding-left: 96px!important;
  }
  .pr-sm-6 {
    padding-right: 96px!important;
  }



/* tablet spacing */
@media (min-width: 768px){
  
  /* margins - size 0px */
  .mt-md-0 {
    margin-top: 0px!important;
  }
  .mb-md-0 {
    margin-bottom: 0px!important;
  }
  .ml-md-0 {
    margin-left: 0px!important;
  }
  .mr-md-0 {
    margin-right: 0px!important;
  }
  
  /* margins - size 16px */
  .mt-md-1 {
    margin-top: 16px!important;
  }
  .mb-md-1 {
    margin-bottom: 16px!important;
  }
  .ml-md-1 {
    margin-left: 16px!important;
  }
  .mr-md-1 {
    margin-right: 16px!important;
  }
  
  /* margins - size 32px */
  .mt-md-2 {
    margin-top: 32px!important;
  }
  .mb-md-2 {
    margin-bottom: 32px!important;
  }
  .ml-md-2 {
    margin-left: 32px!important;
  }
  .mr-md-2 {
    margin-right: 32px!important;
  }
  
  /* margins - size 48px */
  .mt-md-3 {
    margin-top: 48px!important;
  }
  .mb-md-3 {
    margin-bottom: 48px!important;
  }
  .ml-md-3 {
    margin-left: 48px!important;
  }
  .mr-md-3 {
    margin-right: 48px!important;
  }
  
  /* margins - size 64px */
  .mt-md-4 {
    margin-top: 64px!important;
  }
  .mb-md-4 {
    margin-bottom: 64px!important;
  }
  .ml-md-4 {
    margin-left: 64px!important;
  }
  .mr-md-4 {
    margin-right: 64px!important;
  }
  
  /* margins - size 80px */
  .mt-md-5 {
    margin-top: 80px!important;
  }
  .mb-md-5 {
    margin-bottom: 80px!important;
  }
  .ml-md-5 {
    margin-left: 80px!important;
  }
  .mr-md-5 {
    margin-right: 80px!important;
  }
  
  /* margins - size 96px */
  .mt-md-6 {
    margin-top: 96px!important;
  }
  .mb-md-6 {
    margin-bottom: 96px!important;
  }
  .ml-md-6 {
    margin-left: 96px!important;
  }
  .mr-md-6 {
    margin-right: 96px!important;
  }
  
  
  /* paddings - size 0px */
  .pt-md-0 {
    padding-top: 0px!important;
  }
  .pb-md-0 {
    padding-bottom: 0px!important;
  }
  .pl-md-0 {
    padding-left: 0px!important;
  }
  .pr-md-0 {
    padding-right: 0px!important;
  }
  
  /* paddings - size 16px */
  .pt-md-1 {
    padding-top: 16px!important;
  }
  .pb-md-1 {
    padding-bottom: 16px!important;
  }
  .pl-md-1 {
    padding-left: 16px!important;
  }
  .pr-md-1 {
    padding-right: 16px!important;
  }
  
  /* paddings - size 32px */
  .pt-md-2 {
    padding-top: 32px!important;
  }
  .pb-md-2 {
    padding-bottom: 32px!important;
  }
  .pl-md-2 {
    padding-left: 32px!important;
  }
  .pr-md-2 {
    padding-right: 32px!important;
  }
  
  /* paddings - size 48px */
  .pt-md-3 {
    padding-top: 48px!important;
  }
  .pb-md-3 {
    padding-bottom: 48px!important;
  }
  .pl-md-3 {
    padding-left: 48px!important;
  }
  .pr-md-3 {
    padding-right: 48px!important;
  }
  
  /* paddings - size 64px */
  .pt-md-4 {
    padding-top: 64px!important;
  }
  .pb-md-4 {
    padding-bottom: 64px!important;
  }
  .pl-md-4 {
    padding-left: 64px!important;
  }
  .pr-md-4 {
    padding-right: 64px!important;
  }
  
  /* paddings - size 80px */
  .pt-md-5 {
    padding-top: 80px!important;
  }
  .pb-md-5 {
    padding-bottom: 80px!important;
  }
  .pl-md-5 {
    padding-left: 80px!important;
  }
  .pr-md-5 {
    padding-right: 80px!important;
  }
  
  /* paddings - size 96px */
  .pt-md-6 {
    padding-top: 96px!important;
  }
  .pb-md-6 {
    padding-bottom: 96px!important;
  }
  .pl-md-6 {
    padding-left: 96px!important;
  }
  .pr-md-6 {
    padding-right: 96px!important;
  }
  
}

/* desktop spacing */
@media (min-width: 1024px){
  
  /* margins - size 0px */
  .mt-lg-0 {
    margin-top: 0px!important;
  }
  .mb-lg-0 {
    margin-bottom: 0px!important;
  }
  .ml-lg-0 {
    margin-left: 0px!important;
  }
  .mr-lg-0 {
    margin-right: 0px!important;
  }
  
  /* margins - size 16px */
  .mt-lg-1 {
    margin-top: 16px!important;
  }
  .mb-lg-1 {
    margin-bottom: 16px!important;
  }
  .ml-lg-1 {
    margin-left: 16px!important;
  }
  .mr-lg-1 {
    margin-right: 16px!important;
  }
  
  /* margins - size 32px */
  .mt-lg-2 {
    margin-top: 32px!important;
  }
  .mb-lg-2 {
    margin-bottom: 32px!important;
  }
  .ml-lg-2 {
    margin-left: 32px!important;
  }
  .mr-lg-2 {
    margin-right: 32px!important;
  }
  
  /* margins - size 48px */
  .mt-lg-3 {
    margin-top: 48px!important;
  }
  .mb-lg-3 {
    margin-bottom: 48px!important;
  }
  .ml-lg-3 {
    margin-left: 48px!important;
  }
  .mr-lg-3 {
    margin-right: 48px!important;
  }
  
  /* margins - size 64px */
  .mt-lg-4 {
    margin-top: 64px!important;
  }
  .mb-lg-4 {
    margin-bottom: 64px!important;
  }
  .ml-lg-4 {
    margin-left: 64px!important;
  }
  .mr-lg-4 {
    margin-right: 64px!important;
  }
  
  /* margins - size 80px */
  .mt-lg-5 {
    margin-top: 80px!important;
  }
  .mb-lg-5 {
    margin-bottom: 80px!important;
  }
  .ml-lg-5 {
    margin-left: 80px!important;
  }
  .mr-lg-5 {
    margin-right: 80px!important;
  }
  
  /* margins - size 96px */
  .mt-lg-6 {
    margin-top: 96px!important;
  }
  .mb-lg-6 {
    margin-bottom: 96px!important;
  }
  .ml-lg-6 {
    margin-left: 96px!important;
  }
  .mr-lg-6 {
    margin-right: 96px!important;
  }
  
  
  /* paddings - size 0px */
  .pt-lg-0 {
    padding-top: 0px!important;
  }
  .pb-lg-0 {
    padding-bottom: 0px!important;
  }
  .pl-lg-0 {
    padding-left: 0px!important;
  }
  .pr-lg-0 {
    padding-right: 0px!important;
  }
  
  /* paddings - size 16px */
  .pt-lg-1 {
    padding-top: 16px!important;
  }
  .pb-lg-1 {
    padding-bottom: 16px!important;
  }
  .pl-lg-1 {
    padding-left: 16px!important;
  }
  .pr-lg-1 {
    padding-right: 16px!important;
  }
  
  /* paddings - size 32px */
  .pt-lg-2 {
    padding-top: 32px!important;
  }
  .pb-lg-2 {
    padding-bottom: 32px!important;
  }
  .pl-lg-2 {
    padding-left: 32px!important;
  }
  .pr-lg-2 {
    padding-right: 32px!important;
  }
  
  /* paddings - size 48px */
  .pt-lg-3 {
    padding-top: 48px!important;
  }
  .pb-lg-3 {
    padding-bottom: 48px!important;
  }
  .pl-lg-3 {
    padding-left: 48px!important;
  }
  .pr-lg-3 {
    padding-right: 48px!important;
  }
  
  /* paddings - size 64px */
  .pt-lg-4 {
    padding-top: 64px!important;
  }
  .pb-lg-4 {
    padding-bottom: 64px!important;
  }
  .pl-lg-4 {
    padding-left: 64px!important;
  }
  .pr-lg-4 {
    padding-right: 64px!important;
  }
  
  /* paddings - size 80px */
  .pt-lg-5 {
    padding-top: 80px!important;
  }
  .pb-lg-5 {
    padding-bottom: 80px!important;
  }
  .pl-lg-5 {
    padding-left: 80px!important;
  }
  .pr-lg-5 {
    padding-right: 80px!important;
  }
  
  /* paddings - size 96px */
  .pt-lg-6 {
    padding-top: 96px!important;
  }
  .pb-lg-6 {
    padding-bottom: 96px!important;
  }
  .pl-lg-6 {
    padding-left: 96px!important;
  }
  .pr-lg-6 {
    padding-right: 96px!important;
  }
  
}

.justify-content-left {
  justify-content: flex-start;
}
.justify-content-center {
  justify-content: center;
}
.justify-content-right {
  justify-content: flex-end;
}
.align-items-left {
  align-items: flex-start;
}
.align-items-center {
  align-items: center;
}
.align-items-right {
  align-items: flex-end;
}

/* 5. Screen reader */
/* ********************************************** */

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


.text-uppercase {
  text-transform: uppercase;
}
.text-lowercase {
  text-transform: lowercase;
}

/* Layout */
/* 
    Versatile bootstrap based grid

    Table of contents 
    1. Row
    2. Columns 

*/


/* 1. Row */
/* ********************************************** */

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -16px;
    margin-right: -16px;
}

/* No gutters */
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}


/* 2. Columns */
/* ********************************************** */

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding: 16px;
}

.col {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}
.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.col-1 {
  -ms-flex: 0 0 8.333333%;
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.col-2 {
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-3 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.col-5 {
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.col-6 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  -ms-flex: 0 0 58.333333%;
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}

.col-8 {
  -ms-flex: 0 0 66.666667%;
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}

.col-9 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  -ms-flex: 0 0 83.333333%;
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}

.col-11 {
  -ms-flex: 0 0 91.666667%;
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}

.col-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

/* Grid (Small)*/
@media (min-width: 576px) {
  .col-sm {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-sm-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-sm-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-sm-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-sm-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-sm-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-sm-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-sm-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-sm-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-sm-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-sm-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-sm-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-sm-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-sm-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Grid (Medium) */
@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-md-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-md-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-md-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-md-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-md-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-md-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-md-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-md-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-md-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-md-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-md-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-md-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-md-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Grid (Large) */
@media (min-width: 1024px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-lg-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-lg-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-lg-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-lg-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-lg-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-lg-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-lg-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-lg-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-lg-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-lg-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-lg-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-lg-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-lg-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}
/* CSS variables */
    
:root {
    --column-gap: 2.13%;
    --column-width-multiplier: 8.333;
}

/* Column Grid Spacing */
.row-fluid-wrapper.dnd-section > .row-fluid > .dnd-module,
.row-fluid .dnd-column {
  padding: 0 16px;
}

/* Full width section spacing */
.row-fluid-wrapper.dnd-section[class*="force-full-width-section"] > .row-fluid > .dnd-module,
.row-fluid-wrapper.dnd-section[class*="force-full-width-section"] .dnd-column {
  padding: 0;
}

    
/* Mobile layout */
    
.row-fluid {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
    

    .row-fluid .span1,
    .row-fluid .span2,
    .row-fluid .span3,
    .row-fluid .span4,
    .row-fluid .span5,
    .row-fluid .span6,
    .row-fluid .span7,
    .row-fluid .span8,
    .row-fluid .span9,
    .row-fluid .span10,
    .row-fluid .span11,
    .row-fluid .span12{
      min-height: 1px;
      width: 100%;
}
    
/* Desktop layout */
    
@media (min-width: 768px) {
    .row-fluid {
        flex-wrap: nowrap;
        justify-content: space-between;
    }
    
    
        .row-fluid .span1 {
          width: calc(var(--column-width-multiplier) * 1% * 1 - var(--column-gap) * (11 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span2 {
          width: calc(var(--column-width-multiplier) * 1% * 2 - var(--column-gap) * (10 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span3 {
          width: calc(var(--column-width-multiplier) * 1% * 3 - var(--column-gap) * (9 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span4 {
          width: calc(var(--column-width-multiplier) * 1% * 4 - var(--column-gap) * (8 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span5 {
          width: calc(var(--column-width-multiplier) * 1% * 5 - var(--column-gap) * (7 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span6 {
          width: calc(var(--column-width-multiplier) * 1% * 6 - var(--column-gap) * (6 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span7 {
          width: calc(var(--column-width-multiplier) * 1% * 7 - var(--column-gap) * (5 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span8 {
          width: calc(var(--column-width-multiplier) * 1% * 8 - var(--column-gap) * (4 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span9 {
          width: calc(var(--column-width-multiplier) * 1% * 9 - var(--column-gap) * (3 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span10 {
          width: calc(var(--column-width-multiplier) * 1% * 10 - var(--column-gap) * (2 * var(--column-width-multiplier) / 100));
        }
    
        .row-fluid .span11 {
          width: calc(var(--column-width-multiplier) * 1% * 11 - var(--column-gap) * (1 * var(--column-width-multiplier) / 100));
        }
    
}