

/*** TITLE & CONTAINERS ***/
.nop-jcarousel {
    margin: 40px auto;
}

.carousel-title .titleWrapper {
    text-align: left;
    display: flex;
    font-size: 20px;
    line-height: 44px;
}

.nop-jcarousel .carousel-title {
    text-align: left;
}

.jcarouselInsta .slick-carousel {
    width: 100%;
}

.carousel-title .html-widget {
    display: flex;
    margin-left: auto;
    justify-content: center;
    align-self: center;
    margin-right:0;
}

.nop-jcarousel {
    position: relative;
    margin: 20px 60px 60px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    border-top: 1px solid #eaeaea;
}

    .nop-jcarousel .carousel-title {
        padding: 10px 15px 10px 15px;
        border-bottom: 1px solid rgba(0, 0, 0, .1);
        /*font-size: 21px;*/
        font-weight: normal;
        text-align: left;
        display: flex;
    }

.listView {
    float: left;
    margin: 0px !important;
}

.nop-jcarousel .carousel-title span {
    font-family: proxima-reg;
    text-align: center;
    color: #333333;
    position: relative;
    font-weight: normal;
    display: inline-block;
    float: left;
}

.jcarouselInsta .title {
    font-size: 20px;
    line-height: 40px;
    font-family: proxima-reg;
    color: #333333;
}

.nop-jcarousel .slick-list {
    margin: 0;
    /*padding-right:120px;*/
}

.nop-jcarousel .carousel-item {
  /*  padding: 4px;*/
    height: auto;
}

    .nop-jcarousel .carousel-item .item-box {
        width: 100% ;
        margin: 0 !important;
        height: 100%;
        max-width: 260px;
    }
.slick-initialized .item-box {
    height: auto !important;
    width: 100% !important;
}
.slick-carousel {
    max-height: 380px;
    overflow: hidden;
}
.home-page .nop-jcarousel.home-page-product-grid, .brands-jcarousel .nop-jcarousel {
    overflow: hidden;
    width: 98%;
    margin: 15px auto 0px;
    max-width:1640px;
}

.jCarouselMainWrapper .item-box .title {
    -webkit-transform: translateZ(0) scale(1.0, 1.0); /*Fix for delayed title load on swipe*/
}

.carousel-item .ribbon-position {
    -webkit-transform: translateZ(0) scale(1.0, 1.0); /*Fix for delayed ribbon load on swipe*/
}

/*** NAVIGATION ***/

.nop-jcarousel .slick-prev {
    display: inline-block;
    margin: 5px 6px 5px 5px !important;
    vertical-align: top;
    background-repeat: no-repeat;
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    background: url(/Themes/Urban/Content/img/all-icons.png) no-repeat -34px -430px;
    width: 11px;
    height: 15px;
    margin: 2px;
    border: none;
    font-size: 0;
}

.nop-jcarousel .slick-next {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    display: inline-block;
    margin: 5px 6px 5px 5px !important;
    vertical-align: top;
    background-repeat: no-repeat;
    background: url(/Themes/Urban/Content/img/all-icons.png) no-repeat -34px -400px;
    width: 11px;
    height: 15px;
    margin: 2px;
    border: none;
    font-size: 0;
}

.nop-jcarousel .nWrapper {
    right: 0px;
    left: auto;
    z-index: 1;
}

.nop-jcarousel .pWrapper, .nop-jcarousel .nWrapper {
    position: absolute;
    top: 50%;
    height: auto;
    background: #e7e9ec;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    padding: 0;
    text-align: center;
    text-decoration: none !important;
    vertical-align: middle;
}

.nop-jcarousel .pWrapper {
    left: -0px;
    right: auto;
    z-index: 1;
}

.nop-jcarousel .a-button-inner {
    padding: 21px 6px 21px 6px;
    line-height: 0;
    display: block;
    position: relative;
    overflow: hidden;
    height: auto;
    border-radius: 2px;
    box-shadow: 1px 2px 10px -1px rgba(0,0,0,.3);
    background-color: hsla(0,0%,100%,.98);
}

.nWrapper:hover, .pWrapper:hover {
    border-color: #a2a6ac #979aa1 #82858a;
}

.nWrapper:active .a-button-inner, .pWrapper:active .a-button-inner {
    background-color: #dcdfe3;
}

.nWrapper:active .a-button-inner, .pWrapper:active .a-button-inner {
    box-shadow: 0 1px 3px rgba(0,0,0,.2) inset;
    background-color: #e7e9ec;
    background-image: none;
}

.a-button.a-button-pressed, .a-button.a-button-pressed:hover {
    border-color: #adb1b8 #a2a6ac #a2a6ac
}

    .a-button.a-button-pressed .a-button-inner, .a-button.a-button-pressed:hover .a-button-inner {
        background-color: #dcdfe3;
        background-image: none;
        box-shadow: 0 0 3px 2px rgba(228,121,17,.5)
    }

.a-button.a-button-focus, .nWrapper:focus, .pWrapper:focus {
    outline: 0;
    border-color: #e77600;
    box-shadow: 0 0 3px 2px rgba(228,121,17,.5);
}

.nWrapper:active, .nWrapper:active:hover, .pWrapper:active, .pWrapper:active:hover {
    border-color: #adb1b8 #a2a6ac #a2a6ac;
}

.nop-jcarousel .slick-prev:hover,
.nop-jcarousel .slick-next:hover {
    border-color: #333;
}

.nop-jcarousel .slick-disabled,
.nop-jcarousel .slick-disabled:hover {
    opacity: 0.3;
    filter: alpha(opacity=30);
    cursor: default;
}

.nop-jcarousel .slick-dots {
    text-align: center;
    font-size: 0;
    padding: 30px 0;
}

    .nop-jcarousel .slick-dots li {
        display: inline-block;
        margin: 0 8px;
    }

    .nop-jcarousel .slick-dots button {
        width: 20px;
        height: 20px;
        font-size: 0;
        border: none;
        background: #333;
    }

        .nop-jcarousel .slick-active button,
        .nop-jcarousel .slick-dots button:hover {
            background: #aaa;
        }

.nop-jcarousel.home-page-category-grid {
    background: none;
    overflow: visible;
}

    .nop-jcarousel.home-page-category-grid .item-box .title,
    .nop-jcarousel.home-page-category-grid .item-box .picture {
        width: 100% !important;
        position: relative !important;
        margin: 0 !important;
    }

    .nop-jcarousel.home-page-category-grid .item-box .title {
        height: 70px;
        line-height: 70px;
        margin: 0 0 10px !important;
        z-index: 2;
    }

    .nop-jcarousel.home-page-category-grid .item-box .picture {
        z-index: 1;
    }

    .nop-jcarousel.home-page-category-grid .item-box .title:after {
        content: "";
        display: block;
        width: 0;
        height: 0;
        border-left: 15px solid transparent;
        border-top: 15px solid #282828;
        border-right: 15px solid transparent;
        position: absolute;
        top: 100%;
        bottom: auto;
        left: 50%;
        margin: 0 0 0 -14px;
        z-index: 1;
    }

    .nop-jcarousel.home-page-category-grid .item-box .title a {
        padding: 0;
    }

.nop-jcarousel.sub-category-grid .picture,
.nop-jcarousel.manufacturer-grid .picture,
.nop-jcarousel.vendor-grid .picture {
    margin: 0;
}

@media all and (min-width: 1025px) {



    .side-2 .nop-jcarousel .carousel-title {
        position: relative;
        padding: 8px 35px;
    }

    .side-2 .nop-jcarousel .slick-next {
        top: 0;
        right: 5px;
        width: 30px;
        height: 45px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUCAYAAACaq43EAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTgyRTkxODdBQ0I5MTFFNkExQzY5NTU5ODc1OTQzQzYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTgyRTkxODhBQ0I5MTFFNkExQzY5NTU5ODc1OTQzQzYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxODJFOTE4NUFDQjkxMUU2QTFDNjk1NTk4NzU5NDNDNiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxODJFOTE4NkFDQjkxMUU2QTFDNjk1NTk4NzU5NDNDNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgxxlV8AAAFMSURBVHjaYmagIjA2NmaRkpKaC8Q/nj9/fhefWkZqWgqkVgJxEBB/BWK7s2fPnsOlnomKls6GWgoC3EB8CChuRFOLgYAXiPXQxECWbwdarkLroBYEUoeBWBtN6h4QmwCD/T0tfMwANdgWiK+iSSmBHAR1GPUtRrLcDYvloFBYC00LkKAGcv5DU+FXJIVfoPR3IP4JZX9EkkcOtk9o4iA9UkCcgMVt64A4HOjAPzCL6QkWAHESCwP9ASgk3jIxDAz4yQJN7rQASniCuoaRFjYC000rkKrCm7hoYGk0kFqCRWo/KKuBLKVqyQW11B2UX6HFJTIAVRYuyKUXNYtMUJl8FIjFiCkyGalkKag4PIMlQb0CYkOgpc9oVTt9AFWDWCz1xGYpCDBTw1Zga4MB2OrYCmTKAbEBtPh1wdcQoHbigjUIVgAt3YlPLUCAAQAaHGvg+9RMEwAAAABJRU5ErkJggg==');
    }

        .side-2 .nop-jcarousel .slick-next:hover {
            right: 0;
        }

    .side-2 .nop-jcarousel .slick-prev {
        top: 0;
        left: 5px;
        width: 30px;
        height: 45px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUCAYAAACaq43EAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUE1MDA1MkFBQ0JDMTFFNjhDRkJFODdCNkVENTc0QzYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUE1MDA1MkJBQ0JDMTFFNjhDRkJFODdCNkVENTc0QzYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxQTUwMDUyOEFDQkMxMUU2OENGQkU4N0I2RUQ1NzRDNiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxQTUwMDUyOUFDQkMxMUU2OENGQkU4N0I2RUQ1NzRDNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pi4H8ykAAAFHSURBVHjaYjQ2NmYgANyBOAKIU4H4DwOVAAsBeSMgXgvE3FA+1SxnIWDpdiRLE6B0EhD/p9RiJhziUlBLxdDE7YBYgBo+xmaxIBAfxmLpK2h8v6eFxSBL9wCxEpr4VyCOA+I71EpcTGjxvRYat+ggHYh3MlARMCFZuhKIHbGoaQPipQxUBozAfMwIpOchpVp0cI+BBgDk0xY8ljJgiW+qBTU7wwAAZikpqd1AWh6IDehpMQu0FAIVhXxAHIRFzQIgfgbEnNDsBgN8aNkQBvihNDtUDwjwIMmDSkJuRqRKAuSIXVhS9lUgdoNazkCLfAwq/IOhFiEDbaiDBGllMQO0OLTFkoW0ocWoIK0shlnuDi2b0S3fQy3LcdVOoDLZE1pGI4NLQPyZlhaDwDloNQizfB01GwKgfIxP/jkQn4VaFkfNpg9AgAEA+5g0/NXIApUAAAAASUVORK5CYII=');
    }

        .side-2 .nop-jcarousel .slick-prev:hover {
            left: 0;
        }

    .side-2 .nop-jcarousel .slick-next.slick-disabled:hover {
        right: 5px;
    }

    .side-2 .nop-jcarousel .slick-prev.slick-disabled:hover {
        left: 5px;
    }

    .side-2 .nop-jcarousel .slick-dots li {
        margin: 0 3px;
    }

    .side-2 .nop-jcarousel .slick-dots button {
        width: 15px;
        height: 15px;
    }

    .side-2 .nop-jcarousel .slick-carousel {
        padding: 0 5px;
    }
}

@media all and (min-width: 1171px) {
    .nop-jcarousel {
        margin: 20px auto;
        width: 100%;
        max-width: 1640px;
    }
    /*CAROUSEL IN 2 COLUMNS LAYOUT*/
    .center-2 .products-carousel {
        width: 754px;
        margin: 20px 58px;
    }
}


@media all and (max-width: 580px) {

    .carousel-title .html-widget {
        /*display: none;*/
    }

    .nop-jcarousel .carousel-title span::before {
        content: none !important;
    }

    .nop-jcarousel .carousel-title span::after {
        content: none !important;
    }

    .nop-jcarousel .slick-next.slick-disabled:hover {
        left: 5px;
        right: auto;
    }

    .nop-jcarousel .slick-prev.slick-disabled:hover {
        right: 5px;
        left: auto;
    }

    .nop-jcarousel .pWrapper {
        left: -5px;
        right: auto;
        top: 40%;
    }

    .nop-jcarousel .nWrapper {
        right: -5px;
        left: auto;
        top: 40%;
    }

    .nop-jcarousel {
        margin: 0 5px;
    }

        .nop-jcarousel .carousel-title {
            padding: 8px 15px;
        }

        .nop-jcarousel .slick-next:hover {
            right: 0;
        }

        .nop-jcarousel .slick-prev:hover {
            left: 0;
        }

        .nop-jcarousel .slick-dots li {
            margin: 3px;
        }

        .nop-jcarousel .slick-dots button {
            width: 15px;
            height: 15px;
        }

        .nop-jcarousel.sub-category-grid .picture,
        .nop-jcarousel.manufacturer-grid .picture,
        .nop-jcarousel.vendor-grid .picture {
            display: block !important;
        }
}

@media all and (min-width: 581px) and (max-width: 1023px) {

    .nop-jcarousel .slick-next.slick-disabled:hover {
        left: 5px;
        right: auto;
    }

    .nop-jcarousel .slick-prev.slick-disabled:hover {
        right: 5px;
        left: auto;
    }
}

@media all and (max-width: 1024px) {

    .nop-jcarousel .item-box .title:after {
        display: none !important;
    }
}

@media all and (max-width: 480px) and (min-width:1px) {


    .nop-jcarousel .carousel-title span::before {
        border: 0px;
    }

    .nop-jcarousel .carousel-title span::after {
        border: 0px;
    }

    .item-box .product-item .picture > a::before {
        padding-top: 80%;
    }

    .spc-categories .item-box .product-item .picture > a::before {
        padding-top: 80%;
    }
}
