@charset "utf-8";

/*
Red Hot Music CSS Styles
v1.00
*/

/*
Page width:816px (with shadows)
Content width:799px; 179 + 620
*/

/*
GLOBAL
*/
* {
	margin:0em;
	padding:0em;
	border:none;
}



html {
	font-size:70%;
	font-family:arial, helvetica, sans-serif;
	color:#000;
}

button {
	cursor:pointer;
}

.accessible {
	display:block;
	position:absolute;
	left:-9999em;
	z-index:0;
	height:0px;
	width:0px;
	line-height:0px;
	font-size:0px;
	float:left;
	clear:none;
	visibility:collapse;
}

.invisible {
	display:none;
}

a {
	text-decoration:underline;
}

a:link {
	color:#002883;
}
a:visited {
	color:#002883;
}
a:hover {
	color:#5d0000;
}
a:active {
	color:#5d0000;
	outline:none;
}

a.viewcart:link {
	color:#5297ff;
}
a.viewcart:visited {
	color:#5297ff;
}
a.viewcart:hover {
	color:#ff0000;
}
a.viewcart:active {
	color:#ff0000;
	outline:none;
}


/*
PAGE LAYOUT
*/

body {
	background:#282828 url(../images/bg-page.jpg) center top repeat-x;
}

#page {
	width:816px;
	margin:0px auto;
}

#masthead {
	background:url(../images/bg-header.jpg) left top no-repeat;
	width:816px;
	height:192px;
	position:relative;
}

#company {
	position:absolute;
	top:54px;
	left:24px;
}

#content-container {
	background:#595959 url(../images/bg-content.gif) left top repeat-x;
	padding-top:25px;
	width:799px;
	margin:0px 8px 0px 9px;
	overflow:auto;
	height:.1%;
}

#content {
	float:right;
	width:620px;
	height:.1%;
}


#content-extra {
	float:left;
	width:179px;	
	margin:0px;
	padding-bottom:70px;
	height:.1%;
}


/*
NAV PRIMARY
*/

#nav-primary {
	position:relative;
	z-index:9;
	width:816px;
	background:url(../images/bg-nav-primary.jpg) left top repeat-y;
	text-align:right;
	height:37px;
}

#nav {
	list-style:none;
	padding:0px 15px;
	float:right;
}

#nav li {
	float:left;;
}

#nav li span {
	display:none;
}

#nav li a {
	float:left;
	height:37px;
	background-position:left top;
	background-repeat:no-repeat;
}

#nav li a:hover {
	background-position:left bottom;
}

 #nav-pri-1 a {
        background-image:url(../images/nav-pri-1.gif);
        width:52px;
    }
    #nav-pri-2 a {
        background-image:url(../images/nav-pri-2.gif);
        width:87px;
    }
    #nav-pri-3 a {
        background-image:url(../images/nav-pri-3.gif);
        width:111px;
    }
    #nav-pri-4 a {
        background-image:url(../images/nav-pri-4.gif);
        width:148px;
    }
    #nav-pri-5 a {
        background-image:url(../images/nav-pri-5.gif);
        width:107px;
    }
    #nav-pri-6 a {
        background-image:url(../images/nav-pri-6.gif);
        width:98px;
    }   
	


	
	
/*
FOOTER
*/

#footer {
	z-index:8;
	position:relative;
	width:799px;
	clear:both;
	padding:5px 8px 0px 9px;
	background:url(../images/bg-footer.gif) left top no-repeat;
	min-height:120px;
	_height:120px;
	text-align:center;
	
}

#footer ul {
	list-style:none;
	width:auto;
}

#footer li {
	display:inline;
}

#footer li a {
	display:inline-block;
	margin:0px 5px 20px 5px;
}

#creator {
	position:absolute;
	z-index:15;
	right:0;
	top:0;
	height:155px;
	width:32px;
	margin-right:-24px; /* Image plus footer margin */
	margin-top:-70px;
}

#creator span {
	display:none;
}

#label {
	position:absolute;
	z-index:9;
	left:0;
	top:0;
	background:url(../images/label-red-hot-music.gif) top left no-repeat;
	height:64px;
	width:179px;
	margin-left:9px; /* Image plus footer margin */
	margin-top:-57px;
}

#label span {
	display:none;
}



/*
CONTENT
*/

#content p {
	margin-bottom:1.4em;
	line-height:1.5em;
}

#content h1, #content h2 {
	color:#fff;
	font-size:2.1em;
	margin-bottom:.5em;

}

/* CATALOGUE */
#catalogue ul {
	list-style:none;
	margin-bottom:20px;
}

#catalogue ul li {
	display:inline;
}

#catalogue ul li a {
	display:block;
	background-position:left top;
	background-repeat:no-repeat;
	width:179px;
}

#catalogue ul li a:hover {
	background-position:left bottom;
}

#catalogue ul li a span {
	display:none;
}

	#nav-sec-1 a {
		background-image:url(../images/nav-sec-1.gif);
		height:37px;
	}
	#nav-sec-2 a {
		background-image:url(../images/nav-sec-2.gif);
		height:37px;		
	}
	#nav-sec-3 a {
		background-image:url(../images/nav-sec-3.gif);
		height:37px;
	}
	#nav-sec-4 a {
		background-image:url(../images/nav-sec-4.gif);
		height:37px;
	}
	#nav-sec-5 a {
		background-image:url(../images/nav-sec-5.gif);
		height:37px;
	}
	
	#nav-sec-7 a {
		background-image:url(../images/nav-sec-7.gif);
		height:38px;
	}
	
	#nav-sec-6 a {
		background-image:url(../images/nav-sec-6.gif);
		height:38px;
	}
	
	
	/* Drop Down Navigation*/
	#catalogue #dropdown ul {
		position:absolute;
		width:250px;
		z-index:10;
	}
	
	#catalogue #dropdown ul {
		left:-999em; /* Hide UL from screen */
		z-index:10;
	}
	
	#catalogue #dropdown .sfhover ul, #catalogue #dropdown li:hover ul {
		left:auto; /* Hover or JS action */
		margin-left: 178px;
		margin-top: -37px;
		z-index:10;
	}
	
	#catalogue #dropdown .sfhover ul ul, #catalogue #dropdown li:hover ul ul {
		left:-999em;
		z-index:10;
	}
	
	#catalogue #dropdown ul .sfhover ul, #catalogue #dropdown ul li:hover ul {
		left:250px;
		z-index:10;
	}	

	#catalogue #dropdown ul a {
		text-decoration:none;
		padding:5px;
		display:block;
		width:150px;
		height:auto;
		background-image:none !important;
		background-color:#670000 !important;
		margin:0px 0px -1px 0px;
		border:1px solid black;
		color: #FFFFFF;
		z-index:10;
	}	
	
	#catalogue #dropdown ul a:hover {
		background-color:#000 !important;
		z-index:10;
	}	
	
	
/* SEARCH FORM */

#search-form {
	background:url(../images/bg-search-form.gif) left bottom no-repeat;
	padding-bottom:15px;
	padding-top:15px;
	height:.1%;
}

#search-form button {
	clear:both;
	display:block;
	height:22px;
	width:31px;
	border:0px;
	background:url(../images/button-go.gif) top left no-repeat;
	margin:5px 5px 5px 115px;
}

#search-form button span {
	display:none;
}

#search-form label {
	display:block;
	margin:10px 0px 2px 20px;
}

#search-form input {
	margin-left:25px;
	width:120px;
	height:20px;
}

#search-form select {
	margin-left:25px;
	width:120px;
	height:20px;
}


/* FEATURE */

#content #feature {
	height:300px;
	color:#fff;
	background-color:#101010;
	position:relative;
}

#content #feature .preview-image {
	float:left;
	
}

#content #feature .info-image {
	position:absolute;
	right:0px;
	top:0px;
	z-index:1;
	float:left;
}


#content #feature .info {
	position:absolute;
	right:50px;
	top:170px;
	z-index:2;
	width:150px;
	float:left;
}


/* LOCAL NAV */
#content #local-nav ul {
	list-style:none;
	padding:20px 0px 10px 10px;
}

#content #local-nav li{
	display:inline;
}

#content #local-nav li a {
	display:inline-block;
	padding-top:10px;
}

/* PRODUCT */

#content .product {
	background:#a1a1a0;
	position:relative;
	overflow:auto;
	height:.1%;
}

#content .product .price {
	color:#9a1a24;
	font-weight:bold;
	font-size:1.4em;
}

#content .product .tax {
	font-weight:bold;
	font-size:1.1em;
}

#content .product .info {
	float:left;
	width:320px;
	padding:30px 0px 10px 30px;
} 

#content .product .info .links {
	list-style:none;
	margin-bottom:10px;
}

#content .product .info .links li {
	display:inline;
}

#content .product .info .links li a {
	color:#000;
	background:url(../images/divider-links.gif) left 3px no-repeat;
	padding-left:9px;
	margin-left:6px;
}

#content .product .info .links .first-child a {
	background:none;
	padding-left:0px;
	margin-left:0px;
}

#content .product .info .links li a:hover {
	text-decoration:none;
}

#content .product .preview-image {
	float:right;
	top:0px;
	right:0px;
}

#content .product .gallery {
	margin-top:30px;
}

#content .product .gallery ul {
	list-style:none;
	margin-bottom: 5px;
}

#content .product .gallery li {	
	display:inline;
	margin-right:5px;
}

#content .product .gallery li img {	
}

/* RATINGS */

#content .ratings {
	clear:both;
	background:#c51e2d;
	padding:30px;
	position:relative;
}

#content .rating {
	position:absolute;
	right:30px;
	top:30px;
}

#content .rating h2 {
	width:auto;
	float:left;
}

#content .ratings h3 {
	color:#fff;
	text-transform:uppercase;
	font-size:1.2em;
	margin:0px;
}

#content .ratings form {
	margin-bottom:15px;
}

#content .rating .number {
	float:left;
	margin:1.2em .5em 0em .5em;
}

#content .rating .rated {
	clear:left;
}

#content .ratings .items .item h4 {
	font-weight:normal;
	font-size:1em;
}

#content .ratings .items .item span {
	font-weight:bold;
}

/* PRODUCT LIST */

#content .product-list {
	padding:25px 0px 25px 25px;
	height:.1%;
}

#content .product-list h2 {
	font-size:1.4em;
}

#content .product-list .items {
	clear:both;
}

#content .product-list .items .item {
	float:left;
	width:180px;
	padding:0px 15px 15px 0px;
	height:.1%;
}

#content .product-list .items .item h2 {
	font-size:1.1em;

}

#content .product-list .items .item h2 a {
	text-decoration:none;
	color:#fff;
}

#content .product-list .items .item .preview-image {
	margin-bottom:10px;

}

#cart { 	background-color: #2b0003;  
			margin-top: 0px;
			font-size: 10px;
			font-family: sans-serif;
			font-spacing: 2px;
			color: #ffffff;}
#cart a { text-decoration: none;
			font-size: 12px; }
			
			
hr { border: 1px solid #9a1a24; }


/* Blog */

.blog {
	padding: 0 15px 15px 72px;
	position: relative;
	background: #b6b6b5 url(../images/blog-bottom.png) bottom left no-repeat;
	width: 507px;
	min-height: 100px;
	margin-bottom: 8px;
}
h1.blog-title {
	margin: 0 0 8px 0 !important;
	padding-top: 5px;
	color: #fefefc;
}
h1.blog-title a {
	color: #fefefc;
	text-decoration: none;
}
.blog-posted {
	color: #2b0003;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 12px;
}
.blog-posted a {
	color: #2b0003;
	text-decoration: underline;
}
.blog-text {
	font-size: 12px;
	line-height: 18px;
}
.blog-text {
	margin-bottom: 12px;
}
.blog-date {
	width: 47px;
	color: #fefefc;
	position: absolute;
	top: 9px;
	left: 11px;
	text-align:center;
}
.blog-date .month {
	background: #2b0003;
	height: 18px;
	display:block;
	font-size: 14px;
	font-weight: bold;
	padding-top: 2px;
}
.blog-date .day {
	background: #c41f2d;
	height: 30px;
	display:block;
	font-size: 24px;
	font-weight: bold;
}