/* CSS reset from  http://developer.yahoo.com/yui/reset/ */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym {
	border:0;
}
ol,ul {
	list-style:none;
}
/* end CSS reset */ 

/* generic global styles */
em {
	font-style: italic;	
}
strong {
	font-weight: bold;
}

body {
	background: #000;
	color: #ccc;
	font-family: arial, helvetica, sans-serif;
	font-size: 13px;
}
p {
	margin-top: 0.5em;	
}
a {
	color: #9c9;
	text-decoration: none;	
}
a:hover {
	color: #0c0;	
}


/* basic layout style */
#container {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}
#header {
	clear: both;
	width: 100%;
	height: 80px;
	text-align: center;
}
#content-container {
	float: right;
	clear: right;
	width: 780px;
}
#content-text {
	padding: 10px;	
}

/* front page slideshow */
#content-container #slideshow {
	display: block;
	float: left;
	width: 780px;
	height: 519px;
	margin-left: 5px;
}
#content-container #slideshow img {
	border: solid 1px #eee;
}

/* page content */
#content-container p {
	margin-left: 5px;
}

/* footer */
#footer-container {
	clear: both;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 75px;
	border-top: solid 1px #333;
	background: #111;
}
#footer {
	width: 960px;	
	margin-left: auto;
	margin-right: auto;
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	color: #666;
}

/* left menu */
#menu-left {
	float: left;
	clear: left;
	width: 180px;
	font-size: 13px;
	padding-bottom: 25px;
}
#menu-left li {
	display: block;
	height: 40px;
	width: 100%;
	margin-bottom: 5px;
}
#menu-left li a {
	color: #999;
	display: block;
	height: 100%;	
	border: solid #222 1px;
}
#menu-left li a:hover {
	background: #222;	
	color: #D7DF23;
}
#menu-left li a .title {
	line-height: 35px;
	margin-left: 15px;
}

/* top menu */
#menu-top {
	text-align: right;
	border-bottom: solid 1px #333;
	border-top: solid 1px #333;
	margin: 2px 0 5px 0;
}
#menu-top ul li {
	display: inline;
	margin-left: 7px;
	margin-right: 7px;
}
#menu-top ul li a {
	color: #999;
	font-size: 17px;
	font-variant: small-caps;
	font-weight: bold;
}
#menu-top ul li a:hover {
	color: #D7DF23;
}
.float-right {
	float: right;
}
.float-left {
	float: left;
}

/*** grid containers ***/
#grid-left-col {
	float: left;
	width: 375px;
	padding: 0px 5px 10px 10px;
}
#grid-right-col {
	float: right;
	width: 375px;
	padding: 0px 10px 10px 5px;
}

/*** grid layout ***/
.grid-row {
	display: block;
	width: 375px;
	height: 83px;
	margin: 0 0 10px 0;	
}
a.grid-image {
	display: block;
	width: 123px;
	height: 83px;
	padding: 0 5px 0 0;
	text-align: center;
	float: left;
	overflow: hidden;
}
a.grid-image img {
	border: solid #666 1px;
}
a.grid-text {
	display: block;
	float: right;
	overflow: hidden;
	width: 235px;
	height: 71px;
	border: solid #333 1px;
	padding: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
a.grid-text:hover, a.grid-text:active {
	background: #111;
	border: solid #666 1px;	
}

/** thumbnail text info style */
a.grid-text .grid-id {
	color: #ccc;
	font-weight: bold;
}
a.grid-text .grid-title {
	color: #ccc;
}
a.grid-text .grid-desc {
	color: #666;
	font-size: 11px;
}

/*** view image ***/
#view-image {
	text-align: center;
}
#view-image img {
	padding: 3px;
	border: solid white 1px;
	background: #000;
}
#view-image-text h1 {
	text-align: center;
	font-size: 20px;
	font-weight: bold;	
	color: #fff;
}
#view-image-desc {
	float: left;
	width: 67%;
}
#view-image-desc p {
	margin: 0.5em 1em 0 1em;
}
#view-image-shop {
	float: right;
	width: 33%;
	font-size: 12px;
	color: #ccc;
	padding-bottom: 10px;
}
#view-image-shop .view-image-shop-section {
	clear: both;
	padding-top: 1em;
}
#view-image-shop h2 {
	clear: both;
	font-weight: bold;
	background: #222;
	font-size: 13px;
}
#view-image-shop .product {
	float: left;
	clear: left;
	width:75%	
}
#view-image-shop .price {
	float: right;
	clear: right;
	width: 25%
}
#view-image-shop .price-discounted {
	float: right;
	clear: right;
	width: 25%;
	color: #f66;
}
#view-image-linkback {
	text-align: center;
	font-size: 11px;
}

/*** general ***/
h1 {
	font-size: 25px;
	text-align: center;
	letter-spacing: -0.05em;
	margin-top: 5px;
	color: #D7DF23;
}
h1.home {
	font-size: 18px;	
}
h2 {
	font-size: 18px;
	text-align: left;
	letter-spacing: -0.1em;
	margin-top: 10px;
	color: #D7DF23;
}
#view-image-shop h2 {
	color: #ccc;
}

/** pagination ***/
.grid-pagination {
	clear: both;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 15px 0 15px 0;
}
.grid-pagination a {
	padding: 2px 5px 2px 5px;
	border: solid 1px #666;	
}
.grid-pagination a:hover {
	background: #111;
	border: solid 1px #fff;	
}
.grid-pagination a.current-page {
	border: solid 1px #000;	
}
.grid-page-details {
	padding-left: 10px;
	margin-bottom: 5px;
}

/*** search box ***/
#search-container {
	margin: 0;	
	font-size: 12px;
}
#search-container input, #search-container button {
	display: block;
	background-color: #111;
	border: solid 1px #333;
	color: #ccc;
}
#search-container input {
	float: left;
	width: 125px;
	height: 20px;
}
#search-container button {
	float: right;
	width: 50px;
	height: 22px;
	padding: 2px;
}
#search-container h2 {
	display: none;
}

/*** what is this help for products ***/
.what-is-this {
	font-size: 13px;
	font-weight: normal;	
}

#popular-searches {
	position: relative;
	top: 1em;
	font-size: 11px;
}

.justify {
	text-align: justify;
}
td.left {
	width: 90px;
	font-weight: bold;
}
table {
	margin-top: 10px;
}
.stats img {
	display: none;
}
body#help-page {
	padding: 10px;
}
#tooltip { 
    display:none; 
    background:transparent url("/images/tooltip/black_arrow.png"); 
    font-size:12px; 
    height:70px; 
    width:160px; 
    padding:25px; 
    color:#fff;     
}

/* notices for specials etc */
.front-page-notice {
	background: #111;
	padding: 5px;
	margin: 5px 0 5px 5px;
	font-size: 15px;
	border: solid 1px #D7DF23;
	clear: both;
}
.grid-notice {
	background: #111;
	padding: 5px;
	margin: 5px 0 5px 5px;
	font-size: 15px;
	border: solid 1px #D7DF23;
	clear: both;
}
.view-notice {
	float: left;
	background: #111;
	padding: 5px;
	margin: 5px 13px 5px 13px;
	font-size: 12px;
	border: solid 1px #D7DF23;
}
#help-page ol, #help-page ul {
	list-style-type:square;
	padding-left: 25px;
}

/* specials */
#specials {
	padding: 10px;	
}
#specials tr {
	border: solid 1px #666;	
}
#specials td {
	padding: 10px;
}
#specials td.column1 {
	vertical-align: middle;
	text-align: center;
	width: 160px;	
}
.column1 img {
	border: solid #666 1px;	
}
#specials td.column2 {
	vertical-align: middle;
	width: 500px;	
}
#specials td.column3 {
	vertical-align: middle;
	text-align: center;
	width: 150px;	
	font-size: 13px;
	font-weight: normal;
	color: #999;
}
#specials .title {
	font-size: 15px;
	font-weight: bold;
	color: #D7DF23;	
}
#specials .description, #specials .stock {
	font-size: 13px;
	font-weight: normal;
	color: #999;
}
#specials strong {
	color: #ccc;
}
#specials .was {
	font-size: 12px;
}
#specials .now {
	font-size: 20px;
	color: #D7DF23;
	font-weight: bold;
}
#specials .code {
	font-size: 10px;
}

/* switch sites box */
#switch-sites {
	position: absolute;
	right: 0;
	top: 0;
	overflow: hidden;
	font-size: 13px;	
}
#switch-sites a {
	display: block;
	width: 200px;
	height: 35px;
	background: #111;
	color: #999;
	border: solid #666 1px;
	padding: 5px;
}
#switch-sites a:hover {
	background: #D7DF23;	
	color: #000;
}

/* specials ad */
#specials-top {
	position: absolute;
	width: 180px;
	height: 72px;
}
