#content
{
	background-color: #fff;
}

#products #content {
	padding-top: 20px;
}
#touts
{
/*	background: black;*/
	height: 426px;
	margin: 20px 0 10px 0;
}

ul#touts>li
{
	float: left;
	margin-left: 20px;
	background-repeat: no-repeat;
	width: 280px;
	height: 406px;
	padding: 10px;
	position: relative;
}

ul#touts>li:first-child
{
	margin-left: 0px;
}

ul#touts .tout-banner
{
	width: 250px;
	height: 130px;
	background-color: #ff0010;
	background-repeat: no-repeat;
	background-position: 11px 0;
	padding: 0 0px 0px 30px;
}

ul#touts > li#pro-tout .tout-banner:hover,
ul#touts > li#life-tout .tout-banner:hover,
ul#touts > li#value-tout .tout-banner:hover {	background-image: none; }

ul#touts h2
{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-top: 14px;
}
ul#touts h2 a {
	color: #fff;
}
ul#touts li a.arrow
{
	display: block;
	position: absolute;
	background: transparent url(../images/silver-arrow.png) no-repeat;
	padding-top: 20px;
	height: 0px;
	width: 21px;
	right: 20px;
	top: 125px;
	overflow: hidden;
}

ul#touts li ul li
{
	font-size: 18px;
	font-weight: normal;
	line-height: 1.3em;
}

ul#touts li ul li a:link,
ul#touts li ul li a:visited
{
	color: white;
}

ul#touts blockquote
{
	font-size: 14px;
	font-style: italic;
/*	background: transparent url(../images/products/red-quote.png) no-repeat top left;*/
	padding: 10px 0px 0px 33px;
	margin-top: 15px;
	width: 230px;
}
ul#touts blockquote p img {
	margin-top: 3px;
	vertical-align: middle;
}


/* ===========================================================
// - TOUT SPECIFICS
// =========================================================== */
	/*professional grade*/
ul#touts #pro-tout .tout-banner
{
	height: 209px;
/*	background-image: url(../images/products/tout-banner-red.png); */
}
ul#touts li#pro-tout a.arrow { 
	top: 185px;
}
ul#touts #pro-tout blockquote
{
/*	background-image: url(../images/products/red-quote.png);*/
}

#pro-tout .tout-banner ul li {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 117px;
	height: 31px;	
	margin-bottom: 6px;
}
#pro-tout .tout-banner ul li a {
	display: block;
	width: 117px;
	height: 31px;
}
#pro-tout .tout-banner ul li#tout-thinkpad a {
	background: transparent url(../images/touts_professional_thinkpad.png) 0 0 no-repeat;
}
#pro-tout .tout-banner ul li#tout-thinkcentre a {
	background: transparent url(../images/touts_professional_thinkcentre.png) 0 0 no-repeat;
}
#pro-tout .tout-banner ul li#tout-thinkstation a {
	background: transparent url(../images/touts_professional_thinkstation.png) 0 0 no-repeat;
}
#pro-tout .tout-banner ul li#tout-thinkserver a {
	background: transparent url(../images/touts_professional_thinkserver.png) 0 0 no-repeat;
}

	/*lifestyle*/
ul#touts #life-tout .tout-banner
{
	height: 209px;
	background-position: 12px 0;
	background-color: #00c6ff;
/*	background-image: url(../images/products/tout-banner-blue.png); */
/*	background-image: url(../images/products/tout-banner-blue_less_dark.png);*/
}
ul#touts li#life-tout a.arrow { 
	top: 185px; 
}
#life-tout .tout-banner ul li {
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	width: 149px;
	height: 29px;
}
#life-tout .tout-banner h2 {
	margin-bottom: 6px;
}
#life-tout .tout-banner ul li a {
	display: block;
	width: 149px;
	height: 29px;
}
#life-tout .tout-banner ul li#tout-ideapad a {
	background: transparent url(../images/touts_lifestyle_ideapad.png) 0 0 no-repeat;
}
#life-tout .tout-banner ul li#tout-ideacentre a {
	background: transparent url(../images/touts_lifestyle_ideacentre.png) 0 0 no-repeat;	
}
ul#touts #life-tout blockquote
{
	color: black;
/*	background-image: url(../images/products/blue-quote.png);*/
}

	/*essential/value*/
ul#touts #value-tout .tout-banner
{
	height: 209px;
	background-color: #ffa200;
/*	background-image: url(../images/products/tout-banner-orange.png); */
}

ul#touts li#value-tout a.arrow { top: 185px; }

ul#touts #value-tout blockquote
{
/*	background-image: url(../images/products/orange-quote.png);*/
}


/* ===========================================================
// - PRODUCT AREAS
// =========================================================== */
.product-area
{
	position: relative;
 	width: 940px;
 	margin-bottom: 30px;
	height: 350px;
}


.product-area div#carousel
{
	height: 350px;
	overflow: hidden;
}

.product-area div#carousel div
{
	float: left;	
}

.product-area div#carousel div#navLeft, div#navRight
{
	width: 20px;
	height: 266px;
	background: black url(../images/products/carousel-controls.png) no-repeat;
	cursor: pointer;
}

.product-area div#carousel div#navLeft.hover
{
	background-position: bottom left;
}

.product-area div#carousel div#navRight
{
	background-position: top right;
	right: 0px;
}

.product-area div#carousel div#navRight.hover
{
	background-position: bottom right;
}

.product-area #scrollable
{
	overflow: hidden;
	width: 850px;
	height: 350px;
}

.product-area #scrollable ul
{
	list-style-type: none;
	width: 20000em;
}

.product-area #scrollable li { display:inline;}



/*.product-area .left,
.product-area .right
{
	background: black url(../images/products/carousel-controls.png) no-repeat;
	width: 20px;
	padding-top: 266px;
	height: 0px;
	display: block;
	overflow: hidden;
	position: absolute;
	top: 42px;
}
*/

/*.product-area .right
{
	background-position: top right;
	right: 0px;
}



.product-area .left:hover
{
	background-position: bottom left;	
	border: none;
}

.product-area .right:hover
{
	background-position: bottom right;	
	border: none;
}
*/

body div.product-area a.left:active,
body div.product-area a.right:active,
body div.product-area a.left:visited,
body div.product-area a.right:visited
{
	border: none;	
	color: transparent;
}

.product-area h2
{
	font-size: 18px;
	padding-left: 20px;
	margin-bottom: 20px;
	font-weight: bold;
}

/*.product-area h2,
.product-area h3,
*/
.product-area li p
{
	text-transform: uppercase;
}

/*.product-area .scrollable ul
{
	width:20000em;
	position:absolute;
	clear:both;
}*/

.product-area ul li
{
	width: 235px;
	height:300px;
	float: left;
}

.product-area h3
{
	font-size: 16px;
	text-align: center;
	margin: 15px 0px 0px 0px;

}

.product-area li p
{
	color: #717171;
	font-size: 12px;
	text-align: center;
	margin-top: 5px;
}

.product-area h3 a:hover
{
	text-decoration: underline;
}

.product-area blockquote
{
	width: 323px;
	position: relative;
	font-style: italic;

	color: #404040;
	float: left;
	margin: 30px 0px 0px 50px;
	padding: 25px 0px 0px 0px;
	background: transparent url(../images/quote-frame-life.png) no-repeat 0px 22px;


}

.product-area blockquote p
{
	font-size: 14px;
	padding: 0px 50px 20px 50px;
	margin-top: 25px;
	background: transparent url(../images/quote-frame-life.png) no-repeat -323px bottom;
}

.product-area blockquote cite
{
	position: absolute;
	top: 0px;
	left: 0px;
	background-repeat: no-repeat;
	width: 130px;
	padding-top: 55px;
	overflow: hidden;
	text-indent: -9999px;
	height: 0px;
}


/* ===========================================================
// - PRODUCT AREA SPECIFICS
// =========================================================== */
#professional.product-area h2,
#professional.product-area li h3 a:link,
#professional.product-area li h3 a:visited,
#professional.product-area li h3 a:hover,
#professional.product-area li h3 a:active { color: #ff0010; }

#lifestyle.product-area h2,
#lifestyle.product-area li h3 a:link,
#lifestyle.product-area li h3 a:visited,
#lifestyle.product-area li h3 a:hover,
#lifestyle.product-area li h3 a:active { color: #00c6ff; }

#value.product-area h2,
#value.product-area li h3 a:link,
#value.product-area li h3 a:visited,
#value.product-area li h3 a:hover,
#value.product-area li h3 a:active { color: #fea200; }

body div.product-area a:active,
body div.product-area a:active,
body div.product-area a:visited,
body div.product-area a:visited
{
	color: transparent;
}

#value.product-area blockquote,
#value.product-area blockquote p
{
	background-image: url(../images/quote-frame-ess.png);
}

#accessories.product-area h2,
#accessories.product-area a:link,
#accessories.product-area a:visited,
#accessories.product-area a:hover,
#accessories.product-area a:active { color: #80d100; }


/*product area mouseovers - thick borders */
.product-area ul li a:hover img {
	/* borders subtract 20px from height/width*/
	margin: 0 auto;
	width: 215px;
	height: 246px;
}
#professional.product-area ul li a:hover img {
	border: 10px solid #ff0010;
}
#lifestyle.product-area ul li a:hover img {
	border: 10px solid #00c6ff;
}
#value.product-area ul li a:hover img {
	border: 10px solid #ffa200;
}
#accessories.product-area ul li a:hover img {
	border: 10px solid #80d100;
}

/* color-coded product title arrows*/
.product-area h3 a {
	padding-right: 30px;
	padding-bottom: 5px;
	padding-top: 2px;
}
#professional.product-area h3 a {
	background: transparent url(../images/products/product_arrow_red.gif) top right no-repeat;
}
#lifestyle.product-area h3 a {
	background: transparent url(../images/products/product_arrow_blue.gif) top right no-repeat;
}
#value.product-area h3 a {
	background: transparent url(../images/products/product_arrow_orange.gif) top right no-repeat;
}
#accessories.product-area h3 a {
	background: transparent url(../images/products/product_arrow_green.gif) top right no-repeat;
}


/* RESOURCES */
#shopping-resources
{
		font-size: 12px;
		width: 940px;
		margin: 40px auto 40px auto;		
}

#shopping-resources h2
{
	text-transform: uppercase;
	color: black;
	margin-bottom: 5px;
}

#shopping-resources li
{
	display: inline;
}

#shopping-resources li:before
{
	color: red;
	content: "| ";
}

#shopping-resources li:first-child:before
{
	content: '';
}

#shopping-resources a:link,
#shopping-resources a:visited
{
	color: red;
}

#shopping-resources a:hover
{
	text-decoration: underline;
}



blockquote.skinny
{
	width: 235px;
	position: relative;
	font-style: italic;

	color: #404040;
	float: left;
	margin: 30px 0px 0px 50px;
	padding: 25px 0px 0px 0px;
	background: transparent url(../images/quote-frame-pro-skinny.png) no-repeat 0px 22px;
}

blockquote.skinny-life
{
	width: 235px;
	position: relative;
	font-style: italic;

	color: #404040;
	float: left;
	margin: 30px 0px 0px 50px;
	padding: 25px 0px 0px 0px;
	background: transparent url(../images/quote-frame-life-skinny-light.png) no-repeat 0px 22px;
}

blockquote.skinny p
{
	font-size: 14px;
	padding: 0px 50px 20px 50px;
	margin-top: 25px;
	background: transparent url(../images/quote-frame-pro-skinny.png) no-repeat -233px bottom;
}

blockquote.skinny-life p
{
	font-size: 14px;
	padding: 0px 50px 20px 50px;
	margin-top: 25px;
	background: transparent url(../images/quote-frame-life-skinny-light.png) no-repeat -233px bottom;
}

blockquote.skinny cite
{
	position: absolute;
	top: 0px;
	left: 0px;
	background-repeat: no-repeat;
	width: 130px;
	padding-top: 55px;
	overflow: hidden;
	height: 0px;
}




blockquote.skinny.life { background-image: url(../images/quote-frame-life-skinny.png); }
blockquote.skinny.life p { background-images: url(../images/quote-frame-life-skinny.png); }

blockquote.skinny.ess { background-image: url(../images/quote-frame-ess-skinny.png); }
blockquote.skinny.ess p { background-images: url(../images/quote-frame-ess-skinny.png); }

