#slider {
    width: 940px;
    margin: 0 auto;
    position: relative;
}

.scroll {
    height: 120px;
    width: 940px;
    overflow: auto;
    overflow-x: hidden;
    position: relative;
    clear: left;
}

.scrollContainer div.panel {
    height: 120px;
    width: 941px;/* add 1 px to fix second div appearing after panel 4*/
	margin: 0 auto; 
}



.scrollButtons {
    position: absolute;
    top: -30px;
    cursor: pointer;
}

.scrollButtons.left {
	margin-left:900px;
}

.scrollButtons.right {
    right: 0px;
}

.hide {
    display: none;
}



/* 4 PANELS */

.catLeft1{
   position: relative;
   float: left;
   margin-right: 20px;
   width: 220px;
   height:120px;
}
.catLeft1 a:hover{
   filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
.catLeft2{
   position: relative;
   float: left;
   margin-right: 20px;
   width: 220px;
}
.catLeft2 a:hover{
   filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
.catLeft3{
   position: relative;
   float: left;
   margin-right: 20px;
   width: 220px;
}
.catLeft3 a:hover{
   filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
.catRight{
   position: relative;
   float: right;
   width: 220px;
}
.catRight a:hover{
   filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
.catBrandName{
	text-transform:uppercase;
	font-size:11px;
	height:22px;
	padding-top:7px;
}
.catNavigation{
	float:right;
	height:20px;
	width:200px;
	background-color:#00CC66;
	font-size:16px;
}
