.scrollbox-slider {
position: relative;
}

.scrollbox-slider .controls {
margin-bottom: 30px;
}

.scrollbox-slider .controls > .control {
padding: 5px 20px;
background-color: transparent;
border: 1px solid #dedede;
color: #aaa;
display: inline-block;
}

.scrollbox-slider .controls > .control:hover {
border-color: #aaa;
}

.scrollbox-slider .controls > .control.backward {
-ms-border-radius: 4px 0 0 4px;
border-radius: 4px 0 0 4px;
}

.scrollbox-slider .controls > .control.forward {
-ms-border-radius: 0 4px 4px 0;
border-radius: 0 4px 4px 0;
}


.scrollbox-container {
position: relative;
overflow: hidden;
font-size: 0;
display: block;
    width: 100%;
}

.scrollbox-container > .scrollbox {
margin: 0 -8px;
padding: 0;
white-space: nowrap;
}

.scrollbox-container > .scrollbox > .element {
display: inline-block;
position: relative;
white-space: normal;
vertical-align: top;
padding:0 8px;
}

@media (max-width: 767px) {
    .product_slider > .scrollbox-container > .scrollbox > .element {
width: 100%;
}
}

@media (min-width:768px) and (max-width: 1199px) {
.product_slider > .scrollbox-container > .scrollbox > .element {
width: 33.333333333%;
}
}

@media (min-width: 1200px) {
.product_slider > .scrollbox-container > .scrollbox > .element {
width: 20%;
}
}