/*---carousal styles stsrt-----*/

/*----carousal2----*/
#carousel_inner
{
	float: left; 
	width: 940px; 
	overflow: hidden; 	
	position: relative;
}

#carousel_ul
{
	position: relative;
	left: -210px; 
	list-style-type: none; 
	margin: 0px;
	padding: 0px;
	width: 9999px; 
	padding-bottom: 10px;	
}

#carousel_ul li
{
	float: left;  
	width: 200px; 	
	padding: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 12px;
	margin-right: 21px;
	color: #fff;
	background: #fff00;	
}
#carousel_ul li a
{
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	position: relative;
}

#carousel_ul li img
{
	margin-bottom: -4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/ /* styling */
	cursor: pointer;
	cursor: hand;
	border: 0px;
}
#carousel_ul li a img
{
	border: 8px solid #fff;
}
#carousel_ul li a:hover img
{
	border: 8px solid #000;
}

#carousel_ul li a span
{
	background-color:#FFFFFF;
	bottom:6px;
	color:#000000;
	height:40px;
	left:2%;
	opacity:0.7;
	padding:0 1%;
	position:absolute;
	width:94%;
	z-index:3000;
}

/*#carousel_ul2 li a span b{ filter:alpha(opacity=100); font-weight:normal;
	-moz-opacity:1;
	-khtml-opacity:1;
	opacity:1; color:#fff;}  */

#left_scroll, #right_scroll
{
	float: left;
	height: 64px;
	width: 36px;
}
#left_scroll img, #right_scroll img
{
	/*styling*/
	cursor: pointer;
	cursor: hand;	
}

/*----carousal2----*/

#carousel_inner2
{
	float: left; /* important for inline positioning */
	width: 940px; /* important (this width = width of list item(including margin) * items shown */
	overflow: hidden; /* important (hide the items outside the div) */ /* non-important styling bellow 
	/*height: 140px;*/
	position: relative;
}

#carousel_ul2
{
	position: relative;
	left: -210px; /* important (this should be negative number of list items width(including margin) */
	list-style-type: none; /* removing the default styling for unordered list items */
	margin: 0px;
	padding: 0px;
	width: 9999px; /* important */ /* non-important styling bellow */
	padding-bottom: 10px;	
}

#carousel_ul2 li
{
	float: left;  /* important for inline positioning of the list items */
	width: 200px; /* fixed width, important */ /* just styling bellow */
	/* height: 116px;*/
	padding: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 12px;
	margin-right: 21px;
	color: #fff;
	background: #fff00;	
}
#carousel_ul2 li a
{
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	position: relative;
}

#carousel_ul2 li img
{
	margin-bottom: -4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/ /* styling */
	cursor: pointer;
	cursor: hand;
	border: 0px;
}
#carousel_ul2 li a img
{
	border: 8px solid #fff;
}
#carousel_ul2 li a:hover img
{
	border: 8px solid #000;
}

#carousel_ul2 li a span
{
	background-color:#FFFFFF;
	bottom:6px;
	color:#000000;
	height:40px;
	left:2%;
	opacity:0.7;
	padding:0 1%;
	position:absolute;
	width:94%;
	z-index:3000;
}

/*#carousel_ul2 li a span b{ filter:alpha(opacity=100); font-weight:normal;
	-moz-opacity:1;
	-khtml-opacity:1;
	opacity:1; color:#fff;}  */

#left_scroll2, #right_scroll2
{
	float: left;
	height: 64px;
	width: 36px;
}
#left_scroll2 img, #right_scroll2 img
{
	/*styling*/
	cursor: pointer;
	cursor: hand;	
}

/*----carousal3----*/

#carousel_inner3
{
	float: left; /* important for inline positioning */
	width: 245px;
	height: 240px; /* important (this width = width of list item(including margin) * items shown */
	overflow: hidden; /* important (hide the items outside the div) */ /* non-important styling bellow */
	position: relative;
}

#carousel_ul3
{
	position: relative;
	left: -120px; /* important (this should be negative number of list items width(including margin) */
	list-style-type: none; /* removing the default styling for unordered list items */
	margin: 0px;
	padding: 0px;
	width: 9999px; /* important */ /* non-important styling bellow */
	padding-bottom: 10px;	
}

#carousel_ul3 li
{
	float: left; /* important for inline positioning of the list items */
	width: 110px; /* fixed width, important */ /* just styling bellow*/
	padding: 0px;
	height: 120px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 5px;
	margin-right: 5px;
	color: #fff;
}

#carousel_ul3 li a
{
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	position: relative;
}

#carousel_ul3 li img
{
	margin-bottom: 4px; /* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/ /* styling */
	cursor: pointer;
	cursor: hand;
	border: 0px;
	width: 100px;
	height: 100px;
}
#carousel_ul3 li a img
{
	border: 3px solid #000;
}
#carousel_ul3 li a:hover img
{
	border: 3px solid #BF1E2E;
}

#carousel_ul3 li a span
{
	z-index: 3000;
	position: absolute;
	left: 3px;
	bottom: 6px;
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
	background-color: #fff;
	color: #000;
	height: 40px;
	width: 134px;
	padding: 0px 2px;
}

#left_scroll3, #right_scroll3
{
	float: left;
	height: 64px;
	width: 36px;
}
#left_scroll3 img, #right_scroll3 img
{
	/*styling*/
	cursor: pointer;
	cursor: hand;
	margin-top: 50px;
}




/*-----End here-------*/