@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Extralight.otf') format("opentype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Light.otf') format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Extrabold.otf') format("opentype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Black.otf') format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Regular.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Thin.otf') format("opentype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cabinetgrotesk;
  src: url('../fonts/CabinetGrotesk-Medium.otf') format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-Bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-BoldItalic.otf') format("opentype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-Light.otf') format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-Italic.otf') format("opentype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-Medium.otf') format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-Regular.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-LightItalic.otf') format("opentype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Neuemontreal;
  src: url('../fonts/NeueMontreal-MediumItalic.otf') format("opentype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

:root {
  --gainsboro: #e7e6e4;
  --black: #272727;
  --dim-grey: #76726f;
  --white: white;
  --primary: #44faa5;
}

body {
  background-color: var(--gainsboro);
  color: var(--black);
  letter-spacing: 0;
  font-family: Neuemontreal, sans-serif;
  font-size: 14px;
  line-height: 1.2;
}

h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 5.5em;
  font-weight: 700;
  line-height: 1.2;
}

h2 {
  text-align: left;
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 4em;
  font-weight: 500;
  line-height: 1.2;
}

h3 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
}

a {
  color: var(--black);
  text-decoration: underline;
}

label {
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 400;
  display: block;
}

.services-header-section {
  height: 200vh;
}

.sticky-header {
  justify-content: center;
  align-items: center;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
}

.full-screen-text {
  font-size: 21vw;
  font-weight: 800;
  line-height: 120%;
}

.mockup-section {
  height: 300vh;
}

.mockup-sticky {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding-right: 10px;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.content-div {
  flex: 1;
  width: 40%;
  padding-left: 20px;
  padding-right: 20px;
}

.mockup-div {
  border: 20px solid #3c3333;
  border-radius: 9px;
  flex: 0 auto;
  width: 750px;
  height: 530px;
  position: relative;
}

.paragraph {
  text-align: justify;
}

.website-screen {
  width: 100%;
  height: 100%;
  position: absolute;
}

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

.section {
  height: 200vh;
}

.hero {
  height: 3000px;
  position: relative;
}

.hero-lottie {
  object-fit: cover;
  width: 100%;
  height: 100vh;
  position: sticky;
  inset: 0% 0% auto;
}

.hero-lottie-div {
  width: 100%;
  height: 100%;
  position: relative;
}

.hero-new {
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: 800px;
  flex-direction: column;
  height: 100vh;
  min-height: 780px;
  display: flex;
  position: relative;
}

.nav-hero {
  padding: 20px 25px;
}

.hero-content-div {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: flex-start;
  padding: 60px 4em;
  display: flex;
}

.hero-title {
  color: var(--dim-grey);
  font-weight: 500;
}

.hero-title.dark-text {
  color: var(--black);
  margin-bottom: 0;
}

.hero-title-div {
  z-index: 30;
  position: relative;
}

.hero-subtitle {
  text-align: left;
  align-self: flex-start;
  padding-bottom: 24px;
  font-size: 1.1em;
  font-weight: 500;
}

.hero-subtitle.white {
  color: var(--white);
  text-transform: uppercase;
}

.corner-button {
  white-space: normal;
  cursor: pointer;
  background-color: #44faa5;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 350px;
  padding: 14px 20px;
  font-weight: 500;
  text-decoration: none;
  transition: all .3s cubic-bezier(.55, .055, .675, .19);
  display: flex;
}

.corner-button:hover {
  background-color: var(--black);
  color: var(--white);
}

.corner-button.trans {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  color: var(--black);
  background-color: #dedede;
  justify-content: center;
  font-weight: 500;
}

.corner-button.trans:hover {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  background-color: var(--black);
  color: #fff;
}

.text-block {
  padding: 10px;
}

.corner-absoulte {
  width: 100%;
  display: flex;
  position: absolute;
  inset: auto auto 0% 0%;
}

.hero-logo {
  width: 150px;
}

.about-us-section {
  background-color: var(--gainsboro);
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: contain;
  justify-content: center;
  min-height: 100vh;
  padding: 60px 4rem;
  display: flex;
}

.about-us-content {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  text-align: left;
  flex-direction: column;
  flex: 0 auto;
  align-self: center;
  align-items: flex-start;
  padding-left: 0;
  padding-right: 20px;
  display: flex;
}

.about-us-content._100 {
  width: 100%;
}

.heading {
  font-size: 4em;
}

.about-us-paragraph {
  text-align: left;
  flex: 0 auto;
  order: 1;
  align-self: center;
  max-width: 600px;
  margin-top: 60px;
  padding-bottom: 40px;
  font-size: 1.3em;
  line-height: 1.3;
  display: flex;
}

.services {
  background-color: var(--white);
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: 800px;
  justify-content: center;
  align-items: center;
  height: 100vh;
  min-height: 700px;
  padding-left: 5rem;
  padding-right: 4rem;
  display: flex;
}

.services.dark {
  background-color: var(--black);
}

.services.dark.line-back {
  background-image: url('../images/Lines.svg'), url('../images/final-line.svg');
  background-position: 50% 0, 50%;
  background-repeat: no-repeat, repeat;
  background-size: contain, contain;
}

.slider {
  width: 81%;
  min-height: 560px;
}

.slide-noise {
  background-image: url('../images/noise-background-012x.jpg.svg');
  background-position: 50%;
  background-size: cover;
}

.right-arrow {
  background-color: var(--gainsboro);
  cursor: pointer;
  background-image: url('../images/svg-gobbler-19-1.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: 180px 90px;
  width: 200px;
  height: 200px;
  transition: all .3s;
  inset: 200px 0% auto auto;
}

.right-arrow:hover {
  background-position: 190px;
}

.left-arrow {
  background-color: var(--white);
  cursor: pointer;
  background-image: url('../images/svg-gobbler-19.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: 180px 90px;
  width: 200px;
  height: 200px;
  transition: all .3s;
  inset: 0 0% auto auto;
}

.left-arrow:hover {
  background-position: -168px;
}

.slider-full-div {
  flex-direction: column;
  justify-content: space-around;
  height: 100%;
  padding-left: 40px;
  padding-right: 220px;
  display: flex;
  position: relative;
}

.button-button-slider-div {
  justify-content: flex-end;
  width: 100%;
  display: flex;
  position: absolute;
  inset: auto 0% 0% auto;
}

.slider-header {
  font-size: 6em;
  font-weight: 500;
}

.slider-paragraph {
  font-size: 1.8em;
  font-weight: 400;
}

.slide-nav {
  overflow: visible;
}

.slider-nav {
  display: none;
}

.grid-section {
  justify-content: center;
  align-items: flex-start;
  height: 200vh;
  min-height: 1400px;
  display: flex;
  position: relative;
}

.grid-frame {
  width: 100%;
  min-height: 100vh;
  display: flex;
  position: sticky;
  inset: 0% 0% auto;
  overflow: hidden;
}

.grey-section {
  background-color: var(--gainsboro);
  width: 100%;
}

.grid-div-cover {
  z-index: 8;
  background-color: #272727;
  border: 2px solid #44faa5;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
}

.projects-section {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.projects-section.dark-section {
  justify-content: center;
  min-height: 100vh;
  padding-top: 3rem;
}

.grid-room-content-div {
  z-index: 8;
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  width: 100%;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
  position: relative;
}

.white-grid-text {
  color: var(--white);
  font-weight: 500;
}

.projects-view-port {
  width: 80vw;
  height: 100%;
}

.image-2 {
  object-fit: cover;
  width: 80vw;
  height: 50vw;
  margin-top: 40px;
  position: absolute;
  inset: 0% auto auto;
}

.snap-images {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: relative;
}

.sticky-viewport {
  height: 90vh;
  overflow: scroll;
}

.dark-section {
  background-color: var(--black);
  align-items: center;
  min-height: 100vh;
  padding-left: 7em;
  padding-right: 7em;
  display: flex;
}

.dark-section.line-back {
  background-image: url('../images/Lines.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
  position: relative;
}

.med-weight {
  text-align: left;
  text-transform: capitalize;
  font-weight: 500;
}

.med-weight.white {
  color: var(--gainsboro);
}

.med-weight.white.split-lines {
  color: var(--white);
  text-align: left;
  align-self: auto;
  font-size: 6em;
}

.hero-image {
  width: 27%;
  max-width: 500px;
  position: absolute;
  inset: 0% 0% auto auto;
}

.scroll-div {
  z-index: 2;
  width: auto;
  max-width: 1060px;
  padding-right: 20px;
  position: relative;
  overflow: scroll;
}

.div-block {
  background-image: linear-gradient(to right, var(--primary), var(--primary) 50%, #edd79d 51%, #e1663b);
  width: 300px;
  height: 50px;
}

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

.overlay-image {
  text-transform: capitalize;
  background-image: linear-gradient(#fff0, #000);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: 53px;
  display: flex;
  position: absolute;
  inset: 0%;
}

.grid-room-image {
  z-index: 2;
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: inline-block;
  position: absolute;
  inset: 0%;
}

.grid-room-overlay {
  z-index: 5;
  background-color: #2727277d;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0%;
}

.line-animation {
  z-index: 1;
  object-fit: contain;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0%;
}

.line-cover {
  z-index: 2;
  background-color: #272727;
  width: 100%;
  height: 0%;
  position: absolute;
  inset: auto 0% 0%;
}

._50-50-section {
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: contain;
  flex-direction: column;
  align-items: stretch;
  display: none;
}

._50-50-div {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex: 1;
  align-items: center;
  display: flex;
}

._50-50-div.grid {
  align-items: center;
}

.company-collage {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  flex: 1;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  display: grid;
  position: relative;
}

.centered-div {
  z-index: 60;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.poly {
  width: 100%;
  margin-bottom: -69px;
  position: relative;
}

.poly._2-poly {
  width: 100%;
  top: 24.5%;
  left: 16.65%;
}

.poly._3-poly {
  top: 25%;
  left: 50%;
}

.poly._4-poly {
  top: 49.2%;
}

.poly._5-poly {
  top: 49%;
  left: 33%;
}

.pro-remote {
  background-color: var(--gainsboro);
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: contain;
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding-left: 7rem;
  padding-right: 7rem;
  display: flex;
}

.pro-remote.with-abs {
  background-color: var(--gainsboro);
}

.contact-us-forum-block {
  flex: 1;
}

.contact-field {
  background-color: #0000;
  border: 1px #000;
  border-bottom-style: solid;
  margin-bottom: 20px;
  padding-right: 0;
}

.contact-field:focus {
  border-style: solid;
  border-color: var(--primary);
}

.submit-button {
  background-color: var(--primary);
  color: var(--black);
  width: 100%;
  margin-top: 10px;
  padding-top: 14px;
  padding-bottom: 14px;
  font-weight: 500;
}

.small-weight {
  text-align: left;
  text-transform: capitalize;
  flex-direction: column;
  margin-bottom: 10px;
  padding-right: 0;
  font-size: 3em;
  font-weight: 500;
}

.small-weight.white {
  text-align: center;
  width: 70%;
  font-size: 3.5em;
}

.med {
  text-align: left;
  text-transform: capitalize;
  margin-top: 0;
  margin-bottom: 0;
}

.profiessionals-pic {
  align-self: center;
  margin-bottom: 40px;
}

.image-4 {
  clear: left;
  position: absolute;
}

.about-us-body-content {
  flex-direction: row;
  align-self: flex-end;
  align-items: center;
  display: flex;
}

.div-block-3 {
  width: 385px;
}

.request-consultation {
  flex-direction: column;
  justify-content: flex-end;
  width: auto;
  height: 100vw;
  display: flex;
}

.div-block-4 {
  width: 100%;
}

.align-left {
  text-align: left;
  text-transform: capitalize;
  font-weight: 500;
}

.align-left.white-text {
  color: #fff;
  text-align: center;
  font-size: 4.5em;
}

.white {
  color: var(--white);
  font-weight: 500;
}

.white.project-description {
  color: var(--gainsboro);
  text-transform: none;
  font-weight: 400;
  line-height: 1.5;
}

.div-block-5 {
  display: flex;
}

.div-block-6 {
  padding-left: 320px;
  display: flex;
}

.section-2 {
  height: 100vw;
}

.request-sec {
  z-index: 100;
  background-color: var(--white);
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: visible;
}

._100-div {
  z-index: 20;
  background-color: #fff;
  flex-direction: row;
  height: 100%;
  display: flex;
}

._50-white {
  background-color: var(--white);
  align-self: auto;
  width: 50%;
  padding: 102px 40px;
}

.div-block-8 {
  width: 50%;
}

._50-dark {
  background-color: var(--black);
  background-image: url('../images/Dark-Lines.svg');
  background-position: 50%;
  background-size: contain;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 50%;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 5%;
  display: flex;
}

.request-consultation-h3 {
  padding: 0;
  font-weight: 500;
}

.text-field {
  border: 1px solid #000;
}

.text-field-2 {
  border: 2px solid #000;
}

.field-label {
  padding-right: 0;
}

.div-block-9 {
  display: flex;
}

.name-label-div, .e---mail-label-div {
  width: 100%;
}

._2-input-fields-div {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-direction: row;
  align-items: center;
  display: flex;
}

.contact-field-copy {
  background-color: #0000;
  border: 1px #000;
  border-bottom-style: solid;
  margin-bottom: 10px;
  display: block;
}

.contact-field-copy:focus {
  border-style: solid;
  border-color: var(--primary);
}

.field-label-2 {
  margin-top: 20px;
}

.e---mail-label-div-copy {
  width: 50%;
  padding-right: 24px;
}

.hiring-need {
  margin-bottom: 21px;
  padding-right: 0;
}

.field-label-3 {
  margin-top: 24px;
}

.reach-out {
  color: #fff;
  padding-top: 0;
  padding-bottom: 55px;
  padding-right: 20px;
  font-weight: 500;
}

.green-word {
  color: var(--primary);
}

.contact {
  padding-left: 0;
  font-weight: 500;
}

.our-phone {
  padding-left: 0;
  font-size: 16px;
  text-decoration: none;
}

.phone-div, .mail-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  padding-left: 0;
  text-decoration: none;
  display: flex;
}

.hello-incode-com {
  font-size: 16px;
  text-decoration: none;
}

.contact-us-content {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  padding-left: 0;
  display: flex;
}

.contact-us-section-div {
  padding-bottom: 20px;
}

.contact-us-section-div.dark {
  color: var(--black);
}

.our-customers-logos {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-wrap: wrap;
  margin-top: 0;
  display: flex;
}

.heading-3 {
  color: var(--white);
  font-weight: 500;
}

.bold-text {
  font-weight: 500;
}

.about-us-description {
  align-self: flex-end;
}

.get-in-touch {
  color: var(--black);
  cursor: pointer;
  background-color: #44faa5;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 350px;
  padding: 14px 20px;
  font-weight: 500;
  text-decoration: none;
  transition: all .3s cubic-bezier(.55, .055, .675, .19);
  display: flex;
}

.get-in-touch:hover {
  background-color: var(--black);
  color: #fff;
}

.get-in-touch.trans {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #0000;
  justify-content: center;
  font-weight: 500;
}

.btn-text {
  color: var(--black);
  text-transform: uppercase;
  font-weight: 500;
  text-decoration: none;
}

.btn-text.white:hover {
  color: #fff;
}

.image-5 {
  position: absolute;
}

.standards-section {
  background-color: var(--white);
  justify-content: center;
  height: 80vh;
  padding-left: 7em;
  padding-right: 7em;
  display: flex;
  position: relative;
}

.forum-text-block {
  margin-bottom: 20px;
}

.close-button-image {
  cursor: pointer;
  position: absolute;
  inset: 3% auto auto 2%;
}

.image-6 {
  position: absolute;
  inset: auto 0% 0%;
}

.image-7 {
  position: absolute;
  inset: auto 0% 0% 79px;
}

.left-shape {
  z-index: -82;
  width: 210px;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.right-shape {
  width: 210px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.div-block-10 {
  width: 20%;
  height: 20%;
  display: flex;
}

.image-8 {
  background-color: #360909;
}

.up {
  -webkit-text-fill-color: inherit;
  background-image: linear-gradient(#dcbf7d, #b43c29 23%, #7832c8 46%, #5260ed 75%, #45d1ee);
  background-clip: border-box;
  width: 1.5%;
  height: 15%;
  padding-top: 0;
  position: relative;
  bottom: 46px;
}

.down {
  -webkit-text-fill-color: inherit;
  background-image: linear-gradient(#dcbf7d, #b43c29 23%, #7832c8 46%, #5260ed 75%, #45d1ee);
  background-clip: border-box;
  width: 1.5%;
  height: 15%;
  padding-top: 0;
  position: relative;
  bottom: 15px;
}

.color-column {
  background-image: linear-gradient(214deg, #dcbf7d, #b43c29 34%, #7832c8 58%, #5260ed 73%, #45d1ee);
  width: 25px;
  height: 100px;
  position: absolute;
  inset: auto 85px 0% auto;
}

.color-column.right {
  background-image: linear-gradient(201deg, #38caf1, #3ca2ec 28%, #7038b6 49%, #b96637 69%, #d1d6d9 84% 101%);
  bottom: 0%;
  right: 60px;
}

.color-column-2 {
  background-image: linear-gradient(214deg, #dcbf7d, #b43c29 34%, #7832c8 58%, #5260ed 73%, #45d1ee);
  width: 25px;
  height: 100px;
  position: absolute;
  inset: auto 85px 0% auto;
}

.color-column-2.right {
  background-image: linear-gradient(201deg, #38caf1, #3ca2ec 28%, #7038b6 49%, #b96637 69%, #d1d6d9 84% 101%);
  bottom: 0%;
  right: 60px;
}

.accelerate-section {
  background-color: #272727;
  background-image: url('../images/Lines.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding-left: 7rem;
  padding-right: 7rem;
  display: flex;
  position: relative;
}

.accelerate-section.no-line {
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  padding-top: 60px;
  padding-bottom: 60px;
}

.s {
  color: #fff;
  font-size: 3.5em;
}

.center-paragraph {
  color: #fff;
  width: 64%;
  padding-left: 92px;
  padding-right: 92px;
  line-height: 1.5;
}

.center-div {
  z-index: 10;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  text-align: center;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-self: center;
  align-items: center;
  display: flex;
  position: relative;
}

.image-9 {
  position: absolute;
  left: 236px;
}

.green-text {
  color: var(--primary);
}

.image-10 {
  position: absolute;
  bottom: 281px;
}

.logo-streak-div {
  display: flex;
}

.green-boxs {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.green-box {
  background-color: var(--primary);
}

.white-box {
  background-color: var(--white);
}

.box {
  width: 20px;
  height: 20px;
}

.box.green {
  background-color: var(--primary);
}

.box.white {
  background-color: #0000;
}

.long-streak {
  background-image: linear-gradient(to right, #2e2f62, #409d9a);
  width: 87px;
  height: 20px;
}

.image-11 {
  z-index: 5;
  position: absolute;
  inset: 28% auto 0% 17%;
}

.logo-streak-div-dark {
  display: flex;
}

.linear-2 {
  background-image: linear-gradient(to right, #dcbf7d, #b43c29 40%, #7832c8 60%, #5260ed 80%, #45d1ee);
  width: 87px;
  height: 20px;
}

.hire-btn {
  cursor: pointer;
  background-color: #44faa5;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 350px;
  padding: 14px 20px;
  font-weight: 500;
  display: flex;
}

.hire-btn:hover {
  background-color: var(--black);
  color: #fff;
}

.hire-btn.trans {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #0000;
  justify-content: center;
  font-weight: 500;
}

.long-streak-linear-2 {
  background-image: linear-gradient(108deg, #eee65a 20%, #edda4f 40%, #efaa37 60%, #ec6d56 80%, #dd4381);
  width: 87px;
  height: 20px;
}

.new-column {
  background-image: linear-gradient(214deg, #45d1ee, #5260ed 34%, #7832c8 58%, #b43c29 73%, #dcbf7d);
  width: 25px;
  height: 100px;
}

.new-column.right {
  background-image: linear-gradient(201deg, #38caf1, #3ca2ec 28%, #7038b6 49%, #b96637 69%, #d1d6d9 84% 101%);
  bottom: 0%;
  right: 60px;
}

.div-block-11 {
  height: 100px;
}

.div-block-12 {
  background-color: #ffa2a2;
  width: 25px;
  height: 100px;
  position: absolute;
  top: 5784.84px;
  left: 402px;
}

.div-block-13 {
  background-image: linear-gradient(#45d1ee, #5260ed 22%, #7832c8 47%, #b43c29 77%, #dcbf7d);
  width: 25px;
  height: 100px;
  position: absolute;
  top: auto;
  bottom: 0;
  right: 60px;
}

.color-column-dark-linear {
  background-image: linear-gradient(108deg, #45d1ee, #5260ed 22%, #7832c8 47%, #b43c29 77%, #dcbf7d);
  width: 25px;
  height: 100px;
  position: absolute;
  top: 600px;
  bottom: 0;
  right: 215px;
}

.color-column-dark-linear.right, .color-column-dark-linear.big {
  background-image: linear-gradient(108deg, #54856a, #94963f 22%, #954527 47%, #552353 77%, #36357d);
  top: 600px;
  bottom: 60px;
  right: 240px;
}

.color-column-dark-linear-small {
  background-image: linear-gradient(108deg, #45d1ee, #5260ed 22%, #7832c8 47%, #b43c29 77%, #dcbf7d);
  width: 25px;
  height: 100px;
  position: absolute;
  top: 600px;
  bottom: 0;
  right: 215px;
}

.color-column-dark-linear-small.right {
  background-image: linear-gradient(108deg, #54856a, #94963f 22%, #954527 47%, #552353 77%, #36357d);
  top: 600px;
  bottom: 60px;
  right: 240px;
}

.logo-streak-div-dark-copy {
  display: flex;
}

.color-column-dark {
  background-image: linear-gradient(108deg, #45d1ee, #5260ed 22%, #7832c8 47%, #b43c29 77%, #dcbf7d);
  width: 25px;
  height: 100px;
  position: absolute;
  top: 600px;
  bottom: 0;
  right: 215px;
}

.color-column-dark.big {
  background-image: linear-gradient(108deg, #54856a, #94963f 22%, #954527 47%, #552353 77%, #36357d);
  top: 730px;
  bottom: 60px;
  right: 250px;
}

.color-column-dark.small {
  top: 705px;
  right: 225px;
}

.text-block-3 {
  color: var(--black);
}

.text-block-4 {
  cursor: pointer;
}

.industry-label-div {
  width: 100%;
}

.text-btn {
  color: var(--black);
}

.text-btn:hover {
  color: #fff;
}

.div-block-14 {
  background-color: var(--primary);
  flex: 0 auto;
  width: 100%;
  max-width: 350px;
  padding: 14px 20px;
}

.text-block-5 {
  text-align: center;
  text-transform: uppercase;
  font-weight: 500;
}

.contact-us {
  background-color: var(--gainsboro);
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: contain;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding-left: 7rem;
  padding-right: 7rem;
  display: flex;
}

.contact-us.with-abs {
  background-color: var(--gainsboro);
}

.remote-jobs {
  background-color: var(--gainsboro);
  background-image: url('../images/final-line.svg');
  background-position: 50%;
  background-size: contain;
  justify-content: center;
  align-items: center;
  padding-left: 7rem;
  padding-right: 7rem;
  display: flex;
}

.remote-jobs.with-abs {
  background-color: var(--gainsboro);
  min-height: 100vh;
  padding-top: 60px;
  padding-bottom: 60px;
  display: none;
}

.touch-text {
  text-transform: uppercase;
  font-weight: 500;
}

.request-q {
  color: var(--black);
  cursor: pointer;
  background-color: #44faa5;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 350px;
  padding: 14px 20px;
  font-weight: 500;
  text-decoration: none;
  transition: all .3s cubic-bezier(.55, .055, .675, .19);
  display: flex;
}

.request-q:hover {
  background-color: var(--black);
  color: #fff;
}

.request-q.trans {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  background-color: #0000;
  justify-content: center;
  font-weight: 500;
}

.hire-now-section {
  z-index: 100;
  background-color: var(--white);
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: visible;
}

.select-field {
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 20px;
}

.experience-level-input, .company-drop-down {
  margin-bottom: 21px;
  padding-right: 0;
}

.hiring-need-drop, .employees-drop, .role-drop-down {
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 20px;
}

.diffrent-role {
  background-color: #0000;
  border: 1px #000;
  border-bottom-style: solid;
  margin-bottom: 20px;
  padding-right: 0;
}

.diffrent-role:focus {
  border-style: solid;
  border-color: var(--primary);
}

.contact-us-div {
  margin-top: 20px;
}

@media screen and (max-width: 991px) {
  .hero-title {
    font-size: 4em;
  }

  .hero-subtitle {
    text-align: center;
  }

  .about-us-section {
    min-height: auto;
    margin-left: auto;
    margin-right: auto;
    padding-left: 40px;
    padding-right: 40px;
  }

  .about-us-content {
    flex-direction: column;
    padding-top: 60px;
    padding-left: 0;
    padding-right: 0;
  }

  .services.dark.line-back {
    background-image: url('../images/Lines.svg');
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .slider {
    width: 90%;
  }

  .slider-header {
    font-size: 5em;
    line-height: 1;
  }

  .slider-paragraph {
    font-size: 1.8em;
  }

  .dark-section.line-back {
    background-size: cover;
    padding-left: 2em;
    padding-right: 2em;
  }

  .med-weight.white.split-lines {
    font-size: 5em;
  }

  .overlay-image {
    padding: 10px;
  }

  .line-animation {
    object-fit: cover;
  }

  ._50-50-div {
    flex-direction: column;
  }

  .contact-us-forum-block {
    align-self: stretch;
  }

  .small-weight {
    font-size: 2.5em;
  }

  .small-weight.white {
    width: 95%;
  }

  .align-left {
    font-size: 4em;
  }

  .white.project-description {
    font-size: 12px;
  }

  ._50-dark {
    padding-left: 4%;
  }

  .request-consultation-h3 {
    font-size: 32px;
  }

  .field-label-3 {
    font-size: 18px;
  }

  .reach-out {
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
    font-size: 32px;
  }

  .contact-us-section-div {
    padding-left: 0;
  }

  .our-customers-logos, .heading-3 {
    padding-left: 17px;
  }

  .customers-who-trust-us-sec {
    padding-top: 16px;
  }

  .field-label-4, .field-label-5, .field-label-6 {
    font-size: 18px;
  }

  .text-block-2 {
    color: var(--dim-grey);
  }

  .standards-section {
    padding-left: 5em;
    padding-right: 5em;
  }

  .left-shape {
    width: 140px;
  }

  .right-shape {
    width: 131px;
  }

  .color-column {
    left: 711px;
  }

  .color-column-2.right {
    bottom: -3%;
    left: 735px;
  }

  .accelerate-section {
    background-position: 50%;
    background-repeat: repeat;
    background-size: cover;
    background-attachment: fixed;
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .center-paragraph {
    padding-left: 10px;
    padding-right: 10px;
    line-height: 1.5;
  }

  .color-column-dark.big {
    top: 774px;
  }

  .color-column-dark.small {
    top: 755px;
  }

  .contact-us.footer {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .remote-jobs.with-abs {
    min-height: auto;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 3.2em;
  }

  h2 {
    font-size: 3em;
  }

  h3 {
    font-size: 26px;
  }

  .hero-new {
    min-height: 600px;
  }

  .hero-content-div {
    padding-left: 2em;
    padding-right: 2em;
  }

  .hero-title {
    font-size: 2.8em;
  }

  .about-us-section {
    padding-left: 3em;
    padding-right: 3em;
  }

  .about-us-paragraph {
    max-width: none;
  }

  .services {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .right-arrow {
    width: 150px;
    height: 150px;
    top: 150px;
  }

  .right-arrow:hover {
    background-position: 169px;
  }

  .left-arrow {
    width: 150px;
    height: 150px;
  }

  .left-arrow:hover {
    background-position: -191px;
  }

  .slider-header {
    font-size: 3em;
  }

  .slider-paragraph {
    width: 320px;
  }

  .projects-section.dark-section {
    padding-left: 3em;
    padding-right: 3em;
  }

  .snap-images {
    height: 50%;
  }

  .dark-section.line-back {
    padding-left: 3em;
    padding-right: 3em;
  }

  .med-weight.white.split-lines {
    font-size: 5em;
  }

  .scroll-div {
    display: block;
  }

  ._50-50-div {
    flex-direction: column;
  }

  ._50-50-div.grid {
    padding-top: 0;
  }

  .centered-div {
    margin-top: 61px;
  }

  .pro-remote {
    margin-top: 86px;
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .html-embed {
    display: block;
  }

  .small-weight {
    text-align: center;
  }

  .small-weight.white {
    width: 95%;
    font-size: 2.5em;
  }

  .align-left.white-text {
    font-size: 3.5em;
  }

  ._100-div {
    flex-direction: column;
  }

  ._50-white {
    width: 100%;
  }

  ._50-dark {
    align-items: center;
    width: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 3%;
  }

  ._2-input-fields-div {
    align-items: flex-end;
  }

  .reach-out {
    text-align: left;
    font-size: 24px;
  }

  .our-phone {
    align-self: center;
    font-size: 14px;
  }

  .hello-incode-com {
    align-self: center;
  }

  .contact-us-content {
    flex-direction: column;
    align-items: flex-start;
  }

  .contact-us-section-div {
    text-align: left;
    align-self: flex-start;
    margin-top: 8px;
    padding-left: 0;
  }

  .our-customers-logos {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-direction: row;
    align-items: center;
    padding-left: 0;
  }

  .customers-who-trust-us-sec {
    align-self: flex-start;
    padding-top: 8px;
  }

  .field-label-4 {
    font-size: 16px;
  }

  .standards-section {
    padding-left: 3em;
    padding-right: 3em;
  }

  .left-shape, .right-shape {
    width: 90px;
  }

  .color-column, .color-column-2.right {
    display: none;
  }

  .accelerate-section {
    background-position: 50%;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .center-paragraph {
    padding-left: 0;
    padding-right: 0;
  }

  .contact-us, .remote-jobs {
    margin-top: 86px;
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 2.4em;
  }

  h2 {
    font-size: 2.5em;
  }

  .hero-content-div {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    padding-left: 1em;
    padding-right: 1em;
  }

  .hero-title {
    font-size: 2em;
  }

  .hero-subtitle {
    text-align: center;
  }

  .corner-button {
    max-width: none;
  }

  .corner-button.trans {
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    align-self: auto;
    font-weight: 700;
  }

  .corner-button.trans:hover {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .hero-logo {
    z-index: 3;
    width: 130px;
    position: relative;
  }

  .about-us-section {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 0;
    padding-right: 0;
  }

  .about-us-content {
    padding-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .about-us-content._100 {
    align-self: flex-start;
    margin-top: 44px;
  }

  .about-us-paragraph {
    text-align: left;
    margin-top: 40px;
    padding-bottom: 20px;
  }

  .services {
    padding-left: 0;
    padding-right: 0;
  }

  .right-arrow {
    inset: 0% 0% auto auto;
  }

  .left-arrow {
    inset: 0% auto auto 0%;
  }

  .slider-full-div {
    flex-direction: column;
    padding-left: 10px;
    padding-right: 10px;
  }

  .slider-heading-div {
    width: 230px;
    margin-top: 140px;
  }

  .button-button-slider-div {
    justify-content: center;
  }

  .slider-header {
    font-size: 3em;
  }

  .slider-paragraph {
    width: 100%;
    margin-bottom: 40px;
    font-size: 1.5em;
  }

  .projects-section.dark-section {
    padding-top: 0;
    padding-left: 1em;
    padding-right: 1em;
  }

  .grid-room-content-div {
    padding-left: 20px;
    padding-right: 20px;
  }

  .white-grid-text.split-lines, .white-grid-text.split-lines-no-anim {
    font-size: 1.5em;
  }

  .snap-images {
    height: 33.333%;
  }

  .dark-section.line-back {
    padding-left: 1em;
    padding-right: 1em;
  }

  .med-weight.white.split-lines {
    color: var(--white);
    font-size: 2em;
  }

  .hero-image {
    width: 70%;
  }

  .scroll-div {
    display: block;
  }

  .overlay-image {
    padding: 3px;
  }

  ._50-50-div {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .company-collage {
    width: 100%;
  }

  .centered-div {
    align-self: center;
    margin-top: 20px;
    padding-right: 0;
  }

  .pro-remote {
    padding-left: .5rem;
    padding-right: .5rem;
  }

  .contact-forum {
    margin-top: 24px;
  }

  .small-weight {
    text-align: center;
    justify-content: center;
    align-items: center;
    font-size: 2em;
    display: flex;
  }

  .div-block-3 {
    width: 156px;
  }

  .align-left {
    text-align: left;
    font-size: 2.5em;
  }

  .align-left.white-text {
    font-size: 2.5em;
  }

  .div-block-6 {
    padding-left: 0;
  }

  ._50-white {
    padding: 10px;
  }

  .request-consultation-h3 {
    text-align: left;
    font-size: 20px;
  }

  .name-label-div {
    width: 100%;
  }

  .e---mail-label-div {
    width: 100%;
    padding-right: 0;
    font-size: 16px;
  }

  .field-label-3 {
    font-size: 16px;
  }

  .reach-out {
    padding: 9px;
    font-size: 18px;
  }

  .contact {
    text-align: left;
    font-size: 16px;
  }

  .our-phone {
    text-align: center;
  }

  .hello-incode-com {
    font-size: 14px;
  }

  .contact-us-content {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-direction: column;
  }

  .contact-us-section-div {
    text-align: left;
    padding: 8px;
  }

  .our-customers-logos {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }

  .heading-3 {
    text-align: center;
    font-size: 16px;
  }

  .get-in-touch {
    align-self: stretch;
    align-items: center;
    max-width: none;
  }

  .field-label-4, .field-label-5, .field-label-6 {
    font-size: 16px;
  }

  .text-block-2 {
    font-size: 12px;
  }

  .field-label-7 {
    font-size: 16px;
  }

  .standards-section {
    padding-left: 1em;
    padding-right: 1em;
  }

  .color-column {
    bottom: 11%;
  }

  .color-column-2.right {
    bottom: 9%;
  }

  .accelerate-section {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .center-paragraph {
    width: auto;
  }

  .hire-btn {
    max-width: 300px;
  }

  .color-column-dark.big, .color-column-dark.small {
    display: none;
  }

  .industry-label-div {
    width: 100%;
  }

  .contact-us {
    padding-left: .5rem;
    padding-right: .5rem;
  }

  .contact-us.footer {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .remote-jobs {
    padding-left: .5rem;
    padding-right: .5rem;
  }

  .remote-jobs.with-abs {
    margin-top: 20px;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .request-q {
    max-width: 300px;
  }

  .image-12 {
    display: block;
  }
}

#w-node-d9eda323-3fc7-e850-e417-7d53d4a0e429-f862de50, #w-node-d9eda323-3fc7-e850-e417-7d53d4a0e42a-f862de50, #w-node-d9eda323-3fc7-e850-e417-7d53d4a0e42b-f862de50, #w-node-d9eda323-3fc7-e850-e417-7d53d4a0e42c-f862de50, #w-node-d9eda323-3fc7-e850-e417-7d53d4a0e42d-f862de50, #w-node-d9eda323-3fc7-e850-e417-7d53d4a0e42e-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d0d-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d0e-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d0f-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d10-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d11-f862de50, #w-node-b373473a-b4c0-65d9-ff7c-a96cefe19d12-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11cf-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11d0-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11d1-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11d2-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11d3-f862de50, #w-node-b8284075-5f49-c867-51aa-67f0649e11d4-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb617c-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb617d-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb617e-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb617f-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb6180-f862de50, #w-node-_9a5d7e66-b540-afd5-90be-76e0aecb6181-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfcd-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfce-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfcf-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfd0-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfd1-f862de50, #w-node-b623fe83-4ec1-79f1-7858-cf234302cfd2-f862de50 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_9150d900-e6bc-62aa-22dd-fe91e1f5f5a6-f862de50 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_771a006d-15af-b4a5-1795-70ba317292dd-f862de50, #w-node-c00e4b05-8bfb-f147-9908-c5899a5753fe-f862de50, #w-node-_1b86e3e5-e9af-3ea0-70a1-2c8f60e42091-f862de50, #w-node-_7a5b9ccd-7054-a4e2-f76a-8b14f71ace80-f862de50 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_2aecc73b-f4f3-958a-1e9f-002379f684db-f862de50, #w-node-d9a57e96-6e2d-2065-29ec-a0eb07a0fc10-f862de50, #w-node-_5b7dcfa4-c8fd-bfb2-6730-f8954e9b66e1-f862de50, #w-node-_1cbefec8-53c3-dc50-b818-1fc7b0025796-f862de50 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-a09eb656-3f92-2a56-d767-272e72ab5f73-f862de50, #w-node-a09eb656-3f92-2a56-d767-272e72ab5f74-f862de50, #w-node-a09eb656-3f92-2a56-d767-272e72ab5f75-f862de50, #w-node-a09eb656-3f92-2a56-d767-272e72ab5f76-f862de50, #w-node-a09eb656-3f92-2a56-d767-272e72ab5f77-f862de50, #w-node-a09eb656-3f92-2a56-d767-272e72ab5f78-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d12-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d13-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d14-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d15-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d16-f862de50, #w-node-_3fe0e924-95ef-3744-1326-3b57fb9f4d17-f862de50 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}


@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Extralight.otf') format('opentype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Extrabold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Thin.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cabinetgrotesk';
  src: url('../fonts/CabinetGrotesk-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-BoldItalic.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-Italic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-LightItalic.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Neuemontreal';
  src: url('../fonts/NeueMontreal-MediumItalic.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}