/* coverflow */
div.coverflow-wrapper {
   height: 190px;
   width: 400px; 
   padding: 20px 10px 10px 10px;
   overflow: hidden;
   position: relative;
   margin:0 auto;
   
}
#coverflow {
   width: 420px;
   height: 400px;
   padding: 0px;
   position: absolute;
   top: 32px;
   left: 0px;
   margin-bottom:18px;
}
#coverflow a { 
   display:block;
   width: 112px;
   height: 150px;
   position: absolute;
   
}
#coverflow a:hover {
	/*margin-top:-3px;*/
	/*opacity:1 !important;*/
}

#coverflow a > img, #coverflow a > span > img {
	width: 112px;
	height: 150px;
	margin-left:-2px;
	margin-top:-2px;
	border:2px #fff solid;
	box-shadow:0 0 8px rgba(0,0,0,0.3);
	display:block;
	width: 100%;
	height: 100%;
	/*-ms-interpolation-mode: bicubic;*/
	/*-moz-scaling-method: fast;*/
	image-rendering: optimizeQuality;
	/*-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(70%, transparent), to(rgba(255,255,255,0.25)));*/
}

#coverflow.reflect a > img {
	position: relative;
}
#coverflow.reflect a .after {
	 z-index: -1;
	 position:relative;
	 margin-top:-1px;
	 background-color:#fff;
}
#coverflow.reflect a .after img {
   -moz-transform: translateY(0px) scaleY(-1) !important;
   -webkit-transform: translateY(0px) scaleY(-1) !important;
   -o-transform: translateY(0px) scaleY(-1) !important;
   transform: translateY(0px) scaleY(-1) !important;
   mask: url("images/mask.svg#mask");
   /*-webkit-mask-box-image: url(images/mask.png) 75 stretch;*/
   -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(85%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1)) );
   width: 112px;
   height: 150px;
   margin-left:-2px;
   border:2px #fff solid;
   box-shadow:0 0 8px rgba(0,0,0,0.3);
   display:block;
   opacity: 0.3;
   filter: alpha (opacity=25);
}

#coverflow img.no-shadow {
	box-shadow:none !important;
	border:2px #f0f0f0 solid;
	/*outline:1px #eee solid;*/
}

div.coverflow-holder {
	
	float:left;
	width:498px;
	border:#333 1px solid;
}
#imageCaption {
	color:#fff;
	background:#333;
	display: block;
	font-size: 12px;
	padding:12px;
	height:60px;
	padding-right:55px;
	overflow:hidden;
	position:relative;
}
#imageCaption h2 { text-transform:uppercase; margin: -8px 0 0 0; }
#imageCaption  a.jumpto { position: absolute; top: 10px; right: 19px; width:24px; height:24px; text-decoration:none; }

#scroll-pane {
	float: left;
	overflow: hidden;
	width: 214px;
	height: 252px;
	position: relative;
	display: inline
}

#sortable {
	position: absolute;
	top: 0;
	left: 0
}

.scroll-content-item {
	background-color: #fcfcfc;
	color: #003366;
	width: 100px;
	height: 100px;
	float: left;
	margin: 10px;
	font-size: 3em;
	line-height: 96px;
	text-align: center;
	border: 1px solid gray;
	display: inline;
}
.listholder {
	float:left;
	padding:26px 0;
	border: 1px solid #333333;
	border-left:none;
	margin-bottom:18px;
}
#sortable {
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
	width: 100%;
}

#sortable li {
	padding:0;
	margin:0;
	padding-left: 1.5em;
	height: 50px;
	border:none;
	vertical-align:middle;
	background:url(images/coverflow-list-item.png) no-repeat;
	overflow:hidden;
	cursor:pointer;
}
#sortable li table { width:100%; border:0; margin:0; padding:0; }
#sortable li table td { height:50px; padding:0; vertical-align:middle; text-align:left; font-size:12px; }
#sortable li.selected {
	background:url(images/coverflow-list-item-active.png) no-repeat;
}
#sortable li.selected table td { font-weight:bold; }

.coverflow-holder .navigation .prev {display:block; float:left; margin:76px 0 0 10px; width:8px; height:70px; background:url(images/navigation-larr.png) 0px center no-repeat;}
.coverflow-holder .navigation .next {display:block; float:right; margin:76px 10px 0 0; width:8px; height:70px; background:url(images/navigation-rarr.png) 0px center no-repeat;}

.listholder .navigation { position:relative; }
.listholder .navigation .prev {display:block; position:absolute; margin:-18px 0 0 -35px; left:50%; width:70px; height:8px; background:url(images/navigation-uarr.png) 0px center no-repeat;}
.listholder .navigation .next {display:block; position:absolute; margin:260px 0 0 -35px; left:50%; width:70px; height:8px; background:url(images/navigation-darr.png) 0px center no-repeat;}
.navigation a:hover {cursor:pointer; opacity:0.5; -moz-opacity:0.5; filter: alpha(opacity=50); }

.coverflow-holder .navigation .prev.disabled,
.coverflow-holder .navigation .prev.disabled:hover,
.coverflow-holder .navigation .next.disabled,
.coverflow-holder .navigation .next.disabled:hover,
.listholder .navigation .prev.disabled,
.listholder .navigation .prev.disabled:hover,
.listholder .navigation .next.disabled,
.listholder .navigation .next.disabled:hover { cursor:default; opacity:0.1; -moz-opacity:0.1; filter: alpha(opacity=10); }

.innerContent table tr th {background:#333; color:#fff; border:#333 1px solid; border-collapse:collapse; padding:2px 4px;}
.innerContent table tr td {border:#333 1px solid; border-collapse:collapse; padding:2px 4px;}