.stepcarousel{
position: relative; /*leave this value alone*/
border: solid 1px #bdbdbd;
/*overflow: scroll;*/ /*leave this value alone*/
overflow:hidden; /*The value above is the orignal stepCarousel style. This was overridden in order to hide scroll bars (hence only display the first item) when javascript is disabled.*/
width: 612px; /*Width of Carousel Viewer itself*/
height: 310px; /*Height should enough to fit largest content's height*/
}
.stepcarousel .carouselBelt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}
.stepcarousel .carouselPanel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px; /*margin around each panel*/
width: 612px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
height:310px;
}
.carouselPanel img{
margin-top:-280px;
border:none;
float:left;
}


.caption h2 {
margin-bottom:5px;;
text-align:left;
}
.caption h2 a{
color:#A70000;
}
.caption a{
text-decoration:none;
color:#000;
}
.samplebuttons img{
border:none;
}
.caption{
background-color:#fff;
margin-left:385px;
display:block;
padding:10px;
height:260px;
font-size:12px;
text-align:justify;
overflow:hidden;
}


.caption-maintext {
height:128px;
}

div.blogcarouselavatar img {
padding: 0;
margin: 0 0 0 20px !Important;
}


.samplebuttons{
background-color:transparent;
margin-top:-30px;
padding-left:5px;
position:relative;
height:30px;
z-index:100;
}
.buttonbar{
background-color:#dfdfdf;
margin-top:280px;
padding:5px;
position:relative;
z-index:90;
height:25px;
}
.hiddenPic {
display:none;
}