/* ----------------------------------------
    CSS RESET
---------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap");
html {
  color: #000;
  background: #FFF; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  *font-size: 100%; }

legend {
  color: #000; }

#yui3-css-stamp.cssreset {
  display: none; }

/* ----------------------------------------
    FONTS
---------------------------------------- */
/* ----------------------------------------
    COLORS
---------------------------------------- */
/* ----------------------------------------
    VARS
---------------------------------------- */
/* ----------------------------------------
    MIXINS
---------------------------------------- */
/* ----------------------------------------
    GLOBAL
---------------------------------------- */
* {
  box-sizing: border-box;
  outline: none; }

html {
  scroll-behavior: smooth; }

body {
  padding-top: 100px; }

img {
  display: block; }

a {
  text-decoration: none; }

::placeholder {
  opacity: 1;
  color: #111111; }

.btn {
  background-color: #111111;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 14px 28px;
  font-family: "Manrope";
  font-weight: 600;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0;
  color: white; }

.custom-checkbox {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-direction: row;
  flex-wrap: wrap;
  width: 16px;
  height: 16px;
  border: solid 1px #00b3b3;
  appearance: none;
  cursor: pointer; }
  .custom-checkbox::after {
    background-color: #00b3b3;
    width: 8px;
    height: 8px;
    content: '';
    opacity: 0; }
  .custom-checkbox:checked::after {
    opacity: 1; }

.custom-checkbox-circle {
  border-radius: 16px; }
  .custom-checkbox-circle::after {
    border-radius: 8px; }

/* ----------------------------------------
    HEADER
---------------------------------------- */
.header {
  background-color: #00b3b3;
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 0;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  height: 100px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); }
  .header .logo {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
    flex-direction: row;
    flex-wrap: wrap;
    width: 253px;
    height: 100%; }
    .header .logo img {
      height: 64px; }
  .header .navigation {
    background-color: white;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 88px;
    flex-direction: row;
    flex-wrap: wrap;
    width: calc(100% - 376px);
    height: 100%;
    padding: 0 24px; }
    .header .navigation ul {
      display: flex;
      justify-content: start;
      align-items: center;
      gap: 88px;
      flex-direction: row;
      flex-wrap: wrap; }
      .header .navigation ul li a {
        font-family: "Manrope";
        font-weight: 600;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0;
        color: #111111; }
    .header .navigation .icons {
      display: flex;
      justify-content: start;
      align-items: center;
      gap: 24px;
      flex-direction: row;
      flex-wrap: wrap; }
      .header .navigation .icons img {
        height: 16px; }
      .header .navigation .icons .cart a {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 4px;
        flex-direction: row;
        flex-wrap: wrap; }
        .header .navigation .icons .cart a span {
          background-color: #111111;
          display: flex;
          justify-content: center;
          align-items: center;
          gap: 0;
          flex-direction: row;
          flex-wrap: wrap;
          width: 16px;
          height: 16px;
          border-radius: 16px;
          font-family: "Manrope";
          font-weight: 400;
          font-size: 12px;
          line-height: normal;
          letter-spacing: 0;
          color: white; }
  .header .language-selector {
    position: relative;
    width: 123px;
    height: 100%;
    cursor: pointer; }
    .header .language-selector .current {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 16px;
      flex-direction: row;
      flex-wrap: wrap;
      width: 100%;
      height: 100%;
      font-family: "Manrope";
      font-weight: 600;
      font-size: 16px;
      line-height: normal;
      letter-spacing: 0;
      color: white; }
      .header .language-selector .current img {
        width: 16px;
        filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(325deg) brightness(101%) contrast(102%); }
    .header .language-selector .dropdown {
      position: absolute;
      top: 100%;
      left: 0;
      display: none;
      width: 100%; }
      .header .language-selector .dropdown li {
        background-color: #00b3b3;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 0;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 1px;
        padding: 6px 0;
        font-family: "Manrope";
        font-weight: 600;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0;
        color: white; }
        .header .language-selector .dropdown li:hover {
          background-color: white;
          color: #111111; }
    .header .language-selector.open .current img {
      transform: rotate(180deg); }
    .header .language-selector.open .dropdown {
      display: block; }

/* ----------------------------------------
    FOOTER
---------------------------------------- */
.footer {
  margin-top: 80px;
  padding-top: 80px;
  border-top: solid 1px #c2ccd4; }
  .footer .wrap {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 1206px;
    margin: auto; }
    .footer .wrap .col img {
      height: 24px; }
    .footer .wrap .col .contact-details {
      display: flex;
      justify-content: start;
      align-items: space-between;
      gap: 4px;
      flex-direction: column;
      flex-wrap: wrap;
      margin: 24px 0; }
      .footer .wrap .col .contact-details a {
        font-family: "Manrope";
        font-weight: 700;
        font-size: 14px;
        line-height: 24px;
        letter-spacing: 0;
        color: #4a4f53; }
    .footer .wrap .col .address {
      display: flex;
      justify-content: start;
      align-items: space-between;
      gap: 8px;
      flex-direction: column;
      flex-wrap: wrap;
      font-family: "Manrope";
      font-weight: 600;
      font-size: 12px;
      line-height: normal;
      letter-spacing: 0;
      color: #4a4f53; }
    .footer .wrap .col h3 {
      margin-bottom: 24px;
      font-family: "Manrope";
      font-weight: 700;
      font-size: 20px;
      line-height: 24px;
      letter-spacing: 0;
      color: #111111; }
    .footer .wrap .col ul {
      display: flex;
      justify-content: start;
      align-items: space-between;
      gap: 12px;
      flex-direction: column;
      flex-wrap: wrap; }
      .footer .wrap .col ul li a {
        font-family: "Manrope";
        font-weight: 600;
        font-size: 12px;
        line-height: normal;
        letter-spacing: 0;
        color: #4a4f53; }

/* ----------------------------------------
    COPYRIGHT
---------------------------------------- */
.copyright {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  padding: 48px 0;
  border-bottom: solid 8px #00b3b3; }
  .copyright p {
    font-family: "Manrope";
    font-weight: 400;
    font-size: 12px;
    line-height: normal;
    letter-spacing: 0; }
    .copyright p span {
      color: #00b3b3; }
    .copyright p a {
      display: flex;
      justify-content: start;
      align-items: center;
      gap: 4px;
      flex-direction: row;
      flex-wrap: wrap; }
      .copyright p a img {
        height: 8px;
        filter: brightness(0) saturate(100%) invert(53%) sepia(64%) saturate(3306%) hue-rotate(145deg) brightness(95%) contrast(101%); }

/* ----------------------------------------
    HERO
---------------------------------------- */
.hero {
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position: relative;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 2.8; }
  .hero .wrap {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 1206px;
    height: 100%;
    margin: auto; }
    .hero .wrap .content {
      width: 100%; }
      .hero .wrap .content h1 {
        font-family: "Manrope";
        font-weight: 700;
        font-size: 72px;
        line-height: 72px;
        letter-spacing: 0;
        color: white; }
      .hero .wrap .content p {
        margin: 24px 0 40px 0;
        font-family: "Manrope";
        font-weight: 400;
        font-size: 20px;
        line-height: 24px;
        letter-spacing: 0;
        color: white; }
      .hero .wrap .content .btn {
        background-color: white;
        color: #111111; }
  .hero .full-gradient {
    background: linear-gradient(180deg, rgba(17, 17, 17, 0.5) 0%, rgba(17, 17, 17, 0) 100%);
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .hero .small-gradient {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, white 100%);
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 140px; }

/* ----------------------------------------
    CATEGORIES
---------------------------------------- */
.categories {
  width: 100%;
  margin: 80px 0 30px 0;
  scroll-margin-top: 120px; }
  .categories .wrap {
    max-width: 1452px;
    margin: auto; }
    .categories .wrap h2 {
      margin-bottom: 40px;
      font-family: "Manrope";
      font-weight: 700;
      font-size: 48px;
      line-height: 56px;
      letter-spacing: 0;
      color: #111111; }
    .categories .wrap .elements {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 30px;
      flex-direction: row;
      flex-wrap: wrap; }
      .categories .wrap .elements .element {
        background-color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 40px;
        flex-direction: column;
        flex-wrap: wrap;
        width: calc((100% - 60px) / 3);
        aspect-ratio: 1.4;
        border: solid 1px #00b3b3; }
        .categories .wrap .elements .element img {
          height: 64px; }
        .categories .wrap .elements .element span {
          font-family: "Manrope";
          font-weight: 600;
          font-size: 36px;
          line-height: 40px;
          letter-spacing: 0;
          text-align: center;
          color: white; }
      .categories .wrap .elements .medix-pro {
        background-color: #6d4e83;
        border-color: #6d4e83; }
      .categories .wrap .elements .dentix-pro {
        background-color: #e78f77;
        border-color: #e78f77; }
      .categories .wrap .elements .its4kids {
        background-color: #c2ccd4;
        border-color: #c2ccd4; }
      .categories .wrap .elements .for-beauty {
        background-color: #df7ca4;
        border-color: #df7ca4; }
      .categories .wrap .elements .practical {
        background-color: #7b858d;
        border-color: #7b858d; }
      .categories .wrap .elements .weber img {
        height: 40px; }

/* ----------------------------------------
    BANNER CTA
---------------------------------------- */
.banner-cta {
  background-color: rgba(123, 133, 141, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 48px;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 40px 0;
  font-family: "Manrope";
  font-weight: 600;
  font-size: 36px;
  line-height: 40px;
  letter-spacing: 0;
  color: #4a4f53; }
  .banner-cta .btn {
    background-color: #4a4f53; }

/* ----------------------------------------
    CAROUSEL
---------------------------------------- */
.carousel {
  width: 100%; }
  .carousel .wrap {
    max-width: 1452px;
    margin: auto; }
    .carousel .wrap .carousel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 0;
      flex-direction: row;
      flex-wrap: wrap;
      width: 100%;
      margin: 80px 0 40px 0; }
      .carousel .wrap .carousel-header h2 {
        font-family: "Manrope";
        font-weight: 700;
        font-size: 48px;
        line-height: 56px;
        letter-spacing: 0;
        color: #111111; }
      .carousel .wrap .carousel-header .carousel-navigation {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 8px;
        flex-direction: row;
        flex-wrap: wrap; }
        .carousel .wrap .carousel-header .carousel-navigation .left,
        .carousel .wrap .carousel-header .carousel-navigation .right {
          background-color: rgba(207, 215, 220, 0.2);
          display: flex;
          justify-content: center;
          align-items: center;
          gap: 0;
          flex-direction: row;
          flex-wrap: wrap;
          width: 48px;
          height: 46px; }
          .carousel .wrap .carousel-header .carousel-navigation .left img,
          .carousel .wrap .carousel-header .carousel-navigation .right img {
            width: 16px; }
        .carousel .wrap .carousel-header .carousel-navigation .left img {
          transform: rotate(90deg); }
        .carousel .wrap .carousel-header .carousel-navigation .right img {
          transform: rotate(-90deg); }

/* ----------------------------------------
    PRODUCT ON LIST
---------------------------------------- */
.product-on-list {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 30px;
  flex-direction: row;
  flex-wrap: wrap; }
  .product-on-list .photo {
    width: 215px;
    aspect-ratio: 1; }
    .product-on-list .photo img {
      width: 100%; }
  .product-on-list .data {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0;
    flex-direction: column;
    flex-wrap: wrap;
    width: calc(100% - 215px - 30px); }
    .product-on-list .data .information {
      width: 100%; }
      .product-on-list .data .information .category {
        font-family: "Manrope";
        font-weight: 400;
        font-size: 12px;
        line-height: normal;
        letter-spacing: 0;
        color: #4a4f53; }
      .product-on-list .data .information .name a {
        font-family: "Manrope";
        font-weight: 700;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0;
        color: #111111; }
      .product-on-list .data .information .description {
        margin-top: 8px;
        font-family: "Manrope";
        font-weight: 600;
        font-size: 12px;
        line-height: normal;
        letter-spacing: 0;
        color: #7b858d; }
      .product-on-list .data .information .price {
        margin-top: 24px;
        font-family: "Manrope";
        font-weight: 700;
        font-size: 20px;
        line-height: 20px;
        letter-spacing: 1%;
        color: #111111; }
    .product-on-list .data .btn {
      background-color: #00b3b3; }

/* ----------------------------------------
    NEW PRODUCTS
---------------------------------------- */
.new-products .carousel-products {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  flex-direction: row;
  flex-wrap: wrap; }
  .new-products .carousel-products .product-on-list {
    width: calc((100% - 60px) / 3); }

/* ----------------------------------------
    BESTSELLERS
---------------------------------------- */
.bestsellers .carousel-products {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  flex-direction: row;
  flex-wrap: wrap; }
  .bestsellers .carousel-products .product-on-list {
    width: calc((100% - 60px) / 3); }

/* ----------------------------------------
    COUNTERS
---------------------------------------- */
.counters {
  width: 100%;
  margin-top: 80px; }
  .counters .wrap {
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    gap: 0;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 1452px;
    margin: auto; }
    .counters .wrap .count {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0;
      flex-direction: column;
      flex-wrap: wrap; }
      .counters .wrap .count .number {
        display: flex;
        justify-content: center;
        align-items: start;
        gap: 0;
        flex-direction: row;
        flex-wrap: wrap;
        min-width: 300px;
        font-family: "Manrope";
        font-weight: 700;
        font-size: 96px;
        line-height: 128px;
        letter-spacing: 0;
        font-variant-numeric: tabular-nums;
        color: #7b858d; }
        .counters .wrap .count .number .plus {
          font-family: "Manrope";
          font-weight: 700;
          font-size: 56px;
          line-height: 56px;
          letter-spacing: 0; }
      .counters .wrap .count .description {
        margin-top: 16px;
        font-family: "Manrope";
        font-weight: 400;
        font-size: 20px;
        line-height: 24px;
        letter-spacing: 0;
        text-align: center;
        color: #111111; }
    .counters .wrap .separator {
      background-color: #c2ccd4;
      width: 1px; }

/* ----------------------------------------
    PRODUCTS
---------------------------------------- */
.products {
  width: 100%;
  margin-top: 80px; }
  .products .wrap {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 1452px;
    margin: auto; }
    .products .wrap .left-side {
      width: 280px; }
      .products .wrap .left-side hr {
        background-color: #c2ccd4;
        width: 100%;
        height: 1px;
        margin: 40px 0;
        border: none; }
    .products .wrap .right-side {
      width: 1080px; }
      .products .wrap .right-side .products-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0;
        flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: 40px; }
        .products .wrap .right-side .products-header h2 {
          font-family: "Manrope";
          font-weight: 700;
          font-size: 48px;
          line-height: 56px;
          letter-spacing: 0;
          color: #111111; }
      .products .wrap .right-side .product-list {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 30px;
        flex-direction: row;
        flex-wrap: wrap;
        padding-right: 120px; }
        .products .wrap .right-side .product-list .product-on-list {
          width: calc((100% - 30px) / 2); }

/* ----------------------------------------
    CATEGORY LIST
---------------------------------------- */
.category-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  flex-direction: row;
  flex-wrap: wrap; }
  .category-list .category-item h3 a {
    font-family: "Manrope";
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0;
    color: #6d4e83; }
  .category-list .category-item .category-links {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 24px; }
    .category-list .category-item .category-links a {
      font-family: "Manrope";
      font-weight: 600;
      font-size: 16px;
      line-height: normal;
      letter-spacing: 0;
      color: #7b858d; }

/* ----------------------------------------
    FILTERS
---------------------------------------- */
.filters h3 {
  font-family: "Manrope";
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0;
  color: #6d4e83; }
.filters .filter {
  margin-top: 24px; }
  .filters .filter p {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 8px;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: "Manrope";
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
    color: #111111; }
    .filters .filter p a {
      display: none;
      font-family: "Manrope";
      font-weight: 600;
      font-size: 14px;
      line-height: normal;
      letter-spacing: 0;
      color: #00b3b3; }
  .filters .filter ul {
    display: flex;
    justify-content: start;
    align-items: start;
    gap: 16px;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 16px; }
    .filters .filter ul li {
      display: flex;
      justify-content: start;
      align-items: center;
      gap: 12px;
      flex-direction: row;
      flex-wrap: wrap;
      width: 100%; }
      .filters .filter ul li label {
        font-family: "Manrope";
        font-weight: 600;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0;
        color: #7b858d; }

/* ----------------------------------------
    BREADCRUMBS
---------------------------------------- */
.breadcrumbs a,
.breadcrumbs span {
  font-family: "Manrope";
  font-weight: 400;
  font-size: 12px;
  line-height: normal;
  letter-spacing: 0;
  color: #7b858d; }
.breadcrumbs .current {
  color: #4a4f53; }

/* ----------------------------------------
    SORT
---------------------------------------- */
.sort {
  position: relative;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 8px;
  flex-direction: row;
  flex-wrap: wrap;
  font-family: "Manrope";
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0;
  color: #7b858d; }
  .sort .current {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 4px;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: "Manrope";
    font-weight: 600;
    font-size: 12px;
    line-height: normal;
    letter-spacing: 0;
    color: #4a4f53;
    cursor: pointer; }
    .sort .current img {
      width: 8px; }
  .sort .dropdown {
    position: absolute;
    top: 100%;
    right: 12px;
    opacity: 0; }
    .sort .dropdown li {
      font-family: "Manrope";
      font-weight: 600;
      font-size: 12px;
      line-height: normal;
      letter-spacing: 0;
      color: #7b858d;
      cursor: pointer; }
      .sort .dropdown li:hover {
        color: #4a4f53; }
  .sort.open .current img {
    transform: rotate(180deg); }
  .sort.open .dropdown {
    opacity: 1; }

/* ----------------------------------------
    PAGINATION
---------------------------------------- */
.pagination {
  margin-top: 40px; }
  .pagination ul {
    display: flex;
    justify-content: start;
    align-items: start;
    gap: 32px;
    flex-direction: row;
    flex-wrap: wrap; }
    .pagination ul li a {
      font-family: "Manrope";
      font-weight: 600;
      font-size: 16px;
      line-height: normal;
      letter-spacing: 0;
      color: #7b858d; }
    .pagination ul .selected a {
      color: #00b3b3; }

/* ----------------------------------------
    STATIC PAGE
---------------------------------------- */
.static-page {
  width: 100%; }
  .static-page .wrap {
    max-width: 957px;
    margin: auto;
    padding-top: 80px; }
    .static-page .wrap h2 {
      font-family: "Manrope";
      font-weight: 700;
      font-size: 48px;
      line-height: 56px;
      letter-spacing: 0;
      color: #111111; }
    .static-page .wrap .text {
      margin-top: 40px; }
      .static-page .wrap .text * {
        font-family: "Manrope";
        font-weight: 400;
        font-size: 14px;
        line-height: 24px;
        letter-spacing: 0;
        color: #111111; }
      .static-page .wrap .text h3 {
        font-family: "Manrope";
        font-weight: 700;
        font-size: 16px;
        line-height: normal;
        letter-spacing: 0; }
      .static-page .wrap .text p {
        margin-bottom: 20px; }
      .static-page .wrap .text ul {
        margin-bottom: 20px;
        padding-left: 20px; }
        .static-page .wrap .text ul li {
          list-style: disc; }
      .static-page .wrap .text .no-margin {
        margin-bottom: 0; }

/* ----------------------------------------
    OVERLAY
---------------------------------------- */
.overlay {
  background-color: rgba(17, 17, 17, 0.5);
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-direction: row;
  flex-wrap: wrap;
  display: none;
  width: 100%;
  height: 100%; }

/* ----------------------------------------
    POPUP - LOGIN
---------------------------------------- */
.popup-login .btn-reset-password {
  margin: 24px 0;
  font-family: "Manrope";
  font-weight: 600;
  font-size: 14px;
  line-height: normal;
  letter-spacing: 0;
  color: #00b3b3; }
.popup-login .btn-login {
  background-color: #00b3b3;
  width: 100%; }
.popup-login .btn-registration {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 8px;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 40px;
  font-family: "Manrope";
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: #111111; }
  .popup-login .btn-registration a {
    font-family: "Manrope";
    font-weight: 600;
    font-size: 14px;
    line-height: normal;
    letter-spacing: 0;
    color: #00b3b3; }

/* ----------------------------------------
    POPUP - REGISTRATION
---------------------------------------- */
.popup-registration .btn-registration {
  background-color: #00b3b3;
  width: 100%; }
.popup-registration .btn-login {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 8px;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 40px;
  font-family: "Manrope";
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: #111111; }
  .popup-registration .btn-login a {
    font-family: "Manrope";
    font-weight: 600;
    font-size: 14px;
    line-height: normal;
    letter-spacing: 0;
    color: #00b3b3; }

/* ----------------------------------------
    POPUP - RESET PASSWORD
---------------------------------------- */
.popup-reset-password .btn-reset-password {
  background-color: #00b3b3;
  width: 100%;
  margin-top: 24px; }
.popup-reset-password .btn-login {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 8px;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 40px;
  font-family: "Manrope";
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: #111111; }
  .popup-reset-password .btn-login a {
    font-family: "Manrope";
    font-weight: 600;
    font-size: 14px;
    line-height: normal;
    letter-spacing: 0;
    color: #00b3b3; }

/* ----------------------------------------
    POPUP - CART
---------------------------------------- */
.popup-cart .popup-footer {
  margin-top: auto; }
  .popup-cart .popup-footer .buttons .btn-continue-shopping {
    background-color: #4a4f53; }

/* ----------------------------------------
    POPUP STATIC
---------------------------------------- */
.popup-static {
  background-color: white;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  flex-direction: column;
  flex-wrap: wrap;
  padding: 40px 120px; }
  .popup-static .popup-header {
    margin-bottom: 40px; }
    .popup-static .popup-header h2 {
      font-family: "Manrope";
      font-weight: 600;
      font-size: 36px;
      line-height: 40px;
      letter-spacing: 0;
      color: #00b3b3; }
  .popup-static .popup-form {
    width: 465px; }
    .popup-static .popup-form form {
      display: flex;
      justify-content: start;
      align-items: start;
      gap: 16px;
      flex-direction: column;
      flex-wrap: wrap; }
      .popup-static .popup-form form input[type='text'],
      .popup-static .popup-form form input[type='email'],
      .popup-static .popup-form form input[type='password'] {
        width: 100%;
        padding: 14px 24px;
        border: solid 1px #111111;
        font-family: "Manrope";
        font-weight: 400;
        font-size: 14px;
        line-height: normal;
        letter-spacing: 0;
        color: #111111; }
        .popup-static .popup-form form input[type='text']:valid,
        .popup-static .popup-form form input[type='email']:valid,
        .popup-static .popup-form form input[type='password']:valid {
          border-width: 2px; }
      .popup-static .popup-form form .agreement {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 8px;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 8px 0 24px 0; }
        .popup-static .popup-form form .agreement label {
          font-family: "Manrope";
          font-weight: 400;
          font-size: 14px;
          line-height: 24px;
          letter-spacing: 0;
          color: #111111; }
          .popup-static .popup-form form .agreement label a {
            font-family: "Manrope";
            font-weight: 600;
            font-size: 14px;
            line-height: normal;
            letter-spacing: 0;
            color: #00b3b3; }

/* ----------------------------------------
    POPUP FIXED
---------------------------------------- */
.popup-fixed {
  background-color: white;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  display: flex;
  justify-content: start;
  align-items: start;
  gap: 0;
  flex-direction: column;
  flex-wrap: wrap;
  width: 50%;
  height: 100%;
  padding: 64px; }
  .popup-fixed .popup-header h2 {
    font-family: "Manrope";
    font-weight: 700;
    font-size: 48px;
    line-height: 56px;
    letter-spacing: 0;
    color: #111111; }
  .popup-fixed .popup-content {
    padding: 16px 0; }

/* ----------------------------------------
    POPUP
---------------------------------------- */
.popup {
  display: none; }
  .popup .btn-close-popup {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 16px; }
  .popup .popup-header {
    margin-bottom: 40px; }

/* ----------------------------------------
    STATEMENT
---------------------------------------- */
.statement-error {
  background-color: rgba(255, 0, 0, 0.2);
  padding: 16px;
  border: solid 1px red;
  font-family: "Manrope";
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: red; }

/*# sourceMappingURL=style.css.map */