

.ProdVariant ul{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    list-style: none;
    padding-left:0;
    overflow-x: auto;
    margin-bottom: 5px;
}

.ProdVariant ul li{
    width:30px;
    min-width: 30px;
    height: 30px;
    margin-right: 5px !important;
    border-radius: 50%;    
    padding: 1px;
    border: 1px solid #f1f1f1;
    display:flex;
    justify-content:center;
    align-items:center;
}

.ProdVariant ul li.active{
    border: 1px solid #000;
}

.ProdVariant ul li img {
    border-radius: 50%;
    object-fit: cover;
}

.btnViewAll a{
    padding:5px 15px;
    background:#101010;
    color:#fff;
    border-radius:8px;
}
.btnViewAll a:hover{
    color:#fff;
}

/*product*/
.slick_slider_products .slide-fraction{
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    display: inline-block;
    padding: 2px 10px;
    background: #919392;
    border-radius: 20px;
    color: #fff;
}

/*page sale*/
.list-cate ul::-webkit-scrollbar{
  height:3px;
}

.list-cate ul{
    list-style:none;
    display: block;
    overflow: auto;
    text-align: center; 
    white-space: nowrap;
}

.list-cate ul li{
    position: relative;
    vertical-align: top;
    display: inline-flex;
    flex-direction: column;
}

.list-cate ul li p{
    color:#fff;
}

.cate-outstanding{
    padding:1rem 0;
}

.cate-outstanding.stuck{
    padding:0;
    background-color: #942224;
    box-shadow: rgb(0 0 0 / 20%) 0px 8px 16px;
}

.cate-outstanding.stuck ul li.active{
    background-color: #862122;
}

.productSaleTop{
    border-bottom-right-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

.productSaleTop a{
  text-decoration:none;
  color:#fff;
  padding:10px;
  border:1px solid #fff;
  border-radius:.5rem;
}


/*start popup order fake*/
@keyframes nFadeIn {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes nFadeOut {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
        bottom: 0;
    }
}

#someone-purchased {
    background: #fff;
    display: none;
    bottom: 20px;
    left: 20px;
    top: auto !important;
    right: auto !important;
    position: fixed;
    text-align: left;
    width: auto;
    z-index: 99;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    padding: 5px;
    border-radius: 5px
}
@media (max-width: 480px) {
    #someone-purchased {
        left: 10px;
        bottom: 80px;
        width: calc(100% - 20px)
    }
}
#someone-purchased .someone-purchased-content {
    overflow: hidden;
    display: flex;
    align-items: center
}
#someone-purchased .someone-purchased-content img {
    flex: 1;
    cursor: pointer;
    max-width: 60px;
    width: 60px
}
@media (max-width: 480px) {
    #someone-purchased .someone-purchased-content img {
        max-width: 45px;
        width: 45px
    }
}
#someone-purchased .someone-purchased-content p {
    flex: 1;
    color: #333f48;
    font-size: 13px;
    margin: 0 0 0 13px;
    line-height: 20px;
    max-width: 300px;
    padding-right: 15px
}
@media (max-width: 480px) {
    #someone-purchased .someone-purchased-content p {
        max-width: 100%
    }
}
#someone-purchased .someone-purchased-content p a {
    padding-right: 51px;
    color: #333f48;
    display: block;
    font-size: 15px;
    font-weight: 600;
    overflow: hidden;
    text-decoration: none;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: unset;
    max-height: 40px;
    min-height: 40px
}
@media (max-width: 480px) {
    #someone-purchased .someone-purchased-content p a {
        padding-right: 20px;
        font-size: 14px
    }
}
#someone-purchased .someone-purchased-content p a:hover {
    color: #eb3e32
}
#someone-purchased .someone-purchased-content p small {
    text-align: right;
    display: block;
    font-size: 10px;
    margin-bottom: 0px;
    line-height: 12px;
    color: #eb3e32
}
#someone-purchased.fade-in {
    opacity: 0;
    animation-name: nFadeIn;
    animation-duration: 1s;
    animation-fill-mode: both
}
#someone-purchased.fade-out {
    opacity: 0;
    animation-name: nFadeOut;
    animation-duration: 1s;
    animation-fill-mode: both
}
#someone-purchased .close-buttom-popup {
    position: absolute;
    right: -10px;
    top: -8px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    color: #333f48;
    background: #fff;
    border-radius: 20px
}
#someone-purchased .close-buttom-popup:hover {
    color: #eb3e32
}
#tnContact {
    max-width: 230px;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    position: fixed;
    bottom: 68px;
    right: 20px;
    z-index: 10
}
@media (max-width: 767px) {
    #tnContact {
        bottom: 68px;
        left: auto;
        right: 5px
    }
}

/*end popup order fake*/

.is-new-user__toggle {
    right: 100%;
    font-size: 16px;
    width: 150px;
    padding-top: 5px;
    padding-bottom: 5px;
    text-decoration: none;
}

.is-new-user__toggle:hover {
    color: #fff;
}

.is-new-user__toggle {
    position: absolute;
    z-index: 99;
    top: 0;
    right: 0;
    width: 170px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    padding: 10px 20px;
    display: block;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: #ff3102;
    transform: rotate(-90deg);
    transform-origin: bottom right;
}

@media screen and (max-width: 768px){
  .is-new-user__toggle {
      width: 120px;
      font-size: 14px;
      padding: 6px 0px;
  }
}

/*services*/
.homepage-service__card {
    background-color: #d9d9d9;
    display: flex;
    height: 100%;
    align-items: center;
    padding: 0.5rem 1.5rem;
    border-radius: 0.375rem;
    gap: 1rem;
}

.homepage-service__text {
    font-size: 12px !important;
    font-weight: 500;
    font-size: 1rem;
    color: #000;
    text-transform: uppercase;
    text-align: center;
}

/*banner mini*/

.home-banner-mini a {
  text-decoration: none;
}

.collection-grid__buttons, 
.infomation-card__buttons {
    padding: 1.5rem;
}

.collection-grid__buttons, 
.infomation-card__buttons {
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 2rem 2.5rem;
}

.collection-grid__title, 
.infomation-card__title {
    font-size: 2.25rem;
    font-weight: 600;
    line-height: 1.25;
    color: #fff;
}

.collection-grid__button, 
.infomation-card__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 57px;
    flex: 0 0 57px;
    height: 57px;
    border-radius: 100px;
    background-color: #fff;
}

.collection-grid__button, 
.infomation-card__button {
    width: 45px;
    flex: 0 0 45px;
    height: 45px;
}

.collection-grid__button svg, 
.infomation-card__button svg {
    width: 20px;
    height: 20px;
    color: #000;
}

@media (max-width: 991px) {
  .homepage-service__card {
      width: 100%;
      flex-flow: column;
      align-items: flex-start;
      padding: 0.875rem;
  }
}
