* {
  margin:0px;
  padding:0px;
}

body {
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:9pt;
  color:#bbb;
  background-image:url(images/bg_tile.jpg);
  background-repeat:repeat-x;
  background-color:#181818;
  background-position:top center;
  background-attachment:fixed;
}

a {
  color:#CC0000;
  text-decoration:none;
}

a:hover {
  text-decoration:underline;
}

img {
  border:none;
}

td {
	font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
}

th {
	font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
}

th a{
  color:#666;
  text-decoration:underline;
}

th a:hover{
  color:#060;
}

hr {
  color:#ccc;
  background-color:#ccc;
  height:1px;
  margin:4px 0px 4px 0px;
  border:none;
}

h1 {
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:14pt;
  color:#ccc;
  margin-bottom:10px;
}

h2 {
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:12pt;
  color:#ccc;
  margin-bottom:10px;
}

h3 {
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:10pt;
  color:#ccc;
  margin-bottom:10px;
}

h4 {
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:10pt;
  color:#ccc;
  margin-bottom:10px;
}

ul 
{
    list-style:none;
}

/*
#wrapper {
  margin-left:auto;
  margin-right:auto;
  margin-top:5px;
  margin-bottom:10px;
  text-align:left;
  position: relative;
  background-color:#181818;
  border:solid 1px #333;
}
*/

.container {
  background-color:#181818;
}

.top_bar {
  background-color:#181818;
  width:100%;
  border-bottom:1px solid #666;
  float:left;
}

.top_bar ul {
	margin:0 !important;
}

.top_bar li {
	display:inline;
	padding:10px 10px !important;
	border-right:1px solid #666;
	margin:0 !important;
	line-height:38px;
}

.top_bar li.last {
	border-right:none;
}

.logo_bar {
  background-color:#181818;
  border-bottom:1px solid #666;
  width:100%;
  float:left;
  padding:5px 10px;
}

.cover {
  max-width:100%;
}

#logo img {
  max-width:100%;
}

#searchbar {
	margin-top:15px;
}

#social {
	width:20px;
	margin-top:20px;	
}

#topbar {
  clear:both;
  height:21px;
  background:url(images/div_bar.jpg);
  margin-bottom:5px;
  width:100%;
}

/* tablets/desktops and up ----------- */
@media (min-width: 992px) {

#navbarNav {
  font-size:16px;
  font-weight:bold;  
}

.nav-item {
	padding-left:0.65em;
	padding-right:0.65em;
}

}


#leftnavwrapper {  
  width:98%;
}

#leftnav {  
}

#leftnav ul
{
  border:solid 1px #333;
  margin-bottom:5px;
  background-color:#202020;      
}

.categoryhead {
  list-style:none;
  font-size:15px;
  padding:4px;  
  color:#ddd;
  font-weight:bold;
}

.subcategoryhead {
  list-style:none;
  background-image:url(images/subcat_bg.jpg);
  font-size:11pt;
  padding:4px;  
  color:#ddd;
  font-weight:bold;
}

.subcategoryhead a {
  color:#ccc;
  text-decoration: none;
}

.subcategoryhead a:hover {
  text-decoration: underline;
}
.category {
  list-style:none;
  margin:3px 5px 3px 5px;
  font-size:14px;  
  padding-bottom:3px;
}

.category a {
  color:#ccc;
  text-decoration: none;
}

.category a:hover {
  text-decoration: underline;
}

#maincontent {
  float:right;
  padding-left:5px;
/*  border:solid 1px #FF0000;*/
}

#content {
  /*float:left;*/
}

#listingcontent
{
}

#pagecontent {
  margin-bottom:5px;
  padding:8px 8px 21px 8px;
  border:solid 1px #333;
  background-color:#1d1d1d;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;
}

#pagecontent p
{
  font-size:9pt;
  line-height:1.4em;
  margin-bottom:10px;
  color:#ccc;
}

#glossarycontent {
  margin-bottom:5px;
  padding:8px 8px 21px 8px;
  border:solid 1px #333;
  background-color:#1d1d1d;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;
}

#glossarycontent h2
{
  display:inline;
}

#glossarycontent p
{
  font-size:9pt;
  line-height:1.4em;
  margin:10px 0px 10px 0px;;
  color:#ccc;
}

#glossarycontent p.subtitle
{
  font-size:9pt;
  line-height:1.4em;
  margin:5px 0px 5px 0px;;
  color:#ccc;
  display:inline;
}

#glossarycontent .alpha
{
  font-size:12pt;
  margin-bottom:10px;
  color:#ccc;
  border-bottom:solid 1px #333;
}

#breadcrumb 
{
  color:#666;
  border-bottom:solid 1px #333;
  padding:0px 8px 8px 8px;
  margin:5px 0px 10px 0px;
  font-size:9pt;
}

#breadcrumb a
{
  color:#999;
}

#welcome
{
  margin-bottom:5px;
  padding:8px; /*8px 21px 8px;*/
  border:solid 1px #333;
  background-color:#1d1d1d;    
  /*
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;
  */
}

#welcome p
{
  font-size:9pt;
  margin-bottom:12px;
  line-height:1.4em;
  color:#ccc;
}

#welcome img
{
  float:right;
  border:solid 1px #666;
  margin-left:10px;
  margin-right:4px;
}

/*
#blurb
{
  margin-bottom:5px;
  padding:8px 8px 21px 8px;
  border:solid 1px #333333;
  background-color:#1d1d1d;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;
}

#blurb p
{
  margin-bottom:10px;
  color:#CCCCCC;
}
*/

#featured {
  float:left;
  border:solid 1px #333;  
  padding:12px 12px 21px 12px;
  margin:0px 0px 5px 0px;  
  background-color:#1d1d1d;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;  
}

#featuredright {
  float:right;
  border:solid 1px #333;  
  padding:8px 8px 21px 8px;
  margin:0px 0px 5px 0px;  
  background-color:#1d1d1d;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;  
}

.prodfeatwrapper
{
  float:left;
  margin:0px 0px 20px 0px;
}

.prodfeatcover
{
  float:left;
}

.prodfeatcover img
{
  border:solid 1px #ccc;
}

.prodfeat
{
  float:right;
  margin-right:5px;
}

.prodfeat h3
{
  font-size:14pt;
  margin-bottom:10px;
}

.prodfeat p
{
  margin-bottom:6px;
  color:#bbb;
  font-size:9pt;
  line-height:1.4em;  
  margin-bottom:10px;
}

.prodfeat .artist
{
  font-size:8pt;
  color:#ccc;
}


.prodfeat .price
{
  font-size:11pt;
  font-weight:bold;
  color:#ccc;  
}


#news {
  float:left;
  border:solid 1px #333;  
  padding:8px; /*12px 12px 21px 12px;*/
  margin:0px 0px 5px 0px;  
  background-color:#1d1d1d; 
  /*
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;  
  */
}

.newswrapper {
  margin-bottom:12px;
}


/* for the paging controls */

.filterwrapper 
{
  float:left;
  padding:8px;
  font-size:8pt;
  border-top:solid 1px #333;
}

.filterwrapper h3
{
  margin-bottom:4px;
}

.pagingwrapper 
{
  float:left;
  padding:8px;
  font-size:8pt;
  border-top:solid 1px #333;
  border-bottom:solid 1px #333;
  margin-bottom:8px;
}

.sortwrapper
{
    float:left;
	vertical-align:middle;
}

.pagewrapper
{
    float:right;
    text-align:right;
}

.pagewrapper p
{
    line-height:1.4em;
}

.prodlistwrapper
{
  float:left;
  margin:0px 0px 8px 0px;
  border:solid 1px #333;
  padding:8px;
  background-color:#202020;
  background-image:url(images/price_bg.jpg);
  background-repeat:repeat-x;  
}

.prodlistcover
{
  float:left;
}

.prodlistcover img
{
  /*border:solid 1px #CCCCCC;*/
}

.prodlist
{
  float:right;
  padding-right:4px;
}

.prodlist h4
{
  font-size:14pt;
}

.prodlist h4 a
{
  color:#ccc;
}

.prodlist p
{
  margin-bottom:8px;
}

.prodlist p.blurb
{
  font-size:9pt;
  line-height:1.4em;
  margin-bottom:10px;
}

.prodlist .author
{
  font-size:9pt;
  color:#ccc;
}

.prodlist .price
{
  font-size:10pt;
  color:#ccc;
  font-weight:bold;
}

.prodlist .pricegbp
{
  font-size:8pt;
  color:#ccc;
  font-weight:bold;
}

.prodlist .save
{
  color:#c00;
  font-size:8pt;
  font-weight:normal;
}

.prodlist .type
{
  color:#aaa;
}


.gallerywrapper
{
  float:left;
  height:160px;
  margin:0px 8px 8px 0px;
  border:solid 1px #333;
  padding:8px;
  background-color:#202020;
  background-image:url(images/price_bg.jpg);
  background-repeat:repeat-x;  
}

.gallerycover
{
  float:left;
}

.gallerycover img
{
  /*border:solid 1px #CCCCCC;*/
}

.gallery
{
  float:right;
  padding-right:4px;
}

.gallery h4
{
  font-size:10pt;
}

.gallery h4 a
{
  color:#ccc;
}

.gallery p
{
  margin-bottom:8px;
}

.gallery .author
{
  font-size:8pt;
  color:#ccc;
}


#bottombar {
  clear:both;
  height:21px;
  width:100%;
  background:url(images/div_bar.jpg);
  margin:5px;
}

#footer{
  clear:both;
  font-size:7pt;
  height:50px;
  padding:5px;
  width:100%;
}

#footer a {
  color:#666;
  text-decoration:none;
}

#footer a:hover {
  text-decoration:underline;
}

.warning {
  color:#f30;
  text-decoration:none;
  font-weight:bold;  
}

.selecthilite
{
    background-color:#DCF0F7;
}

#help
{
    padding:5px;
    color:#999;
}

#help h3
{
    color:#999;
    margin-bottom:4px;
}

#help p
{
    margin:0px;
    padding:0px;
    line-height:1.4em;
}

#help ul
{
   list-style:disc inside;
}

#help ul li 
{
   list-style:disc inside;
   margin:4px 0px 4px 0px;
}

.produtils 
{
  float:left;
  display:inline;
  line-height:16px;
  margin:6px;
  margin-top:8px;
  vertical-align:middle;
}

.produtils img{ 
  vertical-align:middle;
  margin-right:4px;
}

#contactform 
{
}

#contactform td
{
  padding:8px;
}

#checkoutform 
{
}

#checkoutform td
{
  padding:4px;
}


/* product page */

#prodwrapper
{
  float:left;
  padding:5px;
}

#prodwrapper h1
{
  line-height:1.2em;
}

#prodwrapper .blurb
{
  clear:both;
  margin: 8px 0px 8px 0px;
  color:#bbb;
  font-size:9pt;
  overflow:auto;
  border:solid 1px #333;
  padding:8px;
}

#prodwrapper .blurb h3
{
  margin-bottom:16px;
}

#prodwrapper .blurb p
{
  margin-bottom:10px;
  line-height:1.4em;
}

#prodcover
{
  float:left;
  padding:0px 5px 5px 5px;
}

#prodcover img
{
  /*border:solid 1px #CCCCCC;*/
}

#prod
{
  float:right;
  font-size:10pt;
  color:#ccc;
}

#prod h1
{
  font-size:18pt;
}

#prod .subtitle
{
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:14pt;
  font-weight:bold;
}

#prod a
{
  text-decoration:underline;
}

#prod a:hover
{
  color:#c00;
}

#prod .info
{
  float:left;
  list-style-position:inside;
  list-style-type:disc;
  padding-bottom:12px;
  margin-bottom:12px;
  border-bottom:solid 1px #333;
}

#prod .info .metric
{
	font-size:8pt;
	color:#999;
}

#prod .info a
{
  color:#ccc;
}

#prod .info a:hover
{
  color:#900;
}

#prod .info li.header
{
  margin-bottom:8px;
  font-weight:bold;
  list-style:none;
  font-size:11pt;
}

#prod .links
{
  float:left;
  list-style:none;
  padding-bottom:12px;
  margin-bottom:12px;
  border-bottom:solid 1px #333;
}

#prod .links img
{
  margin-right:8px;
}

#prod .links a
{
  color:#ccc;
  text-decoration:none;
}

#prod .links a:hover
{
  color:#900;
  text-decoration:underline;
}

#prod p
{
  margin-bottom:10px;
}

#prod li
{
  margin-bottom:8px;
}

#prod .type
{
  color:#aaa;
}


#prodprice
{
  clear:both;  
}

#prodprice p
{
  margin:8px 0px 8px 0px;	
}

#prodprice .prices
{
  float:left;
  border:solid 1px #333;
  margin-bottom:10px;
  background-image:url(images/price_bg.jpg);
  background-repeat:repeat-x;
  background-color:#202020;
}

#prodprice .prices th
{
	padding:8px;
	text-align:left;
}

#prodprice .prices td
{
	padding:8px;
	border-top:solid 1px #333;
	border-collapse:collapse;
}

#prodprice .prices td.price
{
	font-size:12pt;
	font-weight:bold;
    color:#ccc;	
}

#prodprice .prices .pricegbp
{
	font-size:8pt;
    color:#999;	
	font-weight:normal;
}

#prodprice .prices td.avail
{
	font-size:8pt;
	color:#999;
}

#prodprice .prices .metric
{
	font-size:8pt;
	color:#999;
}


/* related prods */

.prodrel
{
  border:solid 1px #eee;
  padding:8px;
  float:left;
  margin-bottom:5px;
}

.prodrel h2
{
  font-size:10pt;
  margin-bottom:5px;
  color:#666666;
}

.prodrelwrapper
{
  float:left;
  height:110px;
  margin:0px 5px 10px 0px;
}


.prodrelcover
{
  float:left;
}

.prodrelcover img
{
  border:solid 1px #ccc;
}

.alsoprod
{
  width:145px;
  float:right;
}

.alsoprod h4
{
  font-size:8pt;
  font-weight:normal;
}

.alsoprod p
{
  margin-bottom:2px;
}

.alsoprod .price
{
  font-size:10pt;
  color:#c00;
  font-weight:bold;
}

.alsoprod .save
{
  color:#c00;
}

.alsoprod .type
{
  color:#aaa;
}

#empty
{
  margin-bottom:5px;
  padding:8px 8px 21px 8px;
  border:solid 1px #333;
  background-color:#202020;    
  background-image:url(images/pattern.gif);
  background-repeat:repeat-x;
  background-position:bottom;
}

#empty h1
{
  margin-bottom:4px;
  font-size:12pt;
  color:#060;
}

#empty h2
{
  margin-bottom:4px;
  font-size:10pt;
  color:#060;
}

#empty h3
{
  margin-bottom:4px;
  font-size:8pt;
  color:#060;
}

#empty p
{
  margin-bottom:10px;
  color:#ccc;
}

#empty ul
{
   list-style:disc inside;
}

#empty ul li 
{
   list-style:disc inside;
   margin:4px 0px 4px 0px;
}

#basketcontent
{
  border:dotted 1px #333;
}

#basketcontent .cover
{
  border:solid 1px #ccc;
}

#basketcontent th
{
  padding:6px;
  height:20px;
  background-color:#333;
}

#basketcontent td
{
  padding:6px;
}

#basketcontent a.title
{
  font-family:"Lucida Grande", Verdana, Tahoma, Arial, sans-serif;
  font-size:14pt;
  font-weight:bold;
  color:#ccc;
}

#basketcontent .artist
{
  font-size:8pt;
  color:#ccc;
}

#basketcontent hr {
  color:#333;
  background-color:#333;
  height:1px;
  margin:2px 0px 2px 0px;
  border:none;
}


#articles
{
  color:#ccc;	
}

#articles li
{
	margin-bottom:4px;
}

#articles li a
{
  color:#ccc;	
  font-size:10pt;
}

#articles li .date
{
  color:#900;	
}

#popular
{
  color:#ccc;	
}

#popular li
{
	margin-bottom:4px;
}

#popular li a
{
  color:#ccc;	
}

#popular li .all
{
  color:#900;	
}


@media only screen and (max-width: 800px) {
    
    /* Force table to not be like tables anymore */
	#no-more-tables table, 
	#no-more-tables thead, 
	#no-more-tables tbody, 
	#no-more-tables th, 
	#no-more-tables td, 
	#no-more-tables tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	#no-more-tables thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
 
	#no-more-tables tr { border: 1px solid #ccc; }
 
	#no-more-tables td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #333; 
		position: relative;
		padding-left: 50%; 
		white-space: normal;
		text-align:left;
	}
 
	#no-more-tables td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	} 

    /*
	Label the data
	*/
	#no-more-tables td:before { content: attr(data-title); }
}