:root {
    --product-img-background-color: #e2e3e7;
    --product-hover-background-color: #f6f2e0;
    --product-not-mf-color: black;
    --product-is-mf-color: #8c7b47;
}

.card-slider {
  /** max-width: 1920px;*/
  width: 95%;
  margin: 0 auto;
  /** Main link */
  /** Product title */
  /** Product image */
  /** Product description */
  /** Floating "sale" badge */
  /** Price */
  /** Rating */
  /** "30 reviews" link next to stars */
  /** Hover state = add box shadow, underline the title */
}
@media screen and (max-width: 1024px) {
  .card-slider {
    width: 80%;
  }
}
.card-slider .slick-prev-icon,
.card-slider .slick-next-icon {
  color: black;
}
.card-slider .slick-slide {
  padding: 0 10px;
}
.card-slider .card {
  position: relative;
  display: flex !important;
  flex-direction: column;  
  background-color: white;
  text-decoration: none;
  color: rgba(0, 0, 0, 0.9);
  transition: all 0.1s linear;
  border: hidden;
}
@media screen and (max-width: 600px) {
  .card-slider .card {
    height: auto;
  }
}

/**
  Controls (previous/next buttons)
*/
.is-control {
    background: 0;
    border: 0;
    padding: 0 10px;
    z-index: 1;
    cursor: pointer;
    font-size: 40px;
    color: rgba(0,0,0,.6);
    transition: all .2s linear;
}

    .is-control:hover {
        color: rgba(0,0,0,1);
    }

    .is-control:focus {
        outline: none;
        background-color: rgba(0,0,0,.8);
        color: rgba(255,255,255,1);
        border-radius: 5px;
    }

.previous-button {
    position: absolute;
    left: -50px;
    top: 27%;
}

.next-button {
    position: absolute;
    right: -50px;
    top: 27%;
}

.product-slider-wise {
    display: block;
    margin-bottom: auto;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .product-slider-wise .img_index {
        display: block;
        border-radius: 4px;
        height: 255px;
        position: relative;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
        z-index: 0;
        padding: 0px;
    }

        .product-slider-wise .img_index:after {
            z-index: -1;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            content: '';
            background: #000000;
            opacity: 0;
            border-radius: 4px;
            -moz-transition: all 0.6s ease;
            -o-transition: all 0.6s ease;
            -webkit-transition: all 0.6s ease;
            -ms-transition: all 0.6s ease;
            transition: all 0.6s ease;
        }

        .product-slider-wise .img_index .desc {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease;
            opacity: 0;
        }

            .product-slider-wise .img_index .desc .meta-prod a {
                margin: 0 2px;
                width: 60px;
                height: 60px;
                border: 1px solid rgba(255, 255, 255, 0.5);
            }

                .product-slider-wise .img_index .desc .meta-prod a span {
                    color: #fff;
                }

    .product-slider-wise .img {
        display: block;
        border-radius: 4px;
        position: relative;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
        z-index: 0;
        width: 100%;
        padding: 0%;
    }

        .product-slider-wise .img:after {
            z-index: -1;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            content: '';
            background: #000000;
            opacity: 0;
            border-radius: 4px;
            -moz-transition: all 0.6s ease;
            -o-transition: all 0.6s ease;
            -webkit-transition: all 0.6s ease;
            -ms-transition: all 0.6s ease;
            transition: all 0.6s ease;
        }

        .product-slider-wise .img .desc {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease;
            opacity: 0;
        }

            .product-slider-wise .img .desc .meta-prod a {
                margin: 0 2px;
                width: 60px;
                height: 60px;
                border: 1px solid rgba(255, 255, 255, 0.5);
            }

                .product-slider-wise .img .desc .meta-prod a span {
                    color: #fff;
                }

    .product-slider-wise .text {
        padding-top: 0px;
        position: relative;
    }

        .product-slider-wise .text .sale, .product-slider-wise .text .seller, .product-slider-wise .text .new {
            position: absolute;
            top: 0;
            left: 4px;
            font-size: 8px;
            padding: 0 5px;
            color: #fff;
        }

        .product-slider-wise .text .sale {
            background: var(--layout-color);
        }

        .product-slider-wise .text .seller {
            background: #fe9801;
        }

        .product-slider-wise .text .new {
            background: #01d28e;
        }

        .product-slider-wise .text .h2 {
            font-size: 14px;
            padding: 0px;
            margin: 0px;            
        }

        .product-slider-wise .text .category {
            font-size: 11px;
            font-style: italic;
            padding: 0px;
            margin: 0px;
            color: var(--layout-color);
        }

        .product-slider-wise .text .price {
            font-size: 14px;
            font-style: italic;
            padding: 0px;
            margin: 0px;
            color: #000000;
        }

            .product-slider-wise .text .price.price-sale {
                font-size: 14px;
                padding: 0px;
                margin: 0px;
                color: #cccccc;
                text-decoration: line-through;
            }

/*.product-slider-wise:hover {
        -webkit-box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
    }

        .product-slider-wise:hover .img:after {
            opacity: .7;            
        }

        .product-slider-wise:hover .img .desc {
            opacity: 1;
        }*/

.product-img-container-wise {
    position: relative;
    width: auto;
    height: auto;
    overflow: hidden;
}

.button-product-wise {
    display: none;
}

.product-container-wise:hover {
    /*border-style: solid;
    border-color: #8c7b47;*/
    background-color: var(--product-hover-background-color, #f6f2e0);
}

.product-img-container-wise:hover > div .img {
    /*-webkit-transform: scale(1.2);
    transform: scale(1.2);*/
    -webkit-transform: translateY(-25px);
    transform: translateY(-25px);
}

.product-container-wise:hover > div .button-product-wise {
    display: block;
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .button-product-wise {
        display: unset;
    }

    .product-container-wise:hover {
        border-style: unset;
        border-color: unset;
        background-color: unset;
    }

    .product-img-container-wise:hover > div .img {
        -webkit-transform: unset;
        transform: unset;
    }

    .product-container-wise:hover > div .button-product-wise {
        display: block;
        white-space: nowrap;
    }
}

.product-list {    
    width: 95%;
    margin: 0 auto;
}

@media screen and (max-width: 1024px) {
    .product-list {
        width: 80%;
    }
}

.product-wise {
    display: block;
    margin-bottom: auto;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
}

    .product-wise .img_index {
        display: block;
        border-radius: 4px;
        height: 255px;
        position: relative;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
        z-index: 0;
        padding: 0px;
    }

        .product-wise .img_index:after {
            z-index: -1;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            content: '';
            background: #000000;
            opacity: 0;
            border-radius: 4px;
            -moz-transition: all 0.6s ease;
            -o-transition: all 0.6s ease;
            -webkit-transition: all 0.6s ease;
            -ms-transition: all 0.6s ease;
            transition: all 0.6s ease;
        }

        .product-wise .img_index .desc {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease;
            opacity: 0;
        }

            .product-wise .img_index .desc .meta-prod a {
                margin: 0 2px;
                width: 60px;
                height: 60px;
                border: 1px solid rgba(255, 255, 255, 0.5);
            }

                .product-wise .img_index .desc .meta-prod a span {
                    color: #fff;
                }

    .product-wise .img {
        display: block;
        border-radius: 4px;
        position: relative;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
        z-index: 0;
        width: 100%;
        padding: 0%;
    }

        .product-wise .img:after {
            z-index: -1;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            content: '';
            background: #000000;
            opacity: 0;
            border-radius: 4px;
            -moz-transition: all 0.6s ease;
            -o-transition: all 0.6s ease;
            -webkit-transition: all 0.6s ease;
            -ms-transition: all 0.6s ease;
            transition: all 0.6s ease;
        }

        .product-wise .img .desc {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
            transition: all 0.3s ease;
            opacity: 0;
        }

            .product-wise .img .desc .meta-prod a {
                margin: 0 2px;
                width: 60px;
                height: 60px;
                border: 1px solid rgba(255, 255, 255, 0.5);
            }

                .product-wise .img .desc .meta-prod a span {
                    color: #fff;
                }

    .product-wise .text {
        padding-top: 0px;
        position: relative;
    }

        .product-wise .text .sale, .product-wise .text .seller, .product-wise .text .new {
            position: absolute;
            top: 0;
            left: 4px;
            font-size: 8px;
            padding: 0 5px;
            color: #fff;
        }

        .product-wise .text .sale {
            background: var(--layout-color);
        }

        .product-wise .text .seller {
            background: #fe9801;
        }

        .product-wise .text .new {
            background: #01d28e;
        }

        .product-wise .text .h2 {
            font-size: 14px;
            padding: 0px;
            margin: 0px;            
        }

        .product-wise .text .category {
            font-size: 11px;
            font-style: italic;
            padding: 0px;
            margin: 0px;
            color: var(--layout-color);
        }

.price {
    font-size: 16px;
    padding: 0px;
    margin: 0px;
    color: #000000;
}

.price-sale {
    font-size: 14px;
    padding: 0px;
    margin: 0px;
    /*color: #cccccc;*/
    color: dimgray;
    text-decoration: line-through;
}

/*.product-wise:hover {
        -webkit-box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 10px 27px -21px rgba(0, 0, 0, 0.2);
    }

        .product-wise:hover .img:after {
            opacity: .7;            
        }

        .product-wise:hover .img .desc {
            opacity: 1;
        }*/

.product-img-container-wise {
    position: relative;
    width: auto;
    height: auto;
    overflow: hidden;
}

.product-img-background-color-wise {
    /*background-color: var(--product-img-background-color);*/
    z-index: -1;
}

.drop-shadow-wise {
    -webkit-filter: drop-shadow(10px 5px 5px #4e4e4e);
    filter: drop-shadow(10px 5px 5px #4e4e4e);
    /*-webkit-box-reflect: below -70px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(250, 250, 250, 0.5)));*/
    -webkit-box-reflect: below -90px linear-gradient(to bottom, rgba(0,0,0,0.0), rgba(0,0,0,0.4));
}

.img-box-wise {
    /* Setting to position: relative creates a new stacking context */
    position: relative;
    width: 100%;
}

.shadow-wise {
    display: block;
    border-radius: 4px;
    position: relative;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 0;
    width: 100%;
    padding: 0%;
    filter: drop-shadow(10px 5px 5px #4e4e4e);
}

.reflect-wise {
    display: block;
    border-radius: 4px;
    position: absolute;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 0;
    width: 100%;
    padding: 0%;
    top: 0px;
    left: 0px;
    /*-webkit-box-reflect: below -70px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(250, 250, 250, 0.5)));*/
    -webkit-box-reflect: below -20% linear-gradient(to bottom, rgba(0,0,0,0.0), rgba(0,0,0,0.4));
}

.img-box-wise:hover > img, .img-box-wise:hover > picture {
    /*-webkit-transform: scale(1.2);
    transform: scale(1.2);*/
    -webkit-transform: translateY(-25px);
    transform: translateY(-25px);
}

@media (max-width: 1199px) {
    .img-box-wise:hover > img, .img-box-wise:hover > picture {
        /*-webkit-transform: scale(1.2);
        transform: scale(1.2);*/
        -webkit-transform: unset;
        transform: unset;
    }
}

.product-not-mf-color {
    color: black;
}

.product-is-mf-color {
    color: #d6b86e;
}

.out-of-stock-text-wise {
    border-radius: 32px;
    width: 120px;
    max-width: 120px;
    max-height: 29px;
    overflow: hidden;
    white-space: nowrap;
    padding: 0px 4px;
    border: 1px solid #3d3d3d;
    color: #d6b86e;
    text-align: center;
}

.star-12-large {
    width: 30px;
    height: 30px;
    background: #d78a76;
    transform: rotatez(45deg);
    position: relative !important;
    border-radius: 6px;
}

    .star-12-large:before,
    .star-12-large:after {
        content: "";
        position: absolute;
        width: 30px;
        height: 30px;
        background: #d78a76;
        border-radius: 6px;
    }

    .star-12-large:before {
        transform: rotatez(60deg);
    }

    .star-12-large:after {
        transform: rotatez(-60deg);
    }

.star-12-medium {
    width: 26px;
    height: 26px;
    background: #fff;
    transform: rotatez(45deg);
    position: relative !important;
    border-radius: 4px;
}

    .star-12-medium:before,
    .star-12-medium:after {
        content: "";
        position: absolute;
        width: 26px;
        height: 26px;
        background: #fff;
        border-radius: 4px;
    }

    .star-12-medium:before {
        transform: rotatez(60deg);
    }

    .star-12-medium:after {
        transform: rotatez(-60deg);
    }

.star-12-small {
    width: 22px;
    height: 22px;
    background: #ad8b35;
    transform: rotatez(45deg);
    position: relative !important;
    border-radius: 4px;
}

    .star-12-small:before,
    .star-12-small:after {
        content: "";
        position: absolute;
        width: 22px;
        height: 22px;
        background: #ad8b35;
        border-radius: 4px;
    }

    .star-12-small:before {
        transform: rotatez(60deg);
    }

    .star-12-small:after {
        transform: rotatez(-60deg);
    }