@font-face {
  font-family: Satoshi;
  src: url('../fonts/Satoshi-Light.eot') format("embedded-opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Satoshi;
  src: url('../fonts/Satoshi-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Satoshi;
  src: url('../fonts/Satoshi-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Satoshi;
  src: url('../fonts/Satoshi-Regular.ttf') format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root {
  --card-1: #fdf29c;
  --card-3: #f0aa93;
  --card: #27c2a1;
  --card-5: #b491f5;
  --dark: #080808;
  --card-4: #e2fc9c;
}

h1 {
  color: #00162e;
  letter-spacing: -2px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 100px;
  font-weight: 500;
  line-height: 110px;
}

h2 {
  color: #000;
  letter-spacing: -2px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 50px;
  font-weight: 500;
  line-height: 62px;
}

h3 {
  color: #00162e;
  margin-top: 0;
  margin-bottom: 0;
  font-family: DM Sans;
  font-size: 36px;
  font-weight: 500;
  line-height: 40px;
}

.portfolio-slide {
  width: 100%;
}

.link-wrapper {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: auto;
  height: 1.9rem;
  display: flex;
  overflow: hidden;
}

.styleguide-section {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.style-guide-container {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 50px;
  display: flex;
}

.body {
  color: #000;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.heading {
  color: #000;
}

.navbar-and-hero-wrapper {
  width: 90rem;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 156px;
  padding-right: 156px;
  position: relative;
}

.navbar {
  background-color: #ddd0;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.navbar-container {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 24px;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.brand {
  width: 7.5rem;
  height: 2.08813rem;
}

.navlink {
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.navlinkwrapper {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.logo-navbar {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.hero {
  z-index: 4;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.hero-container {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 189px;
  padding-bottom: 160px;
  padding-left: 0;
  display: flex;
}

.hero-heading-par-and-button-wrapper {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 47.8125rem;
  display: flex;
}

.hero-par {
  color: #00000080;
  margin-bottom: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.hero-par._2 {
  color: #000;
  max-width: 41ch;
  font-weight: 400;
}

.hero-button {
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 10.5rem;
  height: 3.5rem;
  margin-top: 24px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.hero-button-text {
  color: #000;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
  position: relative;
}

.cirlces-loop-wrapper {
  filter: blur(80px);
  background-color: #0000;
  background-image: linear-gradient(#27c2a1, #fdf29c 15%, #f0aa93 33%, #9ed9fa 58%, #e2fc9c 78%, #b491f5);
  border-radius: 20%;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-end;
  width: 40.3125rem;
  height: 54.375rem;
  margin-top: 29px;
  padding-top: 0;
  padding-right: 0;
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
  overflow: visible;
}

.circle {
  z-index: 1;
  filter: blur(120px);
  background-color: #9ed9fa;
  border-radius: 100%;
  flex: none;
  width: 12rem;
  height: 12rem;
  position: relative;
  top: -11px;
  left: -103px;
}

.circle-1 {
  z-index: 2;
  background-color: var(--card-1);
  filter: blur(120px);
  border-radius: 100%;
  flex: none;
  width: 15rem;
  height: 15rem;
  position: relative;
  top: -139px;
  left: -148px;
}

.circle-2 {
  z-index: 1;
  background-color: var(--card-3);
  filter: blur(120px);
  border-radius: 100%;
  flex: none;
  width: 22rem;
  height: 22rem;
  position: relative;
  top: -291px;
  left: -181px;
}

.circle-3 {
  z-index: 2;
  background-color: var(--card);
  filter: blur(120px);
  border-radius: 100%;
  flex: none;
  width: 25rem;
  height: 25rem;
  position: relative;
  top: -477px;
  left: -187px;
}

.circle-4 {
  filter: blur(120px);
  background-color: #e2fc9c;
  border-radius: 100%;
  flex: none;
  width: 15rem;
  height: 15rem;
  position: relative;
  top: -650px;
  right: 398px;
}

.circle-5 {
  background-color: var(--card-5);
  filter: blur(120px);
  border-radius: 100%;
  flex: none;
  width: 12rem;
  height: 12rem;
  position: relative;
  top: -757px;
  left: -489px;
}

.image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.mask-hero-button {
  background-image: linear-gradient(70deg, #27c2a1, #fdf29c 18%, #f0aa93 35%, #9ed9fa 59%, #e2fc9c 77%, #b491f5);
  border-radius: 50px;
  width: 10.7rem;
  height: 3.8rem;
  position: absolute;
}

.heading-images-par-wrapper-hero {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 176px;
}

.hero-heading-wrapper-2 {
  width: 28.5rem;
}

.hero-images-par-grid {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  margin-top: 60px;
  display: block;
}

.image-2 {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.paragraph {
  color: #00000080;
  margin-top: 40px;
  margin-bottom: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.image-3 {
  margin-top: 292px;
}

.images-and-par-wrapper {
  grid-column-gap: 123px;
  grid-row-gap: 123px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 60px;
  display: flex;
}

._1st-image-wrapper {
  width: 22.5rem;
  height: 28.125rem;
}

.image-4 {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

._2nd-image-and-par-wrapper {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 660px;
  padding-top: 40px;
  display: flex;
}

._2nd-image-wrapper {
  width: 16.5rem;
  height: 18.75rem;
  margin-left: 381px;
}

.image-5 {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.main-section {
  background-color: #fff;
  width: 90rem;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
}

.main-section-container {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  background-color: #090909;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 160px 156px;
  display: flex;
}

.main-section-heading {
  color: #fff;
}

.card-wrapper {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.card {
  grid-column-gap: 127px;
  grid-row-gap: 127px;
  cursor: pointer;
  border: 1px solid #fff3;
  border-radius: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 22.5rem;
  height: 31.8125rem;
  padding: 55px 32px 0;
  display: flex;
}

.image-6 {
  object-fit: cover;
  width: 10.9375rem;
  height: 8.4375rem;
}

.card-heading-par-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.card-heading {
  color: #fff;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.card-par {
  color: #ffffff80;
  margin-bottom: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.card-wrapper-2 {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.code-embed-wrapper {
  background-color: var(--card);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  justify-content: center;
  align-items: center;
  width: 10.9375rem;
  height: 8.4375rem;
  display: flex;
  position: static;
}

.shape {
  border-top-style: none;
  border-top-width: 1px;
  border-top-color: var(--card);
  border-right-style: none;
  border-right-width: 1px;
  border-right-color: var(--card);
  border-bottom-style: none;
  border-bottom-width: 1px;
  border-bottom-color: var(--card);
  border-left-style: none;
  border-left-width: 1px;
  border-left-color: var(--card);
  color: var(--card);
  fill: #0000004d;
  position: relative;
  left: 23px;
}

.shape:hover {
  fill: #0000004d;
}

.shape1 {
  color: var(--card);
  -webkit-text-fill-color: inherit;
  mix-blend-mode: normal;
  background-color: #0000;
  background-clip: border-box;
  border: 1px #e7d8d8;
  position: relative;
  top: 6px;
  right: 38px;
}

.shape3 {
  color: var(--card-1);
  position: relative;
  left: 43px;
}

.shape4 {
  border: 2px none var(--card-1);
  color: var(--card-1);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  position: relative;
  top: 15px;
}

.card-1, .card-2 {
  grid-column-gap: 127px;
  grid-row-gap: 127px;
  cursor: pointer;
  border: 1px solid #fff3;
  border-radius: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 22.5rem;
  height: 31.8125rem;
  padding-top: 55px;
  padding-left: 32px;
  padding-right: 32px;
  display: flex;
}

.card-3, .card-4 {
  grid-column-gap: 127px;
  grid-row-gap: 127px;
  cursor: pointer;
  mix-blend-mode: normal;
  border: 1px solid #fff3;
  border-radius: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 22.5rem;
  height: 31.8125rem;
  padding-top: 55px;
  padding-left: 32px;
  padding-right: 32px;
  display: flex;
}

.card-5 {
  grid-column-gap: 127px;
  grid-row-gap: 127px;
  border: 1px solid #fff3;
  border-radius: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 22.5rem;
  height: 31.8125rem;
  padding-top: 55px;
  padding-left: 32px;
  padding-right: 32px;
  display: flex;
}

.shape5 {
  color: var(--card-3);
  position: relative;
  left: -13px;
}

.shape6 {
  color: var(--card-3);
  position: relative;
  top: -15px;
  left: 18px;
}

.shape7 {
  color: #9ed9fa;
  position: relative;
  top: -5px;
  left: -14px;
}

.shape8 {
  color: #9ed9fa;
  position: relative;
  top: -15px;
  left: 20px;
}

.shape9 {
  color: #e2fc9c;
  position: relative;
  right: 35px;
}

.shape10 {
  color: #e2fc9c;
  position: relative;
  left: 25px;
}

.shape11 {
  color: #b491f5;
  position: relative;
  right: 20px;
}

.shape12 {
  color: #b491f5;
  position: relative;
  left: 21px;
}

._2nd-main-section-container {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 160px;
  padding-left: 175px;
  padding-right: 232px;
  display: flex;
}

.numbers-wrapper {
  grid-column-gap: 114px;
  grid-row-gap: 114px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

._1st-wrapper {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 14.125rem;
  height: 8.875rem;
  display: flex;
}

.number-plus-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.text {
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.number, .plus {
  color: #000;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 100px;
  font-weight: 300;
  line-height: 110px;
}

._2nd-wrapper {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 7.75rem;
  height: 8.875rem;
  display: flex;
}

._3rd-wrapper {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 15rem;
  height: 8.875rem;
  display: flex;
}

.number-wrapper {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.number-hours {
  color: #000;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 100px;
  line-height: 110px;
}

.logo-loop-container {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding-top: 164px;
  padding-bottom: 174px;
  display: flex;
}

.logo-loop-heading-wrapper {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 40.5rem;
  display: flex;
}

.logo-loop-heading {
  text-align: center;
}

.logo-loop-wrapper {
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  flex: none;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  align-items: center;
  min-width: 100%;
  display: flex;
}

._2 {
  opacity: .4;
}

.marquee {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  flex: none;
  justify-content: flex-start;
  align-items: center;
  max-width: 58.3125rem;
  display: flex;
  overflow: hidden;
}

.form-block-container {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding-top: 160px;
  display: flex;
  position: relative;
}

.form-block-heading-wrapper {
  z-index: 5;
  width: 40.1875rem;
  position: relative;
}

.form-block-heading {
  text-align: center;
}

.form-block {
  z-index: 5;
  width: 34.5rem;
  position: relative;
}

.form {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.name-and-email-wrapper {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.text-field {
  color: #000;
  -webkit-text-fill-color: transparent;
  background-color: #000;
  -webkit-background-clip: text;
  background-clip: text;
  border: 1px #000;
  border-bottom-style: solid;
  flex: none;
  width: 16.5rem;
  padding-left: 0;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.text-field.subject {
  width: 34.5rem;
}

.text-field.message {
  width: 34.5rem;
  padding-bottom: 80px;
}

.body-2 {
  color: #000;
  font-family: Satoshi, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.submit-button {
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  width: 10.5rem;
  height: 3.5rem;
  display: flex;
}

.submit-button:hover {
  border-width: 2px;
}

.looping-background-form {
  filter: blur(80px);
  background-image: linear-gradient(60deg, #27c2a1, #fdf29c 17%, #f0aa93 34%, #9ed9fa 55%, #e2fc9c 76%, #b491f5);
  width: 100%;
  height: 15rem;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  inset: auto 0% 0%;
}

.fotter-section {
  width: 100%;
}

.fotter-container {
  grid-column-gap: 127px;
  grid-row-gap: 127px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 90rem;
  margin-left: auto;
  margin-right: auto;
  padding-top: 78px;
  padding-left: 156px;
  padding-right: 156px;
  display: flex;
}

.logo-and-links-wrapper {
  grid-column-gap: 108px;
  grid-row-gap: 108px;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.fotter-logo-wrapper {
  width: 4rem;
  height: 4rem;
}

.fotter-logo-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.links-wrapper-fotter {
  grid-column-gap: 118px;
  grid-row-gap: 118px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

._1st-links-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.heading-fotter-link {
  margin-bottom: 8px;
  font-size: 20px;
  font-weight: 500;
  line-height: 28px;
}

.fotter-link {
  color: #000c;
  text-decoration: none;
}

._2nd-links-wrapper, ._3rd-links-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.social-media-wrapper {
  grid-column-gap: 26.72px;
  grid-row-gap: 26.72px;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 184px;
  display: flex;
}

.fotter-end-text {
  color: #0a142f;
}

@media screen and (max-width: 991px) {
  .navbar-and-hero-wrapper {
    width: 100%;
    padding-left: 48px;
    padding-right: 48px;
  }

  .navlinkwrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
  }

  .navmenu {
    background-color: #fff;
  }

  .menu-button {
    color: var(--dark);
    background-color: #fffce6;
    border-radius: 20px;
  }
}

@media screen and (max-width: 479px) {
  .navbar-and-hero-wrapper {
    padding-left: 24px;
    padding-right: 24px;
  }

  .navbar {
    display: none;
  }

  .hero-container {
    padding-top: 132px;
    padding-bottom: 90px;
  }

  .hero-heading-par-and-button-wrapper {
    width: 100%;
  }

  .hero-heading {
    font-size: 48px;
    line-height: 52px;
  }

  .hero-button {
    width: 100%;
  }

  .cirlces-loop-wrapper {
    width: 100%;
    height: 32.6875rem;
    margin-top: 72px;
  }

  .mask-hero-button {
    display: none;
  }

  .heading-images-par-wrapper-hero {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-end;
    padding-top: 100px;
    display: flex;
  }

  .hero-heading-wrapper-2 {
    width: 100%;
  }

  .hero-heading-2 {
    font-size: 32px;
    line-height: 36px;
  }

  .images-and-par-wrapper {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 0;
  }

  ._1st-image-wrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 28rem;
    display: flex;
  }

  ._2nd-image-and-par-wrapper {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
    padding-top: 0;
  }

  ._2nd-image-wrapper {
    width: 80%;
    margin-left: 0;
  }

  .main-section {
    width: 100%;
  }

  .main-section-container {
    justify-content: flex-start;
    align-items: flex-start;
    padding: 100px 24px;
  }

  .main-section-heading {
    font-size: 32px;
    line-height: 36px;
  }

  .card-wrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .card {
    grid-column-gap: 31px;
    grid-row-gap: 31px;
    width: 22.375rem;
    height: 23.5rem;
    padding-left: 31px;
    padding-right: 31px;
  }

  .card-wrapper-2 {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .card-1, .card-2, .card-3, .card-4, .card-5 {
    grid-column-gap: 31px;
    grid-row-gap: 31px;
    width: 22.35rem;
    height: 22.5rem;
    padding-left: 31px;
    padding-right: 31px;
  }

  ._2nd-main-section-container {
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 100px;
    padding-left: 24px;
    padding-right: 24px;
  }

  .numbers-wrapper {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
    flex-flow: column;
  }

  ._1st-wrapper {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .number, .plus {
    font-size: 80px;
    line-height: 80px;
  }

  ._2nd-wrapper, ._3rd-wrapper {
    justify-content: flex-start;
    align-items: flex-start;
  }

  ._4th-wrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex;
  }

  .number-wrapper {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .number-hours {
    font-size: 80px;
    line-height: 80px;
  }

  .logo-loop-container {
    grid-column-gap: 36px;
    grid-row-gap: 36px;
    justify-content: flex-start;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 0;
  }

  .logo-loop-heading-wrapper {
    width: 18.9375rem;
  }

  .logo-loop-heading {
    font-size: 32px;
    line-height: 36px;
  }

  .marquee {
    flex-flow: row;
  }

  .form-block-container {
    justify-content: flex-start;
    align-items: center;
    padding-top: 103px;
  }

  .form-block-heading-wrapper, .form-block {
    width: 100%;
  }

  .name-and-email-wrapper {
    flex-flow: column;
    width: 100%;
  }

  .text-field, .text-field.subject, .text-field.message {
    width: 100%;
  }

  .subject-wrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    display: flex;
  }

  .message-wrapper, .submit-button {
    width: 100%;
  }

  .looping-background-form {
    height: 13.9144rem;
  }

  .fotter-container {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    width: 100%;
    padding-top: 51.09px;
    padding-left: 24px;
    padding-right: 24px;
  }

  .logo-and-links-wrapper {
    grid-column-gap: 46.09px;
    grid-row-gap: 46.09px;
    flex-flow: column;
  }

  .links-wrapper-fotter {
    grid-column-gap: 44px;
    grid-row-gap: 44px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
  }

  ._1st-links-wrapper, ._2nd-links-wrapper, ._3rd-links-wrapper {
    justify-content: flex-start;
    align-items: center;
    width: 60%;
  }

  .social-media-wrapper {
    margin-top: 0;
  }

  .fotter-end-wrapper {
    flex-flow: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 79px;
    display: flex;
  }
}

#w-node-_56b2cd9b-ac36-ffa0-5b9f-bcc32f9f9452-7f85d30f {
  grid-area: 1 / 1 / 2 / 2;
  place-self: center;
}

#w-node-_8f157454-507d-14f4-8d97-c1d86be68c9e-7f85d30f {
  grid-area: 1 / 3 / 2 / 5;
  place-self: center;
}

#w-node-edef81ef-ad3c-127e-9ff2-35357f0ddc7e-7f85d30f {
  grid-area: 1 / 6 / 2 / 9;
  place-self: center;
}

#w-node-ef4a8ec6-d95b-dee4-c451-3d39244fed21-7f85d30f {
  grid-area: 1 / 10 / 2 / 11;
  place-self: center;
}

#w-node-e27c1239-665a-d186-288a-98557d80dba2-7f85d30f {
  grid-area: 1 / 1 / 2 / 2;
  place-self: center;
}

#w-node-e27c1239-665a-d186-288a-98557d80dba3-7f85d30f {
  grid-area: 1 / 3 / 2 / 5;
  place-self: center;
}

#w-node-e27c1239-665a-d186-288a-98557d80dba4-7f85d30f {
  grid-area: 1 / 6 / 2 / 9;
  place-self: center;
}

#w-node-e27c1239-665a-d186-288a-98557d80dba5-7f85d30f {
  grid-area: 1 / 10 / 2 / 11;
  place-self: center;
}


@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Light.eot') format('embedded-opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Regular.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}