/* 
	Logitech CSS declarations - Temporary CSS styles 
	copyright Logitech 2009 
*/


/* 8. SUBCATEGORY CONTENT ELEMENTS 
------------------------------------------------ */
/*body.subcategory {
	min-width: 1280px;
} 

body.subcategory #content {
	clear: both;
	width: 100%;
}*/

.scrollArea_loading {
	position: absolute;
	top: 300px;
	left: 442px;
	z-index: 2000;
}

/*body.subcategory .headlineContent, body.subcategory ul#subnavigation {
	width: 100%;
}*/

body.subcategory #content h2 {
	margin: 0;
}

body.subcategory #content form {
	width: auto;
	overflow: visible;
}

body.subcategory #content form p {
	margin: 0;
}

body.subcategory #content #headline {
	margin: 0 auto;
	width: 950px;
	position: relative;
	z-index: 2000;
}

body.subcategory #headlineSecondary {
	/* padding-top: 10px; */
	width: 100%; /* 513 */
	/*left:218px;*/
	position:relative;
	top:30px !important;
	z-index:2000;
}


/* 11. DRAGGABLE AREA 
------------------------------------------------ */
li.ui-draggable-active, li.ui-draggable-dragging {
	display: inline-block;
	background: none;
	z-index: 1600;
}

li.ui-draggable-dragging, li.ui-draggable-dragging * {
	cursor: move;
}

li.ui-draggable-active .wrap, li.ui-draggable-dragging .wrap {
	border: 0 solid #fff;
	-ms-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background: #fff;
}

li.ui-draggable-active .ui-shadow .wrap, li.ui-draggable-dragging .ui-shadow .wrap {
	background: none;
}

li.ui-draggable-active img {
	margin: 0;
}

ul li.ui-draggable-active .ui-shadow-el, ul li.ui-draggable-dragging .ui-shadow-el {
	display: block;
}

form li label {
	display: block;
	cursor: pointer;
	clear: both;
}
.scrollArea .scroll ul{
	width: 950px !important;
}
.scrollArea .scroll {
	margin: 35px 0 10px;
	width: 100%; /* IE6 needs this so inline-block doesn't stretch past max-width */
	overflow: none !important;
	position:relative;
}

.scrollArea .scroll ul {
	display: block;
	width: 100%;
	white-space: nowrap;
	margin: 30px 0 7px; /* top changed from 18px */
	padding: 0 0 0 30px;
}

.scrollArea .scroll > ul {
	min-height: 468px;
}

.scrollArea .scroll ul.alternate-1 {
	border: none;
	background: none;
}

.scrollArea .scroll ul ul {
	padding: 0;
}

.scrollArea .scroll li {
	margin: 0;
	padding: 0;
	white-space: nowrap;
	background: none;
}

.scrollArea .ui-scrollbar-content .scroll li * {
	white-space: normal;
}

.scroll li.first, .scroll li.clone, .scroll li.toggled, .scroll li.sorting {
	display: -moz-inline-box !important;
	-moz-box-orient: vertical !important;
	display: inline-block !important;
	vertical-align: middle !important;
	word-wrap: break-word !important;
	overflow: hidden;
}
.scroll li.toggled {
	height: 10px !important;
}
.scrollArea .ui-scrollbar-content .scroll li[class="toggled"] * {
	white-space: nowrap !important;
}

.scroll ul.ui-scroll-scrolling li.clone, .scroll ul.ui-scroll-scrolling li.temp {
	width: 0 !important;
}

.scrollArea .scroll li:hover {
	cursor: pointer;
}

.scrollArea .scroll li li {
	margin: 0;
}

.scrollArea .scroll li.alternate-1 {
	background: none;
}

.scrollArea .scroll li .wrap {
	padding: 0 0 20px;
	z-index:2;
	position:relative;
	top=0;
	left=0;
}

.scrollArea .scroll .ui-formulate {
	margin: 0;
}

.scrollArea .scroll li .metadata {
	margin: 0 20px;	
	white-space: normal;
}

.scrollArea .scroll li .metadata .comparison {
	/*position: absolute;*/  /* Test */
	/*bottom: 0px;*/ /* Test */
}

.scrollArea .ui-scrollbar-content .scroll li .metadata ul,
.scrollArea .ui-scrollbar-content .scroll li .metadata ul li {
	white-space: normal;
}

.scrollArea .scroll li .pricing * {
	display: inline;
}

.scrollArea .scroll li .discounted .originalPrice {
	color: #888;
	margin-right: 10px;
}

.scrollArea .scroll li h2, .scrollArea .scroll li h3 {
	margin: 0;
	padding: 0;
}

.scrollArea .scroll li h2 {
	font-size: 1.4em;
}

.scrollArea .scroll li h3 {
	margin-bottom: 10px;
	font-size: 1.3em;
	font-weight: normal;
}

.scrollArea .scroll ul li {
	margin: 0 10px;
}

.scrollArea .scroll ul > li {
	margin: 0 7px;
}

.scrollArea .scroll li h3 span {
	font-size: 0.75em;
	color: #666;
}

.scrollArea .scroll li h3 span.redSymbol{
    font-size: 0.75em;
    color: #F00;
}
.scrollArea .scroll li h3 span.redPrice{
    font-size: 1.0em;
    color: #F00;
}


.scrollArea .scroll li ul {
	display: block;
	margin: 10px 0;
}

.scrollArea .scroll ul ul li {
	display: block !important;
	margin: 0;
	padding-left: 7px;
	color: #111;
	background: url("/images/v2/subcategory/icon-list.gif") no-repeat left 6px;
	white-space: normal;
}

.scrollArea .scroll .comparison {
/*	color: #00bebe;*/
}

.scrollArea .scroll .comparison * {
	vertical-align: middle;
	background:transparent !important;
}

.scrollArea .compareLink {
	background: none;
	border: none;
	margin: 0;
	padding: 0 0 0 4px;
	color: #666;
	white-space: nowrap;
	display: inline-block;
}

.scrollArea .compareLink.active-submit {
	cursor: pointer;
	color: #0088cc;
}

.scrollArea .compareLink.errorMessage, .scrollArea .compareLink.errorMessage:hover {
	color: #ed1c24;
	text-decoration: none;
	white-space: normal;
	cursor: default;
}

.scrollArea input.hidden {
	display: none;
}

#customToolTip {
	display: none;
	white-space: nowrap;
}

#customToolTip.active {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	z-index: 9999;
}

#customToolTip span {
	display: block;
	height: 40px;
	line-height: 32px;
	padding-left: 20px;
	background: url("/images/v2/subcategory/tooltip.png") no-repeat left top;
}

#customToolTip span.cap {
	position: absolute;
	top: 0;
	padding: 0;
	right: -14px;
	width: 14px;
	height: 40px;
	background-position: right top;
}

.hidden {
	display: none;
}

#headlineSecondary .ui-formulate-ignore {
	margin-top: 5px;
	float: right;
}


/* 8. FILTER ELEMENTS 
------------------------------------------------ */
.filterContainer, #content #headline .ui-shadow {
	position: absolute;
	z-index: 2000;
	
	top: 215%;
	left: 0;
}
/*Select Box Width Fix for Firefox*/
.ui-formulate-select{width:auto !important;}

/* for Japanese partnumbers */
.partNumber-jp {
	font-weight: bold;
}
#productcount{
	float:left;
	padding:10px 0px 0px 0px;
	font-weight:bold;
}
.filterContainer #totalCount {
	color:#CCCCCC;
	font-weight:bold;
	font-size:100%;
	padding-top:5px;
}
.compareitems{
	float:left;
	margin-left:13px;
	width: 15%;
}
#headline .alternate-2, .findRetailer .ui-formulate-submit, .findRetailer .ui-formulate-button {
	width:auto !important;
}
.highlightCompShow{
	visibility:visible;
}
.highlightCompHide{
	visibility:hidden;
}
.compareHighlight {
	position: absolute;
	left:0px;
	z-index: 1;
	top: -5px;
}
.compHighImg{
	height:100%;
	width:275px;
}


/* Adding floats for height calculation consistancy between browsers 
------------------------------------------------ */
.scrollArea .scroll li {
	position: relative;
}
.scrollArea .scroll li .wrap {
	clear: both;
	float: left;
}
.scrollArea .scroll li .wrap .listing_image {
	clear: both;
	float: left;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata {
	clear: both;
	float: left;
	width: 235px;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata h2 {
	clear: both;
	float: left;
	width: 235px;
	height: auto !important;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata .partNumber-jp {
	clear: both;
	float: left;
	width: 235px;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata .pricing {
	clear: both;
	float: left;
	width: 235px;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata .listing_rating {
	clear: both;
	float: left;
	width: 235px;
	position: relative;
	height: 16px !Important;
}
.scrollArea .scroll li .wrap .metadata ul {
	clear: both;
	float: left;
	width: 235px !important;
	position: relative;
}
.scrollArea .scroll li .wrap .metadata .comparison {
	clear: both;
	float: left;
	width: 235px;
	position: relative;
}
.info {
    float: right;
    width: 26px;
    height: 17px;
    position: relative;
    z-index: 2001;
}

.feature {
    float: left;
    width: 150px;
    
}

.headlineContent {
    position: relative;
    z-index: 1;
}

.filterContainer {
    padding-right: 6px;
    left: 0px;
    overflow: visible;
    z-index: 30000;
    width: 217px;
}
.filterContainer.collapsed {
    overflow: hidden;
}
body.subcategory #headlineSecondary {
    z-index: 20000;
	max-width: 1024px !important;
	width: 100% !important;
}
.filterContainer label span {
    margin-left: 10px;
}

.featuregroupname {
    font-size: 1em;
    font-family: arial,verdana;
    color: #ffffff;
}

#featureDescContainer {
    display: none;
    width: 213px;
    position: absolute;
    z-index: 1;
    right: -214px; /* was -203px */
    top: 0px;
    height: 150px; 
    /* background: url("/images/v2/subcategory/overlay_box_solid_H150px.png") no-repeat;  */
	/* available files: overlay_box.png (H301), overlay_box_solid_H200px.png, overlay_box_solid_H150px.png */
	border-top: 7px solid #111111;
	border-right: 7px solid #111111;
	border-bottom: 7px solid #111111;
	border-left: 7px solid #111111;
	background: #656565;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
    -moz-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8);	
    -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8);
	-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color='#111111', Direction=135, Strength=2)";
	filter:progid:DXImageTransform.Microsoft.Shadow(color='#111111', Direction=135, Strength=2);
	/* behavior: url("/images/v2/ie-border-radius.htc"); */
}
#featureDescContainer p {
    font-family: arial,verdana;
    font-size: 1.1em;
    color: #fff;
    padding-right:14px;
    padding-left:14px;
    padding-top: 12px;
    word-wrap: break-word;
    line-height: inherit;
}
.out overout {
    height: 403px;
}

#sortOptionsLabel {
    margin-left: 39px;
}
#totalCount {
	float: left;
	font-size: 1.2em;
	font-weight: bold;
	margin-left: 75px;
}
.scrollArea{
	margin-left: 0px ! important;
}
/* SUBCATEGORY CSS FOR TABLETS 
------------------------------------------------ */

.iPad .ui-scrollbar.ui-scrollbar-horizontal, .iPad .ui-scrollbar-button-wrap, .Xoom .ui-scrollbar.ui-scrollbar-horizontal, .Xoom .ui-scrollbar-button-wrap {
	display: none !important;
}
.iPad .scrollArea .scroll, .Xoom .scrollArea .scroll {
	overflow:hidden;
	width: 100% !important;
	margin:20px 0 10px;
}

.iPad .scrollArea .scroll ul > li, .Xoom .scrollArea .scroll ul > li, .iPhone .scrollArea .scroll ul > li {
    margin: 0 !important;
}
.iPad .scrollArea .scroll ul > li[id|="item"], .Xoom .scrollArea .scroll ul > li[id|="item"], .iPhone .scrollArea .scroll ul > li[id|="item"]{
    margin-top:20px !important;	
}
.iPad .filterContainer, .iPad #headlineSecondary, .Xoom .filterContainer, .Xoom #headlineSecondary, .iPhone .filterContainer, .iPhone #headlineSecondary {
	top: 108px !important;
}

.businessbnav.iPad .filterContainer, .businessbnav.iPad #headlineSecondary, .businessbnav.Xoom .filterContainer, .businessbnav.Xoom #headlineSecondary, .businessbnav.iPhone .filterContainer, .businessbnav.iPhone #headlineSecondary {
	top: 135px !important;
}
.businessbnav.subcategory #headlineTitle {
    width: 925px !important;
}

.compareitems {
	float: left;
}

.compareitems a.btn {
	font-size: 11px;
	width: 100%;
}

.select.select-theme-chosen .select-content {
	width: 100%;
}
