﻿.stepcarousel{
    position: relative; /*leave this value alone*/
    /*border: 20px solid navy;*/
    overflow: scroll; /*leave this value alone*/
    width: 280px;
    height: 200px; /*Height should enough to fit largest content's height*/
}
.stepcarousel .belt{
    position: absolute; /*leave this value alone*/
    left: 0;
    top: 0;
}
.stepcarousel .panel{
    float: left; /*leave this value alone*/
    overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
    margin-left: 35px; /*margin around each panel*/
    margin-top: -5px; /*margin around each panel*/
    margin-right: 15px; /*margin around each panel*/
    margin-bottom: 15px; /*margin around each panel*/
    /*width: 250px; Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.stepcarouselMini{
    position: relative; /*leave this value alone*/
    /*border: 20px solid navy;*/
    overflow: scroll; /*leave this value alone*/
    width: 280px;
    height: 200px; /*Height should enough to fit largest content's height*/
    
}
.stepcarouselMini .beltMini{
    position: absolute; /*leave this value alone*/
    left: 0;
    top: 0;
}
.stepcarouselMini .panelMini{
    float: left; /*leave this value alone*/
    overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
    margin-left: 12px; /*margin around each panel*/
    margin-top: 5px; /*margin around each panel*/
    margin-right: 15px; /*margin around each panel*/
    margin-bottom: 15px; /*margin around each panel*/
    /*width: 250px; Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
  