/*-- -------------------------- -->
<---          Banner            -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #banner-712 {
    z-index: 1;
    position: relative;
    /* 175px - 200px top */
    padding: clamp(10.9375rem, 10vw, 12.5rem) 1rem 6.25rem;
  }
  #banner-712 .cs-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin: auto;
    max-width: 80rem;
    width: 100%;
    text-align: center;
    gap: 1rem;
  }
  #banner-712 .cs-int-title {
    position: relative;
    margin: 0;
    font-family: Poppins;
    /* 39px - 61px */
    font-size: clamp(2.4375rem, 6.4vw, 3.8125rem);
    line-height: 1.2em;
    font-weight: 900;
    color: var(--bodyTextColorWhite);
    text-align: inherit;
  }
  #banner-712 .cs-background {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    width: 100%;
  }
  #banner-712 .cs-background img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* Makes img tag act as a background image */
    object-fit: cover;
  }
  #banner-712 .cs-background:before {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    /* background color overlay */
    content: "";
    opacity: 0.75;
    display: block;
    background: #000;
    height: 100%;
    width: 100%;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #banner-712 .cs-background:before {
    opacity: 1;
    background: linear-gradient(90.01deg, rgba(0, 0, 0, 0.9) 16.86%, rgba(0, 0, 0, 0) 100%);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #services-1188 .cs-card-group {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }
  #services-1188 .cs-item {
    margin: 0;
  }
}
/* Large Desktop - 1300px */
@media only screen and (min-width: 81.25rem) {
  #services-1188 .cs-card-group {
    max-width: 80rem;
  }
  #services-1188 .cs-item {
    max-width: none;
    padding: 2rem 1.5rem;
  }
}
/* Dark Mode */
@media only screen and (min-width: 0rem) {
  body.dark-mode #services-1188 .cs-topper {
    color: var(--primaryLight);
  }
  body.dark-mode #services-1188 .cs-item {
    background-color: var(--medium);
  }
  body.dark-mode #services-1188 .cs-text,
  body.dark-mode #services-1188 .cs-item-text {
    opacity: 0.8;
  }
  body.dark-mode #services-1188 .cs-picture {
    background-color: var(--accent);
  }
  body.dark-mode #services-1188 .cs-icon {
    /* turns it white */
    filter: grayscale(1) brightness(1000%);
  }
  body.dark-mode #services-1188 .cs-title,
  body.dark-mode #services-1188 .cs-text,
  body.dark-mode #services-1188 .cs-h3,
  body.dark-mode #services-1188 .cs-item-text {
    color: var(--bodyTextColorWhite);
  }
}
/*-- -------------------------- -->
<---         Timetable          -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #timetable-1731 {
    padding: var(--sectionPadding);
    position: relative;
    /* remove the font family so the Stitch inherits the fonts from your global stylesheet */
  }
  #timetable-1731 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #timetable-1731 .cs-content {
    /* set text align to center if content needs to be centrally aligned */
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    /* aligns content to the left, set to center to centrally align */
    align-items: flex-start;
  }
  #timetable-1731 .cs-button-solid {
    font-size: 1rem;
    font-weight: 700;
    /* 46px - 56px */
    line-height: clamp(2.875rem, 5.5vw, 3.5rem);
    text-align: center;
    text-decoration: none;
    min-width: 9.375rem;
    max-height: 2.875rem;
    margin: 0;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
    color: #fff;
    background-color: #e8e8e8;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    cursor: pointer;
  }
  #timetable-1731 .cs-button-solid span {
    height: 100%;
    padding: 0 1.5rem;
    background-color: var(--primary);
    display: block;
  }
  #timetable-1731 .cs-button-solid img {
    box-sizing: content-box;
    padding: 0.75rem;
    transition: filter 0.3s, transform 0.3s 0.15s;
  }
  #timetable-1731 .cs-button-solid:before {
    content: "";
    width: 0%;
    height: 100%;
    background-color: var(--primary);
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.5s;
  }
  #timetable-1731 .cs-button-solid:hover img {
    transform: translateX(0.25rem) translateY(-0.25rem);
    filter: brightness(0) invert(1);
  }
  #timetable-1731 .cs-button-solid:hover:before {
    width: 100%;
  }
  #timetable-1731 .cs-table-list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    /* 16px - 20px */
    gap: clamp(1rem, 3vw, 1.25rem);
  }
  #timetable-1731 .cs-table {
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  #timetable-1731 .cs-table thead {
    padding: 1.25rem;
    background-color: #e8e8e8;
    transition: background-color 0.3s;
  }
  #timetable-1731 .cs-table thead th {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 4vw, 1.5625rem);
    font-weight: 700;
    line-height: 1.2em;
    color: var(--headerColor);
    transition: color 0.3s;
  }
  #timetable-1731 .cs-table tbody {
    padding: 1.25rem;
    background-color: #f7f7f7;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  #timetable-1731 .cs-table tbody tr {
    display: flex;
    justify-content: space-between;
  }
  #timetable-1731 .cs-table tbody th,
  #timetable-1731 .cs-table tbody td {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5em;
    color: var(--bodyTextColor);
  }
  #timetable-1731 .cs-table:hover thead {
    background-color: var(--primary);
  }
  #timetable-1731 .cs-table:hover thead th {
    color: #fff;
  }
  #timetable-1731 .cs-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #timetable-1731 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #timetable-1731 .cs-content {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  #timetable-1731 .cs-table-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #timetable-1731 .cs-table-list {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* Dark Mode */
@media only screen and (min-width: 0rem) {
  body.dark-mode #timetable-1731 {
    background-color: rgba(0, 0, 0, 0.2);
  }
  body.dark-mode #timetable-1731 .cs-title {
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #timetable-1731 .cs-table thead {
    background-color: rgba(0, 0, 0, 0.6);
  }
  body.dark-mode #timetable-1731 .cs-table thead th {
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #timetable-1731 .cs-table tbody {
    background-color: rgba(0, 0, 0, 0.3);
  }
  body.dark-mode #timetable-1731 .cs-table tbody th,
  body.dark-mode #timetable-1731 .cs-table tbody td {
    color: var(--bodyTextColorWhite);
    opacity: 0.8;
  }
  body.dark-mode #timetable-1731 .cs-table:hover thead {
    background-color: var(--primary);
  }
  body.dark-mode #timetable-1731 .cs-table:hover thead th {
    color: #fff;
  }
  body.dark-mode #timetable-1731 .cs-background {
    display: none;
  }
}
/*-- -------------------------- -->
<---           Table            -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #table-1669 {
    padding: var(--sectionPadding);
  }
  #table-1669 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #table-1669 .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;
  }
  #table-1669 .cs-table {
    width: 100%;
    border-collapse: collapse;
  }
  #table-1669 .cs-th {
    padding: 0.75rem 1rem;
    box-sizing: border-box;
  }
  #table-1669 .cs-td {
    padding: 0.5rem 1rem;
    box-sizing: border-box;
  }
  #table-1669 .cs-th,
  #table-1669 .cs-td {
    border: 1px solid #ddd;
    text-align: center;
  }
  #table-1669 .cs-color .cs-th:first-child {
    color: #fff;
    background-color: var(--primary);
  }
  #table-1669 .cs-th:first-child,
  #table-1669 .cs-td:first-child {
    position: sticky;
    left: 0;
    z-index: 100;
    /* Make sure it sits above the other cells */
    background-color: #f2f2f2;
    border: 1px solid #ddd;
    text-align: left;
  }
  #table-1669 .cs-th {
    background-color: #f2f2f2;
  }
  #table-1669 .cs-tr {
    color: var(--bodyTextColor);
  }
  #table-1669 .cs-icon {
    height: 1rem;
    width: auto;
  }
}
/* Tablet - 600px */
@media screen and (max-width: 37.5rem) {
  #table-1669 .cs-table {
    display: block;
    overflow-x: auto;
  }
}
/* Dark Mode */
@media only screen and (min-width: 0rem) {
  body.dark-mode #table-1669 .cs-th {
    background-color: rgba(0, 0, 0, 0.6);
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #table-1669 .cs-th:first-child,
  body.dark-mode #table-1669 .cs-td:first-child {
    background-color: rgba(0, 0, 0, 0.6);
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #table-1669 .cs-th,
  body.dark-mode #table-1669 .cs-td {
    border-color: rgba(255, 255, 255, 0.2);
  }
  body.dark-mode #table-1669 .cs-color .cs-th:first-child {
    color: #fff;
    background-color: var(--secondary);
  }
  body.dark-mode #table-1669 .cs-tr {
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #table-1669 .cs-icon {
    filter: grayscale(1) brightness(1000%);
  }
}
/*-- -------------------------- -->
<---        Content Page        -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #content-page-714 {
    padding: var(--sectionPadding);
    background-color: #fff;
    /* clips the wave background from causing overflow issues when it goes off screen */
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  #content-page-714 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
    position: relative;
  }
  #content-page-714 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: left;
    width: 100%;
    max-width: 46.125rem;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: flex-start;
  }
  #content-page-714 .cs-content img {
    width: 100%;
    height: auto;
    margin: 1rem 0;
    display: block;
  }
  #content-page-714 h2,
  #content-page-714 h3,
  #content-page-714 h4,
  #content-page-714 h5,
  #content-page-714 h6 {
    font-weight: 700;
    text-align: inherit;
    margin: 0 0 1rem 0;
    color: var(--headerColor);
  }
  #content-page-714 h2 {
    font-size: 2rem;
    margin-top: 2rem;
  }
  #content-page-714 h3 {
    font-size: 1.5rem;
    color: var(--primary);
  }
  #content-page-714 h4,
  #content-page-714 h5,
  #content-page-714 h6 {
    font-size: 1.25rem;
  }
  #content-page-714 .cs-button-solid {
    margin-bottom: 2rem;
  }
  #content-page-714 .cs-color {
    color: var(--primary);
  }
  #content-page-714 p {
    font-size: var(--bodyFontSize);
    line-height: 1.5em;
    text-align: inherit;
    width: 100%;
    margin: 0 0 1rem 0;
    color: var(--bodyTextColor);
  }
  #content-page-714 p:last-of-type {
    margin-bottom: 2rem;
  }
  #content-page-714 p a {
    font-size: inherit;
    line-height: inherit;
    text-decoration: underline;
    color: var(--primary);
  }
  #content-page-714 ol,
  #content-page-714 ul {
    padding-left: 1.5rem;
    margin: 0 0 2rem 0;
    color: var(--bodyTextColor);
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  #content-page-714 ul li {
    list-style: none;
    color: inherit;
    position: relative;
  }
  #content-page-714 ul li:before {
    /* custom list bullet */
    content: "";
    width: 3px;
    height: 3px;
    background: currentColor;
    opacity: 1;
    border-radius: 50%;
    position: absolute;
    display: block;
    top: 0.625rem;
    left: -0.75rem;
  }
  #content-page-714 .cs-image-group {
    /* scales the whole section down and ties the font size to the vw and stops at 70% of the vale of 1em, changes at desktop */
    font-size: min(1vw, 1em);
    /* everything inside this box is in ems so we can scale it all down proportionally with a font size */
    width: 33.875em;
    height: 48.3125em;
    display: none;
    /* prevents flexbox from squishing it */
    flex: none;
    position: relative;
    z-index: 1;
  }
  #content-page-714 .cs-picture {
    width: 33.875em;
    height: 40.4375em;
    border-radius: 17.8125em;
    border: 0.75em solid #fff;
    background-color: #f7f7f7;
    /* prevents border from affecting height and width */
    box-sizing: border-box;
    /* clips img tag corners */
    overflow: hidden;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
  #content-page-714 .cs-picture img {
    width: 100%;
    height: 100%;
    /* makes it act like a background image */
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
  #content-page-714 .cs-flower {
    width: 22.625em;
    height: auto;
    display: block;
    position: absolute;
    bottom: -2.375em;
    right: -3em;
    z-index: -1;
    transform: rotate(142deg);
  }
  #content-page-714 .cs-sense {
    width: 5em;
    height: auto;
    position: absolute;
    top: -0.25em;
    left: 0.625em;
    transform: rotate(90deg);
  }
  #content-page-714 .cs-background {
    display: none;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #content-page-714 .cs-container {
    flex-direction: row;
    align-items: flex-start;
  }
  #content-page-714 .cs-image-group {
    display: block;
    /* sends it to the left in the 1st position */
    order: -1;
  }
  #content-page-714 .cs-content {
    margin-left: auto;
  }
  #content-page-714 .cs-background {
    width: 20%;
    height: 100%;
    background-color: #f7f7f7;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
  }
  #content-page-714 .cs-background img {
    width: 100%;
    height: 100%;
    opacity: 0.2;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
}
/* Large Desktop 1300px */
@media only screen and (min-width: 81.25rem) {
  #content-page-714 .cs-image-group {
    /* position absolute so we can have it overflow the container as seen in the design. */
    font-size: inherit;
    position: absolute;
    top: 0rem;
    left: -6.25rem;
  }
  #content-page-714 .cs-background {
    width: 50%;
    /* with the left edge always positioned at the center line, we push right of the center line by 335px.  This ensures that this element will stay exactly in this position no matter hoe wide the screen gets */
    margin-right: 20.9375rem;
    left: auto;
    /* sets the right edge of the element to be at the center line */
    right: 50%;
  }
}
/* Dark Mode */
@media only screen and (min-width: 0rem) {
  body.dark-mode #content-page-714 {
    background-color: var(--dark);
  }
  body.dark-mode #content-page-714 .cs-title,
  body.dark-mode #content-page-714 .cs-text,
  body.dark-mode #content-page-714 h2,
  body.dark-mode #content-page-714 h3,
  body.dark-mode #content-page-714 h4,
  body.dark-mode #content-page-714 h5,
  body.dark-mode #content-page-714 h6,
  body.dark-mode #content-page-714 li,
  body.dark-mode #content-page-714 p {
    color: var(--bodyTextColorWhite);
  }
  body.dark-mode #content-page-714 .cs-color,
  body.dark-mode #content-page-714 a {
    color: var(--primaryLight);
  }
  body.dark-mode #content-page-714 p,
  body.dark-mode #content-page-714 li {
    color: #ebebeb;
  }
  body.dark-mode #content-page-714 .cs-picture {
    border-color: var(--dark);
    background-color: var(--dark);
  }
  body.dark-mode #content-page-714 .cs-flower {
    filter: brightness(50%);
  }
  body.dark-mode #content-page-714 .cs-sense {
    filter: brightness(150%);
  }
  body.dark-mode #content-page-714 .cs-background {
    background-color: var(--medium);
    filter: brightness(70%);
  }
  body.dark-mode #content-page-714 .cs-background img {
    opacity: 0.1;
  }
}