:root {
  --borderneutral: rgba(213, 219, 225, 1);
  --text-iconsprimary: rgba(48, 49, 61, 1);
  --text-iconswhite: rgba(255, 255, 255, 1);
  --text-iconsbrand: rgba(99, 91, 255, 1);
  --text-iconsinfo: rgba(5, 112, 222, 1);
  --backgroundcontainer: rgba(246, 248, 250, 1);
  --deprecated-button-default: 0px 2px 5px 0px rgba(60, 66, 87, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.12);
}


    .frame {
  position: relative;
  width: 100%;
  height: 60px;
  background-color: #ffffff;
  border-radius: 20px;
  border: 1px solid;
  border-color: var(--borderneutral);
}

.frame .design-here {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 10px;
  left: 24px;
}

.frame .group {
  position: absolute;
  width: 152px;
  height: 40px;
  top: 10px;
  left: 930px;
}

.frame .button {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 16px;
  position: absolute;
  top: 0;
  left: 65px;
  background-color: var(--backgroundsurface);
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid;
  border-color: var(--borderneutral);
}

.frame a {

  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: var(--text-iconsprimary);
  font-size: 16px;
  text-align: center;
}

.frame .text {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: var(--text-iconsprimary);
  font-size: 16px;
  text-align: center;
  letter-spacing: -0.31px;
  line-height: 24px;
  white-space: nowrap;
}

.frame .text-wrapper {
  top: 8px;
  left: 0;
  position: absolute;
  height: 24px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: var(--text-iconsprimary);
  font-size: 16px;
  text-align: center;
  letter-spacing: -0.31px;
  line-height: 24px;
  white-space: nowrap;
}

.frame .frame-nav-bar-links {
  position: absolute;
  width: 205px;
  height: 24px;
  top: 18px;
  left: 440px;
}
.frame .text {
  position: absolute;
  height: 24px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: var(--text-iconsprimary);
  font-size: 16px;
  text-align: center;
  letter-spacing: -0.31px;
  line-height: 24px;
  white-space: nowrap;
  top: 0;
  left: var(--left-offset, 0); /* Default to 0 if not set */
}


.frame .text[data-index="1"] {
  --left-offset: 0px;
}

.frame .text[data-index="2"] {
  --left-offset: 66px;
}

.frame .text[data-index="3"] {
  --left-offset: 143px;
}

.frame .text[data-index="4"] {
  --left-offset: 209px;
}

.header .nav-bar .nav-bar-menu-icon {
    position: absolute !important;
    cursor: pointer !important;
     color: var(--text-iconsprimary) !important;
    left: 341px !important;
}

/* .group-auth {
    position: relative;
    display: inline-block;
    left: 863px;
    top: 11px;
} */

.cookies {
    visibility: hidden;
    /* position: fixed;
    max-width: 380px;
    padding: 30px; */
    /* bottom: -150%; */
    /* width: 100%; */
    /* height: 450px; */
    /* border-radius: 20px; */
    background-color: #fff;
    -webkit-box-shadow: 0 16px 24px 2px #41141405, 0 6px 32px 4px #4114140a, 0 8px 12px -5px #4114140a;
    box-shadow: 0 16px 24px 2px #41141405, 0 6px 32px 4px #4114140a, 0 8px 12px -5px #4114140a;
    z-index: 90000;
    -webkit-transition: .7s;
    -o-transition: .7s;
    transition: .7s;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
     /* border: 1px solid; */
     border-color: var(--borderneutral);
}

@media (max-width: 575.98px) {
    .cookies {
        max-width: 100%;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }
}

/* .cookies.show {
    visibility: visible;
} */
.agree_section.show{
  visibility: visible;
}

.transparent-background.show{
  visibility: visible;
}



@media (max-width: 575.98px) {
    .cookies.show {
        width: 100%;
        bottom: 0;
    }
}














/* .cookies .text {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: var(--text-iconswhite);
  font-size: 16px;
  text-align: center;
  letter-spacing: -0.31px;
  line-height: 24px;
  white-space: nowrap;
} */

/* .cookies .p {
  width: 303px;
  top: 290px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: transparent;
  font-size: 12px;
  line-height: 18px;
  position: absolute;
  text-align: center;
  letter-spacing: -0.4px;
} */

/* .cookies .span {
  color: #30313d;
  letter-spacing: -0.05px;
}

.cookies .text-wrapper-2 {
  color: #0570de;
  letter-spacing: -0.05px;
  text-decoration: underline;
}

.cookies .line {
  position: absolute;
  width: 161px;
  height: 1px;
  top: 270px;
  left: 95px;
  object-fit: cover;
}

.cookies .group-2 {
  position: absolute;
  width: 281px;
  height: 45px;
  top: 15px;
  left: 31px;
}

.cookies .design-here {
  position: absolute;
  width: 210px;
  height: 51px;
  top: 9px;
  left: 0;
}

.cookies .overlap-group {
  position: absolute;
  width: 130px;
  height: 27px;
  top: 3px;
  left: 212px;
}

.cookies .text-wrapper-3 {
  position: absolute;
  height: 24px;
  top: 0;
  left: 41px;
  font-family: "Figma Hand-Regular", Helvetica;
  font-weight: 400;
  color: var(--text-iconsprimary);
  font-size: 10px;
  letter-spacing: -0.31px;
  line-height: 24px;
  white-space: nowrap;
}

.cookies .vector-stroke {
  position: absolute;
  width: 46px;
  height: 12px;
  top: 15px;
  left: 0;
} */

.drop-frame {
  position: relative;
  width: 600px;
  height: 280px;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid;
  border-color: var(--borderneutral);
}

.drop-frame .overlap-group {
  position: absolute;
  width: 602px;
  height: 205px;
  top: -1px;
  left: -1px;
}


.drop-frame .group-wrapper {
  position: absolute;
  width: 602px;
  height: 26px;
  top: 0;
  left: 0;
  background-color: var(--backgroundcontainer);
  border-radius: 20px 20px 0px 0px;
  overflow: hidden;
  border-top-width: 1px;
  border-top-style: solid;
  border-right-width: 1px;
  border-right-style: solid;
  border-left-width: 1px;
  border-left-style: solid;
  border-color: var(--borderneutral);
}

.drop-frame .div {
  position: relative;
  width: 217px;
  height: 20px;
  top: 2px;
  left: 194px;
}

.drop-frame .heading {
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: var(--text-iconsprimary);
  font-size: 11px;
  letter-spacing: -0.4px;
  line-height: 20px;
  white-space: nowrap;
}

.drop-frame .text-wrapper {
  top: 0;
  left: 126px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: var(--text-iconsinfo);
  font-size: 11px;
  text-decoration: underline;
  position: absolute;
  letter-spacing: -0.4px;
  line-height: 20px;
  white-space: nowrap;
}

.drop-frame .p {
  top: 211px;
  left: 161px;
  font-family: "EB Garamond", Helvetica;
  font-weight: 600;
  color: var(--text-iconsprimary);
  font-size: 24px;
  position: absolute;
  letter-spacing: -0.4px;
  line-height: 20px;
  white-space: nowrap;
}


 .agree_section {
      visibility: hidden;
      border: 1px solid #e1e4ea;
      height: 418px;
      width: 440px;
      border-radius: 20px;
      position: absolute;
      top: 50%;
      right: 129px;
      z-index: 99999;
      background: #fff;
      transform: translateY(-50%);
      padding: 32px 24px;
      box-shadow: 12px 29px 32px 32px rgba(14, 18, 27, 0.1);
    }

    .sendFilesText {
      font-size: 28px;
      font-weight: 500;
    }

    .agree_paragraph {
      font-size: 14px;
      font-weight: 400;
    }

     .agree_paragraph_policy a {
       color: #335cff;
       text-decoration: underline;
    }

    .agree_paragraph_policy {
      font-weight: 400;
      font-size: 12px;
      line-height: 16px;
      text-align: center;
    }

    .agree_button {
      border-radius: var(--radius-10, 10px);
      border: 1px solid var(--linear-12, rgba(255, 255, 255, 0.12));
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%,
          rgba(255, 255, 255, 0) 100%), var(--bg-strong-950, #0e121b);

      width: 100%;

      height: 40px;

      color: #fff;
    }

    .agree_button:hover {
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%,
          rgba(255, 255, 255, 0) 100%), var(--bg-strong-950, #0e121b);
    }

    .agree_button:active {
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, 
          rgba(255, 255, 255, 0.16) 100%), var(--bg-strong-950, #0e121b);
    }

    .transparent-background {
      visibility: hidden;
      height: 100vh;
      width: 100vw;
      background: #000;
      opacity: 0.45;
      position: fixed;
      z-index: 99999;
    }

    .learn-more{
       font-family: 'Andria Signature', cursive;
       width: 107px;
       height: 24px;
       font-size: 12px;
       src: url("assets/vendor/webfonts/andria-signature.otf") format("opentype");
    }
    .send-file {
      /* font-family: 'Poppins'; */
      font-size: 18px;
    }
    .no-download{
      font-weight: 600;
      font-style: italic;
      letter-spacing: -0.4px;
       font-size: 18px;
    }
    .design-here {
          width: 160px;
          height: 32px;
    }

    .eb-font{
         font-family: 'EB Garamond', serif;
         font-weight: 500;
    }

    /* Extra small devices (phones, 600px and down) */
    @media only screen and (max-width: 600px) {
      .agree_section {
        height: 418px;
        width: 440px;
        right: auto;
      }
    }


    @media only screen and (max-width: 600px) {
      .agree_section {
        height: 418px;
        width: 440px;
        right: auto;

      }
    }



    /* Medium devices (landscape tablets, 768px and up) */
    @media only screen and (max-width: 768px) {
      .agree_section {
        height: 418px;
        width: 440px;
        right: auto;

      }
    }

  /* Large devices (laptops/desktops, 992px and up) */
@media only screen and (max-width: 992px) and (min-width : 600px)  {
    .agree_section {
        height: 418px;
        width: 440px;

      }
}

@media only screen and (max-width: 1024px) and (min-width : 992px) and (min-width : 768px)   {
    .agree_section {
        height: 418px;
        width: 440px;
      }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
/* @media only screen and (min-width: 1200px) {...} */