/* ---
	Site: Carousel styles
	Author: Helen Sherwood-Taylor
	Version: 2011.03.16
---*/

/**
 * Generic carousel styles
 */
.carousel-absent {margin-left:25px;}
.carousel-absent a span.play {display:block;}

/*-- Carousel dot navigation  --*/
ul.pageNav li.dot {display:inline-block;float:left;padding:0;height:8px;overflow:hidden;width:8px;background: #fff;background-image:none;margin:0 2px 0 0;}
ul.pageNav li.dot .dotLabel {height:8px;width:8px;text-indent:-5000px;cursor:pointer;}
ul.pageNav li.dotActive {background:#9cc}
ul.pageNav li.dot:hover {background:#999}

/* Next / previous bars */
a.pageNav {
	position:absolute;
	background-repeat:no-repeat;
	display:block;
	outline:none;
	z-index:20;
}

a.carPrev {left: 0;}
a.carNext {right: 0;}

a.pageNav span {display:none;}


/**** 
 * Clips carousel 
 ****/

/* Outer container */

#clips {
	margin: 0;
	overflow: hidden;
	zoom: 1;
	padding-bottom: 8px;
	color: #FFF;
	background-color: #000;
}

#clips h2 {
	font-size: 1.6em;
	font-weight: bold;
	line-height: 1em;
	padding: 0 0 2px 0;
	color: #FFF;
}

#clips .box {
	background: none;
	margin:12px 6px 0 16px;
}


/* Intro resource box (on the left) */

#clips #introResource {
	width: 146px;
	float: left;
	padding-right: 13px;
}

#introResource h2 {
	padding: 0 0 11px;
}

#introResource a {
	display: block;
	height: 140px;
	width: 144px;
}

#introResource a:hover { text-decoration: none; }
#introResource a:hover span { text-decoration: underline; }
#introResource.active a:hover span { text-decoration: none; }

#introResource span {
	display: inline-block;
	color: #FFF;
	padding: 2px 7px 2px 0;
	font-size: 1.3em;
	line-height: 1.3em;
	font-weight: bold;
}

/* Clips outer container (right hand area containing title, tabs & nav) */
#clips #clips-outer-container {
	float: left;
	width: 788px;
	position: relative;
}

	#clips #clips-outer-container h2 {
		height: 20px;
	}


/* Toggler tabs with clip count */
#clips span.clip-count{
	display:block;
	color:#fff;
	position:absolute;
	z-index:23;
	height:35px;
	left:0;
	top:-5px;
	float:left;
}

#clips span.clip-count a {
	float:left;
	display:block;
	padding: 5px 8px;
	font-size:1.6em;
	font-weight:bold;
	text-align:center;
	outline:none;
}

#clips span.clip-count a.clip-type-on {color:#9cc;}
#clips span.clip-count a.clip-type-on:hover,
#clips span.clip-count a.clip-type-on:focus { text-decoration: none; }
#clips span.clip-count a.clip-type-off {color:#fff;}
#clips span.clip-count .count {font-weight: normal; color: #999; font-size: 0.7em;}


/* Pagenav dots */
#clips-outer-container ul.pageNav li#leftarrow,
#clips-outer-container ul.pageNav li#rightarrow { display: none; }
#clips-outer-container ul.pageNav {
	position: absolute;
	top: 8px;
	right: 4px;
}

/* Next & previous bars */

#clips a.carNext,
#clips a.carPrev {width:23px;height:80px;top:27px;}

#clips a.carNext {background-position: -749px -198px;right:5px;}
#clips a.carNext:hover {background-position: -782px -198px;}
#clips a.carPrev {background-position: -623px -198px;left:5px;}
#clips a.carPrev:hover {background-position: -656px -198px;}

#clips #clips-prevCar.disabled,
#clips #clips-nextCar.disabled {cursor:default;opacity:0.5;filter:alpha(opacity=50);}
#clips #clips-prevCar.disabled {background-position: -590px -198px;}
#clips #clips-nextCar.disabled {background-position: -716px -198px;}

#clips div.carNextFurniture,
#clips div.carPrevFurniture {position:absolute;width:24px;height:116px;z-index:100;bottom:0; background-color: #000;}
#clips div.carNextFurniture {right:4px;}
#clips div.carPrevFurniture {left:5px;}


/* Outer container around both carousels */
#clips #carousel-container {
	padding: 5px;
	width: 778px;
	float: left;
}


/* Inside the carousel */
#clips .carousel-light .carousel-window {
	background:none;
	width:755px !important;	/* override inline style set in js */
	padding-left:25px;
}

#clips div.clips-container {
	overflow:hidden;
	zoom:1;
	list-style:none;
	float: left;
}


/* Individual clip items */
#clips div.clip-promo {
    width:144px;
	height:196px;
    float:left;
    position:relative;
	margin:0 2px 0 0;
}

#clips div.clip-promo h3 a {
	line-height:1.3em;
	font-size:1.3em;
	display:inline-block;
	background:none;
}

#clips div.clip-promo h3 a:hover {text-decoration:none;}
#clips div.clip-promo h3 a:hover span.clip-title {text-decoration:underline;}
	
#clips div.clip-promo h3 a span.clip-title {
	padding:2px 7px 2px 0;
	display:block;
	font-weight:bold;
	font-size:1em;
}

.carousel-content div.carVisible a span.play {display:block;}

#clips div.clip-promo a:hover span.play, 
#clips div.clip-promo a:focus span.play {background-position: -632px -20px;}

/* selected clip item */
#clips div.clip-promo-selected h3 a {cursor:default;}
#clips div.clip-promo-selected h3 a img,
#clips div.clip-promo-selected h3 a span.play {opacity:0.65;filter:alpha(opacity=65);}
#clips div.clip-promo-selected h3 a:hover span.play,
#clips div.clip-promo-selected h3 a:focus span.play {background-position:-590px -20px;}
#clips div.clip-promo-selected h3 a:hover span.clip-title {color:#fff;text-decoration:none;}

#clips #audio-carousel div.clip-promo a span.play {background-position: -590px -72px;}
#clips #audio-carousel div.clip-promo a:focus span.play,
#clips #audio-carousel div.clip-promo a:hover span.play {background-position: -632px -72px;}

#clips div.clip-promo-selected a img,
#introResource.active a img { opacity:0.60; filter:alpha(opacity=60); cursor:default; }

#clips div.clip-promo p { padding-right: 4px; }
		


/*** COLLECTIONS CAROUSELS (cols a and b) ***/

/* containers */
#collections.box .box-heading {position:relative;}
#collections.box .box-content {padding:0;position:relative;overflow:hidden;}
.col-a #collections.box .box-content {background-color: #38302d; color: #ffffff; }
.col-a #collections.box .carousel-window {background:transparent;} 

#collections.box ul#coll-carousel {width:258px;overflow:hidden;}
.col-a #collections.box ul#coll-carousel {left:48px;}
.col-b #collections.box ul#coll-carousel {left:24px;}


/* items */
#collections.box ul#coll-carousel li {
	position:relative;
	float:left;
	display:inline-block;
	z-index:0;
}
.col-a #collections.box ul#coll-carousel li { width:206px; height:312px; margin: 0 2px 0 0; }
.col-b #collections.box ul#coll-carousel li { width:136px; height:215px; margin: 0 1px 0 0; }
			
	#collections.box ul#coll-carousel li img {
		z-index:0;
		position:absolute;
	}
	.col-a #collections.box ul#coll-carousel li img { border-bottom: 1px solid #2d2521; }

	.col-b #collections.box ul#coll-carousel li a { display: block; height: 170px; }


	#collections.box ul#coll-carousel.only1Item li {
		overflow:hidden;
		margin-right:14px;
	}

	.col-a #collections.box ul#coll-carousel.only1Item li { width:206px; }
	.col-b #collections.box ul#coll-carousel.only1Item li { width:136px; }

	#collections.box ul#coll-carousel.only1Item li.last { margin-right:0px; }


/* carousel descriptions */

#collections.box .coll-carDesc {
	display: block;
	font-size:1.3em;
	line-height:1.1em;
	padding:8px 0;
	font-weight: bold;
}

#collections.box ul#coll-carousel.only1Item .coll-carDesc {display:block;left:0;}
.withjs .col-a #collections.box .coll-carDesc {display:none;}

#collections.box #coll-carDesc {
	position:absolute;	
	z-index:10;
	bottom:4px;
	left:50px;
	height:36px;
	width:206px;
	padding: 8px 0;
	display:none;
}

/* "all collections" box */
#collections.box #allCollections {
	height: 25px;
	font-size: 1.3em;
	line-height: 1.3em;
	padding: 13px 0 0 15px;
	font-weight: bold;
}

.col-a #collections.box #allCollections { border-top: 1px solid #2d2521; background: #38302d; }
.col-b #collections.box #allCollections { border-top: 1px solid #ffffff; }


/* pagenav */
#collections.box ul.pageNav {position:absolute;top:16px;right:0;}
.col-b #collections.box ul.pageNav{right:16px;}

.col-b .pageNav li.dot {background: #666;}
.col-b .pageNav li.dotActive {background:#066;}
.col-b .pageNav li.dot:hover {background:#999;}

#collections.box ul.pageNav #leftarrow,
#collections.box ul.pageNav #rightarrow {display:none;}

/* carousel nav */
#collections.box .carousel-nav {display:none;}

/* next and prev buttons */
.col-a #collections a.carNext,
.col-a #collections a.carPrev {width:48px;height:258px;top:0;}
.col-a #collections a.carPrev {background-position:-300px -20px;}
.col-a #collections a.carNext {background-position:-446px -20px;}
.col-a #collections a.carPrev:hover {background-position:-358px -20px;}
.col-a #collections a.carNext:hover {background-position:-504px -20px;}

.col-b #collections a.carNext,
.col-b #collections a.carPrev {height:170px;top:0;}
.col-b #collections a.carPrev {width:23px;background-position:-831px -20px;}
.col-b #collections a.carNext {width:22px;background-position:-926px -20px;}
.col-b #collections a.carPrev:hover {background-position:-863px -20px;}
.col-b #collections a.carNext:hover {background-position:-958px -20px;}

/* next and prev furniture elements */
.col-b #collections .carPrevFurniture,
.col-b #collections .carNextFurniture {position:absolute;height:45px;width:23px;z-index:5;bottom:0;background: #f0f0f0;}
.col-b #collections .carPrevFurniture {left:0;}
.col-b #collections .carNextFurniture {right:0;}
