#product-moodboard {
    height: 100%;
}

.sticky {
    position: sticky;
    top: 80px;
}

.mood-board {
    width: 100%;
    height: 100%;
    aspect-ratio: 1/0.7;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 40px rgba(0, 0, 0, 0.2); }
    .mood-board .images {
      position: absolute;
      top: 0;
      bottom: auto;
      left: 0;
      right: auto;
      margin: auto;
      width: 100%;
      height: 100%;
      max-height: 100%;
    }
      .mood-board .images .element {
        position: absolute;
        -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
                box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
        z-index: 0;
        border-radius: 4px; }
        .mood-board .images .element img {
          width: 100%;
          height: 100%; }

  .custom.nav-link {
    font-size: 18px;
    color: #868686 !important;
    display: inline-block;
    position: relative;
    background-color: transparent !important;
    padding: 10px 5px !important;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    border: 0;
}
    .custom.nav-link::before {
      position: absolute;
      content: "";
      background: #8aaea2 !important;
      bottom: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      width: 0;
      height: 1px;
      -webkit-transition: all .3s ease;
      transition: all .3s ease; }
    .custom.nav-link.active {
      color: #8aaea2 !important; }
      .custom.nav-link.active::before {
        width: 100%; }

  .draggable {
    text-align: center;
    position: relative;
    overflow: hidden; }
    .draggable .add-cart, .draggable .remove-cart {
      cursor: pointer;
      border: 0;
      border-radius: 8px;
      background: rgba(255, 255, 255, 0.8);
      width: 40px;
      height: 40px;
      line-height: 40px;
      text-align: center; }
      .draggable .add-cart i, .draggable .remove-cart i {
        font-size: 20px; }
    .draggable .btns {
      position: absolute;
      bottom: 15px;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      -webkit-transition: all .5s ,opacity .5s;
      transition: all .5s ,opacity .5s; }
      .draggable .btns > :nth-child(odd) {
        -webkit-transform: translateY(-15px);
                transform: translateY(-15px); }
      .draggable .btns > * {
        margin: 0 5px;
        -webkit-transition: all .5s ease;
        transition: all .5s ease;
        opacity: 0;
        visibility: hidden;
        -webkit-transform: translateY(15px);
                transform: translateY(15px);
        position: relative; }
    .draggable:hover .btns > * {
      opacity: 1;
      visibility: visible;
      -webkit-transform: translateY(0) !important;
              transform: translateY(0) !important; }

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