@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@700&display=swap");

:root {
  --contHeadMin: 24px;
  --contHeadMax: 48px;
  --contParaMin: 20px;
  --contparaMax: 28px;
  --contViewWidth: 2vw;
  --contParaViewWidth: 1.2vw;
}

/* width */
::-webkit-scrollbar {
  width: 1px;
  display: none;
}

html {
  scroll-behavior: smooth;
  /* scrollbar-gutter: stable; */
}

body {
  margin: 0;
  padding: 0;
  background-color: rgb(0, 0, 0);
  overflow-y: hidden;
  overflow-x: hidden;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none;
}

h1 h2 h3 h4 h5 h6 ul li {
  margin: 0;
  padding: 0;
}

a,
a:hover,
a:active {
  text-decoration: none;
  outline: none;
}

.main_container {
  position: relative;
  display: flex;
  height: 100vh;
  background-color: black;
  background-repeat: no-repeat;
  scroll-behavior: smooth;
}

.land_img {
  display: flex;
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  transform: translate(-50%, 0%);
}

.landing_canvas {
  position: fixed;
  top: 0;
  left: 0;
  opacity: 1;
}

.images_fixed {
  position: absolute;
  top: 50%;
  left: 0%;
  width: 100%;
  transform: translateY(-50%);
  z-index: 10;
  opacity: 1;
  /* height: 100vh; */
}
.loading_page {
  display: flex;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  /* transition: ease-out 0.5s; */
  font-family: "Orbitron", sans-serif;
  font-size: 6vw;
  font-weight: 700;
  line-height: 113px;
  letter-spacing: 0.1em;
  text-align: left;
  background-color: #e2d0be;
}

.loading_page_block_over {
  display: flex;
  width: 100%;
  height: 100vh;
  background-color: #000000;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(100%, 0%);
  z-index: 10;
}

.cookies_main_fixed_content_white_main_description_span {
  text-decoration: underline;
  cursor: pointer;
}

.loading_page_reelmag_text_grey {
  display: flex;
  width: 100%;
  color: rgba(255, 255, 255, 0.25);
  clip-path: inset(0px 100% 0px 0px);
  animation: clipFromLeftGrey 1s forwards 1s ease-in-out;
  -webkit-animation: clipFromLeftGrey 1s forwards 1s ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  justify-content: center;
}

.loading_page_reelmag_text_black {
  display: flex;
  width: 100%;
  color: #f8462a;
  clip-path: inset(0px 100% 0px 0px);
  animation: clipFromLeftBlack 1s forwards 2s ease-in-out;
  -webkit-animation: clipFromLeftBlack 1s forwards 2s ease-in-out;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  justify-content: center;
}

@keyframes clipFromLeftGrey {
  from {
    clip-path: inset(0px 100% 0px 0px);
  }
  to {
    clip-path: inset(0px 0% 0px 0px);
  }
}

@keyframes clipFromLeftBlack {
  from {
    clip-path: inset(0px 100% 0px 0px);
  }
  to {
    clip-path: inset(0px 0% 0px 0px);
  }
}

.loading_page_logo_svg {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 12vh;
  width: auto;
  transform: translate(-50%, -170%);
  opacity: 1;
  animation: logoEntry 1s forwards ease-in-out,
    logoBlink 2s infinite ease-in-out 1s;
  -webkit-animation: logoEntry 2s forwards ease-in-out,
    logoBlink 1.5s infinite ease-in-out 4s;
  transform-origin: center center;
}

@keyframes logoBlink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}

/* .loading_page_logo_svg_class {
  animation: logoEntry 1s forwards ease-in-out;
  opacity: 1;
} */

@keyframes logoEntry {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.loading_marquee_text {
  display: flex;
  font-family: Inter;
  font-size: clamp(32px, 11vw, 250px);
  font-style: normal;
  font-weight: 700;
  line-height: 300px;
  letter-spacing: -0.015em;
  color: white;
  width: 100%;
  white-space: nowrap;
}

.loading_image {
  position: absolute;
  bottom: 5%;
  right: 7%;
}

.in_image {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.out_image {
  animation: loading_image 5s linear infinite;
}

@keyframes loading_image {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.display_none {
  /* display: none !important; */
  opacity: 0 !important;
}
.nav_bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  /* transition: ease-in 0.5s; */
  transform: translate(0%, -120%);
  z-index: 3100;
}

.nav_bar_bg_back_drop {
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: ease-in 0.1s;
}

.nav_bar_main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
  /* border-bottom: 1px solid black; */
  background-color: transparent;
}

.nav_bar_logo {
  transition: ease-in 0.1s;
}

.nav_bar_logo h6 {
  font-family: Inter;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  line-height: 22px;
  text-align: center;
  letter-spacing: -0.015em;
  margin: 0;
}
.nav_bar_logo h6:hover {
  cursor: pointer;
}
.nav_bar_link {
  display: flex;
  align-items: center;
  transition: ease-in 0.1s;
}

.nav_bar_link ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
}

.nav_bar_link li {
  float: left;
  margin: 0 20px;
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  font-size: clamp(13px, 0.6vw, 14px);
  line-height: 15px;
  letter-spacing: -0.015em;
}

.nav_bar_link li:hover {
  cursor: pointer;
}

.nav_bar_link li:last-child {
  margin-right: 0;
}

.nav_interested_button {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  display: flex;
  padding: 6px 17px;
  padding-bottom: 8px;
  border-radius: 50px;
  color: white;
  font-family: Inter;
  font-style: normal;
  font-weight: bold;
  font-size: clamp (14px, 1vw, 16px);
  line-height: 17px;
  text-align: center;
  letter-spacing: 0em;
  transition: ease-in 0.1s;
  background-color: #f8462a;
  border-color: #d33d28;
  border-width: 4px;
  border-style: solid;
}

.nav_interested_button:hover {
  cursor: pointer;
}

.banner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
  pointer-events: none;
}

.banner_container {
  position: fixed;
  z-index: 11;
  pointer-events: none;
}

.introducing_text_container {
  position: fixed;
  display: flex;
  width: 100%;
  height: 100vh;
  justify-content: center;
  align-items: center;
}

.introducing_text {
  margin: 0;
  display: flex;
  color: white;
  font-family: Inter;
  font-size: 96px;
  font-style: normal;
  font-weight: 700;
  line-height: 116px;
  letter-spacing: -0.015em;
  text-align: center;
  opacity: 0;
}

/* .introducing_text {
  margin: 0;
  display: flex;
  color: white;
  font-family: Orbitron;
  font-size: 90px;
  font-weight: 700;
  line-height: 113px;
  letter-spacing: 0.18em;
  text-align: center;
  opacity: 0;
} */

.banner_title {
  position: relative;
  width: 100%;
  display: flex;
  padding: 0 400px;
  justify-content: center;
  opacity: 0;
}

.banner_span_reel {
  display: flex;
  position: absolute;
  font-family: Inter;
  font-size: clamp(32px, 13vw, 320px);
  font-style: normal;
  font-weight: 700;
  line-height: 196px;
  letter-spacing: -0.015em;
  text-align: center;
  transform: translate(-98%, -50%);
}

.banner_span_mag {
  display: flex;
  position: absolute;
  font-family: Inter;
  font-size: clamp(32px, 13vw, 320px);
  font-style: normal;
  font-weight: 700;
  line-height: 196px;
  letter-spacing: -0.015em;
  text-align: center;
  transform: translate(92%, -50%);
}

.banner_bottom_content {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 120%);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 40px;
  opacity: 0;
}
.banner_bottom_content p {
  width: 100%;
  font-family: Inter;
  /* font-size: clamp(12px, 1vw, 24px); */
  font-style: normal;
  font-weight: 500;
  /* line-height: 22px; */
  letter-spacing: 0.005em;
  text-align: center;
  margin: 0;

  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  line-height: clamp(20px, 1.8vw, 38px);
}

body {
  position: relative;
}
.second_container {
  display: flex;
  position: relative;
  width: 100%;
  height: 500vh;
  background-color: black;
  /* transition: ease-in-out 1s all; */
  scroll-behavior: smooth;
}
.bg_blur_effect_container {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 5;
  justify-content: center;
  align-items: center;
}

.bg_blur_effect {
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0%;
  height: 50vh;
  z-index: -1;
  background: #ffffff;
  opacity: 0.5;
  filter: blur(300px);
}
.second_container_banner {
  display: flex;
  position: fixed;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  top: 0;
  left: 0;
  z-index: 10;
  opacity: 0;
  transform: translate(0%, 100px);
  pointer-events: none;
}

.second_container_banner_design {
  display: flex;
}
.second_container_banner_design h6 {
  display: flex;
  font-family: Inter;
  font-size: clamp(16px, 1.7vw, 48px);
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: -0.015em;
  text-align: center;
  color: #6b6b6b;
  margin: 0;
}

.space_usablity {
  display: flex;
  width: 8vw;
}

.second_container_banner_con {
  transform: translate(1.8%, 0%);
}
.second_container_banner_usability {
  display: flex;
  color: white;
}

.second_container_banner_usability h6 {
  display: flex;
  font-family: Inter;
  font-size: clamp(100px, 11vw, 320px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(100px, 10vw, 250px);
  letter-spacing: 0em;
  text-align: center;
  margin: 0;
}
.second_container_banner_usability h5 {
  display: flex;
  font-family: Inter;
  font-size: clamp(100px, 11vw, 320px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(100px, 10vw, 250px);
  letter-spacing: 0em;
  text-align: center;
  margin: 0;
}

.second_container_content1 {
  display: flex;
  position: fixed;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
  z-index: 10;
  pointer-events: none;
  z-index: 2000;
  transform: translate(0.2%, 0%);
}

.second_container_content1_left_con {
  display: flex;
  height: clamp(36%, 10vw, 54%);
  align-items: flex-end;
}

.second_container_content1_space {
  display: flex;
  position: relative;
  width: 12vw;
  height: clamp(36%, 10vh, 54%);
}

.left_cont1_svg {
  position: absolute;
  bottom: 25%;
  left: 16%;
  opacity: 0;
}

.right_cont1_svg {
  position: absolute;
  top: 45%;
  right: 25%;
  opacity: 0;
}

.second_cont_1_left_Arr {
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  align-items: center;
  transform: translate(100%, 150%);
  z-index: 1000;
}
.second_container_content1_left_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );
  font-style: normal;
  font-weight: 700;
  line-height: clamp(44px, 4vw, 100px);
  letter-spacing: -0.015em;
  text-align: right;
  color: white;
}

.second_container_content1_left_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  line-height: clamp(20px, 1.8vw, 38px);
  font-weight: 500;
  letter-spacing: -1.5%;
  text-align: right;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 20vw, 400px);
}

.second_container_content1_left_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-end;
  justify-content: flex-end;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, 50px);
}

.second_container_content1_right_con {
  display: flex;
  height: clamp(36%, 10vw, 54%);
  align-items: center;
}

.second_container_content1_right_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );
  font-style: normal;
  font-weight: 600;
  line-height: clamp(44px, 4vw, 100px);
  letter-spacing: -1.5%;
  text-align: left;
  color: white;
}

.second_container_content1_right_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  font-weight: 500;
  line-height: clamp(20px, 1.8vw, 38px);
  letter-spacing: -0.015em;
  text-align: left;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 22vw, 600px);
  /* width: 30%; */
}

.second_container_content1_right_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, 50px);
}

.second_container_content2 {
  display: flex;
  position: fixed;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
  z-index: 2500;
  pointer-events: none;
  transform: translate(-0.6%, 0%);
}

.second_container_content2_left_con {
  display: flex;
  height: clamp(36%, 2vw, 80%);
  align-items: flex-start;
}

.second_container_content2_space {
  display: flex;
  position: relative;
  width: 33vw;
  height: clamp(30%, 32vw, 80%);
}

.left_cont2_svg {
  position: absolute;
  top: 0%;
  left: 52%;
  opacity: 0;
}
.right_cont2_svg {
  position: absolute;
  top: 15%;
  right: 25%;
  opacity: 0;
}
.second_container_content2_left_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );

  font-style: normal;
  font-weight: 700;
  line-height: clamp(44px, 4vw, 100px);
  letter-spacing: -0.015em;
  text-align: right;
  color: white;
  flex-direction: column;
}

.second_container_content2_left_con_t1_span {
  margin-top: -30px;
}

.second_container_content2_left_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  font-weight: 600;
  line-height: clamp(20px, 1.8vw, 38px);
  letter-spacing: -1.5%;
  text-align: right;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 20vw, 400px);
}

.second_container_content2_left_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-end;
  justify-content: flex-start;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, -50px);
}

.second_container_content2_right_con {
  display: flex;
  height: clamp(36%, 2vw, 80%);
  align-items: flex-start;
  transform: translate(0%, 20%);
}

.second_container_content2_right_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );
  font-style: normal;
  font-weight: 700;
  line-height: clamp(44px, 4vw, 100px);
  letter-spacing: -0.015em;
  text-align: left;
  color: white;
}

.second_container_content2_right_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  font-weight: 600;
  line-height: clamp(20px, 1.8vw, 38px);
  letter-spacing: -1.5%;
  text-align: left;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 20vw, 400px);
}

.second_container_content2_right_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, 50px);
}

.second_container_content3 {
  display: flex;
  position: fixed;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
  z-index: 2600;
  pointer-events: none;
  transform: translate(2%, 0%);
}
.big_circle {
  transform: translate(50%, 50%) scale(0);
  -webkit-transform: translate(50%, 50%) scale(0);
  -ms-transform: translate(50%, 50%) scale(0);
  -moz-transform: translate(50%, 50%) scale(0);
  -o-transform: translate(50%, 50%) scale(0);
}

.second_container_content3_left_con {
  display: flex;
  height: clamp(36%, 30vw, 54%);
  align-items: flex-end;
  transform: translate(0%, 8%);
}

.second_container_content3_space {
  display: flex;
  width: 35vw;
  height: clamp(36%, 10vh, 54%);
  position: relative;
}

.left_cont3_svg {
  position: absolute;
  bottom: 5%;
  left: 12%;
  opacity: 0;
}
.right_cont3_svg {
  position: absolute;
  top: 26%;
  right: 10%;
  opacity: 0;
}
.second_container_content3_left_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );
  font-style: normal;
  font-weight: 700;
  line-height: clamp(44px, 4vw, 100px);
  letter-spacing: -0.015em;
  text-align: right;
  color: white;
}

.second_container_content3_left_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  font-weight: 600;
  line-height: clamp(20px, 1.8vw, 38px);
  letter-spacing: -1.5%;
  text-align: right;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 20vw, 400px);
}

.second_container_content3_left_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-end;
  justify-content: flex-end;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, 20px);
}

.second_container_content3_right_con {
  display: flex;
  height: 1;
  align-items: center;
  transform: translate(5%, 0%);
}

.second_container_content3_right_con_t1 {
  display: flex;
  font-family: Inter;
  font-size: clamp(
    var(--contHeadMin),
    var(--contViewWidth),
    var(--contHeadMax)
  );
  font-style: normal;
  font-weight: 700;
  letter-spacing: -0.015em;
  text-align: left;
  color: white;
  flex-direction: column;
}

.second_container_content3_right_con_t1_thick_span {
  line-height: clamp(44px, 4vw, 100px);
  margin-top: -15px;
}
.second_container_content3_right_con_t2 {
  font-family: Inter;
  font-size: clamp(
    var(--contParaMin),
    var(--contParaViewWidth),
    var(--contparaMax)
  );
  font-style: normal;
  font-weight: 600;
  line-height: clamp(20px, 1.8vw, 38px);
  letter-spacing: -1.5%;
  text-align: left;
  color: rgba(255, 255, 255, 0.6);
  width: clamp(200px, 20vw, 400px);
}

.second_container_content3_right_con_in {
  display: flex;
  padding: 5px 5px;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
  opacity: 0;
  transform: translate(0%, 20px);
}

.color_action_none {
  opacity: 0;
}

.third_container {
  display: flex;
  width: 100%;
  height: 100vh;
  background-color: white;
  position: relative;
  justify-content: flex-start;
  align-items: center;
  z-index: 3000;
  /* transition: ease-in-out 1s all; */
}
.third_container_image {
  display: flex;
  margin-left: 10vw;
}
.third_front_container {
  display: flex;
  background-color: #f6f6f6;
  overflow: hidden;
  border-radius: 7px;
  height: 30vw;
  width: 30vw;
  align-items: center;
  justify-content: center;
  position: relative;
}

.play_action_button {
  position: absolute;
  bottom: 7%;
  left: 2%;
  width: 32px;
  height: 32px;
  z-index: 10;
  display: none;
}

.play_action_button:hover {
  cursor: pointer;
}

.color_page_play {
  position: absolute;
}
.color_page_pause {
  position: absolute;
}

.front_image {
  display: flex;
  height: 100%;
}

.third_side_container {
  display: flex;
  background-color: #f6f6f6;
  overflow: hidden;
  margin-left: 5vw;
  border-radius: 7px;
  height: 30vw;
  width: 12vw;
  align-items: center;
}
.side_image {
  display: flex;
  height: 100%;
}

.third_content_container {
  display: flex;
  padding: 10px;
  margin-right: 7vw;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 7vw;
}

.third_circuit_image {
  display: flex;
  width: 150px;
  /* overflow: hidden; */
}

.circuit_image {
  display: flex;
  width: 150px;
}

.third_text_content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  margin-top: 2vw;
  width: max-content;
}

.third_text_content h6 {
  margin: 0;
  font-family: Inter;
  font-size: clamp(28px, 3.4vw, 85px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(50px, 4.3vw, 100px);
  letter-spacing: -0.015em;
  text-align: left;
  color: white;
  mix-blend-mode: difference;
}
.third_text_content h5 {
  margin: 0;
  font-family: Inter;
  font-size: clamp(28px, 3.4vw, 85px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(50px, 4.3vw, 100px);
  letter-spacing: -0.015em;
  text-align: left;
  color: white;
  mix-blend-mode: difference;
}

.colors_page_monotone {
  position: relative;
  margin: 0;
  width: 100%;
  height: 5vw;
}

.colors_page_monotone span {
  position: absolute;
  font-family: Inter;
  font-size: clamp(28px, 3.4vw, 85px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(50px, 4.3vw, 100px);
  letter-spacing: -0.015em;
  text-align: left;
  width: max-content;
}

.colors_page_monotone_span_resistor {
  color: #f8462a;
  opacity: 1;
  transition: 1s all;
}

.colors_page_monotone_span_capacitor {
  color: #1a9fdb;
  opacity: 0;
  transition: 1s all;
}

.colors_page_monotone_span_everything {
  color: #39d1aa;
  opacity: 0;
  transition: 1s all;
}

.color_page_image {
  display: flex;
  opacity: 0;
}

.third_colors_nav {
  display: flex;
  margin-top: 2vw;
}
.red_nav {
  display: flex;
  width: 34px;
  height: 34px;
  background: #d33d28;
  border-radius: 60px;
  margin-left: 1vw;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
  outline-color: rgba(248, 70, 42, 0.25);
}

.blue_nav {
  display: flex;
  width: 34px;
  height: 34px;
  background: #208ebf;
  border-radius: 60px;
  margin-left: 1.5vw;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
  box-shadow: rgba(26, 159, 219, 0.25);
  outline-color: rgba(26, 159, 219, 0.25);
}
.green_nav {
  display: flex;
  width: 34px;
  height: 34px;
  background: #32b492;
  border-radius: 60px;
  margin-left: 1.5vw;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
  outline-color: rgba(57, 209, 170, 0.25);
}
.red_nav_in {
  width: 24px;
  height: 24px;
  background: #f8462a;
  border-radius: 60px;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
}
.blue_nav_in {
  width: 24px;
  height: 24px;
  background: #1a9fdb;
  border-radius: 60px;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
}
.green_nav_in {
  width: 24px;
  height: 24px;
  background: #39d1aa;
  border-radius: 60px;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -khtml-border-radius: 60px;
}

.red_nav:hover {
  cursor: pointer;
}

.blue_nav:hover {
  cursor: pointer;
}

.green_nav:hover {
  cursor: pointer;
}

.nav_color_page_outline {
  outline-width: 3px;
  outline-style: solid;
  outline-offset: 3px;
}

.use_color_canvas {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  top: 0;
  left: 0;
  opacity: 0;
}

.anim1_frame {
  display: flex;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100vh;
  z-index: 1000;
  pointer-events: none;
  align-items: center;
  transform: translate(-50%, -50%);
}

.anim1_image {
  display: flex;
  width: 100%;
  position: absolute;
  z-index: 10;
  opacity: 1;
}

.round_cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid black;
  background-color: white;
  z-index: 100000;
  transform: translate(-50%, -50%);
  pointer-events: none;
  display: flex;
  mix-blend-mode: difference;
}

.fourth_container {
  position: relative;
  display: flex;
  width: 100%;
  height: 400vh;
  background-color: black;
  align-items: center;
}

.fourth_initial_image {
  display: flex;
  max-width: 100%;
  max-height: 100vh;
  width: auto;
  height: auto;
  transform: translate(25%, 0%);
}

/* .fourth_initial_image {
  display: flex;
  transform: translate(25%, 0%);
} */

.fourth_content {
  position: absolute;
  display: flex;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  justify-content: flex-end;
}

.fourth_text_content {
  display: flex;
  position: absolute;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: flex-start;
  top: 0;
  left: 0;
}

.fourth_text_content_container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: 10vw;
}

.fourth_content_title {
  display: flex;
  font-family: Inter;
  font-size: clamp(72px, 5vw, 130px);
  font-style: normal;
  font-weight: 700;
  line-height: 87px;
  letter-spacing: -0.015em;
  text-align: center;
  color: white;
  margin-bottom: 2.5vw;
}

.fourth_content_text_paragraph_container {
  display: flex;
  width: 100%;
  justify-content: center;
}

.fourth_content_text {
  display: flex;
  font-family: Inter;
  font-size: clamp(16px, 1vw, 24px);
  font-style: normal;
  font-weight: 600;
  line-height: 29px;
  letter-spacing: -1.5%;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  max-width: 30vw;
  margin-bottom: 5vw;
}

.fourth_content_image_container {
  display: flex;
  width: 100%;
  /* width: clamp(30%, 20vw, 55%); */
  justify-content: center;
}

.fourth_content_image {
  display: flex;
  height: auto;
  width: auto;
}

.dismantle_canvas {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  pointer-events: none;
  opacity: 0;
  transform: translate(25%, 0%);
}

.dismantle_anim {
  position: fixed;
  display: flex;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  transform: translate(25%, 0%);
  z-index: 10;
  opacity: 0;
  justify-content: center;
  pointer-events: none;
}

.dismantle_anime_images {
  width: 100%;
  max-height: 100vh;
  position: absolute;
  pointer-events: none;
}

.dismantle_anime_images_size {
  display: flex;
  max-width: 100%;
  max-height: 100vh;
  width: auto;
  height: auto;
  position: absolute;
}

.dismantle_anime_images_size {
  display: flex;
  position: absolute;
}

.fifth_container {
  display: flex;
  position: relative;
  height: 100vh;
  width: 100%;
  background-color: black;
}

.video_div {
  position: fixed;
  width: 70vw;
  height: 50vh;
  left: 0;
  right: 0;
  top: 50%;
  margin: 0 auto;
  transform: translate(0%, calc(-50% + 100vh));
  background-color: transparent;
  z-index: 3000;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
}

.video_tag {
  display: flex;
  justify-content: center;
  width: 100%;
  border-radius: 8px;
}

.sixth_container {
  display: flex;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  background-color: black;
  padding-top: 5vw;
}

.gallery_sixth_section {
  display: flex;
  width: 100%;
  height: 80vh;
  justify-content: space-around;
  align-items: center;
  position: relative;
}
.change_image_up {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.change_image_down {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
}

.thumbnail_up_arrow_button:hover {
  cursor: pointer;
}

.thumbnail_down_arrow_button:hover {
  cursor: pointer;
}

.sixth_gallery_thumbnail {
  position: relative;
  display: flex;
  width: 25%;
  height: 75vh;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  /* overflow: hidden;
  overflow-y: scroll; */
}

.sixth_gallery_preview {
  display: flex;
  width: 100%;
  background-color: #1c1c1c;
  align-items: center;
  overflow: hidden;
  border-radius: 7px;
  margin-left: 1vw;
}

.text_content {
  display: flex;
  position: relative;
  width: 100%;
  height: 80vh;
  flex-direction: column;
  justify-content: center;
  padding-left: 1vw;
  z-index: 1500;
}

.text_content_reelmag {
  display: flex;
  font-family: Inter;
  font-size: clamp(36px, 4vw, 140px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(45px, 5vw, 160px);
  letter-spacing: -0.015em;
  text-align: left;
  color: white;
}

.text_content_holder {
  color: white;
  display: flex;
  font-family: Inter;
  font-size: clamp(36px, 4vw, 140px);
  font-style: normal;
  font-weight: 700;
  line-height: clamp(45px, 5vw, 160px);
  letter-spacing: -0.015em;
  text-align: left;
}

.text_content_description {
  display: flex;
  margin-top: 1vw;
  color: rgba(255, 255, 255, 0.6);
  font-family: Inter;
  font-size: clamp(6px, 0.9vw, 18px);
  font-style: normal;
  font-weight: 600;
  font-size: clamp(8px, 0.9vw, 20px);
  letter-spacing: -1.5%;
  text-align: left;
}

.text_content_get_now_button_container {
  display: flex;
  flex-direction: column;
  width: fit-content;
}

.text_content_get_now_button {
  display: flex;
  width: max-content;
  padding: clamp(8px, 0.6vw, 18px) clamp(20px, 1.5vw, 60px);
  background-color: white;
  font-family: Inter;
  font-size: clamp(12px, 0.8vw, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: -0.015em;
  text-align: left;
  border-radius: 2px;
  margin-top: 3vw;
  flex-direction: column;
  align-items: center;
}

.text_content_get_now_border {
  display: flex;
  width: 0%;
  height: 2px;
  margin-top: 5px;
  background-color: white;
}

.text_content_get_now_button:hover {
  cursor: pointer;
}

.interested_section {
  display: flex;
  width: 100%;
  padding-top: 60px;
  z-index: 15;
  border-radius: 6px;
  border: 1px solid;
  background-color: #e2d1bf;
  align-items: flex-end;
  position: relative;
}

.interested_head_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.interested_head_section h1 {
  margin: 0;
  font-family: Inter;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 44px;
  letter-spacing: 0em;
  text-align: center;
  color: black;
  margin-top: 36px;
}

.interested_head_section h2 {
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 17px;
  letter-spacing: 0em;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  max-width: 20vw;
  margin-top: 10px;
  color: #9e8c79;
}
.interested_text_content_area {
  display: flex;
  align-items: flex-end;
  margin-bottom: 100px;
  margin-top: 60px;
}

.interested_image_area {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  position: relative;
}

.interested_text_area_container_form {
  display: flex;
  background-color: #232121;
  border-radius: 16px;
  width: 100%;
  height: 33vh;
  justify-content: center;
  align-items: center;
}

.interested_text_area_follow_us_on_container {
  display: flex;
  width: 100%;
  height: 33vh;
  background-color: #232121;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
}

.interested_text_area_follow_us_on {
  display: flex;
  width: max-content;
  flex-direction: column;
  align-items: center;
}

.interested_text_area_follow_us_on h1 {
  display: flex;
  color: white;
  margin: 0;
  margin-bottom: 20px;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 39px;
  letter-spacing: 0em;
  text-align: right;
}

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

.follow_us_on_social_icons_insta {
  display: flex;
}

.follow_us_on_social_icons_face {
  display: flex;
}

.follow_us_on_social_icons_twitter {
  display: flex;
}

.follow_us_on_social_icons_insta:hover {
  cursor: pointer;
}

.follow_us_on_social_icons_face:hover {
  cursor: pointer;
}

.follow_us_on_social_icons_twitter:hover {
  cursor: pointer;
}

.interested_text_area_follow_us_on_text_content_container {
  display: flex;
  width: 100%;
  height: 33vh;
  background-color: #232121;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  margin-top: 3vh;
  margin-bottom: 2vh;
}

.interested_text_area_follow_us_on_text_content {
  display: flex;
  flex-direction: column;
  width: 80%;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px #232121 inset !important;
  -webkit-text-fill-color: white !important;
}

.interested_text_area_follow_us_on_text_content h1 {
  display: flex;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 29px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
  margin: 0;
}

.interested_text_area_follow_us_on_text_content h2 {
  display: flex;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 17px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
  margin: 0;
  margin-top: 20px;
}

.interested_text_area_share_us_on_container {
  display: flex;
  width: 100%;
  height: 33vh;
  background-color: #232121;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  flex-direction: column;
}

.interested_text_area_share_us_on {
  display: flex;
  width: max-content;
  flex-direction: column;
  align-items: center;
}

.interested_text_area_share_us_on h1 {
  display: flex;
  color: white;
  margin: 0;
  margin-bottom: 20px;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 39px;
  letter-spacing: 0em;
  text-align: right;
}

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

.share_us_on_social_icons_insta {
  display: flex;
}

.share_us_on_social_icons_face {
  display: flex;
}

.share_us_on_social_icons_twitter {
  display: flex;
}

.share_us_on_social_icons_insta:hover {
  cursor: pointer;
}

.share_us_on_social_icons_face:hover {
  cursor: pointer;
}

.share_us_on_social_icons_twitter:hover {
  cursor: pointer;
}

.interested_text_area_share_us_on_text_content_container {
  display: flex;
  width: 100%;
  height: 33vh;
  background-color: #232121;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  margin-top: 3vh;
  margin-bottom: 2vh;
}

.interested_text_area_share_us_on_text_content {
  display: flex;
  flex-direction: column;
  width: 80%;
}

.interested_text_area_share_us_on_text_content h1 {
  display: flex;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 29px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
  margin: 0;
}

.interested_text_area_share_us_on_text_content h2 {
  display: flex;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 17px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
  margin: 0;
  margin-top: 20px;
}

.interested_text_area_content_container {
  display: flex;
  flex-direction: column;
  background-color: #232121;
  border-radius: 16px;
  width: 100%;
  height: 33vh;
  margin-top: 3vh;
  align-items: center;
  margin-bottom: 2vh;
  justify-content: center;
  position: relative;
}

.interested_form_url {
  display: flex;
  margin-top: 60px;
  width: 80%;
}

.interested_input_url {
  display: flex;
  background-color: transparent;
  border: none;
  border-bottom: 2px solid white;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  color: rgb(255, 255, 255);
}

.interested_input_url:focus {
  border: none;
  box-shadow: none;
  outline: none;
  border-bottom: 2px solid white;
}

.interested_input_url::placeholder {
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  color: rgba(255, 255, 255, 0.6);
}

.interested_from_url_submit_button {
  display: flex;
  background-color: transparent;
  border: none;
  color: white;
  align-items: flex-end;
  margin-bottom: 0px;
  border-radius: 0%;
  padding-bottom: 10px;
  border-bottom: 2px solid white;
  justify-content: center;
}

.interested_image {
  display: flex;
  width: auto;
  height: 80vh;
  position: absolute;
  /* right: -20%; */
}

.kickstarter_img_container {
  display: flex;
  position: absolute;
  top: 50%;
  right: 0%;
  transform: translate(-25%, -40%);
  width: 25%;
}

.interested_text_area {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 100%;
}

.interested_kickstarter_image {
  display: flex;
  margin-top: 20px;
  width: 100% !important;
  height: auto;
}

.interested_text_area_content {
  display: flex;
  flex-direction: column;
  width: 80%;
}

.interested_text_area_content h1 {
  margin: 0;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 29px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
}

.interested_text_area_content h2 {
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 17px;
  letter-spacing: 0em;
  text-align: left;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 1vw;
  width: 70%;
}

.interested_form {
  display: flex;
}

.interested_form_label {
  font-family: Inter;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 44px;
  letter-spacing: 0em;
  text-align: right;
  color: white;
}

.interested_form_input {
  display: flex;
  background-color: transparent;
  border: none;
  border-bottom: 2px solid white;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  margin-top: 1vw;
  border-radius: 0%;
  color: white;
}

.form_error_message {
  color: red;
  margin: 0px;
}

.captcha_error_message {
  color: red;
  margin: 0px;
}

.interested_from_submit_button {
  display: flex;
  background-color: transparent;
  border: none;
  color: white;
  align-items: flex-end;
  margin-bottom: 0px;
  border-radius: 0%;
  padding-bottom: 10px;
  border-bottom: 2px solid white;
  justify-content: center;
}

.interested_form_input:hover {
  cursor: pointer;
}

.flip_clock_container {
  display: flex;
  margin-top: 30px;
}

.interested_from_submit_button:hover .interested_from_submit_button_svg {
  transform: translateX(25%);
  cursor: pointer;
  transition: 0.05s all;
}

.interested_form_input:focus {
  border: none;
  border-bottom: 2px solid white;
  outline: none;
  color: white;
  background-color: transparent;
  box-shadow: none;
}

.interested_form_input::placeholder {
  color: rgba(255, 255, 255, 0.6);
  opacity: 1;
}

.interested_form_input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.6);
}

.interested_form_input::-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.6);
}

.interested_captcha {
  margin-top: 1.5vw;
}

.thumbnail_items_conatiner {
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
  overflow-y: scroll;
}
.thumbnail_items_outline {
  /* outline: #7a7a7a;
  outline-style: solid;
  outline-width: 2px;
  border: 4px solid black; */
  border-radius: 5px;
  background-color: #3b3b3b;
}
.thumbnail_items {
  display: flex;
  width: 80%;
  height: auto;
  background-color: #1c1c1c;
  margin-bottom: 1.5vw;
  border-radius: 5px;
}

.thumbnail_items:hover {
  background-color: #2f2f2f;
  cursor: pointer;
}

.thumbnail_items:first-child {
  margin-top: 5px;
}
.thumbnail_items:last-child {
  margin-bottom: 0;
}

.thumbnail_images {
  display: flex;
  width: 100%;
}

.gallery_preview_items {
  display: flex;
  width: auto;
  height: auto;
  border-radius: 5px;
  align-items: center;
  justify-content: center;
}

.gallery_preview_images {
  display: flex;
  height: 60vh !important;
  width: auto;
  object-fit: cover;
}

.footer_section {
  position: relative;
  display: flex;
  padding: 40px 0px;
  z-index: 10000;
  background-color: black;
}

.footer_nav {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.footer_nav_head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

.footer_nav_head_logo {
  display: flex;
  font-family: Inter;
  font-size: 80px;
  font-style: normal;
  font-weight: 700;
  line-height: 97px;
  letter-spacing: -0.015em;
  text-align: center;
  color: #3a3a3a;
  width: 100%;
}

.footer_nav_head_logo:hover {
  cursor: pointer;
}

.footer_nav_link {
  display: flex;
  width: 100%;
  margin-top: 20px;
}

.footer_nav_link ul {
  display: flex;
  list-style-type: none;
  justify-content: flex-start;
  margin: 0;
  padding: 0;
}

.footer_nav_link li {
  display: flex;
  float: left;
  margin-right: 16px;
  color: white;
}

.footer_nav_link li:hover {
  cursor: pointer;
}

.footer_nav_copyright_container {
  display: flex;
  width: 100%;
  height: max-content;
  justify-content: space-between;
}

.footer_nav_copyright {
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  color: #3a3a3a;
}

.footer_nav_developed_by {
  display: flex;
  width: max-content;
  height: max-content;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  color: #3a3a3a;
  align-items: center;
}

.footer_nav_developed_by svg {
  display: flex;
  width: 28px;
  height: 28px;
  margin: 0px 6px;
}

.footer_nav_developed_by a {
  color: #5d5d5d;
  font-weight: 600;
  text-decoration: underline;
}

.footer_contact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 60px;
}

.footer_contact_social {
  display: flex;
}

.footer_contact_social_insta {
  display: flex;
}

.footer_contact_social_face {
  display: flex;
  margin-left: 50px;
}

.footer_contact_social_twitter {
  display: flex;
  margin-left: 50px;
}

.footer_contact_social_insta:hover {
  cursor: pointer;
}

.footer_contact_social_face:hover {
  cursor: pointer;
}

.footer_contact_social_twitter:hover {
  cursor: pointer;
}

.footer_contact_location {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}

.footer_contact_location h1 {
  display: flex;
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  color: #3a3a3a;
}

.footer_contact_location h2 {
  display: flex;
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
}

.footer_contact_phone {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}

.footer_contact_phone h1 {
  display: flex;
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  color: #3a3a3a;
}

.footer_contact_phone h2 {
  display: flex;
  margin: 0;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  color: white;
}

.cookies_main_fixed_container {
  display: flex;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000000000;
  pointer-events: none;
}

.cookies_main_fixed_content {
  display: flex;
  width: 25%;
  height: max-content;
  padding: 40px 20px 20px;
  position: fixed;
  bottom: 20px;
  left: 20px;
  background-color: #d3c1a9;
  border-radius: 6px;
  backdrop-filter: blur(114px);
  flex-direction: column;
  transform: translateX(-120%);
}

.cookies_main_fixed_content_text_head {
  font-family: Inter;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: left;
  margin-bottom: 8px;
}

.cookies_main_fixed_content_text {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
}

.cookies_main_fixed_content_button_container {
  display: flex;
  width: 100%;
  height: max-content;
  justify-content: space-between;
  margin-top: 12px;
}

.cookies_main_fixed_content_text a {
  color: #000000;
  text-decoration: underline;
}

.cookies_main_fixed_content_button {
  display: flex;
  height: max-content;
  padding: 8px;
  justify-content: center;
  border-radius: 6px;
  color: #000000;
  font-family: Inter;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: center;
  cursor: pointer;
}

.cookies_main_fixed_content_button_allow {
  background-color: #d3a364;
  width: 65%;
}

.cookies_main_fixed_content_button_deny {
  background-color: #ad854f;
  width: 33%;
}

.cookies_main_fixed_content_white {
  display: flex;
  width: 25%;
  height: max-content;
  position: relative;
  border-radius: 16px;
  background-color: #ffffff;
  transform: translateX(-120%);
  position: fixed;
  bottom: 20px;
  left: 20px;
  flex-direction: column;
  overflow: hidden;
  pointer-events: all;
}

.cookies_main_fixed_content_close {
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(-100%, 100%);
  cursor: pointer;
}

.cookies_main_fixed_content_white_main {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 20px;
  padding-bottom: 12px;
  align-items: center;
}

.cookies_main_fixed_content_white_cookie_logo {
  display: flex;
  width: 30%;
  height: auto;
}

.cookies_main_fixed_content_white_main_head {
  display: flex;
  width: max-content;
  height: max-content;
  font-size: 18px;
  font-weight: 500;
  line-height: 23px;
  letter-spacing: 0em;
  text-align: center;
  margin-top: 12px;
}

.cookies_main_fixed_content_white_main_description {
  color: #6f6c90;
  width: 100%;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: center;
}

.cookies_main_fixed_content_white_main_description span {
  text-decoration: underline;
  cursor: pointer;
}

.cookies_main_fixed_content_white_second {
  display: flex;
  width: 100%;
  height: max-content;
  background-color: #fff3f1;
  padding: 12px 20px;
  justify-content: center;
}

.cookies_main_fixed_content_white_second_deny {
  display: flex;
  font-size: 13px;
  font-weight: 400;
  line-height: 15px;
  letter-spacing: 0em;
  text-align: left;
  color: #170f49;
  padding: 14px 20px;
  border-radius: 100px;
  background-color: #ffffff;
  box-shadow: 0px 3.24px 6.48px rgba(74, 58, 255, 0.08);
  cursor: pointer;
  width: max-content;
}

.cookies_main_fixed_content_white_second_deny:hover {
  box-shadow: 0px 3.24px 6.48px rgba(74, 58, 255, 0.12);
}

.cookies_main_fixed_content_white_second_accept {
  display: flex;
  width: max-content;
  padding: 14px 20px;
  font-size: 13px;
  font-weight: 400;
  line-height: 15px;
  letter-spacing: 0em;
  text-align: left;
  color: #ffffff;
  background-color: #e75539;
  box-shadow: 0px 2.43px 9.72px rgba(74, 58, 255, 0.18);
  cursor: pointer;
  border-radius: 100px;
  margin-left: 16px;
}

.cookies_main_fixed_content_white_second_accept:hover {
  box-shadow: 0px 2.43px 9.72px rgba(74, 58, 255, 0.35);
}