:root {
  /* Add these styles to your global stylesheet, which is used across all site pages. You only need to do this once. All elements in the library derive their variables and base styles from this central sheet, simplifying site-wide edits. For instance, if you want to modify how your h2's appear across the site, you just update it once in the global styles, and the changes apply everywhere. */
  --primary: #0e56c5;
  --primaryLight: #ffffff;
  --secondary: #0e56c5;
  --headerColor: #1a1a1a;
  --bodyTextColor: #4e4b66;
  --bodyTextColorWhite: #fafbfc;
  /* 13px - 16px */
  --topperFontSize: clamp(0.8125rem, 1.6vw, 1rem);
  /* 31px - 49px */
  --headerFontSize: clamp(1.9375rem, 3.9vw, 3.0625rem);
  --bodyFontSize: 1rem;
  /* 60px - 100px top and bottom */
  --sectionPadding: clamp(3.75rem, 7.82vw, 6.25rem) 1rem;
}

body {
  margin: 0;
  padding: 0;
}
html {
  scroll-behavior: smooth;
}
*, *:before, *:after {
  /* prevents padding from affecting height and width */
  box-sizing: border-box;
}
.cs-topper {
  font-family: "Poppins", sans-serif;
  font-size: var(--topperFontSize);
  line-height: 1.2em;
  text-transform: uppercase;
  text-align: inherit;
  letter-spacing: .1em;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 0.25rem;
  display: block;
}

.cs-title {
  font-family: "Poppins", sans-serif;
  font-size: var(--headerFontSize);
  font-weight: 900;
  line-height: 1.2em;
  text-align: inherit;
  max-width: 43.75rem;
  margin: 0 0 1rem 0;
  color: var(--headerColor);
  position: relative;
}

.cs-text {
  font-family: "Poppins", sans-serif;
  font-size: var(--bodyFontSize);
  line-height: 1.5em;
  text-align: inherit;
  width: 100%;
  max-width: 40.625rem;
  margin: 0;
  color: var(--bodyTextColor);
}
   


/*-- -------------------------- -->
<---     Mobile Navigation      -->
<--- -------------------------- -*/
/* Mobile - 1023px */
@media only screen and (max-width: 63.9375rem) {
  body.cs-open {
    overflow: hidden;
  }
  #cs-navigation {
    width: 100%;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0.75rem 1rem;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
  }
  #cs-navigation:before {
    content: "";
    width: 100%;
    height: 0vh;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    display: block;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: -1100;
    transition: height 0.5s, opacity 0.5s;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  #cs-navigation.cs-active:before {
    height: 150vh;
    opacity: 1;
  }
  #cs-navigation.cs-active .cs-ul-wrapper {
    opacity: 1;
    transform: scaleY(1);
    transition-delay: 0.15s;
  }
  #cs-navigation.cs-active .cs-li {
    opacity: 1;
    transform: translateY(0);
  }
  #cs-navigation .cs-container {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  #cs-navigation .cs-logo {
    width: 40%;
    max-width: 9.125rem;
    height: 100%;
    margin: 0 auto 0 0;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
  }
  #cs-navigation .cs-logo img {
    width: 100%;
    height: 100%;
    /* ensures the image never overflows the container. It stays contained within it's width and height and expands to fill it then stops once it reaches an edge */
    object-fit: contain;
  }
  #cs-navigation .cs-toggle {
    /* 44px - 48px */
    width: clamp(2.75rem, 6vw, 3rem);
    height: clamp(2.75rem, 6vw, 3rem);
    margin: 0 0 0 auto;
    background-color: transparent;
    border: none;
    border-radius: 0.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #cs-navigation .cs-active .cs-line1 {
    top: 50%;
    transform: translate(-50%, -50%) rotate(225deg);
  }
  #cs-navigation .cs-active .cs-line2 {
    top: 50%;
    transform: translate(-50%, -50%) translateY(0) rotate(-225deg);
    transform-origin: center;
  }
  #cs-navigation .cs-active .cs-line3 {
    opacity: 0;
    bottom: 100%;
  }
  #cs-navigation .cs-box {
    /* 24px - 28px */
    width: clamp(1.5rem, 2vw, 1.75rem);
    /* 14px - 16px */
    height: clamp(0.875rem, 1.5vw, 1rem);
    position: relative;
  }
  #cs-navigation .cs-line {
    width: 100%;
    height: 2px;
    background-color: #1a1a1a;
    border-radius: 2px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  #cs-navigation .cs-line1 {
    top: 0;
    transition: transform 0.5s, top 0.3s, left 0.3s;
    animation-duration: 0.7s;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transform-origin: center;
  }
  #cs-navigation .cs-line2 {
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: top 0.3s, left 0.3s, transform 0.5s;
    animation-duration: 0.7s;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-fill-mode: forwards;
  }
  #cs-navigation .cs-line3 {
    bottom: 0;
    transition: bottom 0.3s, opacity 0.3s;
  }
  #cs-navigation .cs-ul-wrapper {
    width: 100%;
    height: auto;
    padding-bottom: 2.4em;
    background-color: #fff;
    box-shadow: inset rgba(0, 0, 0, 0.2) 0px 8px 24px;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1;
    overflow: hidden;
    transform: scaleY(0);
    transition: transform 0.4s, opacity 0.3s;
    transform-origin: top;
  }
  #cs-navigation .cs-ul {
    width: 100%;
    height: auto;
    max-height: 65vh;
    margin: 0;
    padding: 3rem 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 1.25rem;
    overflow: scroll;
  }
  #cs-navigation .cs-li {
    text-align: center;
    list-style: none;
    width: 100%;
    margin-right: 0;
    opacity: 0;
    /* transition from these values */
    transform: translateY(-4.375rem);
    transition: transform 0.6s, opacity 0.9s;
  }
  #cs-navigation .cs-li:nth-of-type(1) {
    transition-delay: 0.05s;
  }
  #cs-navigation .cs-li:nth-of-type(2) {
    transition-delay: 0.1s;
  }
  #cs-navigation .cs-li:nth-of-type(3) {
    transition-delay: 0.15s;
  }
  #cs-navigation .cs-li:nth-of-type(4) {
    transition-delay: 0.2s;
  }
  #cs-navigation .cs-li:nth-of-type(5) {
    transition-delay: 0.25s;
  }
  #cs-navigation .cs-li:nth-of-type(6) {
    transition-delay: 0.3s;
  }
  #cs-navigation .cs-li:nth-of-type(7) {
    transition-delay: 0.35s;
  }
  #cs-navigation .cs-li:nth-of-type(8) {
    transition-delay: 0.4s;
  }
  #cs-navigation .cs-li:nth-of-type(9) {
    transition-delay: 0.45s;
  }
  #cs-navigation .cs-li:nth-of-type(10) {
    transition-delay: 0.5s;
  }
  #cs-navigation .cs-li:nth-of-type(11) {
    transition-delay: 0.55s;
  }
  #cs-navigation .cs-li:nth-of-type(12) {
    transition-delay: 0.6s;
  }
  #cs-navigation .cs-li:nth-of-type(13) {
    transition-delay: 0.65s;
  }
  #cs-navigation .cs-li-link {
    /* 16px - 24px */
    font-family: "Poppins", sans-serif;
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    line-height: 1.2em;
    text-decoration: none;
    margin: 0;
    color: var(--headerColor);
    display: inline-block;
    position: relative;
  }
  #cs-navigation .cs-li-link:before {
    /* active state underline */
    content: "";
    width: 100%;
    height: 1px;
    background: currentColor;
    opacity: 1;
    display: none;
    position: absolute;
    bottom: -0.125rem;
    left: 0;
  }
  /* #cs-navigation .cs-li-link.cs-active:before {
    display: block;
  } */
  #cs-navigation .cs-button-solid {
    display: none;
  }
}
/*-- -------------------------- -->
<---     Desktop Navigation     -->
<--- -------------------------- -*/
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cs-navigation {
    width: 100%;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0 1rem;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
  }
  #cs-navigation .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1.5rem;
  }
  #cs-navigation .cs-toggle {
    display: none;
  }
  #cs-navigation .cs-logo {
    width: 100%;
    max-width: 11.875rem;
    height: 4.0625rem;
    /* margin-right auto pushes everything away from it to the right */
    margin: 0 auto 0 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
  }
  #cs-navigation .cs-logo img {
    width: 100%;
    height: 100%;
    /* ensures the image never overflows the container. It stays contained within it's width and height and expands to fill it then stops once it reaches an edge */
    object-fit: contain;
  }
  #cs-navigation .cs-ul {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    /* 20px - 36px */
    gap: clamp(1.25rem, 2.6vw, 2.25rem);
  }
  #cs-navigation .cs-li {

    list-style: none;
    padding: 2rem 0;
    /* prevent flexbox from squishing it */
    flex: none;
  }
  #cs-navigation .cs-li-link {
    /* 14px - 16px */
    font-family: "Poppins", sans-serif;
    font-size: clamp(0.875rem, 1vw, 1rem);
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    display: block;
    position: relative;
  }
  #cs-navigation .cs-li-link:hover:before {
    width: 100%;
  }
  /* #cs-navigation .cs-li-link.cs-active:before {
    width: 100%;
  } */
  #cs-navigation .cs-li-link:before {
    /* active state underline */
    content: "";
    width: 0%;
    height: 2px;
    background: var(--primary);
    opacity: 1;
    display: block;
    position: absolute;
    bottom: 0rem;
    left: 0;
    transition: width 0.3s;
  }
  #cs-navigation .cs-button-solid {
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    /* 46px - 56px */
    line-height: clamp(2.875em, 5.5vw, 3.5em);
    text-align: center;
    text-decoration: none;
    min-width: 9.375rem;
    margin: 0;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
    padding: 0 1.0rem;
    color: #000000;
    background-color: #fff;
    border-radius: 0.25rem;
    border:solid 2px #000;
    display: inline-block;
    position: relative;
    z-index: 1;
  }
  #cs-navigation .cs-button-solid:before {
    content: "";
    width: 0%;
    height: 100%;
    background: #000000;
    opacity: 1;
    /* border-radius: 0.25rem; */
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #cs-navigation .cs-button-solid:hover {
      color: #fff; /* Change text color to white */
    }
  #cs-navigation .cs-button-solid:hover:before {
    width: 100%;
  }
}


/*-- -------------------------- -->
<---           Hero             -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #hero-1618 {
    padding: var(--sectionPadding);
    /* 200px - 300px - leaving extra space for the navigation */
    padding-top: clamp(12.5rem, 31.95vw, 18.75rem);
    padding-bottom: clamp(12.5rem, 31.95vw, 18.75rem);
    position: relative;
    z-index: 1;
  }
  #hero-1618 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* 60px - 180px */
    gap: clamp(3.75rem, 13vw, 11.25rem);
  }
  #hero-1618 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: left;
    width: 100%;
    max-width: 48.75rem;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: flex-start;
  }

  #hero-1618 .cs-title {
    /* 39px - 61px */
    font-family: "Poppins", sans-serif;
    font-size: clamp(2.4375rem, 6.4vw, 3.8125rem);
    font-weight: 700;
    line-height: 1.2em;
    text-align: inherit;
    max-width: 100%;
    /* margin: 0 0 2.5rem 0; */
    color: #fff;
    position: relative;
  }

  #hero-1618 .cs-desc{
      font-family: "Poppins", sans-serif;
      font-size: clamp(1rem, 1.95vw, 1.25rem);
      margin: 0 0 2.5rem 0;
      color:white;

  }



  #hero-1618 .cs-button-solid {
  font-family: "Poppins", sans-serif;
    font-size: 1rem;
    /* 46px - 56px */
    line-height: clamp(2.875rem, 5.5vw, 3.5rem);
    text-decoration: none;
    font-weight: 500;
    margin: 0;
    color: #fff;
    padding: 0 1.5rem;
    background-color: var(--primary);
    display: inline-block;
    position: relative;
    z-index: 1;
  }
  #hero-1618 .cs-button-solid:before {
    content: '';
    position: absolute;
    display: block;
    height: 100%;
    width: 0%;
    background: #000;
    opacity: 1;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width .3s;
  }
  #hero-1618 .cs-button-solid:hover:before {
    width: 100%;
  }

  #hero-1618 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
  }
  #hero-1618 .cs-background:before {
    /* Overlay */
    content: '';
    width: 100%;
    height: 100%;
    background: #111926;
    opacity: .8;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 1;
    /* prevents the cursor from interacting with it */
    pointer-events: none;
  }
  #hero-1618 .cs-background img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* makes the top of the image start at the top of the parent */
    object-position: top;
  }

}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  /* #hero-1618 {
    padding-bottom: 0;
  } */
  #hero-1618 .cs-container {
    align-items: flex-start;
  }
  #hero-1618 .cs-content {
    text-align: left;
    margin-left: 0;
    align-items: flex-start;
  }
  #hero-1618 .cs-item {
    grid-column: span 4;
  }
  #hero-1618 .cs-background {
    height: 100%;
  }
  /* #hero-1618 .cs-background:before {
    background: linear-gradient(90deg, #111926 21.41%, rgba(17, 25, 38, 0.72) 34.98%, rgba(17, 25, 38, 0) 62.53%);
    opacity: 1;
  } */
}
/* Large Desktop Parallax Effect - 100px */
@media only screen and (min-width: 100rem) {
  #hero-1618 .cs-background {
    background: url("images/hero- background.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* creates the parallax effect */
    background-attachment: fixed;
  }
  #hero-1618 .cs-background img {
    display: none;
  }
}



/*-- -------------------------- -->
<---       Side By Side         -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #RPsbs-248,
  #RPsbsr-248 {
      padding: 0 1em;
      position: relative;
      z-index: 1;
  }
  #RPsbs-248 .cs-container,
  #RPsbsr-248 .cs-container {
      width: 100%;
      /* changes to 1280px on tablet */
      /* max-width: 34.375rem; */
      padding: var(--sectionPadding);
      padding-left: 0;
      padding-right: 0;
      margin: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      /* 48px - 108px */
      gap: clamp(3rem, 8vw, 6.75rem);
      position: relative;
  }
  #RPsbs-248 .cs-content,
  #RPsbsr-248 .cs-content {
      /* set text align to left if content needs to be left aligned */
      text-align: left;
      width: 100%;
      /* changes at tablet */
      /* max-width: 27.125rem; */
      display: flex;
      flex-direction: column;
      /* centers content horizontally, set to flex-start to left align */
      align-items: flex-start;
  }

  #RPsbs-248 .cs-title,
  #RPsbsr-248 .cs-title {
      font-size: clamp(1.9375rem, 2.3vw, 2.3rem);
      max-width: 46rem;
      font-weight: 600;
  }
  #RPsbs-248 .cs-text,
  #RPsbsr-248 .cs-text {
      margin-bottom: 1rem;
      opacity: 0.8;
  }
  #RPsbs-248 .cs-text:last-of-type,
  #RPsbsr-248 .cs-text:last-of-type {
      margin-bottom: 2rem;
  }
  #RPsbs-248 .cs-button-solid,
  #RPsbsr-248 .cs-button-solid {
      font-family: "Poppins", sans-serif;
      font-size: 1rem;
      /* 46px - 56px */
      line-height: clamp(2.875rem, 5.5vw, 3.5rem);
      text-decoration: none;
      font-weight: 500;
      text-align: center;
      margin: 0;
      color: #fff;
      min-width: 9.375rem;
      padding: 0 1.5rem;
      background-color: var(--primary);
      /* border-radius: 0.25rem; */
      display: inline-block;
      position: relative;
      z-index: 1;
      /* prevents padding from adding to the width */
      box-sizing: border-box;
  }
  #RPsbs-248 .cs-button-solid:before,
  #RPsbsr-248 .cs-button-solid:before {
      content: "";
      position: absolute;
      height: 100%;
      width: 0%;
      background: #000;
      opacity: 1;
      top: 0;
      left: 0;
      z-index: -1;
      border-radius: 0.25rem;
      transition: width 0.3s;
  }
  #RPsbs-248 .cs-button-solid:hover:before,
  #RPsbsr-248 .cs-button-solid:hover:before {
      width: 100%;
  }
  #RPsbs-248 .cs-picture,
  #RPsbsr-248 .cs-picture {
      width: 100%;
      /* max-width: 27.125rem; */
      margin: 0;
      border: 1px solid #f1f1f4;
      position: relative;
      display: block;
      /* width divided by height */
      aspect-ratio: 1;
      /* prevents border from adding to height and width */
      box-sizing: border-box;
  }
  #RPsbs-248 .cs-picture img,
  #RPsbsr-248 .cs-picture img {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      object-fit: cover;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #RPsbs-248 .cs-container,
  #RPsbsr-248 .cs-container {
      max-width: 80rem;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
  }
  #RPsbs-248 .cs-lines,
  #RPsbsr-248 .cs-lines {
      height: 100%;
      width: 35%;
      display: block;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      z-index: -1;
  }
  #RPsbs-248 .cs-lines:before,
  #RPsbsr-248 .cs-lines:before {
      /* Right Line */
      content: "";
      width: 1px;
      height: 100%;
      background: -moz-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* FF3.6-15 */
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      left: 0;
      /* flips vertically */
      transform: scaleY(-1);
  }
  #RPsbs-248 .cs-lines:after,
  #RPsbsr-248 .cs-lines:after {
      /* Right Line */
      content: "";
      width: 1px;
      height: 100%;
      background: -moz-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* FF3.6-15 */
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      right: 0;
      /* flips vertically */
      transform: scaleY(-1);
  }
  #RPsbs-248 .cs-picture,
  #RPsbsr-248 .cs-picture {
      /* 344px - 434px */
      width: clamp(21.5rem, 36.5vw, 33.125rem);
      flex: none;
  }
  #RPsbs-248 .cs-content,
  #RPsbsr-248 .cs-content {
      max-width: 33.875rem;
      margin: 0;
      width: 45%;
  }
}

/*-- -------------------------- -->
<---   Side By Side Reverse     -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #RPsbsr-248 {
      padding: 0 1rem;
  }
  #RPsbsr-248 .cs-container {
      /* 60px - 100px top and bottom */
      padding: clamp(3.75rem, 7.82vw, 6.25rem) 0;
  }
  #RPsbsr-248 .cs-container:before {
      /* Left Line */
      content: "";
      width: 1px;
      height: 100%;
      background: linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      left: 0;
  }
  #RPsbsr-248 .cs-container:after {
      /* Right Line */
      content: "";
      width: 1px;
      height: 100%;
      background: -moz-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* FF3.6-15 */
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      right: 0;
      /* flips vertically */
      transform: scaleY(-1);
  }
  #RPsbsr-248 .cs-lines {
      display: none;
  }
  #RPsbsr-248 .cs-background {
      /* Background Image */
      width: 100%;
      height: 100%;
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      z-index: -2;
  }
  #RPsbsr-248 .cs-background:before {
      /* Black Color Overlay */
      content: "";
      width: 100%;
      height: 100%;
      background: #000;
      opacity: 0.6;
      position: absolute;
      display: block;
      top: 0;
      left: 0;
      z-index: 1;
      /* prevents the cursor from interacting with it */
      pointer-events: none;
  }
  #RPsbsr-248 .cs-background img {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      /* Makes image act like a background-image */
      object-fit: cover;
  }
  #RPsbsr-248 .cs-topper {
      color: var(--primaryLight);
  }
  #RPsbsr-248 .cs-title {
      color: var(--bodyTextColorWhite);
      font-size: clamp(1.9375rem, 2.7vw, 2.7rem);
  }
  #RPsbsr-248 .cs-text {
      color: var(--bodyTextColorWhite);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #RPsbsr-248 .cs-lines {
      height: 100%;
      width: 35%;
      display: block;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      z-index: -1;
  }
  #RPsbsr-248 .cs-lines:before {
      /* Right Line */
      content: "";
      width: 1px;
      height: 100%;
      background: -moz-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* FF3.6-15 */
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      left: 0;
      /* flips vertically */
      transform: scaleY(-1);
  }
  #RPsbsr-248 .cs-lines:after {
      /* Right Line */
      content: "";
      width: 1px;
      height: 100%;
      background: -moz-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* FF3.6-15 */
      background: -webkit-linear-gradient(
          top,
          rgba(250, 251, 252, 0.5) 0%,
          rgba(250, 251, 252, 0) 100%
      );
      /* Chrome10-25,Safari5.1-6 */
      opacity: 1;
      position: absolute;
      display: block;
      top: 0;
      right: 0;
      /* flips vertically */
      transform: scaleY(-1);
  }
  #RPsbsr-248 .cs-picture {
      margin: 0;
      order: 2;
  }
}

/*-- -------------------------- -->
<---          Service           -->
<--- -------------------------- -*/
#intellectual-property {
  padding: var(--sectionPadding); /* Use the same padding as other sections */
  margin: 0 auto; /* Center the section horizontally if necessary */
  background-color:#f0f0f0;; /* Light background color */
  color: #333;
  text-align: center; /* Center-align text */
}

#intellectual-property .container {
  max-width: 80rem; /* Ensure consistency with other sections */
  margin: 0 auto; /* Center the content */
  padding: 0; /* No additional padding for the container itself */
}

/* Section Titles */
#intellectual-property .cs-topper {
  font-family: "Poppins", sans-serif;
  font-size: var(--topperFontSize); /* Responsive font size */
  font-weight: 700;
  text-transform: uppercase;
  color: var(--primary); /* Primary color */
  margin-bottom: 0.5rem;
  letter-spacing: 0.05em;
  text-align: left;
}

#intellectual-property .cs-title {
font-family: "Poppins", sans-serif;
font-size: clamp(1.9375rem, 2.7vw, 2.7rem);
font-weight: 600;
margin-bottom: 2rem;
color: var(--headerColor);
text-align: left;
max-width: 46rem;
}

/* Card Container */
#intellectual-property .card-container {
  display: flex;
  justify-content: space-between; /* Distribute cards evenly */
  gap: 1.5rem; /* Space between cards */
  flex-wrap: wrap; /* Allow wrapping on smaller screens */
}

/* Individual Cards */
#intellectual-property .card {
  background-color: #fff; /* White background for cards */

  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
  overflow: hidden;
  flex: 1 1 calc(33.333% - 1.5rem); /* Responsive sizing */
  display: flex;
  flex-direction: column;
  text-align: left; /* Left-align text inside the card */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Hover effects */
}

#intellectual-property .card:hover {
  transform: translateY(-10px); /* Lift effect on hover */
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2); /* Stronger shadow on hover */
}

#intellectual-property .card img {
  width: 100%; /* Full-width image */
  height: 300px;
  object-fit: cover; /* Keep image proportions */
}

#intellectual-property .card h3 {
  font-family: "Poppins", sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--headerColor); /* Dark color */
  margin: 1rem;
}

#intellectual-property .card p {
  font-family: "Poppins", sans-serif;
  font-size: var(--bodyFontSize); /* Standard body font size */
  color: var(--bodyTextColor); /* Neutral text color */
  margin: 0 1rem 1.5rem;
  line-height: 1.6;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  #intellectual-property {
      padding: var(--sectionPadding); /* Ensure consistent padding on mobile */
  }

  #intellectual-property .card-container {
      flex-direction: column; /* Stack cards vertically */
      gap: 1rem; /* Smaller gap between stacked cards */
  }

  #intellectual-property .card {
      flex: 1 1 100%; /* Full-width cards */
  }

  #intellectual-property .main-title {
      font-size: 2rem; /* Adjust title size for smaller screens */
  }
}


/*-- -------------------------- -->
<---          Contact           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #cs-contact-242 {
      padding: var(--sectionPadding);
  }
  #cs-contact-242 .cs-container {
      width: 100%;
      max-width: 80rem;
      margin: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      /* 48px - 64px */
      gap: clamp(3rem, 6vw, 4rem);
  }

  #cs-contact-242 .cs-content {
      /* set text align to left if content needs to be left aligned */
      text-align: center;
      width: 100%;
      display: flex;
      flex-direction: column;
      /* centers content horizontally, set to flex-start to left align */
      align-items: center;
  }
  #cs-contact-242 .cs-topper {
      font-size: var(--topperFontSize);
      line-height: 1.2em;
      text-transform: uppercase;
      text-align: inherit;
      letter-spacing: 0.1em;
      font-weight: 700;
      color: var(--primary);
      margin-bottom: 0.25rem;
      display: block;
  }
  #cs-contact-242 .cs-title {

    font-size: clamp(1.9375rem, 2.7vw, 2.7rem);;
      font-weight: 600;
      line-height: 1.2em;
      text-align: inherit;
      max-width: 32.625rem;
      margin: 0 0 3rem 0;
      color: var(--headerColor);
      position: relative;
  }
  #cs-contact-242 .cs-text {
      font-size: var(--bodyFontSize);
      line-height: 1.5em;
      text-align: inherit;
      width: 100%;
      max-width: 32.625rem;
      margin: 0;
      color: var(--bodyTextColor);
  }
  #cs-contact-242 #cs-form-242 {
      width: 100%;
      max-width: 39.375rem;
      /* 32px - 40px */
      margin-bottom: clamp(2rem, 5.3vw, 2.5rem);
      /* 20px - 40px */
      /* padding: clamp(1.25rem, 4.5vw, 2.5rem); */
      /* prevents padding and border from affecting height and width */
      box-sizing: border-box;
      /* border: 1px solid #dad9e3; */
      border-radius: 1rem;
  }
  #cs-contact-242 .cs-label {
      /* 14px - 16px */
      font-family: "Poppins", sans-serif;
      font-size: clamp(0.875rem, 1.3vw, 1rem);
      line-height: 1.5em;
      font-weight: 700;
      /* 16px - 20px */
      margin-bottom: clamp(1rem, 1em, 1.25rem);
      color: var(--headerColor);
      display: flex;
      justify-content: center;
      align-items: flex-start;
      flex-direction: column;
  }

/* Ensure the label is flexbox for alignment */
label.required-field {
  display: flex; /* Allows alignment of text and asterisk */
  align-items: center; /* Vertically align elements */
  gap: 0.3rem; /* Add spacing between label text and input */
}

/* Add red asterisk for required fields */
label.required-field span:after {
  content: " *"; /* Add the asterisk after the text */
  color: red; /* Red asterisk */
  font-size: 1rem; /* Match font size */
  font-weight: bold; /* Bold asterisk */
}
  #cs-contact-242 .cs-label-message {
      /* 32px - 40px */
      margin-bottom: clamp(2rem, 4.5vw, 2.5rem);
  }

  label.cs-checkbox-label {
      font-family: "Poppins", sans-serif;
      margin-bottom: clamp(2rem, 4.5vw, 2.5rem);
  }
  #cs-contact-242 .cs-input,
  #cs-contact-242 .cs-textarea {
      font-family: "Poppins", sans-serif;
      font-size: 1rem;
      width: 100%;
      height: 4rem;
      margin-top: 0.25rem;
      padding-left: 1.25rem;
      /* set transparent border so on hover border doesn't make it glitch */
      border: 1px solid transparent;
      border-bottom: 1px solid #b4b2c7;
      /* prevents border & padding from affecting height */
      box-sizing: border-box;
      transition: border 0.3s;
  }
  #cs-contact-242 .cs-input:hover,
  #cs-contact-242 .cs-textarea:hover {
      border: 1px solid var(--primary);
  }
  #cs-contact-242 .cs-input::placeholder,
  #cs-contact-242 .cs-textarea::placeholder {
      color: #7d799c;
  }
  #cs-contact-242 .cs-textarea {
      font-family: "Poppins", sans-serif;
      margin: 0;
      padding-top: 1.25rem;
      min-height: 7.5rem;
  }
  #cs-contact-242 .cs-button-solid {
      font-family: "Poppins", sans-serif;
      font-size: 1rem;
      /* 46px - 56px */
      line-height: clamp(2.875rem, 5.5vw, 3.5rem);
      text-decoration: none;
      font-weight: 700;
      text-align: center;
      margin: 0;
      color: #fff;
      min-width: 9.375rem;
      padding: 0 1.5rem;
      background-color: var(--primary);
      border-radius: 0.25rem;
      display: inline-block;
      position: relative;
      z-index: 1;
      /* prevents padding from adding to the width */
      box-sizing: border-box;
  }
  #cs-contact-242 .cs-button-solid:before {
      content: "";
      position: absolute;
      height: 100%;
      width: 0%;
      background: #000;
      opacity: 1;
      top: 0;
      left: 0;
      z-index: -1;
      border-radius: 0.25rem;
      transition: width 0.3s;
  }
  #cs-contact-242 .cs-button-solid:hover:before {
      width: 100%;
  }
  #cs-contact-242 .cs-submit {
      width: 100%;
      border: none;
      border-radius: 0.5rem;
  }
  #cs-contact-242 .cs-submit:hover {
      cursor: pointer;
  }
  #cs-contact-242 .cs-right-section {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-end;
      /* 28px - 40px */
      gap: clamp(1.75rem, 4vw, 2.5rem);
      position: relative;
  }
  #cs-contact-242 iframe {
    width: 100%;
    height: 400px;
}
  #cs-contact-242 .cs-ul {
      padding: 0;
      /* 16px - 32px */
      padding-left: clamp(1rem, 3vw, 2rem);
      margin: 0;
      width: 100%;
      /* prevents padding from adding to height and width */
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      gap: 1.25rem;
  }
  #cs-contact-242 .cs-li {
    font-family: "Poppins", sans-serif;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}
  /* #cs-contact-242 .cs-li:hover .cs-icon-wrapper {
      transform: scale(1.2);
  } */
  #cs-contact-242 .cs-li:nth-of-type(2) {
      padding-bottom: 1.25rem;
      border-bottom: 1px solid #ffffff;
  }
  #cs-contact-242 .cs-header {
      /* 16px - 20px */
      font-family: "Poppins", sans-serif;
      font-size: clamp(1rem, 2vw, 1.25rem);
      font-weight: 700;
      line-height: 1.2em;
      margin-bottom: 0.5rem;
      color: var(--headerColor);
      display: block;
  }

  #cs-contact-242 .cs-flex-group {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  #cs-contact-242 .address-details {
    display: flex;
    flex-direction: column;
    font-size: clamp(1rem, 1vw, 1.1rem);
    line-height: 1.5em;
    text-decoration: none;
    color: var(--bodyTextColor);
}
  #cs-contact-242 .cs-link {
      /* 16px - 20px */
      font-size: clamp(1rem, 1vw, 1.1rem);
      line-height: 1.5em;
      text-decoration: none;
      color: var(--bodyTextColor);
      position: relative;
  }
  #cs-contact-242 .cs-link:hover:before {
      width: 100%;
  }
  #cs-contact-242 .cs-link:before {
      /* top right box */
      content: "";
      width: 0%;
      height: 2px;
      /* current color of parent */
      background: currentColor;
      opacity: 1;
      position: absolute;
      display: block;
      bottom: 0;
      left: 0;
      transition: width 0.3s;
  }
  #cs-contact-242 .cs-block {
      /* drop the address to two lines */
      display: block;
  }
  #cs-contact-242 .cs-icon-wrapper {
      /* 32px - 36px */
      margin-right: clamp(1rem, 2vw, 2rem);
      /* display: flex;
      justify-content: center;
      align-items: center; */
      /* prevents flexbox from squishing it */
      /* flex: none; */
      transition: transform 0.3s;
  }
  #cs-contact-242 .cs-icon {
      /* 32px -36px */
      width: clamp(1rem, 2vw, 1.25rem);
      height: auto;
      display: block;
  }
  #cs-contact-242 .cs-picture {
      width: 100%;
      border-radius: clamp(1rem, 1.5vw, 1.25rem);
      /* clips image corners */
      overflow: hidden;
      display: block;
      position: relative;
      /* width divided height */
      aspect-ratio: 1.44;
  }
  #cs-contact-242 .cs-img {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      object-fit: cover;
  }

  /* Hours List */

  
  .cs-hours {
      list-style: none; /* Remove default bullets */
      padding: 0;
      margin: 0;
      font-size: 1rem;
      color: #555;
      margin-bottom: 20px;
  }
  
  .cs-hours li {
      display: grid;
      grid-template-columns: 1fr auto; /* Day takes up flexible space, time auto-sizes */
      gap: 1rem; /* Add spacing between columns */
      align-items: center; /* Vertically aligns content */
      padding: 0.5rem 0; /* Add spacing between list items */
      border-bottom: 1px solid #eee; /* Optional: Light divider */
  }
  
  .cs-hours li:last-child {
      border-bottom: none; /* Remove divider for last item */
  }
  
  .day {
      font-weight: 600; /* Bold for emphasis */
      color: #333;
  }
  
  .time {
      font-weight: 400;
      color: #777;
      text-align: right; /* Ensure time is right-aligned */
  }
  

}
/* Tablet - 700px */
@media only screen and (min-width: 43.75rem) {
  #cs-contact-242 #cs-form-242 {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      flex-wrap: wrap;
      /* sends it to the right in the 2nd position */
      order: 2;
  }
  #cs-contact-242 .cs-label {
      width: 48%;
  }
  #cs-contact-242 .cs-label-message {
      width: 100%;
  }
  #cs-contact-242 .cs-button-solid {
      margin-left: 0;
  }
  #cs-contact-242 .cs-right-section {
      flex-direction: row;
      align-items: center;
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cs-contact-242 .cs-container {
      max-width: 80rem;
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-start;
      flex-wrap: wrap;
      column-gap: 1.25em;
      row-gap: 4rem;
  }
  #cs-contact-242 .cs-form-section{
    width: 50%;

  }
  #cs-contact-242 #cs-form-242 {
      max-width: 40.625rem;
  }
  #cs-contact-242 .cs-label {
      width: 100%;
  }
  #cs-contact-242 .cs-right-section {
      width: 45%;
      max-width: 33.875rem;
      /* prevents flexbox from squishing it */
      flex: none;
      flex-direction: column;
      background-color: #f0f0f0;
  }
  #cs-contact-242 .cs-block {
      /* sets address stay in one line */
      display: inline-block;
  }
  #cs-contact-242 .cs-picture {
      width: 100%;
      max-width: 100%;
      height: 27.375rem;
  }
}

/*-- -------------------------- -->
<---          Footer            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #footer-1147 {
      padding: var(--sectionPadding);
      position: relative;
      z-index: 1;
      background-color: #000;
  }
  #footer-1147 .cs-container {
      width: 100%;
      max-width: 80rem;
      margin: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
  }
  #footer-1147 .cs-top {
      width: 100%;
      /* 32px - 40px */
      margin-bottom: clamp(2rem, 4vw, 2.5rem);
      padding-bottom: clamp(2rem, 4vw, 2.5rem);
      border-bottom: 1px solid #484848;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2rem;
  }
  #footer-1147 .cs-ul {
      margin: 0;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      row-gap: 0.5rem;
      /* 28px - 40px */
      column-gap: clamp(1.75rem, 4vw, 2.5rem);
  }
  #footer-1147 .cs-li {
      list-style: none;
  }
  #footer-1147 .cs-link {
      /* 14px - 16px */
      font-size: clamp(0.875rem, 1.5vw, 1rem);
      line-height: 1.5em;
      text-decoration: none;
      margin: 0;
      color: #bababa;
      display: block;
      transition: color 0.3s;
  }
  #footer-1147 .cs-link:hover {
      color: var(--secondary);
  }
  #footer-1147 .cs-logo {
      width: 18.5rem;
      height: auto;
      display: block;
  }
  #footer-1147 .cs-logo-img {
      width: 100%;
      height: auto;
      display: block;
  }
  #footer-1147 .cs-bottom {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1.5rem;
  }
  #footer-1147 .cs-copyright {
      font-family: "Poppins", sans-serif;
      font-size: 0.5rem;
      line-height: 1.5em;
      margin: 0;
      color: #bababa;
      display: block;
  }
  #footer-1147 .cs-copyright-link {
      font-size: inherit;
      text-decoration: none;
      color: inherit;
      transition: color 0.3s;
  }
  #footer-1147 .cs-copyright-link:hover {
      color: var(--secondary);
  }

  #footer-1147 .cs-logo-img {
    filter: invert(1);
}

}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #footer-1147 .cs-top {
      flex-direction: row;
      justify-content: space-between;
  }
  #footer-1147 .cs-bottom {
      flex-direction: row;
      justify-content: space-between;
  }
  #footer-1147 .cs-copyright {

    font-size: 0.8rem;
  }
}