@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap');


: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: #FFBF69;
    --primaryLight: #FFBF69;
    --secondary: #FFBF69;
    --secondaryLight: #FFBF69;
    --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;
}

*, *:before, *:after {
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
}
.cs-topper {
    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-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-size: var(--bodyFontSize);
    line-height: 1.5em;
    text-align: inherit;
    width: 100%;
    max-width: 40.625rem;
    margin: 0;
    color: var(--bodyTextColor);
}
                            


header
{
    margin:0;
    padding:15px;
    font-size: 20px;
    background-color: #FFBF69;
    
    
}

.header-ol
{
    margin:0;
    padding:0;
    display: flex;
    justify-content: space-evenly;
    list-style-type: none;
    color:rgb(121, 120, 118);
    font-weight: 500;
    
}

/*-- -------------------------- -->
<---           Stats            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #stats-1229 {
        padding: var(--sectionPadding);
        position: relative;
        z-index: 1;
    }
    #stats-1229:before {
        content: "";
        position: absolute;
        display: block;
        height: 100%;
        width: 100%;
        background: url("https://csimg.nyc3.cdn.digitaloceanspaces.com/Icons/chevron-pattern-light3.svg");
        background-position: center;
        background-size: auto;
        background-repeat: repeat;
        opacity: 0.3;
        top: 0;
        left: 0;
        z-index: -1;
    }
    #stats-1229 .cs-container {
        /* changes to 1280px at desktop */
        max-width: 36.5rem;
        width: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #stats-1229 .cs-content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }
    #stats-1229 .cs-flex {
        /* set text align to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }

    #stats-1229 .cs-title {
        max-width: 20ch;
    }
    #stats-1229 .cs-card-group {
        width: 100%;
        margin: 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        /* 16px - 20px */
        gap: clamp(1rem, 2vw, 1.25rem);
    }
    #stats-1229 .cs-item {
        list-style: none;
        width: 100%;
        
        /* prevents padding and border from affecting height and width */
        /* 16px - 40px top & bottom */
        /* 16px - 32px left & right */
        padding: clamp(1rem, 3vw, 2.5rem) clamp(1rem, 2.5vw, 2rem);
        box-sizing: border-box;
        background: #f7f7f7;
        border: 1px solid rgba(0, 0, 0, 0.1);
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative;
        gap: 0.75rem;
        /* clips cs-icon overflowing */
        overflow: hidden;
        grid-column: span 6;
        background-color: white;
    }
    #stats-1229 .cs-icon {
        /* 32px - 40px */
        width: clamp(2rem, 3vw, 2.5rem);
        height: auto;
        margin: 0;
        flex: none;
    }
    #stats-1229 .cs-h3 {
        /* 16px - 25px */
        font-size: clamp(1rem, 2vw, 1.5625rem);
        line-height: 1.2em;
        font-weight: 900;
        width: 100%;
        margin: 0;
        color: var(--headerColor);
        /* wraps longer words on the smallest screen sizes */
        overflow-wrap: break-word;
    }
    #stats-1229 .cs-stat-group {
        width: 100%;
        margin: auto;
        padding: 0;
        display: grid;
        justify-content: center;
        align-items: center;
        grid-template-columns: repeat(6, 1fr);
    }
    #stats-1229 .cs-stat {
        list-style: none;
        margin: 0;
        /* 16px - 40px */
        padding: clamp(1rem, 3vw, 2.5rem) 1rem;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        grid-column: span 2;
        /* border code */
        /* remove the border on the far-right elements */
        /* makes the last two items span across multiple columns. changes at desktop to one line */
    }
    #stats-1229 .cs-stat:before {
        content: "";
        width: 2px;
        height: 100%;
        background: linear-gradient(
            0deg,
            rgba(72, 72, 72, 0) 0%,
            #484848 50%,
            rgba(72, 72, 72, 0) 100%
        );
        position: absolute;
        top: 0;
        right: 0;
    }
    #stats-1229 .cs-stat:nth-of-type(3):before,
    #stats-1229 .cs-stat:nth-of-type(5):before {
        content: none;
    }
    #stats-1229 .cs-stat:nth-of-type(4),
    #stats-1229 .cs-stat:nth-of-type(5) {
        grid-column: span 3;
    }
    #stats-1229 .cs-desc {
        font-size: var(--bodyFontSize);
        line-height: 1.5em;
        text-align: center;
        /* keeps the width of the stat description from overflowing onto the border */
        /* 88px - 176px */
        width: clamp(5.5rem, 20vw, 11rem);
        margin-bottom: 0.5rem;
        color: #858585;
        display: block;
    }
    #stats-1229 .cs-number {
        /* 25px - 49px */
        font-size: clamp(1.5625rem, 3vw, 3.0625rem);
        line-height: 1.2em;
        font-weight: 900;
        margin: 0;
        color: var(--headerColor);
        display: block;
    }
}
/* Tablet - 650px */
@media only screen and (min-width: 40.625rem) {
    #stats-1229 .cs-container {
        flex-direction: row;
        flex-wrap: wrap;
    }
    #stats-1229 .cs-card-group {
        display: grid;
        /* makes all grid items stretch to have the same height if their content isn't all the same height */
        align-items: stretch;
        grid-template-columns: repeat(2, 1fr);
    }
    #stats-1229 .cs-item {
        grid-column: span 1;
        flex-direction: row;
        align-items: center;
    }
    #stats-1229 .cs-stat-group {
        flex-direction: row;
        flex-wrap: wrap;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #stats-1229 .cs-container {
        max-width: 80rem;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    #stats-1229 .cs-content {
        flex-direction: row;
        align-items: center;
    }
    #stats-1229 .cs-title,
    #stats-1229 .cs-text {
        max-width: none;
    }
    #stats-1229 .cs-card-group {
        width: 50%;
        /* prevents flexbox from squishing it */
        flex: none;
    }
    #stats-1229 .cs-stat-group {
        max-width: 80rem;
        grid-template-columns: repeat(5, 1fr);
    }
    #stats-1229 .cs-stat {
        grid-column: span 1;
    }
    #stats-1229 .cs-stat:nth-of-type(4),
    #stats-1229 .cs-stat:nth-of-type(5) {
        grid-column: span 1;
    }
    #stats-1229 .cs-stat:nth-of-type(3):before {
        content: "";
    }
}

/*-- -------------------------- -->
<---     Mobile Navigation      -->
<--- -------------------------- -*/
/* Mobile - 1023px */
@media only screen and (max-width: 63.9375rem) {
    body.cs-open {
      overflow: hidden;
    }
    body.scroll #cs-navigation {
      width: 100%;
      max-width: 100%;
      top: 0;
    }
    body.scroll #cs-navigation:before {
      border-radius: 0;
    }
    body.scroll #cs-navigation .cs-ul-wrapper {
      top: 100%;
    }
    #cs-navigation {
      width: 94%;
      max-width: 80rem;
      /* prevents padding from affecting height and width */
      box-sizing: border-box;
      /* 12px - 24px */
      padding: clamp(0.75rem, 2vw, 1.5rem);
      /* 12px - 24px */
      border-radius: clamp(0.75rem, 2vw, 1.5rem);
      position: fixed;
      top: 2rem;
      left: 50%;
      z-index: 10000;
      transform: translateX(-50%);
      transition: top 0.3s, border-radius 0.3s, width 0.3s, max-width 0.3s;
    }
    #cs-navigation:before {
      /* background color */
      content: "";
      width: 100%;
      height: 100%;
      background: #fff;
      box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
      opacity: 1;
      /* 12px - 24px */
      border-radius: clamp(0.75rem, 2vw, 1.5rem);
      display: block;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      transition: transform 0.2s, border-radius 0.3s ease-in-out;
    }
    #cs-navigation.cs-active:before {
      transform: translateX(-50%) scale(1.03);
    }
    #cs-navigation.cs-active .cs-toggle {
      transform: rotate(180deg);
    }
    #cs-navigation.cs-active .cs-ul-wrapper {
      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;
      gap: 1.5rem;
    }
    #cs-navigation .cs-logo {
      width: auto;
      max-width: 12.5rem;
      height: 100%;
      margin: 0 auto 0 0;
      /* prevents padding from affecting height and width */
      box-sizing: border-box;
      padding: 0;
      display: flex;
      justify-content: flex-start;
      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 {
      width: 3.5rem;
      height: 3.5rem;
      margin: 0 0 0 auto;
      background-color: #1a1a1a;
      border: none;
      border-radius: 0.25rem;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      z-index: 10;
      transition: transform 0.6s;
    }
    #cs-navigation .cs-nav {
      /* sends it to the right in the 3rd position */
      order: 3;
    }
    #cs-navigation .cs-contact-group {
      display: none;
      position: relative;
      z-index: 10;
    }
    #cs-navigation .cs-phone {
      font-size: 1rem;
      line-height: 1.5em;
      text-decoration: none;
      margin: 0;
      color:  #eeb973;;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      gap: 0.5rem;
      transition: opacity 0.3s, color 0.3s;
    }
    #cs-navigation .cs-phone-icon {
      width: 1.5rem;
      height: auto;
      display: block;
    }
    #cs-navigation .cs-social {
      display: none;
    }
    #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);
      height: 1rem;
      position: relative;
    }
    #cs-navigation .cs-line {
      width: 100%;
      height: 2px;
      background-color: #fafbfc;
      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;
      border-radius: 0 0 1.5rem 1.5rem;
      position: absolute;
      top: 85%;
      left: 0;
      z-index: -1;
      overflow: hidden;
      transform: scaleY(0);
      transition: transform 0.4s;
      transform-origin: top;
    }
    #cs-navigation .cs-ul {
      width: 100%;
      height: auto;
      max-height: 65vh;
      margin: 0;
      padding: 4rem 0 0 0;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      gap: 1.25rem;
      overflow: auto;
    }
    #cs-navigation .cs-li {
      text-align: center;
      list-style: none;
      width: 100%;
      margin-right: 0;
      opacity: 0;
      /* transition from these values */
      transform: translateY(-70/16rem);
      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-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.cs-active {
      color: #eeb973;
    }
    #cs-navigation .cs-li-link:hover {
      color: #eeb973;
    }
    #cs-navigation .cs-button-solid {
      display: none;
    }
  }
  /* Tablet - 768px */
  @media only screen and (min-width: 48rem) {
    #cs-navigation .cs-contact-group {
      display: block;
    }
  }
  /*-- -------------------------- -->
  <---     Navigation Dropdown    -->
  <--- -------------------------- -*/
  /* Mobile - 1023px */
  @media only screen and (max-width: 63.9375rem) {
    #cs-navigation .cs-li {
      text-align: center;
      width: 100%;
      display: block;
    }
    #cs-navigation .cs-dropdown {
      color: var(--bodyTextColorWhite);
      position: relative;
    }
    #cs-navigation .cs-dropdown.cs-active .cs-drop-ul {
      height: auto;
      margin: 0.75rem 0 0 0;
      padding: 0.75rem 0;
      opacity: 1;
      visibility: visible;
    }
    #cs-navigation .cs-dropdown.cs-active .cs-drop-link {
      opacity: 1;
    }
    #cs-navigation .cs-dropdown .cs-li-link {
      position: relative;
      transition: opacity 0.3s;
    }
    #cs-navigation .cs-drop-icon {
      width: 0.9375rem;
      height: auto;
      position: absolute;
      top: 50%;
      right: -1.25rem;
      transform: translateY(-50%);
    }
    #cs-navigation .cs-drop-ul {
      width: 100%;
      height: 0;
      margin: 0;
      padding: 0;
      background-color: var(--primary);
      opacity: 0;
      display: flex;
      visibility: hidden;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      gap: 0.75rem;
      overflow: hidden;
      transition: padding 0.3s, margin 0.3s, height 0.3s, opacity 0.3s, visibility 0.3s;
    }
    #cs-navigation .cs-drop-li {
      list-style: none;
    }
    #cs-navigation .cs-li-link.cs-drop-link {
      /* 14px - 16px */
      font-size: clamp(0.875rem, 2vw, 1.25rem);
      color: #fff;
    }
  }
  /* Desktop - 1024px */
  @media only screen and (min-width: 64rem) {
    #cs-navigation .cs-dropdown {
      position: relative;
    }
    #cs-navigation .cs-dropdown:hover {
      cursor: pointer;
    }
    #cs-navigation .cs-dropdown:hover .cs-drop-ul {
      opacity: 1;
      visibility: visible;
      transform: scaleY(1);
    }
    #cs-navigation .cs-dropdown:hover .cs-drop-li {
      opacity: 1;
      transform: translateY(0);
    }
    #cs-navigation .cs-drop-icon {
      width: 0.9375rem;
      height: auto;
      display: inline-block;
    }
    #cs-navigation .cs-drop-ul {
      min-width: 12.5rem;
      margin: 0;
      padding: 0;
      background-color: #fff;
      box-shadow: inset rgba(0, 128, 255, 0.1) 0px 8px 10px;
      opacity: 0;
      border-bottom: 5px solid #eeb973;;
      border-radius: 0 0 1.5rem 1.5rem;
      visibility: hidden;
      /* if you have 8 or more links in your dropdown nav, uncomment the columns property to make the list into 2 even columns. Change it to 3 or 4 if you need extra columns. Then remove the transition delays on the cs-drop-li so they don't have weird scattered animations */
      position: absolute;
      top: 100%;
      z-index: -100;
      overflow: hidden;
      transform: scaleY(0);
      transition: transform 0.3s, visibility 0.3s, opacity 0.3s;
      transform-origin: top;
    }
    #cs-navigation .cs-drop-li {
      font-size: 1rem;
      text-decoration: none;
      list-style: none;
      width: 100%;
      height: auto;
      opacity: 0;
      display: block;
      transform: translateY(-0.625rem);
      transition: opacity 0.6s, transform 0.6s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(1) {
      transition-delay: 0.05s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(2) {
      transition-delay: 0.1s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(3) {
      transition-delay: 0.15s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(4) {
      transition-delay: 0.2s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(5) {
      transition-delay: 0.25s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(6) {
      transition-delay: 0.3s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(7) {
      transition-delay: 0.35s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(8) {
      transition-delay: 0.4s;
    }
    #cs-navigation .cs-drop-li:nth-of-type(9) {
      transition-delay: 0.45s;
    }
    #cs-navigation .cs-li-link.cs-drop-link {
      font-size: 1rem;
      line-height: 1.5em;
      text-transform: capitalize;
      text-decoration: none;
      white-space: nowrap;
      width: 100%;
      /* prevents padding from affecting height and width */
      box-sizing: border-box;
      padding: 0.75rem;
      color: var(--headerColor);
      display: block;
      transition: color 0.3s, background-color 0.3s;
    }
    #cs-navigation .cs-li-link.cs-drop-link:hover {
      color: var(--bodyTextColorWhite);
      background-color: var(--primary);
    }
    #cs-navigation .cs-li-link.cs-drop-link:before {
      display: none;
    }
  }
  /*-- -------------------------- -->
  <---     Desktop Navigation     -->
  <--- -------------------------- -*/
  /* Small Desktop - 1024px */
  @media only screen and (min-width: 64rem) {
    body.scroll #cs-navigation {
      width: 100%;
      max-width: 100%;
      border-radius: 0;
      top: 0;
    }
    #cs-navigation {
      width: 94%;
      max-width: 90rem;
      height: 6rem;
      /* prevents padding from affecting height and width */
      box-sizing: border-box;
      /* 12px - 24px */
      padding: clamp(0.75rem, 2vw, 1.5rem) 0;
      background-color: #fff;
      box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
      /* 12px - 24px */
      border-radius: clamp(0.75rem, 2vw, 1.5rem);
      display: flex;
      align-items: center;
      position: fixed;
      top: 2rem;
      left: 50%;
      z-index: 10000;
      transform: translateX(-50%);
      transition: top 0.3s, border-radius 0.3s, width 0.3s, max-width 0.3s;
    }
    #cs-navigation .cs-container {
      width: 100%;
      max-width: 90rem;
      margin: auto;
      /* prevents padding from affecting height and width */
      box-sizing: border-box;
      padding: 0 1.5rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 1.5rem;
    }
    #cs-navigation .cs-toggle {
      display: none;
    }
    #cs-navigation .cs-logo {
      width: 18.4%;
      max-width: 21.875rem;
      height: 2rem;
      /* margin-right auto pushes everything away from it to the right */
      margin: 0 auto 0 0;
      padding: 0;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      z-index: 100;
    }
    #cs-navigation .cs-logo img {
      width: auto;
      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-contact-group {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 1.5rem;
    }
    #cs-navigation .cs-phone {
      font-size: 1rem;
      line-height: 1.5em;
      text-decoration: none;
      margin: 0;
      color: var(--headerColor);
      display: flex;
      justify-content: flex-start;
      align-items: center;
      gap: 0.5rem;
      transition: opacity 0.3s, color 0.3s;
    }
    #cs-navigation .cs-phone-icon {
      width: 1.5rem;
      height: auto;
      display: block;
    }
    #cs-navigation .cs-social {
      height: 2rem;
      opacity: 1;
      display: none;
      visibility: visible;
      justify-content: center;
      align-items: center;
      gap: 0.5rem;
      transition: opacity 0.3s, visibility 0.3s, height 0.3s;
    }
    #cs-navigation .cs-social-link {
      text-decoration: none;
      width: 2rem;
      height: 2rem;
      background-color: #f7f7f7;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: background-color 0.3s;
    }
    #cs-navigation .cs-social-link:hover {
      background-color: var(--primary);
    }
    #cs-navigation .cs-social-link:hover .cs-social-icon {
      opacity: 1;
      filter: grayscale(1) brightness(10000%);
    }
    #cs-navigation .cs-social-icon {
      width: 0.75rem;
      height: auto;
      opacity: 0.6;
      display: block;
      transition: opacity 0.3s;
    }
    #cs-navigation .cs-ul-wrapper {
      height: 100%;
      display: flex;
      align-items: center;
      /* absolutely positioned to be dead center */
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    #cs-navigation .cs-ul {
      width: 100%;
      height: 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;
      height: 100%;
      padding: 0;
      display: flex;
      align-items: center;
      /* prevent flexbox from squishing it */
      flex: none;
    }
    #cs-navigation .cs-li-link {
      font-size: 1rem;
      line-height: 1.5em;
      text-decoration: none;
      margin: 0;
      color: var(--headerColor);
      display: block;
      position: relative;
      transition: color 0.3s;
    }
    #cs-navigation .cs-li-link:hover {
      color: var(--primary);
    }
    #cs-navigation .cs-li-link.cs-active {
      color: var(--primary);
    }
    #cs-navigation .cs-button-solid {
      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 2rem;
      color: #fff;
      background-color: var(--primary);
      display: inline-block;
      position: relative;
      z-index: 1;
      transition: color 0.3s;
    }
    #cs-navigation .cs-button-solid:before {
      content: "";
      width: 0%;
      height: 100%;
      background: #fff;
      opacity: 1;
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
      transition: width 0.3s;
    }
    #cs-navigation .cs-button-solid:hover {
      color: #1a1a1a;
    }
    #cs-navigation .cs-button-solid:hover:before {
      width: 100%;
    }
  }
  /* Large Desktop - 1300px */
  @media only screen and (min-width: 81.25rem) {
    #cs-navigation .cs-social {
      display: flex;
    }
  }
                                  
/*-- -------------------------- -->
<---        Why Choose          -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #why-choose-289 {
      text-align: center;
      padding: var(--sectionPadding);
  }
  #why-choose-289 .cs-container {
      width: 100%;
      /* changes to 1280px on tablet */
      max-width: 34.375rem;
      margin: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      /* 48px - 64px */
      gap: clamp(3rem, 6vw, 4rem);
  }
  #why-choose-289 .cs-content {
      /* set text align to left if content needs to be left aligned */
      text-align: left;
      width: 100%;
      display: flex;
      flex-direction: column;
      /* centers content horizontally, set to flex-start to left align */
      align-items: flex-start;
  }
  #why-choose-289 .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;
  }
  #why-choose-289 .cs-title {
      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;
  }
  #why-choose-289 .cs-text {
      font-size: var(--bodyFontSize);
      line-height: 1.5em;
      text-align: inherit;
      width: 100%;
      max-width: 40.625rem;
      margin: 0;
      color: var(--bodyTextColor);
  }
  #why-choose-289 .cs-text {
      max-width: 32.625rem;
  }
  #why-choose-289 .cs-card-group {
      width: 100%;
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      gap: 1rem;
  }
  #why-choose-289 .cs-item {
      list-style: none;
      text-align: left;
      width: 100%;
      padding: 2rem;
      background-color: #f7f7f7;
      border-radius: 1rem;
      /* prevents padding from adding to height and width */
      box-sizing: border-box;
      transition: background-color 0.3s;
  }
  #why-choose-289 .cs-item:hover {
      background-color: #eeb973;
      cursor: pointer;
  }
  #why-choose-289 .cs-item:hover .cs-icon {
      filter: grayscale(1) brightness(200%);
  }
  #why-choose-289 .cs-item:hover .cs-h3 {
      color: var(--bodyTextColorWhite);
  }
  #why-choose-289 .cs-item:hover .cs-item-text {
      color: var(--bodyTextColorWhite);
  }
  #why-choose-289 .cs-icon {
      width: auto;
      height: 3rem;
      margin-bottom: 1.5rem;
      display: block;
      transition: filter 0.3s;
  }
  #why-choose-289 .cs-h3 {
      /* 20px - 25px */
      font-size: clamp(1.25rem, 2.5vw, 1.5625rem);
      line-height: 1.2em;
      margin: 0;
      margin-bottom: 1rem;
      color: var(--headerColor);
      transition: color 0.3s;
  }
  #why-choose-289 .cs-item-text {
      font-size: 1rem;
      line-height: 1.5em;
      margin: 0;
      color: var(--bodyTextColor);
      transition: color 0.3s;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #why-choose-289 .cs-container {
      max-width: 80rem;
  }
  #why-choose-289 .cs-content {
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-end;
      gap: 4rem;
  }
  #why-choose-289 .cs-flex {
      width: 50%;
  }
  #why-choose-289 .cs-title {
      margin: 0;
  }
  #why-choose-289 .cs-card-group {
      justify-content: space-between;
      /* makes sure every box "stretches" to be the same height as the tallest box */
      align-items: stretch;
      flex-direction: row;
      /* 16px - 20px */
      gap: clamp(1rem, 1.5vw, 1.25rem);
  }
  #why-choose-289 .cs-item {
      width: auto;
      /* 16px - 32px */
      padding: 2rem clamp(1rem, 2.1vw, 2rem);
  }
}








: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: #ff6a3e;
  --primaryLight: #ffba43;
  --secondary: #ffba43;
  --secondaryLight: #ffba43;
  --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;
}

*, *:before, *:after {
  /* prevents padding from affecting height and width */
  box-sizing: border-box;
}
.cs-topper {
  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-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-size: var(--bodyFontSize);
  line-height: 1.5em;
  text-align: inherit;
  width: 100%;
  max-width: 40.625rem;
  margin: 0;
  color: var(--bodyTextColor);
}
                          

/*-- -------------------------- -->
<---          Reviews           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #reviews-1537 {
    padding: var(--sectionPadding);
  }
  #reviews-1537 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #reviews-1537 .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;
  }
  #reviews-1537 .cs-title {
    max-width: 23ch;
  }
  #reviews-1537 .cs-card-group {
    width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* 16px - 20px */
    gap: clamp(1rem, 2.5vw, 1.15rem);
    row-gap: 1.5rem;
  }
  #reviews-1537 .cs-item {
    list-style: none;
    width: 100%;
    /* removed at desktop */
    max-width: 28.875rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
  }
  #reviews-1537 .cs-review {
    /* 14px - 20px */
    font-size: clamp(0.875rem, 1.6vw, 1.25rem);
    line-height: 1.5em;
    margin: 0;
    /* 24px - 48px */
    padding: clamp(1.5rem, 6vw, 3rem);
    height: 100%;
    min-height: 10rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    /* 20px - 40px */
    margin-bottom: clamp(1.25rem, 4vw, 2.5rem);
    color: white;
    
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  #reviews-1537 .cs-svg {
    --svgBG: #F2FAF8;
    --svgBorder: #E5F4F0;
    
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    
  }
  #reviews-1537 .cs-flex-group {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.75rem;
    
  }
  #reviews-1537 .cs-profile {
    width: 3.125rem;
    height: 3.125rem;
    border: 2px solid #BABABA;
    background-color: #BABABA;
    border-radius: 50%;
    /* clips image corners to make circle */
    overflow: hidden;
    position: relative;
    display: block;
    
  }
  #reviews-1537 .cs-profile img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* makes the image behave like a background image */
    object-fit: cover;
  }
  #reviews-1537 .cs-name {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 3vw, 1.5625rem);
    line-height: 1.2em;
    font-weight: 700;
    margin: 0;
    /* in case one card has more text than the other, this pushes up against the review text so the name and title are always at the bottom. Only works if parent is a flexbox */
    margin-top: auto;
    color: var(--headerColor);
    display: block;
  }
  #reviews-1537 .cs-job {
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 700;
    margin: 0;
    color: var(--secondary);
    display: block;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #reviews-1537 .cs-card-group {
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
  }
  #reviews-1537 .cs-item {
    max-width: 100%;
  }
  #reviews-1537 .cs-review {
    min-height: 15.625rem;
  }
}
                                

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #contact-1388 {
      padding: var(--sectionPadding);
      position: relative;
      z-index: 1;
  }
  #contact-1388 .cs-container {
      width: 100%;
      /* changes to 1280px at tablet */
      max-width: 36.5rem;
      margin: auto;
      display: flex;
      justify-content: center;
      align-items: stretch;
      flex-direction: column;
      column-gap: auto;
      /* 48px - 64px */
      gap: clamp(2rem, 3vw, 3rem);
      position: relative;
  }
  #contact-1388 .cs-content {
      /* set text align to left if content needs to be left aligned */
      text-align: left;
      width: 100%;
      display: flex;
      flex-direction: column;
      /* centers content horizontally, set to flex-start to left align */
      align-items: flex-start;
  }

  #contact-1388 .cs-title {
      max-width: 23ch;
  }
  #contact-1388 .cs-text {
      margin-bottom: 1rem;
  }
  #contact-1388 .cs-text:last-of-type {
      margin-bottom: 2rem;
  }
  #contact-1388 .cs-ul {
      text-align: left;
      width: 100%;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 1.5rem;
      position: relative;
  }
  #contact-1388 .cs-li {
      list-style: none;
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      gap: 1.25rem;
  }
  #contact-1388 .cs-li:hover .cs-icon-wrapper {
      transform: scale(1.1);
  }
  #contact-1388 .cs-header {
      font-size: 1.25rem;
      font-weight: 700;
      line-height: 1.2em;
      margin-bottom: 0.75rem;
      color: var(--headerColor);
      display: block;
  }
  #contact-1388 .cs-link {
      font-size: 1rem;
      line-height: 1.5em;
      text-decoration: none;
      color: #767676;
      display: block;
      position: relative;
  }
  #contact-1388 .cs-link:hover {
      text-decoration: underline;
  }
  #contact-1388 .cs-icon-wrapper {
      width: 3.75rem;
      height: 3.75rem;
      margin: 0;
      border-radius: 50%;
      border: 1px solid #bababa;
      display: flex;
      justify-content: center;
      align-items: center;
      /* prevents flexbox from squishing it */
      flex: none;
      transition: transform 0.3s;
  }
  #contact-1388 .cs-icon {
      width: 1.5rem;
      height: auto;
      display: block;
  }
  #contact-1388 .cs-form {
      width: 100%;
      max-width: 39.375rem;
      /* 24px - 48px top and bottom */
      /* 16px - 48px left and right */
      padding: clamp(1.5rem, 5.18vw, 3rem) clamp(1rem, 4vw, 3rem);
      /* prevents flexbox from affecting height and width */
      box-sizing: border-box;
      background-color: #fff;
      border-radius: 1rem;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.75rem;
  }
  #contact-1388 .cs-h3 {
      /* 20px - 39px */
      font-size: clamp(1.25rem, 3vw, 2.4375rem);
      line-height: 1.2em;
      font-weight: 700;
      margin: 0 0 0.25rem 0;
      color: var(--headerColor);
  }
  #contact-1388 .cs-label {
      /* 14px - 16px */
      font-size: clamp(0.875rem, 1.5vw, 1rem);
      width: 100%;
      color: var(--headerColor);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      gap: 0.25rem;
  }
  #contact-1388 .cs-input {
      font-size: 1rem;
      width: 100%;
      height: 3.5rem;
      padding: 0;
      padding-left: 1.5rem;
      color: var(--headerColor);
      background-color: #f7f7f7;
      border-radius: 0.5rem;
      border: none;
      /* prevents padding from adding to height and width */
      box-sizing: border-box;
  }
  #contact-1388 .cs-input::placeholder {
      color: #7d799c;
      opacity: 0.6;
  }
  #contact-1388 .cs-textarea {
      min-height: 7.5rem;
      padding-top: 1.5rem;
      margin-bottom: 0.75rem;
      font-family: inherit;
  }
  #contact-1388 .cs-button-solid {
      font-size: 1rem;
      line-height: 3.5rem;
      text-decoration: none;
      font-weight: 700;
      overflow: hidden;
      margin: 0;
      color: #fff;
      padding: 0 3rem;
      border-radius: 1.875rem;
      background-color: #eeb973;
      display: inline-block;
      position: relative;
      z-index: 1;
      transition: color 0.3s;
  }
  #contact-1388 .cs-button-solid:before {
      content: "";
      position: absolute;
      display: block;
      height: 100%;
      width: 0%;
      background: #1a1a1a;
      opacity: 1;
      top: 0;
      left: 0;
      z-index: -1;
      transition: width 0.3s;
  }
  #contact-1388 .cs-button-solid:hover {
      color: var(--primary);
  }
  #contact-1388 .cs-button-solid:hover:before {
      width: 100%;
  }
  #contact-1388 .cs-submit {
      width: 100%;
      min-width: 12.5rem;
      border: none;
  }
  #contact-1388 .cs-submit:hover {
      color: #fff;
      cursor: pointer;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #contact-1388 .cs-container {
      max-width: 80rem;
      flex-direction: row;
      justify-content: space-between;
  }
  #contact-1388 .cs-content {
      width: 47%;
      /* prevents flexbox from squishing it */
      flex: none;
  }
  #contact-1388 .cs-submit {
      width: auto;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #contact-1388 .cs-form {
      width: 46%;
      max-width: 36.125rem;
  }
  #contact-1388 .cs-submit {
      width: auto;
  }
}
/* Large Desktop - 1500px */
@media only screen and (min-width: 93.75rem) {
  #contact-1388 .cs-graphic {
      display: block;
  }
}