* {
  margin: 0;
  padding: 0;
}


.related_stepcarousel{
background-color: #fafafa;
position: relative; /*leave this value alone*/
border: 0px solid  #66a3c8;
overflow: scroll; /*leave this value alone*/
width: 620px; /*Width of Carousel Viewer itself*/
height: 270px; /*Height should enough to fit largest content's height*/
}

.related_stepcarousel .related_belt{
background-color: #fafafa;
position: absolute; /*leave this value alone*/
left: 0;
top: 00;
}

.related_stepcarousel .related_panel{
background-color: #fafafa;
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding related_panel DIV*/
margin: -10px 00px 10px 0px; /*margin around each related_panel*/
width: 620px; /*Width of each related_panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.related_panel ul {
width: 620px; list-style-type: none; background-color: #fafafa; margin-left: 10px;
padding-left: 0px;
height: 210px;
}



.related_panelItemTop {
    background-color: #fafafa;
  	font: 13px Trebuchet MS, aria;
	font-weight: bold;
	color:#FF0000;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
}

a.related_panelItemTop {
    background-color: #fafafa;
  	font: 12px Trebuchet MS, aria;
	font-weight: bold;
	color:#0c73b4;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
margin-left: -15px;
}

a.related_panelItemTop:hover {
    background-color: #fafafa;
  	font: 12px Trebuchet MS, aria;
	font-weight: bold;
	color:#fe9317;
	text-decoration: none;
	display: block;
	margin-bottom: 3px;
}

div.related_panelItem  {
width: 133px;
font: 12px Trebuchet MS, aria;
font-weight: bold;
color:#000000;
text-decoration: none;
text-align: center;
display: block;
height: 243px;
}

.related_panelItem a {
 background: #fafafa url(../images/panelItem_BG_both.jpg) no-repeat;
width: 133px;
margin: 0px 0px 5px 0px;
font: 12px Trebuchet MS, aria;
font-weight: bold;
color:#000000;
text-decoration: none;
text-align: center;
display: block;
}

.related_panelItem a:hover {
 background: #fafafa url(../images/panelItem_BG_both.jpg) no-repeat;
 background-position: 0 -258px;
width: 133px;
margin: 0px 0px 5px 0px;
font: 12px Trebuchet MS, aria;
font-weight: bold;
color:#fa8f13;
text-decoration: none;
text-align: center;
display: block;
}

.related_panelItem img {
margin: 0px 0px 5px 0px;
}

.related_panel li {
 float: left;
 width:150px;
 text-align: center;
}


/*---------------------------------------- NAV BUTTONS ------------------ */

a.prevButton {
background: url(../images/arrowPrev.gif) no-repeat;
width: 36px;
height: 135px;
text-indent: -9999px;
display: block;
outline: 0;

}

a.prevButton:hover {
background: url(../images/arrowPrev.gif) no-repeat;
background-position: 0 -135px;
width: 36px;
height: 135px;
text-indent: -9999px;
display: block;
outline: 0;

}

a.nextButton {
background: url(../images/arrowNext.gif) no-repeat;
width: 36px;
height: 135px;
text-indent: -9999px;
display: block;
outline: 0;

}

a.nextButton:hover {
background: url(../images/arrowNext.gif) no-repeat;
background-position: 0 -135px;
width: 36px;
height: 135px;
text-indent: -9999px;
display: block;
outline: 0;

}