/*

STYLESHEET FOR SCREEN

CONTENTS ----------

	1.BODY
	2.UNIVERSAL STYLES
	3.LISTS
	4.SPANS
	5.PARAGRAPHS
	6.HEADINGS
	7.LINKS
	8.LAYOUT
	9.NAVIGATION
	10.FORMS
	11.TABLES
	
	---------------

	COLOUR REFERENCE
	
	#362824 DARK BROWN
	#9f324b MAIN BURGUNDY
	#c56376 LIGHTER BURGUNDY
	#fff1d7 CREAM
	#ebb534 GOLD

	---------------
	
	FONT SIZES
	
	11px 0.916em
	12px 1em
	13px 1.083em
	14px 1.166em
	16px 1.333em
	18px 1.5em
	24px 2em

	---------------

*/

/*
1.BODY  ---------------------------------------------*/

	body {
		font-family: Helvetica, Arial, sans-serif;
		background-color: #fff;
		color: #fff1d7;
		font-size: 75%;
		line-height: 1.75;
		background: #362824 url(/images/interface/main_bg.jpg) left top repeat; }


/*
2.UNIVERSAL STYLES  -----------------------------------------*/

	strong {
		font-weight: bold; }
		
	em {
		font-style: italic; }
		
	.clearfix:after {
	    content: ".";
	    display: block;
	    height: 0;
	    clear: both;
	    visibility: hidden; }
		
	div#pagination p strong {
		color: #362824;
		font-weight: bold;
		text-decoration: none;
		padding: 4px 5px 2px;
		background-color: #ebb534; }
		
	p.search_results strong {
		margin-right: 10px;
		background-color: #ebb534;
		color: #362824;
		padding: 2px 6px; }

/*
3.LISTS  -----------------------------------------*/

	ul.search_results {
		font-size: 1.166em;
		text-transform: capitalize;
		margin: 30px 480px 10px 55px; }
		
	div.links ul {
		font-size: 1.166em; }


/*
4.SPANS  -----------------------------------------*/

	span#main_logo {
		display: block;
		position: relative;
		left: 205px;
		top: 15px;
		width: 570px;
		height: 144px;
		background: transparent url(/images/interface/main_logo.jpg) center top no-repeat;
		text-indent: -9999px; }
		
	div#pagination span.number {
		color: #fff1d7;
		font-weight: bold;
		background-color: #362824;
		padding: 3px 5px 2px; }
		
	table#list a span.preview {
		display: block;
		text-indent: -9999px; }
		
	body.detail div#comments div.meta span.author {
		font-weight: bold;
		font-size: 1.083em; }
		
	body.detail div#comments div.meta span.date {
		color: #c56376; }

/*
5.PARAGRAPHS  -----------------------------------------*/

	p {
		font-size: 1.166em;
		margin: 10px 0; }
		
	div.home p {
		font-size: 1.333em;
		margin: 10px 55px 10px 55px; }

	div.half p {
		margin: 10px 20px; }
		
	div#pagination p {
		font-weight: bold;
		margin: 16px 20px 0; }
		
	div.detail p {
		margin: 0 400px 10px 85px; }
		
	div.detail p.back_link {
		margin: 30px 0 20px 38px;
		padding-left: 22px;  }
		
	div.detail div#comments p {
		font-size: 1.083em;
		margin: 0;  }
		
	div.detail p.title {
		font-size: 1.333em;
		font-weight: bold;
		clear: both;
		margin: 0;
		padding: 0 85px 0; }
		
	div.detail p.preview_title {
		margin-top: 10px;
		margin-bottom: 5px; }
		
	div.detail div#comments p.title {
		font-size: 1.333em;
		font-weight: bold;
		margin: 30px 0 0 45px; }
		
	div.detail form#comment_form p.header {
		margin: 10px 0 10px 130px; }
				
/*
6.HEADINGS  -----------------------------------------*/

	h1 {
		font-size: 2em;
		font-weight: bold;
		color: #362824; }

	div.half h1 {
		margin: 12px 0 18px 20px;
		text-shadow: 1px 1px 1px #fff; }
		
	div.detail h1 {
		text-transform: capitalize;
		line-height: 1.25em;
		background: transparent url(/images/interface/cat_detail_title_repeat.jpg) left top repeat-y;
		width: 548px;
		margin: 0 60px;
		padding: 6px 15px 5px 25px; }
		
	div.home h1 {
		background: transparent url(/images/interface/home_title_bg.jpg) left top no-repeat;
		margin: 0 0 12px 35px;
		padding: 12px 0 6px 20px; }
		
	div.contact div.half div.vcard h2 {
		font-size: 1.142em;
		font-weight: bold;
		margin-bottom: 10px; }
		
	div.links h2 {
		font-size: 1.5em;
		font-weight: bold; }

/*
7.LINKS  --------------------------------------------*/

	a {
		color: #fff1d7; }
		
	a:hover, a:active {
		color: #ebb534; }
		
	table#list td.title a {
		text-decoration: none; }

	table#list td.info a {
		display: block;
		text-indent: -9999px;
		width: 109px;
		height: 36px; }
		
	table#list tr.none td.info a {
		background: transparent url(/images/interface/list_table_row_none_sprite.jpg) right top no-repeat; }
		
	table#list tr.mp3 td.info a {
		background: transparent url(/images/interface/list_table_row_mp3_sprite.jpg) right top no-repeat; }
		
	table#list tr.scorch td.info a {
		background: transparent url(/images/interface/list_table_row_scorch_sprite.jpg) right top no-repeat; }
		
	table#list tr.both td.info a {
		background: transparent url(/images/interface/list_table_row_both_sprite.jpg) right top no-repeat; }
		
	table#list tr td.info a:hover, table#list tr td.info a:active {
		background-position: right -36px; }
		
	div#pagination p a {
		color: #fff1d7;
		font-weight: bold;
		text-decoration: none;
		padding: 4px 5px 2px;
		background-color: #362824; }
		
	div#pagination p a:visited {
		background-color: #d1c0a1; }
		
	div#pagination p a:hover, div#pagination p a:active, div#pagination p a.current {
		background-color: #ebb534;
		color: #362824; }
		
	div.detail a.add_to_cart {
		display: block;
		position: absolute;
		top: 116px;
		right: 59px;
		text-indent: -9999px;
		width: 252px;
		height: 53px;
		background: transparent url(/images/interface/cat_detail_add_to_cart_sprite.jpg) left bottom no-repeat; }
		
	div.detail a.add_to_cart:hover, div.detail a.add_to_cart:active {
		background-position: left top; }
		
	div.detail p.back_link a {
		text-decoration: none;
		padding-left: 22px;
		background: transparent  url(/images/interface/back_link_arrow_sprite.jpg) left 2px no-repeat;  }
		
	div.detail p.back_link a:hover, div.detail p.back_link a:active {
		background-position: left -23px;  }
/*
8.LAYOUT  -------------------------------------------*/

	div#wrapper {
		background: transparent url(/images/interface/wrapper_repeat_bg.jpg) center -2px repeat-y;
		width: 980px;
		margin: 0 auto;
		position: relative; }
		
	div#wrapper div#top {
		background: transparent url(/images/interface/wrapper_top_bg.jpg) center top no-repeat;
		width: 980px;
		height: 25px; }
		
	div#wrapper div#bottom {
		background: transparent url(/images/interface/wrapper_foot_bg.jpg) center top no-repeat;
		width: 980px;
		height: 25px; }
		
	div#content {
		position: relative;
		width: 980px;
		margin-top: 54px; }
		
	div#footer {
		clear: both;
		padding: 50px 0 5px;
		text-align: center;
		font-size: 0.916em; }
		
/* HOME*/
		
	div.home img.main {
		float: right;
		background: transparent url(/images/interface/home_image_bg.jpg) top left no-repeat;
		margin: 0 35px 10px 20px;
		padding: 5px 25px 16px 10px; }
		
/* ABOUT */
		
	div.half {
		width: 430px;
		margin-left: 35px;
		float: left;
		background: transparent url(/images/interface/about_bg.jpg) center top no-repeat; }
		
	div.half.last {
		margin-left: 44px; }
		
	div.half img {
		float: right;
		margin: 5px 25px 15px 15px; }
		
	div.links {
		clear: both;
		float: left;
		border-top: 1px solid #c56376;
		width: 900px;
		margin: 20px 0 20px 55px;
		padding-top: 10px; }
		
/* CATALOGUE LIST */

	div#table_wrapper {
		background: transparent url(/images/interface/list_table_foot.jpg) 55px bottom no-repeat;
		padding-bottom: 5px;
		margin-bottom: 30px; }

	div#pagination {
		color: #362824;
		position: relative;
		height: 53px;
		float: right;
		margin-right: 45px;
		background: transparent url(/images/interface/pagination_repeat.jpg) left top repeat-x; }

	div#pagination div.left {
		width: 10px;
		height: 53px;
		position: absolute;
		background: transparent url(/images/interface/pagination_left.jpg) left top no-repeat; }

	div#pagination div.right {
		width: 10px;
		height: 53px;
		position: absolute;
		right: 0;
		top: 0;
		background: transparent url(/images/interface/pagination_right.jpg) left top no-repeat; }
		
	div#information {
		width: 590px;
		margin-left: 65px; }
		
	img.icon {
		vertical-align: middle;
		margin-left: 20px; }
		
	img.icon.first {
		margin-left: 0; }
		
/* CATALOGUE DETAIL */

	div.detail div.heading_top {
		background: transparent url(/images/interface/cat_detail_title_top.jpg) left top no-repeat;
		width: 548px;
		height: 6px;
		margin: 34px 60px 0 60px; }

	div.detail div.heading_bottom {
		background: transparent url(/images/interface/cat_detail_title_bottom.jpg) left top no-repeat;
		width: 548px;
		height: 6px;
		margin: 0 60px 20px 60px; }
		
	div#secondary_table_wrapper {
		float: right;
		width: 252px;
		margin: 0 59px 20px 20px;
		padding-top: 6px;
		background: transparent url(/images/interface/cat_detail_secondary_top.jpg) center top no-repeat; }
		
	div#secondary_table_wrapper div.bottom {
		width: 252px;
		height: 6px;
		background: transparent url(/images/interface/cat_detail_secondary_bottom.jpg) center top no-repeat; }
		
	div.detail div#scorch_wrapper {
		margin-left: 80px; }
		
	div#comments {
		background: transparent url(/images/interface/wrapper_repeat_bg_dark.jpg) left top repeat-y; }
		
	body.detail div#footer {
		background: transparent url(/images/interface/wrapper_repeat_bg_dark.jpg) left top repeat-y; }
		
	body.detail div#wrapper div#bottom {
		background: transparent url(/images/interface/wrapper_foot_bg_dark.jpg) center top no-repeat; }
		
	body.detail div#comments div.comment {
		clear: both;
		background: transparent url(/images/interface/cat_detail_comment_keyline.jpg) center top no-repeat;
		padding: 10px 85px; }
		
	body.detail div#comments div.meta {
		float: left;
		width: 120px; }
		
	body.detail div#comments div.text {
		margin-left: 130px; }
		
	body.detail div#scorch_wrapper {
		margin: 0 0 20px 85px;}
		
	body.detail div#secondary_table_wrapper div.audio_player {
		margin: 30px 0 10px; }
		
/* CONTACT */
		
	div.contact div.half {
		background: transparent url(/images/interface/contact_title_bg.jpg) center top no-repeat; }
		
	div.contact div.half div.vcard {
		font-size: 1.166em;
		padding: 10px 20px; }
		
	div.contact div.half div.vcard div.adr {
		margin-bottom: 10px; }
		
/*
9.NAVIGATION  -------------------------------------------*/

	ul#nav {
		margin-top: 40px;
		background: transparent url(/images/interface/main_nav_sprite.jpg) center top no-repeat;
		width: 980px;
		height: 29px; }
		
	ul#nav li {
		position: absolute; }

	ul#nav li a {
		display: block;
		height: 29px;
		background: transparent url(/images/interface/main_nav_sprite.jpg) center top no-repeat;
		text-indent: -9999px; }

	ul#nav li#home {
		left: 296px; }

	ul#nav li#home a {
		width: 53px;
		background-position: -296px top; }

	ul#nav li#home a:hover, ul#nav li#home a:active, ul#nav li#home.current a {
		background-position: -296px -66px; }

	ul#nav li#about {
		left: 373px; }

	ul#nav li#about a {
		width: 64px;
		background-position: -373px top; }

	ul#nav li#about a:hover, ul#nav li#about a:active, ul#nav li#about.current a {
		background-position: -373px -66px; }

	ul#nav li#cat {
		left: 462px; }

	ul#nav li#cat a {
		width: 108px;
		background-position: -462px top; }

	ul#nav li#cat a:hover, ul#nav li#cat a:active, ul#nav li#cat.current a {
		background-position: -462px -66px; }

	ul#nav li#contact {
		left: 595px; }

	ul#nav li#contact a {
		width: 90px;
		background-position: -595px top; }

	ul#nav li#contact a:hover, ul#nav li#contact a:active, ul#nav li#contact.current a {
		background-position: -595px -66px; }
		
/* CATEGORY SELECTOR */

	ul#selector {
		position: relative;
		left: 35px;
		background: transparent url(/images/interface/cat_list_selector_sprite.jpg) center top no-repeat;
		width: 910px;
		height: 82px; }

	div.home ul#selector {
		clear: both;
		margin-top: 28px; }
		
	ul#selector li {
		position: absolute; }

	ul#selector li a {
		display: block;
		height: 82px;
		background: transparent url(/images/interface/cat_list_selector_sprite.jpg) center top no-repeat;
		text-indent: -9999px; }

	ul#selector li#woodwind {
		left: 22px; }

	ul#selector li#woodwind a {
		width: 174px;
		background-position: -22px top; }

	ul#selector li#woodwind a:hover, ul#selector li#woodwind a:active, ul#selector li#woodwind.current a {
		background-position: -22px -84px; }

	ul#selector li#brass {
		left: 201px; }

	ul#selector li#brass a {
		width: 105px;
		background-position: -201px top; }

	ul#selector li#brass a:hover, ul#selector li#brass a:active, ul#selector li#brass.current a {
		background-position: -201px -84px; }

	ul#selector li#voice {
		left: 311px; }

	ul#selector li#voice a {
		width: 133px;
		background-position: -311px top; }

	ul#selector li#voice a:hover, ul#selector li#voice a:active, ul#selector li#voice.current a {
		background-position: -311px -84px; }

	ul#selector li#strings {
		left: 449px; }

	ul#selector li#strings a {
		width: 130px;
		background-position: -449px top; }

	ul#selector li#strings a:hover, ul#selector li#strings a:active, ul#selector li#strings.current a {
		background-position: -449px -84px; }

	ul#selector li#guitar {
		left: 584px; }

	ul#selector li#guitar a {
		width: 121px;
		background-position: -584px top; }

	ul#selector li#guitar a:hover, ul#selector li#guitar a:active, ul#selector li#guitar.current a {
		background-position: -584px -84px; }

	ul#selector li#orchestra {
		left: 710px; }

	ul#selector li#orchestra a {
		width: 179px;
		background-position: -710px top; }

	ul#selector li#orchestra a:hover, ul#orchestra li#brass a:active, ul#selector li#orchestra.current a {
		background-position: -710px -84px; }

/*
10.FORMS  -------------------------------------------*/
		
	form#catmenu {
		position: absolute;
		top: 126px;
		left: 63px; }
		
	div#comments form {
		clear: both;
		background: transparent url(/images/interface/cat_detail_comment_keyline.jpg) center top no-repeat;
		padding: 15px 85px; }
	
	div#comments form div {
		margin: 18px 0; }
	
	div#comments form div.remember {
		margin-bottom: 0; }
	
	div#comments form div.email {
		clear: both;
		margin-top: 0; }
	
	div#comments form div.buttons {
		clear: both;
		margin-top: 24px; }
	
	div#comments form label {
		display: block;
		float: left;
		text-align: right;
		width: 110px;
		margin-right: 10px;
		padding: 5px; }
	
	div#comments form label.checkbox {
		width: 160px;
		margin-left: 10px;
		text-align: left; }
	
	div#comments form label.comment {
		margin-top: 5px; }
	
	div#comments form input[type="text"], div#comments form textarea {
		font-family: Helvetica, Arial, sans-serif;
		font-size: 1.083em;
		line-height: 1.75em;
		color: #fff1d7;
		border: 0;
		background-color: #9f324b;
		padding: 0 3px; }
	
	div#comments form input[type="text"]:focus, div#comments form textarea:focus {
		background-color: #c56376; }
	
	div#comments form input[type="text"] {
		padding: 3px;
		margin-right: 20px;
		width: 400px; }
	
	div#comments form input[type="submit"] {
		margin: 20px 0 0 130px;
		color: #333; }
	
	div#comments form input.checkbox {
		float: left;
		margin-left: 130px; }
	
	div#comments form textarea {
		padding-top: 3px;
		width: 400px;
		height: 120px; }
	
	div#comments form span {
		display: block;
		margin: 5px 0 0 130px; }

	div#comments form label.error {
		text-align: left;
		width: 600px;
		margin: 0 0 24px 320px;
		color: #cc0000;
		font-weight: bold; }

/*
11.TABLES  -------------------------------------------*/
		
	table#list {
		text-align: left;
		width: 875px;
		margin: 32px 0 0 55px; }
		
	table#list .centre {
		text-align: center; }
		
	table#list .right {
		text-align: right; }
		
	table#list tr.header {
		font-size: 1.166em;
		vertical-align: middle;
		font-weight: bold;
		color: #c56376;
		height: 42px; }
		
	table#list th {
		background: transparent url(/images/interface/list_table_head_sprite.jpg) left bottom no-repeat;
		padding-top: 12px; }
		
	table#list tr.sub_header {
		font-size: 1.166em;
		vertical-align: middle;
		color: #ebb534;
		height: 30px; }
		
	table#list tr.sub_header th {
		background: transparent url(../images/interface/cat_list_sub_head.jpg) left top no-repeat;
		padding: 4px 0 0 10px;
		font-weight: normal; }
		
	table#list th.title {
		width: 245px;
		background-position: 0 bottom; }
		
	table#list th.serial {
		width: 80px;
		background-position: -245px bottom; }
		
	table#list th.comp {
		width: 125px;
		background-position: -325px bottom; }
		
	table#list th.instr {
		width: 70px;
		background-position: -450px bottom; }
		
	table#list th.grade {
		width: 65px;
		background-position: -520px bottom; }
		
	table#list th.price {
		width: 55px;
		background-position: -585px bottom; }
		
	table#list th.info {
		width: 109px;
		background-position: -640px bottom; }
		
	table#list th.info span {
		margin-right: 10px; }
		
	table#list th.cart {
		width: 126px;
		background-position: -749px bottom; }
		
	table#list tr {
		font-size: 1.166em; }
		
	table#list tr td {
		height: 36px;
		line-height: 36px; }
		
	table#list tr.none td {
		background: transparent url(/images/interface/list_table_row_none_sprite.jpg) left top no-repeat; }
		
	table#list tr.mp3 td {
		background: transparent url(/images/interface/list_table_row_mp3_sprite.jpg) left top no-repeat; }
		
	table#list tr.scorch td {
		background: transparent url(/images/interface/list_table_row_scorch_sprite.jpg) left top no-repeat; }
		
	table#list tr.both td {
		background: transparent url(/images/interface/list_table_row_both_sprite.jpg) left top no-repeat; }
		
	table#list tr td.title {
		width: 245px;
		background-position: 0 top; }
		
	table#list tr td.serial {
		width: 80px;
		background-position: -245px top; }
		
	table#list tr td.comp {
		width: 125px;
		text-transform: capitalize;
		background-position: -325px top; }
		
	table#list tr td.instr {
		width: 70px;
		background-position: -450px top; }
		
	table#list tr td.grade {
		width: 65px;
		background-position: -520px top; }
		
	table#list tr td.price {
		width: 55px;
		background-position: -585px top; }
		
	table#list tr td.info {
		width: 109px;
		background-position: -640px top; }
		
	table#list tr td.cart {
		width: 126px;
		background-position: -749px top; }

	table#list td.cart a {
		color: #fff1d7;
		display: block;
		text-indent: -9999px;
		width: 125px;
		height: 36px;
		background: transparent url(/images/interface/list_table_cart_sprite.jpg) left top no-repeat; }

	table#list td.cart a:hover, table#list td.cart a:active {
		background-position: left -36px; }
		
	table#list tr .title span {
		display: block;
		padding-left: 10px; }

	a.view_cart_list {
		position: absolute;
		left: 804px;
		top: 114px;
		display: block;
		border: none;
		text-indent: -9999px;
		width: 126px;
		height: 42px;
		background: transparent url(/images/interface/list_table_head_sprite.jpg) right bottom no-repeat; }
		
	a.view_cart_list:hover, a.view_cart_list:active {
		background-position: right top; }
		
	table#detail_secondary {
		color: #362824;
		width: 252px;
		background: transparent url(/images/interface/cat_detail_secondary_repeat.jpg) left top repeat-y; }
		
	table#detail_secondary th {
		font-size: 1.166em;
		font-weight: normal;
		text-align: right;
		padding-left: 20px; }
		
	table#detail_secondary td {
		font-size: 1.333em;
		font-weight: bold;
		padding-left: 10px; }
		
	table#detail_secondary tr.first td {
		padding-top: 10px; }
		
	table#detail_secondary tr.first span {
		font-size: 0.8125em;
		font-weight: normal; }
		
	table#detail_secondary tr.last td {
		padding-bottom: 10px; }
