/* You can alter this CSS in order to give SmoothDivScroll your own look'n'feel */

#slider,
#productClients {
	position: relative; 		
	}

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
	background-image:url(/resources_globusmedia/images/spacer.gif);
	background-position:0 0;
	background-repeat:repeat;
	/*cursor:url(/images/cursors/cursor_arrow_left.cur), w-resize;*/
	height:35px;
	left:7px;
	position:absolute;
	top:89px;
	width:35px;
	z-index:200;

}
div.scrollingHotSpotLeft:hover {background-position:0 32px;}

/* Visible */

div.scrollingHotSpotLeftVisible{background-image:url(/resources_globusmedia/images/slider_arrows.gif);}

#productClients div.scrollingHotSpotLeft
{
	background-image:url(/resources_globusmedia/images/slider_arrows_sm.gif);
	background-position:0 0;
	background-repeat:repeat;
	/*cursor:url(/images/cursors/cursor_arrow_left.cur), w-resize;*/
	height:29px;
	left:4px;
	position:absolute;
	top:55px;
	width:25px;
	z-index:200;
}
#productClients div.scrollingHotSpotLeft:hover {background-position:0 26px;}

/* Visible left hotspot */

div.scrollingHotSpotLeftVisible
{
		zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	background-image:url(/resources_globusmedia/images/spacer.gif);
	background-position:100% 0;
	background-repeat:repeat;
	/*cursor:url(/images/cursors/cursor_arrow_right.cur), e-resize;*/
	height:32px;
	position:absolute;
	right:7px;
	top:89px;
	width:32px;
	z-index:200;
}
div.scrollingHotSpotRight:hover {background-position: 100% 32px;}

#productClients div.scrollingHotSpotRight
{
	background-image:url(/resources_globusmedia/images/slider_arrows_sm.gif);
	background-position:100% 0;
	background-repeat:repeat;
	/*cursor:url(/images/cursors/cursor_arrow_right.cur), e-resize;*/
	height:29px;
	position:absolute;
	right:4px;
	top:55px;
	width:26px;
	z-index:200;
}
#productClients div.scrollingHotSpotRight:hover {background-position:100% 26px;}


/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{	
background-image:url(/resources_globusmedia/images/slider_arrows.gif);
zoom: 1;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper{	
	height:135px;
	margin:0 0 0 46px;
	overflow:hidden;
	padding-top:0;
	position:absolute;
	top:35px;
	width:865px;
	}

.emailworkz div.scrollWrapper,
.contentworkz div.scrollWrapper,
.brandworkz div.scrollWrapper{	
	margin:0 0 0 34px;
	top: 0;
	width:			646px;
}


.scrollableArea{
	height:135px;
	list-style-type:none;
	margin-top:0;
	position:relative;
	
}

.emailworkz .scrollableArea,
.contentworkz .scrollableArea,
.brandworkz .scrollableArea
{
	list-style-type: none;
	position: relative;
	width: 600px;
	height: 126px;
}

.scrollableArea li {
	height: 126px;}