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

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

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

@font-face {
  font-family: Avertape;
  src: url('../fonts/avertape-black.otf') format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Avertape;
  src: url('../fonts/avertape-regular.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Avertape;
  src: url('../fonts/avertape-light.otf') format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Avertape;
  src: url('../fonts/avertape-semibold.otf') format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: auto;
}

@font-face {
  font-family: Avertape;
  src: url('../fonts/avertape-bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}

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

:root {
  --black: black;
  --yellow: #ffe600;
  --body: #333;
  --indian-red: #f4596a;
  --white: white;
  --br-gold: #ffc301;
  --gainsboro: #e4e4e4;
  --dodger-blue: #009cd8;
  --brand-grey: #353332;
  --wide: 5px;
  --tide: 0px;
}

.w-embed-youtubevideo {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/youtube-placeholder.2b05e7d68d.svg');
  background-position: 50%;
  background-size: cover;
  width: 100%;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.w-embed-youtubevideo:empty {
  min-height: 75px;
  padding-bottom: 56.25%;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

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

img {
  opacity: 1;
  max-width: 100%;
  display: inline-block;
}

.logo-address-footer {
  z-index: 8;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
  position: static;
  inset: 0% auto 0% 0%;
}

.line {
  background-color: var(--black);
  flex: none;
  align-self: center;
  width: 25px;
  height: 2px;
  position: relative;
}

.line-1 {
  background-color: var(--black);
  flex: none;
  align-self: stretch;
  width: 2px;
  height: 25px;
  position: relative;
  left: -14px;
}

.div-block-4 {
  float: right;
  clear: left;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-left: auto;
  margin-right: 75px;
  display: flex;
  position: sticky;
  inset: 77px 0% auto;
}

.scroll-elements {
  height: 100%;
  margin-top: 100px;
}

.div-block-5 {
  background-color: var(--black);
  background-image: url('../images/credit-card-png-1.png');
  background-position: 50%;
  background-size: 400px;
  border-radius: 12px;
  width: 360px;
  height: 230px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
  overflow: hidden;
  transform: perspective(25px);
  box-shadow: 0 49px 50px -20px #00000026;
}

.section {
  height: 100%;
  margin-bottom: 250px;
}

.div-block-7 {
  flex-direction: column;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.div-block-8 {
  background-color: var(--black);
  border-radius: 20px;
  width: 5px;
  height: 5px;
}

.div-block-9 {
  z-index: 1;
  background-color: var(--black);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 5px;
  height: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  position: relative;
}

.div-block-10 {
  background-color: var(--black);
  border-radius: 20px;
  width: 5px;
  height: 5px;
}

.div-block-11 {
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.div-block-14, .div-block-15 {
  border: 1px solid #000;
  justify-content: center;
  align-items: center;
  width: 400px;
  height: 250px;
  margin-top: 100px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.div-block-16 {
  flex-direction: column;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
}

.div-block-17 {
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 30px;
  height: 5px;
  display: flex;
}

.div-block-18 {
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 5px;
  margin-top: 2px;
  margin-bottom: 2px;
  display: flex;
}

.div-block-19 {
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 5px;
  display: flex;
}

.div-block-20 {
  background-color: var(--black);
  border-radius: 20px;
  width: 25px;
  height: 1px;
}

.div-block-21 {
  background-color: var(--black);
  border-radius: 20px;
  width: 5px;
  height: 5px;
  position: relative;
  left: -10px;
}

.div-block-22 {
  background-color: var(--black);
  border-radius: 20px;
  width: 25px;
  height: 1px;
}

.div-block-23 {
  background-color: var(--black);
  border-radius: 20px;
  width: 5px;
  height: 5px;
  position: relative;
  left: -20px;
}

.div-block-24 {
  background-color: var(--black);
  border-radius: 20px;
  width: 25px;
  height: 1px;
}

.div-block-25 {
  background-color: var(--black);
  border-radius: 20px;
  width: 5px;
  height: 5px;
  position: relative;
  left: -10px;
}

.div-block-26 {
  flex-flow: column;
  place-content: space-around center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
  position: relative;
  left: 2px;
}

.div-block-27 {
  float: none;
  clear: left;
  background-image: url('../images/chris-karidis-KLd5RCh8Uak-unsplash-1.jpg');
  background-position: 50%;
  background-size: cover;
  width: 100%;
  height: 100%;
}

.header-image-scale {
  width: 100%;
  height: 650px;
  margin-top: 100px;
  overflow: hidden;
}

.body-2 {
  height: 100vh;
}

.section-4 {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
}

.background-video-2 {
  float: none;
  width: 100vw;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.background-video-3, .background-video-4 {
  width: 100vw;
  height: 100vh;
  display: none;
}

.button {
  background-color: #dd1414;
  width: 50px;
  height: 50px;
  margin-bottom: 50px;
  margin-right: 50px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.link-block-6 {
  width: 100%;
  height: 100%;
}

.section-5 {
  height: 500px;
}

.section-6 {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  margin-top: 50px;
  margin-bottom: 50px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section-6.temp {
  display: none;
}

.new-test-shine {
  z-index: 11;
  opacity: .5;
  filter: blur(50px);
  background-image: radial-gradient(circle closest-corner, #fff, #fff0);
  border-radius: 500px;
  width: 200px;
  height: 200px;
  margin-top: 50px;
  display: flex;
  position: absolute;
  inset: 0% auto auto;
  transform: perspective(25px);
}

.s-case-video-slider {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 250px;
  display: block;
  overflow: visible;
}

.slide-nav {
  display: none;
}

.slider {
  height: 80vh;
}

.icon {
  background-image: url('../images/next.svg');
  background-position: 50%;
  background-repeat: repeat-y;
  background-size: 75px;
  background-attachment: fixed;
  display: none;
}

.image-5 {
  filter: none;
  width: 25px;
  margin-left: auto;
  margin-right: auto;
  transform: rotate(0);
}

.image-5.images {
  filter: invert();
}

.right-arrow {
  justify-content: center;
  align-items: center;
  display: flex;
}

.icon-2 {
  display: none;
}

.image-51 {
  filter: none;
  width: 25px;
  margin-left: auto;
  margin-right: auto;
  transform: rotate(-180deg);
}

.image-51.images {
  filter: invert();
}

.left-arrow {
  justify-content: center;
  align-items: center;
  display: flex;
}

.slide, .slide-2, .slide-3 {
  overflow: hidden;
}

.slide-4 {
  position: relative;
  overflow: hidden;
}

.slide-5 {
  overflow: hidden;
}

.slide-6 {
  background-image: none;
  background-position: 0 0;
  background-size: auto;
  overflow: hidden;
}

.grid-2 {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.slider-videos {
  background-color: #0000;
  height: 900px;
  min-height: 150px;
  max-height: 900px;
  padding-left: 75px;
  padding-right: 75px;
  overflow: hidden;
}

.grid-3 {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}

.background-video-6, .background-video-7, .background-video-8, .background-video-9, .background-video-10, .background-video-11 {
  width: 100%;
  height: 100%;
  position: static;
  overflow: visible;
  transform: scale(.7);
}

.slide-photo {
  background-image: url('../images/Cocktail-12x.jpg.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-2-photo {
  background-image: url('../images/Cocktail-22x.jpg.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-3-photo {
  background-image: url('../images/Cocktail-32x.jpg.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-4-photo {
  background-image: url('../images/Cocktail-42x.jpg.jpg');
  background-position: 50%;
  background-size: cover;
  position: relative;
  overflow: hidden;
}

.slide-6-photo {
  background-image: url('../images/Cocktail-52x.jpg');
  background-position: 50%;
  background-size: cover;
  overflow: hidden;
}

.slide-5-photo {
  background-image: url('../images/Cocktail-62x.jpg.jpg');
  background-position: 50%;
  background-size: cover;
}

.body-3 {
  background-color: #e4e4e4c2;
  background-image: url('../images/Texture-Inverted-22x.png');
  background-position: 50%;
  background-size: cover;
}

.left-arrow---video {
  justify-content: center;
  align-items: center;
  display: flex;
  left: 75px;
}

.right-arrow---video {
  justify-content: center;
  align-items: center;
  display: flex;
  right: 100px;
}

.home-header {
  z-index: 5;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  height: 100vh;
  padding-top: 125px;
  padding-left: 100px;
  padding-right: 100px;
  display: none;
  position: relative;
}

.nav-main-contents {
  z-index: 50;
  flex: none;
  justify-content: space-between;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 100px;
  padding-left: 100px;
  padding-right: 100px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
  overflow: visible;
}

.nav-sections {
  grid-column-gap: 15px;
  justify-content: flex-end;
  align-self: flex-end;
  align-items: flex-end;
  display: flex;
  position: relative;
}

.nav-section-link {
  color: #333;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  margin-bottom: -10px;
  padding: 15px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
  text-decoration: none;
  transition: all .5s cubic-bezier(.19, 1, .22, 1);
  display: flex;
  position: relative;
}

.nav-section-link:hover {
  margin-bottom: -5px;
}

.nav-section-link.w--current:visited {
  background-color: var(--yellow);
}

.nav-work-text {
  z-index: 5;
}

.nav-work-text.work {
  font-weight: 700;
}

.link-block-12 {
  color: #333;
  justify-content: center;
  align-self: flex-end;
  align-items: center;
  min-width: 100px;
  margin-bottom: -15px;
  margin-right: -15px;
  padding: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
  text-decoration: none;
  transition: all .5s ease-in-out;
  display: flex;
}

.link-block-12:hover {
  font-weight: 600;
}

.link-block-12:visited {
  font-weight: 700;
}

.link-block-13 {
  color: #333;
  flex: none;
  order: 1;
  justify-content: flex-end;
  align-items: center;
  min-width: 110px;
  margin-bottom: -15px;
  margin-right: -15px;
  padding: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
  text-decoration: none;
  transition: all .5s ease-in-out;
  display: block;
  position: relative;
}

.link-block-13:hover, .link-block-13:visited, .link-block-13.w--current:visited {
  font-weight: 600;
}

.header-content {
  z-index: 5;
  background-color: #0000;
  flex-direction: row;
  flex: none;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding-top: 150px;
  padding-left: 100px;
  display: block;
  position: relative;
  overflow: visible;
}

.header-content.contacts {
  float: left;
  cursor: auto;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 50px;
  padding-left: 0;
  display: flex;
  overflow: visible;
}

.header-content.about {
  padding-top: 84px;
  padding-left: 0;
}

.header-content.home {
  height: 650px;
  padding-top: 75px;
  overflow: hidden;
}

.pattern {
  z-index: 4;
  background-color: var(--yellow);
  flex-direction: column;
  flex: none;
  justify-content: center;
  align-self: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 790px;
  margin-top: -100px;
  margin-left: -100px;
  display: flex;
  position: absolute;
  overflow: hidden;
}

.background-video-15 {
  z-index: 4;
  flex-flow: row;
  flex: none;
  justify-content: center;
  align-self: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}

.selected-work {
  filter: none;
  background-color: #0000;
  width: 100%;
  margin-top: 200px;
  padding-left: 165px;
  padding-right: 165px;
  display: none;
  position: relative;
}

.div-block-46 {
  border: 1px solid var(--body);
  background-color: var(--black);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.div-block-47 {
  border: 1px solid var(--body);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
  margin-top: -2px;
  transform: rotate(90deg);
}

.case-title {
  opacity: 1;
  color: var(--black);
  width: 100%;
  margin-bottom: 10px;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 50px;
  overflow: visible;
}

.case-owner {
  opacity: 1;
  color: var(--black);
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 24px;
}

.solutions {
  height: 500px;
  margin-top: 250px;
  padding-left: 100px;
  padding-right: 100px;
  position: relative;
}

.row-1 {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template: "Area . Area-2" 80vh
  / 2fr .5fr 3fr;
  grid-auto-flow: row dense;
  place-items: stretch stretch;
  max-width: 100%;
  max-height: 900px;
  margin-top: 100px;
  position: relative;
  overflow: visible;
}

.div-block-52 {
  float: left;
  width: 400px;
  padding-left: 100px;
}

.brand-strategy {
  float: none;
  width: 490px;
  position: relative;
  overflow: hidden;
}

.text-block-13 {
  margin-top: -15px;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 74px;
  text-decoration: none;
}

.text-block-14 {
  flex: none;
  order: -1;
  align-self: flex-end;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
}

.title-more {
  flex-flow: wrap;
  place-content: center space-between;
  align-items: center;
  width: 490px;
  height: 25px;
  display: flex;
}

.more-y-strategy {
  z-index: 5;
  float: right;
  clear: none;
  border: 1px #000;
  border-radius: 20px;
  flex-flow: wrap;
  flex: none;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
  position: relative;
}

.div-block-46-copy {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.div-block-47-copy {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
  margin-top: -2px;
  transform: none;
}

.text-block-15 {
  opacity: 1;
  width: 490px;
  margin-top: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
}

.solutions-right {
  z-index: 6;
  float: left;
  text-align: left;
  padding-left: 175px;
  position: relative;
}

.brand-growth, .design-consultancy {
  float: none;
  width: 490px;
  margin-top: 50px;
  position: relative;
  overflow: hidden;
}

.clients-logos {
  grid-column-gap: 0px;
  grid-row-gap: 15px;
  opacity: 1;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-flow: row;
  place-content: center;
  place-items: stretch stretch;
  position: relative;
}

.clients {
  z-index: 1;
  margin-top: 75px;
  margin-bottom: 75px;
  padding: 75px 100px;
  display: block;
  position: relative;
}

.nav-logo {
  flex-flow: column;
  flex: none;
  place-content: stretch flex-end;
  align-self: flex-end;
  align-items: baseline;
  width: 150px;
  height: 100%;
  margin-bottom: 5px;
  display: flex;
  position: relative;
}

.nav-logo.w--current {
  flex-direction: row;
  flex: none;
  justify-content: flex-start;
  align-self: flex-end;
  align-items: flex-end;
  width: 150px;
  height: 125px;
  display: flex;
  position: relative;
}

.visited-indicator {
  border: 1px none var(--yellow);
  background-color: var(--yellow);
  border-radius: 500px;
  flex: none;
  align-self: flex-end;
  width: 8px;
  height: 8px;
  display: block;
  position: relative;
  top: -25px;
  left: -35px;
}

.visited-indicator.work {
  background-color: var(--indian-red);
}

.nav-about-text {
  z-index: 5;
  text-align: right;
  flex: none;
  align-self: flex-end;
  margin-bottom: 5px;
  font-family: Avertape, sans-serif;
  position: relative;
}

.div-block-54 {
  border: 1px none var(--yellow);
  background-color: var(--yellow);
  border-radius: 500px;
  flex: none;
  align-self: flex-end;
  width: 8px;
  height: 8px;
  display: block;
  position: relative;
  top: -25px;
  left: -40px;
}

.nav-contacts {
  z-index: 5;
  text-align: right;
  flex: none;
  align-self: flex-end;
  margin-bottom: 5px;
  font-family: Avertape, sans-serif;
  position: relative;
}

.nav-contacts.contacts {
  font-weight: 700;
}

.div-block-55 {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 500px;
  flex: none;
  order: 0;
  align-self: flex-end;
  width: 8px;
  height: 8px;
  display: block;
  position: relative;
  top: -25px;
  left: -85px;
}

.div-block-55.contacts {
  background-color: var(--indian-red);
  border-style: none;
}

.footer {
  z-index: 2;
  background-color: #0000;
  flex-flow: row;
  place-content: space-around flex-start;
  align-items: center;
  width: 100%;
  height: 150px;
  display: flex;
  position: relative;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: visible;
}

.footer-section-wrapp {
  z-index: 8;
  grid-column-gap: 25px;
  flex-direction: row;
  place-content: flex-end;
  align-items: flex-end;
  margin-bottom: -10px;
  display: block;
  position: relative;
}

.footer-section-wrapp.left {
  justify-content: flex-start;
  margin-left: -15px;
}

.footer-address {
  color: var(--white);
  text-align: center;
  flex: none;
  align-self: flex-end;
  align-items: center;
  margin-bottom: -10px;
  margin-left: 100px;
  padding: 10px 5px;
  font-family: Avertape, sans-serif;
  font-weight: 400;
  line-height: 25px;
  text-decoration: none;
  transition: all .5s ease-in-out;
  display: flex;
}

.footer-address:hover {
  text-decoration: underline;
}

.text-block-124 {
  filter: invert();
  text-align: center;
  margin-bottom: -2px;
  font-family: Avertape, sans-serif;
  font-size: 14px;
  line-height: 20px;
  transition: all .75s cubic-bezier(.25, .46, .45, .94);
  position: relative;
}

.text-block-124:hover {
  direction: ltr;
  white-space: nowrap;
  text-decoration: none;
}

.footer-contents {
  z-index: 6;
  flex-flow: row;
  flex: none;
  place-content: space-between;
  align-self: flex-end;
  align-items: flex-end;
  width: 100%;
  padding: 25px 100px;
  display: flex;
}

.footer-logo {
  filter: invert();
  flex: none;
  align-self: flex-end;
}

.footer-logo.w--current {
  filter: invert();
  cursor: none;
  margin-left: -5px;
  padding: 5px;
  display: flex;
}

.link-block-17 {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
}

.footer-social-link {
  color: var(--body);
  justify-content: center;
  align-items: center;
  margin-left: 5px;
  padding: 10px;
  font-family: Avertape, sans-serif;
  text-decoration: none;
  transition: all .5s;
  display: flex;
  position: relative;
}

.footer-social-link:hover {
  text-decoration: underline;
}

.link-block-19 {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-left: 40px;
  display: flex;
}

.link-block-20 {
  flex: none;
  justify-content: center;
  align-self: flex-end;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-left: 40px;
  display: flex;
}

.div-block-57 {
  z-index: 5;
  flex-direction: column;
  flex: none;
  order: 0;
  justify-content: space-between;
  align-self: flex-start;
  align-items: stretch;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.div-block-50-copy {
  flex-flow: row;
  flex: none;
  place-content: center space-around;
  align-self: flex-end;
  align-items: center;
  display: flex;
}

.social-icon {
  display: none;
}

.nav-bg {
  box-shadow: none;
  opacity: 1;
  background-color: #0000;
  align-self: center;
  width: 100%;
  height: 100px;
  position: absolute;
  inset: 0% 0% auto;
}

.footer-bg {
  z-index: 2;
  background-color: #0000;
  display: block;
  position: absolute;
  inset: 0%;
}

.clicks-underline {
  background-color: #0000;
  width: 380px;
  height: 10px;
  position: relative;
  top: 315px;
  left: 455px;
}

.about-header {
  z-index: 5;
  min-height: 100vh;
  padding: 125px 160px 75px;
  position: relative;
}

.about-header.contacts {
  min-height: auto;
  padding-left: 100px;
  padding-right: 100px;
}

.about-header-description {
  float: left;
  color: var(--body);
  width: 400px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
  position: relative;
}

.capabilities {
  margin-top: 200px;
  padding-left: 165px;
  padding-right: 165px;
  display: none;
}

.section-title-big {
  background-color: var(--yellow);
  align-items: flex-start;
  height: 790px;
  padding-top: 200px;
  padding-left: 100px;
  display: flex;
  overflow: hidden;
}

.text-block-125 {
  color: var(--black);
  font-family: Avertape, sans-serif;
  font-size: 130px;
  font-weight: 700;
  line-height: 168px;
}

.capabiliti-title-and-text {
  float: left;
  margin-top: 250px;
  padding-left: 100px;
}

.text-block-126 {
  float: left;
  clear: none;
  color: var(--black);
  width: 300px;
  margin-right: 125px;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 74px;
}

.text-block-127 {
  float: left;
  margin-top: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
}

.div-block-64 {
  float: left;
  clear: none;
  width: 490px;
  margin-top: 20px;
}

.text-block-128 {
  float: left;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
}

.skills {
  justify-content: center;
  align-items: center;
  padding: 150px 100px;
  display: block;
  position: relative;
  overflow: hidden;
}

.team {
  text-align: left;
  flex-direction: column;
  margin-top: 75px;
  margin-bottom: 75px;
  padding: 85px 165px 125px;
  display: flex;
  position: relative;
}

.about-title {
  color: var(--black);
  max-width: 480px;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
}

.about-body-text {
  max-width: 480px;
  margin-top: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 24px;
}

.team-left {
  margin-bottom: 80px;
  padding-left: 100px;
  position: relative;
}

.yellow-dash-header {
  z-index: 3;
  background-color: var(--yellow);
  width: 90px;
  height: 10px;
  position: relative;
}

.yellow-dash-header.contacts {
  flex: none;
}

.bold-text-3, .bold-text-4, .bold-text-5, .bold-text-6 {
  color: var(--black);
}

.skills-wrapp {
  z-index: 1;
  background-color: var(--yellow);
  height: 70vh;
  display: block;
  position: relative;
}

.cursor-magic-vp-top {
  cursor: none;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0% 0% auto;
}

.yellow-dash---team {
  z-index: 3;
  background-color: var(--yellow);
  width: 90px;
  height: 10px;
  margin-bottom: 84px;
  margin-left: -100px;
  position: relative;
}

.mail-us {
  z-index: 6;
  background-color: var(--yellow);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 75px;
  height: 75px;
  margin-bottom: 50px;
  margin-right: 100px;
  display: flex;
  position: fixed;
  inset: auto 0% 0% auto;
}

.mail-us-icon {
  z-index: 2;
  cursor: none;
  width: 15px;
  display: block;
  position: relative;
}

.mail-us-link-second {
  z-index: 10;
  background-color: var(--yellow);
  cursor: none;
  flex: none;
  order: 1;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  display: flex;
  position: absolute;
  inset: 0%;
}

.burger-link {
  display: none;
}

.mobile-nav-bg {
  z-index: 26;
  display: none;
  position: fixed;
  top: -100%;
}

.hor-dash {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.vert-dash {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
  margin-top: -2px;
  transform: none;
}

.more-about, .more-work, .more-contacts {
  z-index: 5;
  float: right;
  clear: none;
  border: 1px #000;
  border-radius: 20px;
  flex-flow: wrap;
  flex: none;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
  position: relative;
}

.more-rotatted {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.more-more-rotated {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
  margin-top: -2px;
  transform: none;
}

.row-2 {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template: "Area . Area-2" 80vh
  / 3fr .5fr 2fr;
  max-width: 100%;
  max-height: 900px;
  margin-top: 100px;
  overflow: visible;
}

.case-wrapp {
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.case-link-wrapp {
  color: var(--black);
  flex-flow: column;
  place-content: center space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.case-contens-wrapp {
  flex-direction: column;
  flex: none;
  order: 0;
  justify-content: center;
  align-self: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.case-cta-more {
  z-index: 1;
  flex-flow: row;
  flex: none;
  place-content: center space-around;
  align-self: flex-end;
  align-items: center;
  display: flex;
  position: relative;
}

.case-text-wrapp {
  z-index: 1;
  clear: none;
  opacity: 1;
  flex: 0 auto;
  order: 0;
  align-self: auto;
  width: 85%;
  margin-bottom: 50px;
  margin-left: 50px;
  display: block;
  position: relative;
}

.case-hover-overlay {
  filter: none;
  background-color: #00000026;
  background-image: linear-gradient(#ffffff4d, #ffffff4d);
  flex-flow: column;
  flex: none;
  order: 0;
  justify-content: space-between;
  align-self: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  inset: 0%;
}

.more-b-3 {
  z-index: 5;
  float: right;
  clear: none;
  flex-flow: wrap;
  flex: none;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-top: 50px;
  margin-right: 50px;
  display: flex;
  position: relative;
}

.case-3-cta-text {
  order: -1;
  align-self: flex-end;
  margin-top: 25px;
  margin-right: 25px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: relative;
}

.about-header-text {
  float: none;
  margin-left: 100px;
  padding-top: 80px;
  display: flex;
  position: relative;
}

.about-big-title {
  z-index: 10;
  color: var(--black);
  width: 400px;
  margin-top: 0;
  margin-right: 80px;
  font-family: Avertape, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 52px;
  position: relative;
}

.case-new {
  background-color: var(--yellow);
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  display: block;
}

.case-new-link {
  color: var(--black);
  cursor: none;
  flex-flow: column;
  place-content: center space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.cta-new-case {
  order: -1;
  align-self: flex-end;
  margin-top: 25px;
  margin-right: 25px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
}

.more-b-new {
  z-index: 5;
  float: right;
  clear: none;
  flex-flow: wrap;
  flex: none;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-top: 50px;
  margin-right: 50px;
  display: flex;
  position: relative;
}

.div-block-46-copy {
  background-color: var(--yellow);
  border: 1px solid #000;
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.case-new-text {
  clear: none;
  opacity: 1;
  flex: 0 auto;
  order: 0;
  align-self: auto;
  width: 85%;
  margin-bottom: 50px;
  margin-left: 50px;
  display: block;
  position: relative;
}

.case-thumb-bg-video {
  filter: brightness(120%);
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.div-block-78 {
  background-color: var(--black);
  border-radius: 500px;
  flex: none;
  width: 25px;
  height: 2px;
  position: relative;
}

.div-block-79 {
  background-color: var(--black);
  border-radius: 500px;
  flex: none;
  width: 25px;
  height: 2px;
  position: relative;
  top: -2px;
  transform: rotate(90deg);
}

.arrow-to-plus {
  flex-direction: column;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
  position: relative;
}

.next-project-beta {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 790px;
  display: flex;
}

.mid-sized-title-b {
  opacity: 1;
  color: var(--black);
  flex: none;
  width: 250px;
  height: 60px;
  margin-bottom: 10px;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 50px;
  overflow: visible;
}

.mid-sized-title-y {
  opacity: 1;
  color: var(--black);
  flex: none;
  width: 250px;
  margin-bottom: 10px;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 50px;
  overflow: visible;
}

.black {
  z-index: 1;
  flex-direction: column;
  flex: none;
  justify-content: center;
  align-items: flex-start;
  width: 250px;
  height: 60px;
  display: flex;
  position: relative;
  top: -92%;
}

.text-block-139 {
  color: var(--yellow);
  background-color: #0000;
  align-self: flex-end;
  width: 250px;
  display: block;
}

.yellow {
  z-index: 2;
  flex-direction: column;
  flex: none;
  justify-content: center;
  align-self: flex-start;
  align-items: flex-start;
  width: 240px;
  height: 60px;
  display: block;
  position: relative;
  overflow: hidden;
}

.next-project-text {
  flex-direction: column;
  flex: none;
  justify-content: flex-start;
  align-items: baseline;
  width: 250px;
  height: 60px;
  display: flex;
  position: relative;
}

.next-project-button-hover {
  justify-content: flex-start;
  align-items: center;
  width: 310px;
  height: 60px;
  display: flex;
  overflow: visible;
}

.yellow-magic {
  z-index: 3;
  flex-direction: column;
  flex: none;
  justify-content: center;
  align-self: flex-end;
  align-items: baseline;
  width: 250px;
  height: 60px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
  overflow: hidden;
}

.next-project-link {
  z-index: 6;
  cursor: none;
  justify-content: center;
  align-items: center;
  width: 350px;
  height: 150px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.case-image-4 {
  z-index: 4;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: block;
  position: absolute;
}

.scroll-slider-image-2 {
  z-index: 3;
  flex: none;
  width: 100%;
  height: 100vh;
  position: absolute;
}

.scroll-slider-image-3 {
  z-index: 2;
  flex: none;
  width: 100%;
  height: 100vh;
  position: absolute;
}

.image-62 {
  width: 100%;
  position: relative;
}

.scroll-slider-section {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 350vh;
  margin-top: 50px;
  margin-bottom: 200px;
  display: flex;
  position: relative;
  top: 50px;
  overflow: visible;
}

.scroll-slider-section.beam {
  height: 2400px;
  margin-bottom: 350px;
}

.scroll-slider-area {
  flex-flow: row;
  flex: none;
  place-content: flex-start;
  align-self: auto;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
}

.div-block-83 {
  height: 150px;
  display: none;
}

.project-details-cta {
  z-index: 10;
  background-color: #0000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 75px;
  height: 75px;
  margin-bottom: 50px;
  margin-right: 100px;
  display: flex;
  position: fixed;
  inset: auto 0% 0% auto;
}

.info-icon {
  width: 20px;
}

.project-datails-link {
  z-index: 6;
  background-color: var(--yellow);
  flex: none;
  order: 1;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.project-details-text {
  z-index: 2;
  opacity: 1;
  text-align: left;
  white-space: nowrap;
  flex: none;
  order: -1;
  align-self: center;
  font-family: Avertape, sans-serif;
  line-height: 18px;
  position: absolute;
  top: -25px;
}

.case-details-wrapper {
  z-index: 50;
  opacity: 1;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #ffffffbf;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 100vh;
  padding-left: 100px;
  padding-right: 100px;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: scroll;
}

.case-details-title {
  color: var(--body);
  min-width: 320px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 44px;
  position: relative;
}

.case-details-body {
  color: var(--body);
  max-width: 640px;
  margin-bottom: 50px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 25px;
  position: relative;
}

.case-details-text-grid {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  flex-direction: column;
  grid-template-rows: auto;
  grid-template-columns: min-content 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  place-content: start;
  place-items: stretch start;
  margin-top: 225px;
  margin-bottom: 50px;
  padding-top: 90px;
  padding-left: 90px;
  display: grid;
  position: relative;
}

.case-details-close {
  background-color: var(--white);
  justify-content: center;
  align-items: center;
  width: 75px;
  height: 75px;
  margin-bottom: 50px;
  margin-right: 85px;
  display: none;
  position: fixed;
  inset: auto 0% 0% auto;
}

.mobile-nav-ig-link {
  width: 50px;
  height: 50px;
}

.contacts-big-title {
  float: none;
  clear: none;
  color: var(--black);
  max-width: 460px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 52px;
  position: relative;
}

.contacts-body-text {
  color: var(--body);
  margin-bottom: 75px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
}

.details-links {
  flex-direction: column;
  align-items: flex-start;
  display: block;
  position: relative;
}

.mail-text-link {
  color: var(--body);
  font-family: Avertape, sans-serif;
  text-decoration: underline;
}

.image-64, .image-65 {
  width: 100%;
  height: 100%;
}

.image-66 {
  width: 100%;
}

.image-68, .image-69 {
  width: 100%;
  position: relative;
}

.plus-dash {
  border: 1px solid var(--yellow);
  background-color: var(--yellow);
  border-radius: 20px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
}

.video-embed-full {
  width: 100%;
  height: 100%;
}

.video-embed-full.consultations {
  justify-content: flex-end;
  align-self: center;
  width: auto;
  display: flex;
  position: absolute;
  inset: 0%;
  transform: none;
}

.video-embed-full.consultations.mobile {
  display: none;
}

.image-74, .image-75, .image-76, .image-84, .image-85 {
  width: 100%;
}

.next-project-aplha {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 790px;
  display: flex;
}

.next-project-link-new {
  z-index: 6;
  cursor: none;
  justify-content: center;
  align-items: center;
  width: 350px;
  height: 150px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.next-project-button-group {
  justify-content: flex-start;
  align-items: center;
  width: 310px;
  height: 60px;
  display: flex;
  overflow: visible;
}

.html-embed-4 {
  flex: none;
  width: 100%;
}

.section-8 {
  background-color: var(--black);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
}

.lottie-animation {
  flex: none;
  transform: scale(.5);
}

.section-9 {
  justify-content: center;
  align-items: center;
  height: 100vh;
  display: flex;
}

.image-87, .image-88, .image-89, .image-90, .image-91 {
  width: 100%;
}

.lottie-animation-2 {
  transform: scale(.7);
}

.div-block-88 {
  border: .5px solid #000;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 450px;
  height: 250px;
  display: flex;
}

.loading-bg {
  z-index: 50;
  background-color: var(--white);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
}

.page-load-lottie {
  margin-top: -5%;
  transform: scale(.5);
}

.nav-logo-lottie {
  flex: 0 auto;
  order: -1;
  align-self: flex-end;
  position: relative;
  inset: auto auto -9% -20%;
  transform: scale(.6);
}

.contact-form-contents {
  align-items: flex-end;
  width: 290px;
  height: 50px;
  margin-top: -450px;
  display: flex;
}

.form-line {
  z-index: 7;
  background-color: var(--black);
  flex: none;
  align-self: flex-end;
  width: 290px;
  height: 1px;
  position: relative;
  left: -30px;
}

.steps-1 {
  z-index: 4;
  color: #0000001a;
  flex: none;
  width: 30px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 16px;
  position: relative;
  bottom: 17px;
}

.form-step-1-title {
  z-index: 2;
  flex: none;
  align-self: flex-end;
  width: 150px;
  margin-bottom: 0;
  margin-left: 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  position: absolute;
  bottom: 16px;
}

.form-step-1-field {
  z-index: 3;
  opacity: 1;
  background-color: #ffe6001a;
  border: 1px #000;
  flex: none;
  width: 290px;
  height: 50px;
  margin-bottom: 0;
  padding: 0 0 2px 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  position: absolute;
}

.form-name {
  z-index: 3;
  align-items: center;
  width: 290px;
  height: 50px;
  margin-bottom: 100px;
  display: flex;
  position: relative;
}

.form-mail {
  z-index: 2;
  align-items: center;
  width: 290px;
  height: 50px;
  margin-top: -50px;
  margin-bottom: 100px;
  display: flex;
  position: relative;
}

.form-phone {
  z-index: 1;
  justify-content: flex-start;
  align-items: center;
  width: 290px;
  height: 50px;
  margin-top: -50px;
  display: flex;
  position: relative;
}

.submit-button {
  z-index: 1;
  background-color: #0000;
  border: 1px solid #000;
  width: 50px;
  height: 50px;
  margin-top: 100px;
  margin-bottom: -50px;
  padding: 0;
  position: relative;
}

.form-step-2-title {
  z-index: 4;
  flex: none;
  width: 150px;
  margin-bottom: 0;
  margin-left: 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  position: absolute;
}

.form-step-3-title {
  z-index: 1;
  flex: none;
  width: 150px;
  margin-bottom: 0;
  margin-left: 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  display: none;
  position: absolute;
}

.form-step-2-field {
  z-index: 3;
  opacity: 1;
  background-color: #ffe6001a;
  border: 1px #000;
  flex: none;
  width: 290px;
  height: 50px;
  margin-bottom: 0;
  padding: 0 0 2px 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  position: absolute;
}

.form-step-3-field {
  z-index: 3;
  opacity: 1;
  color: var(--black);
  background-color: #ffe6001a;
  border: 1px #000;
  flex: none;
  width: 290px;
  height: 50px;
  margin-bottom: 0;
  padding: 0 0 2px 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  position: absolute;
}

.form {
  flex-direction: column;
  align-items: flex-end;
  display: flex;
  position: relative;
}

.contact-form {
  flex: none;
  align-self: flex-end;
  position: absolute;
}

.big-big-title-home {
  z-index: 10;
  float: left;
  clear: none;
  color: var(--black);
  white-space: nowrap;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 135px;
  font-weight: 700;
  line-height: 167px;
  display: block;
  position: relative;
}

.home-header-main-serv {
  z-index: 10;
  float: left;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 70px;
  margin-bottom: 50px;
  margin-left: 200px;
  display: flex;
  position: absolute;
  inset: auto auto 0% 0%;
}

.main-services-title {
  z-index: 2;
  float: none;
  clear: none;
  color: var(--body);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  position: relative;
  inset: auto auto 0% 0%;
}

.service-1 {
  font-family: Avertape, sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 34px;
  position: relative;
  inset: 0%;
}

.services-list {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.service-2, .service-3 {
  opacity: 0;
  font-family: Avertape, sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 34px;
  position: absolute;
  inset: 0%;
}

.big-title-hover {
  position: relative;
}

.scroll-down-lottie {
  z-index: 10;
  position: absolute;
  inset: 0%;
}

.mail-us-content {
  z-index: 1;
  width: 100%;
  height: 100%;
  position: relative;
}

.progress-bar {
  z-index: 50;
  background-color: var(--yellow);
  width: 5px;
  height: 0;
  position: fixed;
  inset: 0% auto auto 0%;
}

.scroll-down-wrapp {
  z-index: 2;
  justify-content: center;
  position: absolute;
  inset: 0%;
}

.organic-ui-contents {
  background-color: #dcdcdc;
  width: 100%;
  height: 100vh;
  position: relative;
}

.organic-burger {
  flex-wrap: nowrap;
  place-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-top: 35px;
  margin-right: 35px;
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
}

.organic-burger-top {
  z-index: 5;
  filter: blur(1px);
  background-color: #dcdcdc;
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.organic-burger-light {
  z-index: 4;
  box-shadow: -7px -7px 20px 0 var(--white);
  filter: blur(1px);
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
}

.organic-burger-dark {
  z-index: 3;
  filter: blur(1px);
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
  box-shadow: 7px 7px 20px #00000040;
}

.burger-icon {
  z-index: 6;
  flex: none;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 20px;
  height: 17px;
  display: flex;
  position: relative;
  inset: 0%;
}

.burger-top-line {
  background-color: #dcdcdc;
  border-radius: 500px;
  flex: none;
  align-self: flex-start;
  width: 20px;
  height: 2px;
  position: absolute;
  box-shadow: inset 1px 1px 1px #00000040;
}

.burger-mid-line {
  background-color: #dcdcdc;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 20px;
  height: 2px;
  position: absolute;
  box-shadow: inset 1px 1px 1px #00000040;
}

.burger-bot-line {
  background-color: #dcdcdc;
  border-radius: 500px;
  flex: none;
  align-self: flex-end;
  width: 20px;
  height: 2px;
  position: absolute;
  bottom: 1px;
  box-shadow: inset 1px 1px 1px #00000040;
}

.organic-proceed {
  justify-content: center;
  align-items: center;
  width: 220px;
  height: 50px;
  margin-bottom: 150px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
}

.organic-proceed-top {
  z-index: 5;
  filter: blur(1px);
  background-color: #dcdcdc;
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
}

.organic-proceed-light {
  z-index: 4;
  box-shadow: -7px -7px 20px 0 var(--white);
  filter: blur(1px);
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
}

.organic-proceed-dark {
  z-index: 3;
  filter: blur(1px);
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
  box-shadow: 7px 7px 20px #00000040;
}

.organic-button-cta {
  z-index: 6;
  display: block;
  position: absolute;
}

.organic-burger-inner-dark, .organic-burger-inner-light {
  z-index: 5;
  filter: blur(1px);
  background-color: #dcdcdc;
  border-radius: 500px;
  width: 100%;
  height: 100%;
  position: absolute;
}

.close-icon {
  z-index: 7;
  opacity: 0;
  flex: none;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
  position: absolute;
}

.organic-nav-contents {
  width: 100%;
  height: 75vh;
  display: none;
}

.mail-us-text {
  z-index: 5;
  opacity: 1;
  text-align: center;
  flex: none;
  order: -1;
  align-self: center;
  padding-left: 5px;
  font-family: Avertape, sans-serif;
  display: block;
  position: relative;
}

.case-full-width {
  width: 100%;
  height: 100vh;
}

.case-full-width.hh {
  justify-content: center;
  align-items: center;
  margin-bottom: 150px;
  display: flex;
}

.case-mid-width.hh {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  margin-bottom: 150px;
  padding-left: 160px;
  padding-right: 160px;
  display: flex;
}

.scroll-slider-image-1 {
  z-index: 4;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: block;
  position: absolute;
}

.case-full-lottie {
  z-index: 2;
  -webkit-text-fill-color: inherit;
  background-clip: border-box;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-top: 100px;
  margin-bottom: 100px;
  display: flex;
  position: relative;
  overflow: visible;
}

.scroll-sloider-progress-wrapper {
  z-index: 5;
  background-color: #0000;
  flex-flow: column;
  flex: none;
  justify-content: flex-start;
  align-self: auto;
  align-items: center;
  width: 25px;
  height: 125px;
  margin-left: 160px;
  display: flex;
  position: relative;
  inset: 0% 0% auto;
}

.progress-ball {
  z-index: 5;
  background-color: var(--black);
  filter: invert();
  border-radius: 500px;
  flex: none;
  width: 15px;
  height: 15px;
  position: relative;
}

.changelanguagebtn {
  text-decoration: none;
}

.changelanguagebtn.en {
  margin-left: 15px;
}

.case-section-full {
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

.case-full-wrapp {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.case-full-image-element {
  object-fit: cover;
  position: relative;
  inset: 0%;
}

.case-section-two {
  margin-top: 50px;
  margin-bottom: 50px;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

.case-two-wrapp {
  grid-column-gap: 50px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  padding-left: 100px;
  padding-right: 100px;
  display: grid;
  position: relative;
}

.case-two-image-wrapp {
  flex-direction: column;
  justify-content: center;
  display: flex;
}

.case-two-image-element {
  object-fit: cover;
  max-width: 100%;
  position: relative;
}

.case-section-mid {
  padding: 100px;
  position: relative;
}

.case-section-mid.hide {
  display: none;
}

.case-section-header {
  margin-top: 100px;
  margin-bottom: 100px;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

.case-section-header.hide {
  display: none;
}

.case-section-full-video {
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
}

.case-lottie-element {
  z-index: 1;
  display: block;
  position: relative;
}

.case-lottie-frame-top {
  z-index: 3;
  background-color: #475443;
  background-image: none;
  width: 100%;
  height: 10px;
  display: none;
  position: absolute;
  inset: 0% 0% auto;
}

.case-lottie-frame-bottom {
  z-index: 3;
  background-image: linear-gradient(to top, #00000026, #0000000d 50%, #0000);
  width: 100%;
  height: 75px;
  display: none;
  position: absolute;
  inset: auto 0% 5px;
}

.case-thumb-image {
  object-fit: cover;
  flex: 1;
  justify-content: center;
  width: 100%;
  display: flex;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.case-thumb-image-element {
  object-fit: cover;
  flex: 1;
  position: relative;
  inset: 0%;
}

.case-thumb-image-element.video {
  display: none;
}

.case-section-mid-video {
  padding: 100px;
  position: relative;
}

.case-div-wrapp {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

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

.content-wrapp {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  max-height: 90vh;
  display: block;
  position: relative;
}

.new-test-card {
  background-color: var(--body);
  background-image: none;
  background-size: auto;
  border-radius: 0;
  width: 277px;
  height: 500px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
  overflow: hidden;
  transform: perspective(25px);
  box-shadow: 0 49px 50px -20px #00000026;
}

.intro-wrapp {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: none;
}

.text-block-144 {
  letter-spacing: 2px;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  line-height: 14px;
  position: relative;
}

.lottie-animation-6 {
  position: absolute;
  inset: 0%;
}

.html-embed-6 {
  flex: 1;
}

.contact-form-section {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: relative;
}

.form-wrapp {
  position: relative;
}

.form-field {
  background-color: var(--white);
  color: var(--black);
  border: 1px #000;
  border-top-width: 0;
  border-bottom: 1px solid #00000080;
  flex: none;
  height: 50px;
  margin-bottom: 0;
  padding: 0 0 0 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
  transition: all .35s cubic-bezier(.25, .46, .45, .94);
  position: relative;
}

.form-field:active {
  border-bottom-width: 2px;
  border-bottom-color: #00000080;
}

.form-field:focus {
  border-bottom: 1px solid #00000080;
}

.form-field.first {
  opacity: 1;
  color: #333;
}

.form-field-wrapp {
  z-index: 3;
  align-items: center;
  display: flex;
  position: relative;
}

.form-field-wrapp._1 {
  flex: none;
  position: absolute;
  inset: 0%;
}

.form-field-wrapp._2 {
  z-index: 2;
  position: absolute;
  inset: 0%;
}

.form-field-wrapp._3 {
  z-index: 1;
}

.form-field-wrapp.first {
  z-index: 5;
}

.form-field-wrapp.second {
  z-index: 4;
}

.form-field-wrapp.third {
  z-index: 3;
}

.form-field-wrapp.forth {
  z-index: 2;
}

.form-field-wrapp.fifth {
  z-index: 1;
}

.field-title {
  z-index: 2;
  cursor: auto;
  object-fit: none;
  flex: none;
  margin-left: 37px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 22px;
  display: block;
  position: absolute;
}

.field-title.disable-select.hide {
  display: none;
}

.submit-btn-c {
  background-color: #0000;
  padding: 0;
  position: absolute;
  inset: 0%;
}

.field-number {
  z-index: 4;
  color: #0003;
  margin-left: 0;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 22px;
  position: absolute;
}

.next-icon {
  z-index: 2;
  filter: invert() grayscale();
  position: relative;
  inset: auto;
}

.next-icon.final {
  filter: none;
}

.new-form-wrapp {
  align-items: center;
  width: 290px;
  height: 50px;
  display: block;
  position: relative;
}

.submit-wrapp {
  z-index: 4;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.next-button {
  z-index: 4;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.success-message {
  text-align: center;
  background-color: #fff;
  border-bottom: 1px solid #000;
  width: 290px;
  height: 50px;
  padding: 0;
  position: absolute;
  inset: 0%;
}

.text-block-145 {
  margin-bottom: 12px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 22px;
  position: absolute;
  inset: auto 0% 0%;
}

.box {
  z-index: 10;
  transform: ;
  flex-direction: row;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 378px;
  height: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: 50px;
  display: flex;
  position: absolute;
}

.back-glow {
  z-index: 1;
  background-color: #0000;
  background-image: url('../images/GLOW-2.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  background-attachment: scroll;
  flex: none;
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 0%;
}

.bottom {
  backface-visibility: hidden;
  transform-origin: 50% 0;
  transform-style: preserve-3d;
  background-image: linear-gradient(to top, #0e0e0e 4%, #303030);
  background-position: 0 0;
  border-radius: 24px;
  flex: none;
  width: 276px;
  height: 113px;
  margin-bottom: 50px;
  display: block;
  position: absolute;
  inset: auto auto -113px;
  overflow: visible;
  transform: rotateX(-90deg)rotateY(0)rotateZ(0)perspective(25px);
}

.side {
  background-color: var(--indian-red);
  width: 75px;
  height: 500px;
  position: absolute;
  inset: 0% auto 0% -75px;
}

.side.left {
  backface-visibility: hidden;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-color: #0000;
  flex: none;
  justify-content: center;
  align-items: flex-start;
  width: 113px;
  margin-top: 50px;
  margin-left: 50px;
  display: flex;
  left: -113px;
  transform: translate(.5px)rotateX(0)rotateY(-90deg)rotateZ(0)perspective(25px);
}

.side.right {
  backface-visibility: hidden;
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-color: #0000;
  flex: none;
  justify-content: center;
  width: 113px;
  margin-top: 50px;
  margin-right: 50px;
  display: flex;
  inset: 0% -112px 0% auto;
  transform: rotateX(0)rotateY(90deg)rotateZ(0)perspective(25px);
}

.top {
  backface-visibility: hidden;
  transform-origin: 50% 100%;
  transform-style: preserve-3d;
  background-image: url('../images/King-Box-3D---Top.png');
  background-size: cover;
  border-radius: 24px;
  flex: none;
  width: 276px;
  height: 113px;
  margin-top: 50px;
  position: absolute;
  inset: -113px auto auto;
  overflow: hidden;
  transform: rotateX(90deg)rotateY(0)rotateZ(0)perspective(25px);
}

.front-flex {
  width: 15px;
  height: 500px;
}

.front-flex.left {
  background-color: var(--black);
  backface-visibility: hidden;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/LDiagonal-Str.jpg');
  background-size: cover;
  flex: none;
  width: 33px;
  margin-top: 50px;
  margin-left: 50px;
  display: block;
  position: absolute;
  inset: 0% auto 0% -9px;
  transform: rotateX(0)rotateY(-45deg)rotateZ(0)perspective(25px);
}

.front-flex.right {
  background-color: var(--black);
  backface-visibility: hidden;
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/RDiagonal-Str.jpg');
  background-size: cover;
  flex: none;
  width: 33px;
  margin-top: 50px;
  margin-right: 50px;
  display: block;
  position: absolute;
  inset: 0% -9px 0% auto;
  transform: rotateX(0)rotateY(45deg)rotateZ(0)perspective(25px);
}

.front-mid {
  z-index: 10;
  background-color: var(--body);
  backface-visibility: hidden;
  background-image: url('../images/Front-231x500-4.jpg');
  background-size: cover;
  flex: none;
  width: 232px;
  height: 500px;
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  inset: 0%;
  transform: perspective(25px);
}

.side-fill {
  background-color: var(--body);
  backface-visibility: hidden;
  background-image: url('../images/Side-67x500-R.jpg');
  background-size: cover;
  flex: none;
  width: 67px;
  height: 500px;
  position: relative;
  inset: 0% 0% 0% auto;
}

.side-fill.a {
  background-color: var(--body);
  backface-visibility: hidden;
  background-image: url('../images/Side-67x500.jpg');
  background-size: cover;
  flex: none;
  width: 70px;
  position: relative;
  inset: 0% auto 0% 0%;
}

.inner-magic-2 {
  background-color: var(--black);
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 12px;
  height: 12px;
  position: absolute;
}

.inner-magic-3 {
  background-color: var(--black);
  filter: none;
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 10px;
  height: 10px;
  position: absolute;
}

.inner-magic-4 {
  background-color: var(--black);
  filter: none;
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 8px;
  height: 8px;
  position: absolute;
}

.inner-magic-5 {
  background-color: var(--black);
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 6px;
  height: 6px;
  position: absolute;
}

.cursor-wrapper {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
  position: relative;
}

.inner-magic-6 {
  background-color: var(--black);
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 4px;
  height: 4px;
  display: block;
  position: absolute;
}

.inner-magic-7 {
  background-color: var(--black);
  filter: none;
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 8px;
  height: 8px;
  display: none;
  position: absolute;
}

.inner-magic-8 {
  background-color: var(--black);
  filter: none;
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 7px;
  height: 7px;
  display: none;
  position: absolute;
}

.inner-magic-9 {
  background-color: var(--black);
  filter: none;
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 6px;
  height: 6px;
  display: none;
  position: absolute;
}

.inner-magic-1-top {
  z-index: 1;
  background-color: var(--black);
  border: 1px #000;
  border-radius: 500px;
  flex: none;
  align-self: center;
  width: 14px;
  height: 14px;
  position: absolute;
}

.thumb-wrapp {
  z-index: 1;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.body-6 {
  background-color: var(--black);
}

.box-bg {
  z-index: 1;
  background-image: url('../images/Pattern-1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  flex: none;
  justify-content: center;
  align-items: center;
  display: block;
  position: absolute;
  inset: 0%;
  transform: scale(1.1);
}

.box-spotlight {
  z-index: 3;
  background-image: url('../images/Sqnka-3.png');
  background-position: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  display: block;
  position: absolute;
  inset: 0%;
  transform: scale(1.2);
}

.box-bg-wrapp {
  z-index: 2;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.box-area {
  z-index: 5;
  perspective: 1000px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
  transform: scale(.8);
}

.separator {
  width: 100%;
  height: 400px;
}

.box-whole-big {
  z-index: 2;
  background-image: linear-gradient(to bottom, var(--black) 7%, #0000 20%, #0000 80%, var(--black) 88%);
  flex: none;
  justify-content: center;
  align-items: center;
  display: block;
  position: absolute;
  inset: 0%;
}

._1 {
  z-index: 1;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.67px;
  height: 500px;
  margin-top: 50px;
  margin-left: 50px;
  position: absolute;
  inset: 0% auto 0% 15.5px;
  transform: rotateX(0)rotateY(-15deg)rotateZ(0)perspective(25px);
}

._2 {
  z-index: 2;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/2.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.67px;
  height: 500px;
  margin-top: 50px;
  margin-left: 50px;
  position: absolute;
  inset: 0% auto 0% 8.5px;
  transform: rotateX(0)rotateY(-30deg)rotateZ(0)translate3d(-.4px, 0, -2px)perspective(25px)perspective(25px);
}

._3 {
  z-index: 3;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/3.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.67px;
  height: 500px;
  margin-top: 50px;
  margin-left: 50px;
  display: block;
  position: absolute;
  inset: 0% auto 0% -2px;
  transform: rotateX(0)rotateY(-45deg)rotateZ(0)translate3d(.4px, 0, -8px)perspective(25px)perspective(25px);
}

._4 {
  z-index: 4;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/4.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.75px;
  height: 500px;
  margin-top: 50px;
  margin-left: 50px;
  display: block;
  position: absolute;
  inset: 0% auto 0% 0;
  transform: rotateX(0)rotateY(-60deg)rotateZ(0)translate3d(-8.8px, 0, -4.4px)perspective(25px)perspective(25px);
}

._5 {
  z-index: 5;
  transform-origin: 100%;
  transform-style: preserve-3d;
  background-image: url('../images/5.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 7px;
  height: 500px;
  margin-top: 50px;
  margin-left: 50px;
  position: absolute;
  inset: 0% auto 0% 0;
  transform: rotateX(0)rotateY(-75deg)rotateZ(0)translate(-16.2px)perspective(25px)perspective(25px);
}

._6 {
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/10.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.7px;
  height: 500px;
  margin-top: 50px;
  margin-right: 50px;
  position: absolute;
  inset: 0% 0% 0% auto;
  transform: rotateX(0)rotateY(15deg)rotateZ(0)translate3d(-16px, 0, -4px)perspective(25px);
}

._7 {
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/9.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.7px;
  height: 500px;
  margin-top: 50px;
  margin-right: 50px;
  position: absolute;
  inset: 0% 0% 0% auto;
  transform: rotateX(0)rotateY(30deg)rotateZ(0)translate3d(-7.8px, 0, -6.8px)perspective(25px);
}

._8 {
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/8.png');
  background-position: 50%;
  background-size: cover;
  flex: none;
  width: 6.7px;
  height: 500px;
  margin-top: 50px;
  margin-right: 50px;
  position: absolute;
  inset: 0% 0% 0% auto;
  transform: rotateX(0)rotateY(45deg)rotateZ(0)translate3d(1px, 0, -7.2px)perspective(25px);
}

._9 {
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/7_1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.7px;
  height: 500px;
  margin-top: 50px;
  margin-right: 50px;
  display: block;
  position: absolute;
  inset: 0% 0% 0% auto;
  transform: rotateX(0)rotateY(60deg)rotateZ(0)translate3d(9px, 0, -4.5px)perspective(25px);
}

._10 {
  transform-origin: 0%;
  transform-style: preserve-3d;
  background-image: url('../images/6_1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 6.7px;
  height: 500px;
  margin-top: 50px;
  margin-right: 50px;
  display: block;
  position: absolute;
  inset: 0% 0% 0% auto;
  transform: rotateX(0)rotateY(75deg)rotateZ(0)translate(16.5px)perspective(25px);
}

.bg-canvas {
  perspective: 500px;
  transform: ;
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: absolute;
  inset: 0%;
}

.mask {
  z-index: 1;
  background-color: var(--black);
  flex: none;
  justify-content: center;
  align-items: center;
  width: 80vw;
  height: 90vh;
  display: flex;
  position: absolute;
  overflow: hidden;
}

.img {
  z-index: 0;
  background-image: radial-gradient(circle, #fff0 52%, #000 93%);
  background-position: 0 0;
  flex: none;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: absolute;
  inset: auto;
  overflow: hidden;
}

.mask-gradient {
  z-index: 1;
  background-image: url('../images/BR-video-whole.png'), linear-gradient(#000 5%, #0000 25%), linear-gradient(to top, #000 5%, #0000 25%), radial-gradient(circle, #0000 60%, #000 80%);
  background-position: 50%, 0 0, 0 0, 0 0;
  background-repeat: no-repeat, repeat, repeat, repeat;
  background-size: 1280px, auto, auto, auto;
  flex: none;
  display: flex;
  position: absolute;
  inset: 0%;
  transform: scale(1.1);
}

.bottle-nav {
  z-index: 5;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 100px;
  padding-left: 120px;
  padding-right: 120px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.body-7 {
  height: 100vh;
  overflow: hidden;
}

.bottle-nav-contents {
  flex: none;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 50px;
  display: flex;
}

.b-nav-logo {
  cursor: pointer;
  background-image: url('../images/black-ram-whiskey-logo.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 150px;
  height: 50px;
}

.sections {
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  flex: none;
  display: flex;
  position: relative;
}

.bottle {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.bottle-img {
  position: absolute;
}

.right-side {
  z-index: 2;
  align-items: center;
  width: 50%;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.left-side {
  justify-content: flex-end;
  align-items: center;
  width: 50%;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.image-97 {
  z-index: 2;
  position: absolute;
  bottom: auto;
  left: auto;
  right: auto;
}

.b-footer {
  z-index: 5;
  width: 100%;
  min-height: 50px;
  padding-left: 120px;
  padding-right: 120px;
  position: fixed;
  inset: auto 0% 0%;
}

.footer-wrapper {
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 50px;
  display: flex;
  position: relative;
}

.prize-img {
  z-index: 2;
  cursor: pointer;
  position: relative;
  top: auto;
  left: auto;
}

.check-desktop {
  z-index: 20;
  background-color: #050505;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.text-block-146 {
  color: var(--white);
  text-align: center;
  font-family: Avertape, sans-serif;
  font-size: 18px;
  font-weight: 400;
  position: relative;
}

.text-span-3 {
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
}

.bottle-holder {
  z-index: 6;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 350px;
  height: 100vh;
  display: flex;
  position: relative;
  inset: 0%;
}

.zoom-1 {
  background-color: var(--white);
  opacity: .5;
  border-radius: 1000px;
  width: 75px;
  height: 75px;
  margin-bottom: 50px;
  margin-left: 50px;
  display: none;
  position: absolute;
  inset: auto auto 0% 0%;
}

.br-nav-section {
  color: var(--white);
  text-align: center;
  padding: 10px 15px;
  font-family: Montserrat, sans-serif;
  text-decoration: none;
  transition: all .5s cubic-bezier(.165, .84, .44, 1);
  display: flex;
  position: relative;
}

.br-nav-section:hover {
  color: var(--br-gold);
  text-align: center;
}

.text-block-147 {
  color: #ffffffe6;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-family: Colus, sans-serif;
  position: relative;
}

.bg-video {
  z-index: 0;
  flex: 1;
  align-self: center;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: absolute;
  inset: 0%;
}

.br-video-overlay {
  z-index: 1;
  background-image: linear-gradient(270deg, #000 5%, #0000 20%), linear-gradient(#000 5%, #0000 20%), linear-gradient(to right, #000 5%, #0000 20%), linear-gradient(to top, #000 5%, #0000 20%);
  position: absolute;
  inset: 0%;
}

.left-wrapp {
  justify-content: center;
  align-items: center;
  width: 250px;
  height: 250px;
  display: flex;
  position: relative;
  right: 20%;
}

.right-wrapp {
  justify-content: center;
  align-items: center;
  width: 250px;
  height: 250px;
  display: none;
  position: relative;
  left: 20%;
}

.side-img-bg {
  z-index: 1;
  background-image: radial-gradient(circle, #00000059 35%, #0000 65%);
  display: flex;
  position: absolute;
  inset: 0%;
}

.price-copy {
  z-index: 0;
  color: #ffffffe6;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow: 0 0 15px #000;
  flex: none;
  font-family: Colus, sans-serif;
  position: absolute;
  bottom: -35px;
}

.bg-video-m {
  z-index: 0;
  flex: 1;
  align-self: center;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: none;
  position: absolute;
  inset: 0%;
}

.age-gate-wrapp {
  z-index: 50;
  background-color: var(--black);
  background-image: url('../images/BR-video-whole.png');
  background-position: 50%;
  background-size: cover;
  justify-content: center;
  align-items: center;
  display: none;
  position: absolute;
  inset: 0%;
}

.age-gate-content {
  z-index: 10;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: relative;
}

.yes-btn {
  z-index: 1;
  border: 1px solid var(--white);
  color: var(--white);
  background-color: #00000040;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  padding: 15px 35px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  position: relative;
}

.yes-btn:hover {
  color: var(--br-gold);
}

.no-btn {
  z-index: 0;
  border: 1px dotted var(--white);
  color: var(--white);
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  margin-left: -1px;
  padding: 15px 35px;
  font-weight: 400;
  text-decoration: none;
  position: relative;
}

.no-btn:hover {
  color: var(--br-gold);
}

.btn-copy {
  z-index: 0;
  text-align: center;
  cursor: pointer;
  font-family: Montserrat, sans-serif;
  position: relative;
}

.age-gate-title {
  color: var(--white);
  text-align: center;
  max-width: 480px;
  font-family: Colus, sans-serif;
  font-size: 32px;
  line-height: 36px;
}

.btn-wrapp {
  justify-content: center;
  margin-top: 25px;
  display: flex;
}

.bg-video-overlay {
  z-index: 9;
  background-color: #00000080;
  background-image: linear-gradient(45deg, black 5%, #0000 50%), linear-gradient(135deg, black 5%, #0000 50%), linear-gradient(225deg, black 5%, #0000 50%), linear-gradient(315deg, black 5%, #0000 50%), linear-gradient(to bottom, black 5%, #0000 15%, #0000 85%, var(--black) 95%);
  -webkit-backdrop-filter: saturate(0%) blur(5px);
  backdrop-filter: saturate(0%) blur(5px);
  position: absolute;
  inset: 0%;
}

.age-gate-error {
  opacity: 0;
  color: var(--br-gold);
  text-align: center;
  max-width: 480px;
  margin-top: 10px;
  display: block;
}

.br-age-separator-dash {
  background-color: var(--br-gold);
  width: 25%;
  height: 1px;
  margin-top: 15px;
  position: relative;
}

.rottate-device {
  display: none;
}

.body-8 {
  background-color: var(--black);
}

.br-terms-section {
  margin-top: 100px;
  padding: 100px 120px;
  position: relative;
}

.br-terms-contents {
  flex-direction: column;
  align-items: center;
  display: flex;
  position: relative;
}

.br-terms-title {
  color: var(--white);
  text-align: center;
  max-width: 680px;
  font-family: Montserrat, sans-serif;
  position: relative;
}

.text-block-148 {
  color: var(--white);
  text-align: left;
  max-width: 680px;
  margin-top: 50px;
  font-family: Montserrat, sans-serif;
  text-decoration: none;
  position: relative;
}

.link-3, .link-4 {
  color: var(--white);
  text-decoration: none;
}

.br-prizes-section {
  justify-content: center;
  align-items: flex-start;
  margin-top: 100px;
  padding: 100px 120px;
  display: flex;
}

.br-prizes-content {
  flex: none;
  justify-content: space-between;
  align-items: flex-start;
  display: block;
}

.br-big-prize-wrapp {
  flex-direction: row;
  align-items: flex-end;
  margin-top: 25px;
  display: flex;
  position: relative;
}

.prize-copy {
  color: var(--white);
  max-width: 150px;
  margin-top: 15px;
  font-family: Colus, sans-serif;
  position: relative;
}

.br-prize-title {
  color: var(--white);
  text-align: center;
  font-family: Colus, sans-serif;
  font-weight: 400;
  position: relative;
}

.small-wrapp {
  margin-left: 15px;
}

.small-prize {
  margin-top: 75px;
}

.text-block-149 {
  color: var(--white);
  text-align: center;
  white-space: nowrap;
  font-family: Montserrat, sans-serif;
  position: relative;
}

.winners-section {
  width: 100%;
  padding: 50px 120px;
}

.winners-content-wrapp {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.text-span-4 {
  color: var(--br-gold);
}

.winner-thumb-wrapp {
  flex-direction: column;
  align-items: center;
  width: 125px;
  display: flex;
  position: relative;
}

.winner-img {
  border: 2px solid var(--br-gold);
  border-radius: 2500px;
  width: 125px;
  height: 125px;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}

.br-winners-grid {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  place-items: center;
  width: 100%;
  margin-top: 50px;
  margin-bottom: 100px;
}

.text-span-5 {
  color: var(--br-gold);
}

.br-winners-grid-big {
  grid-column-gap: 25px;
  grid-row-gap: 25px;
  grid-template-columns: 1fr 1fr 1fr;
  place-items: center;
  width: 50%;
  margin-top: 50px;
  margin-bottom: 100px;
}

.case-short-intro-section {
  width: 100%;
  margin-top: 225px;
  position: relative;
}

.case-short-content-wrapp {
  padding-left: 100px;
  padding-right: 100px;
}

.case-short-title {
  color: var(--body);
  min-width: 320px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 44px;
  position: relative;
}

.case-short-text-wrapp {
  padding-top: 80px;
  padding-left: 90px;
}

.case-short-body {
  color: var(--body);
  max-width: 640px;
  margin-top: 44px;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
}

.case-short-text-content {
  grid-column-gap: 60px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: min-content 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  place-content: start;
  justify-items: start;
  display: grid;
  position: relative;
}

.full-case-wrapp {
  z-index: 2;
  position: relative;
}

.case-other-section {
  padding: 100px 100px 150px;
  display: none;
}

.case-other-content-wrapp {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template: "Area Area-2 Area-3" 50vh
  / 2fr .5fr 3fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: grid;
  position: relative;
}

.previous-case-wrapp {
  width: 100%;
  position: relative;
}

.next-case-wrapp {
  position: relative;
}

.prev-thumb-wrapp {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.other-thumb-img {
  z-index: 1;
  object-fit: cover;
  max-width: none;
  max-height: 100%;
  display: block;
  position: relative;
  inset: 0%;
}

.prev-thumb-content-wrapp {
  z-index: 2;
  opacity: 1;
  -webkit-backdrop-filter: brightness(110%) blur(25px);
  backdrop-filter: brightness(110%) blur(25px);
  background-color: #ffffff40;
  display: flex;
  position: absolute;
  inset: 0%;
}

.other-text-wrapp {
  width: 100%;
  padding-bottom: 50px;
  padding-left: 50px;
  padding-right: 10px;
  position: absolute;
  inset: auto 0% 0%;
}

.other-title {
  color: var(--body);
  margin-bottom: 15px;
  font-family: Avertape, sans-serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 44px;
  position: relative;
}

.other-partner {
  color: var(--body);
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 20px;
  position: relative;
}

.other-details-wrapp {
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: relative;
}

.other-cat {
  color: #33333380;
  margin-left: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 20px;
  position: relative;
}

.prev-ui-wrapp {
  justify-content: flex-end;
  align-items: center;
  margin-top: -15px;
  display: flex;
  position: relative;
  inset: -5% 0% auto auto;
}

.other-ui-text {
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
}

.other-prev-arrow-img {
  margin-right: 25px;
}

.next-thumb-wrapp {
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.next-ui-wrapp {
  justify-content: flex-start;
  align-items: center;
  margin-top: -15px;
  display: flex;
  position: relative;
  inset: -5% 0% auto auto;
}

.other-next-arrow-img {
  margin-left: 25px;
}

.case-other-link {
  width: 100%;
  position: absolute;
  inset: 0%;
}

.test-area {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: relative;
}

.element {
  border: 3px none var(--yellow);
  background-color: var(--black);
  flex: none;
  justify-content: center;
  align-items: center;
  width: 240px;
  height: 75px;
  transition: margin .5s cubic-bezier(.23, 1, .32, 1), border-radius .5s ease-in-out, box-shadow .5s cubic-bezier(.25, .46, .45, .94);
  display: flex;
  position: relative;
  overflow: hidden;
}

.element:hover {
  border: 5px none var(--yellow);
  mix-blend-mode: normal;
  border-radius: 5px;
  margin-bottom: 5px;
  box-shadow: 0 25px 25px -15px #00000040;
}

.effect {
  z-index: 2;
  background-color: var(--yellow);
  border-radius: 10000px;
  flex: none;
  width: 125px;
  height: 125px;
  position: relative;
  inset: auto 0%;
}

.text-block-150 {
  z-index: 5;
  color: var(--white);
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
  flex: none;
  font-family: Changa One, Impact, sans-serif;
  font-size: 18px;
  line-height: 22px;
  position: absolute;
}

.team-member-wrapp {
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
  position: relative;
}

.team-member-wrapp.hide {
  display: none;
}

.team-member-info {
  flex: none;
  order: 1;
  width: 100%;
  height: 70px;
  padding-top: 15px;
  padding-left: 15px;
  display: block;
  position: relative;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.title {
  margin-top: 5px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 22px;
  position: relative;
}

.team-name {
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 22px;
  position: relative;
}

.team-member-img-element-top {
  z-index: 1;
  object-fit: cover;
  order: -1;
  position: absolute;
}

.team-grid {
  grid-column-gap: 50px;
  grid-row-gap: 50px;
  grid-template-rows: auto;
  grid-template-columns: minmax(220px, 320px) minmax(220px, 320px) minmax(220px, 320px);
  grid-auto-flow: row;
  margin-left: 100px;
}

.process {
  flex-direction: column;
  width: 100%;
  height: 500vh;
  margin-top: 75px;
  margin-bottom: 75px;
  display: flex;
  position: relative;
}

.process-wrapp {
  flex: none;
  order: -1;
  align-items: center;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
}

.process-line-1-wrapp {
  align-items: center;
  width: 100%;
  height: 25px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.p-line-1 {
  z-index: 1;
  background-color: var(--black);
  width: 100vw;
  height: 2px;
  margin-left: 5px;
  position: absolute;
}

.point-1, .point-2, .point-3 {
  z-index: 2;
  border: 5px solid var(--white);
  background-color: var(--black);
  outline-offset: -2px;
  border-radius: 1000px;
  outline: 2px dotted #33333326;
  flex: none;
  width: 25px;
  height: 25px;
  position: absolute;
  top: -50px;
}

.point-main-1 {
  z-index: 3;
  background-color: var(--yellow);
  border-radius: 1000px;
  flex: none;
  width: 15px;
  height: 15px;
  position: absolute;
}

.process-line-2-wrapp {
  align-items: center;
  width: 100%;
  height: 25px;
  margin-left: -165px;
  display: flex;
  position: relative;
}

.p-line-2 {
  z-index: 1;
  background-color: var(--black);
  width: 59vw;
  height: 2px;
  position: absolute;
}

.point-main-2 {
  z-index: 3;
  background-color: var(--yellow);
  border-radius: 1000px;
  flex: none;
  width: 15px;
  height: 15px;
  position: absolute;
  left: 0;
}

.point-4 {
  z-index: 2;
  border: 5px solid var(--white);
  background-color: var(--black);
  outline-offset: -2px;
  border-radius: 1000px;
  outline: 2px dotted #33333326;
  flex: none;
  width: 25px;
  height: 25px;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  inset: -50px auto 0%;
}

.point-5 {
  z-index: 2;
  border: 5px solid var(--white);
  background-color: var(--black);
  outline-offset: -2px;
  border-radius: 1000px;
  outline: 2px dotted #33333326;
  flex: none;
  width: 25px;
  height: 25px;
  position: absolute;
  top: -50px;
}

.p-line-1-wrapp {
  margin-left: 165px;
  padding-top: 50px;
  padding-bottom: 125px;
  position: relative;
}

.p-line-1-content-1 {
  flex-direction: column;
  align-items: center;
  width: 15px;
  margin-top: 25px;
  display: flex;
  position: absolute;
  left: 0;
}

.process-title {
  color: var(--black);
  text-align: center;
  font-family: Avertape, sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 36px;
}

.p-line-2-wrapp {
  margin-top: 50px;
  padding-top: 75px;
  padding-bottom: 125px;
  padding-left: 165px;
}

.p-line-1-content-2 {
  flex-direction: column;
  align-items: center;
  width: 15px;
  margin-top: 25px;
  display: flex;
  position: absolute;
  left: 32vw;
}

.process-body-text {
  text-align: center;
  white-space: nowrap;
  max-width: 480px;
  font-family: Avertape, sans-serif;
  font-size: 18px;
  line-height: 22px;
}

.p-line-1-content-3 {
  flex-direction: column;
  align-items: center;
  width: 15px;
  margin-top: 25px;
  display: flex;
  position: absolute;
  left: 64vw;
}

.p-line-1-content-4 {
  flex-direction: column;
  align-items: center;
  width: 25px;
  margin-top: 25px;
  display: flex;
  position: absolute;
  left: 26vw;
}

.p-line-1-content-5 {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 25px;
  margin-top: 25px;
  display: flex;
  position: absolute;
  left: 59vw;
}

.skills-row-1 {
  z-index: 2;
  color: var(--black);
  text-align: left;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 12vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.skills-row-2 {
  z-index: 2;
  color: var(--black);
  text-align: right;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 26vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.skills-row-3 {
  z-index: 2;
  color: var(--black);
  text-align: left;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 40vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.skills-row-4 {
  z-index: 2;
  color: var(--black);
  text-align: right;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 54vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.skills-row-5 {
  z-index: 2;
  color: var(--black);
  text-align: left;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 69vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.skills-row-6 {
  z-index: 2;
  color: var(--black);
  text-align: right;
  white-space: nowrap;
  width: 115vw;
  height: 75px;
  margin-top: 82vh;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 75px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.process-content-wrapp {
  justify-content: center;
  margin-top: 5px;
  display: flex;
}

.process-separator {
  width: 25px;
}

.contact-sub-title {
  color: var(--body);
  margin-bottom: 5px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
}

.link-5 {
  color: var(--body);
  text-decoration: underline;
}

.link-6 {
  color: var(--body);
}

.contacts-img-gallery-wrapp {
  flex: 0 auto;
  justify-content: center;
  align-items: flex-end;
  margin-top: 75px;
  position: relative;
}

.slider-image {
  flex: 1;
}

.test-area-2 {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: none;
  position: relative;
}

.html-embed-7 {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  display: block;
  position: absolute;
  inset: 0%;
}

.case-details-wrapp {
  margin-top: 44px;
}

.case-details-sub {
  color: var(--body);
  max-width: 640px;
  margin-bottom: 2px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 25px;
  position: relative;
}

.yellow-dash-details {
  z-index: 3;
  background-color: var(--yellow);
  width: 90px;
  height: 10px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.team-member-img {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.team-member-img-element-bot {
  z-index: 0;
  object-fit: cover;
  order: -1;
  position: relative;
}

.contacts-content-grid {
  grid-column-gap: 100px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-flow: column;
  width: 100%;
  position: relative;
}

.html-embed-8 {
  width: 100%;
  height: 100%;
}

.process-holder {
  width: 100%;
}

.process-indicator-m {
  display: none;
}

.image-103 {
  transform: scale(.8);
}

.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;
  flex: 1;
  align-items: center;
  width: 260px;
  display: flex;
}

._404-video-wrapp {
  border-radius: 125px;
  justify-content: space-between;
  align-items: center;
  width: 500px;
  height: 250px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
  overflow: hidden;
}

.eye-socket-left {
  z-index: 5;
  justify-content: center;
  align-items: center;
  width: 250px;
  height: 250px;
  display: flex;
  position: absolute;
  inset: auto auto auto 0%;
}

.eye-socket-right {
  z-index: 5;
  justify-content: center;
  align-items: center;
  width: 250px;
  height: 250px;
  display: flex;
  position: absolute;
  inset: auto 0% auto auto;
}

.left-eye {
  background-color: var(--black);
  border-radius: 100px;
  width: 75px;
  height: 75px;
  position: absolute;
}

.right-eye {
  background-color: var(--black);
  border-radius: 100px;
  width: 75px;
  height: 75px;
  position: relative;
}

._404-title {
  color: var(--black);
  max-width: 480px;
  margin-top: 50px;
  margin-bottom: 0;
  font-family: Avertape, sans-serif;
  font-size: 60px;
  font-weight: 700;
  line-height: 64px;
  position: relative;
}

._404-body {
  color: var(--body);
  max-width: 640px;
  margin-top: 25px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
}

._404-button {
  color: var(--body);
  flex: none;
  justify-content: space-between;
  align-items: center;
  width: 230px;
  margin-top: 25px;
  padding: 10px;
  text-decoration: none;
  display: flex;
  position: relative;
}

._404-button.success-page {
  margin-left: -10px;
}

.cta-copy {
  margin-right: 25px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 700;
  position: relative;
}

.cta-copy.consultations {
  margin-right: 5px;
}

.cta-plus-icon {
  z-index: 5;
  float: right;
  clear: none;
  flex-flow: wrap;
  flex: none;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
  position: relative;
}

.medium-button {
  color: var(--body);
  margin-left: -10px;
  padding: 10px;
  font-family: Avertape, sans-serif;
  text-decoration: none;
}

.button-dash {
  background-color: var(--black);
  width: 100%;
  height: 100%;
}

.button-dash.b {
  z-index: 1;
  position: absolute;
  inset: 0%;
}

.button-dash.y {
  z-index: 3;
  background-color: var(--yellow);
  width: 0%;
  position: absolute;
  inset: 0%;
}

.medium-button-text {
  font-size: 20px;
  line-height: 22px;
}

.button-dash-wrapp {
  height: 3px;
  margin-top: 5px;
  position: relative;
}

.cases-grid-column {
  grid-column-gap: 0px;
  grid-row-gap: 100px;
  grid-template-columns: 1fr;
  position: relative;
}

.cases-grid-column._01, .cases-grid-column._02, .cases-grid-column._03 {
  align-content: start;
}

.case-wrapp-new {
  color: var(--body);
  cursor: pointer;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

.case-thumb-bg {
  z-index: 1;
  flex: none;
  max-width: 100%;
  max-height: 100%;
  position: relative;
  inset: 0%;
  transform: none;
}

.case-thumb-text-wrapp {
  z-index: 2;
  margin-top: 10px;
  position: relative;
}

.case-thumb-title {
  color: var(--body);
  font-family: Avertape, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  position: relative;
}

.case-thumb-client {
  float: left;
  clear: left;
  color: var(--body);
  white-space: nowrap;
  margin-right: 15px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
  position: relative;
}

.case-thumb-client.white {
  z-index: 1;
  color: var(--white);
  text-align: center;
  text-shadow: 0 0 25px #000000bf;
  margin-bottom: 10px;
  margin-right: 0;
}

.case-thumb-type {
  float: left;
  clear: left;
  opacity: .5;
  color: var(--body);
  white-space: nowrap;
  margin-right: 15px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
  position: relative;
}

.case-thumb-details-wrapp {
  flex-direction: row;
  margin-top: 5px;
  display: flex;
}

.cases-grid {
  grid-column-gap: 0px;
  grid-template: "Area Area-2 Area-3 Area-4 Area-5"
  / 2fr minmax(25px, .25fr) 2fr minmax(25px, .25fr) 2fr;
  place-content: stretch space-around;
  place-items: stretch stretch;
  width: 100%;
  position: relative;
}

.cases-grid.tablet, .cases-grid.mobile {
  display: none;
}

.div-block-91 {
  margin-top: 500px;
  margin-bottom: 500px;
}

.case-thumb-img-wrapp {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.case-thumb-more {
  z-index: 4;
  border-radius: 100%;
  flex-direction: column;
  place-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  display: flex;
  position: absolute;
}

.case-thumb-more-icon {
  z-index: 5;
  flex-flow: wrap;
  order: 1;
  place-content: center;
  align-self: flex-end;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.case-thumb-more-cta {
  color: var(--body);
  white-space: nowrap;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  inset: auto auto -25%;
}

.case-thumb-overlay {
  z-index: 2;
  background-color: #fff0;
  background-image: radial-gradient(circle closest-side, #3330, #33333326);
  display: none;
  position: absolute;
  inset: 0%;
}

.selected-work-section {
  z-index: 2;
  background-color: #0000;
  justify-content: space-around;
  width: 100%;
  margin-top: 100px;
  padding: 150px 100px;
  display: flex;
  position: relative;
}

.full-width-img {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 70vh;
  margin-bottom: 150px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.img-grid-section {
  z-index: 1;
  width: 100%;
  padding: 75px 100px;
  display: block;
}

.img-grid {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  width: 100%;
  display: grid;
}

.grid-img-wrapp {
  background-image: url('../images/Alike-office-1.jpg');
  background-position: 50%;
  background-size: cover;
  min-width: 30vw;
  min-height: 50vh;
  position: relative;
}

.grid-img-wrapp.img-2 {
  background-image: url('../images/Alike-office-6.jpg');
}

.grid-img-wrapp.img-3 {
  background-image: url('../images/Alike-office-3.jpg');
}

.grid-img-wrapp.img-4 {
  background-image: url('../images/Alike-office-0.jpg');
}

.grid-img-wrapp.img-5 {
  background-image: url('../images/Alike-office-2.jpg');
}

.full-width-img-element {
  z-index: 1;
  position: relative;
}

.case-thumb-embed {
  z-index: 2;
  position: absolute;
  inset: 0%;
  transform: scale(1.2);
}

.reveal-slider-section {
  cursor: none;
  flex-direction: column;
  place-content: flex-end center;
  align-items: flex-end;
  width: 100%;
  height: 100vh;
  margin-top: 75px;
  margin-bottom: 75px;
  padding-left: 100px;
  padding-right: 100px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.reveal-img {
  object-fit: none;
  flex: none;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.layout-title-wrapp {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 20vh;
  margin-top: 150px;
  margin-bottom: 75px;
  padding-left: 100px;
  padding-right: 100px;
  display: flex;
}

.reveal-slider-dash {
  background-color: var(--body);
  opacity: .25;
  width: 100%;
  height: 1px;
  margin-top: 35px;
  position: relative;
}

.exploration-description {
  float: left;
  clear: left;
  color: var(--body);
  white-space: nowrap;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
  position: relative;
}

.exploration-title {
  color: var(--body);
  font-family: Avertape, sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 36px;
  position: relative;
}

.reveal-img-top {
  z-index: 2;
  position: absolute;
  inset: 0%;
}

.reveal-slider-img-wrapp {
  z-index: 1;
  background-image: url('../images/6-posters-1.jpg');
  background-position: 50%;
  background-repeat: repeat;
  background-size: cover;
  background-attachment: fixed;
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 0%;
}

.reveal-slider-img-wrapp.top {
  z-index: 2;
}

.reveal-slider-img-wrapp.top-wrapp {
  z-index: 2;
  background-image: url('../images/6-posters2.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  flex-direction: row;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  inset: 0% 0% 0% auto;
  overflow: visible;
}

.reveal-ui-wrapp {
  z-index: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.reveal-dash {
  background-color: var(--body);
  opacity: .5;
  width: .5px;
  height: 100%;
  position: relative;
}

.reveal-hover-drag-wrapp {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #ffffff80;
  border: .5px solid #33333380;
  border-radius: 100%;
  width: 50px;
  height: 50px;
  position: absolute;
}

.img-scroll-reveal-section {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  margin-bottom: 50px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.img-scroll-reveal-img {
  z-index: 1;
  align-self: center;
  position: absolute;
}

.img-scroll-reveal-img.top-img {
  z-index: 2;
}

.full-width-img-overlay {
  z-index: 2;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #ffe60080;
  align-self: flex-start;
  height: 100%;
  position: absolute;
  inset: 0% 0% auto;
}

.next-project-section {
  flex-direction: column;
  justify-content: center;
  align-self: flex-end;
  align-items: center;
  width: 100%;
  height: 50vh;
  display: flex;
  position: sticky;
  inset: 0%;
  overflow: hidden;
}

.next-project-content {
  z-index: 3;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-width: 40vw;
  min-height: 40vh;
  margin-bottom: 100px;
  display: flex;
  position: relative;
  overflow: visible;
}

.next-project-thumb-img {
  z-index: 1;
  opacity: 1;
  object-fit: cover;
  flex: none;
  align-self: center;
  min-width: 100%;
  max-width: 115%;
  position: absolute;
  inset: auto 0% 0%;
  transform: scale(1.2);
}

.next-project-title {
  z-index: 6;
  text-shadow: 0 0 50px #000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.next-project-thumb-overlay {
  z-index: 1;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #00000080;
  position: absolute;
  inset: 0%;
}

.next-project-thumb-wrapp {
  z-index: 3;
  width: 100%;
  height: 50vh;
  display: flex;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.next-project-cta {
  color: var(--white);
  margin-bottom: 5px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
  position: relative;
}

.next-project-title-element {
  color: var(--white);
  text-align: center;
  font-family: Avertape, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 36px;
}

.next-project-wrapp {
  z-index: 2;
  align-items: flex-start;
  width: 100%;
  height: 300vh;
  margin-top: 125px;
  display: flex;
  position: relative;
}

.next-project-link-element {
  z-index: 5;
  display: flex;
  position: absolute;
  inset: 0%;
}

.next-project-bg {
  z-index: 2;
  background-image: url('../images/Mebelis---Alike-Website---13-12-1.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  background-attachment: fixed;
  display: flex;
  position: absolute;
  inset: 0%;
  transform: scale(1.1);
}

.next-project-transition-bg {
  z-index: 2;
  background-image: url('../images/project-thumb.jpg');
  background-repeat: no-repeat;
  background-size: 100vw;
  background-attachment: fixed;
  position: absolute;
  inset: 0%;
  transform: scale(1.2);
}

.next-page-transition {
  z-index: 60;
  width: 100vw;
  height: 100vh;
  display: none;
  position: absolute;
  inset: 0%;
  overflow: hidden;
  transform: none;
}

.section-10 {
  justify-content: center;
  align-items: center;
  height: 100vh;
  display: flex;
  position: relative;
}

.text-field {
  display: block;
}

.html-embed-9 {
  height: 50px;
  position: relative;
}

.upload-btn {
  opacity: 1;
  height: 38px;
  position: relative;
}

.html-embed-10 {
  opacity: 0;
  position: absolute;
  inset: 0%;
}

.next-project-transition-overlay {
  z-index: 4;
  background-color: var(--body);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 0;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
  overflow: hidden;
}

.case-load {
  z-index: 55;
  background-color: var(--body);
  opacity: 0;
  background-image: none;
  background-size: auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: auto 0% 0%;
}

.image-105 {
  mix-blend-mode: lighten;
  object-fit: cover;
  max-width: 125%;
  height: 100%;
  display: none;
  position: absolute;
  inset: 0% auto;
}

.next-project-frame-overlay {
  z-index: 2;
  background-image: linear-gradient(to bottom, #fff0 25%, var(--white) 25%);
  justify-content: center;
  align-items: center;
  display: none;
  position: absolute;
  inset: 0%;
}

.lottie-animation-9 {
  border: 1px solid #000;
  transform: scale(.4);
}

.case-grid {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  margin-top: 100px;
  margin-bottom: 100px;
}

.case-grid-item {
  justify-content: center;
  align-items: center;
  display: flex;
}

.lottie-animation-10 {
  transform: none;
}

.clicks-status {
  z-index: 63;
  background-color: var(--yellow);
  width: 100%;
  height: 100%;
  position: relative;
}

.frame-left {
  background-color: var(--white);
  width: 15vw;
  height: 100%;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.frame-right {
  background-color: var(--white);
  width: 15vw;
  height: 100%;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.frame-top {
  background-color: var(--white);
  width: 100%;
  height: 20vh;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.frame-bot {
  background-color: var(--white);
  width: 100%;
  height: 20vh;
  position: absolute;
  inset: auto 0% 0%;
}

.case-transition {
  z-index: 51;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #ffffff40;
  width: 100%;
  height: 100vh;
  display: none;
  position: fixed;
  inset: auto 0% 0%;
}

.transition-wrapp {
  z-index: 49;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: sticky;
  inset: 0%;
  overflow: hidden;
}

.transition-overlay {
  z-index: 2;
  background-image: linear-gradient(#3330, #33333380);
  flex-direction: column;
  justify-content: flex-end;
  align-self: flex-end;
  align-items: center;
  width: 100%;
  height: 50vh;
  padding-bottom: 25px;
  padding-left: 100px;
  padding-right: 100px;
  display: flex;
  position: relative;
}

.scroll-down-lottie-next {
  background-image: radial-gradient(circle, #00000040, #0000000d 50%, #0000 75%);
  margin-right: 0;
  display: none;
  position: absolute;
  inset: 0%;
}

.next-project-line {
  z-index: 5;
  background-color: var(--yellow);
  width: 0%;
  height: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  display: none;
  position: absolute;
  inset: auto 0% 0%;
}

.transition-title {
  color: var(--white);
  text-align: left;
  margin-bottom: 5px;
  font-family: Avertape, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 36px;
  display: none;
}

.case-first-section {
  z-index: 2;
  align-items: flex-start;
  width: 100%;
  height: 300vh;
  display: flex;
  position: relative;
  inset: 0%;
}

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

.div-block-92 {
  z-index: 49;
  background-color: var(--yellow);
  opacity: .33;
  width: 100px;
  height: 100vh;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.scroll-down-holder {
  position: relative;
}

.scroll-down-new {
  background-image: radial-gradient(circle, #0000000d, #0000 75%);
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  min-width: 50px;
  min-height: 50px;
  margin-bottom: -5px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 7px;
  display: flex;
  position: relative;
}

.scroll-down-line {
  background-color: var(--white);
  width: 1px;
  height: 35px;
  position: absolute;
}

.scroll-down-line.dark {
  background-color: var(--black);
}

.scroll-down-ball {
  background-color: var(--yellow);
  border-radius: 100%;
  width: 3px;
  height: 3px;
  position: absolute;
}

.scroll-down-ball.dark {
  background-color: var(--black);
}

.home-header-new {
  z-index: 5;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  height: 100vh;
  padding: 100px 100px 75px;
  display: flex;
  position: relative;
}

.home-header-content {
  z-index: 5;
  flex-direction: column;
  flex: 1;
  justify-content: flex-end;
  align-items: flex-start;
  margin-bottom: 25px;
  padding-top: 15vh;
  display: flex;
  position: relative;
}

.home-header-bg {
  z-index: 1;
  justify-content: center;
  align-items: stretch;
  height: 45vh;
  max-height: 50vh;
  display: flex;
  position: relative;
  inset: auto 0% 0%;
  overflow: hidden;
}

.home-header-title {
  z-index: 10;
  color: var(--body);
  max-width: 50vw;
  margin-top: 0;
  margin-bottom: 35px;
  font-family: Avertape, sans-serif;
  font-size: 48px;
  font-weight: 700;
  line-height: 52px;
  display: block;
  position: relative;
}

.background-video-16 {
  z-index: 1;
  filter: none;
  height: 100%;
  display: flex;
  position: relative;
  inset: 0%;
}

.home-header-usps {
  z-index: 10;
  float: left;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.home-header-overlay {
  z-index: 2;
  background-image: linear-gradient(#00000080, #00000080);
  display: flex;
  position: absolute;
  inset: 0%;
}

.home-header-overlay-top {
  mix-blend-mode: screen;
  background-image: linear-gradient(#ffe60040, #ffe60000);
  width: 100%;
  height: 175px;
  display: none;
  position: absolute;
  inset: 0% 0% auto;
}

.home-header-overlay-bot {
  background-image: linear-gradient(#0000, #00000080);
  height: 50vh;
  display: none;
  position: absolute;
  inset: auto 0% 0%;
}

.image-106 {
  z-index: 5;
  margin-top: 50px;
  padding-left: 100px;
  padding-right: 100px;
  position: absolute;
  inset: 0% 0% auto;
}

.service-4 {
  font-family: Avertape, sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 34px;
  display: none;
  position: absolute;
  inset: 0%;
}

.home-header-scroll-cta {
  flex-direction: column;
  align-items: center;
  width: 3px;
  height: 35px;
  display: flex;
  position: absolute;
  inset: auto 0% 0% auto;
}

.scroll-dwon-line {
  background-color: var(--black);
  width: 1px;
  height: 35px;
}

.big-cercle {
  background-color: var(--black);
  border-radius: 100%;
  width: 75px;
  height: 75px;
  position: absolute;
}

.small-cercle {
  background-color: var(--black);
  border-radius: 100%;
  width: 50px;
  height: 50px;
}

.wrapp {
  z-index: 1;
  filter: blur(10px);
  flex-direction: column;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.overlay-dodge {
  z-index: 2;
  mix-blend-mode: color-dodge;
  background-color: gray;
  display: flex;
  position: absolute;
  inset: 0%;
}

.overlay-burn {
  z-index: 3;
  background-color: var(--black);
  mix-blend-mode: color-burn;
  display: flex;
  position: absolute;
  inset: 0%;
}

.text-block-151 {
  color: var(--white);
}

.liquid-activate {
  z-index: 5;
  border: .5px solid var(--body);
  cursor: pointer;
  margin-bottom: 50px;
  padding: 20px;
  transition: border-width .5s cubic-bezier(.23, 1, .32, 1);
  position: absolute;
  inset: auto auto 0%;
}

.liquid-activate:hover {
  border-width: 2px;
  border-color: var(--black);
}

.liquid-activate:active {
  border-color: var(--indian-red);
}

.overlay-color {
  z-index: 3;
  background-color: var(--dodger-blue);
  display: none;
  position: absolute;
  inset: 0%;
}

.button-2 {
  z-index: 4;
  border: .5px solid var(--black);
  background-color: var(--white);
  color: var(--body);
  justify-content: center;
  align-items: center;
  height: 50px;
  margin-bottom: 50px;
  transition: all .5s cubic-bezier(.075, .82, .165, 1);
  display: flex;
  position: absolute;
  inset: auto auto 0%;
}

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

.button-2:active {
  border-color: var(--indian-red);
}

.consultations-form-wrapp {
  justify-content: center;
  align-items: center;
  position: relative;
}

.image-107 {
  flex: none;
  max-width: none;
  height: 100%;
  display: block;
}

.home-header-video-embed {
  flex-direction: row;
  flex: none;
  place-content: flex-start center;
  align-items: flex-start;
  width: 100%;
  display: flex;
  position: relative;
  inset: 0% auto auto;
}

.home-header-video-embed.mobile {
  display: none;
}

.loading-gif {
  opacity: 1;
  filter: none;
  margin-right: 3px;
  display: none;
  transform: scale(.4);
}

.form-field-error {
  color: var(--body);
  margin-top: 10px;
  margin-left: 37px;
  margin-right: 50px;
  font-family: Avertape, sans-serif;
  font-size: 14px;
  font-style: italic;
  line-height: 18px;
  display: none;
  position: absolute;
  top: 100%;
}

.consultations-form-section {
  justify-content: center;
  align-items: center;
  height: 100vh;
  padding: 150px 100px;
  display: flex;
  position: relative;
}

.footer-link-block {
  color: var(--body);
  height: 35px;
  padding: 10px 5px;
  font-family: Avertape, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-decoration: none;
  position: relative;
}

.footer-link-dash {
  background-color: var(--body);
  width: 100%;
  height: 1px;
  margin-top: 1px;
  display: none;
  position: relative;
  inset: auto auto 0%;
}

.footer-section-title {
  color: #33333380;
  text-transform: uppercase;
  margin-left: 5px;
  font-family: Avertape, sans-serif;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
  position: relative;
}

.footer-wrapp {
  grid-column-gap: 15px;
  margin-right: -5px;
  display: flex;
  position: relative;
}

.footer-wrapp.wide {
  grid-column-gap: 25px;
}

.footer-wrapp-wide {
  grid-column-gap: 25px;
  display: flex;
  position: relative;
}

.footer-wrapp-wide.wide {
  grid-column-gap: 25px;
}

.local-time {
  height: 16px;
}

.contacts-title-wrapp {
  max-width: 560px;
  margin-bottom: 50px;
}

.contacts-sub-head {
  color: var(--body);
  margin-top: 15px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  line-height: 24px;
  position: relative;
}

.contacts-section-wrapp {
  z-index: 8;
  grid-column-gap: 25px;
  flex-direction: column;
  place-content: flex-end flex-start;
  align-items: flex-start;
  margin-bottom: 50px;
  display: flex;
  position: relative;
}

.contacts-section-wrapp.left {
  justify-content: flex-start;
  margin-left: -15px;
}

.imput-field {
  opacity: 1;
  color: var(--body);
  border: 1px #000;
  border-bottom-style: solid;
  margin-bottom: 0;
  padding: 0;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 20px;
  position: relative;
}

.imput-field:active, .imput-field:focus {
  border-bottom-color: var(--black);
  opacity: 100;
}

.imput-field::placeholder {
  color: #33333326;
}

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

.field-label {
  color: var(--body);
  text-transform: uppercase;
  margin-bottom: 10px;
  font-family: Avertape, sans-serif;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
}

.contacts-form-wrapp {
  grid-column-gap: 75px;
  width: 100%;
  margin-bottom: 75px;
}

.contacts-form {
  display: flex;
}

.form-field-single {
  flex-direction: column;
  width: 100%;
  margin-bottom: 50px;
  display: flex;
  position: relative;
}

.form-field-single.clear {
  margin-bottom: 0;
}

.form-field-single.hide {
  display: flex;
}

.form-grid {
  grid-column-gap: 75px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
}

.select-field {
  color: var(--body);
  background-color: #0000;
  border: 1px #000;
  border-bottom-style: solid;
  max-width: 275px;
  margin-bottom: 0;
  padding: 0 0 13px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 600;
  position: relative;
}

.select-field:focus {
  border-bottom-color: var(--black);
}

.select-field.hide {
  display: none;
}

.contacts-submit-btn {
  z-index: 1;
  background-color: var(--yellow);
  flex: 1;
  width: 100%;
  height: 75px;
  position: absolute;
}

.contacts-submit-btn.consultations {
  inset: 0%;
}

.textarea {
  color: var(--body);
  border: 1px #000;
  border-bottom-style: solid;
  flex: none;
  height: 190px;
  margin-bottom: 0;
  padding: 0 0 13px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 600;
  position: relative;
}

.textarea:focus {
  border-bottom-color: var(--black);
}

.textarea::placeholder {
  color: var(--body);
}

.contacts-form-btn-wrapp {
  text-transform: capitalize;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 75px;
  height: 75px;
  padding-left: 25px;
  padding-right: 25px;
  font-family: Avertape, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  display: flex;
  position: relative;
}

.contacts-form-btn-wrapp.consultations {
  justify-content: space-between;
  width: 100%;
  transition: all .45s cubic-bezier(.165, .84, .44, 1);
}

.contacts-form-btn-wrapp.consultations:hover {
  padding-right: 20px;
}

.submit-icon {
  z-index: 3;
  width: 9px;
  position: absolute;
}

.submit-icon.consultations {
  position: relative;
}

.form-row {
  grid-column-gap: 75px;
  justify-content: space-between;
  align-items: flex-end;
  padding-bottom: 0;
  display: flex;
  position: relative;
}

.form-row.consultations {
  grid-column-gap: 75px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.form-field-single-error {
  color: var(--indian-red);
  font-family: Avertape, sans-serif;
  font-weight: 400;
  display: block;
  position: absolute;
  inset: auto 0% -40%;
}

.submit-loading {
  z-index: 2;
  opacity: 0;
  flex: 0 auto;
  display: block;
  position: absolute;
  transform: scale(.3);
}

.contacts-gallery {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.icon-3, .icon-4, .slide-nav-2 {
  display: none;
}

.local-time-script {
  width: 0;
  height: 0;
  margin-bottom: 0;
}

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

.success-content-wrapp {
  z-index: 2;
  align-items: center;
  min-height: 80vh;
  margin-top: 100px;
  padding: 15vh 100px;
  display: flex;
  position: relative;
}

.slide-1 {
  position: relative;
}

.right-arrow-2, .left-arrow-2 {
  display: none;
}

.consultations-page-wrapp {
  z-index: 2;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  height: 100vh;
  display: grid;
  position: relative;
}

.consultations-content-wrapp {
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  max-width: 100%;
  padding: 175px 50px 50px 100px;
  display: flex;
  position: relative;
  overflow: scroll;
}

.consultations-content-wrapp.img-bg {
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  overflow: hidden;
}

.consultations-content {
  position: relative;
}

.consultations-content.first {
  width: 100%;
}

.consultations-content.second {
  width: 100%;
  display: block;
}

.consultations-next {
  background-color: var(--yellow);
  color: var(--body);
  text-align: center;
  text-transform: uppercase;
  justify-content: space-between;
  align-items: center;
  width: 165px;
  height: 50px;
  padding: 10px 15px 10px 25px;
  font-family: Avertape, sans-serif;
  font-weight: 400;
  text-decoration: none;
  transition: all .75s cubic-bezier(.23, 1, .32, 1);
  display: flex;
  position: relative;
}

.portfolio-btn {
  z-index: 2;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: var(--body);
  text-align: center;
  text-transform: uppercase;
  background-color: #ffffff80;
  border: .5px solid #33333380;
  justify-content: space-between;
  align-items: center;
  width: 200px;
  height: 50px;
  margin-bottom: 50px;
  margin-right: 50px;
  padding-left: 25px;
  padding-right: 25px;
  font-family: Avertape, sans-serif;
  text-decoration: none;
  transition: all .75s cubic-bezier(.23, 1, .32, 1);
  display: flex;
  position: absolute;
  inset: auto 0% 0% auto;
  overflow: hidden;
}

.image-108 {
  position: absolute;
  inset: auto 25px auto auto;
}

.portfolio-lottie {
  flex: 0 auto;
  width: 15px;
  height: 15px;
  position: relative;
  transform: none;
}

.consultation-btn-lottie {
  height: 20px;
}

.consultation-btn-lottie.first {
  filter: none;
  width: 25px;
  height: 25px;
  position: relative;
  transform: none;
}

.consultation-img {
  max-width: none;
  height: 100%;
  display: none;
  position: absolute;
  inset: 0% auto;
  transform: scale(1.2);
}

.consultations-btn-copy {
  z-index: 2;
  position: relative;
}

.contacts-consultations {
  flex-direction: column;
  align-items: flex-start;
  display: block;
}

.consultations-form {
  margin-bottom: 0;
  display: block;
  position: relative;
}

.contacts-form-wrapper {
  grid-column-gap: 75px;
  margin-bottom: 0;
  position: relative;
}

.html-embed-11 {
  display: none;
}

.contact-links {
  flex-direction: column;
  align-items: flex-start;
  margin-top: 75px;
  display: block;
  position: relative;
}

.consutlations-sub-head {
  color: var(--body);
  margin-top: 15px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  line-height: 20px;
  position: relative;
}

.case-thumb-video {
  position: relative;
}

.btn-overlay {
  z-index: 2;
  background-color: var(--yellow);
  display: none;
  position: absolute;
}

.div-block-93 {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  padding-left: 15vw;
  padding-right: 15vw;
  display: flex;
}

.slider-2 {
  width: 100%;
  height: 75vh;
}

.grain-overlay {
  z-index: 1;
  background-color: var(--white);
  opacity: .5;
  filter: brightness(150%);
  object-fit: cover;
  width: 100%;
  height: 100vh;
  margin-bottom: 0;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: visible;
}

.body-home {
  background-color: #0000;
}

.body-10 {
  justify-content: center;
  align-items: center;
  display: flex;
}

.baad-header {
  z-index: 2;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 15vh;
  display: flex;
  position: relative;
}

.background {
  position: fixed;
  inset: 0%;
}

.baad-bg-img {
  max-width: none;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.effect-test {
  z-index: 1;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-image: linear-gradient(to right, #0000, #ffffff40 50%, #0000);
  width: 35vw;
  height: 100vh;
  position: relative;
  transform: none;
}

.baad-content {
  z-index: 1;
  padding: 10vh 10vw 15vh;
  position: relative;
}

.baad-title {
  margin-top: 0;
  margin-bottom: 5vh;
  font-family: Montserrat, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 36px;
}

.text-block-152 {
  font-family: Montserrat, sans-serif;
  font-weight: 500;
  line-height: 25px;
}

.bold-text-7 {
  color: #00c6c3;
}

.spline-area {
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 100vh;
  display: flex;
  position: relative;
}

.spline-title {
  z-index: 1;
  opacity: .95;
  color: #333;
  text-align: center;
  max-width: 70vw;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Raleway, sans-serif;
  font-size: 120px;
  font-weight: 900;
  line-height: 120px;
  display: flex;
  position: relative;
}

.spline-test {
  z-index: 2;
  position: absolute;
  inset: 0%;
}

.scroll-area {
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 1200vh;
  display: flex;
  position: relative;
}

.sticky-holder {
  z-index: 1;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.guide {
  z-index: 2;
  background-color: #cc4343;
  height: 10vh;
  display: none;
  position: absolute;
  inset: auto 0% 0%;
}

.guide.top {
  transform-style: preserve-3d;
  background-image: none;
  inset: 0% 0% auto;
  transform: perspective(25px);
}

.guide.new {
  z-index: 2;
  background-color: #4381cc;
  position: absolute;
  inset: 0% 0% auto;
}

.guide-copy {
  z-index: 2;
  background-color: #cc4343;
  height: 10vh;
  margin-top: -310px;
  position: absolute;
  inset: -26% 0% auto;
}

.guide-copy.top {
  transform-style: preserve-3d;
  background-image: none;
  inset: 0% 0% auto;
  transform: perspective(25px);
}

.guide-copy.new {
  z-index: 2;
  background-color: #4381cc;
  position: absolute;
  inset: 0% 0% auto;
}

.div-block-94 {
  z-index: 4;
  background-color: #be3e3e82;
  width: 50%;
  height: 100vh;
  display: none;
  position: fixed;
  inset: 0%;
}

.spline-btn {
  z-index: 1;
  background-color: var(--brand-grey);
  color: #e7e7e7;
  text-align: center;
  letter-spacing: .25px;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 50px;
  font-family: Raleway, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  display: none;
  position: relative;
  box-shadow: -6px 8px 15px #00000080;
}

.lottie-animation-11 {
  width: 250px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.spline-scroll-lottie {
  width: 8vw;
  margin-bottom: 2vh;
  margin-right: 0;
  position: absolute;
  inset: auto 0% 0% auto;
}

.image-109 {
  max-width: 100vw;
  position: absolute;
  inset: 0%;
}

.spline-bg {
  background-image: linear-gradient(#ffdb75e6, #ffdb75e6);
  position: absolute;
  inset: 0%;
}

.text-block-153 {
  z-index: 2;
  color: #333;
  font-family: Cygre, sans-serif;
  font-size: 14px;
  line-height: 18px;
  position: relative;
}

.div-block-95 {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
}

.text-block-154 {
  font-family: Cygre, sans-serif;
  font-size: 12px;
  font-weight: 500;
}

.text-block-154-copy {
  font-family: Cygre, sans-serif;
  font-size: 14px;
  font-weight: 500;
}

.text-block-154-copy-copy {
  font-family: Cygre, sans-serif;
  font-size: 16px;
  font-weight: 500;
}

.div-block-96 {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-direction: column;
  width: 50%;
  display: flex;
}

.div-block-97 {
  grid-column-gap: 100px;
  grid-row-gap: 100px;
  width: 50vw;
  display: flex;
}

.text-block-154-copy-copy-copy {
  font-family: Cygre, sans-serif;
  font-size: 20px;
  font-weight: 500;
}

.text-block-154-copy-copy-copy-copy {
  font-family: Cygre, sans-serif;
  font-size: 16px;
}

.text-block-154-copy-copy-copy-copy-copy {
  font-family: Cygre, sans-serif;
  font-size: 20px;
}

.image-110 {
  margin-top: -5px;
  transform: scale(1.2);
}

.image-111 {
  margin-top: -7px;
}

.div-block-98 {
  z-index: 1;
  mix-blend-mode: difference;
  flex-direction: column;
  align-items: stretch;
  transition: all .2s;
  position: relative;
}

.work-layout {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding: 100px;
}

.work-column {
  flex-direction: column;
  width: 49%;
}

.case-link {
  margin-bottom: 50px;
  text-decoration: none;
  display: block;
}

.case-thumb {
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  place-content: end center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.play-pause-button {
  display: none;
}

.background-video-17 {
  position: absolute;
  inset: 0%;
}

.html-embed-12 {
  display: none;
}

.background-video-18 {
  flex: 1;
}

.video-thumb {
  z-index: 1;
  position: relative;
}

.case-thumb-h-t-wrapp {
  z-index: 3;
  pointer-events: none;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 1%;
  height: 1%;
  display: flex;
  position: absolute;
  inset: auto;
}

.case-thumb-h-text {
  color: #000;
  text-align: center;
  margin-bottom: -75px;
  margin-left: 10px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 14px;
  position: relative;
}

.work-row {
  grid-column-gap: 1vw;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.div-block-99 {
  z-index: 1;
  background-color: #333;
  width: 100%;
  height: 50%;
  position: absolute;
  inset: 0%;
}

.div-block-99-copy {
  z-index: 1;
  background-color: #fff;
  width: 100%;
  height: 50%;
  position: absolute;
  inset: auto 0% 0%;
}

.case-thumb-mobile {
  display: none;
}

.client-logo-img {
  opacity: 100;
}

.client-logo-img-1 {
  margin-top: -7px;
}

.nav-btn {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  background-color: var(--yellow);
  opacity: 1;
  flex: 0 auto;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  margin-bottom: -10px;
  padding: 15px 25px;
  font-family: Avertape, sans-serif;
  font-size: 16px;
  transition: all .5s cubic-bezier(.23, 1, .32, 1);
  display: flex;
  position: relative;
}

.nav-btn:hover {
  margin-bottom: -5px;
}

.nav-btn-link {
  position: absolute;
  inset: 0%;
}

.nav-btn-arrow {
  margin-top: 2px;
}

.yt-player-test {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  padding-left: 10vw;
  padding-right: 10vw;
  display: flex;
  position: relative;
}

.youtube {
  width: 80%;
  position: absolute;
}

.div-block-100 {
  background-color: #964f4f;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 60vh;
  display: flex;
  position: relative;
}

.youtube-2 {
  border-radius: 20px;
  flex: none;
  width: 100%;
  overflow: hidden;
}

.axio-header {
  flex-flow: row;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: flex-start;
  height: 100vh;
  display: flex;
  position: relative;
  inset: 0%;
  overflow: hidden;
}

.nav-img {
  z-index: 5;
  opacity: .8;
  flex: none;
  width: 1280px;
  max-width: 90%;
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: fixed;
  inset: 0% 0% auto;
}

.image-112 {
  z-index: 2;
  opacity: .8;
  margin-top: 50px;
  display: block;
  position: absolute;
  inset: 0%;
}

.background-video-19 {
  height: 100%;
  display: none;
  position: absolute;
  inset: 0%;
}

.lottie-animation-12 {
  z-index: 1;
  align-self: flex-start;
  position: absolute;
  inset: auto 0%;
}

.div-block-101 {
  height: 200vh;
}

.uc-wrap {
  background-image: url('../images/under-construction.jpg');
  background-position: 50%;
  background-size: cover;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  display: flex;
  position: relative;
}

.uc-content-wrapp {
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #ffffff26;
  border-radius: 20px;
  max-width: 60vw;
  padding: 50px;
}

.heading {
  color: #fff;
  max-width: 600px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Montserrat, sans-serif;
}

.uc-t {
  color: #fff;
  max-width: 500px;
  margin-top: 25px;
  font-family: Montserrat, sans-serif;
}

.uc-link {
  color: #fff;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.link-7 {
  text-decoration: none;
}

@media screen and (min-width: 1440px) {
  .section-6 {
    overflow: hidden;
  }

  .home-header, .nav-main-contents {
    padding-left: 160px;
    padding-right: 160px;
  }

  .header-content.home {
    padding-top: 100px;
  }

  .pattern {
    display: none;
  }

  .row-1 {
    grid-template-rows: 90vh;
    grid-template-areas: "Area . Area-2";
    max-width: 100%;
    max-height: none;
  }

  .clients {
    margin-top: 150px;
    margin-bottom: 150px;
  }

  .footer-contents, .about-header.contacts {
    padding-left: 160px;
    padding-right: 160px;
  }

  .about-header-description {
    padding-top: 10px;
  }

  .mail-us {
    margin-right: 160px;
  }

  .row-2 {
    grid-template-rows: 90vh;
    max-width: 100%;
    max-height: none;
  }

  .project-details-cta {
    margin-right: 160px;
  }

  .case-details-wrapper {
    display: none;
  }

  .case-details-text-grid {
    grid-column-gap: 160px;
    grid-row-gap: 60px;
  }

  .home-header-main-serv {
    margin-left: 160px;
  }

  .scroll-down-wrapp {
    display: flex;
  }

  .case-two-wrapp, .case-section-mid, .case-section-mid-video {
    padding-left: 160px;
    padding-right: 160px;
  }

  .box-area {
    perspective: 1000px;
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .mask-gradient {
    background-size: cover, auto, auto, auto;
  }

  .winners-content-wrapp {
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .br-winners-grid {
    width: 80%;
  }

  .br-winners-grid-big {
    width: 50%;
  }

  .case-short-content-wrapp {
    padding-left: 160px;
    padding-right: 160px;
  }

  .case-short-text-content {
    grid-column-gap: 160px;
    grid-row-gap: 160px;
  }

  .case-other-section {
    padding-left: 160px;
    padding-right: 160px;
  }

  .case-other-content-wrapp {
    grid-template-rows: 60vh;
  }

  .team-grid {
    grid-template-columns: minmax(220px, 320px) minmax(220px, 320px) minmax(220px, 320px);
  }

  .process {
    padding-top: 150px;
    padding-bottom: 150px;
  }

  .process-wrapp {
    top: 0;
  }

  .skills-text-wrapp {
    margin-top: 20px;
  }

  .process-holder {
    width: 100%;
  }

  ._404-title {
    margin-top: 75px;
  }

  ._404-button {
    margin-top: 50px;
  }

  .case-thumb-title {
    font-size: 32px;
    line-height: 36px;
  }

  .case-thumb-more {
    z-index: 4;
    position: absolute;
  }

  .case-thumb-overlay {
    background-color: #fff0;
  }

  .selected-work-section {
    padding-left: 160px;
    padding-right: 160px;
  }

  .img-grid-section {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    padding-left: 160px;
    padding-right: 160px;
    display: block;
  }

  .layout-title-wrapp {
    padding-left: 160px;
    padding-right: 160px;
  }

  .img-scroll-reveal-img {
    width: 100%;
  }

  .next-project-section {
    justify-content: center;
  }

  .frame-left, .frame-right, .frame-top, .frame-bot {
    display: none;
  }

  .firts-section-content-wrapp {
    margin-left: 160px;
  }

  .home-header-new {
    padding-bottom: 100px;
    padding-left: 160px;
    padding-right: 160px;
  }

  .home-header-content {
    margin-bottom: 50px;
    padding-top: 15vh;
  }

  .home-header-title {
    flex: 1;
  }

  .success-content-wrapp {
    padding-left: 160px;
    padding-right: 160px;
  }

  .consultations-content-wrapp {
    padding-left: 160px;
    padding-right: 100px;
  }

  .portfolio-btn {
    margin-bottom: 100px;
    margin-right: 100px;
  }

  .work-layout {
    padding-left: 160px;
    padding-right: 160px;
  }
}

@media screen and (min-width: 1920px) {
  .scroll-elements {
    margin-top: 100vh;
  }

  .home-header, .nav-main-contents {
    padding-left: 320px;
    padding-right: 320px;
  }

  .header-content.home {
    align-items: center;
    height: 790px;
    padding-top: 150px;
  }

  .pattern {
    display: none;
  }

  .selected-work, .solutions {
    padding-left: 320px;
    padding-right: 320px;
  }

  .row-1 {
    grid-template-rows: 70vh;
    grid-template-columns: 2fr .5fr 3fr;
  }

  .clients-logos {
    grid-template-columns: minmax(100px, 250px) minmax(100px, 250px) minmax(100px, 250px) repeat(auto-fit, minmax(100px, 250px)) minmax(100px, 250px) 200px;
    place-content: space-between;
    place-items: stretch stretch;
  }

  .clients, .footer-contents {
    padding-left: 320px;
    padding-right: 320px;
  }

  .about-header {
    cursor: auto;
    padding-left: 320px;
    padding-right: 320px;
  }

  .about-header.contacts, .skills {
    padding-left: 320px;
    padding-right: 320px;
  }

  .team {
    flex-direction: row;
    justify-content: space-between;
    padding-left: 320px;
    padding-right: 320px;
  }

  .cursor-magic-vp-top {
    cursor: none;
  }

  .mail-us {
    margin-right: 245px;
  }

  .row-2 {
    grid-template-rows: 70vh;
    margin-bottom: 80px;
    position: relative;
    overflow: visible;
  }

  .project-details-cta {
    margin-right: 245px;
  }

  .case-details-wrapper {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    padding-left: 320px;
    padding-right: 320px;
  }

  .case-details-text-grid {
    grid-column-gap: 320px;
    grid-row-gap: 60px;
  }

  .case-details-close {
    margin-right: 245px;
    position: fixed;
  }

  .home-header-main-serv {
    margin-left: 320px;
    display: flex;
  }

  .case-section-full {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .case-full-wrapp, .case-full-image-element {
    flex: 1;
  }

  .case-two-wrapp {
    padding-left: 320px;
    padding-right: 320px;
  }

  .case-section-mid {
    justify-content: center;
    align-items: center;
    padding-left: 320px;
    padding-right: 320px;
    display: flex;
  }

  .case-section-mid-video {
    padding-left: 320px;
    padding-right: 320px;
  }

  .inner-magic-2 {
    z-index: 4;
    flex: none;
    width: 12px;
    height: 12px;
    position: absolute;
    inset: auto;
  }

  .inner-magic-3 {
    z-index: 3;
    flex: none;
    width: 10px;
    height: 10px;
    position: absolute;
    inset: auto;
  }

  .inner-magic-4 {
    z-index: 2;
    flex: none;
    width: 8px;
    height: 8px;
    position: absolute;
    inset: auto;
  }

  .inner-magic-5 {
    z-index: 1;
    flex: none;
    width: 5px;
    height: 5px;
    position: absolute;
  }

  .cursor-wrapper {
    flex-wrap: nowrap;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 25px;
    display: flex;
    position: fixed;
  }

  .inner-magic-6, .inner-magic-7, .inner-magic-8, .inner-magic-9 {
    z-index: 1;
    flex: none;
    width: 5px;
    height: 5px;
    position: absolute;
  }

  .inner-magic-1-top {
    z-index: 5;
    flex: none;
    width: 14px;
    height: 14px;
    position: absolute;
    inset: auto;
  }

  .mask-gradient {
    background-size: cover, auto, auto, auto;
  }

  .bottle-nav, .b-footer {
    padding-left: 150px;
    padding-right: 150px;
  }

  .winners-content-wrapp {
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .br-winners-grid {
    width: 80%;
  }

  .br-winners-grid-big {
    justify-content: space-around;
    justify-items: center;
    width: 75%;
  }

  .case-short-content-wrapp {
    padding-left: 320px;
    padding-right: 320px;
  }

  .case-short-text-content {
    grid-column-gap: 320px;
    grid-row-gap: 320px;
  }

  .case-other-section {
    padding-left: 320px;
    padding-right: 320px;
  }

  .team-grid {
    margin-top: 84px;
  }

  .process-wrapp {
    top: 0;
  }

  .point-1 {
    position: absolute;
  }

  .p-line-1-wrapp {
    margin-left: 320px;
  }

  .skills-row-2, .skills-row-4 {
    text-align: right;
  }

  .skills-row-6 {
    text-align: right;
    inset: 0% 0% 0% auto;
  }

  .contacts-img-gallery-wrapp {
    flex: 0 auto;
  }

  .slider-image {
    flex: 1;
    width: 100%;
    position: relative;
    inset: 0%;
  }

  .contacts-content-grid {
    grid-template-columns: 1fr .65fr;
  }

  .process-holder {
    width: 100%;
  }

  ._404-title {
    margin-top: 100px;
  }

  ._404-button {
    margin-top: 75px;
  }

  .image-104, .lottie-animation-8 {
    object-fit: cover;
  }

  .selected-work-section {
    padding-left: 320px;
    padding-right: 320px;
  }

  .img-grid-section {
    padding-left: 320px;
    padding-right: 320px;
    position: relative;
  }

  .img-grid {
    position: relative;
  }

  .full-width-img-element {
    flex: 1;
  }

  .layout-title-wrapp {
    padding-left: 320px;
    padding-right: 320px;
  }

  .img-scroll-reveal-img {
    align-self: center;
    width: 100%;
    inset: 0%;
  }

  .next-project-thumb-img {
    transform: scale(1.2);
  }

  .firts-section-content-wrapp {
    margin-left: 320px;
  }

  .home-header-new {
    padding-bottom: 175px;
    padding-left: 320px;
    padding-right: 320px;
  }

  .home-header-content {
    margin-bottom: 50px;
  }

  .home-header-bg {
    overflow: hidden;
  }

  .background-video-16 {
    align-self: center;
  }

  .success-content-wrapp {
    padding-left: 320px;
    padding-right: 320px;
  }

  .consultations-content-wrapp {
    padding-left: 320px;
  }

  .div-block-95 {
    flex-direction: column;
    align-items: flex-start;
    height: 100vh;
    padding-left: 35vw;
  }

  .text-block-154 {
    font-family: Cygre, sans-serif;
    font-size: 12px;
    font-weight: 400;
  }

  .text-block-154-copy {
    font-family: Cygre, sans-serif;
    font-weight: 400;
  }

  .text-block-154-copy-copy, .text-block-154-copy-copy-copy, .text-block-154-copy-copy-copy, .text-block-154-copy-copy-copy, .text-block-154-copy-copy-copy-copy, .text-block-154-copy-copy-copy-copy, .text-block-154-copy-copy-copy-copy-copy {
    font-family: Cygre, sans-serif;
    font-size: 20px;
    font-weight: 400;
  }

  .work-layout {
    padding-left: 320px;
    padding-right: 320px;
  }

  .axio-header {
    height: 100vh;
  }

  .nav-img {
    width: 100%;
    position: absolute;
    inset: 0% 0% auto;
  }

  .uc-wrap {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .uc-content-wrapp {
    padding: 50px;
  }

  .heading, .uc-t {
    color: #fff;
    font-family: Montserrat, sans-serif;
  }
}

@media screen and (max-width: 991px) {
  .slider {
    height: 450px;
  }

  .grid-2 {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .slider-videos {
    height: 350px;
  }

  .home-header {
    height: 640px;
    padding-left: 50px;
    padding-right: 50px;
  }

  .nav-main-contents {
    padding-left: 50px;
    padding-right: 50px;
  }

  .header-content {
    padding-left: 50px;
  }

  .header-content.contacts {
    flex-direction: column;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: flex;
  }

  .pattern {
    background-color: var(--yellow);
    width: 105%;
    margin-left: -50px;
  }

  .selected-work {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-title {
    width: 100%;
  }

  .solutions {
    height: auto;
    margin-top: 150px;
    padding-left: 0;
    padding-right: 50px;
  }

  .row-1 {
    grid-row-gap: 80px;
    grid-template: "Area" minmax(500px, 1fr)
                   "Area-2" minmax(500px, 1fr)
                   / minmax(300px, 953px);
    grid-auto-flow: row;
    max-height: none;
  }

  .div-block-52 {
    margin-left: 0;
    padding-left: 50px;
  }

  .solutions-right {
    padding-left: 50px;
  }

  .clients-logos {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .clients {
    padding-left: 25px;
    padding-right: 25px;
  }

  .footer-section-wrapp {
    margin-bottom: 0;
  }

  .footer-address {
    margin-left: 25px;
    display: none;
  }

  .footer-contents {
    align-items: flex-start;
    padding-left: 50px;
    padding-right: 50px;
  }

  .footer-social-link, .link-block-19, .link-block-20 {
    margin-left: 15px;
  }

  .div-block-50-copy {
    justify-content: space-around;
  }

  .body-case {
    cursor: default;
  }

  .clicks-underline {
    width: 170px;
    top: 135px;
    left: 202px;
  }

  .about-header, .capabilities {
    padding-left: 50px;
    padding-right: 50px;
  }

  .section-title-big {
    height: 500px;
    padding-top: 100px;
    padding-left: 50px;
  }

  .text-block-125 {
    font-size: 90px;
    line-height: 110px;
  }

  .capabiliti-title-and-text {
    padding-left: 50px;
  }

  .skills, .team {
    padding-left: 50px;
    padding-right: 50px;
  }

  .team-left {
    margin-bottom: 50px;
    padding-left: 0;
  }

  .yellow-dash-header.contacts {
    display: none;
  }

  .skills-wrapp {
    padding-left: 50px;
  }

  .cursor-magic-vp-top {
    display: none;
  }

  .yellow-dash---team {
    margin-left: 0;
  }

  .mail-us {
    margin-right: 50px;
  }

  .row-2 {
    grid-row-gap: 80px;
    grid-template: "Area" minmax(500px, 1fr)
                   "Area-2" minmax(500px, 1fr)
                   / minmax(300px, 953px);
    max-height: none;
    margin-top: 80px;
  }

  .case-wrapp {
    background-color: #0000;
    background-image: none;
    display: block;
  }

  .case-link-wrapp {
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto;
  }

  .case-cta-more {
    justify-content: space-around;
  }

  .case-text-wrapp {
    align-self: flex-start;
    position: static;
  }

  .case-hover-overlay {
    flex: none;
    align-self: center;
  }

  .about-header-text {
    margin-left: 0;
  }

  .case-new {
    background-image: none;
    display: block;
  }

  .case-new-text {
    align-self: flex-start;
    position: static;
  }

  .mid-sized-title-b, .mid-sized-title-y {
    width: 100%;
  }

  .scroll-slider-section {
    height: 500px;
    margin-bottom: 100px;
  }

  .scroll-slider-section.beam {
    height: 500px;
    margin-bottom: 0;
  }

  .scroll-slider-area {
    align-items: center;
    top: 250px;
  }

  .project-details-cta {
    margin-right: 50px;
  }

  .case-details-wrapper {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-details-text-grid {
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
  }

  .contacts-big-title {
    margin-left: 0;
  }

  .details-links {
    margin-top: 75px;
    margin-left: 0;
  }

  .video-embed-full.consultations {
    width: 100%;
    height: auto;
    display: none;
  }

  .video-embed-full.consultations.mobile {
    display: block;
  }

  .page-load-lottie {
    margin-top: -150px;
  }

  .big-big-title-home {
    width: 580px;
    font-size: 60px;
    line-height: 70px;
  }

  .home-header-main-serv {
    align-items: flex-start;
    margin-left: 100px;
    padding-left: 0;
  }

  .case-full-width.hh {
    height: 50vh;
    margin-bottom: 100px;
  }

  .case-mid-width.hh {
    height: 50vh;
    margin-bottom: 100px;
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-full-lottie {
    height: 50vh;
    margin-top: 50px;
    margin-bottom: 150px;
  }

  .scroll-sloider-progress-wrapper {
    margin-left: 25px;
    position: absolute;
    top: 150px;
  }

  .case-section-full, .case-section-two {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .case-two-wrapp {
    grid-row-gap: 50px;
    grid-template-columns: 1fr;
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-section-mid {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-section-header {
    margin-top: 0;
    margin-bottom: 50px;
    padding-bottom: 50px;
  }

  .case-section-full-video {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .case-thumb-image {
    align-items: center;
  }

  .case-thumb-image-element {
    object-fit: cover;
    flex: 1;
    max-width: none;
    height: 100%;
    position: relative;
    inset: 0%;
    overflow: visible;
    transform: none;
  }

  .case-section-mid-video {
    padding-left: 0;
    padding-right: 0;
  }

  .content-wrapp {
    flex-direction: column;
    padding-top: 0;
  }

  .mask {
    width: 100vw;
    height: 100vh;
  }

  .mask-gradient {
    background-image: url('../images/BR-video-whole.png'), linear-gradient(#000 5%, #0000 25%), linear-gradient(to top, #000 5%, #0000 25%), radial-gradient(circle, #0000 60%, #000 80%);
    background-position: 50%, 0 0, 0 0, 0 0;
    background-repeat: no-repeat, repeat, repeat, repeat;
    background-size: 1080px, auto, auto, auto;
    justify-content: center;
    width: 100%;
  }

  .bottle-nav {
    padding-left: 50px;
    padding-right: 50px;
  }

  .bottle-img {
    transform: scale(.9);
  }

  .b-footer {
    padding-left: 50px;
    padding-right: 50px;
  }

  .footer-wrapper {
    margin-bottom: 25px;
  }

  .check-desktop, .rottate-device {
    display: none;
  }

  .winners-section {
    padding-left: 50px;
    padding-right: 50px;
  }

  .br-winners-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .br-winners-grid-big {
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
  }

  .case-short-content-wrapp {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-short-body {
    margin-top: 10px;
  }

  .case-short-text-content {
    grid-column-gap: 35px;
    grid-row-gap: 35px;
    grid-template-columns: min-content;
  }

  .case-other-section {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-other-content-wrapp {
    grid-template-rows: 35vh;
    grid-template-columns: 3fr .5fr 3fr;
  }

  .other-text-wrapp {
    padding-bottom: 25px;
    padding-left: 25px;
  }

  .other-partner {
    white-space: nowrap;
    font-size: 14px;
    line-height: 18px;
  }

  .other-cat {
    font-size: 14px;
    line-height: 18px;
  }

  .team-member-info {
    padding-top: 15px;
    padding-left: 15px;
  }

  .title {
    white-space: nowrap;
    font-size: 14px;
    line-height: 18px;
  }

  .team-name {
    white-space: nowrap;
  }

  .team-grid {
    grid-column-gap: 25px;
    grid-row-gap: 50px;
    margin-left: 0;
  }

  .process {
    height: auto;
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .process-wrapp {
    justify-content: center;
    align-items: flex-start;
    padding-top: 25vh;
    display: block;
  }

  .process-line-1-wrapp, .point-1, .point-2, .point-3, .process-line-2-wrapp, .point-4, .point-5 {
    display: none;
  }

  .p-line-1-wrapp {
    flex-direction: column;
    justify-content: space-between;
    margin-left: 0;
    padding-top: 25px;
    padding-bottom: 0;
    display: flex;
  }

  .p-line-1-content-1 {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 100vh;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .p-line-2-wrapp {
    flex-direction: column;
    align-items: center;
    margin-top: 0;
    margin-left: 0;
    padding-top: 0;
    padding-bottom: 50px;
    padding-left: 0;
    display: flex;
  }

  .p-line-1-content-2, .p-line-1-content-3, .p-line-1-content-4 {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 100vh;
    margin-top: 50px;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .p-line-1-content-5 {
    flex-direction: column;
    align-items: center;
    width: auto;
    height: 100vh;
    margin-top: 50px;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .contacts-img-gallery-wrapp {
    order: -1;
    margin-top: 0;
    margin-bottom: 80px;
    margin-left: 0;
  }

  .contacts-content-grid {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
  }

  .process-holder {
    position: absolute;
    inset: 0%;
  }

  .process-indicator-m {
    border: 1px solid var(--gainsboro);
    border-radius: 1000px;
    justify-content: center;
    align-items: center;
    width: 75px;
    height: 75px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    position: relative;
  }

  .process-indicatior-type {
    font-family: Avertape, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    position: absolute;
  }

  .process-indicator-number-holder {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  ._404-body {
    margin-top: 10px;
  }

  .cta-plus-icon {
    flex-wrap: wrap;
  }

  .cases-grid-column._03, .cases-grid.desktop {
    display: none;
  }

  .cases-grid.tablet {
    grid-column-gap: 0px;
    grid-row-gap: 16px;
    grid-template-rows: auto;
    grid-template-columns: 2fr minmax(25px, .25fr) 2fr;
    grid-auto-columns: minmax(auto, auto);
    display: grid;
  }

  .cases-grid.mobile, .case-thumb-more, .case-thumb-overlay {
    display: none;
  }

  .selected-work-section {
    padding-left: 50px;
    padding-right: 50px;
    display: block;
  }

  .full-width-img {
    height: 65vh;
  }

  .img-grid-section {
    padding-left: 50px;
    padding-right: 50px;
  }

  .reveal-slider-section {
    align-items: center;
    padding-left: 50px;
    padding-right: 50px;
  }

  .layout-title-wrapp {
    padding-left: 50px;
    padding-right: 50px;
  }

  .reveal-slider-img-wrapp {
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    min-height: 40vh;
  }

  .reveal-slider-img-wrapp.top-wrapp {
    background-position: 50%;
    background-size: contain;
  }

  .reveal-ui-wrapp {
    display: none;
  }

  .img-scroll-reveal-section {
    align-items: center;
    height: 75vh;
    display: flex;
  }

  .next-project-thumb-img {
    min-width: auto;
    max-width: none;
    height: 105vh;
    transform: scale(1.2);
  }

  .next-project-cta {
    white-space: nowrap;
    font-size: 14px;
    line-height: 18px;
  }

  .case-grid {
    grid-template-columns: 1fr 1fr;
  }

  .scroll-down-lottie-next {
    margin-bottom: -75px;
    margin-right: 50px;
  }

  .firts-section-content-wrapp {
    margin-bottom: 25px;
    margin-left: 50px;
  }

  .home-header-new {
    padding-left: 50px;
    padding-right: 50px;
  }

  .home-header-title {
    font-size: 60px;
    line-height: 70px;
  }

  .footer-wrapp {
    flex-direction: row;
  }

  .footer-wrapp-wide {
    flex-direction: column;
  }

  .contacts-section-wrapp {
    margin-bottom: 25px;
  }

  .contacts-form {
    margin-top: 50px;
    margin-bottom: 0;
  }

  .contacts-gallery {
    background-color: #0000;
    height: auto;
  }

  .consultations-page-wrapp {
    grid-template-rows: min-content auto;
    grid-template-columns: 1fr;
  }

  .consultations-content-wrapp {
    padding-left: 50px;
  }

  .consultations-content-wrapp.img-bg {
    height: 100vh;
    margin-top: 50px;
    padding-top: 0;
  }

  .consultations-content.first {
    width: 100%;
  }

  .contacts-consultations {
    margin-top: 75px;
    margin-left: 0;
  }

  .consultations-form {
    margin-top: 50px;
    margin-bottom: 0;
  }

  .contact-links {
    margin-top: 75px;
    margin-left: 0;
  }

  .spline-test {
    inset: 0%;
  }

  .work-layout {
    flex-direction: column;
    padding-left: 50px;
    padding-right: 50px;
  }

  .work-column {
    width: 100%;
  }

  .video-thumb, .case-thumb-h-t-wrapp {
    display: none;
  }

  .work-row {
    grid-template-columns: 1fr;
  }

  .case-thumb-mobile {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .logo-address-footer {
    justify-content: space-between;
    align-items: stretch;
  }

  .slider {
    height: 350px;
    margin-left: 50px;
    margin-right: 50px;
  }

  .grid-2 {
    grid-template-columns: 1fr 1fr;
  }

  .slider-videos {
    height: 350px;
    padding-left: 50px;
    padding-right: 50px;
  }

  .grid-3 {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .left-arrow---video {
    left: 50px;
  }

  .right-arrow---video {
    right: 50px;
  }

  .home-header {
    height: 500px;
  }

  .nav-main-contents {
    height: 75px;
  }

  .nav-sections {
    flex: none;
    display: none;
  }

  .header-content.contacts {
    padding-top: 40px;
  }

  .header-content.about {
    padding-top: 0;
  }

  .header-content.home {
    padding-top: 50px;
    padding-left: 0;
  }

  .pattern {
    width: 105%;
    margin-left: -25px;
  }

  .selected-work {
    margin-top: 150px;
  }

  .row-1 {
    grid-template: "Area" 70vh
                   "Area-2" 70vh
                   / 100%;
    max-width: 100%;
  }

  .div-block-52, .solutions-right {
    margin-left: 0;
  }

  .clients-logos {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .clients {
    padding-left: 5%;
    padding-right: 5%;
  }

  .nav-logo {
    z-index: 27;
    position: relative;
  }

  .footer {
    height: auto;
  }

  .footer-section-wrapp {
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    margin-bottom: 10px;
    position: relative;
  }

  .footer-address {
    text-align: right;
    display: none;
  }

  .text-block-124 {
    text-align: right;
  }

  .nav-bg {
    z-index: 8;
    background-color: var(--white);
    height: 75px;
  }

  .footer-bg {
    align-self: flex-end;
    height: 200px;
  }

  .clicks-underline {
    top: 185px;
    left: 203px;
  }

  .about-header {
    padding-top: 150px;
    padding-left: 50px;
    padding-right: 50px;
  }

  .about-header.contacts {
    margin-bottom: 100px;
    padding-left: 50px;
    padding-right: 50px;
  }

  .about-header-description {
    margin-top: 50px;
  }

  .section-title-big {
    height: 350px;
  }

  .text-block-125 {
    font-size: 60px;
    line-height: 70px;
  }

  .capabiliti-title-and-text {
    margin-top: 200px;
  }

  .text-block-126 {
    margin-right: 0;
  }

  .div-block-64 {
    width: 450px;
  }

  .skills {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .cursor-magic-vp-top {
    display: none;
  }

  .mail-us {
    background-color: var(--yellow);
    width: 75px;
    height: 75px;
  }

  .burger-top {
    background-color: var(--black);
    border-radius: 100px;
    width: 15px;
    height: 2px;
    margin-bottom: 7px;
    padding-bottom: 0;
    padding-right: 0;
    position: relative;
  }

  .burger-link {
    z-index: 27;
    flex: none;
    justify-content: center;
    align-self: center;
    align-items: center;
    width: 50px;
    height: 50px;
    margin-top: 10px;
    display: flex;
    position: relative;
    bottom: -10px;
    right: -10px;
  }

  .burger-nav {
    flex-direction: column;
    flex: none;
    justify-content: center;
    align-items: flex-end;
    width: 25px;
    height: 25px;
    display: flex;
    position: relative;
  }

  .burger-mid {
    background-color: #0000;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 2px;
    margin-bottom: 7px;
    display: flex;
    position: relative;
  }

  .burger-bot {
    background-color: var(--black);
    border-radius: 100px;
    width: 15px;
    height: 2px;
    padding-bottom: 0;
    padding-right: 0;
    position: relative;
  }

  .mobile-nav-bg {
    z-index: 26;
    background-color: var(--white);
    flex-direction: column;
    justify-content: space-around;
    width: 100%;
    height: 100vh;
    margin-top: 75px;
    display: flex;
    inset: 0% 0% auto -100%;
  }

  .burger-mid-1 {
    background-color: var(--black);
    border-radius: 100px;
    flex: none;
    align-self: center;
    width: 25px;
    height: 2px;
    padding-bottom: 0;
    padding-right: 0;
    position: relative;
    bottom: -50%;
  }

  .burger-mid-2 {
    background-color: var(--black);
    border-radius: 100px;
    flex: none;
    align-self: center;
    width: 25px;
    height: 2px;
    padding-bottom: 0;
    padding-right: 0;
    position: relative;
    top: -50%;
  }

  .mobile-nav-contents {
    margin-top: 150px;
  }

  .text-block-138 {
    flex: 1;
    font-family: Avertape, sans-serif;
  }

  .mobile-nav-work-link {
    color: var(--black);
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-left: 125px;
    padding-right: 125px;
    font-family: Avertape, sans-serif;
    font-size: 60px;
    font-weight: 700;
    line-height: 74px;
    text-decoration: none;
    display: flex;
  }

  .vert-dash {
    transform: rotate(90deg);
  }

  .mobile-nav-about-link, .mobile-nav-contacts-link {
    color: var(--black);
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 50px;
    padding-left: 125px;
    padding-right: 125px;
    font-family: Avertape, sans-serif;
    font-size: 60px;
    font-weight: 700;
    line-height: 74px;
    text-decoration: none;
    display: flex;
  }

  .text-block-138-copy-copy, ._123123123 {
    flex: 1;
    font-family: Avertape, sans-serif;
  }

  .more-about, .more-work, .more-contacts {
    align-self: center;
  }

  .more-more-rotated {
    transform: rotate(90deg);
  }

  .row-2 {
    grid-template-rows: 70vh 70vh;
    grid-template-areas: "Area"
                         "Area-2";
    max-width: 100%;
  }

  .case-contens-wrapp {
    flex: none;
  }

  .case-text-wrapp {
    margin-bottom: 25px;
    margin-left: 25px;
  }

  .more-b-3 {
    margin-top: 25px;
    margin-right: 25px;
  }

  .about-header-text {
    flex-direction: column;
  }

  .about-big-title {
    margin-left: 0;
  }

  .more-b-new {
    margin-top: 25px;
    margin-right: 25px;
  }

  .case-new-text {
    margin-bottom: 25px;
    margin-left: 25px;
  }

  .yellow, .yellow-magic {
    opacity: 0;
    display: flex;
  }

  .next-project-link {
    flex: none;
    transform: scale(.7);
  }

  .scroll-slider-section {
    height: 450px;
    margin-bottom: 50px;
  }

  .scroll-slider-section.beam {
    height: 500px;
    margin-top: 75px;
    margin-bottom: 0;
  }

  .project-details-cta {
    width: 75px;
    height: 75px;
  }

  .project-details-text {
    opacity: 0;
    text-align: center;
    top: -25px;
  }

  .case-details-wrapper {
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px);
  }

  .case-details-text-grid {
    padding-left: 0;
  }

  .mobile-nav-ig-link {
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
    padding: 10px 15px;
  }

  .mobile-nav-be-link, .mobile-nav-fb-link, .mobile-nav-in-link {
    padding: 10px 15px;
  }

  .mobile-nav-social-icons {
    justify-content: space-around;
    align-items: center;
    width: 100%;
    margin-bottom: 75px;
    display: flex;
    position: relative;
  }

  .contacts-big-title {
    margin-left: 0;
  }

  .next-project-link-new {
    flex: none;
  }

  .big-big-title-home {
    width: 440px;
    margin-top: 50px;
    margin-left: 0;
  }

  .home-header-main-serv {
    margin-left: 50px;
  }

  .scroll-down-lottie {
    flex: none;
    align-self: center;
    inset: 0%;
  }

  .mail-us-content {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .progress-bar {
    display: none;
  }

  .mail-us-text {
    opacity: 0;
    text-align: center;
    display: none;
  }

  .case-full-width.hh {
    margin-bottom: 50px;
  }

  .scroll-sloider-progress-wrapper {
    display: none;
  }

  .case-section-mid {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .case-section-header {
    padding-top: 50px;
  }

  .case-thumb-image {
    inset: 0%;
  }

  .case-thumb-image-element {
    object-fit: cover;
    max-width: none;
    position: relative;
    inset: 0%;
    overflow: visible;
  }

  .mask {
    width: 100vw;
    height: 100vh;
  }

  .mask-gradient {
    background-image: linear-gradient(#000 5%, #0000 25%), linear-gradient(to top, #000 5%, #0000 25%), radial-gradient(circle, #0000 60%, #000 80%);
    background-position: 0 0, 0 0, 0 0;
    background-repeat: repeat, repeat, repeat;
    background-size: auto, auto, auto;
  }

  .rottate-device {
    z-index: 100;
    background-color: var(--black);
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed;
    inset: 0%;
  }

  .lottie-animation-7 {
    width: 35%;
  }

  .case-short-intro-section {
    margin-top: 150px;
  }

  .case-short-text-wrapp {
    padding-left: 0;
  }

  .case-short-text-content {
    grid-template-rows: auto auto;
  }

  .case-other-section {
    padding-left: 50px;
    padding-right: 50px;
  }

  .case-other-content-wrapp {
    grid-template-rows: 35vh;
    grid-template-columns: 3fr .25fr 3fr;
  }

  .team-grid {
    grid-template-columns: minmax(220px, 320px) minmax(220px, 320px);
  }

  .process {
    height: 800vh;
    padding-top: 50px;
    padding-bottom: 50px;
    position: relative;
    top: auto;
  }

  .process-wrapp {
    flex-direction: column;
    flex: none;
    order: 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    padding-top: 25vh;
    display: block;
    position: sticky;
    top: 0;
  }

  .p-line-1-wrapp {
    margin-left: 0;
    padding-top: 0;
    position: absolute;
    inset: 0%;
  }

  .p-line-1-content-1 {
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin-top: 0;
    position: absolute;
    inset: 0%;
  }

  .process-title {
    position: relative;
  }

  .p-line-2-wrapp {
    margin-left: 0;
    padding-bottom: 0;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .p-line-1-content-2 {
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin-top: 0;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .process-body-text {
    position: relative;
  }

  .p-line-1-content-3 {
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin-top: 0;
    display: flex;
    position: absolute;
    inset: 0%;
  }

  .p-line-1-content-4, .p-line-1-content-5 {
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin-top: 0;
    position: absolute;
    inset: 0%;
  }

  .skills-row-1 {
    height: 50px;
    margin-top: 10vh;
    font-size: 42px;
    line-height: 46px;
  }

  .skills-row-2 {
    height: 50px;
    margin-top: 23vh;
    font-size: 42px;
    line-height: 46px;
  }

  .skills-row-3 {
    height: 50px;
    margin-top: 35vh;
    font-size: 42px;
    line-height: 46px;
  }

  .skills-row-4 {
    height: 50px;
    margin-top: 48vh;
    font-size: 42px;
    line-height: 46px;
  }

  .skills-row-5 {
    height: 50px;
    margin-top: 60vh;
    font-size: 42px;
    line-height: 46px;
  }

  .skills-row-6 {
    height: 50px;
    margin-top: 74vh;
    font-size: 42px;
    line-height: 46px;
  }

  .contacts-img-gallery-wrapp {
    margin-bottom: 0;
  }

  .contacts-content-grid {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
  }

  .process-indicator-m {
    border: 1px solid var(--gainsboro);
    background-color: #0000;
    border-radius: 1000px;
    justify-content: center;
    align-items: center;
    width: 75px;
    height: 75px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    position: relative;
    inset: 0% 0% auto;
  }

  .process-indicatior-type {
    color: var(--body);
    font-family: Avertape, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    position: absolute;
  }

  .process-indicator-number-holder {
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .utility-page-wrap {
    padding-left: 50px;
    padding-right: 50px;
  }

  ._404-button.success-page {
    width: 250px;
  }

  .cases-grid-column._02, .cases-grid.tablet {
    display: none;
  }

  .cases-grid.mobile {
    grid-column-gap: 0px;
    grid-row-gap: 50px;
    grid-template-rows: auto;
    grid-template-columns: 2fr;
    grid-auto-columns: minmax(auto, auto);
    display: grid;
  }

  .case-thumb-more-icon {
    margin-top: 25px;
    margin-right: 25px;
  }

  .selected-work-section {
    margin-top: 150px;
  }

  .full-width-img {
    height: auto;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .img-scroll-reveal-section {
    height: 50vh;
  }

  .home-header-new {
    padding-bottom: 50px;
  }

  .home-header-bg {
    align-items: center;
  }

  .home-header-title {
    margin-bottom: 25px;
    margin-left: 0;
  }

  .home-header-video-embed.mobile {
    display: flex;
  }

  .home-header-video-embed.desktop {
    display: none;
  }

  .footer-wrapp-wide {
    flex-direction: column;
  }

  .contacts-section-wrapp {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
  }

  .success-content-wrapp {
    padding-left: 50px;
    padding-right: 50px;
  }

  .consultations-content-wrapp.img-bg {
    height: 80vh;
  }

  .nav-btn {
    height: 65px;
    margin-top: 35px;
    margin-left: 125px;
    margin-right: 125px;
    font-weight: 600;
  }

  .uc-content-wrapp {
    max-width: 90vw;
    padding: 25px;
  }
}

@media screen and (max-width: 479px) {
  .logo-address-footer {
    flex: none;
  }

  .s-case-video-slider {
    margin-top: 50px;
  }

  .slider {
    height: 200px;
    margin-left: 25px;
    margin-right: 25px;
  }

  .image-5 {
    width: 15px;
    margin-right: 15px;
  }

  .image-51 {
    width: 15px;
    margin-left: 15px;
  }

  .slide {
    position: relative;
    overflow: visible;
  }

  .slider-videos {
    clear: both;
    height: 240px;
    margin-left: 25px;
    margin-right: 25px;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    overflow: visible;
  }

  .grid-3 {
    grid-template-columns: 1fr 1fr;
  }

  .background-video-6 {
    transform: scale(.4);
  }

  .background-video-7 {
    transform: scale(.5);
  }

  .left-arrow---video {
    left: 25px;
  }

  .right-arrow---video {
    right: 25px;
  }

  .home-header {
    height: 500px;
    padding-top: 50px;
    padding-left: 0;
    padding-right: 0;
    overflow: visible;
  }

  .nav-main-contents {
    z-index: 50;
    background-color: #0000;
    height: 65px;
    padding-left: 25px;
    padding-right: 25px;
  }

  .header-content {
    padding-left: 25px;
    overflow: visible;
  }

  .header-content.home {
    padding-left: 25px;
  }

  .pattern {
    width: 110%;
    height: 100vh;
    margin-top: 0;
    display: none;
    inset: 0%;
    overflow: hidden;
  }

  .background-video-15 {
    overflow: hidden;
  }

  .selected-work {
    margin-top: 150px;
    padding-left: 0;
    padding-right: 0;
  }

  .case-title {
    font-size: 42px;
    line-height: 50px;
  }

  .solutions {
    margin-top: 150px;
  }

  .div-block-52 {
    width: 320px;
    padding-left: 25px;
  }

  .brand-strategy, .title-more {
    width: 320px;
  }

  .text-block-15 {
    width: 320px;
    font-size: 20px;
  }

  .solutions-right {
    padding-left: 25px;
  }

  .brand-growth, .design-consultancy {
    width: 320px;
  }

  .clients-logos {
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-rows: 1fr;
  }

  .clients {
    float: left;
    width: 100%;
    height: 100%;
    margin-bottom: 150px;
    padding-left: 0%;
    padding-right: 0%;
  }

  .nav-logo {
    margin-bottom: 0;
    position: relative;
  }

  .footer-section-wrapp {
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-left: -5px;
  }

  .footer-address {
    margin-left: -20px;
  }

  .footer-contents {
    grid-row-gap: 50px;
    flex-direction: column;
    padding-left: 25px;
    padding-right: 25px;
  }

  .footer-social-link, .link-block-19, .link-block-20 {
    margin-left: 0;
  }

  .nav-bg {
    z-index: 10;
    background-color: var(--white);
    box-shadow: none;
    opacity: 1;
    cursor: none;
    height: 65px;
    display: flex;
    inset: 0% 0% auto;
  }

  .clicks-underline {
    width: 110px;
    top: 220px;
    left: 142px;
  }

  .about-header {
    width: 100%;
    padding-top: 100px;
    padding-left: 25px;
    padding-right: 25px;
  }

  .about-header.contacts {
    margin-bottom: 50px;
    padding-left: 25px;
    padding-right: 25px;
  }

  .about-header-description {
    width: 310px;
  }

  .capabilities {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .section-title-big {
    padding-left: 20px;
  }

  .capabiliti-title-and-text {
    padding-left: 25px;
  }

  .text-block-126, .div-block-64 {
    width: 320px;
  }

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

  .team {
    width: 100%;
    padding-left: 25px;
    padding-right: 25px;
  }

  .team-left {
    width: 320px;
  }

  .skills-wrapp {
    width: 100%;
  }

  .cursor-magic-vp-top {
    display: none;
  }

  .mail-us {
    margin-bottom: 75px;
    margin-right: 25px;
  }

  .mail-us-link-second {
    background-color: var(--yellow);
    inset: 0%;
  }

  .burger-link {
    margin-top: 0;
    bottom: 0;
  }

  .burger-mid {
    background-color: #0000;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
    overflow: visible;
  }

  .mobile-nav-bg {
    z-index: 26;
    background-color: var(--white);
    width: 100vw;
    height: 100vh;
    margin-top: 65px;
    display: flex;
    position: fixed;
    inset: 0% 0% auto -100%;
  }

  .burger-mid-1 {
    background-color: var(--black);
    flex: none;
    width: 25px;
    height: 2px;
    position: relative;
    bottom: -50%;
  }

  .burger-mid-2 {
    background-color: var(--black);
    flex: none;
    width: 25px;
    height: 2px;
    position: relative;
    top: -50%;
  }

  .mobile-nav-contents {
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    margin-top: 75px;
    display: flex;
    position: relative;
  }

  .text-block-138 {
    font-size: 52px;
    line-height: 60px;
  }

  .mobile-nav-work-link {
    padding-left: 25px;
    padding-right: 25px;
  }

  .hor-dash.contacts {
    border-color: var(--indian-red);
  }

  .vert-dash.contacts {
    border-color: var(--indian-red);
    background-color: var(--indian-red);
    transform: none;
  }

  .mobile-nav-about-link, .mobile-nav-contacts-link {
    padding-left: 25px;
    padding-right: 25px;
  }

  .text-block-138-copy-copy, ._123123123 {
    font-size: 52px;
    line-height: 60px;
  }

  .more-about, .more-work, .more-contacts, .more-contacts.contacts {
    bottom: -5px;
  }

  .more-rotatted.about {
    border-color: var(--indian-red);
  }

  .more-more-rotated.about {
    border-color: var(--indian-red);
    transform: none;
  }

  .row-2 {
    grid-template-rows: 70vh;
    grid-auto-rows: 70vh;
  }

  .case-hover-overlay {
    flex: none;
  }

  .about-big-title {
    width: 310px;
    margin-top: 100px;
    margin-left: 0;
    font-size: 42px;
    line-height: 46px;
  }

  .mid-sized-title-b, .mid-sized-title-y {
    font-size: 42px;
    line-height: 50px;
  }

  .next-project-button-hover {
    margin-left: 20px;
  }

  .scroll-slider-section {
    height: 300px;
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .scroll-slider-section.beam {
    height: 250px;
    overflow: hidden;
  }

  .scroll-slider-area {
    top: 150px;
  }

  .project-details-cta {
    margin-bottom: 75px;
    margin-right: 25px;
    display: flex;
  }

  .case-details-wrapper {
    padding-left: 25px;
    padding-right: 25px;
  }

  .case-details-text-grid {
    margin-top: 150px;
  }

  .mobile-nav-ig-link, .mobile-nav-be-link, .mobile-nav-fb-link, .mobile-nav-in-link {
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    display: flex;
  }

  .mobile-nav-social-icons {
    justify-content: space-around;
    align-items: center;
    width: 100%;
    margin-top: 75px;
    display: flex;
    position: relative;
    inset: auto 0% 0%;
  }

  .contacts-big-title {
    width: 310px;
    margin-left: 0;
    font-size: 42px;
    line-height: 50px;
  }

  .video-embed-full.consultations {
    justify-content: center;
    display: flex;
  }

  .video-embed-full.consultations.mobile {
    display: none;
  }

  .next-project-button-group {
    margin-left: 20px;
  }

  .html-embed-4 {
    flex: none;
    overflow: visible;
    transform: none;
  }

  .loading-bg {
    display: none;
  }

  .page-load-lottie {
    margin-top: -20%;
    transform: scale(.6);
  }

  .nav-logo-lottie {
    bottom: 0%;
  }

  .big-big-title-home {
    width: 310px;
    margin-top: 125px;
    font-size: 42px;
    line-height: 50px;
  }

  .home-header-main-serv {
    margin-left: 25px;
  }

  .scroll-down-lottie, .mail-us-content {
    flex: none;
    align-self: center;
  }

  .organic-burger-top {
    flex: none;
  }

  .organic-burger-light, .organic-burger-dark {
    flex: none;
    display: block;
  }

  .burger-icon {
    display: flex;
  }

  .burger-top-line, .burger-mid-line, .burger-bot-line {
    box-shadow: inset -1px -1px 1px 0 var(--white), inset 1px 1px 1px 0 #00000040;
  }

  .organic-proceed {
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 50px;
    margin-bottom: 150px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    position: absolute;
    inset: auto 0% 0%;
  }

  .organic-proceed-top {
    z-index: 5;
    filter: blur(2px);
    background-color: #dcdcdc;
    border-radius: 500px;
    width: 100%;
    height: 100%;
    position: absolute;
  }

  .organic-proceed-light {
    z-index: 4;
    box-shadow: -7px -7px 20px 0 var(--white);
    filter: blur(2px);
    border-radius: 500px;
    width: 100%;
    height: 100%;
    position: absolute;
  }

  .organic-proceed-dark {
    z-index: 3;
    filter: blur(2px);
    border-radius: 500px;
    width: 100%;
    height: 100%;
    position: absolute;
    box-shadow: 7px 7px 20px #00000026;
  }

  .organic-button-cta {
    z-index: 6;
    display: block;
    position: relative;
  }

  .organic-burger-inner-dark {
    opacity: 0;
    background-color: #0000;
    flex: none;
    box-shadow: inset 1px 1px 4px #00000040;
  }

  .organic-burger-inner-light {
    z-index: 5;
    box-shadow: inset -1px -1px 4px 0 var(--white);
    opacity: 0;
    background-color: #0000;
    flex: none;
  }

  .close-icon {
    z-index: 6;
    opacity: 0;
    flex: none;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    display: flex;
    position: absolute;
  }

  .close-icon-svg {
    flex: none;
    align-self: center;
    position: absolute;
  }

  .stuff {
    object-fit: fill;
    width: 320px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    top: 150px;
  }

  .nice-stuff, .more-stuff {
    width: 320px;
    margin-top: 25px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    top: 150px;
  }

  .case-full-width.hh {
    height: 25vh;
  }

  .case-mid-width.hh {
    height: 25vh;
    margin-bottom: 50px;
    padding-left: 25px;
    padding-right: 25px;
  }

  .case-full-lottie {
    height: 50vh;
    margin-top: 25px;
    margin-bottom: 25px;
  }

  .case-section-two {
    margin-top: 0;
    margin-bottom: 0;
  }

  .case-two-wrapp, .case-section-mid {
    padding-left: 25px;
    padding-right: 25px;
  }

  .case-lottie-element {
    flex: 0 auto;
    transform: none;
  }

  .case-thumb-image-element {
    max-width: none;
    height: 100%;
  }

  .content-wrapp {
    max-width: 100%;
    max-height: none;
  }

  .intro-wrapp {
    height: 400vh;
  }

  .text-block-144 {
    display: none;
  }

  .lottie-animation-6 {
    z-index: 2;
    height: 100vh;
    position: fixed;
  }

  .box {
    transform: perspective(150px);
  }

  .back-glow {
    margin: -50px;
    transform: perspective(120px)scale(1.1)perspective(25px)perspective(50px);
  }

  .front-mid {
    background-position: 50%;
  }

  .box-spotlight {
    margin: -100px -150px;
    transform: scale(.85);
  }

  .box-bg-wrapp {
    flex: none;
  }

  .box-whole-big {
    margin: -100px -150px;
  }

  .bg-canvas {
    display: flex;
  }

  .mask {
    width: 100vw;
    height: 100vh;
  }

  .img {
    flex-direction: column;
    align-items: center;
    display: block;
  }

  .bottle-nav {
    align-items: center;
    padding-left: 25px;
    padding-right: 25px;
  }

  .body-7 {
    background-color: var(--black);
  }

  .b-nav-logo {
    flex: none;
  }

  .bottle-img {
    top: 0%;
    transform: scale(.6);
  }

  .left-side {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .image-97 {
    transform: scale(.8);
  }

  .b-footer {
    align-items: center;
    padding-left: 25px;
    padding-right: 25px;
    display: flex;
  }

  .footer-wrapper {
    margin-bottom: 0;
  }

  .check-desktop {
    display: none;
  }

  .bottle-holder {
    justify-content: flex-end;
  }

  .br-nav-section.w--current {
    margin-right: -15px;
  }

  .bg-video {
    height: 100vh;
    display: none;
  }

  .left-wrapp {
    left: auto;
    right: auto;
  }

  .bg-video-m {
    height: 100vh;
    display: flex;
  }

  .age-gate-title {
    max-width: 320px;
    font-size: 28px;
  }

  .rottate-device {
    display: none;
  }

  .br-terms-section {
    padding-left: 25px;
    padding-right: 25px;
  }

  .br-terms-title {
    font-size: 28px;
    line-height: 30px;
  }

  .text-block-148 {
    max-width: 100%;
  }

  .br-prizes-section {
    padding-left: 25px;
    padding-right: 25px;
  }

  .br-prizes-content, .br-big-prize-wrapp {
    width: 100%;
  }

  .text-block-149 {
    white-space: normal;
  }

  .winners-section {
    padding-left: 25px;
    padding-right: 25px;
  }

  .br-winners-grid, .br-winners-grid-big {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }

  .case-short-content-wrapp {
    padding-left: 25px;
    padding-right: 25px;
  }

  .case-short-title {
    min-width: 300px;
  }

  .case-short-text-wrapp {
    padding-left: 0;
  }

  .case-other-section {
    padding-left: 25px;
    padding-right: 25px;
  }

  .case-other-content-wrapp {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template: "Area . ." 30vh
                   "Area-2 Area-2 Area-2"
                   "Area-3 . ." 30vh
                   / 3fr;
    grid-auto-columns: 0;
    grid-auto-flow: column;
    width: 100%;
  }

  .next-case-wrapp {
    width: 100%;
  }

  .team-grid {
    grid-template-columns: minmax(220px, 320px);
  }

  .process {
    height: 1000vh;
  }

  .process-wrapp {
    overflow: hidden;
  }

  .p-line-1-wrapp, .p-line-2-wrapp {
    margin-left: 0;
  }

  .process-body-text {
    margin-bottom: 5px;
  }

  .process-content-wrapp {
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }

  .contacts-img-gallery-wrapp {
    height: 25vh;
  }

  .process-indicator-m {
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 0;
    padding-right: 0;
  }

  .process-indicatior-type {
    position: absolute;
  }

  .utility-page-wrap {
    padding-left: 25px;
    padding-right: 25px;
  }

  ._404-video-wrapp {
    width: 320px;
    height: 160px;
  }

  .eye-socket-left, .eye-socket-right {
    width: 160px;
    height: 160px;
  }

  .left-eye, .right-eye {
    width: 50px;
    height: 50px;
  }

  .case-thumb-text-wrapp {
    margin-top: 5px;
  }

  .case-thumb-title {
    font-size: 24px;
  }

  .case-thumb-client, .case-thumb-type {
    margin-right: 10px;
    font-size: 14px;
    line-height: 18px;
  }

  .selected-work-section {
    margin-top: 150px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .img-grid-section {
    padding-left: 25px;
    padding-right: 25px;
  }

  .img-grid {
    grid-template-rows: 1fr .25fr 1fr .25fr 1fr .25fr 1fr .25fr 1fr 1fr;
  }

  .reveal-slider-section, .layout-title-wrapp {
    padding-left: 15px;
    padding-right: 15px;
  }

  .next-project-thumb-img {
    transform: scale(1.2);
  }

  .next-project-frame-overlay {
    background-image: linear-gradient(to bottom, #fff0 75%, white 75%), linear-gradient(to bottom, var(--white) 25%, #fff0 25%);
  }

  .transition-overlay {
    align-items: flex-start;
  }

  .firts-section-content-wrapp {
    margin-left: 25px;
  }

  .home-header-new {
    padding: 25px 25px 100px;
    overflow: visible;
  }

  .home-header-title {
    max-width: 90vw;
    font-size: 42px;
    line-height: 50px;
  }

  .home-header-video-embed.mobile {
    width: auto;
    max-width: 110%;
  }

  .contacts-section-wrapp {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-left: -5px;
  }

  .form-grid {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .form-row.consultations {
    grid-row-gap: 50px;
    grid-template-columns: 1fr;
  }

  .success-content-wrapp, .consultations-content-wrapp {
    padding-left: 25px;
    padding-right: 25px;
  }

  .consultations-content-wrapp.img-bg {
    height: 65vh;
  }

  .work-layout {
    padding-left: 15px;
    padding-right: 15px;
  }

  .case-link {
    margin-bottom: 50px;
  }

  .nav-btn {
    margin-top: 50px;
    margin-left: 25px;
    margin-right: 25px;
  }

  .heading {
    font-size: 26px;
    font-weight: 700;
    line-height: 30px;
  }
}

#w-node-ff3cfedb-a518-5ee5-1849-dcc0c979627b-37dff689 {
  grid-area: 1 / 1 / 6 / 7;
}

#w-node-b4dc7989-7edd-35e1-ae29-060daa2f0fc8-37dff689 {
  grid-area: 1 / 8 / 6 / 15;
}

#w-node-e8050522-1ada-a054-797f-26c9bb56f2a2-37dff689 {
  grid-area: 7 / 1 / 12 / 9;
}

#w-node-_9865c17c-a529-2371-2e23-8e98aed5e2dc-37dff689 {
  grid-area: 13 / 1 / 18 / 9;
}

#w-node-_80a5fa6e-980d-4096-0bba-77bf3691ba4c-37dff689 {
  grid-area: 7 / 10 / 18 / 15;
}

#w-node-ed4e1112-df56-3a54-2c64-cab6e99d36f8-e99d36f1, #w-node-_2df600fc-7e31-92a8-c701-6cf5aa7714c4-ddfd9c13, #w-node-_3752b421-2c3b-6e33-15f1-ba47bac571a5-283fb375, #w-node-_3752b421-2c3b-6e33-15f1-ba47bac571a6-283fb375 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_8cf301c3-4d59-fcd1-dc6d-b713ac65ba88-9a928f22 {
  grid-area: Area;
}

#w-node-be4e46d9-f369-b098-5bda-225d3db24fc5-9a928f22 {
  grid-area: Area-3;
}

#w-node-_7abc039e-8912-c2f4-d47d-f24e8d434fce-9a928f22 {
  grid-area: Area-5;
}

#w-node-_3bb9e8f9-a428-afc6-cb16-779cb28b1ab7-9a928f22 {
  grid-area: Area;
}

#w-node-_3bb9e8f9-a428-afc6-cb16-779cb28b1ae2-9a928f22 {
  grid-area: Area-3;
}

#w-node-_3bb9e8f9-a428-afc6-cb16-779cb28b1b09-9a928f22 {
  grid-area: Area-5;
}

#w-node-_1cf21de2-c116-8c8d-5d7c-0ed2d7797e51-9a928f22 {
  grid-area: Area;
}

#w-node-_1cf21de2-c116-8c8d-5d7c-0ed2d7797e92-9a928f22 {
  grid-area: Area-3;
}

#w-node-_1cf21de2-c116-8c8d-5d7c-0ed2d7797ecf-9a928f22 {
  grid-area: Area-5;
}

#w-node-de4f2616-6d19-489c-d2e2-0d2537262539-35b2e276, #w-node-e08b3386-1869-359c-25f0-ffe1922dfb6d-35b2e276, #w-node-ad3980a6-c94e-bfaf-49de-e79aeab5adb3-35b2e276, #w-node-_59652d5e-41e5-3663-992d-2fba1dfa01fb-35b2e276, #w-node-_38ec0ba3-e470-ea31-17aa-ccf37a86c6a4-35b2e276, #w-node-eade0083-0be5-61d9-549b-71034d4622ac-35b2e276, #w-node-daf2f57a-1d9c-354a-0f7a-7e331d97cf26-35b2e276, #w-node-_7222ec88-7672-13fb-f8e5-1a08e1f77756-35b2e276, #w-node-a844946b-cbb0-f25a-9500-cd93b0ad45b6-53da80af, #w-node-_6b458dc7-6dab-a96f-bddc-b965fd372e95-4f640916 {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

@media screen and (min-width: 1920px) {
  #w-node-_9122e95f-bd28-b361-28cd-51918602a46c-859aa556 {
    justify-self: start;
  }

  #w-node-_9122e95f-bd28-b361-28cd-51918602a46e-859aa556 {
    justify-self: end;
  }

  #w-node-_4b82af56-7203-f4bf-209b-758d1b71ecef-859aa556 {
    justify-self: start;
  }

  #w-node-_4b82af56-7203-f4bf-209b-758d1b71ecf1-859aa556 {
    justify-self: end;
  }

  #w-node-_61aaa78e-38e8-f7a1-e37f-2bdb70433c97-859aa556 {
    justify-self: start;
  }

  #w-node-_61aaa78e-38e8-f7a1-e37f-2bdb70433c99-859aa556 {
    justify-self: end;
  }

  #w-node-c3febcd8-6b58-b2b9-f772-716c7fef9b22-859aa556 {
    justify-self: start;
  }

  #w-node-c3febcd8-6b58-b2b9-f772-716c7fef9b24-859aa556 {
    justify-self: end;
  }
}

@media screen and (max-width: 479px) {
  #w-node-ff3cfedb-a518-5ee5-1849-dcc0c979627b-37dff689 {
    grid-area: 1 / 1 / 2 / 15;
  }

  #w-node-b4dc7989-7edd-35e1-ae29-060daa2f0fc8-37dff689 {
    grid-area: 3 / 1 / 4 / 15;
  }

  #w-node-e8050522-1ada-a054-797f-26c9bb56f2a2-37dff689 {
    grid-area: 5 / 1 / 6 / 15;
  }

  #w-node-_9865c17c-a529-2371-2e23-8e98aed5e2dc-37dff689 {
    grid-area: 7 / 1 / 8 / 15;
  }

  #w-node-_80a5fa6e-980d-4096-0bba-77bf3691ba4c-37dff689 {
    grid-area: 9 / 1 / 11 / 15;
  }
}


@font-face {
  font-family: 'Cygre';
  src: url('../fonts/Cygre-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cygre';
  src: url('../fonts/Cygre-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cygre';
  src: url('../fonts/Cygre-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Avertape';
  src: url('../fonts/avertape-black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Avertape';
  src: url('../fonts/avertape-regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Avertape';
  src: url('../fonts/avertape-light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Avertape';
  src: url('../fonts/avertape-semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Avertape';
  src: url('../fonts/avertape-bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Colus';
  src: url('../fonts/Colus-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}