:root {
  --color-text-alt: #333;
  --color-text: #584d66;
  --color-background: #f8f7f9;
  --color-primary: #9f0498;
  --color-primary2: #e3c5f2;
  --color-primary3: #bd0760;
  --color-dark: #5d21a1;
  --color-shadow: #333;
  --form-shadow: rgba(178, 177, 177, 0.638);
  --gray-0: #f8f8f8;
  --gray-1: #dbe1e8;
  --gray-2: #b2becd;
  --gray-3: #6c7983;
  --gray-4: #454e56;
  --test-s: #6262629d;
  --gray-5: #2a2e35;
  --gray-6: #12181b;
  --tab-color: #191d2d;
  --tab-hover: #f8f8f8; }

html {
  scroll-behavior: smooth; }

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none; }

body {
  background-color: var(--color-background);
  color: var(--color-text);
  font-family: 'Roboto', sans-serif;
  line-height: 1.8;
  font-size: 14pt;
  letter-spacing: 1px;
  overflow-x: hidden; }

a {
  display: inline-block;
  text-decoration: none;
  color: inherit;
  font-family: inherit; }

.highlight-text {
  color: var(--color-accent-medium); }

.header-border {
  box-shadow: 0 0 8px 1px var(--color-accent-medium); }

.active-tab {
  background: var(--color-accent-medium);
  border-radius: 20px 0 0 0; }

#header {
  position: sticky;
  height: 460px;
  width: 100%;
  z-index: 40; }
  #header #head-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem 0 1rem 0; }
    #header #head-container #logo-box {
      width: 160px; }
      #header #head-container #logo-box #logo {
        width: 100%; }
    #header #head-container .right-header {
      display: flex;
      flex-direction: column;
      justify-content: center; }
      #header #head-container .right-header #nav-btn {
        display: none; }
      #header #head-container .right-header #navbar {
        display: flex;
        justify-content: space-between;
        font-size: 1.2rem;
        width: 300px;
        padding: 0.5rem 0; }
        #header #head-container .right-header #navbar li {
          border-bottom: 3px transparent solid;
          padding-bottom: 0.5rem;
          transition: border-color 0.5s;
          width: auto; }
          #header #head-container .right-header #navbar li:hover {
            cursor: pointer;
            color: var(--color-primary); }
          #header #head-container .right-header #navbar li.current {
            border-bottom: 3px var(--color-primary) solid; }
          #header #head-container .right-header #navbar li a {
            width: 100%;
            text-align: center; }
  #header h1 {
    text-align: center;
    font-size: 7rem;
    margin-top: -3rem;
    color: var(--color-primary);
    color: white; }

#tri-color-bar {
  background: linear-gradient(to left, var(--color-primary3) 10%, var(--color-primary) 66%, var(--color-dark));
  height: 20px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  text-align: center;
  color: white; }
  #tri-color-bar #c-one {
    height: 100%;
    width: 33.3%;
    margin-left: 1px; }
  #tri-color-bar #c-two {
    height: 100%;
    width: 33.3%; }
  #tri-color-bar #c-three {
    height: 100%;
    width: 33.3%; }

#home #paralax {
  position: fixed;
  z-index: -10; }
  #home #paralax #paralax-backdrop {
    display: flex;
    justify-content: center; }
    #home #paralax #paralax-backdrop #paralax-img {
      width: 925px;
      margin-top: -5rem; }

#home #hero {
  height: 120vh;
  overflow: hidden; }
  #home #hero #header {
    background-color: var(--color-background);
    height: 140px; }
  #home #hero #tri-color-bar {
    height: 60px;
    position: relative; }
    #home #hero #tri-color-bar #three-words {
      position: absolute;
      display: flex;
      justify-content: space-between;
      width: 100%; }
  #home #hero #banner {
    height: 100%;
    position: relative; }
    #home #hero #banner #banner-container {
      display: flex;
      position: relative;
      z-index: 1; }
      #home #hero #banner #banner-container #mobile-back {
        display: none; }
      #home #hero #banner #banner-container #banner-right {
        background: var(--color-background);
        width: 50%;
        height: 120vh;
        padding: 0.5rem 0 0 3rem;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-left: 50%;
        z-index: 5; }
        #home #hero #banner #banner-container #banner-right h1 {
          color: var(--color-primary);
          font-size: 4.5rem;
          font-family: 'outfit', sans-serif;
          font-weight: 600;
          margin-bottom: 1rem;
          text-align: left;
          height: 40%; }
        #home #hero #banner #banner-container #banner-right #messages {
          height: 50%;
          font-size: 1.6rem;
          display: flex;
          flex-direction: column;
          align-items: center; }
          #home #hero #banner #banner-container #banner-right #messages #message-one {
            padding: 0 0 2rem 2rem; }
          #home #hero #banner #banner-container #banner-right #messages #message-two {
            text-align: right;
            margin-left: 4rem; }

#home #ecosystems {
  position: relative;
  height: 590px; }
  #home #ecosystems #eco-back {
    background: var(--color-background);
    position: absolute;
    top: 85px;
    height: 535px;
    width: 100%; }
  #home #ecosystems #eco-container {
    position: relative;
    height: 500px; }
    #home #ecosystems #eco-container img {
      position: absolute;
      width: 53%;
      top: 30px;
      right: 15px;
      border-radius: 0 20px 20px 0;
      z-index: 2;
      border-bottom: var(--color-primary) 3px solid;
      border-right: var(--color-primary) 3px solid; }
    #home #ecosystems #eco-container #img-back {
      position: absolute;
      background-color: var(--color-primary);
      height: 400px;
      width: 50px;
      top: 40px;
      right: 0;
      border-radius: 20px;
      z-index: 1; }
    #home #ecosystems #eco-container #eco-top {
      background-color: var(--color-primary);
      height: 100px;
      border-radius: 20px;
      display: flex;
      flex-direction: column;
      color: var(--color-primary2);
      padding: 1.4rem 0 0 5rem; }
      #home #ecosystems #eco-container #eco-top .label {
        color: white; }
    #home #ecosystems #eco-container #eco-bottom {
      display: flex;
      align-items: center;
      flex-direction: column;
      margin-top: 1rem;
      padding-left: 3rem;
      width: 40%; }
      #home #ecosystems #eco-container #eco-bottom p {
        padding: 1rem 2rem;
        text-align: justify;
        margin-bottom: 3rem;
        font-size: 1.4rem; }
        #home #ecosystems #eco-container #eco-bottom p .underline {
          font-style: italic;
          padding-bottom: 3px;
          border-bottom: var(--color-primary) 2px solid; }

#home #services {
  background: linear-gradient(var(--color-background), var(--color-primary2));
  height: auto;
  box-shadow: #2b0c2bac 0 2px 8px 4px;
  padding-bottom: 2rem; }
  #home #services .heading {
    color: var(--color-primary);
    text-align: center;
    padding: 1.5rem 0 0 0; }
  #home #services #services-tag {
    display: none; }
  #home #services .bar {
    width: 15%; }
  #home #services #services-container {
    color: white;
    margin-top: 2rem;
    height: auto; }
    #home #services #services-container .arrow-btn {
      background: red;
      height: 10px;
      width: 100px;
      border-radius: 50%;
      z-index: 3; }
    #home #services #services-container #serv-arrow-button-left,
    #home #services #services-container #serv-arrow-button-right {
      display: none; }
    #home #services #services-container #service-carousel {
      display: flex;
      justify-content: space-between;
      padding: 1rem;
      height: auto; }
      #home #services #services-container #service-carousel .service-card {
        width: 32%;
        height: auto;
        border-radius: 20px;
        padding: 1rem 2rem;
        box-shadow: #660b65ac 0 2px 8px 2px; }
        #home #services #services-container #service-carousel .service-card .card-label {
          margin-bottom: 1rem;
          font-size: 1.8rem;
          text-align: center; }
        #home #services #services-container #service-carousel .service-card .service-text {
          text-align: center;
          letter-spacing: 1.5px;
          font-size: 1.2rem; }
    #home #services #services-container #identify-card {
      background: var(--color-dark); }
    #home #services #services-container #incubate-card {
      background: var(--color-primary); }
    #home #services #services-container #ignite-card {
      background: var(--color-primary3); }

#home #map {
  height: 700px;
  overflow: hidden;
  position: relative; }
  #home #map #overlay {
    background: rgba(243, 241, 241, 0.419);
    z-index: -8;
    position: absolute;
    height: 100%;
    width: 100%; }
  #home #map #map-container {
    flex-direction: column;
    color: var(--color-dark);
    font-size: 3rem;
    height: 100%; }
    #home #map #map-container p {
      margin-bottom: 8rem; }
      #home #map #map-container p .highlight {
        color: var(--color-primary3);
        font-size: 3rem;
        font-style: normal; }

#home #about-us {
  background: var(--color-dark);
  height: 475px;
  color: var(--color-primary2);
  box-shadow: #2b0c2bac 2px 0 8px 4px; }
  #home #about-us .spacer {
    background: var(--color-background);
    height: 50px;
    width: 100%; }
  #home #about-us #about-us-container {
    flex-direction: column;
    text-align: start; }
  #home #about-us .label {
    color: white;
    text-align: center;
    padding: 1.5rem 0 1rem 0; }
  #home #about-us p {
    font-size: 1.5rem; }

#home #mission-vision {
  background: var(--color-background);
  height: 900px; }
  #home #mission-vision #mission-vision-container {
    display: flex;
    height: 100%;
    padding-top: 2rem; }
    #home #mission-vision #mission-vision-container #mv-left {
      display: flex;
      flex-direction: column;
      justify-content: space-evenly;
      width: 50%;
      padding: 6rem 2rem 3rem 0; }
      #home #mission-vision #mission-vision-container #mv-left #mv-l-top {
        height: 50%;
        margin-bottom: 2rem; }
      #home #mission-vision #mission-vision-container #mv-left #mv-l-bottom {
        height: 50%; }
      #home #mission-vision #mission-vision-container #mv-left .label {
        color: var(--color-primary);
        font-size: 2.2rem;
        margin-bottom: 1rem; }
      #home #mission-vision #mission-vision-container #mv-left .text {
        font-size: 1.5rem; }
    #home #mission-vision #mission-vision-container #mv-right {
      width: 50%;
      padding: 5rem 0 0 4rem; }
      #home #mission-vision #mission-vision-container #mv-right #img-group {
        height: 95%;
        position: relative; }
        #home #mission-vision #mission-vision-container #mv-right #img-group img {
          margin: 0.5rem 0 0 1.5rem;
          width: 90%;
          position: absolute;
          z-index: 2;
          border-radius: 0 20px 20px 20px;
          border-top: var(--color-primary) 5px solid;
          border-right: var(--color-primary) 5px solid; }
        #home #mission-vision #mission-vision-container #mv-right #img-group #img-back {
          margin: 2.5rem 0 0 3rem;
          background: var(--color-primary);
          width: 90%;
          height: 90%;
          z-index: 1;
          position: absolute;
          border-radius: 0 20px 20px 20px; }

#home #quote {
  background: var(--color-background);
  color: var(--color-primary);
  font-size: 1.1rem;
  letter-spacing: 3.2px;
  height: 300px;
  padding-bottom: 2rem; }

#home #experts {
  background-color: var(--color-background);
  height: 630px;
  position: relative;
  z-index: 0; }
  #home #experts #experts-background {
    background: linear-gradient(var(--color-background), var(--color-primary2) 45%);
    position: absolute;
    height: 500px;
    width: 100%;
    top: 130px;
    z-index: -1; }
  #home #experts #experts-card {
    background: var(--color-dark);
    height: 520px;
    display: flex;
    justify-content: space-between;
    border-radius: 20px 20px; }
    #home #experts #experts-card #experts-text {
      width: 35%;
      padding-left: 2rem; }
      #home #experts #experts-card #experts-text .label {
        margin-top: 3rem;
        color: white; }
      #home #experts #experts-card #experts-text p {
        color: var(--color-primary2);
        margin-top: 2rem; }
    #home #experts #experts-card img {
      padding: 1rem;
      border-radius: 0 30px 30px 0px; }

#about #backdrop {
  height: 460px;
  width: 100%;
  background: url("../img/stock/about_header_v2.jpg") rgba(65, 63, 65, 0.522);
  background-size: cover;
  background-position-y: 55%;
  background-blend-mode: multiply;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1; }

#about #mission {
  height: auto;
  background-color: var(--color-background); }
  #about #mission #mobile-header {
    display: none; }
  #about #mission .heading {
    color: var(--color-primary); }
  #about #mission p {
    text-align: justify; }

#about #bio {
  background-color: var(--color-background);
  padding-top: 4rem; }
  #about #bio #bio-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    text-align: justify; }
    #about #bio #bio-container #bio-card-top {
      display: flex; }
    #about #bio #bio-container #bio-grid {
      display: grid;
      width: 100%;
      height: auto;
      grid-template-columns: 38% auto;
      grid-template-rows: auto auto auto auto;
      grid-template-areas: 'img p1'
 'img p2'
 'expander expander'
 'expander expander'; }
      #about #bio #bio-container #bio-grid #bio-img-card {
        width: 100%;
        grid-area: img; }
        #about #bio #bio-container #bio-grid #bio-img-card img {
          width: 90%;
          border-radius: 5%;
          box-shadow: var(--color-primary2) 15px 15px 0px 0px; }
      #about #bio #bio-container #bio-grid #bio-p1 {
        grid-area: p1;
        padding: 0 0 1rem 1rem; }
        #about #bio #bio-container #bio-grid #bio-p1 #name-card-mobile {
          display: none; }
      #about #bio #bio-container #bio-grid #bio-p2 {
        grid-area: p2;
        padding: 1rem 0 1rem 1rem; }
      #about #bio #bio-container #bio-grid #expander {
        grid-area: expander; }
        #about #bio #bio-container #bio-grid #expander #bio-p2-mobile {
          display: none; }
        #about #bio #bio-container #bio-grid #expander #bio-p3 {
          padding: 1rem 0; }
        #about #bio #bio-container #bio-grid #expander #bio-p4 {
          padding-top: 1rem; }
        #about #bio #bio-container #bio-grid #expander #read-more-bar {
          display: none; }
        #about #bio #bio-container #bio-grid #expander #expander-text {
          height: auto;
          transition: height ease-out; }

#about #expertise {
  background-color: var(--color-background);
  padding: 5%;
  width: 100%; }
  #about #expertise #exp-arrow-button-left,
  #about #expertise #exp-arrow-button-right {
    display: none; }
  #about #expertise #exp-carousel {
    display: flex;
    justify-content: space-between; }
    #about #expertise #exp-carousel .icon-group {
      display: flex;
      flex-direction: column;
      flex-wrap: wrap;
      align-items: center;
      width: 33%;
      text-align: center;
      padding: 0 1.5rem; }
      #about #expertise #exp-carousel .icon-group i {
        padding-bottom: 2rem;
        font-size: 4.5rem; }
      #about #expertise #exp-carousel .icon-group .icon-label {
        height: 95px;
        display: flex;
        align-items: center;
        margin: 0.5rem 0; }
        #about #expertise #exp-carousel .icon-group .icon-label .label {
          color: var(--color-primary3);
          font-size: 1.8rem;
          font-weight: 800; }
      #about #expertise #exp-carousel .icon-group p {
        padding-top: 2rem; }

#about #values {
  background: linear-gradient(var(--color-primary2), var(--color-background));
  padding-top: 2rem;
  height: 450px; }
  #about #values #values-card {
    height: 525px;
    position: relative; }
    #about #values #values-card #val-img {
      position: absolute;
      width: 57%;
      top: 15px;
      right: 15px;
      border-radius: 0 20px 20px 0;
      z-index: 2;
      border-bottom: var(--color-dark) 3px solid;
      border-right: var(--color-dark) 3px solid; }
    #about #values #values-card #img-back {
      position: absolute;
      background-color: var(--color-dark);
      height: 450px;
      width: 50px;
      right: 0;
      border-radius: 20px 20px 20px 20px;
      z-index: 1; }
    #about #values #values-card #values-top {
      background-color: var(--color-dark);
      height: auto;
      border-radius: 20px;
      display: flex;
      flex-direction: column;
      color: var(--color-primary2);
      padding: 1.8rem 0 1.8rem 1.8rem; }
      #about #values #values-card #values-top #val-img-mobile {
        display: none; }
      #about #values #values-card #values-top .label {
        color: white; }
      #about #values #values-card #values-top #values-desc {
        font-size: 1.1rem;
        padding: 0 2rem;
        width: 40%; }
    #about #values #values-card #values-bottom {
      display: flex;
      flex-direction: column;
      margin-top: 1rem;
      padding-left: 2rem; }
      #about #values #values-card #values-bottom .value-item {
        color: var(--color-dark);
        display: flex;
        align-items: center;
        margin-bottom: 1.5rem; }
        #about #values #values-card #values-bottom .value-item i {
          margin-right: 1rem; }

#about #testimonials {
  background-color: var(--color-background);
  padding-top: 15rem; }
  #about #testimonials .heading {
    color: var(--color-primary);
    text-align: center;
    padding: 1.5rem 0 1rem 0; }
  #about #testimonials #test-container {
    padding-bottom: 2rem; }
    #about #testimonials #test-container #test-arrow-button-left,
    #about #testimonials #test-container #test-arrow-button-right {
      display: none; }
    #about #testimonials #test-container #test-carousel {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-evenly;
      margin-top: 5rem;
      width: 100%; }
      #about #testimonials #test-container #test-carousel .test-card {
        background-color: rgba(239, 210, 237, 0.364);
        flex-direction: column;
        width: 40%;
        height: 480px;
        padding-top: 6rem;
        position: relative;
        margin: 2rem 0 8rem;
        border-radius: 20px;
        box-shadow: var(--color-primary2) 15px 15px 0px 0px; }
        #about #testimonials #test-container #test-carousel .test-card .img-circle {
          border-radius: 50%;
          border: var(--color-background) 15px solid;
          height: 150px;
          width: 150px;
          background-color: red;
          position: absolute;
          top: -15%; }
        #about #testimonials #test-container #test-carousel .test-card #brazil {
          background-image: url("../img/stock/brazil_flag.jpg");
          background-repeat: round;
          background-size: contain; }
        #about #testimonials #test-container #test-carousel .test-card #fiji {
          background-image: url("../img/stock/fiji_flag.png");
          background-repeat: round;
          background-size: cover; }
        #about #testimonials #test-container #test-carousel .test-card #USA {
          background-image: url("../img/stock/us_flag.png");
          background-repeat: round;
          background-size: cover; }
        #about #testimonials #test-container #test-carousel .test-card #USA-2 {
          background-image: url("../img/stock/us_flag.png");
          background-repeat: round;
          background-size: cover; }
        #about #testimonials #test-container #test-carousel .test-card .test-text {
          margin-bottom: 2rem;
          font-size: 1rem; }
          #about #testimonials #test-container #test-carousel .test-card .test-text i {
            color: var(--color-dark);
            padding: 0 1rem;
            font-size: 2rem; }
        #about #testimonials #test-container #test-carousel .test-card .test-name {
          color: var(--color-primary);
          font-weight: 700;
          font-size: 1.5rem; }

#about #video {
  background-color: var(--color-background);
  height: 630px;
  position: relative;
  z-index: 0; }
  #about #video #video-background {
    background: linear-gradient(var(--color-background), var(--color-primary2) 45%);
    position: absolute;
    height: 500px;
    width: 100%;
    top: 130px;
    z-index: -1; }
  #about #video #video-card {
    background-color: var(--color-dark);
    height: 520px;
    display: flex;
    justify-content: space-between;
    border-radius: 20px 20px; }
    #about #video #video-card #video-text {
      width: 35%;
      padding-left: 2rem; }
      #about #video #video-card #video-text .label {
        margin-top: 3rem;
        color: white; }
      #about #video #video-card #video-text p {
        color: var(--color-primary2);
        margin-top: 2rem; }
    #about #video #video-card iframe {
      margin-left: 2rem;
      margin-left: 2rem;
      border-radius: 20px; }

#pact-page #backdrop {
  height: 460px;
  width: 100%;
  background: url("../img/stock/a-pinky-promise-gesture-between-african-and-caucasian-women-photo.jpg") rgba(65, 63, 65, 0.522);
  background-size: cover;
  background-position-y: 30%;
  background-blend-mode: multiply;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1; }

#pact-page #pact-intro {
  height: auto;
  background-color: var(--color-background);
  padding-bottom: 3rem; }
  #pact-page #pact-intro #mobile-header {
    display: none; }
  #pact-page #pact-intro #def-card #opener {
    font-size: 4.3rem;
    font-family: 'Allura', cursive;
    color: var(--color-primary);
    font-weight: 400;
    font-style: normal;
    margin: 2rem 0 1.5rem; }
  #pact-page #pact-intro #def-card #p-word {
    font-size: 2rem; }
  #pact-page #pact-intro #def-card div {
    margin: 0.5rem 0; }
  #pact-page #pact-intro #def-card #def {
    margin: 0.5rem 0 3.5rem 5rem;
    font-style: italic;
    font-weight: 700; }
  #pact-page #pact-intro #def-card #blurb {
    margin: 4rem 0 2rem; }
  #pact-page #pact-intro #def-card #together {
    font-size: 1.5rem;
    margin-left: 5rem; }
    #pact-page #pact-intro #def-card #together .highlight {
      font-size: 2rem; }
  #pact-page #pact-intro #def-card #welcome-box {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem; }
    #pact-page #pact-intro #def-card #welcome-box #welcome {
      text-align: center;
      margin: 2rem 0.5rem 2rem 0; }
    #pact-page #pact-intro #def-card #welcome-box #tpp-text {
      font-size: 1.8rem;
      font-weight: 700; }

#pact-page #pact {
  height: auto;
  background: linear-gradient(var(--color-primary2), var(--color-background) 30%);
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-top: 3px solid var(--color-dark); }
  #pact-page #pact #pact-card {
    height: auto; }
    #pact-page #pact #pact-card #pact-top {
      height: 100%;
      border-radius: 20px;
      display: flex;
      flex-direction: column;
      padding: 0.5rem 0 1.8rem 1.8rem;
      margin-bottom: 2rem; }
      #pact-page #pact #pact-card #pact-top #tag-line {
        font-size: 4.3rem;
        font-family: 'Allura', cursive;
        color: white;
        font-weight: 400;
        font-style: normal; }
      #pact-page #pact #pact-card #pact-top #pact-desc {
        font-size: 1.3rem;
        padding: 2rem 0 0 1rem;
        width: 100%;
        color: var(--color-dark); }
    #pact-page #pact #pact-card #pact-bottom {
      display: flex;
      flex-direction: column;
      margin-top: 1rem;
      padding-left: 5rem;
      margin-bottom: 2rem; }
      #pact-page #pact #pact-card #pact-bottom .includes-item {
        color: var(--color-dark);
        display: flex;
        align-items: center;
        margin-bottom: 1.5rem; }
        #pact-page #pact #pact-card #pact-bottom .includes-item i {
          margin-right: 1rem; }
        #pact-page #pact #pact-card #pact-bottom .includes-item p {
          color: var(--color-text); }
    #pact-page #pact #pact-card #pact-acro {
      height: 100%;
      padding: 0 0 0 3rem; }
      #pact-page #pact #pact-card #pact-acro .acro-card {
        height: 120px;
        display: flex;
        align-items: center; }
        #pact-page #pact #pact-card #pact-acro .acro-card .word-card {
          height: 100px;
          width: 100%;
          display: flex;
          align-items: center; }
          #pact-page #pact #pact-card #pact-acro .acro-card .word-card .wc-word {
            min-width: 290px;
            height: 150px;
            font-size: 2.5rem;
            display: flex;
            align-items: center;
            overflow: hidden;
            margin-right: 2rem; }
            #pact-page #pact #pact-card #pact-acro .acro-card .word-card .wc-word .wc-letter {
              font-family: 'Allura', cursive;
              color: var(--color-primary);
              font-size: 5rem;
              font-family: 'Allura', cursive;
              font-weight: 400;
              font-style: normal;
              margin-right: 1.3rem; }
          #pact-page #pact #pact-card #pact-acro .acro-card .word-card .acro-desc {
            font-size: 1.4rem;
            transform: translateY(10%); }
      #pact-page #pact #pact-card #pact-acro #purposeful .wc-letter {
        font-size: 7rem; }
      #pact-page #pact #pact-card #pact-acro #trackable .wc-letter {
        margin-right: 2.5rem; }
    #pact-page #pact #pact-card .requirements {
      display: flex;
      flex-direction: column;
      margin-top: 0.5rem;
      padding-left: 5rem; }
      #pact-page #pact #pact-card .requirements .label {
        color: Black;
        margin-bottom: 1rem;
        font-size: 1.7rem; }
      #pact-page #pact #pact-card .requirements .includes-item {
        color: var(--color-dark);
        display: flex;
        align-items: center;
        margin-bottom: 1rem; }
        #pact-page #pact #pact-card .requirements .includes-item i {
          margin-right: 1rem; }
        #pact-page #pact #pact-card .requirements .includes-item p {
          color: var(--color-text); }
    #pact-page #pact #pact-card #pact-criteria {
      margin-top: 5rem; }
    #pact-page #pact #pact-card #register-card {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin: 3rem 0 5rem 0; }
      #pact-page #pact #pact-card #register-card #ready {
        color: var(--color-primary);
        font-size: 4rem;
        font-family: 'Allura', cursive;
        font-weight: 400;
        font-style: normal;
        margin-right: 0.8rem; }
      #pact-page #pact #pact-card #register-card p {
        margin: 2rem 0; }

#footer {
  background-color: var(--color-background);
  border-top: var(--color-dark) solid 2px;
  display: flex;
  flex-direction: column;
  padding-top: 1rem;
  font-size: 0.9rem; }
  #footer #footer-container {
    padding: 0 2rem;
    margin-top: 0;
    margin-bottom: 0; }
  #footer img {
    width: 15%;
    margin-left: 30px; }
  #footer .footer-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 1rem 0; }
  #footer #links {
    display: flex;
    justify-content: space-between;
    width: 300px; }
    #footer #links li {
      font-size: 1.1rem; }
      #footer #links li:hover {
        cursor: pointer;
        color: var(--color-primary); }
      #footer #links li.current {
        border-bottom: 3px var(--color-primary) solid; }
  #footer #footer-middle #footer-middle-left {
    display: flex;
    flex-direction: column;
    color: var(--gray-3); }
    #footer #footer-middle #footer-middle-left a:hover {
      color: var(--color-primary);
      text-decoration: underline; }
  #footer #footer-middle #footer-middle-right {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 200px; }
    #footer #footer-middle #footer-middle-right i {
      color: var(--color-primary); }
  #footer #footer-bottom {
    border-top: 1px solid #d7d7d7;
    color: var(--gray-3);
    height: 40px;
    width: 100%;
    padding: 1rem; }
    #footer #footer-bottom a {
      color: var(--color-primary); }
      #footer #footer-bottom a:hover {
        text-decoration: underline; }

.container {
  max-width: 1280px;
  margin: auto;
  overflow: hidden; }

.section {
  width: 100%;
  margin: 5rem 0 1rem 0; }

.p-1 {
  padding: 1rem; }

.p-2 {
  padding: 2rem; }

.p-3 {
  padding: 3rem; }

.p-4 {
  padding: 4rem; }

.py-2 {
  padding: 2rem 0; }

.py-3 {
  padding: 3rem 0; }

.py-4 {
  padding: 4rem 0; }

.px-1 {
  padding: 0 1rem; }

.heading {
  font-size: 2.6rem;
  letter-spacing: 4px;
  color: var(--color-dark); }

.center-middle {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center; }

.flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between; }

.label {
  font-size: 2rem;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--color-dark); }

.sub-label {
  font-size: 1.2rem;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--color-primary); }

.btn-light, .btn-dark {
  width: 180px;
  height: 45px;
  padding: 0.4rem 0;
  transition: background-color 0.5s, box-shadow 0.5s;
  border: none;
  border-radius: 10px;
  font-size: 1.2rem;
  text-align: center;
  cursor: pointer; }

.btn-light {
  background-color: #9f0498;
  color: white; }
  .btn-light:hover {
    background-color: #7a229c;
    box-shadow: 0 0 12px 2px rgba(72, 5, 82, 0.691); }

.btn-dark {
  background-color: #5d21a1;
  color: white; }
  .btn-dark:hover {
    background-color: #9f0498;
    box-shadow: 0 0 10px 1px rgba(93, 33, 161, 0.904); }

.bar {
  width: 15%;
  margin: auto;
  border-top: 3px solid var(--color-primary);
  padding-bottom: 2rem; }

.invisible {
  display: none; }

.text-dark {
  color: #333; }

.text-white {
  color: white; }

.heavy {
  font-weight: 800;
  font-size: 1.4rem; }

.highlight {
  color: var(--color-primary);
  font-weight: 700;
  font-style: italic; }

@media screen and (max-width: 1280px) {
  .container {
    max-width: 90%; }
  #home #paralax img {
    margin-top: 0; }
  #home #hero #banner #paralax-cover {
    background: var(--color-background);
    height: 100%;
    width: 20%;
    position: absolute;
    right: 0; }
  #home #hero #banner #banner-container #banner-right {
    justify-content: flex-start;
    padding-top: 2rem; }
    #home #hero #banner #banner-container #banner-right h1 {
      font-size: 3rem;
      height: auto;
      padding-bottom: 1rem; }
    #home #hero #banner #banner-container #banner-right #messages #message-two {
      padding-bottom: 2rem; }
  #home #ecosystems #paralax-cover-2 {
    background: var(--color-background);
    height: 30%;
    width: 20%;
    position: absolute;
    right: 0; }
  #home #ecosystems #eco-container {
    height: auto; }
    #home #ecosystems #eco-container #img-back {
      height: 80%;
      display: none; }
    #home #ecosystems #eco-container #eco-top {
      height: auto;
      padding-bottom: 1rem; }
      #home #ecosystems #eco-container #eco-top .label {
        font-size: 1.7rem;
        width: 30%;
        text-align: center; }
    #home #ecosystems #eco-container #eco-bottom p {
      font-size: 1.2rem;
      margin-bottom: 1rem; }
  #home #mission-vision #mission-vision-container #mv-right #img-group #img-back {
    height: 71%; }
  #about #header {
    height: 380px; }
    #about #header h1 {
      margin-top: -2rem; }
  #about #mission #mission-card .heading {
    text-align: center;
    width: 90%;
    margin: auto; }
  #about #bio #bio-container #name-card {
    display: none; }
  #about #bio #bio-container #bio-grid {
    grid-template-columns: 35% auto;
    grid-template-rows: auto auto auto auto;
    grid-template-areas: 'img p1'
 'p2 p2'
 'expander expander'
 'expander expander'; }
    #about #bio #bio-container #bio-grid #bio-p1 {
      padding: 1rem 0 1rem 3rem; }
      #about #bio #bio-container #bio-grid #bio-p1 #name-card-mobile {
        display: block;
        margin-bottom: 1.5rem; }
    #about #bio #bio-container #bio-grid #bio-p2 {
      padding: 2rem 0 1rem 0; }
  #about #values #values-card {
    height: auto; }
    #about #values #values-card #val-img {
      margin-top: 5%; }
    #about #values #values-card #img-back {
      display: none;
      height: 390px; }
    #about #values #values-card #values-top {
      height: auto;
      padding-bottom: 2rem; }
    #about #values #values-card #values-bottom {
      width: 40%;
      height: auto; }
      #about #values #values-card #values-bottom .value-item {
        font-size: 1.1rem;
        margin-bottom: 0.5rem; }
  #about #testimonials #test-container #test-carousel .test-card {
    height: auto;
    min-height: 550px; } }

@media screen and (max-width: 1000px) {
  #home #hero #banner #banner-container #banner-right #messages {
    font-size: 1.4rem; }
    #home #hero #banner #banner-container #banner-right #messages #message-one {
      padding: 0 0 1rem 2rem; }
  #home #ecosystems #eco-container #eco-top {
    height: 300px;
    display: flex;
    justify-content: center; }
    #home #ecosystems #eco-container #eco-top .label {
      width: 40%;
      font-size: 2rem; }
  #home #ecosystems #eco-container img {
    width: 380px; }
  #home #ecosystems #eco-container #eco-bottom {
    width: 100%; }
    #home #ecosystems #eco-container #eco-bottom p {
      font-size: 1.2rem;
      margin-bottom: 1rem; }
  #home #experts #experts-card img {
    width: 70%; }
  #home #experts #experts-card #experts-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: auto; }
    #home #experts #experts-card #experts-text .label {
      display: none; }
  #about #mission #mission-card .heading {
    text-align: center;
    width: 70%;
    margin: auto; } }

@media screen and (max-width: 600px) {
  body {
    display: flex;
    flex-direction: column;
    align-items: center; }
  .container {
    max-width: 100vw; }
  #home #paralax {
    display: none; }
  #home #hero {
    max-width: 100vw;
    height: auto; }
    #home #hero #header {
      min-height: 140px;
      height: auto;
      padding: 0 1rem;
      margin-bottom: 1rem; }
      #home #hero #header a {
        width: 50%; }
      #home #hero #header .right-header {
        padding-bottom: 1rem;
        position: static;
        right: 1rem; }
        #home #hero #header .right-header #nav-btn {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: space-between;
          padding-top: 0.2rem;
          margin-top: 2px;
          z-index: 99;
          width: 50px;
          height: 30px;
          position: relative;
          overflow: hidden; }
          #home #hero #header .right-header #nav-btn #b1,
          #home #hero #header .right-header #nav-btn #b2,
          #home #hero #header .right-header #nav-btn #b3 {
            position: absolute;
            top: 46%;
            left: 10%; }
          #home #hero #header .right-header #nav-btn .menu-bar {
            width: 40px;
            background: var(--color-text);
            height: 5px;
            border-radius: 10px; }
          #home #hero #header .right-header #nav-btn .top-shift {
            transform: rotate(45deg);
            transform-origin: center;
            transition: 300ms ease-in-out; }
          #home #hero #header .right-header #nav-btn .bottom-shift {
            width: 40px;
            transform: rotate(-45deg);
            transform-origin: center;
            transition: 300ms ease-in-out; }
        #home #hero #header .right-header #navbar {
          display: flex;
          flex-direction: column;
          text-align: left;
          justify-content: flex-start;
          position: fixed;
          inset: 0 0 0 65%;
          background-color: rgba(175, 78, 193, 0.646);
          backdrop-filter: blur(0.5rem);
          padding: 8rem 2rem;
          font-size: 1.2rem;
          width: 300px;
          z-index: 4;
          transition: transform 0.6s ease-out;
          transform: translateX(100%); }
          #home #hero #header .right-header #navbar li {
            color: #f8f8f8;
            border-bottom: 3px transparent solid;
            padding-bottom: 0.5rem;
            transition: border-color 0.5s;
            width: 5em;
            margin-bottom: 1rem; }
            #home #hero #header .right-header #navbar li:hover {
              cursor: pointer;
              border-bottom: 3px var(--color-text) solid; }
            #home #hero #header .right-header #navbar li.current {
              border-bottom: 3px var(--color-primary) solid; }
    #home #hero #tri-color-bar {
      width: 100vw;
      height: 10px; }
      #home #hero #tri-color-bar #three-words {
        visibility: hidden; }
    #home #hero #banner #banner-container {
      padding: 0;
      margin: 0;
      position: relative;
      flex-direction: column; }
      #home #hero #banner #banner-container #mobile-back {
        display: flex;
        justify-content: center;
        z-index: -3;
        position: relative;
        height: 100%;
        width: 100%; }
        #home #hero #banner #banner-container #mobile-back #mobile-overlay {
          background: rgba(225, 225, 225, 0.75);
          z-index: -3;
          position: absolute;
          height: 250px;
          width: 100%; }
        #home #hero #banner #banner-container #mobile-back img {
          height: 250px;
          position: absolute;
          z-index: -5; }
      #home #hero #banner #banner-container #banner-right {
        background: transparent;
        width: 100vw;
        height: auto;
        margin: 0;
        flex-direction: column-reverse;
        justify-content: flex-end;
        align-items: center;
        padding: 0; }
        #home #hero #banner #banner-container #banner-right h1 {
          font-size: 2rem;
          text-align: center;
          height: auto;
          margin: 2rem 0 5rem; }
        #home #hero #banner #banner-container #banner-right #messages {
          padding: 0 1rem;
          height: 250px;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          font-size: 1.2rem; }
          #home #hero #banner #banner-container #banner-right #messages #message-one {
            margin-bottom: 2rem;
            padding-left: 0rem; }
          #home #hero #banner #banner-container #banner-right #messages #message-two {
            text-align: right;
            margin-left: 2rem; }
  #home #ecosystems {
    height: auto;
    margin-bottom: 3rem; }
    #home #ecosystems #eco-back {
      display: none; }
    #home #ecosystems #img-back {
      display: none; }
    #home #ecosystems #eco-container {
      display: flex;
      flex-direction: column;
      align-items: center;
      height: auto; }
      #home #ecosystems #eco-container #eco-top {
        background: linear-gradient(var(--color-dark), #964ec1);
        border-radius: 20px 20px 0 0;
        width: 100%;
        padding: 0.5rem 0;
        height: 50px; }
        #home #ecosystems #eco-container #eco-top .label {
          color: var(--color-primary2);
          font-size: 1.2rem;
          width: 100%;
          text-align: center; }
      #home #ecosystems #eco-container img {
        position: relative;
        border-radius: 0;
        width: 100%;
        border: none;
        top: 0;
        right: 0; }
      #home #ecosystems #eco-container #eco-bottom {
        height: auto;
        display: flex;
        align-items: center;
        flex-direction: column;
        margin-top: 1rem;
        padding-left: 0;
        width: 100%; }
        #home #ecosystems #eco-container #eco-bottom p {
          padding: 1rem 1rem;
          text-align: center;
          margin-bottom: 1rem;
          font-size: 1.1rem;
          letter-spacing: 2px; }
        #home #ecosystems #eco-container #eco-bottom a {
          box-shadow: #4c2651 0 0 7px 2px;
          background-color: var(--color-dark);
          margin: 2rem 0 1rem 0; }
  #home #services {
    background: var(--color-background);
    margin-top: 1rem;
    box-shadow: none;
    height: auto;
    width: 100%; }
    #home #services #services-tag {
      word-spacing: 0.5rem;
      padding-bottom: 1rem;
      width: 100%;
      display: flex;
      justify-content: space-evenly;
      align-items: center;
      height: 40px; }
    #home #services .bar {
      display: none; }
    #home #services #services-container {
      height: auto;
      width: 95%;
      padding: 0;
      margin-bottom: 2rem;
      position: relative; }
      #home #services #services-container #serv-arrow-button-left {
        display: none;
        position: absolute;
        top: 50%;
        left: 3px;
        z-index: 4; }
        #home #services #services-container #serv-arrow-button-left #left-btn {
          background: lightgray;
          border-radius: 50%;
          height: 35px;
          width: 35px;
          display: flex;
          align-items: center;
          justify-content: center;
          box-shadow: rgba(66, 45, 74, 0.571) 0 0 6px 3px; }
          #home #services #services-container #serv-arrow-button-left #left-btn i {
            color: white; }
      #home #services #services-container #serv-arrow-button-right {
        display: block;
        position: absolute;
        top: 50%;
        right: 4px;
        z-index: 4; }
        #home #services #services-container #serv-arrow-button-right #right-btn {
          background: lightgray;
          border-radius: 50%;
          height: 35px;
          width: 35px;
          display: flex;
          align-items: center;
          justify-content: center;
          box-shadow: rgba(30, 11, 37, 0.571) 0 0 6px 3px; }
          #home #services #services-container #serv-arrow-button-right #right-btn i {
            color: white; }
      #home #services #services-container #service-carousel {
        scroll-snap-type: inline mandatory;
        overflow-x: auto;
        width: 100%;
        padding: 0; }
        #home #services #services-container #service-carousel .service-card {
          min-width: 95%;
          height: auto;
          box-shadow: none;
          margin: 0 0.5rem;
          padding: 1rem 3rem; }
          #home #services #services-container #service-carousel .service-card .service-text {
            font-size: 1rem;
            text-align: center; }
      #home #services #services-container #service-carousel > * {
        scroll-snap-align: center; }
      #home #services #services-container #service-carousel::-webkit-scrollbar {
        display: none; }
  #home #map {
    display: none; }
  #home #about-us {
    background: none;
    box-shadow: none;
    margin-top: 3rem;
    height: auto; }
    #home #about-us #about-top {
      background: linear-gradient(var(--color-dark), #964ec1);
      border-radius: 20px 20px 0 0;
      width: 100%;
      padding: 0.5rem 0;
      height: 50px; }
      #home #about-us #about-top .label {
        color: var(--color-primary2);
        font-size: 1.2rem;
        width: 100%;
        text-align: center;
        padding: 0; }
    #home #about-us img {
      width: 100%; }
    #home #about-us #about-text {
      padding: 2rem; }
      #home #about-us #about-text p {
        font-size: 1.2rem;
        color: var(--color-text);
        height: auto; }
  #home #mission-vision {
    padding: 0 2rem;
    height: auto;
    margin-bottom: 2rem; }
    #home #mission-vision #mission-vision-container {
      display: flex;
      flex-direction: column;
      align-items: center;
      height: auto;
      padding: 0 0 2rem 0; }
      #home #mission-vision #mission-vision-container #mv-left {
        display: flex;
        justify-content: space-evenly;
        width: 100%;
        padding: 0; }
        #home #mission-vision #mission-vision-container #mv-left #mv-l-top,
        #home #mission-vision #mission-vision-container #mv-left #mv-l-bottom {
          height: auto;
          margin-bottom: 2rem; }
        #home #mission-vision #mission-vision-container #mv-left .label {
          color: var(--color-primary);
          font-size: 2.2rem;
          margin-bottom: 1rem;
          text-align: center; }
        #home #mission-vision #mission-vision-container #mv-left .text {
          font-size: 1.2rem; }
      #home #mission-vision #mission-vision-container #mv-right {
        width: 90%;
        padding: 0; }
        #home #mission-vision #mission-vision-container #mv-right #img-group {
          height: 340px;
          overflow: hidden;
          position: relative;
          border-radius: 20px;
          border: var(--color-primary) 4px solid; }
          #home #mission-vision #mission-vision-container #mv-right #img-group img {
            margin: 0;
            width: 125%;
            position: absolute;
            top: -5%;
            left: -20%;
            border: 0; }
          #home #mission-vision #mission-vision-container #mv-right #img-group #img-back {
            display: none; }
  #home #quote {
    background: linear-gradient(var(--color-background) 50%, var(--color-primary2));
    color: var(--color-primary);
    letter-spacing: 3.2px;
    padding: 0 2rem 4rem;
    height: auto;
    margin-bottom: 0rem; }
    #home #quote h1 {
      font-size: 1.3rem; }
  #home #experts {
    display: none; }
  #about #backdrop {
    display: none; }
  #about #header {
    min-height: 140px;
    height: auto;
    padding: 0 1rem;
    margin-bottom: 1rem; }
    #about #header h1 {
      display: none; }
    #about #header a {
      width: 50%; }
      #about #header a img {
        content: url("../img/logos/logo/PWS Logo_white water.png"); }
    #about #header .right-header {
      padding-bottom: 1rem;
      position: static;
      right: 1rem; }
      #about #header .right-header #navbar {
        display: flex;
        flex-direction: column;
        text-align: left;
        justify-content: flex-start;
        position: fixed;
        inset: 0 0 0 65%;
        background-color: rgba(175, 78, 193, 0.646);
        backdrop-filter: blur(0.5rem);
        padding: 8rem 2rem;
        font-size: 1.2rem;
        width: 300px;
        z-index: 4;
        transition: transform 0.6s ease-out;
        transform: translateX(100%); }
        #about #header .right-header #navbar li {
          color: #f8f8f8;
          border-bottom: 3px transparent solid;
          padding-bottom: 0.5rem;
          transition: border-color 0.5s;
          width: 5em;
          margin-bottom: 1rem; }
          #about #header .right-header #navbar li:hover {
            cursor: pointer;
            border-bottom: 3px var(--color-text) solid; }
          #about #header .right-header #navbar li.current {
            border-bottom: 3px var(--color-primary) solid; }
      #about #header .right-header #nav-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding-top: 0.2rem;
        margin-top: 2px;
        z-index: 99;
        width: 50px;
        height: 30px;
        position: relative;
        overflow: hidden; }
        #about #header .right-header #nav-btn #b1,
        #about #header .right-header #nav-btn #b2,
        #about #header .right-header #nav-btn #b3 {
          position: absolute;
          top: 46%;
          left: 10%; }
        #about #header .right-header #nav-btn .menu-bar {
          width: 40px;
          background: var(--color-text);
          height: 5px;
          border-radius: 10px; }
        #about #header .right-header #nav-btn .top-shift {
          transform: rotate(45deg);
          transform-origin: center;
          transition: 300ms ease-in-out; }
        #about #header .right-header #nav-btn .bottom-shift {
          width: 40px;
          transform: rotate(-45deg);
          transform-origin: center;
          transition: 300ms ease-in-out; }
  #about #tri-color-bar {
    width: 100vw;
    height: 10px; }
    #about #tri-color-bar #three-words {
      visibility: hidden; }
  #about #mission #mobile-header {
    display: block;
    text-align: center;
    font-size: 2.7rem;
    margin-bottom: 1rem; }
  #about #mission #mission-card {
    padding: 0 2rem; }
    #about #mission #mission-card .heading {
      padding: 1rem 0;
      font-size: 1.3rem;
      text-align: center; }
    #about #mission #mission-card p {
      font-size: 1.1rem; }
  #about #bio #bio-container #name-card {
    display: block;
    text-align: center; }
    #about #bio #bio-container #name-card #name {
      font-size: 1.8rem; }
    #about #bio #bio-container #name-card #title {
      font-size: 1.1rem; }
  #about #bio #bio-container #bio-grid {
    display: block;
    padding: 1rem 2rem;
    font-size: 1.1rem; }
    #about #bio #bio-container #bio-grid #bio-img-card {
      height: auto;
      padding: 0;
      max-width: 350px;
      margin: auto; }
      #about #bio #bio-container #bio-grid #bio-img-card img {
        padding: 0;
        box-shadow: none;
        width: 100%;
        border: solid var(--color-primary) 2px; }
    #about #bio #bio-container #bio-grid #bio-p1 {
      padding-left: 0;
      padding-top: 1.5rem; }
      #about #bio #bio-container #bio-grid #bio-p1 #name-card-mobile {
        display: none; }
    #about #bio #bio-container #bio-grid #bio-p2 {
      display: none;
      padding-left: 0; }
    #about #bio #bio-container #bio-grid #expander {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      height: auto;
      overflow: hidden; }
      #about #bio #bio-container #bio-grid #expander #expander-text {
        height: 40px;
        transition: height 1700ms ease; }
        #about #bio #bio-container #bio-grid #expander #expander-text #bio-p2-mobile {
          display: block;
          opacity: 0.7; }
      #about #bio #bio-container #bio-grid #expander #read-more-bar {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding: 4rem 0 2rem 0;
        background: linear-gradient(#f8f7f973 4%, var(--color-background) 39%);
        z-index: 2; }
        #about #bio #bio-container #bio-grid #expander #read-more-bar #read-more-container {
          width: 70%;
          border-radius: 20px;
          background-color: var(--color-primary2);
          display: flex;
          align-items: center;
          justify-content: center; }
          #about #bio #bio-container #bio-grid #expander #read-more-bar #read-more-container #read-more-btn {
            width: 60%;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: space-between; }
            #about #bio #bio-container #bio-grid #expander #read-more-bar #read-more-container #read-more-btn #caret-up {
              display: none; }
  #about #expertise {
    padding: 0 2rem;
    margin-top: 4rem;
    position: relative; }
    #about #expertise #exp-arrow-button-left {
      display: none;
      position: absolute;
      top: 40%;
      left: 4%;
      z-index: 4; }
      #about #expertise #exp-arrow-button-left #left-btn {
        background: lightgray;
        border-radius: 50%;
        height: 35px;
        width: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: rgba(128, 128, 128, 0.571) 0 0 6px 3px; }
        #about #expertise #exp-arrow-button-left #left-btn i {
          color: white; }
    #about #expertise #exp-arrow-button-right {
      display: block;
      position: absolute;
      top: 40%;
      right: 4%;
      z-index: 4; }
      #about #expertise #exp-arrow-button-right #right-btn {
        background: lightgray;
        border-radius: 50%;
        height: 35px;
        width: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: rgba(128, 128, 128, 0.571) 0 0 6px 3px; }
        #about #expertise #exp-arrow-button-right #right-btn i {
          color: white; }
    #about #expertise #exp-carousel {
      flex-wrap: nowrap;
      justify-content: flex-start;
      scroll-snap-type: inline mandatory;
      overflow-x: auto;
      width: 100%;
      height: auto;
      padding: 0 0 4rem 0;
      margin-top: 0; }
      #about #expertise #exp-carousel .icon-group {
        background: rgba(239, 210, 237, 0.364);
        min-width: 100%;
        height: auto;
        box-shadow: none;
        margin: 0 1rem;
        padding: 1rem 1rem;
        border: solid 3px var(--color-primary2);
        border-radius: 20px;
        justify-content: space-evenly; }
        #about #expertise #exp-carousel .icon-group .icon-label {
          height: auto; }
        #about #expertise #exp-carousel .icon-group .test-text {
          padding-top: 3rem; }
    #about #expertise #exp-carousel > * {
      scroll-snap-align: center; }
    #about #expertise #exp-carousel::-webkit-scrollbar {
      display: none; }
  #about #values {
    background: none;
    height: auto;
    margin-bottom: 0rem; }
    #about #values #val-img {
      display: none; }
    #about #values #eco-back {
      display: none; }
    #about #values #img-back {
      display: none; }
    #about #values #values-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      height: auto; }
      #about #values #values-card #values-top {
        background: none;
        width: 100%;
        height: auto;
        padding: 0; }
        #about #values #values-card #values-top .label {
          background: linear-gradient(var(--color-dark), #964ec1);
          border-radius: 20px 20px 0 0;
          color: var(--color-primary2);
          font-size: 1.2rem;
          width: 100%;
          height: 50px;
          text-align: center;
          padding: 0.5rem 0; }
        #about #values #values-card #values-top #val-img-mobile {
          display: block; }
        #about #values #values-card #values-top #values-desc {
          width: 100%;
          color: var(--color-text);
          height: auto;
          padding-top: 2rem;
          font-size: 1.2rem;
          text-align: justify; }
      #about #values #values-card #values-bottom {
        width: 100%; }
        #about #values #values-card #values-bottom p {
          font-size: 1.1rem;
          color: var(--color-text); }
  #about #testimonials {
    padding: 3rem 0;
    position: relative; }
    #about #testimonials .heading {
      font-size: 1.7rem;
      padding: 0 1rem; }
    #about #testimonials .bar {
      display: none; }
    #about #testimonials #test-container {
      height: auto;
      padding: 1rem 0.5rem 0; }
      #about #testimonials #test-container #test-arrow-button-left {
        display: none;
        position: absolute;
        top: 50%;
        z-index: 4; }
        #about #testimonials #test-container #test-arrow-button-left #left-btn {
          background: lightgray;
          border-radius: 50%;
          height: 35px;
          width: 35px;
          display: flex;
          align-items: center;
          justify-content: center;
          box-shadow: rgba(128, 128, 128, 0.571) 0 0 6px 3px; }
          #about #testimonials #test-container #test-arrow-button-left #left-btn i {
            color: white; }
      #about #testimonials #test-container #test-arrow-button-right {
        display: block;
        position: absolute;
        top: 50%;
        right: 4px;
        z-index: 4; }
        #about #testimonials #test-container #test-arrow-button-right #right-btn {
          background: lightgray;
          border-radius: 50%;
          height: 35px;
          width: 35px;
          display: flex;
          align-items: center;
          justify-content: center;
          box-shadow: rgba(128, 128, 128, 0.571) 0 0 6px 3px; }
          #about #testimonials #test-container #test-arrow-button-right #right-btn i {
            color: white; }
      #about #testimonials #test-container #test-carousel {
        flex-wrap: nowrap;
        justify-content: flex-start;
        scroll-snap-type: inline mandatory;
        overflow-x: auto;
        width: 100%;
        height: auto;
        padding: 6rem 1rem;
        margin-top: 0; }
        #about #testimonials #test-container #test-carousel .test-card {
          min-width: 100%;
          height: auto;
          box-shadow: none;
          margin: 0 1rem;
          padding: 1rem 1.5rem;
          border: solid 3px var(--color-primary2); }
          #about #testimonials #test-container #test-carousel .test-card .test-text {
            padding-top: 3rem; }
      #about #testimonials #test-container #test-carousel > * {
        scroll-snap-align: center; }
      #about #testimonials #test-container #test-carousel::-webkit-scrollbar {
        display: none; }
  #about #video {
    height: auto;
    background: linear-gradient(var(--color-background) 70%, var(--color-primary2)); }
    #about #video #video-background {
      display: none; }
    #about #video #video-card {
      background: none;
      width: 100%;
      height: auto;
      flex-direction: column;
      align-items: center;
      padding: 0; }
      #about #video #video-card #video-text {
        width: 100%;
        padding: 0; }
        #about #video #video-card #video-text .label {
          background: linear-gradient(var(--color-dark), #964ec1);
          border-radius: 20px 20px 0 0;
          color: var(--color-primary2);
          font-size: 1.2rem;
          width: 100%;
          height: auto;
          text-align: center;
          padding: 0.5rem 0;
          margin: 0; }
        #about #video #video-card #video-text p {
          padding: 2rem;
          color: var(--color-text);
          font-size: 1.1rem;
          margin: 0;
          text-align: center; }
      #about #video #video-card iframe {
        height: 300px;
        width: 90%;
        margin: 0 1rem 4rem; }
  #pact-page #backdrop {
    display: none; }
  #pact-page #header {
    min-height: 140px;
    height: auto;
    padding: 0 1rem;
    margin-bottom: 1rem; }
    #pact-page #header h1 {
      display: none; }
    #pact-page #header a {
      width: 50%; }
      #pact-page #header a img {
        content: url("../img/logos/logo/PWS Logo_white water.png"); }
    #pact-page #header .right-header {
      padding-bottom: 1rem;
      position: static;
      right: 1rem; }
      #pact-page #header .right-header #navbar {
        display: flex;
        flex-direction: column;
        text-align: left;
        justify-content: flex-start;
        position: fixed;
        inset: 0 0 0 65%;
        background-color: rgba(175, 78, 193, 0.646);
        backdrop-filter: blur(0.5rem);
        padding: 8rem 2rem;
        font-size: 1.2rem;
        width: 300px;
        z-index: 4;
        transition: transform 0.6s ease-out;
        transform: translateX(100%); }
        #pact-page #header .right-header #navbar li {
          color: #f8f8f8;
          border-bottom: 3px transparent solid;
          padding-bottom: 0.5rem;
          transition: border-color 0.5s;
          width: 5em;
          margin-bottom: 1rem; }
          #pact-page #header .right-header #navbar li:hover {
            cursor: pointer;
            border-bottom: 3px var(--color-text) solid; }
          #pact-page #header .right-header #navbar li.current {
            border-bottom: 3px var(--color-primary) solid; }
      #pact-page #header .right-header #nav-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding-top: 0.2rem;
        margin-top: 2px;
        z-index: 99;
        width: 50px;
        height: 30px;
        position: relative;
        overflow: hidden; }
        #pact-page #header .right-header #nav-btn #b1,
        #pact-page #header .right-header #nav-btn #b2,
        #pact-page #header .right-header #nav-btn #b3 {
          position: absolute;
          top: 46%;
          left: 10%; }
        #pact-page #header .right-header #nav-btn .menu-bar {
          width: 40px;
          background: var(--color-text);
          height: 5px;
          border-radius: 10px; }
        #pact-page #header .right-header #nav-btn .top-shift {
          transform: rotate(45deg);
          transform-origin: center;
          transition: 300ms ease-in-out; }
        #pact-page #header .right-header #nav-btn .bottom-shift {
          width: 40px;
          transform: rotate(-45deg);
          transform-origin: center;
          transition: 300ms ease-in-out; }
  #pact-page #tri-color-bar {
    width: 100vw;
    height: 10px; }
    #pact-page #tri-color-bar #three-words {
      visibility: hidden; }
  #pact-page #pact-intro #mobile-header {
    display: block;
    text-align: center;
    font-size: 2.7rem;
    margin: 2rem 0 0rem; }
  #pact-page #pact-intro #def-card {
    padding: 0 2rem 2rem 2rem; }
    #pact-page #pact-intro #def-card #opener {
      padding: 1rem 2rem;
      font-size: 2.9rem;
      margin: 0;
      padding: 0; }
    #pact-page #pact-intro #def-card #def {
      margin-left: 2rem; }
    #pact-page #pact-intro #def-card #together {
      margin: 3rem 0 0 0; }
    #pact-page #pact-intro #def-card #welcome-box {
      flex-direction: column;
      align-items: start;
      margin: 0 2rem; }
      #pact-page #pact-intro #def-card #welcome-box #welcome {
        height: 10px; }
      #pact-page #pact-intro #def-card #welcome-box #tpp-text {
        margin-left: 2rem; }
  #pact-page #pact #pact-card {
    padding: 0 1.5rem; }
    #pact-page #pact #pact-card #pact-top {
      padding: 0; }
      #pact-page #pact #pact-card #pact-top #tag-line {
        font-size: 3.2rem;
        padding-left: 1rem; }
      #pact-page #pact #pact-card #pact-top #pact-desc {
        padding: 2rem 1rem 1rem 1rem; }
    #pact-page #pact #pact-card #pact-bottom {
      padding-left: 1rem; }
    #pact-page #pact #pact-card #pact-acro {
      padding: 0; }
      #pact-page #pact #pact-card #pact-acro .acro-card {
        flex-direction: column;
        height: auto;
        margin-bottom: 2.5rem; }
        #pact-page #pact #pact-card #pact-acro .acro-card .word-card {
          flex-direction: column;
          height: 215px; }
          #pact-page #pact #pact-card #pact-acro .acro-card .word-card .acro-desc {
            margin: 0 0 0 2.5rem; }
    #pact-page #pact #pact-card .requirements {
      padding: 0 1rem 0 1rem; }
    #pact-page #pact #pact-card #register-card {
      padding: 0 1rem;
      margin-bottom: 2rem; }
      #pact-page #pact #pact-card #register-card #ready {
        font-size: 3.1rem; }
      #pact-page #pact #pact-card #register-card a {
        margin-top: 2rem; }
  #footer {
    padding: 0; }
    #footer #footer-top {
      flex-direction: column-reverse;
      margin: 0 0 1rem 0; }
      #footer #footer-top img {
        width: 50%;
        margin: 0; }
      #footer #footer-top ul {
        margin: 1rem 0 2rem; }
    #footer #footer-middle {
      flex-direction: column;
      margin: 1rem 0 0 0;
      text-align: center; }
      #footer #footer-middle #footer-middle-left {
        margin: 0 0 1rem 0; }
    #footer #footer-bottom {
      height: auto;
      margin: 1rem 0 0 0; }
      #footer #footer-bottom p {
        text-align: center;
        margin: 0 2rem; } }