@import url(jquery-1.11.3-ui.css);
@import url(swipe.css);
@import url(mmenu.css);
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@font-face {
  font-family: 'RunawaysLight';
  src: url('/assets/fonts/RunawaysLight.eot');
  src: url('/assets/fonts/RunawaysLight.eot') format('embedded-opentype'),
    url('/assets/fonts/RunawaysLight.woff2') format('woff2'),
    url('/assets/fonts/RunawaysLight.woff') format('woff'),
    url('/assets/fonts/RunawaysLight.ttf') format('truetype'),
    url('/assets/fonts/RunawaysLight.svg#RunawaysLight') format('svg');
}
@font-face {
  font-family: 'RunawaysThin';
  src: url('/assets/fonts/RunawaysThin.eot');
  src: url('/assets/fonts/RunawaysThin.eot') format('embedded-opentype'),
       url('/assets/fonts/RunawaysThin.woff2') format('woff2'),
       url('/assets/fonts/RunawaysThin.woff') format('woff'),
       url('/assets/fonts/RunawaysThin.ttf') format('truetype'),
       url('/assets/fonts/RunawaysThin.svg#RunawaysThin') format('svg');
}
@font-face {
  font-family: 'GilroyUltraLightCopy';
  src: url('/assets/fonts/GilroyUltraLightCopy.eot');
  src: url('/assets/fonts/GilroyUltraLightCopy.eot') format('embedded-opentype'),
    url('/assets/fonts/GilroyUltraLightCopy.woff2') format('woff2'),
    url('/assets/fonts/GilroyUltraLightCopy.woff') format('woff'),
    url('/assets/fonts/GilroyUltraLightCopy.ttf') format('truetype'),
    url('/assets/fonts/GilroyUltraLightCopy.svg#GilroyUltraLightCopy') format('svg');
}
@font-face {
    font-family: 'GardenaHolmesScript';
  src: url('/assets/fonts/GardenaHolmesScript.eot');
  src: url('/assets/fonts/GardenaHolmesScript.eot') format('embedded-opentype'),
    url('/assets/fonts/GardenaHolmesScript.woff2') format('woff2'),
    url('/assets/fonts/GardenaHolmesScript.woff') format('woff'),
    url('/assets/fonts/GardenaHolmesScript.ttf') format('truetype'),
    url('/assets/fonts/GardenaHolmesScript.svg#GardenaHolmesScript') format('svg');
}
:root {
  --success: rgb(53, 124, 57);
  --alert: rgb(244, 203, 79);
  --warning: rgb(244, 134, 79);
  --danger: rgb(140, 38, 38);
  --dark: #444545;
  --medium: #444545;
  --light: #F2EFEB;
  --light-light: #FEFAF6;
  --main: #A397AF;
  --second: #A8C7C6;
  --font: "Lato", serif;
  --font-heading: 'GilroyUltraLightCopy', sans-serif;
  --font-sub: 'RunawaysThin', sans-serif;
  --animate: all 0.35s ease-in-out;
  --shadow: 0 0 1.6rem 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
*/

/* ---------- 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: bold;
}
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(--medium);
}
a:hover {
  color: var(--main);
  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: 400;
  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{
  text-transform: capitalize;
  font-weight: 400;
  font-family: var(--font-heading);
}
h5, .h5,
h6, .h6 {
  /*text-transform: uppercase;
  font-weight: 400;
  font-family: var(--font-sub);*/
  font-weight: 600;
  letter-spacing: .15em;
  font-style: italic;
  font-family: var(--font);
}
h1, .h1 {
  font-size: clamp(3.6rem, 8vw, 5.6rem);
}
h2, .h2 {
  font-size: clamp(3.2rem, 8vw, 4.8rem);
}
h3, .h3 {
  font-size: clamp(2.8rem, 8vw, 4rem);
}
h4, .h4 {
  font-size: clamp(2.4rem, 8vw, 3.2rem);
}
h5, .h5 {
  font-size: clamp(1.8rem, 8vw, 2.2rem);
}
h6, .h6 {
  font-size: clamp(1.6rem, 8vw, 1.8rem);
}
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: var(--light-light);
}
.dark :is(h5,.h5,h6,.h6){
  color: var(--main);
}
.medium :is(h5,.h5,h6,.h6),
.colour :is(h5,.h5,h6,.h6){
  color: var(--light-light);
}
.colour a,
.medium a,
.dark a {
  color: var(--light-light);
}
.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: white;
  color: var(--dark);
}
.colour :is(input.superbutton:hover, a.button:hover, button.superbutton:hover, a.superbutton:hover, .superbutton:hover) {
  background: var(--dark);
  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 ---------- */

/* ----- Top Header ----- */
.top-header {
  background: var(--light);
  border-bottom: 1px solid hsl(0 0% 80%);
  padding: .8rem 3.2rem;
}
.top-header .content {
  display: flex;
  justify-content: flex-end;
  gap: var(--grid-gap);
  align-items: center;
}
.top-header .content .language{
  font-size: 1.4rem;
  line-height: 1;
  text-transform: uppercase;
  display: flex;
  gap: .8rem;
  margin-right: auto;
}
.top-header .content .language span{
  display: block;
}
.top-header .content .language span:first-of-type{
  padding-right: .8rem;
  border-right: 2px solid hsla(0 0% 0% / .1);
}
.top-header .content > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: var(--grid-gap);
}
.top-header .content > ul li {
  font-size: 1.4rem;
  line-height: 1;
  text-transform: uppercase;
  color: var(--medium);
}
.top-header .content > ul li a{
  color: var(--medium);
  text-decoration: none;
}
.top-header .content > ul li a:hover{
  color: var(--main);
}
.top-header .content .social_media ul {
  gap: calc(var(--grid-gap) / 2);
}
.top-header .content .social_media ul li {
  margin: 0;
}
.top-header .content .social_media ul li a {
  width: 2.8rem;
  height: 2.8rem;
  background: var(--medium);
  color: var(--light);
}
.top-header .content .social_media ul li a:hover{
  background: var(--main);
}
.top-header .content .social_media ul li a i {
  font-size: 1.2rem;
}
@media screen and (max-width: 960px) {
  .top-header {
    display: none;
  }
}
/* ----- Full Header ----- */
.full_header {
  display: none;
  background: white;
  width: 100%;
  z-index: 999;
  top: 0;
  position: sticky;
  padding: 0 3.2rem;
  box-shadow: var(--shadow);
}
.jqueryslidemenu {
  width: 100%;
  max-width: 1264px;
  gap: 3.2rem;
  padding: 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.jqueryslidemenu a.logo {
  width: 300px;
  display: block;
  margin: 0;
  padding: 0;
}
.jqueryslidemenu a.logo img {
  width: 100%;
  height: auto;
}
.jqueryslidemenu nav{
  width: calc(100% - 348px);
}
.jqueryslidemenu ul {
  width: 100%;
  list-style: none;
  display: flex;
  justify-content: right;
  align-items: center;
}
.jqueryslidemenu ul li {
  position: relative;
  margin: 0;
}
.jqueryslidemenu ul li.mobile-item {
  display: none;
}
.jqueryslidemenu ul li a {
  width: 100%;
  padding: 10px;
  display: block;
  color: var(--dark);
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 600;
  text-decoration: none;
  position: relative;
}
.jqueryslidemenu ul li a:hover,
.jqueryslidemenu ul li:hover a,
.jqueryslidemenu ul li.Selected a,
.jqueryslidemenu ul li.Selected a:hover {
  color: var(--dark);
}
.jqueryslidemenu ul li a::after {
  content: "";
  background: var(--main);
  width: 0;
  height: 3px;
  position: absolute;
  left: 50%;
  bottom: 0;
  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.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: 300px;
  background: var(--main);
}
.jqueryslidemenu ul li:hover ul{
  opacity: 1;
  visibility: visible;
}
.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;
  line-height: 1.2;
}
.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: var(--light-light);
  box-shadow: var(--shadow);
  padding: .8rem 0;
  width: 100%;
  z-index: 999;
  position: sticky;
  display: inherit;
  top: 0;
}
@media (min-width: 960px) {
  .mobile_header {
    display: none;
  }
}
.mobile_header .logo_area {
  padding: 0px 3rem;
  width: 100%;
}
.mobile_header .logo_area > a{
  width: 14rem;
  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;
  font-weight: 600;
  padding: 1.6rem;
  font-size: 1.6rem;
  line-height: 1;
  font-weight: 600;
  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(--dark);
  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(--main);
}
footer .sitemap{
  width: calc(100% - 67.6rem);
}
footer .sitemap ul{
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.6rem;
}
footer .sitemap ul ul{
  display: none;
}
footer .sitemap ul li{
  width: calc(50% - 8px);
}
footer .footer-contact{
  width: 26rem;
}
footer .footer-social{
  width: 16rem;
}
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(--dark);
}
footer .social_media ul li a:hover{
  background: var(--main);
  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(--main);
}
@media screen and (max-width: 960px){
  footer .content{
    flex-direction: column;
    align-items: center;
    gap: 3.2rem;
    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 {
  font-family: var(--font-sub);
  background: var(--main);
  color: white;
  line-height: 1;
  padding: 2px 4rem 0;
  text-decoration: none;
  border-radius: 0;
  border: none;
  outline: none;
  text-transform: uppercase;
  letter-spacing: .1em;
  line-height: 1.2;
  font-size: 1.4rem;
  font-weight: 300;
  height: 4.8rem;
  cursor: pointer;
  margin: 3.2rem 0 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
  text-align: center;
}
@media screen and (max-width: 560px) {
  input.superbutton,
  a.button,
  button.superbutton,
  a.superbutton,
  .superbutton{
    height: auto;
    padding-block: 8px 6px;
  }
}
input.superbutton:hover,
a.button:hover,
button.superbutton:hover,
a.superbutton:hover,
.superbutton:hover {
  background: var(--second);
}
.text-link{
  color: var(--dark);
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  transition: var(--animate);
  font-family: var(--font-sub);
  font-weight: 300;
  font-size: 1.4rem;
  line-height: 1;
}
.text-link:hover{
  color: var(--dark);
}
.text-link::before{
  content: '';
  transform: translate(0 , -1px);
  display: block;
  width: 2.4rem;
  height: .1rem;
  background: var(--dark);
  transition: var(--animate);
}
.text-link:hover::before{
  width: 4rem;
}

/* ---------- 9. Banner Styles ---------- */

/* ----- Banner Structure ----- */
.banner-container-constrained {
  position: relative;
  height: calc(100svh - 119px);
}
ul.ms-banner-constrained {
  display: inline-flex;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
ul.ms-banner-constrained li {
  list-style: none;
  width: 100%;
  flex-shrink: 0;
  position: relative;
  opacity: 0;
}
.ms-banner-constrained li:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  background: var(--dark);
  opacity: .5;
}
.ms-banner-constrained li .img-wrapper{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
.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: center;
  align-items: center;
  text-align: center;
}
.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: center;
}
.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, 8vw, 8rem);
  margin-bottom: 1.6rem;
}
.banner-container-constrained .banner-details p{
  margin-bottom: 3.2rem;
  max-width: 48rem;
  width: 100%;
}
.banner-container-constrained .banner-details a.superbutton {
  margin: 0;
}
@media screen and (max-width: 960px) {
  .banner-container-constrained{
    height: auto;
    background: var(--main);
  }
  .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;
  }
  .ms-banner-constrained li .banner-details .h6,
  .banner-container-constrained .banner-details .h1,
  .banner-container-constrained .banner-details p{
    color: var(--light-light);
  }
  .banner-container-constrained .banner-details a.superbutton {
    color: var(--dark);
    background: var(--light-light);
  }
  .banner-container-constrained .banner-details a.superbutton:hover {
    background: var(--second);
    color: var(--light-light);
  }
}
/* ----- Banner Navigation ----- */
.banner-container-constrained .banner-next,
.banner-container-constrained .banner-previous,
.banner-container-constrained .banner-pause {
  opacity: 0;
  position: absolute;
  bottom: 8px;
  right: 8px;
  border-radius: 50%;
  display: flex !important;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 4rem;
  height: 4rem;
  background: var(--second);
  text-decoration: none;
  transition: var(--animate);
  z-index: 2;
}
.banner-container-constrained .banner-next:hover,
.banner-container-constrained .banner-previous:hover,
.banner-container-constrained .banner-pause:hover {
  background: var(--main);
  transition: var(--animate);
}
.banner-container-constrained .banner-previous {
  right: 5.6rem;
}
.banner-container-constrained .banner-pause {
  right: 10rem;
  color: white;
}
.banner-container-constrained .banner-pause:hover i {
  color: white;
}
.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.2rem;
  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: white;
}
@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;
  min-height: 3.6rem;
}
.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);
  margin: 0 0 6px;

}
.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 {
  font-family: var(--font-sub);
  background: var(--main);
  color: white;
  line-height: 1;
  padding: 2px 4rem 0;
  text-decoration: none;
  border-radius: 0;
  border: none;
  outline: none;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 1.4rem;
  font-weight: 300;
  height: 4.8rem;
  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(--second);
}
/* ----- 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;
  position: sticky;
  top: 11rem;
  background: var(--light);
}
.strip-list:nth-of-type(2n) {
  background: var(--light-light);
}
/*.strip-list .img-holder {
  width: 33.3333%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.strip-list .img-holder::before{
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 1px;
  background: linear-gradient(to right, transparent 0%, var(--light-light) 100%);
}
.strip-list .img-holder img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.strip-list:nth-last-of-type(2n) .img-holder {
  left: auto;
  right: 0;
}
.strip-list:nth-last-of-type(2n) .img-holder::before{
  left: -1px;
  background: linear-gradient(to left, transparent 0%, var(--light) 100%);
} */
.strip-list .content {
  display: flex;
  justify-content:  space-between;
}
.strip-list .content .img-holder{
  width: 30rem;
  height: auto;
  aspect-ratio: 4.5 / 6;
  border-radius: 20rem;
  overflow: hidden;
}
.strip-list .content .img-holder img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*.strip-list:nth-last-of-type(2n) .content {
  justify-content: flex-start;
} */
.strip-list .content .editable_content {
  width: calc(100% - 34.8rem);
}
@media screen and (max-width: 1024px) {
  .strip-list {
    padding: 28rem 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 0 1.2rem;
  padding: 0;
}
div.toggler > *:last-child{
  margin-bottom: 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 .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: 2rem;
}
.faq-wrapper .toggle_faq{
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: .4rem;
  font-size: 2rem;
  line-height: 1.2;
  margin: 0;
  cursor: pointer;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .faq-wrapper .toggle_faq{
    font-size: 1.8rem;
  }
}
.faq-wrapper .toggle_faq .faq-title{
  width: calc(100% - 4rem);
  padding-top: 4px;
}
.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(--main);
  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;
}
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;
}
.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: column-reverse;
}
.categories-page .flex{
  width: 100%;
}
.categories-page aside.categories{
  width: 100%;
  padding: 0 0 2.4rem 0;
  margin: 0 0 2.4rem;
  border-bottom: 2px solid hsla(0 0% 0% / .1);
  display: flex;
  gap: 1.6rem;
  flex-wrap: wrap;

}
.categories-page aside.categories span.cat-wrapper{
  display: block;
  width: calc(50% - .8rem);
}
@media screen and (max-width: 960px){
  .categories-page aside.categories span.cat-wrapper{
    width: 100%;
  }
}
.categories-page aside.categories h2{
  font-size: 1.8rem;
  letter-spacing: 0;
  margin: 0 0 .4rem;
  /* margin: 0 0 .8rem;
  padding: 0 0 .8rem;
  border-bottom: 2px solid hsla(0 0% 0% / .1);*/
}
.categories-page aside.categories span.cat-wrapper select{
  width: 100%;
  border: none;
  border-bottom: 2px solid var(--main);
  background: var(--light-light);
  padding: .4rem;
  border-radius: 0;
  color: var(--dark);
}
.categories-page aside.categories ul{
  list-style: none;
  display: flex;
  gap: .8rem;
  flex-direction: row;
  flex-wrap: wrap;
}
.categories-page aside.categories ul li{
  border: 1px solid hsla(0 0% 0% / .1);
  cursor: pointer;
  padding: .3rem 2.4rem .4rem;
  border-radius: 2rem;
  background: hsla(0 0% 0% / .03);
}
/*.categories-page aside.categories ul li:last-child{
  border: none;
}*/
.therapist-details{
  padding: 2.4rem 0 0;
  border-top: 2px solid hsla(0 0% 0% / .1);
  width: 100%;
}
.therapist-details h3{
  font-size: 2.4rem;
  margin: 0 0 1.6rem;
}
.therapist-details ul.category-list{
  list-style: none;
  display: flex;
  gap: .8rem;
  flex-direction: row;
  flex-wrap: wrap;
}
.therapist-details .detail-section{
  margin: 0 0 2.4rem;
}
/*.therapist-details .detail-section > div,*/
.therapist-details ul.category-list li{
  padding: .3rem 2.4rem .4rem;
  border-radius: 2rem;
  background: var(--second);
  width: auto;
  display: inline-block;
  color: white;
}
.categories-page aside.categories ul li.active{
  background: hsla(0 0% 0% / .4);
  color: white;
}
@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;
}
/* ---------- CUSTOM STYLES ---------- */
.full_header{
  background: none;
  box-shadow: none;
  background: var(--light);
  transition: var(--animate);
}
.full_header.header-bg{
  background: var(--light-light);
  box-shadow: var(--shadow);
}
.jqueryslidemenu a.logo{
  width: 14rem;
}
.jqueryslidemenu nav{
  width: 100%;
  max-width: 105rem;
}
.jqueryslidemenu nav ul{
  justify-content: space-between;
}
.jqueryslidemenu nav ul li a{
  font-family: var(--font-sub);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 1.4rem;
  line-height: 1;
  padding: 48px 0;
  font-weight: 300;
}
.jqueryslidemenu nav ul li a::after{
  height: 2px;
  bottom: 42px;
}
.jqueryslidemenu nav > ul > ul > li:last-child a{
  font-family: var(--font-sub);
  background: var(--main);
  color: white;
  line-height: 1;
  padding: 2px 2rem 0;
  text-decoration: none;
  border-radius: 0;
  border: none;
  outline: none;
  text-transform: uppercase;
  letter-spacing: 0;
  font-size: 1.4rem;
  font-weight: 300;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--animate);
  margin: 0;
  height: 4rem;
}
.jqueryslidemenu nav > ul > ul > li:last-child a:hover{
  background: var(--second);
}
.jqueryslidemenu nav > ul > ul > li:last-child a::after{
  display: none;
}
.banner-container-constrained{
  height: calc(100svh - 110px);
  background: var(--light);
}
.ms-banner-constrained li:after{
  display: none;
}
.ms-banner-constrained li .img-wrapper{
  width: 57%;
  left: auto;
  right: 0;
  border-radius: 3.2rem 0 0 3.2rem;
  overflow: hidden;
}
.ms-banner-constrained li .banner-details,
.ms-banner-constrained li.banner-right .banner-details,
.ms-banner-constrained li.banner-left .banner-details{
  text-align: left;
  justify-content: flex-start;
}
.ms-banner-constrained li .banner-details .banner-content{
  width: 43%;
  padding-right: 24px;
}
.ms-banner-constrained li .banner-details .banner-content,
.ms-banner-constrained li.banner-right .banner-details .banner-content{
  align-items: flex-start;
}
.intro-strip{
  padding: 14rem 3.2rem;
}
.intro-strip .content{
  padding-block: 6.4rem;
  position: relative;
  justify-content: flex-end;
  display: flex;
}
.intro-strip .content .img-wrapper{
  width: 33%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 40rem;
  overflow: hidden;
}
.intro-strip .content .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
}
.intro-strip .content .editable_content{
  padding: 5.2rem 3.2rem 5.2rem calc(23% + 3.2rem);
  border-radius: 1.6rem;
  background: var(--light-light);
  box-shadow: var(--shadow);
  width: 90%;
}
.feat-spec{
  position: relative;
  padding: 8.8rem 3.2rem;
  background: linear-gradient(to bottom, var(--light-light) 0, var(--light-light) 32px, var(--main) 32px, var(--main) calc(100% - 32px), var(--light) calc(100% - 32px), var(--light) 100%);
}
.feat-spec .content h2{
  margin-bottom: 1.6rem;
}
.feat-spec .content .flex{
  flex-direction: column;
  gap: 0;
  width: calc(58.5% - 3.2rem);
}
.feat-spec .content .flex .card{
  width: 100%;
  position: initial;
  transform: none !important;
  border-bottom: 2px solid hsl(34 21% 94% / .2);
  padding-block: 2.4rem;
}
.feat-spec .content .flex .card:last-of-type{
  border: none;
}
.feat-spec .content .flex .card .img-wrapper{
  position: absolute;
  right: 0;
  top: 0;
  width: 41.5%;
  height: 100%;
  border-radius: 3.2rem 0 0 3.2rem;
  overflow: hidden;
  z-index: -1;
  opacity: 0;
  transition: all .5s ease-in-out;
}
.feat-spec .content .flex .card.active .img-wrapper{
  z-index: 1;
  opacity: 1;
}
.feat-spec .content .flex .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.feat-spec .content .flex .card .content-wrapper h3{
  font-size: 2.4rem;
  line-height: 1.1;
  margin: 0;
  cursor: pointer;
}
.feat-spec .content .flex .card .content-wrapper .content-holder{
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: all .5s ease-in-out;
}
.feat-spec .content .flex .card.active .content-wrapper .content-holder{
  padding-top: 1.4rem;
  height: 9.8rem;
  opacity: 1;
}
.feat-spec .content .flex .card .content-wrapper .content-holder a.text-link{
  margin: 0 1.6rem 0 0;
  color: var(--light-light);
}
.feat-spec .content .flex .card .content-wrapper .content-holder a.text-link::before{
  background: var(--light-light);
}
.how-it-works{
  padding-block: 14rem;
}
.how-it-works .editable_content .grid .col-6{
  padding: 1.6rem;
  border-radius: 1.6rem;
  background: var(--light-light);
  box-shadow: var(--shadow);
}
.client-groups{
  padding-block: 8rem;
}
.client-groups::after{
  display: none;
}
.client-groups .content{
  display: flex;
  justify-content: flex-end;
}
.client-groups .content .editable_content{
  background: var(--light-light);
  padding: 2.4rem;
  border-radius: 1.6rem;
  box-shadow: var(--shadow);
  max-width: 58rem;
  width: 100%;
}
.client-groups .content .editable_content ul{
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .8rem;
  margin: 0;
}
.client-groups .content .editable_content ul li{
  display: flex;
  align-items: center;
  text-transform: capitalize;
  font-weight: 400;
  font-family: var(--font-heading);
  font-size: 2.4rem;
  margin: 0;
  gap: .8rem;
}
.client-groups .content .editable_content ul li::before{
  content: '';
  background-image: url(/assets/images/layout/icon-list.png);
  width: 2.4rem;
  height: 2.4rem;
  display: flex;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.flex.articles-list{

}
.flex.articles-list .card{
  position: relative;
  display: flex;
  justify-content: flex-end;
  padding-top: 6.4rem;
}
.flex.articles-list .card .img-wrapper{
  width: 37%;
  height: calc(100% - 1.6rem);
  border-radius: 20rem 20rem 0 0;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
.flex.articles-list .card .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.flex.articles-list .card .date-wrapper{
  position: absolute;
  top: 32px;
  left: 37%;
  background: var(--second);
  width: 5.6rem;
  padding: 1.6rem 0;
  border-radius: 4rem;
  text-align: center;
  color: var(--light-light);
  font-family: var(--font-heading);
  transform: translate(-70%, 0);
}
.flex.articles-list .card .date-wrapper .day{
  font-size: 42px;
  line-height: 1;
}
.flex.articles-list .card .date-wrapper .month{
  font-size: 1.4rem;
  line-height: 1;
  letter-spacing: .2em;
}
.flex.articles-list .card .content-holder{
  background: var(--light-light);
  box-shadow: var(--shadow);
  border-radius: 1.6rem;
  padding: 3.2rem 1.6rem 3.2rem calc(20% + 28px);
  width: 83%;
}
.flex.articles-list .card .content-holder h3{
  font-size: 2.4rem;
  line-height: 1.2;
  margin: 0;
}
.feat-news{
  padding-block: 8rem;
}
.wave-top,
.wave-bottom{
  width: 100%;
  /*aspect-ratio: 1366 / 86; */
  position: relative;
  transform: translate(0 , -1px);
  z-index: 2;
}
.wave-top{
  transform: translate(0 , 1px);
}
.wave-top img,
.wave-bottom img{
  width: 100%;
  height: auto;
  position: absolute;
}
.wave-top img{
  top: auto;
  bottom: 0;
}
.wave-before{
  padding-top: 22rem;
}
.wave-after{
  padding-bottom: 18rem;
}
.book-cta{
  position: relative;
  background: var(--light-light);
  z-index: 1;
  padding-bottom: 14rem;
}
.book-cta .img-wrapper{
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.book-cta .img-wrapper::before{
  content: '';
  width: 75%;
  height: 100%;
  left: -1px;
  top: 0;
  position: absolute;
  background: linear-gradient(to right, var(--light-light) 0%, transparent 100%);
}
.book-cta .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover; 
  object-position: left center;
}
.book-cta .content .editable_content{
  width: calc(50% - 4rem);
}
.book-cta .content .editable_content .button{
  margin-top: 0;
}
.book-cta .content .editable_content .btn-wrapper{
  display: flex;
  flex-wrap: wrap;
  gap: 1.6rem;
  margin-top: 2.4rem;
}
.book-cta .content .editable_content .btn-wrapper .superbutton{
  margin: 0;
}
.inner-intro{
  background: var(--light-light);
  position: relative;
  z-index: 0;
}
.inner-intro .img-wrapper{
  width: 42%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0 3.2rem 3.2rem 0;
  overflow: hidden;
}
.inner-intro .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inner-intro .content{
  display: flex;
  justify-content: flex-end;
}
.inner-intro .content .editable_content{
  width: calc(58% - 4.8rem);
}
.about-second-strip .col-6{
  padding: 1.6rem;
  border-radius: 1.6rem;
  background: var(--light-light);
  box-shadow: var(--shadow);
}
.about-second-strip .col-6 h4{
  font-size: 2.4rem;
  margin: 0 0 1.2rem;
}
.about-second-strip .col-6 ul{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0 8px;
}
.about-second-strip .col-6 ul li{
  width: calc(50% - 4px);
}
/* .categories-page aside.categories h2{
  position: relative;
  font-size: 2rem;
}
.categories-page aside.categories h2::after,
.categories-page aside.categories h2::before{
  content: '';
  height: 1.2rem;
  width: .1rem;
  background: var(--dark);
  position: absolute;
  right: .6rem;
  top: calc(50% - .6rem);
}
.categories-page aside.categories h2::after{
  transform: rotate(90deg);
}
.categories-page aside.categories h2.active::before{
  opacity: 0;
} */
.categories-page aside.categories ul li{
  font-size: 1.4rem;
}
.categories-page aside.categories ul{
  height: 0;
  opacity: 0;
  overflow: hidden;
}
.categories-page aside.categories ul.active{
  height: auto;
  opacity: 1;
  margin-bottom: 2rem;
}
.team-list .card{
  background: var(--light-light);
  display: flex;
  flex-direction: column;
}
.team-list .card img{
  background: #d7d1dd;
}
.team-list .card h3{
  border-bottom: 1px solid hsla(0 0% 0% / .1);
  padding: 0 0 1.2rem;
  margin-bottom: 1.2rem;
}
.team-list .card .content-holder{
  padding: 1.6rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.team-list .card .content-holder pre{
  margin: 0 0 1.6rem;
}
.team-list .card .superbutton{
  width: 100%;
  margin: auto 0 0 !important;
}
.team-list .card .superbutton.alt-btn{
  margin: 1.6rem 0 0 !important;
  background: var(--second);
}
.team-list .card .superbutton.alt-btn:hover{
  color: white;
  background: var(--dark);
}
.card .timezone,
.card ul.category-list{
  border-bottom: 1px solid hsla(0 0% 0% / .1);
  padding: 0 0 1.2rem;
  margin-bottom: 1.2rem;
}
.card .content-holder ul.category-list:first-of-type{
  margin: 0;
  border: none;
}
.card ul.category-list li{
  padding-right: .8rem;
  border-right: 1px solid hsla(0 0% 0% / .1);
}
.card ul.category-list li:last-child{
  border-right: none;
  padding-right: 0;
}
.thera-page .content{
  display: flex;
  flex-wrap: wrap;
  gap: 2.4rem;
}
.thera-page .img-aside{
  width: 32rem;
  margin: 0;
}
.thera-page .img-wrapper{
  aspect-ratio: 4.5 / 6;
  border-radius: 20rem;
  max-width: 32rem;
  width: 100%;
  height: auto;
  overflow: hidden;
}
.thera-page .img-aside a.superbutton{
  width: 100%;
  margin: 2.4rem 0 0;
  text-align: center;
}
.thera-page .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.thera-page .content .editable_content{
  width: calc(100% - 34.4rem);
}
.spec-list a.box{
  border-radius: 1.6rem;
  overflow: hidden;
}
.spec-list a.box .content-wrapper{
  position: absolute;
  top: 0;
  left: 0;
  padding: 1.6rem;
  background: hsla(0 1% 27% / .4);
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  flex-direction: column;
  transition: var(--animate);
}
.spec-list a.box:hover .content-wrapper{
  background: hsla(0 1% 27% / .8);
}
.spec-list a.box .content-wrapper h3{
  position: initial;
  height: auto;
  width: auto;
  background: none;
  padding: 0;
  color: var(--light-light);
  transition: var(--animate);
  margin: 0;
  font-weight: 600;
}
.spec-list a.box:hover .content-wrapper h3{
  margin: 0 0 12px;
}
.spec-list a.box .content-wrapper p{
  color: var(--light-light);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: var(--animate);
}
.spec-list a.box:hover .content-wrapper p{
  margin: 0 0 12px;
  opacity: 1;
  height: calc(1.6rem * 1.4 * 3);
}
.spec-list a.box .content-wrapper .text-link{
  color: var(--light-light);
  height: 0;
  opacity: 0;
  transition: var(--animate);
}
.spec-list a.box .content-wrapper .text-link::before{
  background: var(--light-light);
}
.spec-list a.box:hover .content-wrapper .text-link{
  height: 1.4rem;
  opacity: 1;
}
.spec-intro .content{
  background: var(--light-light);
  padding: 3.2rem 2.4rem;
  border-radius: 1.6rem;
  box-shadow: var(--shadow);
}
.book-cta.less-pad{
  padding-top: 14rem;
}
.form-strip{
  background: var(--light-light);
}
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: var(--medium) !important;
  background: var(--light)!important;
  color: var(--medium) !important;
  -webkit-box-shadow: 0 0 0px 40rem var(--light) inset !important;
}
.form_holder input:focus,
.form_holder select:focus,
.form_holder textarea:focus {
  background-color: var(--light);
  color: var(--medium);
  outline: none;
}
.contact-page ul.contact-list{
  display: flex;
  flex-direction: column;
  padding-block: 1.6rem;
  margin: 1.6rem 0;
  gap: 1.6rem;
  border-bottom: 1px solid hsla(0 0% 0% / .1);
  border-top: 1px solid hsla(0 0% 0% / .1);
}
.contact-page ul.contact-list li{
  display: flex;
  align-items: center;
  gap: .8rem;
}
.contact-page ul.contact-list li i{
  color: var(--main);
}
.contact-page .social_media ul{
  justify-content: flex-start;
}
.contact-page .social_media ul li a{
  width: 3.2rem;
  height: 3.2rem
}
.contact-page .social_media ul li a:hover{
  background: var(--second);
}
.contact-page .social_media ul li a i{
  font-size: 1.6rem;
}
#menu #mm-m0-p0 > li:last-of-type a{
  background: var(--second);
}
.news-categories .content{
  display: flex;
  flex-direction: row-reverse;
  max-width: 1024px;
}
.news-categories .content aside{
  width: 100%;
  max-width: 28rem;
  padding-right: 2.4rem;
}
.news-categories .content aside h2,
.news-categories .content aside .h2{
  font-size: 2.4rem;
  margin: 0 0 1.6rem;
}
.news-categories .content aside ul{
  list-style: none;
}
.news-categories .content aside ul li{
  border-bottom: 1px solid hsla(0 0% 0% / .1);
  font-size: 1.4rem;
  line-height: 1.2;
  padding: .8rem;
  cursor: pointer;
}
.news-categories .content aside ul li:hover,
.news-categories .content aside ul li.active{
  font-weight: 600;
}
.news-categories .content .flex{
  width: calc(100% - 28rem);
  padding-left: 2.4rem;
  border-left: 2px solid hsla(0 0% 0% / .1);
}
.news-categories .content .flex.articles-list .card{
  width: 100%;
}
.faq-wrapper{
  background: var(--light-light);
  padding: 1.6rem;
  border-radius: 1.6rem;
  box-shadow: var(--shadow);
  margin-top: 2.4rem;
}
.light.form-strip{
  background: var(--light);
}
.light.form-strip .form_holder textarea, .light.form-strip .form_holder select, .light.form-strip .form_holder input{
  background: var(--light-light);
}
.light.form-strip input:-webkit-autofill,
.light.form-strip input:-webkit-autofill:hover, 
.light.form-strip input:-webkit-autofill:focus,
.light.form-strip select:-webkit-autofill,
.light.form-strip select:-webkit-autofill:hover, 
.light.form-strip select:-webkit-autofill:focus,
.light.form-strip textarea:-webkit-autofill,
.light.form-strip textarea:-webkit-autofill:hover, 
.light.form-strip textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--medium) !important;
  background: var(--light-light)!important;
  color: var(--medium) !important;
  -webkit-box-shadow: 0 0 0px 40rem var(--light-light) inset !important;
}
.light.form-strip .form_holder input:focus,
.light.form-strip .form_holder select:focus,
.light.form-strip .form_holder textarea:focus {
  background-color: var(--light-light);
  color: var(--medium);
  outline: none;
}
/* ---------- Media Queries ---------- */
@media screen and (max-width: 1280px){
  .jqueryslidemenu a.logo{
    width: 14rem;
  }
  .jqueryslidemenu nav{
    max-width: 92rem;
  }
  .jqueryslidemenu nav > ul > ul > li:last-child a,
  .jqueryslidemenu nav ul li a{
    letter-spacing: 0;
    font-size: 1.3rem;
  }
  input.superbutton, a.button, button.superbutton, a.superbutton, .superbutton{
    padding-inline: 3.2rem;
  }
}
@media screen and (max-width: 1180px){
  .jqueryslidemenu nav{
    max-width: 84rem;
  }
  .jqueryslidemenu nav > ul > ul > li:last-child a,
  .jqueryslidemenu nav ul li a{
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 1080px){
  .jqueryslidemenu a.superbutton{
    padding-inline: 2.4rem;
    font-size: 1.1rem;
    min-width: 148px;
  }
  .jqueryslidemenu nav ul li a{
    font-size: 1.1rem;
  }    
  .jqueryslidemenu a.logo {
    width: 12rem;
  }
  .jqueryslidemenu nav > ul > ul > li:last-child a{
    padding: 2px 12px  0
  }
}
@media screen and (max-width: 960px){
  #faqs{
    padding-inline: 1.6rem;
  }
  .banner-container-constrained{
    background: var(--main);
    height: auto;
  }
  .ms-banner-constrained li .img-wrapper{
    width: 100%;
    border-radius: 0 0 1.6rem 1.6rem;
  }
  .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{
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 0;
  }
  .ms-banner-constrained li .banner-details .h6{
    margin: 0 0 2.4rem;
  }
  .banner-container-constrained .banner-details .h1{
    margin: 0;
  }
  .intro-strip{
    padding: 4.8rem 1.6rem;
  }
  .intro-strip .content{
    padding: 0;
    flex-direction: column;
  }
  .intro-strip .content .img-wrapper{
    width: calc(100% - 3.2rem);
    height: auto;
    aspect-ratio: 4 / 6;
    max-width: 28rem;
    position: relative;
    margin: 0 auto -12rem;
  }
  .intro-strip .content .editable_content{
    width: 100%;
    padding: 14.4rem 1.6rem 2.4rem;
  }
  .feat-spec .content .flex{
    width: 100%;
  }
  .feat-spec .content .flex .card{
    position: relative;
  }
  .feat-spec .content .flex .card .img-wrapper{
    width: 100%;
    height: 0 !important;
    aspect-ratio: 6 / 4.5;
    border-radius: 1.6rem;
    position: initial;
    display: block;
    margin: 0;
  }
  .feat-spec .content .flex .card.active .img-wrapper{
    opacity: 1;
    margin: 0 0 1.6rem;
    height: auto !important;
  }
  .feat-news,
  .how-it-works{
    padding-block: 4.8rem;
  }
  .feat-news{
    padding-inline: 1.6rem;
  }
  .book-cta{
    padding: 42rem 3.2rem 4.8rem;
  }
  .book-cta .img-wrapper{
    width: 100%;
    height: 35rem;
  }
  .book-cta .img-wrapper::before{
    width: 100%;
    background: linear-gradient(to top, var(--light-light) 0%, transparent 100%);
    left: 0;
    bottom: -1px;
  }
  .book-cta .content .editable_content{
    width: 100%;
  }
  .inner-intro{
    padding: 35rem 3.2rem 8rem;
  }
  .inner-intro .img-wrapper{
    width: 100%;
    height: 30rem;
    border-radius: 0 0 1.6rem 1.6rem;
  }
  .inner-intro .content .editable_content{
    width: 100%;
  }
  .categories-page aside.categories{
    border: none;
  }
  .thera-page .img-wrapper{
    max-width: 32rem;
    width: 100%;
    float: none;
    margin: 0 0 1.6rem;
  }
  .spec-intro{
    padding: 4.8rem 1.6rem;
  }
  .strip-list .img-holder::before{
    top: 1px;
    left: 0;
    background: linear-gradient(to bottom, transparent 0%, var(--light-light) 100%);
  }
  .news-categories .content{
    flex-direction: column-reverse;
  }
  .news-categories .content aside{
    max-width: 100%;
    padding: 0 0 2.4rem;
  }
  .news-categories .content .flex{
    width: 100%;
    padding: 2.4rem 0 0;
    border: none;
  }
  .news-categories .content aside h2, .news-categories .content aside .h2{
    padding-bottom: 8px;
    margin: 0;
    border-bottom: 1px solid hsla(0 0% 0% / .1);
    position: relative;
    cursor: pointer;
  }
  .news-categories .content aside h2::before,
  .news-categories .content aside h2::after{
    content: '';
    height: 2px;
    width: 1.6rem;
    position: absolute;
    right: 0;
    top: calc(50% - 1px);
    background: var(--dark);
  }
  .news-categories .content aside h2::after{
    transform: rotate(90deg);
  }
  .news-categories .content aside.articles-filter.active h2::before{
    transform: rotate(45deg);
  }
  .news-categories .content aside.articles-filter.active h2::after{
    transform: rotate(135deg);
  }
  .news-categories .content aside ul{
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: var(--animate);
  }
  .news-categories .content aside.articles-filter.active ul{
    height: auto;
    opacity: 1;
  }
  .book-cta .content .editable_content .btn-wrapper .superbutton{
    width: 100%;
  }
  .thera-page .content{
    flex-direction: column;
  }
  .thera-page .content .editable_content{
    width: 100%;
  }
  .thera-page .img-aside{
    max-width: 32rem;
    width: 100%;
  }
  .strip-list:nth-last-of-type(2n) .img-holder::before {
    left: 0;
    background: linear-gradient(to bottom, transparent 0%, var(--light) 100%);
  }
  footer .footer-contact ul li{
    margin: 0 0 .8rem;
  }
}
@media screen and (max-width: 640px){
  .flex.articles-list .card{
    padding: 0;
    flex-direction: column;
  }
  .flex.articles-list .card .img-wrapper{
    width: calc(100% - 3.2rem);
    max-width: 24rem;
    aspect-ratio: 4.5 / 6;
    position: relative;
    height: auto;
    margin: 0 0 -3.2rem 1.6rem;
  }
  .flex.articles-list .card .date-wrapper{
    position: relative;
    margin: -88px 0 0 0;
    transform: translate(0, 16px);
    left: auto;
    top: auto;
  }
  .flex.articles-list .card .content-holder{
    width: 100%;
    padding: 5.6rem 1.6rem 2.4rem
  }
  .flex.articles-list .card .content-holder h3{
    margin: 0 0 1.6rem;
  }
}
@media screen and (min-width: 1880px){
  .ms-banner-constrained li .img-wrapper{
    width: 50%;
  }
}
.message_positive,
.message_negative{
  background: #a95d5d;
  color: white;
  padding: 1.6rem;
  border-radius: .8rem;
}
.message_positive{
  background: #6d9770;
}
.message_positive p,
.message_negative p{
  margin: 0;
}
.client-groups-new{
  background: var(--light-light);
}
.client-groups-new .editable_content{
  margin: 0 0 2.4rem;
}
.client-groups-new .content .cg-list .card{
  padding: 9.6rem 1.6rem 1.6rem;
  margin-top: 9.6rem;
  position: relative;
  overflow: visible;
  background: #fefbf8;
}
@media screen and (max-width: 1024px) {
  .client-groups-new .content .cg-list .card{
    width: 100%;
  }
}
.client-groups-new .content .cg-list .card .img-holder{
  aspect-ratio: 1 / 1;
  width: 16rem;
  height: auto;
  position: absolute;
  top: -8rem;
  left: calc(50% - 8rem);
  border-radius: 50%;
  overflow: hidden;
}
.client-groups-new .content .cg-list .card .img-holder img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.client-groups-new .content .cg-list .card .content-wrapper{
  text-align: center;
  padding-top: 1.6rem;
}
.client-groups-new .content .cg-list .card .content-wrapper a.superbutton{
  background: var(--second);
}
.client-groups-new .content .cg-list .card .content-wrapper a.superbutton:hover{
  background: var(--main);
}
.about-mission{
  padding-top: 6.4rem;
  padding-inline: 1.6rem
}
.about-mission .content{
  padding: 2.4rem;
  border-radius: 1.6rem;
  box-shadow: var(--shadow);
  background: #b0a5bb;
}
.how-it-works .content .editable_content .grid .column{
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.how-it-works .content .editable_content .grid .column::before{
  content: '';
  width: 100%;
  height: 110%;
  top: -5%;
  left: -5%;
  aspect-ratio: 1 / 1;
  position: absolute;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: left center;
  z-index: -1;
  opacity: 0.075;
  transition: var(--animate);
}
.how-it-works .content .editable_content .grid .column:first-of-type::before{
  background-image: url(/assets/images/layout/icon-stars.svg);
}
.how-it-works .content .editable_content .grid .column:nth-of-type(2)::before{
  background-image: url(/assets/images/layout/icon-laptop.svg);
}
.how-it-works .content .editable_content .grid .column:nth-of-type(3)::before{
  background-image: url(/assets/images/layout/icon-handshake.svg);
}
.how-it-works .content .editable_content .grid .column:nth-of-type(4)::before{
  background-image: url(/assets/images/layout/icon-link.svg);
}
.wtc-strip{
  padding-bottom: 0;
}
.wtc-strip .grid{
  margin-bottom: 2.4rem;
}
.categories-page aside.categories span.cat-wrapper,
.wtc-strip .grid .column{
  margin-top: 2.8rem;
  position: relative;
  padding: 4rem 1.6rem 1.6rem;
  border-radius: .8rem;
  box-shadow: var(--shadow);
  background: var(--light-light);
}
.categories-page aside.categories span.cat-wrapper{
  padding: 4rem 2.4rem 2.4rem;
}
.categories-page aside.categories span.cat-wrapper{
  display: flex;
  flex-direction: column;
}
.categories-page aside.categories span.cat-wrapper:nth-child(2) h2.cat-title{
  margin-top: auto;
}
.categories-page aside.categories span.cat-wrapper::before,
.wtc-strip .grid .column::before{
  content: '';
  position: absolute;
  top: -2.8rem;
  left: calc(50% - 2.8rem);
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 50%;
  background-color: var(--second);
  background-image: url(/assets/images/layout/icon-check.svg);
  background-position: center;
  background-size: 2rem auto;
  background-repeat: no-repeat;
}
.categories-page aside.categories span.cat-wrapper::before{
  content: '1';
  background-image: none;
  left: 2.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  color: white;
  font-weight: 600;
  font-size: 2.4rem;
}
.categories-page aside.categories span.cat-wrapper:nth-child(2):before{
  content: '2';
}
.categories-page aside.categories span.cat-wrapper h4{
  margin: 0 0 1.6rem;
}
.categories-page aside.categories span.cat-wrapper select{
  background-color: var(--light);
}
.thera-header{
  padding-block: 5rem;
}
.thera-header .content{
  display: flex;
  gap: 4.8rem;
  align-items: center;
}
.thera-header .content .img-wrapper{
  width: 32rem;
  height: auto;
  aspect-ratio: 4.5 / 6;
  border-radius: 24rem;
  overflow: hidden;
  position: relative;
  background: #d7d1dd;
}
.thera-header .content .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.thera-header .content .content-wrapper{
  width: calc(100% - 36.8rem);
}
.thera-header .content .content-wrapper h1{
  margin: 0 0 .8rem;
}
.thera-header .content .content-wrapper pre{
  line-height: 1.5;
}
.thera-page{
  background: var(--light-light);
  box-shadow: var(--shadow);
}
.thera-page .content{
  display: flex;
  gap: 6.4rem;
  flex-direction: row-reverse;
  align-items: flex-start;
}
.thera-page .content .content-wrapper {
  width: calc(100% - 46.4rem);
}
.thera-page .content .content-wrapper .editable_content{
  width: 100%;
  max-width: 100%;
}
.thera-page .content .content-wrapper .editable_content:nth-of-type(n+2){
  border-top: 2px solid hsla(0 0% 0% / 0.1);
  margin: 2.4rem 0 0;
  padding: 2.4rem 0 0;
}
.thera-page .content .therapist-details{
  max-width: 40rem;
  padding: 0;
  margin: 0;
  border: none;
  position: sticky;
  top: 16rem;
  height: auto;
}
.therapist-details .detail-section > div ul li,
.therapist-details .detail-section > div, .therapist-details ul.category-list li{
  font-size: 1.4rem;
}
.therapist-details .detail-section > div ul{
  list-style: none;
}
.therapist-details a.superbutton{
  margin: 0;
}
.article-page .content .editable_content .img-wrapper{
  max-width: 32rem;
  width: 100%;
  height: auto;
  aspect-ratio: 4.5 / 6;
  border-radius: 24rem;
  overflow: hidden;
  float: left;
  margin: 0 1.6rem 1.6rem 0;
}
.article-page .content .editable_content .img-wrapper img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .strip-list {
      padding: 5rem 3rem;
      position: initial;
  }
  .strip-list .content{
    flex-direction: column;
    gap: 3.2rem;
  }
}
@media screen and (max-width: 960px){
  .about-mission .content{
    padding-inline: 1.6rem;
  }
  .thera-header .content{
    flex-direction: column;
    gap: 4rem;
  }
  .thera-header .content .img-wrapper{
    max-width: 32rem;
    width: 100%;
  }
  .thera-header .content .content-wrapper{
    width: 100%;
    text-align: center;
  }
  .thera-page .content{
    flex-direction: column-reverse;
    gap: 4rem;
  }
  .thera-page .content .therapist-details,
  .thera-page .content .content-wrapper{
    width: 100%;
    max-width: 100%;
  }
  .thera-page .content .therapist-details{
    position: initial;
  }
  .article-page .content .editable_content .img-wrapper{
    float: none;
    margin: 0 0 2.4rem;
  }
}
.no-overflow{
  overflow: hidden;
}
.res-secs{

}
.res-secs .content{
  max-width: 1024px;
}
.res-secs .content .faq-wrapper{
  background: none;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
}
.res-secs .content .faq-wrapper .block{
  border-bottom: 2px solid hsla(0 0% 0% / .1);
  padding-bottom: 1.6rem;
}
.res-secs .content .faq-wrapper .block:last-child{
  border-bottom: none;
  padding-bottom: 0;
}
.res-secs .content .faq-wrapper .block h3.toggle_faq{
  font-size: 2.4rem;
  line-height: 1;
  align-items: center;
}
.res-secs .content .faq-wrapper .block h3.toggle_faq span{
  transform: translate(0, 0px);
}
.res-secs .content .faq-wrapper .block h3.toggle_faq span i{

}
.res-secs .content .faq-wrapper .block .toggler{
  
}
.res-secs .content .faq-wrapper .block .toggler .editable_content{
  
}
.res-secs .content .faq-wrapper .block .toggler .flex{
  display: block;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div{
  padding-top: 2rem;
  border-top: 2px solid hsla(0 0% 0% / .05);
  margin-top: 2rem;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > h3{
  font-size: 24px;
  line-height: 1;
  margin: 0 0 1.6rem;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex{
    display: flex;
    margin-top: 24px;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery{
    width: calc(50% - 8px);
    display: block;
    aspect-ratio: 6 / 4.5;
    height: auto;
    border-radius: .8rem;
    overflow: hidden;
    position: relative;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--dark);
  opacity: .5;
  transition: var(--animate);
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery:hover::before{
  opacity: .8;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery::after{
  content: '';
  background-image: url(/assets/images/layout/icon-play.svg);
  width: 6.4rem;
  height: 6.4rem;
  border: 2px solid white;
  position: absolute;
  top: calc(50% - 3.2rem);
  left: calc(50% - 3.2rem);
  border-radius: 50%;
  background-position: 19px center;
  background-size: auto 32px;
  background-repeat: no-repeat;
  opacity: .8;
  transition: var(--animate);
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery:hover::after{
  opacity: 1;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul{
    display: flex;
    flex-wrap: wrap;
    gap: var(--grid-gap);
    list-style: none;
    margin-top: 24px;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li{
    width: calc(33.3333% - calc(2 * var(--grid-gap) / 3));
    aspect-ratio: 6 / 4.5;
    height: auto;
    position: relative;
    border-radius: .8rem;
    overflow: hidden;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li{
    aspect-ratio: unset;
    overflow: visible;
    border-radius: .8rem;
    background: var(--main);
    transition: var(--animate);
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li:hover{
  background: var(--second);
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li > a.img-wrapper{
    position: initial;
    padding: 0;
    background: none;
    border-radius: .8rem .8rem 0 0;
    overflow: hidden;
    height: auto;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li > a.img-wrapper img{
  object-fit: unset;
  width: 100%;
  height: auto;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li a.title{
    position: initial;
    display: block;
    background: none;
    height: auto;
    border-radius: 0 0 .8rem .8rem;
    text-align: center;
    font-weight: 500;
}
@media screen and (max-width: 960px){
.res-secs .content .faq-wrapper .block .toggler .flex > div .flex .swipebox_video_gallery,
 .res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li{
    width: 100%;
  }  
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li a{
  position: absolute;
  top: 0;
  left: 0;
  padding: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  text-align: left;
  text-decoration: none;
  color: white;
  font-weight: 500;
  font-size: 18px;
  background: hsla(0 1% 27% / .4);
  width: 100%;
  height: 100%;
  transition: var(--animate);
}
.res-secs .content .faq-wrapper .block .toggler .flex > div > ul > li a:hover{
  background: hsla(0 1% 27% / .75);
}
.content_container.resource-categories .content{
  max-width: 1264px;
}
.content_container.resource-categories .content aside .filter-section{
  margin-bottom: 1.6rem;
}
.content_container.resource-categories .content aside .filter-section h3{
  font-size: 18px;
  font-weight: 400;
  font-family: var(--font);
  margin: 0 0 4px;
}
.content_container.resource-categories .content .resources-list .card{
    display: flex;
    width: 100%;
    align-items: center;
    flex-direction: row;
    background: white;
    box-shadow: var(--shadow);
    border-radius: .8rem;
    overflow: hidden;
}
.content_container.resource-categories .content .resources-list .card h3{
  text-transform: none;
  font-size: 1.8rem;
  font-family: var(--font);
  margin: 0 0 .8rem;
}
.content_container.resource-categories .content .resources-list .card p{
  font-size: 1.4rem;
  line-height: 1.3;
  margin: 0 0 .8rem;
}
.content_container.resource-categories .content .resources-list .card a.img-wrapper{
  margin: 0; 
  display: block;
  overflow: hidden;
  border-radius: .8rem;
    width: 25%;

}
.content_container.resource-categories .content .resources-list .card a.img-wrapper img{
  margin: 0;
}
.content_container.resource-categories .content .resources-list .card .content-holder{
    padding: 1.6rem;
    width: 75%;
}
/*.content_container.resource-categories .content .resources-list .card .content-holder p{
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}*/
.content_container.resource-categories .content .resources-list .card a.text-link{
  margin: 0;
}
.content_container.resource-categories .content .resources-list .card > a.swipebox_video_gallery{
    position: relative;
    display: block;
    margin: 0;
    border-radius: .8rem;
    overflow: hidden;
}
.content_container.resource-categories .content .resources-list .card > a.swipebox_video_gallery::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--dark);
  opacity: .5;
  transition: var(--animate);
}
.content_container.resource-categories .content .resources-list .card:hover > a.swipebox_video_gallery::before{
  opacity: .8;
}
.content_container.resource-categories .content .resources-list .card > a.swipebox_video_gallery::after{
  content: '';
  width: 5.6rem;
  height: 5.6rem;
  border-radius: 50%;
  border: 2px solid white;
  position: absolute;
  top: calc(50% - 2.8rem);
  left: calc(50% - 2.8rem);
  background-image: url(/assets/images/layout/icon-play.svg);
  background-size: auto 24px;
  background-repeat: no-repeat;
  background-position: 17px center;
  opacity: .5;
  transition: var(--animate);
}
.content_container.resource-categories .content .resources-list .card:hover > a.swipebox_video_gallery::after{
  opacity: 1;
}
.content_container.resource-categories .content .resources-list .card > a.swipebox_video_gallery img{
  margin: 0;
}
@media screen and (max-width: 1180px){
  .news-categories .content aside{
    max-width: 20rem;
  }
  .news-categories .content .flex {
    width: calc(100% - 24rem);
  }
}
@media screen and (max-width: 960px){
  .news-categories .content aside,
  .news-categories .content .flex {
    max-width: 100%;
    width: 100%;
  }
  .content_container.resource-categories .content aside .filter-section{
    margin: 0;
    height: 0;
    opacity: 0;
  }
  .content_container.resource-categories .content aside .filter-section.active{
    margin: 1.6rem 0 0;
    height: auto;
    opacity: 1;
  }
  .content_container.resource-categories .content aside .filter-section ul{
    height: auto;
    opacity: 1;
  }
}
@media screen and (max-width: 768px){
  .content_container.resource-categories .content .resources-list .card .content-holder{
    width: 55%;
  }
  .content_container.resource-categories .content .resources-list .card a.img-wrapper{
    width: 45%;
  }
}
@media screen and (max-width: 600px){
  .content_container.resource-categories .content .resources-list .card{
    flex-direction: column;
  }
  .content_container.resource-categories .content .resources-list .card .content-holder,
  .content_container.resource-categories .content .resources-list .card a.img-wrapper{
    width: 100%;
  }
}