@import url(jquery-1.11.3-ui.css);
@import url(swipe.css);
@import url(mmenu.css);
@import url("https://use.typekit.net/fwz6cpu.css");
:root {
  --success: rgb(53, 124, 57);
  --alert: rgb(244, 203, 79);
  --warning: rgb(244, 134, 79);
  --danger: rgb(140, 38, 38);
  --dark: #1B1C1E;
  --medium: #54585A;
  --light: #F4F8FC;
  --main: #004C99;
  --second: #3BAE49;
  --green: #90C53D;
  --orange: #F4A737;
  --pink: #E56DB1;
  --purple: #8C4799;
  --blue: #4681C2;
  --navy: #071248;
  --mint: #6ECEB2;
  --sky: #B9E5FB;
  --font: 'canada-type-gibson', sans-serif;
  --animate: all 0.35s ease-in-out;
  --shadow: 0 0 2.4rem hsla(0 0% 0% / 0.16);
  --grid-gap: 1.6rem;
}

/* ---------- Table Of Contents ---------- */
/*
	0. Resets
	1. Generic Tags
  2. Fonts
  3. Structure
  4. Editable Content
  5. Desktop Header & Navigation
  6. Mobile Header & Navigation
  7. Footer
  8. Buttons
  9. Banner
  10. Inner Header
  11. Forms
  12. Messages
  13. Flex Column Structure
  14. Grid Column Structure
  15. Card & Box Base Styles 
  16. Base Strip Styles
  17. Animations
  18. Swipebox Styles
  19. Sub Page Menu
  20. Contact
  21. Contact Multi Location
  22. Map
  23. Social Media
  24. Toggler 
  25. Products
  26. Modal Styles
  27. FAQs
  28. Events
  29. Categories
  30. Pop Up
  31. Page Details
*/

/* ---------- 0. Resets ---------- */

/* ----- XHTML, HTML4, HTML5 Reset -----*/
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
dialog,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
font,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
meter,
nav,
object,
ol,
output,
p,
pre,
progress,
q,
rp,
rt,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video,
xmp {
  border: 0;
  margin: 0;
  padding: 0;
  font-size: 100%;
}
html,
body {
  height: 100%;
}
body {
  overflow-x: hidden !important;
  width: 100%;
}
#page{
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  /*
  Override the default (display: inline) for
  browsers that do not recognize HTML5 tags.

  IE8 (and lower) requires a shiv:
  http://ejohn.org/blog/html5-shiv
  */
  display: block;
}
b,
strong {
  /*
  Makes browsers agree.
  IE + Opera = font-weight: bold.
  Gecko + WebKit = font-weight: bolder.
  */
  font-weight: 500;
}
img {
  color: transparent;
  font-size: 0;
  vertical-align: middle;
  /*
  For IE.
  http://css-tricks.com/ie-fix-bicubic-scaling-for-images
  */
  -ms-interpolation-mode: bicubic;
}
li {
  /*
  For IE6 + IE7.
  */
  display: list-item;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
th,
td,
caption {
  font-weight: normal;
  vertical-align: top;
  text-align: left;
}
q {
  quotes: none;
}
q:before,
q:after {
  content: "";
  content: none;
}
sub,
sup,
small {
  font-size: 75%;
}
sub,
sup {
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
svg {
  /*
  For IE9.
  */
  overflow: hidden;
}
pre {
  white-space: pre-wrap;
  white-space: -moz-pre-wrap !important;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
  width: 100%;
}
input[name="middle_name"] {
  position: absolute;
  left: -9999px;
}
mark{
  background: var(--main);
  color: white;
}

/* ---------- 1. Generic Tags ---------- */

html {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 62.5%;
}
*,
*:before,
*:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}
::-moz-selection {
  background: hsla(0 0% 0% / 0.75);
  color: white;
}
::selection {
  background: hsla(0 0% 0% / 0.75);
  color: white;
}
body {
  color: var(--medium);
  font-size: 1.6rem;
  line-height: 1.4;
  font-weight: 400;
  font-optical-sizing: auto;
  font-style: normal;
  overflow-x: hidden;
  padding: 0;
  margin: 0;
  text-shadow: none;
  -webkit-text-size-adjust: none;
}
hr {
  clear: both;
  border-top: 2px solid hsla(0 0% 0% / 0.1);
  height: 1px;
  margin: 2.4rem 0;
}
a {
  color: var(--main);
}
a:hover {
  color: var(--second);
  text-decoration: none;
}
a[href^="x-apple-data-detectors:"] {
  color: inherit;
  text-decoration: inherit;
}
.clear {
  clear: both;
}

/* ---------- 2. Fonts ---------- */

body,
p,
ol li,
ul li,
pre,
input,
textarea,
select {
  font-size: 1.6rem;
  line-height: 1.4;
  font-weight: 300;
  font-family: var(--font);
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  color: var(--dark);
  margin: 0 0 3.2rem;
  line-height: 1.1;
}
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4{
  font-weight: 500;
}
h5, .h5,
h6, .h6 {
  color: var(--second);
  font-weight: 300;
  letter-spacing: .1em;
}
h1, .h1 {
  font-size: clamp(3.6rem, 4vw, 5.6rem);
}
h2, .h2 {
  font-size: clamp(3.2rem, 3.4vw, 4.8rem);
}
h3, .h3 {
  font-size: clamp(2.8rem, 2.9vw, 4rem);
}
h4, .h4 {
  font-size: clamp(2.4rem, 2.3vw, 3.2rem);
}
h5, .h5 {
  font-size: clamp(2rem, 1.7vw, 2.4rem);
}
h6, .h6 {
  font-size: clamp(1.8rem, 1.4vw, 2rem);
}
p {
  margin: 0 0 1.6rem;
}


/* ---------- 3. Structure ---------- */

.content_container {
  width: 100%;
  padding: 4.8rem 3.2rem;
  background: hsl(0 0% 100%);
}
.content {
  margin: 0 auto;
  max-width: 1264px;
  padding: 0;
}
/* ----- Content Widths ----- */
.xlarge-width {
  max-width: 1920px;
  margin: 0 auto;
}
.large-width {
  max-width: 1366px;
  margin: 0 auto;
}
.medium-width {
  max-width: 1024px;
  margin: 0 auto;
}
.small-width {
  max-width: 768px;
  margin: 0 auto;
}
.xsmall-width {
  max-width: 560px;
  margin: 0 auto;
}
@media (min-width: 960px) {
  .content_container {
    padding-block: 9.6rem;
  }
}
/* ----- Text Alignment ----- */
.center-text {
  text-align: center;
}
.center-list {
  justify-content: center;
}
/* ----- Strip Colours ----- */
/* ----- Grey Background ----- */
.light {
  background: var(--light);
}
/* ----- Dark / Colour Background ----- */
.dark {
  background: var(--dark);
}
.medium {
  background: var(--medium);
}
.colour {
  background: var(--main);
}
.dark :is(h1,.h1,h2,.h2,h3,.h3,h4,.h4,ul li,ol li,p,pre),
.medium :is(h1,.h1,h2,.h2,h3,.h3,h4,.h4,ul li,ol li,p,pre),
.colour :is(h1,.h1,h2,.h2,h3,.h3,h4,.h4,ul li,ol li,p,pre) {
  color: white;
}
.dark :is(h5,.h5,h6,.h6){
  color: var(--main);
}
.medium :is(h5,.h5,h6,.h6),
.colour :is(h5,.h5,h6,.h6){
  color: white;
}
.colour a,
.medium a,
.dark a {
  color: white;
}
.colour hr,
.medium hr,
.dark hr {
  border-color: hsla(0 0% 100% / 0.15);
}
.medium :is(input.superbutton, a.button, button.superbutton, a.superbutton, .superbutton),
.dark :is(input.superbutton, a.button, button.superbutton, a.superbutton, .superbutton),
.colour :is(input.superbutton, a.button, button.superbutton, a.superbutton, .superbutton) {
  background: var(--second);
  color: white;
}
.colour :is(input.superbutton:hover, a.button:hover, button.superbutton:hover, a.superbutton:hover, .superbutton:hover) {
  background: var(--orange);
  color: white;
}
.medium :is(input.superbutton:hover, a.button:hover, button.superbutton:hover, a.superbutton:hover, .superbutton:hover),
.dark :is(input.superbutton:hover, a.button:hover, button.superbutton:hover, a.superbutton:hover, .superbutton:hover) {
  background: var(--main);
  color: white;
}
.colour form label,
.medium form label,
.dark form label {
  color: white;
}
.colour form input,
.colour form select,
.colour form textarea,
.medium form input,
.medium form select,
.medium form textarea,
.dark form input,
.dark form select,
.dark form textarea {
  background: hsla(0 0% 100% / 0.1);
  border-color: white;
  color: white;
}
.light .editable_content table tr th, 
.light .editable_content table thead tr td{
  border-color: var(--light);
}
.light .editable_content table tbody tr td{
  border-color: var(--light);
  background: white;
}
.medium .editable_content table tr th, 
.medium .editable_content table thead tr td{
  border-color: var(--medium);
}
.medium .editable_content table tbody tr td{
  background: hsla(0 0% 100% / .1);
  border-color: var(--medium);
  color: white;
}
.dark .editable_content table tr th, 
.dark .editable_content table thead tr td{
  border-color: var(--dark);
}
.dark .editable_content table tbody tr td{
  background: hsla(0 0% 100% / .1);
  border-color: var(--dark);
  color: white;
}
.colour .editable_content table tr th, 
.colour .editable_content table thead tr td{
  border-color: var(--main);
  background: white;
  color: var(--dark);
}
.colour .editable_content table tbody tr td{
  background: hsla(0 0% 100% / .1);
  border-color: var(--main);
  color: white;
}
/* ----- Reduced Padding ----- */
.reduced-padding {
  padding: 4.8rem 3.2rem;
}
/* ----- Subtitle Spacing -----*/
.subtitle-top :is(h5, .h5, h6, .h6) {
  margin: 0;
}
.subtitle-bottom :is(h1, .h1, h2, .h2, h3, .h3, h4, .h4) {
  margin: 0;
}

/* ---------- 4. Editable Content ---------- */

.editable_content *:last-child {
  margin-bottom: 0;
}
.editable_content ul {
  list-style: disc outside none;
  margin: 0 0 1.6rem 2rem;
}
.editable_content ul li {
  padding: 0;
  margin: 0 0 .8rem;
}
.editable_content ol {
  list-style: decimal outside none;
  margin: 0 0 1.6rem 2rem;
}
.editable_content ol li {
  padding: 0;
  margin: 0 0 .8rem;
}
.editable_content figure{
  display: block;
}
.editable_content figure.float-left{
  float: left;
  margin: .8rem .8rem .8rem 0;
}
.editable_content figure.float-right{
  float: right;
  margin: .8rem 0 .8rem .8rem;
}
.editable_content figure.wrap-center{
  margin: .8rem auto;
}
.editable_content img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto !important;
}
.editable_content table {
  margin: 1.6rem 0;
  text-align: center;
  width: 100%;
  display: table;
}
.editable_content table tr th,
.editable_content table thead tr td {
  font-weight: bold;
  color: white;
  background: var(--main);
  padding: .8rem;
  border: 2px solid var(--main);
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}
.editable_content table tr td {
  border: 2px solid white;
  background: var(--light);
  padding: .8rem;
  font-size: 1.6rem;
}
@media screen and (max-width: 960px) {
  .editable_content figure {
    margin: .8rem 0;
  }
  .editable_content figure.float-left,
  .editable_content figure.float-right{
    float: none;
  }
  .editable_content figure.wrap-center{
    margin: .8rem auto;
  }
}

/* ---------- 5. Desktop Header & Navigation ---------- */

/* ----- Full Header ----- */
.full_header {
  display: none;
  width: 100%;
  z-index: 999;
  top: 31px;
  position: sticky;
  padding: 0 3.2rem;
  transition: var(--animate);
}
.full_header::before{
  content: '';
  width: 25%;
  height: 100%;
  background: white;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: var(--animate);
}
.full_header.header-bg{
  background: var(--main);
  box-shadow: var(--shadow);
}
.full_header.header-bg::before{
  opacity: 1;
}
.full_header.header-bg .jqueryslidemenu::after{
  opacity: 1;
}
.jqueryslidemenu {
  width: 100%;
  max-width: 1264px;
  padding: 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.full_header .jqueryslidemenu::before{
  content: '';
  width: 182px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  background: white;
  transition: var(--animate);
}
.full_header .jqueryslidemenu::after{
    content: '';
  background: url(/assets/images/layout/logo-cap.svg) right center no-repeat;
  background-size: cover;
  aspect-ratio: 1 / 1;
  position: absolute;
  top: 0;
  left: 180px;
  height: 100%;
  opacity: 0;
  transition: var(--animate);
}
.full_header.header-bg .jqueryslidemenu::before,
.full_header.header-bg .jqueryslidemenu::after{
  opacity: 1;
}
.jqueryslidemenu a.logo {
  width: 186px;
  display: block;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 2;
  transition: var(--animate);
}
.lg-logo{
  padding-top: 8px;
  transition: var(--animate);
}
.lg-logo .jqueryslidemenu a.logo{
  width: 280px;
}
.lg-logo.header-bg .jqueryslidemenu a.logo{
  width: 186px;
}
.lg-logo.header-bg{
  padding-top: 0;
}
.jqueryslidemenu a.logo svg {
  width: 100%;
  height: auto;
}
.jqueryslidemenu .hamburger-wrapper{
  width: 3.2rem;
  height: 2.3rem;
  position: relative;
}
.jqueryslidemenu .hamburger-wrapper span{
  width: 3.2rem;
  height: 3px;
  position: absolute;
  top: 0;
  left: 0;
  background: white;
}
.jqueryslidemenu .hamburger-wrapper span::before,
.jqueryslidemenu .hamburger-wrapper span::after{
  content: '';
  width: 3.2rem;
  height: 3px;
  position: absolute;
  top: 10px;
  left: 0;
  background: white;
}
.jqueryslidemenu .hamburger-wrapper span::after{
  top: 20px;
}
.jqueryslidemenu nav{
  width: calc(100% - 300px);
  display: flex;
  gap: 4.4rem;
  align-items: center;
  justify-content: flex-end;
}
.jqueryslidemenu ul {
  width: calc(100% - 7.6rem);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.jqueryslidemenu ul li {
  position: relative;
  margin: 0;
}
.jqueryslidemenu ul li.mobile-item {
  display: none;
}
.jqueryslidemenu ul li a {
  width: 100%;
  padding: 26px 0;
  display: block;
  color: white;
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 500;
  text-decoration: none;
  position: relative;
}
.jqueryslidemenu ul li a:hover,
.jqueryslidemenu ul li:hover a,
.jqueryslidemenu ul li.Selected a,
.jqueryslidemenu ul li:has(ul li.Selected) a,
.jqueryslidemenu ul li.Selected a:hover {
  color: white;
}
.jqueryslidemenu ul li a::after {
  content: "";
  background: var(--second);
  width: 0;
  height: 3px;
  position: absolute;
  left: 50%;
  bottom: 1.6rem;
  transform: translate(-50%, 0);
  transition: var(--animate);
}
.jqueryslidemenu ul li a:hover::after,
.jqueryslidemenu ul li:hover a::after,
.jqueryslidemenu ul li.Selected a::after,
.jqueryslidemenu ul li:has(ul li.Selected) a::after,
.jqueryslidemenu ul li.Selected a:hover::after {
  width: 100%;
}
/* ----- FIRST DROP-DOWN LAYER ----- */
.jqueryslidemenu ul li ul {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  position: absolute;
  left: 0;
  display: block;
  visibility: hidden;
  width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: none;
  width: 256px;
  background: var(--main);
}
.jqueryslidemenu ul li ul li {
  display: list-item;
  float: none;
  border: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  margin: 0;
  padding: 0;
}
.jqueryslidemenu ul li ul li a {
  color: white;
  padding: 1.6rem;
  margin: 0;
  background: none;
}
.jqueryslidemenu ul li ul li a::after {
  display: none;
}
.jqueryslidemenu ul li:hover ul li a {
  color: white;
  padding: 1.6rem;
  margin: 0;
  background: none;
}
.jqueryslidemenu ul li.Selected ul li a:hover,
.jqueryslidemenu ul li ul li a:hover {
  color: white;
  text-decoration: none;
  background: hsla(0 0% 0% / 0.1);
}
/* ----- SUB DROP-DOWN LAYERS AFTER 1ST ----- */
.jqueryslidemenu ul li ul li ul {
  top: 0;
  margin: -1px 0px 0px 2px;
}
@media (min-width: 960px) {
  .full_header {
    display: inherit;
  }
}
/* ----- Cart Button ----- */
.jqueryslidemenu a.cart_button{
  position: absolute;
  bottom: -44px;
  right: 0;
  background: var(--main);
  color: white;
  padding: .8rem 1.6rem;
  border-radius: 0 0 .4rem .4rem;
  font-size: 2rem;
  text-decoration: none;
  transition: var(--animate);
}
.jqueryslidemenu a.cart_button:hover{
  background: var(--dark);
}
.jqueryslidemenu a.cart_button span{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-9px, calc(-50% + 3px));
  width: 18px;
  text-align: center;
  font-size: 1.2rem;
  line-height: 1;
  color: var(--main);
  background: white;
  transition: var(--animate);
}
.jqueryslidemenu a.cart_button:hover span{
  color: var(--dark);
}

/* ---------- 6. Mobile Header & Navigation ---------- */

.mobile_header {
  background: white;
  box-shadow: var(--shadow);
  padding: .8rem 0;
  width: 100%;
  z-index: 999;
  position: sticky;
  display: inherit;
  top: 0;
  border-bottom: 3px solid var(--main);
}
@media (min-width: 960px) {
  .mobile_header {
    display: none;
  }
}
.mobile_header .logo_area {
  padding: 0px 3rem;
  width: 100%;
}
.mobile_header .logo_area > a{
  width: 20rem;
  display: block;
  margin: 0 auto;
}
.mobile_header .logo_area img {
  width: 100%;
  height: auto;
}
.mobile_header a.menu-btn,
.mobile_header a.cart_link {
  color: var(--dark);
  left: .8rem;
  position: absolute;
  text-decoration: none;
  top: 50%;
  transform: translate(0 , -50%);
  font-size: 2.4rem;
}
.mobile_header a.cart_link {
  left: auto;
  right: .8rem;
}
#menu .mm-list a {
  color: #fff;
  padding: 1.6rem;
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 500;
  text-decoration: none;
  display: block;
  text-transform: none;
}
.mm-ismenu {
  background: var(--main);
}
.mm-menu {
  color: hsl(0 0% 100%);
}
.mm-menu .mm-list > li:after {
  border-color: rgba(0, 0, 0, 0.15);
}
.mm-menu .mm-list > li > a.mm-subclose {
  background: rgba(0, 0, 0, 0.1);
  color: rgba(255, 255, 255, 0.3);
}
.mm-menu .mm-list > li > a.mm-subopen:after,
.mm-menu .mm-list > li > a.mm-subclose:before {
  border-color: #fff;
}
.mm-menu .mm-list > li > a.mm-subopen:before {
  border-color: rgba(0, 0, 0, 0.15);
}
.mm-menu .mm-list > li.mm-selected > a:not(.mm-subopen),
.mm-menu .mm-list > li.mm-selected > span {
  background: rgba(0, 0, 0, 0.1);
}
.mm-menu .mm-list li.mm-label {
  background: rgba(255, 255, 255, 0.05);
}
.mm-menu.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
.mm-menu.mm-vertical .mm-list li.mm-opened > ul {
  background: rgba(255, 255, 255, 0.05);
}

/* ---------- 7. Footer ---------- */

footer{
  background: var(--main);
  border-top: 2px solid hsla(0 0% 100% / .15);
  margin-top: auto;
  padding: 4.8rem 3.2rem 1.6rem;
}
footer .content{
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1.6rem 3.2rem;
}
footer a.logo{
  width: 16rem;
  display: block;
}
footer a.logo img{
  width: 100%;
  height: auto;
}
footer .h4{
  color: white;
  font-size: 1.8rem;
  line-height: 1;
  margin: 0 0 .8rem;
}
footer ul{
  list-style: none;
  margin: 0;
  padding: 0;
}
footer ul li,
footer ul li a{
  color: white;
  font-size: 1.4rem;
}
footer ul li a{
  text-decoration: none;
}
footer ul li a:hover{
  color: var(--orange);
}
footer .sitemap{
  width: calc(100% - 69.6rem);
}
footer .sitemap ul{
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.6rem;
}
footer .sitemap ul li{
  width: calc(33.3333% - (1.6rem * 2 / 3));
}
footer.landing-footer .content{
    justify-content: space-between;
}
footer .sitemap.footer-landing-nav{
  width: 16rem;
}
footer .sitemap footer-landing-nav ul{
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.6rem;
}
footer .sitemap.footer-landing-nav ul li{
  width: 100%;
}
footer .footer-contact{
  width: 26rem;
}
footer .footer-social{
  width: 18rem;
}
footer .social_media ul{
  gap: calc(var(--grid-gap) / 2);
  justify-content: flex-start;
}
footer .social_media ul li a{
  width: 2.8rem;
  height: 2.8rem;
}
footer .social_media ul li a{
  background: white;
  color: var(--main);
}
footer .social_media ul li a:hover{
  background: var(--orange);
  color: white;
}
footer .social_media ul li a i{
  font-size: 1.6rem;
}
footer p.signature{
  width: 100%;
  text-align: center;
  color: white;
  font-size: 1.2rem;
  line-height: 1.2;
  padding-top: 1.6rem;
  border-top: 2px solid hsla(0 0% 100% / .1);
  margin: 0;
}
footer p.signature a{
  color: white;
  text-decoration: none;
}
footer p.signature a:hover{
  color: var(--orange);
}
@media screen and (max-width: 960px){
  footer .content{
    flex-direction: column;
    align-items: center;
    gap: var(--grid-gap);
    text-align: center;
  }
  footer .footer-social,
  footer .footer-contact,
  footer .sitemap,
  footer .sitemap ul li{
    width: 100%;
  }
  footer .social_media ul{
    justify-content: center;
  }
}

/* ---------- 8. Buttons ---------- */

input.superbutton,
a.button,
button.superbutton,
a.superbutton,
.superbutton {
  background: var(--second);
  color: white;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 300;
  padding: 13px 4rem 11px;
  text-decoration: none;
  border-radius: 4rem;
  border: none;
  outline: none;
  font-size: 1.6rem;
  height: auto;
  cursor: pointer;
  margin: 3.2rem 0 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
  letter-spacing: .1em;
  text-align: center;
}
input.superbutton:hover,
a.button:hover,
button.superbutton:hover,
a.superbutton:hover,
.superbutton:hover {
  background: var(--main);
}
.text-link,
a.text-link{
  color: var(--dark);
  line-height: 1;
  text-transform: uppercase;
  font-weight: 500;
  text-decoration: none;
  letter-spacing: .05em;
  cursor: pointer;
  font-size: 1.6rem;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  transition: var(--animate);
}
.text-link:hover,
a.text-link:hover{
  color: var(--main);
}.text-link::before,
a.text-link::before{
  content: '';
  display: block;
  width: 2.4rem;
  height: .2rem;
  background: var(--dark);
  transition: var(--animate);
  margin-top: -1px;
}
.text-link:hover::before,
a.text-link:hover::before{
  width: 4rem;
  background: var(--main);
}

.editable_content input.superbutton,
.editable_content a.button,
.editable_content button.superbutton,
.editable_content a.superbutton,
.editable_content .superbutton{
  margin-top: 1.6rem;
}
/* ---------- 9. Banner Styles ---------- */

/* ----- Banner Structure ----- */
.banner-container-constrained {
  position: relative;
  height: calc(100svh - 10rem);
  background: var(--main);
  max-height: 85rem;
  overflow: hidden;
}
@media screen and (max-width: 960px){
  .banner-container-constrained {
    max-height: unset;
  } 
}
ul.ms-banner-constrained {
  display: inline-flex;
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
}
ul.ms-banner-constrained li {
  list-style: none;
  width: 100%;
  flex-shrink: 0;
  position: relative;
  opacity: 0;
}
.ms-banner-constrained li .img-wrapper{
  width: 70%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  overflow: hidden;
  /*aspect-ratio: 1018 / 768;*/
}
.ms-banner-constrained li .img-wrapper:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  background: linear-gradient(to bottom, hsla(0 0% 0% / .5), transparent);
}
.ms-banner-constrained li .img-wrapper img.img-mask{
  position: absolute;
  top: 0;
  left: -1px;
  width: auto;
  height: 100%;
  z-index: 1;
}
.ms-banner-constrained li .img-wrapper img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
/* ----- Banner Content ----- */
.ms-banner-constrained li .banner-details {
  position: absolute;
  width: 100%;
  max-width: 1328px;
  padding-inline: 3.2rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
  padding-top: 6.8rem;
}
.ms-banner-constrained li.banner-left .banner-details{
  text-align: left;
  justify-content: flex-start;
}
.ms-banner-constrained li.banner-right .banner-details{
  text-align: right;
  justify-content: flex-end;
}
.ms-banner-constrained li .banner-details .banner-content{
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
@media screen and (min-width: 1500px){
  .ms-banner-constrained li .img-wrapper{
    width: 60%;
  }
}
@media screen and (min-width: 3000px){
  .ms-banner-constrained li .img-wrapper{
    width: 50%;
  }
}
.ms-banner-constrained li.banner-left .banner-details .banner-content{
  align-items: flex-start;
}
.ms-banner-constrained li.banner-right .banner-details .banner-content{
  align-items: flex-end;
}
.ms-banner-constrained li .banner-details .h6{
  margin: 0;
  width: 100%;
}
.banner-container-constrained .banner-details .h1{
  width: 100%;
  font-size: clamp(4rem, 5vw, 7.2rem);
  color: white;
  letter-spacing: 0.025em;
  line-height: .9;
}
.banner-container-constrained .banner-details p{
  color: white;
  margin-bottom: 3.2rem;
  max-width: 42rem;
  width: 100%;
  font-size: 1.8rem;
  line-height: 1.5;
}
.banner-container-constrained .banner-details a.superbutton {
  margin: 0;
  background: var(--second);
}
.banner-container-constrained .banner-details a.superbutton:hover{
  background: var(--orange);
}
@media screen and (max-width: 960px) {
  .banner-container-constrained{
    height: auto;
  }
  .ms-banner-constrained li::after{
    display: none;
  }
  .ms-banner-constrained li .img-wrapper{
    position: initial;
    aspect-ratio: 1366 / 768;
    width: 100%;
    height: auto;
  }
  .ms-banner-constrained li .banner-details,
  .ms-banner-constrained li.banner-left .banner-details,
  .ms-banner-constrained li.banner-right .banner-details{
    position: initial;
    transform: none;
    padding: 4.8rem 3.2rem;
    justify-content: center;
    text-align: center;
  }
  .ms-banner-constrained li .banner-details .banner-content,
  .ms-banner-constrained li.banner-left .banner-details .banner-content,
  .ms-banner-constrained li.banner-right .banner-details .banner-content{
    width: 100%;
    align-items: center;
  }
}
/* ----- Banner Navigation ----- */
.banner-container-constrained .banner-next,
.banner-container-constrained .banner-previous,
.banner-container-constrained .banner-pause {
  opacity: 0;
  position: absolute;
  bottom: 1.6rem;
  right: 1.6rem;
  display: flex !important;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 4rem;
  height: 4rem;
  background: none;
  text-decoration: none;
  transition: var(--animate);
  z-index: 2;
  background: var(--second);
  border-radius: 50%;
}
.banner-container-constrained .banner-next:hover,
.banner-container-constrained .banner-previous:hover,
.banner-container-constrained .banner-pause:hover {
  background: white;
  transition: var(--animate);
}
.banner-container-constrained .banner-previous {
  right: 6.4rem;
}
.banner-container-constrained .banner-pause {
  right: 10rem;
  color: white;
}
.banner-container-constrained .banner-pause:hover i {
  color: var(--dark);
}
.banner-container-constrained:hover .banner-next,
.banner-container-constrained:hover .banner-previous,
.banner-container-constrained:hover .banner-pause {
  opacity: 1;
  cursor: pointer;
}
.banner-container-constrained .banner-next svg,
.banner-container-constrained .banner-previous svg {
  width: auto;
  height: 2.4rem;
  fill: white;
}
.banner-container-constrained .banner-next svg {
  transform: rotate(180deg);
}
.banner-container-constrained .banner-next:hover svg,
.banner-container-constrained .banner-previous:hover svg {
  fill: var(--dark);
}
@media screen and (max-width: 960px) {
  .banner-container-constrained .banner-next,
  .banner-container-constrained .banner-previous,
  .banner-container-constrained .banner-pause {
    display: none !important;
  }
}
/* ----- Banner pagination ----- */
.banner_pagination {
  display: flex;
  justify-content: center;
  width: 100%;
  position: absolute;
  bottom: 1rem;
  color: hsla(0 0% 100% / 0.3);
  z-index: 1;
}
.banner_pagination > div {
  margin: 0 .3rem;
  cursor: pointer;
}
.banner_pagination > div:hover {
  color: hsla(0 0% 100% / 0.6);
}
.banner_pagination > .active {
  color: white;
}
@media screen and (max-width: 960px){
  .banner_pagination{
    display: none;
  }
}

/* -------- 10. Inner Header ---------- */

.inner_header {
  width: 100%;
  height: 30svh;
  min-height: 24rem;
  background: url(/assets/images/layout/inner_header.jpg) center center no-repeat;
  background-size: cover;
}

/* ---------- 11. Forms ---------- */

.form_holder form {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--grid-gap);
}
.form_holder .third_width {
  width: calc(33.3333% - (2 * var(--grid-gap) / 3));
  margin: 0;
}
.form_holder .half_width {
  width: calc(50% - (var(--grid-gap) / 2));
  margin: 0;
}
.form_holder .full_width {
  width: 100%;
  margin: 0;
}
@media screen and (max-width: 960px) {
  .form_holder .third_width,
  .form_holder .half_width {
    width: 100%;
  }
}
.form_holder textarea,
.form_holder select,
.form_holder input {
  font-weight: 400;
  width: 100%;
  padding: .5rem .8rem;
  height: auto;
  font-size: 1.6rem;
  line-height: 1.4;
  margin: 0;
  background-color: var(--light);
  border: none;
  border-bottom: 3px solid var(--main);
  color: var(--medium);
  outline: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.form_holder input.checkbox {
  float: left;
  width: auto;
  height: auto;
  margin: .8rem 0;
  padding: 0;
  background: none;
  border: 1px solid #f0f0f0;
  box-shadow: none;
  color: var(--medium);
  outline: none;
}
.form_holder .uploader {
  width: 100%;
  height: 3.2rem;
  padding: 0;
  margin: 0;
  background-color: white;
  border: none;
  color: var(--medium);
  outline: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.form_holder input:focus,
.form_holder select:focus,
.form_holder textarea:focus {
  background-color: var(--light);
  color: var(--medium);
  outline: none;
}
.form_holder span.label,
.form_holder label {
  display: block;
  font-size: 14px;
  color: var(--medium);
}
.form_holder .require {
  color: var(--main);
}
.form_holder .message {
  margin: 0 0 1.6rem 0;
}
form button.superbutton{
  width: 16rem;
  text-align: center;
  margin: 0 0 0 calc(100% - 16rem);
}
.form_holder .form_error {
  background: var(--danger);
  color: white;
  padding: 1.6rem;
  margin: 0 0 1.6rem;
}
form .form-terms{
  font-size: 1.2rem;
  line-height: 1.1;
  margin: 0;
  width: 100%;
  text-align: right;
}
.form_holder form input.superbutton,
.form_holder form .superbutton {
  background: var(--main);
  color: white;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 600;
  padding: 2px 4rem 0;
  text-decoration: none;
  border-radius: 0.4rem;
  border: none;
  outline: none;
  font-size: 1.6rem;
  height: 4rem;
  cursor: pointer;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
}
.form_holder form input.superbutton:hover,
.form_holder form .superbutton:hover {
  background: var(--dark);
}
/* ----- Custom Radio Button ----- */
.radio-wrapper {
  position: relative;
  padding-left: 3.2rem;
  margin-bottom: 0;
  cursor: pointer;
  font-size: 1.6rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 2.4rem;
  display: flex;
  align-items: center;
}
.radio-wrapper input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.radio-wrapper span.radio-label{
  display: flex;
  height: 2.4rem;
  align-items: center;
}
.radiomark {
  position: absolute;
  top: 0;
  left: 0;
  height: 2.4rem;
  width: 2.4rem;
  background-color: var(--light);
  border: 1px solid #ccc;
  border-radius: 50%;
}
.radio-wrapper:hover input ~ .radiomark {
  background-color: #ccc;
}
.radio-wrapper input:checked ~ .radiomark {
  background-color: var(--main);
  border-color: var(--main);
}
/* ----- Placeholder  ------ */
::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--dark);
  opacity: 0.5;
}
::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--dark);
  opacity: 0.5;
}
:-ms-input-placeholder {
  /* IE 10+ */
  color: var(--dark);
  opacity: 0.5;
}
:-moz-placeholder {
  /* Firefox 18- */
  color: var(--dark);
  opacity: 0.5;
}
/* ----- Validation ----- */
/* Validating Entries */
.form_holder input:not([type="submit"]):focus:valid,
.form_holder textarea:focus:valid,
.form_holder select:focus:valid {
  box-shadow: 0px 0px 5px var(--main);
}
/* Invalidating Entries */
.form_holder input:not([type="submit"]):focus:invalid,
.form_holder textarea:focus:invalid,
.form_holder select:focus:invalid {
  box-shadow: 0px 0px 5px red;
}
/* ----- Date Picker ----- */
.ui-datepicker .ui-datepicker-header {
  border: none;
  border-radius: 0;
  background-image: none;
  background: var(--main);
}
#ui-datepicker-div {
  padding: 0;
  border: 3px solid var(--main);
  border-radius: 0 0 .8rem .8rem;
}
.ui-datepicker .ui-datepicker-title {
  color: white;
}
.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev {
  background-color: transparent !important;
  background-image: none;
  border: none;
}
.ui-datepicker .ui-datepicker-next span,
.ui-datepicker .ui-datepicker-prev span{
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  background: transparent;
  width: 2rem;
  height: 2rem;
  transform: rotate(45deg);
  border-radius: 50%;
  border: none;
  cursor: pointer;
}
.ui-datepicker .ui-datepicker-prev span{
  transform: rotate(-135deg);
}
.ui-datepicker .ui-datepicker-next:hover span,
.ui-datepicker .ui-datepicker-prev:not(.ui-state-disabled):hover span {
  background: white;
}
.ui-datepicker .ui-datepicker-next span::after,
.ui-datepicker .ui-datepicker-prev span::after{
  content: '';
  width: 8px;
  height: 8px;
  border-top: 2px solid white;
  border-right: 2px solid white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-5px, -3px);
}

.ui-datepicker .ui-datepicker-next:hover span::after,
.ui-datepicker .ui-datepicker-prev:not(.ui-state-disabled):hover span::after{
  border-color: var(--main);
} 
.ui-datepicker table{
  margin: 0;
}
.ui-datepicker tbody tr td{
  border: 0;
  padding: 0;
  border-right: 2px solid white;
  border-bottom: 2px solid white;
}
.ui-datepicker tbody tr td:last-child{
  border-right: none;
}
.ui-datepicker tbody tr:last-child td{
  border-bottom: none;
}
.ui-datepicker th {
  padding: 5px 0;
  background: var(--light);
  border-right: 2px solid #eaeaea;
  border-bottom: 2px solid #eaeaea;
}
.ui-datepicker th:last-child{
  border-right: none
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button, html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active{
  border: none;
}
table.ui-datepicker-calendar span {
  border: none !important;
  font-family: var(--font);
  text-transform: uppercase;
}
.ui-state-highlight,
.ui-widget-content {
  font-family: var(--font);
}
.ui-datepicker .ui-datepicker-title {
  text-transform: capitalize;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  background-image: none;
  color: white;
  background-color: #d5d1d1;
}
.ui-state-default:hover,
.ui-widget-content .ui-state-default:hover,
.ui-widget-header .ui-state-default:hover{
  color: var(--medium);
  background: var(--light);
}
.ui-state-disabled span, .ui-widget-content .ui-state-disabled span, .ui-widget-header .ui-state-disabled span{
  color: var(--medium);
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
  border-color: var(--main);
  background-image: none;
  background-color: hsl(0 0% 100%);
}
td.ui-datepicker-current-day a {
  background: var(--main) !important;
  color: hsl(0 0% 100%) !important;
}
td.ui-datepicker-current-day a:hover {
  background: var(--dark) !important;
  color: hsl(0 0% 100%) !important;
}
td.ui-datepicker-days-cell-over.ui-datepicker-current-day.ui-datepicker-today
  a.ui-state-default.ui-state-highlight.ui-state-active {
  color: hsl(0 0% 20%) !important;
}
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: none;
  background: var(--main);
  color: white;
}
/* ----- Custom Select Dropdowns ----- */
/*the container must be positioned relative:*/
.custom-select {
  position: relative;
  font-family: Arial;
}
.custom-select select {
  display: none; /*hide original SELECT element:*/
}
.select-selected {
  background-color: DodgerBlue;
}
/*style the arrow inside the select element:*/
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}
/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}
/*style the items (options), including the selected item:*/
.select-items div,
.select-selected {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
  user-select: none;
}
.select-selected {
  user-select: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: all 0.35s ease-in-out;
  background: var(--light);
  border: none;
  color: var(--medium);
  border-radius: 0;
  margin: 0;
  padding: 6px 8px 4px 8px;
  font-size: 1.6rem;
  line-height: 1.4;
  border-bottom: 3px solid var(--main);
}
.select-selected.select-arrow-active {
  border-radius: 5px 5px 0 0;
}
.select-selected::after {
  background: none;
  width: 1.2rem;
  height: 1.2rem;
  top: 8px;
  right: 8px;
  transition: all 0.35s ease-in-out;
  border: none;
  transform: rotate(135deg);
  display: flex;
  background-size: auto 15px;
  border-top: 2px solid var(--medium);
  border-right: 2px solid var(--medium);
}
.select-selected.select-arrow-active::after {
  transform: rotate(-45deg);
  border-color: var(--medium);
  top: 14px;
}
/*style items (options):*/
.select-items {
  position: absolute;
  background-color: var(--main);
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
  border-radius: 0 0 4px 4px;
}
/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}
.select-items div:hover,
.same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}
/* ----- Custom File Uploader ----- */
.resume{
  text-align:center;
  padding: 3.2rem 1.6rem;
  background: var(--light);
  border-bottom: 3px solid var(--main);
}
.resume input[type="file"]{
  display: none;
}
.resume label{
  cursor:pointer;
  color: hsla(0 0% 0% / .35)
}

/* ---------- 12. Messages ---------- */

div.message_wrapper {
  margin: 0 0 1.6rem;
}
.content h2.hide_message {
  display: none;
}
.content h2.message_positive {
  width: 100%;
  color: white !important;
  background: var(--success) !important;
  padding: 1.6rem;
}
.content h2.message_negative {
  width: 100%;
  color: white !important;
  background: var(--danger) !important;
  padding: 1.6rem;
}
.message_wrapper a.message_link {
  color: white !important;
  text-decoration: underline;
}
.message_wrapper a.message_link:hover {
  text-decoration: none;
}

/* ---------- 13. Flex Columns Structure ---------- */

.flex {
  display: flex;
  flex-wrap: wrap;
  gap: var(--grid-gap);
}
.flex-six > * {
  width: calc(16.6666% - calc(5 * var(--grid-gap) / 6));
}
.flex-five > * {
  width: calc(20% - calc(4 * var(--grid-gap) / 5));
}
.flex-four > * {
  width: calc(25% - calc(3 * var(--grid-gap) / 4));
}
.flex-three > * {
  width: calc(33.3333% - calc(2 * var(--grid-gap) / 3));
}
.flex-two > * {
  width: calc(50% - calc(var(--grid-gap) / 2));
}
.flex-one > *{
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .flex-six > * {
    width: calc(25% - calc(3 * var(--grid-gap) / 4));
  }
  .flex-five > * {
    width: calc(33.3333% - calc(2 * var(--grid-gap) / 3));
  }
  .flex-four > *,
  .flex-three > * {
    width: calc(50% - calc(var(--grid-gap) / 2));
  }
  .flex-two > * {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .flex-four > *,
  .flex-three > * {
    width: 100%;
  }
  .flex-five > * {
    width: calc(50% - calc(var(--grid-gap) / 2));
  }
  .flex-six > * {    
    width: calc(33.3333% - calc(2 * var(--grid-gap) / 3));
  }
}
@media screen and (max-width: 560px) {
  .flex-five > * {
    width: 100%;
  }
  .flex-six > * {
    width: calc(50% - calc(var(--grid-gap) / 2));
  }
}
/* ----- Flex Staggered Animations ----- */
.flex-two > *.animate,
.flex-three > *.animate,
.flex-four > *.animate,
.flex-five > *.animate,
.flex-six > *.animate {
  opacity: 0;
  transform: translateY(10rem);
  transition: 0.5s ease-in-out;
}
.flex-two > *.animate.show,
.flex-three > *.animate.show,
.flex-four > *.animate.show,
.flex-five > *.animate.show,
.flex-six > *.animate.show {
  opacity: 1;
  transform: translateY(0);
}
.flex-two > *.animate:nth-of-type(2n + 1),
.flex-three > *.animate:nth-child(3n + 1),
.flex-four > *.animate:nth-child(4n + 1),
.flex-five > *.animate:nth-child(5n + 1),
.flex-six > *.animate:nth-child(6n + 1) {
  transition-delay: 0s;
}
.flex-two > *.animate:nth-of-type(2n),
.flex-three > *.animate:nth-child(3n + 2),
.flex-four > *.animate:nth-child(4n + 2),
.flex-five > *.animate:nth-child(5n + 2),
.flex-six > *.animate:nth-child(6n + 2) {
  transition-delay: 0.15s;
}
.flex-three > *.animate:nth-child(3n),
.flex-four > *.animate:nth-child(4n + 3),
.flex-five > *.animate:nth-child(5n + 3),
.flex-six > *.animate:nth-child(6n + 3) {
  transition-delay: 0.3s;
}
.flex-four > *.animate:nth-child(4n),
.flex-five > *.animate:nth-child(5n + 4),
.flex-six > *.animate:nth-child(6n + 4) {
  transition-delay: 0.45s;
}
.flex-five > *.animate:nth-child(5n),
.flex-six > *.animate:nth-child(6n + 5) {
  transition-delay: 0.6s;
}
.flex-six > *.animate:nth-child(6) {
  transition-delay: 0.75s;
}
@media screen and (max-width: 1024px) {
  .flex-two > *.animate:nth-of-type(2n),
  .flex-three > *.animate:nth-child(3n + 2),
  .flex-four > *.animate:nth-child(4n + 2),
  .flex-five > *.animate:nth-child(5n + 2),
  .flex-three > *.animate:nth-child(3n),
  .flex-four > *.animate:nth-child(4n + 3),
  .flex-five > *.animate:nth-child(5n + 3),
  .flex-four > *.animate:nth-child(4n),
  .flex-five > *.animate:nth-child(5n + 4),
  .flex-five > *.animate:nth-child(5n),
  .flex-six > *.animate:nth-child(6n + 1),
  .flex-six > *.animate:nth-child(6n + 2),
  .flex-six > *.animate:nth-child(6n + 3),
  .flex-six > *.animate:nth-child(6n + 4),
  .flex-six > *.animate:nth-child(6n + 5),
  .flex-six > *.animate:nth-child(6) {
    transition-delay: 0s;
  }
}

/* ---------- 14. Grid Column Structure ---------- */

.grid{
  display: grid;
  gap: var(--grid-gap);
  grid-template-columns: repeat(12, 1fr);
}
.col-1{
  grid-column: span 1;
}
.col-2{
  grid-column: span 2;
}
.col-3{
  grid-column: span 3;
}
.col-4{
  grid-column: span 4;
}
.col-5{
  grid-column: span 5;
}
.col-6{
  grid-column: span 6;
}
.col-7{
  grid-column: span 7;
}
.col-8{
  grid-column: span 8;
}
.col-9{
  grid-column: span 9;
}
.col-10{
  grid-column: span 10;
}
.col-11{
  grid-column: span 11;
}
.col-12{
  grid-column: span 12;
}
@media screen and (max-width: 960px){
  .col-1,
  .col-2{
    grid-column: span 3;
  }
  .col-3{
    grid-column: span 4;
  }
  .col-4{
    grid-column: span 6;
  }
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11{
    grid-column: span 12;
  }
}
@media screen and (max-width: 768px){
  .col-1,
  .col-2,
  .col-3{
    grid-column: span 6;
  }
  .col-4{
    grid-column: span 12;
  }
}
@media screen and (max-width: 580px){
  .col-1,
  .col-2,
  .col-3{
    grid-column: span 12;
  }
}

/* ---------- 15. Card & Box Base Styles ---------- */

/* ----- Standard Card ----- */
.card img {
  width: 100%;
  height: auto;
  margin: 0 0 0.8rem;
}
.card h3 {
  font-size: 2.4rem;
  line-height: 1;
}
.card h3 a{
  text-decoration: none;
  color: var(--dark);
}
.card h3 a:hover {
  color: var(--main);
}
.card h3,
.card p {
  margin: 0 0 1.6rem;
}
.card .h6.date{
  font-size: 1.4rem;
  margin: 0 0 .8rem;
}
.card a.superbutton {
  margin: 0;
}
.card ul.category-list{
  display: flex;
  gap: .8rem;
  flex-wrap: wrap;
  margin: 0 0 1.6rem;
  list-style: none;
}
.card ul.category-list li{
  font-size: 1.4rem;
}
/* ----- Standard Box ----- */
.box {
  text-decoration: none;
  position: relative;
  line-height: 0;
}
.box img {
  width: 100%;
  height: auto;
}
.box h3 {
  margin: 0;
  font-size: 2.4rem;
  line-height: 1;
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0 auto auto 0;
  display: flex;
  align-items: flex-end;
  padding: 1.6rem;
  color: white;
  background: hsla(0 0% 20% / 0.5);
  transition: var(--animate);
}
.box:hover h3 {
  background: hsla(0 0% 20% / 0.8);
}
/* ----- Shadow List ----- */
.shadow-list > * {
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
  background: #fff;
  overflow: hidden;
}
.shadow-list img {
  margin: 0;
}
.shadow-list .content-holder {
  padding: 1.6rem;
}

/* ---------- 16. Base Strip Styles ---------- */

/* ----- Floating Image ----- */
.img-float .content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.img-float.img-right .content {
  flex-direction: row-reverse;
}
.img-float .content .img-holder {
  width: calc(33.3333% - 4.8rem);
  aspect-ratio: 4 / 6;
}
.img-float .content .img-holder img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.img-float .content .editable_content {
  width: calc(66.6666% - 4.8rem);
}
@media screen and (max-width: 1024px) {
  .img-float .content,
  .img-float.img-right .content {
    flex-direction: column;
    gap: 3.2rem;
    align-items: center;
  }
  .img-float .content .img-holder {
    max-width: 30rem;
    width: 100%;
  }
  .img-float .content .editable_content {
    width: 100%;
  }
}
/* ----- Faded Image ----- */
.img-fade {
  position: relative;
}
.img-fade .img-holder {
  width: calc(45% - 4.8rem);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
.img-fade .img-holder img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.img-fade::after {
  content: "";
  width: calc(45% - 4.8rem);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(to right, transparent, white 100%);
  z-index: 1;
}
.light.img-fade::after {
  background: linear-gradient(to right, transparent, var(--light) 100%);
}
.medium.img-fade::after {
  background: linear-gradient(to right, transparent, var(--medium) 100%);
}
.dark.img-fade::after {
  background: linear-gradient(to right, transparent, var(--dark) 100%);
}
.colour.img-fade::after {
  background: linear-gradient(to right, transparent, var(--main) 100%);
}
.img-fade.img-right .img-holder,
.img-fade.img-right::after {
  left: auto;
  right: 0;
}
.img-fade.img-right::after {
  background: linear-gradient(to left, transparent, white 100%);
}
.light.img-fade.img-right::after {
  background: linear-gradient(to left, transparent, var(--light) 100%);
}
.medium.img-fade.img-right::after {
  background: linear-gradient(to left, transparent, var(--medium) 100%);
}
.dark.img-fade.img-right::after {
  background: linear-gradient(to left, transparent, var(--dark) 100%);
}
.colour.img-fade.img-right::after {
  background: linear-gradient(to left, transparent, var(--main) 100%);
}
.img-fade .content {
  display: flex;
  justify-content: flex-end;
  position: relative;
  z-index: 2;
}
.img-fade.img-right .content {
  justify-content: flex-start;
}
.img-fade .content .editable_content {
  width: calc(55% - 4.8rem);
}
@media screen and (max-width: 1024px) {
  .img-fade {
    padding-top: 35rem;
  }
  .img-fade .img-holder,
  .img-fade::after {
    height: 30rem;
    width: 100%;
  }
  .img-fade::after,
  .img-fade.img-right::after {
    background: linear-gradient(to bottom, transparent, #fff 100%);
  }
  .light.img-fade::after,
  .light.img-fade.img-right::after {
    background: linear-gradient(to bottom, transparent, var(--light) 100%);
  }
  .medium.img-fade::after,
  .medium.img-fade.img-right::after {
    background: linear-gradient(to bottom, transparent, var(--medium) 100%);
  }
  .dark.img-fade::after,
  .dark.img-fade.img-right::after {
    background: linear-gradient(to bottom, transparent, var(--dark) 100%);
  }
  .colour.img-fade::after,
  .colour.img-fade.img-right::after {
    background: linear-gradient(to bottom, transparent, var(--main) 100%);
  }
  .img-fade .content .editable_content {
    width: 100%;
  }
}
/* ----- Background Image ----- */
.img-background {
  position: relative;
  z-index: 1;
}
.img-background::after {
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  opacity: 0.75;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
.img-background .img-holder{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.img-background .img-holder img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.light.img-background::after {
  background: var(--light);
}
.medium.img-background::after {
  background: var(--medium);
}
.dark.img-background::after {
  background: var(--dark);
}
.colour.img-background::after {
  background: var(--main);
}
.img-background .content {
  position: relative;
  z-index: 1;
}
/* ----- Strip List ----- */
.strip-list-holder {
  padding: 0;
}
.strip-list {
  padding: 9.6rem 3rem;
  position: relative;
  background: white;
}
.strip-list:nth-of-type(2n) {
  background: var(--light);
}
.strip-list .img-holder {
  width: 33.3333%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.yr-strips .strip-list .img-holder{
  left: auto;
  right: 0;
}
.strip-list .img-holder img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.strip-list:nth-of-type(2n) .img-holder {
  left: auto;
  right: 0;
}
.yr-strips .strip-list:nth-of-type(2n)  .img-holder{
  left: 0;
  right: auto;
}
.yr-strips .strip-list:nth-of-type(2n) .content,
.strip-list .content {
  display: flex;
  justify-content: flex-end;
}
.yr-strips .strip-list .content,
.strip-list:nth-of-type(2n) .content {
  justify-content: flex-start;
}
.strip-list .content .editable_content {
  width: calc(66.6666% - 5rem);
}
@media screen and (max-width: 1024px) {
  .strip-list {
    padding: 30rem 3rem 5rem;
  }
  .strip-list .img-holder {
    width: 100%;
    height: 25rem;
  }
  .strip-list .content .editable_content {
    width: 100%;
  }
}

/* ---------- 17. Animations ---------- */

.fadeFromLeft {
  opacity: 0;
  transform: translateX(-10rem);
  transition: 0.5s ease-in-out;
}
.fadeFromRight {
  opacity: 0;
  transform: translateX(10rem);
  transition: 0.5s ease-in-out;
}
.fadeFromTop {
  opacity: 0;
  transform: translateY(-10rem);
  transition: 0.5s ease-in-out;
}
.fadeFromBottom {
  opacity: 0;
  transform: translateY(10rem);
  transition: 0.5s ease-in-out;
}
.fadeFromLeft.show,
.fadeFromRight.show,
.fadeFromTop.show,
.fadeFromBottom.show {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- 18. Swipebox Styles ---------- */

.swipebox_full a img {
  width: 100%;
  transition: var(--animate);
}
.swipebox_full a img:hover {
  opacity: 0.5;
}

/* ---------- 19. Sub Page Menu ----------  */

ul.pages li {
  list-style: none;
  margin: 0;
  padding: 0;
}
ul.pages li a {
  background: var(--main);
  color: hsl(0 0% 100%);
  text-decoration: none;
  display: block;
  padding: 10px;
  text-align: center;
  font-weight: 700;
}
ul.pages li a:hover {
  background: var(--dark);
}

/* ---------- 20. Contact ---------- */

ul.contact-list{
  list-style: none;
}
ul.contact-list li a{
  text-decoration: none;
}
ul.contact-list li a:hover{
  color: var(--main);
}

/* ---------- 21. Contact Multi Location ----------*/

.multi-loc{
  margin: 0 0 3.2rem;
}
.multi-loc iframe{
  aspect-ratio: 6 / 3.5;
  width: 100%;
  height: auto;
}
.multi-loc h2{
  font-size: 2.2rem;
  padding: 0 0 .8rem;
  margin: 0 0 .8rem;
  border-bottom: 2px solid hsla(0 0% 0% / .1);
}
.multi-loc ul{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: .8rem var(--grid-gap);
}
.multi-loc ul li{
  width: calc(50% - calc(var(--grid-gap) / 2));
}
.multi-loc ul li.full-width{
  width: 100%;
}
.multi-loc strong{
  display: block;
  color: var(--dark);
}
.multi-loc address{
  font-style: normal;
}
.multi-loc a{
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  .multi-loc ul li{
    width: 100%;
  }
}

/* ---------- 22. Map ---------- */

.map-holder {
  height: 42rem;
  overflow: hidden;
}
.map-holder iframe {
  height: 100%;
  width: 100%;
}

/* ---------- 23. Social Media ---------- */

.social_media ul {
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
  gap: var(--grid-gap);
}
.social_media ul li {
  margin: 0;
  list-style: none;
}
.social_media ul li a {
  width: 4rem;
  height: 4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  text-align: center;
  color: white;
  background: var(--main);
  border-radius: 50%;
  transition: var(--animate);
}
.social_media ul li a:hover {
  background: var(--dark);
}
.social_media ul li a i {
  font-size: 2.2rem;
  line-height: 1;
}

/* ---------- 24. Toggler ---------- */

h4.toggle,
h4.toggle.active.open {
  color: hsl(0 0% 20%);
  background: url(/assets/images/layout/toggle.png) no-repeat 10px 11px;
  padding: 8px 0 8px 35px;
  margin: 10;
  cursor: pointer;
}
h4.toggle.active,
h4.toggle.open {
  background-position: 10px -39px;
}
h4.toggle:hover,
h4.toggle.active.open:hover {
  background-position: 10px -39px;
}
div.toggler {
  border-top: none;
  margin: 0;
  overflow: hidden;
  padding: 0 0 0 24px;
}
div.toggler hr {
  border-top: 1px solid #f0f0f0;
}
div.toggler p {
  margin: 0;
  padding: 0;
}

/* ---------- 25. Products ---------- */

/* ----- Search ----- */
form.search_form{
  display: flex;
  margin: 0 0 3.2rem;
}
form.search_form input.search_input{
  width: calc(100% - 16px);
  border-radius: .4rem 0 0 .4rem;
  border: 1px solid hsla(0 0% 0% / .15);
  border-radius: none;
  background: hsla(0 0% 0% / .05);
  padding: .5rem .8rem;
}
form.search_form input.superbutton{
  width: 16rem;
  border-radius: 0 .4rem .4rem 0;
  margin: 0;
}
/* ----- Product List ----- */
.product-list .card .product-number{
  font-size: 1rem;
  line-height: 1;
  margin: 0 0 .4rem;
}
.product-list .card h3{
  margin: 0;
}
.product-list .card p{
  margin: 1.6rem 0;
}
.price-wrapper{
  font-size: 1.4rem;
}
.price-wrapper span .strike{
  text-decoration: line-through;
  color: hsl(0, 0%, 70%);
}
form.add_to_cart{
  display: flex;
  flex-direction: column;
  gap: .8rem;
}
form.add_to_cart .cart_price_option label,
form.add_to_cart .cart_quantity label{
  display: block;
  font-size: 1.2rem;
}
form.add_to_cart .cart_price_option select,
form.add_to_cart .cart_quantity input{
  border-radius: 0;
  border: none;
  background: var(--light);
  border-bottom: 3px solid var(--main);
  width: 100%;
  padding: .5rem .8rem;
  margin: 0 0 .8rem;
}
form.add_to_cart  a.add_to_cart{
  width: 100%;
  padding-inline: .8rem;
}
/* ----- Product Page ----- */
.product-page .content{
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem 4.8rem;
}
.product_highlight {
  width: 100%;
  max-width: 300px;
  margin-bottom: 1.6rem;
  background: white;
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
  overflow: hidden;
}
.product_highlight .alert {
  color: var(--medium);
  margin: 0;
}
.product_highlight .strike {
  text-decoration: line-through;
}
.product_highlight .sale {
  color: var(--medium);
}
.product_highlight .holder {
  position: relative;
  display: flex;
  justify-content: space-between;
}
.product_highlight .holder > a {
  width: calc(80% - 5px);
  text-decoration: none;
  text-align: center;
}
.product_highlight .holder .img_select {
  width: 20%;
  display: flex;
  justify-content: left;
  flex-direction: column;
}
.product_highlight .holder #img_title {
  font-style: normal;
  font-weight: 500;
}
.product_highlight .holder .img_select figure {
  width: 100%;
  margin: 0px 5px 5px 0px;
  cursor: pointer;
}
.product_highlight .holder .img_select > figure.active {
  box-shadow: 0px 0px 4px 0px #333;
}
.product_highlight .holder .img_select figure img {
  width: 100%;
}
.product_highlight form.add_to_cart{
  padding: 1.6rem;
}
.product_highlight form.add_to_cart a.superbutton{
  margin: 0;
  padding-inline: .8rem;
}
.product-page .content .editable_content{
  width: calc(100% - 34.8rem);
}
.product-page .content .editable_content .product_number{
  font-size: 1.4rem;
  line-height: 1;
  margin: 0 0 .4rem;
}
@media screen and (max-width: 960px){
  .product-page .content .editable_content{
    width: 100%;
  }
}

/* ---------- 26. Modal Styles ---------- */

summary.btn {
  cursor: pointer;
  display: inline-block;
  background-color: var(--main);
  padding: 5px 20px;
  border-radius: 10px;
  margin: 10px 0;
}
.details-with-modal summary::-webkit-details-marker {
  display: none;
}
details-dialog {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99999;
  max-height: 80vh;
  overflow: scroll;
  max-width: 90vw;
  width: 448px;
  background-color: hsl(0 0% 100%);
}
.details-with-modal[open] > summary:before {
  content: " ";
  background: hsla(0 0% 0% / 0.3);
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 1;
}
.modal-header {
  padding: 20px;
  background-color: var(--main);
  border-bottom: 1px solid hsl(0, 0%, 94%);
}
.modal-body {
  padding: 20px;
}
.modal-footer {
  border-top: 1px solid hsl(0, 0%, 94%);
  padding: 20px;
  text-align: center;
}
.modal-footer button {
  width: 95%;
  display: inline-block;
  background-color: var(--main);
  font-size: 1rem;
  padding: 10px;
  cursor: pointer;
  transition: 0.3s ease;
}
.modal-footer button:hover {
  background-color: var(--medium);
  color: var(--medium);
  transition: 0.3s ease;
}

/* ---------- 27. FAQs ---------- */
.faq-wrapper{
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.faq-wrapper .block{
  border-bottom: 1px solid hsla(0 0% 0% / .15);
  padding-bottom: 1.6rem;
}
.faq-wrapper .block:last-child{
  border: none;
}
.faq-wrapper .toggle_faq{
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: 2rem;
  margin: 0;
  cursor: pointer;
  font-weight: 300;
}
.faq-wrapper .toggle_faq .icon{
  width: 3.2rem;
  height: 3.2rem;
  display: block;
  position: relative;
  transform: translate(0, -1px);
  transition: var(--animate);
}
.faq-wrapper .toggle_faq.active .icon{
  transform: rotate(135deg);
}
.faq-wrapper .toggle_faq .icon i{
  width: 1.6rem;
  height: .2rem;
  background: var(--second);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50% , -50%) rotate(90deg);
}
.faq-wrapper h3.toggle_faq .icon i:nth-child(2){
  transform: translate(-50% , -50%) rotate(0deg);
}
.faq-wrapper .toggler{
  padding: .8rem 1.6rem 1.6rem 4rem;
}

/* ---------- 28. Events ---------- */

.events-list{
  margin-top: 3.2rem;
}
.events-list .card ul{
  list-style: none;
  border-block: 2px solid hsla(0 0% 0% / .1);
  padding: .4rem 0;
  margin: 0 0 .8rem;
}
.events-list .card ul li{
  font-size: 1.4rem;
}
.event-page h1{
  margin: 0;
}
.event-page .item-wrapper{
  margin-top: 3.2rem;
}
ul.event-details{
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  border-block: 2px solid hsla(0 0% 0% / .1);
  margin: 2.4rem 0;
  padding: .4rem 0;
}
ul.event-details li{
  border-right: 2px solid hsla(0 0% 0% / .1);
  padding: .4rem .8rem;
}
ul.event-details li:last-child{
  border-right: none;
}
ul.event-details li i{
  color: var(--main);
  margin: 0 .4rem 0 0;
}
ul.event-details li.register-btn a.superbutton{
  margin-top: 0;
}
@media screen and (min-width: 959px){
  ul.event-details li.register-btn{
    display: none;
  }
}
.reg-active{
  display: flex;
  gap: 3.2rem;
  position: relative;
  align-items: flex-start;
  flex-wrap: wrap;
}
.reg-content{
  width: calc(100% - 33.2rem);
  padding-right: 3.2rem;
  border-right: 2px solid hsla(0 0% 0% / .1);
}
.reg-form{
  width: 30rem;
  position: sticky;
  top: 100px;
}
@media screen and (max-width: 960px){
  .reg-content{
    width: 100%;
    padding: 0 0 3.2rem;
    border-right: none;
    border-bottom: 2px solid hsla(0 0% 0% / .1);
  }
  .reg-form{
    position: initial;
    width: 100%;
  }
  ul.event-details{
    flex-direction: column;
    padding: 0;
  }
  ul.event-details li{
    width: 100%;
    padding: .8rem;
    border-right: none;
    border-bottom: 2px solid hsla(0 0% 0% / .1);
  }
  ul.event-details li:last-child{
    border-bottom: none;
  }
}

/* ---------- 29. Categories ---------- */

.categories-page .content{
  display: flex;
  flex-direction: row-reverse;
}
.categories-page .flex{
  width: calc(100% - 32rem);
}
.categories-page aside.categories{
  width: 32rem;
  padding: 0 2.4rem 0 0;
  margin: 0 2.4rem 0 0;
  border-right: 2px solid hsla(0 0% 0% / .1);
}
.categories-page aside.categories h2{
  font-size: 2.4rem;
  margin: 0 0 .8rem;
  padding: 0 0 .8rem;
  border-bottom: 2px solid hsla(0 0% 0% / .1);
}
.categories-page aside.categories ul{
  list-style: none;
  display: flex;
  gap: .8rem;
  flex-direction: column;
  margin: 0;
}
.categories-page aside.categories ul li{
  padding-bottom: .8rem;
  border-bottom: 1px solid hsla(0 0% 0% / .1);
  cursor: pointer;
}
.categories-page aside.categories ul li:last-child{
  border: none;
}
.categories-page aside.categories ul li.active{
  color: var(--dark);
  font-weight: 600;
}
@media screen and (max-width: 1180px){
  .categories-page .flex-three > *{
    width: calc(50% - .8rem);
  }
}
@media screen and (max-width: 960px) {
  .categories-page .content{
    flex-direction: column-reverse;
  }
  .categories-page aside.categories{
    width: 100%;
    padding: 0;
    border-right: none;
    border-bottom: 2px solid hsla(0 0% 0% / .1);
    margin: 0 0 2.4rem;
  }
  .categories-page .flex{
    width: 100%;
  }
}
@media screen and (max-width: 640px){
  .categories-page .flex-three > *{
    width: 100%;
  }
}

/* ---------- 30. Pop Up ---------- */

.cta-popup{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100svh;
  background: hsla(0 0% 0% / .5);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.cta-popup .pop-up{
  background: white;
  padding: 3.2rem;
  border-radius: 1.6rem 0 1.6rem 1.6rem;
  box-shadow: var(--shadow);
  width: 48rem;
  position: relative;
  text-align: center;
}
.cta-popup .pop-up .close-popup{
  width: 2.4rem;
  height: 2.4rem;
  position: absolute;
  top: -12px;
  right: -12px;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main);
  border-radius: 50%;
  transition: var(--animate);
  cursor: pointer;
}
.cta-popup .pop-up .close-popup:hover{
  background: var(--dark);
}
.cta-popup .pop-up h3{
  font-size: 3.2rem;
  margin: 0 0 1.6rem;
}
.cta-popup .pop-up .superbutton{
  margin: 1.6rem 0 0;
}

/* ---------- 30. Pop Up ---------- */

.page-details.h6{
  font-size: 1.6rem;
  line-height: 1;
  margin: 0 0 1.6rem;
  color: var(--medium);
}
.page-details.h6 a{
  color: var(--medium);
  text-decoration: none;
}
.page-details.h6 a:hover{
  color: var(--main);
}

/* ---------- Custom Styles ---------- */

/* ----- Wave ----- */

.wave-top img,
.wave-bottom img{
  position: absolute;
  width: 100%;
  z-index: 2;
}
.wave-bottom img{
  transform: translate(0, -1px);
}
.wave-top img{
  transform: translate(0, calc(-100% + 1px));
}
.wave-before{
  aspect-ratio: 683 / 43;
  width: 100%;
}
.wave-after{
  aspect-ratio: 1366 / 95;
  width: 100%;
}

/* ----- Section List ----- */
.sec-list .card{
  background: var(--purple);
}
.sec-list .card:nth-child(2){
  background: var(--orange);
}
.sec-list .card:nth-child(3){
  background: var(--green);
}
.sec-list .card:nth-child(4){
  background: var(--pink);
}
.sec-list .card .img-wrapper{
  position: relative;
}
.sec-list .card .img-wrapper svg{
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: auto;
}
.sec-list .card .img-wrapper svg path{
  fill: var(--purple);
}
.sec-list .card:nth-child(2) .img-wrapper svg path{
  fill: var(--orange);
}
.sec-list .card:nth-child(3) .img-wrapper svg path{
  fill: var(--green);
}
.sec-list .card:nth-child(4) .img-wrapper svg path{
  fill: var(--pink);
}
.sec-list .card .img-wrapper svg .opac{
  opacity: .5;
}
.sec-list .card .content-holder{
  padding-top: 0;
}
.sec-list .card .content-holder p.event-date{
  font-size: 1.4rem;
  margin: 0 0 4px;
}
.sec-list .card .content-holder h3{
  margin: 0 0 .8rem;
}
.sec-list .card .content-holder h3 a{
  color: white;
}
.sec-list .card .content-holder p{
  color: white;
}
h1.event-title{
    font-size: clamp(3.2rem, 3.4vw, 4.8rem);
    margin: 0;
}
ul.event-info{
  list-style: none;
  display: flex;
  justify-content: space-between;
  margin: 1.6rem 0;
  padding: .8rem 0;
  border-block: 2px solid hsla(0 0% 0% / 0.1);
}
ul.event-info li{
  display: flex;
  gap: .8rem;
  align-items: flex-start;
  padding: .8rem 1.6rem;
  border-left: 2px solid hsla(0 0% 0% / 0.1);
  margin: 0;
  line-height: 1.2;
}
ul.event-info li:first-child{
  border:none;
}
ul.event-info li i{
  color: var(--main);
}
ul.event-info li strong{
  display: block;
}
/* ----- News Signup ----- */
.news-signup{
  position: relative;
}
.news-signup .img-wrapper{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 49.5%;
  z-index: 0;
}
.news-signup .img-wrapper img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.news-signup .img-wrapper img.img-mask{
  width: auto;
  height: 100%;
  object-fit: unset;
  position: absolute;
  top: 0;
  right: -5px;
}
.news-signup .content{
  display: flex;
  justify-content: flex-end;
  max-width: 994px;
  position: relative;
  z-index: 1;
}
.news-signup .content .editable_content{
  padding: 2.4rem;
  background: #0C5BAB;
  border-radius: 1.6rem;
  width: 69.5%;
  box-shadow: var(--shadow);
}

/* ----- News Signup Right Layout (for even strips) ----- */
.news-signup.img-right .img-wrapper{
  left: auto;
  right: 0;
}
.news-signup.img-right .img-wrapper img.img-mask{
  left: -5px;
  right: auto;
  transform: scaleX(-1);
}
.news-signup.img-right .content{
  justify-content: flex-start;
}

/* ----- Intro Strip ----- */

.intro-strip{
  position: relative;
  overflow: hidden;
}

.intro-strip img.bg-img{
  position: absolute;
  top: 0;
  left: -2%;
  width: 104%;
}

.intro-strip .content{
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 8rem;
}
.intro-strip .content .img-wrapper{
  width: calc(50% - 8rem);
  aspect-ratio: 877 / 1006;
  overflow: hidden;
  height: auto;
}
.intro-strip .content .img-wrapper img{
  width: 100%;
  height: 100%;
    object-fit: cover;
  -webkit-mask-image: url(/assets/images/layout/blob-mask.svg);
  mask-image: url(/assets/images/layout/blob-mask.svg);
  mask-repeat: no-repeat;    
}
.intro-strip .content .img-wrapper img.image-bg{
    object-fit: cover;
}
.intro-strip .content .editable_content{
  width: 50%;
}
@media screen and (max-width: 960px) {
.intro-strip .content {
  flex-direction: column;
  gap: 4rem;
}
.intro-strip .content .img-wrapper{
  width: 100%;
  max-width: 36rem;
}
.intro-strip .content .editable_content{
  width: 100%;
}
}

.intro-strip .col-6{
  align-content: center;
}

/* ----- Event List ----- */

/* .event-list .card{
  width: 100%;
  display: flex;
  overflow: hidden;
  align-items: flex-start;
  gap: 6.4rem;
  background: white;
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
} */
.event-list .card img{
  width: 100%;
  border-radius: 1.6rem;
  margin: 0 0 1.6rem;
}
.event-list .card .content-holder{
  padding: 0;
  /* width: calc(100% - 62rem - 12.8rem); */
  width: 100%;
}
.event-page .tag,
.event-list .card .content-holder .tag{
  font-size: 1.4rem;
  width: auto;
  display: inline-block;
  border: 1px solid hsla(0 0% 0% / .2);
  padding: .4rem 2.4rem .1rem;
  border-radius: 4rem;
  background: hsla(0 0% 0% / .05);
  margin: 0 0 1.6rem;
}
.event-list .card .content-holder h3{
  font-size: 2.4rem;
}
.event-list .card .info-wrapper{
  width: 32rem;
  padding: 2.4rem 2.4rem 2.4rem 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.event-page .content .editable_content ul.event-info,
.event-list .card ul{
  list-style: none;
  margin: 0 0 1.6rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.event-page .content .editable_content ul.event-info li,
.event-list .card ul li{
  display: flex;
  align-items: center;
  gap: .4rem;
}
.event-page .content .editable_content ul.event-info li img,
.event-list .card ul li img{
  height: 1.6rem !important;
  width: auto !important;
  margin: 0;
}
.event-feat .editable_content{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin: 0 0 4.8rem;
}
.event-feat .editable_content h2,
.event-feat .editable_content a.superbutton{
  margin: 0;
}

/* ----- Contact CTA ----- */

.contact-cta{
  position: relative;
  padding-block: 24rem 14rem
}
.contact-cta .img-wrapper{
  position: absolute;
  left: 0;
  top: 0;
  width: 73%;
  height: 100%;
  z-index: 1;
}
.contact-cta .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.contact-cta .img-wrapper::after{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: linear-gradient(to bottom, hsla(0 0% 0% / .5), transparent);
}
.contact-cta .img-wrapper img.img-overlay{
  width: auto;
  height: 100%;
  object-fit: unset;
  position: absolute;
  bottom: 0;
  right: -10px;
  z-index: 2;
}
.contact-cta .content{
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
}
.contact-cta .content .editable_content{
  width: 38%;
}
/* ----- Inner Intro ----- */
.inner-intro{
  position: relative;
  background: var(--light);
  /* padding-top: 200px; */
  padding: 10rem 3.2rem;
  min-height: calc(55svh - 6.8rem);
  /* max-height: calc(90svh - 6.8rem); */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
@media screen and (max-width: 960px){
  .inner-intro{
    max-height: unset;
  }
}
.inner-intro .img-wrapper{
  width: calc(50% - 6.4rem);
  /* max-width: calc(50% - 6.4rem); */
  /* min-width: calc(50% - 6.4rem); */
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  max-height: calc(80svh - 10.4rem);
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  aspect-ratio: 613 / 668;
}
@media screen and (max-width: 960px){
  .inner-intro .img-wrapper{
    max-width: 100%;
  }
}
.inner-intro .img-wrapper::after{
  content: '';
  
}
.inner-intro .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inner-intro .img-wrapper img.img-overlay{
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  position: absolute;
  right: -2px;
  bottom: -2px;
  object-position: bottom right;
}
.inner-intro .intro-mask{
  background: var(--light);
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  mix-blend-mode: lighten;
  position: absolute;
  top: 0;
  left: 0;
}
.inner-intro .intro-mask img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom right;
}
@media screen and (max-width: 960px){
  .inner-intro .intro-mask{
    display: none;
  }
}
.inner-intro .content{
  display: flex;
  justify-content: flex-end;
  position: relative;
  z-index: 2;
}
.inner-intro .content .editable_content{
  width: 50%;
}

/* ----- Icon List ----- */

.icon-list{
  gap: 5.6rem 1.6rem;
}
.icon-list .card{
  overflow: visible;
  text-decoration: none;
  transition: var(--animate);
}
.icon-list .card .img-wrapper{
  width: 8rem;
  height: 8rem;
  border: 2px solid var(--main);
  border-radius: 50%;
  left: calc(50% - 4rem);
  top: -4rem;
  position: absolute;
  overflow: hidden;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
}
.icon-list .card .img-wrapper img{
  width: 5.2rem;
  height: auto;
}
.icon-list .card .content-wrapper{
  padding: 5.6rem 1.6rem 1.6rem;
  text-align: center;
}
.icon-list .card .content-wrapper h3{
  margin: 0 0 .8rem;
}
.icon-list .card .content-wrapper p{
  margin: 0;
  color: var(--medium);
}

/* ----- Business Support List ----- */

.business-support-list .card img{
  margin: 0;
  max-width: 24rem;
}
.business-support-list .card .content-wrapper{
  padding: 1.6rem;
}
.business-support-list .card .content-wrapper ul.category-list li{
  background: #ebeef1;
  padding: .4rem 1.6rem .2rem;
  border-radius: 4rem;
  color: #939ba3;
}
.business-support-list .card .content-wrapper h6{
  margin: 0 0 1.2rem;
}
.business-support-list .card .content-wrapper p{
  margin: 0;
}
.business-support-list .card .content-wrapper p a.button{
  margin-top: 1.6rem;
}
@media screen and (max-width: 960px) {
  .categories-page aside.categories{
    border-bottom: 2px solid hsla(0 0% 0% / 0);
  }
  .categories-page aside.categories.active{
    border-bottom: 2px solid hsla(0 0% 0% / .1);
  }
  .categories-page aside.categories h2{
    position: relative;
    cursor: pointer;
  }
  .categories-page aside.categories h2::before,
  .categories-page aside.categories h2::after{
    content: '';
    width: 1.6rem;
    height: .2rem;
    background: var(--main);
    position: absolute;
    top: 11px;
    right: 0;
    transition: var(--animate);
  }
  .categories-page aside.categories h2::after{
    transform: rotate(90deg);
  }
  .categories-page aside.categories.active h2::before{
    transform: rotate(45deg);
    background: var(--second);
  }
  .categories-page aside.categories.active h2::after{
    transform: rotate(135deg);
    background: var(--second);
  }
  .categories-page aside.categories ul{
    height: 0;
    opacity: 0;
  }
  .categories-page aside.categories.active ul{
    height: auto;
    opacity: 1;
  }
}

/* ----- YSpace Strips ----- */

.yspace-intro .content{
  padding: 3.2rem;
  border-radius: 1.6rem;
  background: white;
  box-shadow: var(--shadow);
}
.yspace-strips .strip-list .img-holder{
  overflow: hidden;
}
.yspace-strips .strip-list{
  background: #8C4799;
}
/*.yspace-strips .strip-list .img-holder::after{
  content: '';
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  left: -1px;
  top: -1px;
  position: absolute;
  background-size: auto 100%;
  background-position: center left;
  background-repeat: no-repeat;
}
@media screen and (max-width: 960px) { 
  .yspace-strips .strip-list .img-holder::after{
    display: none;
  }
}
.yspace-strips .strip-list:nth-child(1){
  background: #8c4799;
}
.yspace-strips .strip-list:nth-child(1) .img-holder::after{
  background-image: url(/assets/images/layout/graphic-ys-p.svg);
}
.yspace-strips .strip-list:nth-child(2){
  background: #004b27;
}
.yspace-strips .strip-list:nth-child(2) .img-holder::after{
  background-image: url(/assets/images/layout/graphic-ys-g.svg);
  background-position: center right;
}
.yspace-strips .strip-list:nth-child(3){
  background: #f1b434;
}
.yspace-strips .strip-list:nth-child(3) .img-holder::after{
  background-image: url(/assets/images/layout/graphic-ys-y.svg);
}
.yspace-strips .strip-list:nth-child(4){
  background: #024b99;
}
.yspace-strips .strip-list:nth-child(4) .img-holder::after{
  background-image: url(/assets/images/layout/graphic-ys-b.svg);
  background-position: center right;
} */
/* Base styles for all SVGs - default positioning (odd elements: 1, 3, 5) */
.strip-list-holder .strip-list .img-holder svg{
  aspect-ratio: 77.3 / 401.5;
  position: absolute;
  top: 0;
  height: 101%;
  width: auto;
  /* Default: SVG positioned on the right side */
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  left: auto;
  right: -1px;
}

/* Override for even-numbered elements only - using same selector as layout */
.strip-list-holder .strip-list:nth-of-type(2n) .img-holder svg{
  /* Even elements: SVG positioned on the left side */
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  left: -1px;
  right: auto;
}

/* Special case: when parent has yr-strips class, all elements use left positioning */
.strip-list-holder.yr-strips .strip-list .img-holder svg{
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  left: -1px;
  right: auto;
}

/* Override for yr-strips: reverse the pattern to match layout behavior */
.strip-list-holder.yr-strips .strip-list:nth-of-type(2n) .img-holder svg{
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  left: auto;
  right: -1px;
}
@media screen and (max-width: 960px) {
  .strip-list-holder .strip-list .img-holder svg,
  .strip-list-holder.yr-strips .strip-list .img-holder svg{
    display: none;
  }
}
/* ----- Celebration Strip ----- */

.cele-strip .editable_content .grid .col-3{
  padding: 1.6rem;
  border-radius: 1.6rem;
  background: white;
  box-shadow: var(--shadow);
}
.cele-strip .editable_content .grid .col-3 img{
  border-radius: 50%;
  width: 8rem;
  margin: 0 auto .8rem;
}
.cele-strip .editable_content .grid .col-3 h3{
  font-size: 2.4rem;
  margin: 0 0 .8rem;
}
.cele-strip .editable_content .grid .col-3 p{
  margin: 0;
}

/* ----- Success Stories ----- */

.ss-list .card{
  padding: 1.6rem;
}
.ss-list .card img{
  width: 12rem;
  margin: 0 0 1.6rem;
}
.ss-list .card .content-wrapper h3{
  margin: 0 0 .8rem;
  font-size: 2.4rem;
}
.ss-list .card .content-wrapper p{
  margin: 0;
}
.share-story .col-6 {
  align-content: center;
}

/* ----- Contact Page Styles ----- */

.wave-before{
  padding-top: 15rem;
}
ul.contact-list li{
  padding: 2.4rem;
}
ul.contact-list li i{
  color: var(--second);
}
ul.contact-list li strong{
  display: block;
}
.colour .social_media ul li a{
  background: var(--second);
  color: white;
}
.colour .social_media ul li a:hover{
  background: var(--orange);
  color: white;
}
.ms-banner-constrained li .img-wrapper img.mobile-hero-overlay{
  display: none;
}
section.error-page{
  min-height: calc(100svh - 215px);
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 168px;
}
/* ----- Mobile Responsive ----- */
@media screen and (min-width: 3250px){
  .full_header::before{
    width: 36%;
  }
}
@media screen and (min-width: 2500px) {
  .full_header::before{
    width: 31%;
  }
}
@media screen and (max-width: 1820px){
  .full_header::before{
    width: 16%;
  }
}
@media screen and (max-width: 1140px){
  .jqueryslidemenu ul{
    width: 100%;
  }
}
@media screen and (max-width: 1040px){
  .jqueryslidemenu a.logo{
    width: 16rem;
  }
  .jqueryslidemenu nav{
    width: calc(100% - 250px);
  }
  .jqueryslidemenu ul li a{
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 960px) {
  .ms-banner-constrained li .img-wrapper img.img-mask{
    display: none;
  }
  .ms-banner-constrained li .img-wrapper:after{
    display: none;
  }
  .banner-container-constrained .banner-details .h1{
    font-size: clamp(4rem, 4.2vw, 6.4rem);
  }
  .ms-banner-constrained li .img-wrapper{
    position: relative;
  }
  .ms-banner-constrained li .img-wrapper img.mobile-hero-overlay{
    display: block;
    height: auto;
    object-fit: unset;
    position: absolute;
    bottom: -1px;
    width: 104%;
    left: -2%;
  }
  .wave-before{
    display: none;
  }
  .news-signup{
    padding: 25rem 3rem 8rem;
  }
  .news-signup .img-wrapper{
    width: 100%;
    height: 300px;
  }
  .contact-cta .img-wrapper img.img-overlay,
  .news-signup .img-wrapper img.img-mask{
    display: none;
  }
  .news-signup .content .editable_content{
    width: 100%;
  }
  /* Mobile styles for img-right variant */
  .news-signup.img-right .img-wrapper{
    left: 0;
    right: auto;
  }
  .news-signup.img-right .img-wrapper img.img-mask{
    left: auto;
    right: -5px;
    transform: none;
  }
  .news-signup.img-right .content{
    justify-content: flex-end;
  }
  .event-list .card .content-holder h3{
    font-size: 2.4rem;
  }
  .contact-cta{
    padding: 35rem 3rem 5rem;
  }
  .contact-cta .img-wrapper{
    width: 100%;
    height: 30rem;
  }
  .contact-cta .content .editable_content p,
  .contact-cta .content .editable_content{
    width: 100%;
  }
  .contact-cta .content .editable_content p{
    margin-left: 0;
  }
  .inner-intro{
    padding-top: 300px;
    height: auto;
    display: block;
    min-height: 0;
  }
  .inner-intro .img-wrapper{
    width: 100%;
    height: 270px;
  }
  .inner-intro .img-wrapper img.img-overlay{
    display: none;
  }
  .inner-intro .img-wrapper::after{
    width: 100%;
    height: 100%;
    background: url(/assets/images/layout/graphic-wave-top.svg) bottom left no-repeat;
    position: absolute;
    top: 1px;
    left: 0;
    background-size: 100% auto;
  }
  .inner-intro .content .editable_content{
    width: 100%;
  }
  .cele-strip .editable_content .grid .col-3{
    grid-column: span 6;
  }
  .wave-bottom.contact-wave{
    display: none;
  }
  .reduced-padding.wave-before{
    display: block;
    padding: 3rem;
  }
  section.error-page{
    min-height: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 50px;
  }
}
@media screen and (max-width: 768px){
  .event-feat .editable_content{
    flex-direction: column;
    gap: 2.4rem;
    align-items: flex-start;
  }
}
@media screen and (max-width: 640px){
  .cele-strip .editable_content .grid .col-3{
    grid-column: span 12;
  }
}
.team-strip{
  padding-top: 50px;
}
.team-strip .flex{
  margin-top: 3.2rem;
}
.team-strip .flex .card{
  overflow: visible;
  margin-top: 10rem;
}
.team-strip .flex .card .img-wrapper{
  aspect-ratio: 1 / 1;
  width: 20rem;
  height: auto;
  border: 3px solid var(--main);
  border-radius: 50%;
  background: white;
  overflow: hidden;
  margin: -10rem auto 0;
}
.team-strip .flex .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-strip .flex .card .content-holder h3{
  margin: 0 0 1.2rem;
  padding: 0 0 1.2rem;
  border-bottom: 2px solid hsla(0 0% 0% / .1);
}
.team-strip .flex .card .content-holder ul{
  list-style: none;
}
.team-strip .flex .card .content-holder ul a{
  text-decoration: none;
}
.content_container .content #_form_1_{
  padding: 100px 0;
  width: 100%;
  margin: 0 auto;
  max-width: 960px;
}
.content_container .content #_form_1_ ._form-content{
  display: flex;
  flex-wrap: wrap;
  gap: 0 16px;
}
.content_container .content #_form_1_ ._form-content ._form-title{
  font-size: clamp(3.2rem, 3.4vw, 4.8rem);
}
.content_container .content #_form_1_ ._form-content label,
.content_container .content #_form_1_ ._form-content p{
  font-size: 1.6rem;
  line-height: 1.4;
  font-weight: 400;
  font-family: var(--font);
  color: var(--medium);
}
.content_container .content #_form_1_ ._form-content label{
  font-size: 1.4rem;
  line-height: 1;
  margin: 0 0 4px;
}
.content_container .content #_form_1_ ._form-content select,
.content_container .content #_form_1_ ._form-content textarea,
.content_container .content #_form_1_ ._form-content input{
  border: none;
  border-radius: 0;
  outline: none;
  border-bottom: 3px solid var(--second);
  background: var(--light);
  color: var(--medium);
  min-height: 34.5px;
  font-weight: 400;
}
.content_container .content #_form_1_ ._form-content ._submit{
  background: var(--second) !important;
  color: white !important;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 300;
  padding: 2px 4rem 0 !important;
  text-decoration: none;
  border-radius: 4rem !important;
  border: none !important;
  outline: none;
  font-size: 1.6rem;
  height: 4rem;
  cursor: pointer;
  margin: 0px 0 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
  letter-spacing: .1em;
}
.content_container .content #_form_1_ ._form-content ._submit:hover{
  background: var(--main) !important;
}
.content_container .content #_form_1_ ._form-content > div{
  width: 100%;
}
.content_container .content #_form_1_ ._form-content > div:nth-child(3),
.content_container .content #_form_1_ ._form-content > div:nth-child(4){
  width: calc(50% - 8px);
}
.yspace-cards .content .flex .card .img-wrapper{
  position: relative;
  overflow: hidden;
}
.yspace-cards .content .flex .card .img-wrapper svg {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 101%;
  height: auto;
}
.yspace-cards .content .flex .card .content-wrapper{
  padding: 1.6rem;
}
.yspace-cards .content .flex .card .content-wrapper h1{
  font-size: 3rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper h2{
  font-size: 2.8rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper h3{
  font-size: 2.6rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper h4{
  font-size: 2.4rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper h5{
  font-size: 2.2rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper h6{
  font-size: 2rem;
  margin: 0 0 1.2rem;
}
.yspace-cards .content .flex .card .content-wrapper a.button{
  margin-top: 0;
}
@media screen and (max-width: 960px){
  .content_container .content #_form_1_ ._form-content > div:nth-child(3),
  .content_container .content #_form_1_ ._form-content > div:nth-child(4){
    width: 100%;
  }
}
#cc-main .cm-wrapper .cm--box{
  width: calc(100% - 2.4rem);
  margin: 0 !important;
  max-width: 960px;
  left: 50%;
  bottom: 1.6rem;
  transform: translate(-50%, 0) !important;
}
#cc-main .cm-wrapper .cm--box .cm__body{
  flex-direction: row;
  gap: 1.6rem;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__texts p.cm__desc{
  margin-top: 8px;
  line-height: 1.3;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns{
  flex-direction: row;
  gap: .8rem;
  align-items: center;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group{
  display: flex;
  flex-direction: row;
  gap: .8rem;
  align-items: center;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group button.cm__btn{
  margin: 0 !important;
  border-radius: 4rem;
  background: var(--main);
  border: none;
  height: auto;
  min-height: 0;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 400;
  padding: 11px 2.4rem 10px;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group button.cm__btn:hover{
  background: var(--second);
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group button.cm__btn.cm__btn--secondary{
  margin: 0 !important;
  background: #ebebeb;
  color: #606060;
}
#cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group button.cm__btn.cm__btn--secondary:hover{
  background: #c1c0c0;
  color: white;
}
@media screen and (max-width: 960px){
  #cc-main .cm-wrapper .cm--box .cm__body{
    flex-direction: column;
    gap: 0;
  }
  #cc-main .cm-wrapper .cm--box{
    max-width: 32rem !important;
    width: calc(100% - 2.4rem) !important;
    transform: none !important;
    left: auto;
    right: 1.2rem;
    bottom: 1.2rem;
  }
  #cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group,
  #cc-main .cm-wrapper .cm--box .cm__body .cm__btns{
    flex-direction: column;
    width: 100%;
  }
  #cc-main .cm-wrapper .cm--box .cm__body .cm__btns .cm__btn-group button.cm__btn{
    width: 100%;
  }
}
.sec-list .card a.text-link{
  font-weight: 500;
  letter-spacing: .05em;
  color: white;
}
.sec-list .card a.text-link::before{
  margin-top: -1px;
  background: white;
}
.wave-after{
  padding-bottom: 15rem;
}
.wave-above{
  padding-top: 15rem;
}
@media screen and (min-width: 2000px){
  .wave-after{
    padding-bottom: 25rem;
  }
  .wave-above{
    padding-top: 25rem;
  }
}
.faq-strip{
  padding-inline: 1.6rem;
}
.faq-wrapper{
  padding: 1.6rem;
  background: white;
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
}
.faq-wrapper .toggle_faq{
  font-size: 1.8rem;
}
@media screen and (max-width: 960px){
  .wave-above{
    padding-top: 8rem;
  }
}
.cele-list .flex a.card{
  text-decoration: none;
}
.cele-list .flex a.card .content-wrapper{
  padding: 1.6rem;
}
.cele-list .flex a.card .content-wrapper h3:hover{
  color: var(--main)
}
.cele-list .flex a.card .content-wrapper p{
  color: var(--medium);
}
.ongoing-events{
  padding-top: 20rem;
}
.special-events .flex,
.ongoing-events .flex{
  margin-top: 4rem;
}
@media screen and (max-width: 768px) {
  .content_container.colour.form-strip{
    padding-top: 0;
  }
}
.content_container.colour .content #_form_1_{
  background: var(--main) !important;
}
.content_container.colour .content #_form_1_ ._form-content ._form-title,
.content_container.colour .content #_form_1_ ._form-content label, .content_container.colour .content #_form_1_ ._form-content p{
  color: white;
}
.content_container.colour .content #_form_1_ ._form-content ._submit:hover{
  background: white !important;
  color: var(--dark) !important
}
.content_container.colour .content #_form_1_ ._form-content select, 
.content_container.colour .content #_form_1_ ._form-content textarea, 
.content_container.colour .content #_form_1_ ._form-content input{
  color: white !important;
  background: #135eaa !important;
}
.content_container.colour .content #_form_1_ ._form-content ::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: white;
  opacity: 0.5;
  font-weight: 400;
}
.content_container.colour .content #_form_1_ ._form-content ::-moz-placeholder {
  /* Firefox 19+ */
  color: white;
  opacity: 0.5;
  font-weight: 400;
}
.content_container.colour .content #_form_1_ ._form-content :-ms-input-placeholder {
  /* IE 10+ */
  color: white;
  opacity: 0.5;
  font-weight: 400;
}
.content_container.colour .content #_form_1_ ._form-content :-moz-placeholder {
  /* Firefox 18- */
  color: white;
  opacity: 0.5;
  font-weight: 400;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover, 
select:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover, 
textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: white !important;
  background: #135eaa!important;
  color: white !important;
  font-weight: 400;
  -webkit-box-shadow: 0 0 0px 40rem #135eaa inset !important;
}
.form_holder input:focus,
.form_holder select:focus,
.form_holder textarea:focus {
  background-color: #135eaa;
  color: white;
  outline: none;
  font-weight: 400;
}
.special-events .flex .card{
  width: calc(50% - 8px) !important;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 960px) {
  .special-events .flex .card{
    width: 100% !important;
  }  
}
.special-events .flex .card .img-wrapper{
  overflow: hidden;
  position: relative;
  width: 45%;
  height: 100%;
  min-height: 250px;
}
.special-events .flex .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.special-events .flex .card .img-wrapper svg.horz-card{
  left: auto;
  right: -1px;
  bottom: 0;
  width: auto;
  height: 100%;
}
.special-events .flex .card .img-wrapper svg.vert-card{
  display: none;
}
.special-events .flex .card .content-holder{
  height: auto;
  padding: 1.6rem;
  width: 55%;
}
.special-events .flex .card.event-card{
    display: flex;
    gap: 1.6rem;
    align-items: flex-start;
    padding: 1.6rem;
}
.special-events .flex .card.event-card .date-wrapper{
  width: 6.4rem;
  display: flex;
  flex-direction: column;
  color: white;
  border-radius: .4rem;
  border: 2px solid hsla(0 0% 100% / .4);
  text-align: center;
}
.special-events .flex .card.event-card .date-wrapper .date-month{
  border-bottom: 2px solid hsla(0 0% 100% / .4);
  background: hsla(0 0% 100% / .15);
  padding: 2px .8rem 0px;
}
.special-events .flex .card.event-card .date-wrapper .date-day{
  padding: .8rem .8rem 0;
  font-size: 4rem;
  font-weight: 600;
  letter-spacing: 0;
  margin: 0 0 -4px;
  line-height: 1;
}
.special-events .flex .card.event-card .date-wrapper .date-year{
  padding: 0 .8rem;
}
.special-events .flex .card.event-card .content-holder{
  width: calc(100% - 8rem);
  padding: 0;
}
@media screen and (max-width: 580px){
.special-events .flex .card.event-card .content-holder{
  width: 100%;
  padding: 0;
}
}
@media screen and (max-width: 560px) {
  .special-events .flex .card{
    flex-direction: column;
  }
  .special-events .flex .card .img-wrapper{
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 6 / 4.5;
  }
  .special-events .flex .card .content-holder{
    width: 100%;
  }
  .special-events .flex .card .img-wrapper svg.vert-card{
    display: block;
  }
  .special-events .flex .card .img-wrapper svg.horz-card{
    display: none;
  }
}
.content_container.light.faq-strip .faq-wrapper .block{
  border-color: hsla(0 0% 0% / .05);
}
.content_container.light.faq-strip .faq-wrapper .block:last-child{
  padding-bottom: 0;
}
.content_container.light.faq-strip .faq-wrapper .block ul,
.content_container.light.faq-strip .faq-wrapper .block ol{
  margin-left: 20px;
}
.contact-links ul.pages.flex{
  margin-top: 4rem;
}
.contact-links ul.pages.flex li a{
  background: var(--second);  
  line-height: 1;
  text-transform: uppercase;
  font-weight: 300;
  border-radius: 6rem;
  padding: 14px 10px 12px;

}
.contact-links ul.pages.flex li a:hover{
  background: var(--main);
  color: white;  
}
ul{
  margin-left: 20px;
}
.cele-busi-article .content{
  gap: 6.4rem;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.cele-busi-article .content img.cele-busi-img{
  border-radius: 1.6rem;
  max-width: 40rem;
  height: auto;
  width: 100%;
  overflow: hidden;
}
.cele-busi-article .content .editable_content{
  /*width: calc(100% - 46.4rem); */
  width: 100%;
}
@media screen and (max-width: 960px){
  .cele-busi-article .content{
    flex-direction: column;
    gap: 3.2rem;
  }
  .cele-busi-article .content .editable_content{
    width: 100%;
  }
}
section.top-header{
  background: #ecf0f4;
  padding: 0 3.2rem;
  width: 100%;
  z-index: 9999;
  top: 0;
  position: sticky;
}
section.top-header .content ul{
  list-style: none;
  display: flex;
  justify-content: flex-end;
  gap: 2.4rem;
}
section.top-header .content ul li a{
  font-weight: 400;
  font-size: 1.4rem;
  text-decoration: none;
  padding: 7px 16px 5px;
  display: block;
}
section.top-header .content ul li a:hover{
  background: hsla(0 0% 0% / .05);
  color: var(--main);
}
section.top-header .content ul li.spec-item a{
  background: var(--second);
  color: white;
}
section.top-header .content ul li.spec-item a:hover{
  background: #2f7938;
}
@media screen and (max-width: 960px){
  section.top-header{
    display: none;
  }
}
section.celebrate-form{
  padding-top: 50rem;
}
section.celebrate-form .img-wrapper{
  width: 100%;
  height: 66rem;
}
section.celebrate-form .img-wrapper img.img-mask {
  position: absolute;
  z-index: 2;
  top: auto;
  left: 0;
  right: auto;
  height: auto;
  width: 100%;
  bottom: -2px;
}
section.celebrate-form .content{
  max-width: 96rem;
  justify-content: center;
}
section.celebrate-form .content .editable_content{
  width: 100%;
}
section.content_container.colour.celebrate-form .content #_form_3_{
  padding: 0;
  background: none !important;
  padding-top: 2.4rem;
  border-top: 2px solid hsla(0 0% 100% / .1) !important;
  margin-top: 3.8rem;
  max-width: 100%;
}
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content select, 
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content textarea, 
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content input{
  background: #1965b2 !important;
  border: none;
  border-radius: 0;
  height: auto;
  padding: 7px 8px;
  border-bottom: 3px solid var(--second);
  color: white !important;
}
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content input:-webkit-autofill,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content input:-webkit-autofill:hover, 
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content input:-webkit-autofill:focus,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content select:-webkit-autofill,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content select:-webkit-autofill:hover, 
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content select:-webkit-autofill:focus,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content textarea:-webkit-autofill,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content textarea:-webkit-autofill:hover, 
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: white !important;
  background: #1965b2!important;
  color: white !important;
  font-weight: 400;
  -webkit-box-shadow: 0 0 0px 40rem #1965b2 inset !important;
}
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content input:focus,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content select:focus,
section.content_container.colour.celebrate-form .content #_form_3_ ._form-content textarea:focus {
  background-color: #1965b2;
  color: white;
  outline: none;
  font-weight: 400;
}
section.content_container.colour.celebrate-form .content #_form_3_ title._form-title{
  font-size: 32px;
  color: white;
  font-family: var(--font);
  font-weight: 500;
}
section.content_container.colour.celebrate-form .content #_form_3_ ._html-code,
section.content_container.colour.celebrate-form .content #_form_3_ p{
  color: white;
  margin: 0 0 1.2rem;
  font-size: 1.6rem;
  line-height: 1.4;
  font-weight: 300;
  font-family: var(--font);
}
section.content_container.colour.celebrate-form .content #_form_3_ .field-required{
  color: var(--second);
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form ._form-label{
  color: white;
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="time"]::-webkit-calendar-picker-indicator,
section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="date"]::-webkit-calendar-picker-indicator {
  background: none;
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form  ._field-wrapper{
  display: flex;
  gap: 1.6rem;
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="date"]{
  width: calc(100% - 29.6rem);
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="time"]{
  transform: translate(0, 0);
  max-width: 28rem;
  width: 100%;
}
@media screen and (max-width: 960px) {
  section.content_container.colour.celebrate-form .content #_form_3_._inline-form  ._field-wrapper{
    flex-wrap: wrap;
  }
  section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="date"],
  section.content_container.colour.celebrate-form .content #_form_3_._inline-form input[type="time"]{
    max-width: 100%;
    width: 100%;
  }
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form ._submit{
  background: var(--second) !important;
  color: white !important;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 300;
  padding: 0 4rem 0 !important;
  text-decoration: none;
  border-radius: 4rem !important;
  border: none !important;
  outline: none;
  font-size: 1.6rem;
  height: 4rem;
  cursor: pointer;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
  letter-spacing: .1em;
}
section.content_container.colour.celebrate-form .content #_form_3_._inline-form ._submit:hover{
  background: var(--orange) !important;
}
@media screen and (max-width: 1180px) {
  .cele-busi-article .content{
    gap: 3.2rem;
  }
  .cele-busi-article .content img.cele-busi-img{
    max-width: 32rem;
  }
  /*.cele-busi-article .content .editable_content{
    width: calc(100% - 35.2rem);
  }*/
}
@media screen and (max-width: 960px){
  .cele-busi-article .content{
    gap: 3.2rem;
  }
  .cele-busi-article .content img.cele-busi-img{
    max-width: 40rem;
  }
  .cele-busi-article .content .editable_content{
    width: 100%;
  }
  section.celebrate-form {
    padding-top: 42rem;
  }
  section.celebrate-form .img-wrapper{
    height: 50rem;
  }
}
@media screen and (max-width: 768px){
  ul.event-info{
    flex-direction: column;
  }
  ul.event-info li{
    width: 100%;
    border-left: none;
    border-top: 2px solid hsla(0 0% 0% / 0.1);
  }
}
/* --------- SPLASH PAGE STYLES ---------- */
.full_header.splash-header{
  top: 0;
}
.full_header.splash-header .jqueryslidemenu a.logo{
  width: 186px;
}
.full_header.splash-header .jqueryslidemenu::before{
  width: 20rem;
}
.full_header.splash-header .jqueryslidemenu::after{
  left: 20rem;
}
.full_header.splash-header .jqueryslidemenu ul{
  width: 100%;
  justify-content: flex-end;
  gap: 6.4rem;
}
.full_header.splash-header .jqueryslidemenu ul li a{
  padding-block: 2.8rem;
}
.full_header.splash-header .jqueryslidemenu ul li.spec-item a{
  background: var(--second);
  padding: 10px 3.2rem 8px;
  border-radius: 4rem;
}
.full_header.splash-header .jqueryslidemenu ul li.spec-item a:hover{
  background: var(--orange);
}
.full_header.splash-header .jqueryslidemenu ul li.spec-item a::after{
  display: none;
}
.full_header.splash-header .jqueryslidemenu span.ham-btn{
  display: none;
}
.full_header.splash-header .jqueryslidemenu span.ham-btn span{
  
}
.full_header.splash-header .jqueryslidemenu span.ham-btn span:first-child{
  
}
.full_header.splash-header .jqueryslidemenu span.ham-btn span:nth-child(2){
  
}
.full_header.splash-header .jqueryslidemenu span.ham-btn span:last-child{
  
}
.sites-strip{
  padding: 0;
  background: var(--main);
}
.sites-strip .site-list{
  display: flex;
  transition: var(--animate);
}
.sites-strip .site-list .card{
  width: 50%;
  height: calc(100svh - 7.9rem);
    min-height: 56rem;
  transition: var(--animate);
  overflow: hidden;
  position: relative;
}
.sites-strip .site-list.business-active .card,
.sites-strip .site-list.invest-active .card,
.sites-strip .site-list.talent-active .card{
  width: 33%;
}
.sites-strip .site-list.business-active .card:first-child,
.sites-strip .site-list.invest-active .card:nth-child(2),
.sites-strip .site-list.talent-active .card:last-child{
  width: 67%;
}
.sites-strip .site-list .card .card-overlay{
  width: 100%;
  height: 100%;
  background: var(--dark);
  opacity: .35;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transition: var(--animate);
}
.sites-strip .site-list .card:hover .card-overlay{
  background: var(--dark);
  opacity: .8;
}
.sites-strip .site-list .card .img-wrapper{
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  z-index: 0;
}
.sites-strip .site-list .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(0);
  transition: var(--animate);
}
.sites-strip .site-list .card:hover .img-wrapper img{
  /* filter: grayscale(1); */
}
.sites-strip .site-list .card .faded-title{
    position: absolute;
    bottom: 220px;
    right: -220px;
    color: white;
    z-index: 2;
    font-weight: 500;
    text-transform: capitalize;
    font-size: 8rem;
    width: 52rem;
    transform: rotate(-90deg);
    opacity: .7;
    transition: var(--animate);
}
.sites-strip .site-list .card:hover .faded-title{
  bottom: -33rem;
}
.sites-strip .site-list .card .content-holder{
  position: absolute;
  z-index: 3;
  bottom: 0;
  transform: translate(0 , 100%);
  transition: var(--animate);
  padding: 3.2rem;
}
.sites-strip .site-list .card:hover .content-holder{
  transform: translate(0 , 50%);
  bottom: 50%;
}
.sites-strip .site-list .card .content-holder h3{
  color: white;
  font-size: 4rem;
}
.sites-strip .site-list .card .content-holder p{
  color: white;
  max-width: 36rem;
}
.sites-strip .site-list .card .content-holder .text-link{
  color: white;
}
.sites-strip .site-list .card .content-holder .text-link::before{
  background: white;
}
/* ---------- INVEST SITE ---------- */
.invest-intro{
  overflow: hidden;
  min-height: 76.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-block: 10rem 5rem;
}
.inv-feat-serv{
  position: relative;
  z-index: 2;
  box-shadow: var(--shadow);
}
.inv-feat-serv .content{
  display: flex;
  gap: 6.4rem;
}
.inv-feat-serv .content .editable_content{
  width: 42rem;
}
.inv-feat-serv .content .flex{
  width: calc(100% - 48.4rem);
}
.inv-feat-serv .content .flex .card{
  display: flex;
  align-items: center;
  width: 100%;
  background-color: var(--main);
}
.inv-feat-serv .content .flex .card > a{
  width: 28rem;
  aspect-ratio: 6 / 4.5;
  min-height: 100%;
  position: relative;
}
.inv-feat-serv .content .flex .card > a img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inv-feat-serv .content .flex .card > a svg{
  overflow: hidden;
  position: absolute;
  top: 0;
  right: -1px;
  height: 100%;
}
.inv-feat-serv .content .flex .card > a svg path{
  fill: var(--main);
}
.inv-feat-serv .content .flex .card .content-holder{
  width: calc(100% - 28rem);
}
.inv-feat-serv .content .flex .card .content-holder h3 a,
.inv-feat-serv .content .flex .card .content-holder p,
.inv-feat-serv .content .flex .card .content-holder a.text-link{
  color: white
}
.inv-feat-serv .content .flex .card .content-holder a.text-link:hover,
.inv-feat-serv .content .flex .card .content-holder h3 a:hover{
  color: hsla(0 0% 100% / .65);
}
.inv-feat-serv .content .flex .card .content-holder a.text-link::before{
  background-color: white;
}
.inv-feat-serv .content .flex .card .content-holder a.text-link:hover::before{
  background-color: hsla(0 0% 100% / .65);
}
.inv-feat-data{
  padding-bottom: 15rem;
}
@media screen and (min-width: 1600px) {
  .inv-feat-data{
    padding-bottom: 20rem;
  }
}
@media screen and (min-width: 2400px) {
  .inv-feat-data{
    padding-bottom: 25rem;
  }
}
@media screen and (min-width: 3200px) {
  .inv-feat-data{
    padding-bottom: 30rem;
  }
}
.inv-feat-data .content .editable_content{
  max-width: 64rem;
  margin: 0 0 4rem;
}
.inv-feat-data .content .flex .card{
  padding: 4.8rem 1.6rem 1.6rem;
  position: relative;
  background: #0c549d;
  margin-top: 4.8rem;
  box-shadow: var(--shadow);
  overflow: visible;
}
.inv-feat-data .content .flex .card > a{
  display: flex;
  width: 9.6rem;
  height: 9.6rem;
  border: 2px solid white;
  background: var(--main);
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -4.8rem;
  left: calc(50% - 4.8rem);
}
.inv-feat-data .content .flex .card > a img{
  width: 5.6rem;
  height: auto;
    filter: brightness(0) invert(1);
}
.inv-feat-data .content .flex .card .content-holder{
  text-align: center;
}
.inv-feat-data .content .flex .card .content-holder h3 a{
  color: white;
  text-decoration: none;
}
.inv-feat-data .content .flex .card .content-holder h3 a:hover{
  color: hsla(0 0% 100% / .65);
}
.inv-feat-data .content .flex .card .content-holder p{
  margin: 0;
}
.inv-feat-key .content .editable_content{
  max-width: 64rem;
}
.flex.feat-key-list{
  gap: 0;
}
.flex.feat-key-list a.box{
  width: 33.3333%;
}
.flex.feat-key-list a.box h3{
  background: hsla(210 100% 30% / .65);
}
.flex.feat-key-list a.box:hover h3{
  background: hsla(210 100% 30% / .65);
  backdrop-filter: blur(8px);
}
.feat-yr .content{
  background: white;
  border-radius: 1.6rem;
  box-shadow: var(--shadow);
  padding: 3.2rem;
}
.inv-feat-serv .content .flex .card > a svg.mobile-wave{
  display: none;
}
/* ---------- Invest Media Queries ---------- */
@media screen and (max-width: 1240px) {
  .inv-feat-serv .content .flex .card .content-holder p{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .inv-feat-serv .content .flex .card > a{
    width: 20rem;
  }
  .inv-feat-serv .content .flex .card .content-holder {
    width: calc(100% - 20rem);
  }
}
@media screen and (max-width: 1024px){
  .inv-feat-serv .content{
    flex-direction: column;
    gap: 4rem;
  }
  .flex.feat-key-list a.box,
  .inv-feat-data .content .flex .card,
  .inv-feat-serv .content .flex,
  .inv-feat-serv .content .editable_content{
    width: 100%;
  }
  .inv-feat-serv .content .flex .card > a{
    width: 28rem;
  }
  .inv-feat-serv .content .flex .card .content-holder {
    width: calc(100% - 28rem);
  }
  .full_header.splash-header{
    display: block;
    background-color: white;
    border-bottom: 3px solid var(--main);
  }
  .full_header.splash-header::before,
  .full_header.splash-header .jqueryslidemenu::after{
      display: none;
  }
  .full_header.splash-header .jqueryslidemenu{
    justify-content: center;
    padding-block: 12px;
  }
  .full_header.splash-header .jqueryslidemenu nav{
    width: 100svw;
    height: calc(100svh - 66px);
    position: fixed;
    top: -110svh;
    left: 0;
    background: hsl(210 100% 30% / .9);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    transition: var(--animate);
  }
  .full_header.splash-header .jqueryslidemenu.active-nav nav{
    top: 66px;
  }
  .full_header.splash-header .jqueryslidemenu nav ul{
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4.8rem;
  }
  .full_header.splash-header .jqueryslidemenu ul li a{
    font-size: 2.2rem;
  }
  .full_header.splash-header .jqueryslidemenu span.ham-btn{
    display: flex;
    position: absolute;
    top: calc(50% - .9rem);
    left: 0;
    width: 2.4rem;
    height: 1.8rem;
    cursor: pointer;
  }
  .full_header.splash-header .jqueryslidemenu span.ham-btn span{
    width: 100%;
    height: 3px;
    background: var(--dark);
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50% , 0);
    transition: var(--animate);
  }
  .full_header.splash-header .jqueryslidemenu.active-nav span.ham-btn span{
    transform: translate(-50%, 7px) rotate(45deg);
  }
  .full_header.splash-header .jqueryslidemenu span.ham-btn span:nth-child(2){
    top: calc(50% - 1.5px);
  }
  .full_header.splash-header .jqueryslidemenu.active-nav span.ham-btn span:nth-child(2){
    opacity: 0;
  }
  .full_header.splash-header .jqueryslidemenu span.ham-btn span:last-child{
    top: auto;
    bottom: 0;
  }
  .full_header.splash-header .jqueryslidemenu.active-nav span.ham-btn span:last-child{
    transform: translate(-50%, -8px) rotate(-45deg);
  }
  .sites-strip .site-list{
    flex-direction: column;
  }
  .sites-strip .site-list .card{
    width: 100% !important;
    height: auto;
    aspect-ratio: 6 / 5;
    min-height: 30rem;
  }
  .sites-strip .site-list .card .faded-title{
    transform: none;
    bottom: 1.6rem;
    right: auto;
    left: 1.6rem;
    height: auto;
    width: calc(100% - 3.2rem);
    margin: 0;
    line-height: 1;
    font-size: clamp(2.8rem, 12.9svw, 12rem);
  }
  /* .sites-strip .site-list .card .content-holder{
    display: none;
  } */
}
@media screen and (max-width: 768px){
  .inv-feat-serv .content .flex .card > a{
    width: 20rem;
  }
  .inv-feat-serv .content .flex .card .content-holder {
    width: calc(100% - 20rem);
  }
}
@media screen and (max-width: 580px){
  .inv-feat-serv .content .flex .card{
    flex-wrap: wrap;
  }
  .inv-feat-serv .content .flex .card > a,
  .inv-feat-serv .content .flex .card .content-holder {
    width: 100%;
    height: auto;
    min-height: 0;
  }
  .inv-feat-serv .content .flex .card .content-holder p{
    display: block;
  }
  .inv-feat-serv .content .flex .card > a svg.mobile-wave{
    display: block;
    position: absolute;
    top: auto;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: auto;
  }
  .inv-feat-serv .content .flex .card > a svg.desk-wave{
    display: none;
  }
}
.editable_content iframe{
  max-width: 100%;
}
.social-ft-list{
  margin-top: 16px;
}
.landing-page .content{
  max-width: 96rem;
}
.landing-page .content .landing-list a.card{
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
  background: var(--main);
  overflow: hidden;
}
.landing-page .content .landing-list a.card .img-wrapper{
  aspect-ratio: 4 / 2.5;
  width: 100%;
  height: auto;
  overflow: hidden;
  display: block;
  margin: 0;
  position: relative;
}
.landing-page .content .landing-list a.card .img-wrapper img{
  margin: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.landing-page .content .landing-list a.card .img-wrapper svg{
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: auto;
}
.landing-page .content .landing-list a.card .img-wrapper svg path{
  fill: var(--main);
}
.landing-page .content .landing-list a.card .content-wrapper{
  padding: 0 1.6rem 1.6rem;
  display: block;
}
.landing-page .content .landing-list a.card .content-wrapper h3{
  margin: 0 0 .8rem;
  color: white;
  font-size: 2.4rem;
  line-height: 1;
  font-weight: 500;
  text-transform: capitalize;
}
.landing-page .content .landing-list a.card .content-wrapper p{
  color: white;
  margin: 0 0 1.6rem;
}
.landing-page .content .landing-list a.card .content-wrapper .text-link{
  font-weight: 500;
  letter-spacing: .05em;
  color: white;
}
.landing-page .content .landing-list a.card .content-wrapper .text-link::before{
  margin-top: -1px;
  background: white;
}
.special-events .sec-list .card .content-holder h3{
  text-transform: none;
}
.splash-page{
  background: var(--dark);
  padding: 0;
  position: relative;
  height: calc(100vh - 8rem);
}
.splash-page .splash-content-list{
  width: 100%;
  height: 100%;
  position: relative;
}
.splash-page .splash-content-list .card{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 0;
  transition: var(--animate);
}
.splash-page .splash-content-list .card.active{
  opacity: 1;
  z-index: 1;
}
.splash-page .splash-content-list .card::after{
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--dark);
  opacity: .5;
}
.splash-page .splash-content-list .card .img-wrapper{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.splash-page .splash-content-list .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.splash-page .splash-content-list .card .img-wrapper .blur{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(4px);
}
.splash-page .splash-content-list .card .content-wrapper{
  max-width: 1264px;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: absolute;
  z-index: 2;
  left: 50%;
  transform: translate(-50% , 0);
  padding-left: 3.2rem;
}
.splash-page .splash-content-list .card .content-wrapper .editable_content{
  width: 50%;
  padding: 0 6.4rem 0 0;
}
.splash-page .splash-content-list .card .content-wrapper .editable_content h2{
  color: white;
  font-size: clamp(4rem, 5vw, 7.2rem);
  color: white;
  letter-spacing: 0.025em;
  line-height: .9;
}
.splash-page .splash-content-list .card .content-wrapper .editable_content p{
  color: white;
  max-width: 36rem;
  width: 100%;
  margin: 0 0 3.2rem;
  font-size: 1.8rem;
}
.splash-page .splash-content-list .card .content-wrapper .editable_content a.superbutton:hover{
  color: var(--dark);
  background: white;
}
.splash-page .splash-box-list{
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 3;
  display: flex;
  gap: 2.4rem;
  align-items: center;
  justify-content: flex-end;
  max-width: 664px;
  padding: 8rem 3.2rem 8rem 0;
}
.splash-page .splash-box-list a.box{
  width: calc(50% - 12px);
  height: 100%;
  box-shadow: var(--shadow);
  border-radius: .8rem;
  overflow: hidden;
  position: relative;
}
.splash-page .splash-box-list a.box .img-wrapper{
  width: 100%;
  height: 100%;
}
.splash-page .splash-box-list a.box .img-wrapper img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.splash-page .splash-box-list a.box h2{
  padding: 1.6rem;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  background: linear-gradient(to bottom, transparent, hsla(0 0% 0% / .5) calc(100% - 4rem), hsla(0 0% 0% / .5) 100%);
  color: white;
  margin: 0;
  font-size: 2.4rem;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
transition: var(--animate);
}
.splash-page .splash-box-list a.box:hover h2{
  background: hsla(0 0% 0% / .5);
}
@media screen and (max-width: 1024px){
  .full_header.splash-header .jqueryslidemenu a.logo{
    width: 20rem;
  }
  .splash-page{
    height: calc(100svh - 7.2rem);
  }
  .splash-page .splash-content-list .card .content-wrapper{
    height: calc(100% - 32rem);
    padding: 0 3.2rem;
  }
  .splash-page .splash-content-list .card .content-wrapper .editable_content{
    padding: 0;
    width: 100%;
  }
  .splash-page .splash-box-list{
    padding: 3.2rem;
    max-width: 100%;
    width: 100%;
    left: 0;
    top: auto;
    bottom: 0;
    height: 32rem;
  }
}
@media screen and (max-width: 680px){
  .splash-page .splash-content-list .card .content-wrapper{
    height: calc(100% - 24rem);
    padding: 0 1.6rem;
  }
  .splash-page .splash-box-list{
    padding: 1.6rem;
    height: 24rem;
  }
  /*.splash-page .splash-box-list a.box{
    width: 100%;
  }*/
}
.banner-container-constrained.landing-banner .ms-banner-constrained li .img-wrapper:after{
    background: linear-gradient(to right, hsla(0 0% 0% / .8), transparent);
}
.landing-banner .ms-banner-constrained li .img-wrapper{
    width: 100%;
}
@media screen and (max-width: 960px) {  
  .banner-container-constrained.landing-banner{
    background: var(--light);
  }
  .banner-container-constrained.landing-banner .banner-details .h1{
    color: var(--dark);
  }
  .banner-container-constrained.landing-banner .banner-details p{
    color: var(--medium);
  }
}
.new-news-list .card{
  box-shadow: none;
  background: none;
  border-radius: 0;
}
.new-news-list .card a.img-wrapper{
  display: block;
  border-radius: .8rem;
  overflow: hidden;
  width: 75%;
}
@media screen and (max-width: 520px) {
  .new-news-list .card a.img-wrapper{
    width: 100%;
  }
}
.new-news-list .card  .content-holder{
  padding: 1.6rem 0;
}
.new-news-list .card  .content-holder h3{
  font-size: 2.2rem;
  line-height: 1.3;
}
#menu > ul.mm-panel li.top-btn.first-btn{
  margin-top: auto;
}
#menu > ul.mm-panel{
  display: flex;
  flex-direction: column;
  padding-bottom: 0;
}
#menu > ul.mm-panel li.top-btn::after{
  border-color: rgb(202 205 208);
}
#menu > ul.mm-panel li.top-btn a{
  background: #ecf0f4;
  color: var(--main);
}
#menu > ul.mm-panel li.top-btn a:hover{
  background: #e0e4e8;
}
#menu > ul.mm-panel li.top-btn.accent-btn a{
  background: var(--second);
  color: white;
}
#menu > ul.mm-panel li.top-btn.accent-btn a:hover{
  background: #2f7938;
}
#menu > ul.mm-panel li.top-btn.accent-btn::after{
  display: none;
}
@media screen and (max-width: 1240px) {
  footer .sitemap ul li {
    width: calc(50% - .8rem);
  }
}
@media screen and (max-width: 1080px){
  footer .footer-contact {
    width: 22rem;
  }
  footer .sitemap {
    width: calc(100% - 65.6rem);
  }
}
@media screen and (max-width: 960px){
  footer .sitemap ul li,
  footer .footer-contact,
  footer .sitemap {
    width: 100%;
  }
}