.mdi-light--heart {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4.24 12.25a4.2 4.2 0 0 1-1.24-3A4.25 4.25 0 0 1 7.25 5c1.58 0 2.96.86 3.69 2.14h1.12A4.24 4.24 0 0 1 15.75 5A4.25 4.25 0 0 1 20 9.25c0 1.17-.5 2.25-1.24 3L11.5 19.5zm15.22.71C20.41 12 21 10.7 21 9.25A5.25 5.25 0 0 0 15.75 4c-1.75 0-3.3.85-4.25 2.17A5.22 5.22 0 0 0 7.25 4A5.25 5.25 0 0 0 2 9.25c0 1.45.59 2.75 1.54 3.71l7.96 7.96z'/%3E%3C/svg%3E");
  }

  .ph--bag-light {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23000' d='M216 66h-42v-2a46 46 0 0 0-92 0v2H40a14 14 0 0 0-14 14v120a14 14 0 0 0 14 14h176a14 14 0 0 0 14-14V80a14 14 0 0 0-14-14M94 64a34 34 0 0 1 68 0v2H94Zm124 136a2 2 0 0 1-2 2H40a2 2 0 0 1-2-2V80a2 2 0 0 1 2-2h42v18a6 6 0 0 0 12 0V78h68v18a6 6 0 0 0 12 0V78h42a2 2 0 0 1 2 2Z'/%3E%3C/svg%3E");
  }

  .ph--user-thin {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23000' d='M227.46 214c-16.52-28.56-43-48.06-73.68-55.09a68 68 0 1 0-51.56 0c-30.64 7-57.16 26.53-73.68 55.09a4 4 0 0 0 6.92 4C55 184.19 89.62 164 128 164s73 20.19 92.54 54a4 4 0 0 0 3.46 2a3.93 3.93 0 0 0 2-.54a4 4 0 0 0 1.46-5.46M68 96a60 60 0 1 1 60 60a60.07 60.07 0 0 1-60-60'/%3E%3C/svg%3E");
  }

  
.montserrat-font {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 800;
    font-style: normal;
  }

  body {
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0.5px;
    line-height: 1.5;
  }
    #navbarNav1 {
        padding: 0%;
    }
    #navbarNav1 .nav-item {
        color: black;
        padding: 0 3px;
        font-size: small;
    }
    .nav-link {
        color: black !important;
    }
    .nav-link :hover {
      text-decoration: underline !important;
    }
    .dropdown a:hover .dropdown-menu{
        display: block !important;
     }
    #search-btn:hover {
        background-color: lightgray;
        color: white;
    }
    #shop-btn {
        background-color: black;
        color: white;
        padding: 2px 10px;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
    }
    #shop-btn:hover {
        background-color: gray;
        color: white;
    }
    .icon {
        padding: 2px;
      }
    .icon :hover {
        background-color: lightgray;
        border-radius: 10px;
      }
    .img-card {
        margin: 0 10px;
        padding: 0 10px;
        border: none;
        cursor: pointer;
    }
    .img-card:hover {
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

    }
    .scale-card:hover {
      transition: transform 0.1s;
      transform: scale(1.05);
    }
    .mobile-carousel {
        display: none;
    }
    .shoe-btn {
        background-color: white;
        color: black;
        padding: 2px 10px;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
        position: absolute;
        bottom: 20px;
        left: 20%;
        z-index: 1;
    }
    .sign-up-btn {
        background-color: white;
        color: black;
        padding: 2px 10px;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
    }
    .sign-up-btn:hover {
      background-color: black;
      color: white;
    }
    .card-overlay, .card-overlay-top {
      position: absolute;
      left: 20%;
      color: white;
      z-index: 1;
    }
    .card-overlay {
      bottom: 65px;
    }
    .card-overlay-top {
      bottom: 100px;
    }
    .shoe-btn:hover {
        background-color: gray;
        color: white;
    }
    .card {
        position: relative;
        padding: 0;
    }
    .card-img-top {
        position: relative;
    }
    .explore-container {
      overflow-x: scroll;
    }
    .footer-links ul li a:hover {
        color: black !important;
    }
    .footer-links:hover .extra-links {
        display: block;
    }
    .extra-links {
        display: none;
    }
    .lower-footer ul li, .lowest-footer {
        font-size: smaller;
    }
    .lower-footer h5 {
      font-size: medium;
    }

    /* Responsive design for mobile devices */
    @media screen and (max-width: 768px) {
        body {
          overflow-x: hidden;
          padding: 0;
        }
        .hero-video {
            display: none;
        }
        .img-card {
            width: 100% !important;
          }
        .card {
            width: 100% !important;
        }
        .nav1 {
            display: none;
        }

        .footer h5 {
          cursor: pointer;
        }
        .footer h5:hover .footer-links{
          display: block !important;
        }
        .low-footer {
          padding: 50px;
        }
        .explore-container, .apps-container {
          flex-direction: column;
          padding-right: 5px;
          padding-left: 0;
        }
        .img-card {
          margin-bottom: 10px;
          margin-right: 5px;
        }
        .img-card:hover {
          transform: none;
        }
        .card {
          padding: 0;
        }
        .desktop-carousel {
          display: none;
        }
        .mobile-carousel {
          display: block;
        }
        .explore-container {
          overflow-x: hidden;
        }
    }