@import "/featured/slideshow-nav.css";

#flash-feature,
#myslideshow,
#featured-slides {
	position: relative;
	width: 968px;
	height: 440px;
	border-bottom: 1px solid #ddd;
	background-color: #000000;
}
#myslideshow img {
	position: absolute; 
	z-index: 10;
}

#content { margin:0;padding:0;color:#666; }
#content img { border:0; }

#babout a {color: #333;}
#babout a:hover, #babout ul li:hover h4 a {color: #000;}

#lander { margin:16px; height:230px; }
.fours { width:217px; float:left; text-align:center; }
.fintro { float:left; text-align:left; padding: 0 9px 0 16px;}

.canvas .fintro { float:left; text-align:left; padding: 0 16px 0 16px; width: 452px;}


h4 { font:bold 20px Helvetica, Arial;letter-spacing:-1px;color:#000;margin:0;padding:0; }
h4 a:link, h4 a:visited { color:#000; text-decoration:none; display: block;}

#collections {
}

.main-grid {
	padding: 16px;
}

	#collections .main-grid .thumbs p {
		float: left;
		margin: 0 8px 8px 0;
		outline: 1px solid #ccc !important;
	}
		#collections .main-grid .thumbs p.theend {
			margin-right: 0;
		}
	#collections .main-grid .thumbs p:hover {
		outline-color: #000 !important;
	}
	
	#collections .main-grid .thumbs p a {
		color: #333;
		font-size: 20px;
		font-weight: bold;
		text-decoration: none !important;
		padding: 10px 16px;
		width: 274px !important;
		height: 196px !important;
		display: block;
		background-repeat: no-repeat;
	}
	#collections .main-grid .thumbs p.double a {
		width: 588px !important;
	}
		#collections .main-grid .thumbs p a:hover {
			color: #000 !important;
		}
		#collections .main-grid .thumbs p#campaigns {
			background-image: url(campaigns.jpg);
		}
		#collections .main-grid .thumbs p#collections {
			background-image: url(collections.jpg);
		}
		#collections .main-grid .thumbs p#power {
			background-image: url(power.jpg);
		}
		#collections .main-grid .thumbs p#bags {
			background-image: url(bags.jpg);
		}
		#collections .main-grid .thumbs p#ipad {
			background-image: url(ipad.jpg);
		}
		#collections .main-grid .thumbs p#iphone {
			background-image: url(iphone.jpg);
		}
		#collections .main-grid .thumbs p#ipod {
			background-image: url(ipod.jpg);
		}
		#collections .main-grid .thumbs p#macbook {
			background-image: url(macbook.jpg);
		}
		#collections .main-grid .thumbs p#dslr {
			background-image: url(dslr.jpg);
		}

	#collections div.item {
		padding: 16px 16px 0 16px;
		border-bottom: 1px solid #bfbfbf;
		position: relative;
	}
		#collections div.item a {
			color: #000;
		}
		#collections div.item a:hover {
			color: #0096D6;
		}
	#collections div.ender {
		border: 0;
	}
	#collections p {
		margin: 0 0 16px 0;
		padding: 0;
	}
	
/* 
----------------------------------------------------

break out by collection

----------------------------------------------------
*/

/* iPad */
#collections #travelkit {height: 330px;}
	#collections #travelkit .brescription {float: left; width: 447px;}
	#collections #travelkit .bottom-feeder { position: absolute; bottom: 0; left: 0; width: 433px;}
	#collections #travelkit .righty { position: absolute; top: 16px; right: 16px; width: 490px; text-align: center; }

#collections #grip {height: 335px;}
	#collections #grip .brescription {float: left; width: 447px;}
	#collections #grip .righty { position: absolute; top: 16px; right: 0; width: 474px; }

#collections #neopreneplus-ipad { height: 178px;}
	#collections #neopreneplus-ipad .brescription {float: left; width: 375px;}
	#collections #neopreneplus-ipad .gallery { position: absolute; bottom: 0; right: 0; width: 580px; }

#collections #convertible-jacket {height: 290px;}
	#collections #convertible-jacket .brescription { float: left; width: 450px;}
	#collections #convertible-jacket .gallery { position: absolute; top: 16px; right: 8px; width: 468px; text-align: center;}

#collections .campaign-callout {
	position: relative;
	font-size: 94%;
	width: 425px;
	height: 80px;
	overflow: hidden;
	padding: 8px;
	outline: 1px solid #ddd;
	background: #fff url(bg-callout.gif) right top no-repeat;
}
#collections .campaign-callout:hover {
	outline-color: #ccc;
	background-position: right bottom;
}
	#collections .campaign-callout img{
		float: left;
	}
	#collections .campaign-callout img {
		width: 80px;
		height: 80px;
		margin-right: 16px;
		border: 1px solid #bababa;
	}
	#collections .campaign-callout h4,
	#collections .campaign-callout p {
		width: 350px;
	}
	#collections .campaign-callout h4 {
		margin-top: 15px;
		color: #444;
	}

	#collections .campaign-callout a.more {
		position: absolute;
		top: 0;
		left: 0;
		overflow: hidden;
		display: block;
		width: 100%;
		height: 100px;
		text-indent: -9009px;
	}
	#collections .campaign-callout:hover h4 {
		color: #0096D6 !important;
	}
	#collections .campaign-callout:hover img {
		border-color: #666 !important;
	}


/* Bags */
	#collections #prod {
		height: 274px;
	}
	#collections #prod .brescription {
		float: left;
		width: 461px;
	}
	#collections #prod .gallery {
		position: absolute;
		bottom: 0;
		right: 55px;
		width: 412px;
	}

	#collections #courier {
		height: 256px;
	}

	#collections #courier .gallery {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 645px;
		text-align: right;
	}

	#collections #coated-canvas h3 {
		position: absolute;
		top: 16px;
		left: 16px;
	}

	#collections #coated-canvas .brescription {
		float: left;
		width: 280px;
		margin: 60px 0 0 16px;
	}
	#collections #coated-canvas .gallery {
		float: left;
		width: 630px;
	}

	#collections #courier .brescription,
	#collections #neoprene .brescription {
		float: left;
		width: 305px;
		margin-right: 16px;
	}

	#collections #neopreneplus {
		height: 200px;
	}

	#collections #neopreneplus .brescription {
		float: left;
		width: 375px;
		margin-right: 16px;
	}
	#collections #neopreneplus .gallery {
		position: absolute;
		bottom: 0;
		right: 16px;
		width: 564px;
	}



	#collections #neoprene .gallery {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 615px;
	}
	#collections #courier a.thumb,
	#collections #neoprene a.thumb {
		margin-right: 8px;
	}
	
	#collections #courier a.ender,
	#collections #neoprene a.ender {
		margin: 0;
	}

	#collections #nylon {
		height: 300px;
	}
	#collections #messenger-bag {
		height: 295px;
	}

		#collections #nylon .brescription,
		#collections #messenger-bag .brescription {
			width: 470px;
			float: left;
		}
		#collections #nylon .aside {
			width: 320px;
			position: absolute;
			left: 520px;
			top: 47px;
		}

		#collections #nylon .gallery {
			position: absolute;
			right: 16px;
			bottom: 0;
			width: 937px;
		}
		#collections #messenger-bag .gallery {
			position: absolute;
			right: 0;
			bottom: 0;
			width: 960px;
		}

	#collections #nylon a.thumb,
	#collections #hardshell-case a.thumb {
		display: block;
		float: left;
		outline: 1px solid #ccc;
		width: 122px !important;
		margin: 0 8px 8px 0;
	}
		#collections #nylon a.thumb:hover,
		#collections #hardshell-case a.thumb:hover {
			outline-color: #000;
		}

	#collections #hardshell-case .gallery {
		position: absolute;
		top: 20px;
		right: 0;
		width: 535px;
	}


	#collections #nylon a.thumb img {
		padding: 0;
		margin: 0;
	}

	/* iPhone */

	#collections #monochrome .brescription {
		width: 280px; /* 420BRO!!! */
	}
	#collections #monochrome {
		height: 248px;
	}
	#collections #monochrome .gallery {
		position: absolute;
		bottom: 0;
		right: 0px;
		width: 645px;
		height: 215px;
	}

	#collections #slider .brescription {
		width: 280px; /* 420BRO!!! */
	}
	#collections #slider {
		height: 248px;
	}
	#collections #slider .gallery {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 645px;
		height: 214px;
	}


	#collections #snap .brescription {
		width: 300px; /* 420BRO!!! */
	}
	#collections #snap {
		height: 220px;
	}
		#collections #snap .gallery {
			position: absolute;
			bottom: 0;
			right: 16px;
			width: 627px;
			height: 213px;
		}
	
	
	#collections #topoflex {
		padding: 0;
	}
	#collections #topoflex .brescription {
		float: left;
		width: 450px;
		padding: 16px;
	}
	#collections #topoflex .gallery {
		float: left;
		width: 481px;
		margin: 16px 0 0 5px;
	}
	#collections #crystal .brescription {
		width: 420px; /* 420BRO!!! */
	}
	#collections #crystal .gallery {
		float: left;
		width: 937px;
		height: 174px;
	}


	
	#collections #perforated {
		padding: 16px 0 0 16px;
	}
	#collections #perforated .brescription {
		float: left;
		width: 310px;
	}
	#collections #perforated .gallery {
		float: left;
		margin-left: 24px;
		width: 615px;
	}

	#collections #chrome {
		padding-top: 28px;
	}

	#collections #chrome .righty {
		position: absolute;
		bottom: 0;
		right: 20px;
	}
	#collections #chrome p {
		width: 420px;
	}

	#collections #fluro {
		padding-bottom: 16px;
	}

	#collections #fluro .brescription {
		position: absolute;
		top: 0;
		right: 34px;
		padding: 0 0 0 30px;
		width: 445px;
	}
		#collections #fluro .brescription img {
			margin-bottom: 10px;
		}
	#collections #fluro .gallery {
		float: left;
		width: 433px;
		margin-top: 10px;
	}
	#collections #fluro .righty {
		position: absolute;
		top: 0;
		right: 155px;
	}

/* iPod */
	#collections #sports-armband {
		height: 222px;
	}
	#collections #sports-armband .righty {
		position: absolute;
		top: 0;
		right: 0;
	}
	#collections #sports-armband p {
		width: 320px;
	}

	#collections #ipod-perforated .gallery,
	#collections #ipod-perforated .brescription {
		float: left;
	}
	#collections #ipod-perforated .brescription {
		width: 425px;
	}
	#collections #ipod-perforated .gallery {
		margin-left: 80px;
		width: 400px;
	}

	#collections #gaming-covers {
		height: 200px;
	}
	#collections #gaming-covers .brescription {
		float: left;
		width: 460px;
	}
	#collections #gaming-covers .gallery {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 473px;
	}

/* MacBook */

	#collections #hardshell-case {
		padding-bottom: 16px;
		height: 233px;
	}
	
	#collections #hardshell-case .brescription {
		float: left;
		width: 400px;
	}
	#collections #hardshell-case .righty {
		position: absolute;
		top: 0;
		right: 0;
	}

	#collections #neoprene {
		height: 210px;
	}
		#collections #neoprene .brescription {
			float: left;
			width: 298px;
		}
		#collections #neoprene .gallery {
			position: absolute;
			bottom: 0;
			right: 0;
			width: 646px;
		}

	#collections #nylon-sleeve {
		height: 268px !important;
	}
	#collections #nylon-sleeve h3 {
		position: absolute;
		z-index: 30000;
	}
	#collections #nylon-sleeve .gallery {
		position: absolute;
		z-index: 1;
		right: 10px;
		top: 16px;
		width: 705px;
	}
	#collections #nylon-sleeve .brescription {
		position: absolute;
		z-index: 30000;
		width: 270px;
		top: 48px;
	}
	
/* DSLR */
	#collections #sling-pack {
		height: 248px;
	}
	#collections #carrying-case {
		height: 264px;
	}
	#collections #sling-pack .brescription,
	#collections #carrying-case .brescription {
		width: 400px;
	}
	#collections #sling-pack .righty,
	#collections #carrying-case .righty {
		position: absolute;
		bottom: 0;
		right: 0;
	}
	
/* 
----------------------------------------------------
END!
break out by collection
END!
----------------------------------------------------
*/

.texters { width:450px; float:left; }
.texters p {margin-top: 0; padding: 0;}
strong { color:#fff; }

#bideo { float:right; border:1px solid #bfbfbf; margin:0; }
#bideo:hover { border:1px solid #000; }

#collections h3, #babout h3 { font:bold 30px Helvetica, Arial;letter-spacing:-1px;margin:0;padding: 0;}
#collections h3,
#collections h3 a,
#babout h3,
#babout h3 a{
	color:#000;
}
/*#collections h3 { display:block; width:100%;}*/
#collections h3 {}
#collections h3 a { float: left; padding: 0; margin-bottom: 4px;}
#collections ul h3 a {float: none;}
/*
#babout > h3:first-child {
	border-top: 0;
}


#content p { margin:8px 0 16px 0;}
*/

#breader {
	position: relative;
	width: 968px;
	height: 440px;
	overflow: hidden;
}
#breader ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

	#breader h2 {
		position: absolute;
		bottom: 9px;
		right: 16px;
		font-size: 14px;
		height: 14px;
		line-height: 14px;
		font-weight: bold;
		color: #fff;
/*		text-transform: uppercase;*/
		z-index: 20;
	}
	#breader h4 {
		font-size: 14px;
		letter-spacing: 0;
		color: #fff;
	}
#breader #brescription {
	position: absolute;
	width: 100%;
	height: 33px;
	left: 0;
	bottom: 0;
	background-color: #000;
    filter:alpha(opacity=80);
    opacity: 0.8;
    z-index: 19;
}
	#breader #brescription *,
	#breader h2 {
	    filter:alpha(opacity=99);
	    opacity: .99;
		background-color: transparent;
	}

#breader #brescription #bretext {
	position: absolute;
	color: #999;
	top: 34px;
	left: 16px;
	width: 466px;
	margin: 0 !important;
}
#breader #brescription #breclose,
#breader #brescription #breopen {
	font-size: 14px !important;
	position: absolute;
	display: block;
	height: 15px;
	line-height: 15px;
	padding-right: 14px;
	top: 9px;
	left: 16px;
	color: #fff;
	text-decoration: none;
	outline: none;
	background-repeat: no-repeat;
	background-position: right 50%;
}
#breader #brescription #breclose {
	background-image: url(/featured/btn-bg-close.gif);
}
#breader #brescription #breopen {
	background-image: url(/featured/btn-bg-open.gif);
}
	#breader #brescription #breclose:hover,
	#breader #brescription #breopen:hover {
/*		color: #ddd;*/
/*		background-position: right bottom;*/
	}
	
#babout { margin:16px; height:380px; clear:left; }
.texters { width:450px; float:left; }

#babout #brescription {
	position: relative;
	float: left;
	width: 450px !important;
	margin-right: 8px !important;
}

h5 { font:bold 18px Helvetica, Arial;letter-spacing:-1px;color:#000;margin:0 0 4px 0;padding:0; }

#babout .bumps { width:390px; float:left; }
#babout .bumps a { display:block; height:36px; width:36px; border:1px solid #000; float:left; border:1px solid #bfbfbf; margin:0 1px 1px 0; }
#babout .bumps a:hover, #broducts .bumps a:hover { border:1px solid #000; }
#babout .bigbumps a { display:block; height:69px; width:69px; border:1px solid #000; float:left; border:1px solid #bfbfbf; margin:0 4px 4px 0; }
#babout .bigbumps a:hover, #broducts .bumps a:hover { border:1px solid #000; }

.texters .bumps {
	width: 490px !important;
}

#collections small {
	font-size: 10px;
}

#collections ul {
	list-style: none;
	margin: 4px 0 16px 0;
	padding: 0;
	overflow: hidden;
	clear: left;
}

#collections ul.detail {
	float: left;
	width: 484px;
	clear: none !important;
}

	#collections ul li {
		position: relative !important;
		width: 210px;
		height: 206px;
		padding: 10px 8px;
		margin: 0 8px 8px 0;
		border: 1px solid #d8d8d8;
		display: block;
		float: left;
		text-align: center;
		overflow: hidden;
	}
	#collections ul li h3,
	#collections ul li h4 {
		letter-spacing: 0px !important;
	}
	#collections ul.detail li {
		width: 220px !important;
	}
	#collections ul li.double {
		width: 446px !important;
	}

	#collections ul li:hover {
		border-color: #434343;
	}
		#collections ul li:hover h4 a,
		#collections ul li:hover h3 a {
			color: #000 !important;
		}

	#collections ul li.ender {
		margin-right: 0;
	}
	#collections ul li h4,
	#collections ul li h3 {
		font-size: 15px;
	}
		#collections ul li h4 a,
		#collections ul li h3 a {
			color: #555 !important;
		}
/* ---- thumbnail magicals ----*/
	#collections ul li {
		background-repeat: no-repeat;
		background-position: 50% 50%;
	}
	#collections ul li a.full-item-click {
		width: 210px !important;
		height: 154px !important;
		display: block !important;
		text-decoration: none !important;
	}
	#collections ul li.double a.full-item-click {
		width: 447px !important;
	}

	
a.shmore {
	position: relative;
	margin-left: 6px !important;
}

.scolors {
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: 10px;
	left: 0;
	padding: 0;
}
	ul.detail .scolors {
		width: 220px !important;
	}
	.scolors a {
	}
		.scolors a span,
		.scolors span {
			position: absolute;
			display: block;
			color: #666;
			font-size: 11px;
			width: 100%;
			bottom: 13px;
		}
		.scolors a span {
			left: -9009px;
		}
		.scolors a:hover span,
		.scolors a.comingsoon span,
		.scolors a.comingsoon:hover span {
			left: 0;
		}
	
		.scolors a img {
			margin-right: 3px;
			outline: 1px solid #c0c0c0;
		}

	.scolors a:hover img,
	.scolors a.on img {
		outline-color: #000;
	}

#collections a.view-all {
/* 	text-indent: -9009px!important;*/
	display: block;
	color: #fff !important;
	font-size: 8px !important;
	text-align: center !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	float: left;
	height: 12px !important;
	line-height: 12px !important;
	width: 46px;
	margin: 11px 0 0 8px;
	outline: none;
	background: #adadad !important;
/*	background: transparent url(/images/bttn-view-all.gif) top no-repeat;*/
}
#collections a.view-all:hover {
	background: #000 !important;
/*	background-position: bottom;*/
}
#collections .sm-title {
	font-size:10px;
	color: #999;
}
.breakup {
	border-bottom:1px solid #bfbfbf;
}

#broducts { clear:all; margin:16px; height:260px; border-bottom:1px solid #bfbfbf; }
#broducts .bumps { float:left; width:470px; margin:8px 0 0 16px; }
#broducts .bumps a { display:block; height:72px; width:72px; border:1px solid #000; float:left; border:1px solid #bfbfbf; margin:0 4px 4px 0; }
#broducts .bumps a { height:72px; width:72px; }

.buybuybuy { background:#fff; width:180px; height:80px; float:left; }
.buybuybuy h5 { font:bold 14px Helvetica, Arial;letter-spacing:-1px;color:#000;margin:4px 0 -2px; 0;padding:0; }
.buybuybuy img { float:left; width:95px; height:70px; }
.buybuybuy small { display:block; font-size:9px;  }
.buybuybuy strong { display:block; font-size:12px; padding:4px 0 2px 0; }
.buybuybuy .button { padding:1px 5px; }
.buybuybuy .button a { font-size:8px; }

#downloadz { clear:left; border-bottom:1px solid #bfbfbf; margin:16px; height:200px; }
#curatedby { clear:all; margin:16px; height:150px; }

#curatered p { float:left; width:160px; text-align:center;  }
#curatered p a { font-weight:bold; color:#000; text-decoration:none; }

.clear {
	clear: both;
	line-height: 0%;
}
