.art_slideshow_container{
	width:690px;
	position:relative;
	clear:both;
	margin-top:10px;
}

.art_slideshow{
	width: 616px; /* Defines the size of the visible part of the carousel
		Attention : if you only want to see plain items in the viewport,
		the width of the viewport should take into account of :
		- the items width
		- the right and left padding of items
		- the number of items you want to see in the viewport
	 */
	overflow:hidden; /* Hides extra elements, those outside the viewport area */
	/* Fix for IE */
	position:relative;
	margin:0 37px;
}
.art_slideshow ul{
	position: relative; /* Enables positionning of elements inside viewport */
	padding: 0; /* Resets default - User Agent - style */
	margin: 0;
}
.art_slideshow li{
	width: 600px; /* Defines the size of inner element */
	height: 480px;
	float: left; /* Places list items side by side*/
	list-style: none; /* Resets default - User Agent - style */
	
	/* Cosmetic */
	background-color: #eaeaea;
	margin: 0 1px;
	padding: 8px;
	text-align:center;
}

.art_slideshow_tn{
	width: 690px; /* Defines the size of the visible part of the carousel */
	margin:0;
}

.art_slideshow_tn li{
	width: 120px; /* Defines the size of inner element */
	height: 96px;
}

/* Cosmetic */
.art_slideshow_arrow{ 
	display: block; 
	height: 200px; 
	width: 67px; 
	background: url(../images/arrows.gif) no-repeat 0 0; 
	text-indent: -9999px; 
	position: absolute; 
	top: 150px; 
	cursor: pointer; 
}

.art_slideshow_next{ background-position: 0 0; right: -29px; }
.art_slideshow_prev{ background-position: -67px 0; left: -28px; }
.art_slideshow_next:hover{ background-position: 0 -200px;}
.art_slideshow_prev:hover{ background-position: -67px -200px; }

.art_slideshow_playstop{
}

.art_slideshow_playstop a, .art_slideshow_playstop a:hover{
	display:block;
	background:#eaeaea;
	text-transform:uppercase;
	padding:2px 0;
	margin:0 37px 5px 38px;
	text-align:center;
}

.art_slideshow_caption{
	background:#eaeaea;
	text-align:center;
	padding:0 0 5px 0;
	margin:0 37px 5px 38px;
}
