:root {
  --red--100: #a30000;
  --red--200: #720000;
  --white: white;
  --black: #060101;
  --gray--200: #838383;
  --font-formal: Montserrat, sans-serif;
  --font-handwrite: Kalam, sans-serif;
  --gray--100: #d1d1d1;
  --gray--50: #edf0f2;
  --highlight: #ff3e3e;
  --white-2: white;
  --black-2: black;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  color: #333;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.herosection {
  background-color: #fff;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  overflow: hidden;
}

.container {
  max-width: 960px;
}

.container.herocontainer {
  z-index: 1;
  grid-column-gap: 10vh;
  grid-row-gap: 10vh;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  display: flex;
  position: relative;
}

.container.techtalent {
  width: 100%;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.container.insightcont {
  padding-top: 120px;
  padding-bottom: 100px;
}

.navbar {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
  background-color: #ffffff4d;
  position: fixed;
  left: 0;
  right: 0;
}

.navbarcontainer {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: row;
  flex: 0 auto;
  order: 0;
  justify-content: space-between;
  align-self: auto;
  align-items: stretch;
  max-width: 1280px;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
}

.brand {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  padding-left: 0;
  display: flex;
}

.herotextdiv {
  flex-flow: column;
  align-items: flex-start;
  display: flex;
}

.herobutton {
  border: 1px solid var(--red--100);
  background-color: var(--red--100);
  text-align: center;
  -webkit-text-fill-color: inherit;
  object-fit: fill;
  background-clip: border-box;
  border-radius: 4px;
  width: auto;
  height: auto;
  margin-top: 0;
  padding: 16px 40px;
  font-size: 20px;
  font-weight: 500;
  line-height: 150%;
  transition: background-color .3s;
}

.herobutton:hover {
  background-color: var(--red--200);
}

.heroh1text {
  color: var(--white);
  min-width: 100%;
  min-height: 100%;
  margin-top: 8px;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 85px;
  line-height: 110%;
  display: block;
}

.text-span {
  color: #0000;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--white);
  overflow-wrap: normal;
  font-weight: 700;
  line-height: 110%;
}

.herotext {
  color: var(--white);
  flex: 0 auto;
  margin-top: 8px;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 110%;
  display: block;
}

.herodesctext {
  color: var(--black);
  font-family: Montserrat, sans-serif;
  font-size: 22px;
  font-weight: 500;
  line-height: 200%;
}

.div-block {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: flex-start;
  display: flex;
}

.herobuttondiv {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  aspect-ratio: auto;
  object-fit: fill;
  border-radius: 4px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: auto;
  margin-top: 16px;
  display: flex;
}

.container-3 {
  align-items: stretch;
  display: flex;
}

.menu-button {
  display: none;
}

.nav-link {
  color: var(--black);
  font-family: Montserrat, sans-serif;
  font-weight: 600;
}

.nav-link:hover {
  color: var(--gray--200);
  font-weight: 600;
}

.nav-link-2 {
  color: var(--white);
  font-family: Montserrat, sans-serif;
  font-weight: 600;
}

.nav-link-2:hover {
  color: var(--gray--200);
  font-weight: 600;
}

.nav-link-3 {
  color: var(--white);
  font-family: Montserrat, sans-serif;
  font-weight: 600;
}

.nav-link-3:hover {
  color: var(--gray--200);
  font-weight: 600;
}

.nav-link-4, .nav-link-5 {
  color: var(--white);
  font-family: Montserrat, sans-serif;
  font-weight: 500;
  display: none;
}

.backgroundimage {
  z-index: 0;
  width: auto;
  min-width: 100vw;
  max-width: none;
  height: auto;
  max-height: none;
  display: none;
  position: absolute;
  top: 0;
  left: auto;
}

.footer {
  background-color: var(--black);
  justify-content: space-between;
  align-items: center;
  max-width: none;
  margin-top: 0;
  padding-top: 50px;
  padding-bottom: 56px;
  display: flex;
  overflow: hidden;
}

.talentsection {
  z-index: -1;
  width: 100vw;
  height: 350vh;
  position: static;
  top: 0;
  overflow: visible;
}

.headeranimationdiv {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  width: 58%;
  height: 100vh;
  padding-top: 90px;
  padding-bottom: 5vh;
  display: flex;
  position: static;
  top: 0;
}

.techtalentcontainer {
  justify-content: space-between;
  align-items: center;
  height: 100vh;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.talentheadtext {
  font-family: var(--font-formal);
  color: var(--black);
  font-size: 48px;
  font-weight: 700;
  line-height: 1.2em;
}

.bold-text {
  font-family: var(--font-handwrite);
  color: var(--red--200);
  font-size: 72px;
  font-weight: 700;
}

.spline-scene {
  flex: 1;
  width: 100%;
  display: none;
}

.talentstepsdiv {
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
  overflow: visible;
}

.talentstepdiv {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: center;
  width: 375px;
  height: 70vh;
  display: flex;
}

.talentstepdiv.middle {
  height: 50vh;
}

.talentstepdiv.empty {
  height: 25vh;
}

.talentstepheader {
  font-family: var(--font-formal);
  color: var(--black);
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2em;
}

.talentstepheader.handwrite {
  font-family: var(--font-handwrite);
  color: var(--red--100);
  font-size: 52px;
  font-weight: 400;
  line-height: 1.2em;
}

.stepdescriptiontexr {
  font-family: var(--font-formal);
  font-size: 18px;
  line-height: 1.4em;
}

.footerlink {
  font-family: var(--font-formal);
  color: var(--white);
  text-align: center;
  width: 120px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  text-decoration: none;
  transition: color .2s;
}

.footerlink:hover {
  color: var(--gray--200);
}

.container-5 {
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.insightsection {
  background-color: #eee;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  height: auto;
  display: flex;
  overflow: clip;
}

.blogtimetext {
  color: #b7b7b7;
  font-weight: 400;
}

.blogtimetext.loading {
  opacity: 0;
}

.blogdescriptiontext {
  color: #888;
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.5em;
}

.blogdescriptiontext.loading {
  color: #ddd;
  background-color: #ddd;
  border-radius: 12px;
}

.blogauthortext {
  color: #a30000;
  font-weight: 600;
}

.blogauthortext.loading {
  opacity: 0;
}

.blogtitletext {
  cursor: pointer;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5em;
  transition: color .3s;
}

.blogtitletext:hover {
  color: #a30000;
}

.blogtitletext.loading {
  color: #ddd;
  background-color: #ddd;
  border-radius: 12px;
}

.blogitemwrapper {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 40px;
  padding-bottom: 40px;
  display: flex;
}

.blogitemwrapper.center {
  border-left: 1px solid #ececec;
  border-right: 1px solid #ececec;
  flex: 1;
  padding-left: 20px;
  padding-right: 20px;
}

.blogitemwrapper.right {
  flex: 1;
  padding-left: 20px;
}

.blogitemwrapper.left {
  flex: 1;
  padding-right: 20px;
}

.blogwrapper {
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  display: flex;
}

.bloginfowrapper {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.container-6 {
  max-width: 940px;
}

.container-6.blogitemcontainer, .blogtag {
  display: flex;
}

.blogtagtext {
  cursor: pointer;
  border: 1px solid #b7b7b7;
  border-radius: 20px;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.4em;
  transition: background-color .3s;
}

.blogtagtext:hover {
  background-color: #e2e2e2;
}

.blogtagtext.loading {
  opacity: 0;
}

.jobopeningsection {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  background-color: var(--white);
  flex-flow: column;
  width: auto;
  height: auto;
  margin-top: 0;
  padding-top: 120px;
  display: flex;
  overflow: hidden;
}

.form {
  display: flex;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.jobopeingtitlediv {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  height: auto;
  display: flex;
}

.jobheadertext {
  font-family: var(--font-formal);
  color: var(--black);
  text-transform: uppercase;
  font-size: 48px;
  font-weight: 600;
  line-height: 56px;
}

.jobheadertext.red {
  color: var(--red--100);
}

.jobheaderdiv {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: flex;
}

.dropdown-toggle {
  border: 1px solid var(--gray--100);
  opacity: .74;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding-top: 8px;
  padding-bottom: 8px;
  display: flex;
}

.dropdown-toggle:focus {
  border-width: 1px;
  border-color: var(--red--200);
}

.dropdown-toggle.w--open {
  border-color: var(--red--100);
  transition: border-color .2s;
}

.text-block-2 {
  font-family: var(--font-formal);
  font-size: 16px;
  line-height: 28px;
}

.teamdropdown {
  border: 0px solid var(--gray--100);
  border-radius: 8px;
  width: 280px;
}

.teamdropdown:active {
  border-color: var(--gray--100);
}

.teamdropdown:focus {
  border-width: 0;
  border-color: var(--gray--100);
}

.employmentdropdown {
  border: 0px solid var(--gray--100);
  border-radius: 0;
  width: 360px;
}

.employmentdropdown:focus {
  border-color: var(--red--100);
}

.dropdowndiv {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  width: 100%;
  display: flex;
}

.icon, .icon-2 {
  color: var(--red--100);
}

.jobheaderfilterdiv {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: auto;
  display: flex;
}

.insightheadertext {
  z-index: 1;
  font-family: var(--font-formal);
  color: var(--red--100);
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2em;
  position: relative;
}

.insightheadertext.handwrite {
  background-image: linear-gradient(90deg, black, var(--red--100));
  font-family: var(--font-handwrite);
  color: var(--white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 72px;
  font-weight: 400;
  line-height: 1.2em;
}

.oprningscontainer {
  grid-column-gap: 28px;
  grid-row-gap: 28px;
  background-color: #eee;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  max-width: none;
  height: auto;
  padding-top: 16px;
  padding-bottom: 40px;
  display: flex;
}

.workingsection {
  grid-column-gap: 56px;
  grid-row-gap: 56px;
  background-color: var(--white);
  text-transform: uppercase;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  padding-top: 100px;
  padding-bottom: 80px;
  display: flex;
  overflow: hidden;
}

.workingheadergradienttext {
  background-image: linear-gradient(90deg, black, var(--red--100) 49%);
  font-family: var(--font-formal);
  color: var(--black);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.4em;
}

.workingheadertextdiv {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  display: flex;
}

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

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

.describingtextdiv {
  flex-flow: wrap;
  justify-content: center;
  align-items: flex-start;
  height: 154px;
  display: flex;
}

.describingtext {
  font-family: var(--font-formal);
  color: var(--black);
  text-align: center;
  font-size: 48px;
  font-weight: 600;
  line-height: 76px;
}

.describingtext.handwrite {
  font-family: var(--font-handwrite);
  color: var(--red--100);
  text-transform: capitalize;
  font-size: 56px;
  font-weight: 400;
}

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

.describingtextframediv {
  height: 154px;
  overflow: hidden;
}

.photoverticaldiv {
  width: auto;
}

.photoloopdiv {
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  display: flex;
  overflow: hidden;
}

.photodiv {
  flex: none;
  justify-content: space-between;
  align-items: center;
  width: auto;
  display: flex;
  position: static;
}

.image-2 {
  width: 306.82px;
}

.loopphoto {
  border-radius: 8px;
  width: auto;
  height: 200px;
  margin-right: 40px;
}

.socialmedialink {
  opacity: 1;
  border-radius: 99px;
  width: 56px;
  height: 56px;
}

.socialmedialink:hover {
  opacity: 1;
  mix-blend-mode: normal;
}

.facebooklogo {
  width: 100%;
  height: 100%;
}

.socialmediadiv {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: center;
  align-items: center;
  padding-bottom: 30px;
  display: flex;
}

.footercontainer {
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  display: flex;
}

.jobopeningdiv {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  border: 1px solid var(--gray--100);
  background-color: var(--white);
  border-radius: 8px;
  flex-flow: column;
  width: 760px;
  max-width: 940px;
  padding: 24px;
  display: flex;
}

.jobopeningdiv.close {
  background-color: #f4f4f4;
}

.employmenttext {
  border: 1px solid var(--red--100);
  font-family: var(--font-formal);
  color: var(--red--100);
  border-radius: 99px;
  padding: 4px 16px;
  font-size: 16px;
  font-weight: 500;
}

.employmenttypetagdiv, .teamtagdiv {
  font-family: var(--font-formal);
  color: var(--red--100);
}

.teamtext {
  border: 1px solid var(--gray--200);
  font-family: var(--font-formal);
  color: var(--black);
  border-radius: 99px;
  padding: 4px 16px;
  font-size: 16px;
  font-weight: 500;
}

.jobtagdiv {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.jobtagdiv.close {
  opacity: .3;
}

.jobtitletext {
  font-family: var(--font-formal);
  color: var(--black);
  cursor: pointer;
  font-size: 24px;
  font-weight: 600;
  line-height: 28px;
  text-decoration: none;
  transition: opacity .2s;
}

.jobtitletext:hover {
  opacity: .7;
  text-decoration: underline;
}

.jobtitletext.close {
  opacity: .3;
}

.primarybutton {
  background-color: var(--red--100);
  font-family: var(--font-formal);
  color: var(--white);
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  width: 120px;
  height: 40px;
  padding-left: 16px;
  padding-right: 16px;
  font-weight: 500;
  transition: background-color .2s;
  display: flex;
}

.primarybutton:hover {
  background-color: var(--red--200);
}

.primarybutton.outline {
  border: 2px solid var(--red--100);
  color: var(--red--100);
  background-color: #0000;
  font-weight: 600;
}

.primarybutton.outline:hover {
  border-color: var(--red--100);
  color: var(--red--100);
  -webkit-text-stroke-color: var(--red--100);
  background-color: #a300000d;
}

.primarybutton.close {
  background-color: var(--gray--200);
  font-weight: 400;
  transition-property: all;
  transition-timing-function: ease;
}

.primarybutton.close:hover {
  background-color: #5c5c5c;
}

.jobstatustext {
  font-family: var(--font-formal);
  color: #67b581;
  font-weight: 700;
}

.jobstatustext.close {
  color: var(--red--100);
}

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

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

.teamclipdiv {
  grid-column-gap: 13px;
  grid-row-gap: 13px;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.teamtitletext {
  font-family: var(--font-formal);
  color: var(--black);
  font-size: 20px;
  font-weight: 500;
  line-height: 32px;
}

.image-4 {
  width: 300px;
  max-width: none;
}

.videodiv {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: wrap;
  flex: none;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: none;
}

.allteamclipdiv {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: 50px;
  display: flex;
  position: relative;
}

.stopbreakdiv {
  border-style: solid;
  border-width: 40px 0 40px 100vw;
  border-color: var(--black) var(--black) var(--white);
  border-radius: 0;
  width: 100vw;
  height: 100px;
  padding-left: 0;
  display: none;
}

.startbreakdiv {
  border-style: solid;
  border-width: 40px 100vw 40px 0;
  border-color: var(--white) var(--black) var(--black) var(--red--200);
  border-radius: 0;
  width: 100vw;
  height: 100px;
  display: none;
}

.logo {
  z-index: 0;
  width: 380px;
  max-width: none;
  height: 310px;
  margin-top: 0;
  position: absolute;
  top: -25px;
  left: -65px;
}

.logodiv {
  height: 0;
  position: relative;
}

.insightheadertextdiv {
  flex-flow: column;
  align-items: flex-start;
  display: flex;
}

.navcareerstext {
  color: var(--black);
  font-family: Montserrat, sans-serif;
  font-size: 16px;
  font-weight: 400;
}

.cliplightbox {
  justify-content: center;
  align-items: center;
  width: 320px;
  height: 170px;
  display: flex;
  position: relative;
}

.cliplightbox:hover {
  opacity: 1;
}

.lighboxthumbnail {
  mix-blend-mode: normal;
  border-radius: 5px;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
}

.lighboxthumbnail:hover {
  opacity: 1;
}

.dropdownlist {
  background-color: var(--gray--100);
}

.dropdownlist.w--open {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  border: 1px solid var(--gray--100);
  background-color: var(--white);
  border-radius: 8px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 8px;
  display: flex;
}

.dropdownlink {
  font-family: var(--font-formal);
  width: 100%;
  padding: 12px;
  transition: background-color .2s;
}

.dropdownlink:hover {
  background-color: var(--gray--50);
  border-radius: 8px;
}

.image-5 {
  position: relative;
  inset: 0% auto 0% 0%;
}

.navbardiv {
  justify-content: space-between;
  width: 100%;
  display: flex;
}

.image-6 {
  position: relative;
}

.image-7 {
  vertical-align: text-top;
  display: inline-block;
  position: relative;
}

.image-8 {
  position: relative;
}

.backgrounddiv {
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-width: 100vw;
  height: 100%;
  min-height: 100vh;
  display: flex;
  position: absolute;
  overflow: hidden;
}

.image-9 {
  z-index: 1;
  display: block;
  position: absolute;
}

.image-9:hover {
  width: 100px;
  max-width: none;
  height: 100px;
}

.code-embed {
  color: var(--white);
  mix-blend-mode: normal;
  transition: color .2s;
  position: absolute;
}

.code-embed:hover {
  color: var(--red--100);
  mix-blend-mode: normal;
}

.playicon {
  color: var(--white);
  mix-blend-mode: normal;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: color .2s;
  display: flex;
  position: absolute;
}

.playicon:hover {
  color: var(--red--100);
  mix-blend-mode: normal;
  background-color: #fff3;
}

.div-block-2 {
  background-color: var(--white);
  opacity: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.div-block-2:hover {
  opacity: .2;
}

.talentdiv {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  justify-content: center;
  align-items: flex-start;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
}

.openinglistbgdiv {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  background-color: #eee;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  padding-top: 40px;
  padding-bottom: 40px;
  display: flex;
}

.div-block-6 {
  background-color: #eee;
  border-bottom: 1px solid #000;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  display: flex;
}

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

.logowhite {
  opacity: 0;
  max-width: none;
  height: 100%;
}

.backgroundlogoimage {
  min-width: 100vw;
  max-width: none;
  height: 150%;
  display: none;
  position: absolute;
  top: 0;
  left: auto;
}

.workingheadertext {
  font-family: var(--font-formal);
  color: var(--black);
  -webkit-text-fill-color: inherit;
  background-clip: border-box;
  font-size: 32px;
  font-weight: 500;
  line-height: 1.4em;
}

.background {
  min-width: 100vw;
  max-width: none;
  height: 150%;
  position: absolute;
}

.slider {
  width: 100%;
}

.slide, .slide-2, .slide-3 {
  width: 33%;
}

.slide-nav {
  display: none;
}

.slide-4 {
  aspect-ratio: 16 / 9;
  object-fit: fill;
  width: 300px;
  height: 170px;
}

.mask {
  width: 960px;
  height: 170px;
}

.slider-2 {
  background-color: #0000;
  width: auto;
  height: auto;
}

.slide-1 {
  aspect-ratio: 16 / 9;
  object-fit: fill;
  width: 310px;
  height: 170px;
  margin-right: 10px;
}

.slide-4-copy {
  aspect-ratio: 16 / 9;
  object-fit: fill;
  width: 300px;
  height: 170px;
}

.slide-5, .slide-6 {
  width: 320px;
  height: 170px;
}

.sliderlinkleft {
  left: -40px;
}

.mask-2 {
  width: 640px;
  height: 170px;
}

.herotitleh1 {
  color: var(--black);
  font-size: 45px;
  font-weight: 400;
  line-height: 1.2em;
}

.body {
  font-family: Montserrat, sans-serif;
}

.text-span-2 {
  background-image: linear-gradient(90deg, var(--black), var(--red--100));
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 85px;
  font-weight: 700;
  line-height: 1.3em;
}

.text-span-3 {
  background-color: #a30000;
  width: 160px;
  height: 6px;
  margin-bottom: 13px;
  margin-left: 24px;
  display: inline-block;
}

.talenthead2text {
  font-family: var(--font-handwrite);
  color: var(--red--200);
  font-size: 72px;
  font-weight: 700;
  line-height: 1.2em;
}

.talentspacediv {
  padding-top: 60px;
  padding-bottom: 60px;
  display: none;
}

.image-11 {
  width: 101%;
  max-width: 101%;
}

.div-block-7 {
  background-color: var(--white);
  width: 100vw;
  display: none;
  overflow: clip;
}

.div-block-8 {
  background-color: var(--white);
  width: 100vw;
  display: block;
  overflow: clip;
}

.image-12 {
  width: 101%;
  max-width: 101%;
  margin-left: -1vw;
}

.insightsectioncontainer {
  max-width: 960px;
  padding-top: 60px;
  padding-bottom: 60px;
}

.insightsectioncontainer.herocontainer {
  z-index: 1;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  display: flex;
  position: relative;
}

.insightsectioncontainer.techtalent {
  width: 100%;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.lottie-animation {
  z-index: -1;
  flex: none;
  width: 160%;
  height: 160%;
  margin-left: -40px;
  display: block;
  position: static;
}

.div-block-9 {
  flex: 1;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.slidericon {
  background-color: #00000080;
  border-radius: 50px;
  width: 50px;
  height: 50px;
  padding-top: 6px;
  padding-left: 5px;
}

.sliderlinkright {
  right: -30px;
}

.div-block-10 {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  overflow: hidden;
}

.handwritespan {
  font-family: var(--font-handwrite);
  color: var(--red--100);
  text-transform: capitalize;
  font-size: 64px;
  font-weight: 400;
}

.handwritespan.handwrite {
  font-family: var(--font-handwrite);
  color: var(--red--100);
  text-transform: capitalize;
  font-size: 56px;
  font-weight: 400;
}

.navlogodiv {
  height: 36px;
  position: relative;
}

.logoblack {
  opacity: 1;
  max-width: none;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.hiddensection {
  display: none;
}

.text-span-4 {
  font-size: 32px;
}

.secondarybutton {
  border: 1px solid var(--black);
  color: var(--black);
  text-align: center;
  background-color: #0000;
  border-radius: 4px;
  padding: 16px 40px;
  font-size: 20px;
  font-weight: 500;
  line-height: 150%;
  transition: border-color .3s, color .3s;
}

.secondarybutton:hover {
  border-color: var(--red--100);
  color: var(--red--100);
}

@media screen and (min-width: 1280px) {
  .container {
    max-width: 1040px;
  }

  .backgroundimage {
    top: 0%;
    bottom: auto;
    right: 0%;
  }

  .headeranimationdiv {
    justify-content: center;
    position: static;
  }

  .container-6 {
    max-width: 1180px;
  }

  .jobheaderfilterdiv {
    width: auto;
  }

  .insightsectioncontainer {
    max-width: 1040px;
  }
}

@media screen and (min-width: 1440px) {
  .backgroundimage {
    left: 0;
  }

  .backgroundlogoimage {
    min-width: 100vw;
    max-width: none;
    position: absolute;
    top: 0;
    left: 500px;
  }

  .herotitleh1 {
    font-size: 52px;
  }

  .text-span-2 {
    font-size: 100px;
  }

  .text-span-3 {
    width: 186px;
    height: 8px;
  }

  .text-span-4 {
    font-size: 36px;
  }
}

@media screen and (max-width: 991px) {
  .container {
    width: 90vw;
    max-width: 90vw;
  }

  .container.techtalent {
    justify-content: center;
    align-items: center;
    max-width: 100vw;
    display: flex;
  }

  .navbar {
    justify-content: flex-start;
    align-items: stretch;
  }

  .navbarcontainer {
    padding-left: 20px;
    padding-right: 20px;
  }

  .brand {
    aspect-ratio: auto;
    object-fit: fill;
    align-self: auto;
  }

  .herobutton {
    font-size: 16px;
  }

  .heroh1text {
    font-family: Montserrat, sans-serif;
    font-size: 70px;
    font-weight: 700;
  }

  .herotext {
    font-size: 35px;
  }

  .herodesctext {
    font-size: 20px;
  }

  .backgroundimage {
    position: absolute;
  }

  .talentsection {
    height: 300vh;
    overflow: visible;
  }

  .headeranimationdiv {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    height: 65%;
    padding-top: 0;
    padding-bottom: 0;
  }

  .spline-scene {
    flex: 0 auto;
    width: 100%;
    height: auto;
    max-height: 50vh;
  }

  .talentstepsdiv {
    grid-column-gap: 25vw;
    grid-row-gap: 25vw;
    flex-flow: row;
    justify-content: flex-start;
    align-items: stretch;
  }

  .talentstepdiv {
    justify-content: flex-start;
    width: 60vw;
    height: 100%;
    padding-top: 0;
  }

  .talentstepdiv.empty {
    display: none;
  }

  .talentstepheader {
    font-size: 40px;
  }

  .talentstepheader.handwrite {
    font-size: 52px;
  }

  .talenttitlediv {
    margin-top: 0;
  }

  .blogitemwrapper.center {
    border-width: 1px 0;
    border-top-style: solid;
    border-top-color: #ececec;
    border-bottom-style: solid;
    border-bottom-color: #ececec;
    padding-left: 0;
    padding-right: 0;
  }

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

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

  .container-6 {
    max-width: 640px;
  }

  .container-6.blogitemcontainer {
    flex-flow: column;
  }

  .dropdowndiv {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .workingsection {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .workingheadergradienttext {
    font-size: 32px;
  }

  .insightcontainer {
    overflow: visible;
  }

  .describingtext {
    font-size: 40px;
    line-height: 64px;
  }

  .describingtext.handwrite {
    font-size: 52px;
  }

  .jobopeningdiv, .openinglistdiv {
    width: 100%;
  }

  .teamclipdiv {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }

  .videodiv {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: wrap;
    justify-content: flex-start;
    align-items: center;
    width: auto;
    max-width: 700px;
  }

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

  .cliplightbox {
    width: 100%;
    height: 100%;
  }

  .lighboxthumbnail {
    width: 100%;
    height: auto;
  }

  .icon-3 {
    color: var(--white);
  }

  .talentdiv {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
    width: 90%;
    padding-top: 90px;
    padding-bottom: 40px;
  }

  .openinglistbuttondiv {
    width: 100%;
  }

  .workingheadertext {
    font-size: 32px;
  }

  .mask {
    width: 100%;
    height: auto;
  }

  .slider-2 {
    width: 100%;
  }

  .slide-1 {
    width: 42vw;
    height: auto;
    margin-right: 2vw;
  }

  .mask-2 {
    width: 88vw;
    height: auto;
  }

  .herotitleh1 {
    font-size: 48px;
  }

  .text-span-2 {
    font-size: 86px;
  }

  .text-span-3 {
    width: 135px;
    margin-bottom: 12px;
  }

  .insightsectioncontainer {
    width: 90vw;
    max-width: 90vw;
  }

  .insightsectioncontainer.techtalent {
    justify-content: center;
    align-items: center;
    max-width: 100vw;
    display: flex;
  }

  .lottie-animation {
    width: 150%;
    height: 150%;
    margin-left: 0;
    top: -53px;
    left: -175px;
  }

  .slidericon {
    background-color: #00000080;
    border-radius: 50px;
  }

  .handwritespan, .handwritespan.handwrite {
    font-size: 52px;
  }

  .text-span-4 {
    font-size: 32px;
    line-height: 1em;
  }

  .secondarybutton {
    font-size: 16px;
  }
}

@media screen and (max-width: 767px) {
  .container {
    width: auto;
    margin-left: 20px;
    margin-right: 20px;
  }

  .container.herocontainer {
    grid-column-gap: 70px;
    grid-row-gap: 70px;
  }

  .container.techtalent {
    width: auto;
    height: 100vh;
    margin-left: 0;
    margin-right: 0;
    padding-left: 20px;
    padding-right: 20px;
  }

  .container.insightcont {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .container.socialcontainer {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .navbarcontainer {
    padding-left: 12px;
    padding-right: 12px;
  }

  .herotextdiv {
    grid-column-gap: 70px;
    grid-row-gap: 70px;
  }

  .herobutton {
    padding: 12px 32px;
    font-size: 16px;
  }

  .heroh1text {
    font-size: 60px;
  }

  .herotext {
    font-size: 32px;
  }

  .herodesctext {
    width: 90%;
    font-size: 18px;
  }

  .menu-button {
    padding: 12px;
  }

  .menu-button.w--open {
    background-color: var(--black);
  }

  .headeranimationdiv {
    flex: 1;
    justify-content: flex-start;
    align-items: center;
    height: 70vh;
  }

  .talentheaderdiv {
    width: 100%;
  }

  .talentheadtext {
    font-size: 44px;
  }

  .spline-scene {
    flex: 1;
    height: 40vh;
  }

  .talentstepsdiv {
    grid-column-gap: 15vw;
    grid-row-gap: 15vw;
    flex: 0 auto;
    height: auto;
    min-height: 30vh;
  }

  .talentstepdiv {
    width: 80vw;
    padding-top: 0;
  }

  .talentstepheader {
    font-size: 32px;
  }

  .talentstepheader.handwrite {
    font-size: 40px;
  }

  .stepdescriptiontexr {
    font-size: 16px;
  }

  .container-6 {
    padding-left: 40px;
    padding-right: 40px;
  }

  .jobheadertext {
    font-size: 44px;
  }

  .dropdowndiv {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .insightheadertext {
    font-size: 32px;
  }

  .insightheadertext.handwrite {
    font-size: 56px;
  }

  .workingsection {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .workingheadergradienttext {
    font-size: 20px;
  }

  .workingheadertextdiv {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  .insightcontainer {
    padding-left: 24px;
    padding-right: 24px;
  }

  .describingtextdiv {
    height: 88px;
  }

  .describingtext {
    font-size: 24px;
    line-height: 44px;
  }

  .describingtext.handwrite {
    font-size: 36px;
  }

  .describingtextframediv {
    height: 88px;
  }

  .socialmediadiv {
    width: 90vw;
    margin-top: 30px;
    padding-bottom: 0;
  }

  .footercontainer {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .jobopeningdiv {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    width: 70vw;
    min-width: 400px;
    max-width: 600px;
  }

  .jobtitletext {
    font-size: 20px;
  }

  .primarybutton.applybutton {
    width: 100%;
  }

  .buttontagdiv {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
  }

  .openinglistdiv {
    padding-right: 0;
  }

  .teamclipdiv {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }

  .videodiv {
    flex-flow: wrap;
    justify-content: space-between;
    align-items: center;
    width: auto;
  }

  .allteamclipdiv {
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 40px;
  }

  .logo {
    width: 300px;
    height: 300px;
    top: -50px;
  }

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

  .insightheaderdiv {
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    display: block;
  }

  .navcareerstext {
    font-size: 14px;
  }

  .talentdiv {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    width: 100%;
    padding-top: 70px;
    padding-bottom: 6vh;
  }

  .logowhite {
    width: auto;
  }

  .workingheadertext {
    font-size: 20px;
  }

  .background {
    max-width: none;
    height: 150%;
  }

  .slider-2 {
    width: 100%;
  }

  .slide-1 {
    width: 44vw;
  }

  .mask-2 {
    width: 100%;
  }

  .herotitleh1 {
    font-size: 36px;
    line-height: 1.2em;
  }

  .text-span-2 {
    font-size: 72px;
    line-height: 1.5em;
  }

  .text-span-3 {
    width: 80px;
    margin-bottom: 9px;
  }

  .talenthead2text {
    font-size: 48px;
  }

  .insightsectioncontainer {
    width: auto;
    margin-left: 20px;
    margin-right: 20px;
  }

  .insightsectioncontainer.techtalent {
    width: auto;
    height: 100vh;
    margin-left: 0;
    margin-right: 0;
    padding-left: 20px;
    padding-right: 20px;
  }

  .handwritespan {
    font-size: 32px;
  }

  .handwritespan.handwrite {
    font-size: 36px;
  }

  .navlogodiv {
    height: 24px;
  }

  .logoblack {
    width: auto;
  }

  .nav-menu {
    background-color: var(--black);
  }

  .text-span-4 {
    font-size: 20px;
    line-height: 1em;
  }

  .secondarybutton {
    padding: 12px 32px;
  }
}

@media screen and (max-width: 479px) {
  .container.herocontainer {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .container.insightcont {
    padding-top: 120px;
  }

  .herotextdiv {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .herobutton {
    width: 100%;
    padding-left: 32px;
    padding-right: 32px;
  }

  .heroh1text {
    font-size: 32px;
  }

  .herotext {
    font-size: 20px;
  }

  .herodesctext {
    font-size: 14px;
  }

  .herobuttondiv {
    flex-flow: column;
    width: 100%;
  }

  .talentheadtext {
    font-size: 32px;
    line-height: 40px;
  }

  .talentstepsdiv {
    min-height: 25vh;
    padding-bottom: 20px;
  }

  .talentstepheader {
    font-size: 28px;
  }

  .talentstepheader.handwrite {
    font-size: 36px;
  }

  .insightsection {
    overflow: hidden;
  }

  .container-6 {
    padding-left: 16px;
    padding-right: 16px;
  }

  .blogtagtext {
    font-size: 14px;
  }

  .jobopeningsection {
    padding-top: 80px;
  }

  .jobheadertext {
    font-size: 40px;
    line-height: 48px;
  }

  .jobheaderdiv {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
    align-items: center;
  }

  .dropdown-toggle {
    margin-right: auto;
  }

  .teamdropdown {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .employmentdropdown {
    width: 100%;
  }

  .dropdowndiv {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    flex-flow: column;
    align-items: flex-start;
    width: 100%;
  }

  .jobheaderfilterdiv {
    width: 100%;
  }

  .insightheadertext {
    font-size: 27px;
  }

  .insightheadertext.handwrite {
    font-size: 48px;
  }

  .insightcontainer {
    overflow: hidden;
  }

  .describingtextdiv {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    height: 132px;
  }

  .describingtext.handwrite {
    font-size: 24px;
  }

  .workingheaderdiv {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    width: 90vw;
  }

  .describingtextframediv {
    height: 132px;
  }

  .footercontainer {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .jobopeningdiv {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .employmenttext, .teamtext {
    font-size: 14px;
  }

  .jobtagdiv {
    flex-flow: wrap;
  }

  .jobtitletext {
    font-size: 18px;
  }

  .primarybutton {
    text-align: center;
    width: 100%;
    display: block;
  }

  .logo {
    width: 260px;
    height: 260px;
  }

  .footerlinktext {
    font-size: 14px;
  }

  .slide-1 {
    width: 100%;
  }

  .sliderlinkleft {
    outline-color: var(--black);
    outline-offset: 0px;
    outline-width: 3px;
    outline-style: none;
    left: -30px;
  }

  .mask-2 {
    width: 100%;
    height: auto;
  }

  .herotitleh1 {
    font-size: 28px;
  }

  .text-span-2 {
    font-size: 50px;
    line-height: 1.6em;
  }

  .text-span-3 {
    width: 68px;
    height: 4px;
    margin-bottom: 9px;
    margin-left: 16px;
  }

  .talenthead2text {
    font-size: 32px;
    line-height: 40px;
  }

  .talentspacediv {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .insightsectioncontainer.herocontainer {
    padding-left: 10px;
    padding-right: 10px;
  }

  .lottie-animation {
    width: 180%;
    height: 180%;
    top: -85px;
    left: -115px;
  }

  .handwritespan.handwrite {
    font-size: 24px;
  }

  .secondarybutton {
    width: 100%;
  }
}


