/* =============================================
-----------------  19.Category -------------
==============================================*/

.banner { position: relative; margin-bottom: 20px; }
.banner a,
.banner img { display: block; }
.banner img { width:100%; height:auto; }
.banner a:after { content:''; position: absolute; right:0; left:0; top:0; bottom:0; background-color: #000; opacity:0; transition: all 0.35s; -webkit-transition: all 0.35s; }
.banner:hover a:after { opacity:0.12; }
.banner.zoom-hover { overflow: hidden; }
.banner.zoom-hover img { transition: all 0.35s; -webkit-transition: all 0.35s; }
.banner.zoom-hover:hover img { transform:scale(1.12); -webkit-transform:scale(1.12); -ms-transform:scale(1.12); }
.category-banner,
.filter-row { margin-bottom:30px; }
@media (min-width: 768px) {
    .category-banner,
    .filter-row { margin-bottom: 40px; }
}

.filter-row-left { float:left; margin-right:30px; }
.filter-row-right { float:right; }
.filter-row-box { display:inline-block; }
.filter-row-label { margin-right:8px; font-size:13px; vertical-align: middle; font-weight: bold; }
.filter-row .small-selectbox { min-width:100px; display: inline-block; margin-bottom: 0; vertical-align: middle; }
.filter-row .btn { border-radius: 3px; padding:5px 8px; }
.filter-row .btn.btn-border { border-width: 1px; }
.filter-row .btn-layout { border-color:#eaeaea; color:#7a7a7a; }
.filter-row .btn-layout.active,
.filter-row .btn-layout.active:hover,
.filter-row .btn-layout.active:focus { color:#fff; }
.filter-row .btn-layout { margin-left:6px; }
.filter-row .btn-compare { margin-left:25px; padding:5px 14px; }
.filter-row .btn-layout:hover,
.filter-row .btn-layout:focus { background-color: #eaeaea; border-collapse: #d7d7d7; color:#444; }

/* Category Sidebar */
#category-widget a { display:block; font:600 12px/24px 'Open Sans', Verdana; text-transform: uppercase; }
#category-widget a i { margin-right:8px; }
#category-widget > li > a { color:#666; font-size: 14px; position: relative; border-top:1px solid #eaeaea; padding:6px 10px 6px 43px; text-transform: uppercase; font-weight: 600; }
#category-widget > li:last-child { border-bottom:1px solid #eaeaea; }
#category-widget li li { padding-left:11px; }
#category-widget li li:last-child,
#category-widget li li:last-child a { border-bottom:none; }
#category-widget li li a { color:#7e7e7e; padding:2px 10px 2px 8px; }
#category-widget li ul { display:none; padding:8px 0 10px; border-top:1px solid #eaeaea; }
#category-widget li.open ul { display:block; }
.category-widget-btn { display:block; width:22px; height:22px; font-size:14px; line-height: 22px; text-align: center; background-color: #505050; color:#fff; position: absolute; left:10px; top:7px; transition: all 0.4s; -webkit-transition: all 0.4s; }
.category-widget-btn:after { content:'+'; }
.open .category-widget-btn:after { content:'-'; color:#fff; }
.filter-color-container,
.filter-size-container  { font-size:0; }
.filter-color-container .row,
.filter-size-container .row { margin-left:-5px; margin-right:-5px; }
.filter-color-box,
.filter-size-box { display: inline-block; width:30px; height:30px; border:1px solid #eaeaea; margin: 0 5px 10px; transition: all 0.2s ease; -webkit-transition: all 0.2s ease; }
.filter-color-box { box-shadow: inset 0 0 0 1px #fff; -webkit-box-shadow: inset 0 0 0 1px #fff; }
.filter-color-box:hover,
.filter-color-box:focus { box-shadow: inset 0 0 0 2px #fff; -webkit-box-shadow: inset 0 0 0 2px #fff; }
.filter-size-box { color:#505050; font-size:12px; line-height:28px; text-align: center; text-transform: uppercase; }
.filter-size-box.active,
.filter-size-box.active:hover,
.filter-size-box.active:focus{ color:#fff; cursor: default; }
.filter-size-box:hover,
.filter-size-box:focus { background-color: #e1e1e1; border-color:#d7d7d7; color:#303030; }
.sidebar .filter-group-widget .panel-body { padding:35px 20px 25px; }

/* noUiSlider Styles */
.noUi-target,
.noUi-target * { -webkit-touch-callout: none; -webkit-user-select: none; -ms-touch-action: none; -ms-user-select: none; -moz-user-select: none; -moz-box-sizing: border-box; box-sizing: border-box; }
.noUi-base { width: 100%; height: 100%; position: relative; }
.noUi-origin { position: absolute; right: 0; top: 0; left: 0; bottom: 0; }
.noUi-handle { position: relative; z-index: 1; }
.noUi-stacking .noUi-handle { z-index: 10; /* This class is applied to the lower origin when its values is > 50%. */ }
.noUi-stacking + .noUi-origin { *z-index: -1; /* Fix stacking order in IE7, which incorrectly creates a new context for the origins. */ }
.noUi-state-tap .noUi-origin { -webkit-transition: left 0.3s, top 0.3s; transition: left 0.3s, top 0.3s; }
.noUi-state-drag * { cursor: inherit !important; }

/* Slider size and handle placement; */
.noUi-horizontal { height: 2px; }
.noUi-horizontal .noUi-handle { width:12px; height:12px; left: 0; top: -5px; }
.noUi-horizontal.noUi-extended { padding: 0 15px; }
.noUi-horizontal.noUi-extended .noUi-origin  { right: -15px; }

/* Styling */
.noUi-background { background: #e1e1e1; }
.noUi-connect { -webkit-transition: background 450ms; transition: background 450ms; }
.noUi-origin { border-radius: 3px; }
.noUi-target { border-radius: 2px; }
.noUi-target.noUi-connect { box-shadow: inset 0 0 3px rgba(51,51,51,0.45), 0 3px 6px -5px #BBB; }

/* Handles and cursors;*/
.noUi-dragable { cursor: w-resize; }
.noUi-handle { border-radius: 50%; cursor: default; }

/* Blocked state */
.noUi-state-blocked.noUi-connect,
.noUi-state-blocked .noUi-connect { background: #4FDACF; }

.filter-price { }
.price-range { margin-top:5px; margin-bottom:22px; }
.filter-range-details {}
.filter-price .row { margin-left:-10px; margin-right:-10px; }
.filter-price .col-xs-6 { padding:0 10px; }
.filter-price-label { color:#505050; font-size:12px; margin-bottom:6px; text-transform: uppercase; }
.filter-range-details .form-control { background-color: #f2f2f2; font-size:14px; height:auto; margin-bottom: 20px; padding:6px 10px; }
.filter-range-details .form-control:focus { background-color: #eaeaea; }

/* fix for display:inline-block auto margin for child elements*/
.filter-price-action { font-size:0; }
.filter-price-action .btn-sm { margin-right:10px; margin-bottom:5px; }
.filter-price-action .btn.btn-sm { padding:5px 12px; font-size:13px; }
.filter-brand-list { margin-top:-10px; }
.filter-brand-list a { display:block; font:600 12px/24px 'Open Sans', Verdana, sans-serif; color:#7e7e7e; padding:2px 0; text-transform: uppercase; }
.filter-brand-list a i { margin-right:8px; }
.filter-brand-list a span { float:right; }

@media (max-width: 767px) {
    .filter-row-left,
    .filter-row-right {}
}