/* Colors
light blue: #ace0f3
dark blue: #3dbfeb
light brown: #fed39f
dark brown: #945623
darker brown: #472910
*/

/***************************
General Styles
***************************/

body, html {
	margin: 0 0;
	padding: 0 0;
	background: #472910;
	font: .95em Geneva, Arial, Helvetica, sans-serif;
	text-align: center;
	}

body {
	min-width: 900px;
	}

* {
  outline: none;
}

#container{
	background: white url(/img/backgroundstars.jpg) top right no-repeat;
	color: #472910;
	margin: 0 auto;
	padding: 0 0 20px 15px;
	width: 900px;
	border-right: 1px solid black;
	border-left: 1px solid black;
	text-align: left;
	}

#float-end {
    height: 0;
	clear: both;
}

#content-pane {
}

img {
	border: 0;
	}

p {
	font-size: .90em;
	margin-right: 1em;
	}

h1{
	font-size: 1.5em;
	font-weight: bold;
	}

h2{
	font-size: 1.2em;
	}

h3{
	font-size: .90em;
	font-weight: bold;
	}

h4{
	font-weight: bold;
	}


/* Changed below to make links clearer.  I have no doubt there are better
   looking alternatives--I just wanted to make links stupidly obvious to the
   end user until a designer can come in behind me and make these actually look
   good.
a:link, a:visited, a:active {
color: #472901;
text-decoration: none;
}*/

a:link, a:visited, a:active {
color: #fd5419;
text-decoration: none;
font-size: .95em;
}

a:hover {
color: #fd5419;
text-decoration: underline;
}

a.button_link {
  color: black;
  text-decoration: none;
}

.button_link {
  border: 2px outset;
  background-color: #d1e8f6;
  font-size: 8pt;
  font-weight: bold;
  padding: 3px;
  padding-left: 6px;
  padding-right: 6px;
  margin: 8px 0px 8px 0px;
}

.button_link:hover {
  background-color: white;
  text-decoration: none;
}

.button_link:link { text-decoration: none; color: black; }
.button_link:visited { text-decoration: none; color: black; }
.button_link:active { text-decoration: none; color: black; border: 2px inset; }

form.form_link {
  display: inline;
}

.clearboth {
	clear: both;
	}

/************************************
Main Styles
************************************/

#main{
	float: right;
	width: 624px;
	padding: 0 7px 0 0;
	/*height: 100%;*/
	}


#cornernav{
	text-align: right;
	width: 615px;
	clear: both;
	padding: 0 0;
	margin-top: 10px;
	}

#cornernav ul{
	list-style: none;
	padding: 0;
	}

#cornernav li{
	padding-left: 8px;
	display: inline;
	font-size: 8pt;
	}

.tagline {
		}

#searchnav{
	display: block;
	/*float: left;*/
	margin: 0px 0px;
	height: 20px;
	line-height: 20px; /* centers text in nav bar, --rossi 9/29/08 */
	width: 610px;
	padding: 15px 0 20px 5px;
	}


#searchnav input#submit{
	float: left;
	padding: 0 15px 0 3px;
	border: 0;
	}

#searchnav input#q{
	margin: 0 0 0 5px;
	/* height: 13px; can't read text with height this short --rossi 9/29/08 */
	width: 335px;
	float: left;
	}

#searchnav p{
	float: left;
	padding: 0 0;
	margin: 2px 0 0 0;
	font-size: 1em;
	}

img.browse{
	margin: 0 0 0 2px;
	}

#mainnav_container{
	/*float: left;*/
	text-align: left;
	/*line-height: 32px;*/
	margin: 12px auto 0 auto;
	padding: 0;
	}

#mainnav{
	/*background: url(/img/mainnav.gif);*/
	margin: 0 auto;
	padding: 0;
	}

#mainnav a {
  margin: 0 3px;
}

#mainnav_container img {
  vertical-align: middle;
}

#mainnav a:link,
#mainnav a:visited,
#mainnav a:active,
#mainnav a:hover {
  text-decoration: none;
}

/*#checkout {
  height: 28px;
  width: 112px;
  padding: 0;
}*/

#checkout a:link,
#checkout a:visited,
#checkout a:active,
#checkout a:hover {
  text-decoration: none;
}

#checkout img,
#checkout a {
  margin: 0;
  padding: 0;
}

/*About Page Submenu*/

#subnav {
  float: right;
  border: 1px dashed #945623;
  margin: 0 15px 5px 5px;
	}

#subnav ul{
	list-style: none;
	margin-left: 4px;
	padding: 0 10px 0 4px;
	}

#subnav li{
	background: url(/img/tinystar.gif) top left no-repeat;
	padding-left: 20px;
	}


#mainbanner{
	/*float: left;*/
	clear: both;
	width: 615px;
	height: 75px;

	}

.textcenter{
	text-align: center;
	}
/************************************
Home Page Gallery Styles
************************************/
.thumbnail{
	float: left;
	width: 130px;
	height:170px;
	overflow: hidden;
	margin: 5px 5px;
	padding: 5px 5px;
	border: 1px dashed #945623;
	}

.thumbnail_hover {
	background-color: #ace0f3;
	}

.thumbnail .image {
  line-height: 80px;
  height: 80px;
  text-align: center;
}

.thumbnail img{
	vertical-align: middle;
	border: 1px solid black;
	}

.caption{
	text-align: center;
	margin-top: -10px;
	}

.caption p{
	margin: 0 0;
	padding: 0 0;
	color: #472910;
	}

.title{
	font-weight: bold;
	font-size: .85em;
	line-height: 1.2em;
	}

.artist{
	font-size: .80em;
	}

.title a:link, .artist a:link, .title a:visited, .artist a:visited, .title a:active, .artist a:active{
	color: #472910;
	text-decoration: none;
	}

.title a:hover, .artist a:hover{
	color: #472910;
	text-decoration: underline;
	}

.buynow{
	background: url(/img/tinycart.gif) 15% 50%  no-repeat;
	font-size: .80em;
	}

.buynow a:link, .buynow a:visited, .buynow a:active{
	color: #2b81be;
	text-decoration: none;
	}

.buynow a:hover{
	color: #2b81be;
	text-decoration: underline;
	}

/************************************
Sidebar Styles
************************************/

#sidebar{
	float: left;
	width: 250px;
	background-color: #fff;
	color: #472910;
	}

.cylogo{
	margin-bottom: 16px;
	}

#sidebar > img {
  margin: 0;
}

#sidebar_bkgnd{
  margin: 0;
  background: url(/img/sidebar_bkgnd.gif) top left repeat-y;
}

#sidebar ul{
	margin: -5px 0 0 0;
	padding: 0 0;
	list-style: none;
	}

#sidebar li.star{
	background: url(/img/littlestar.gif) 3% 110% no-repeat;
	padding: 12px 15px 0 30px;
	}

#sidebar li.note{
	padding: 2px 15px 5px 30px;
	font-size: .75em;
	color: #472910;
	}

#sidebar li a:link,
#sidebar li a:visited,
#sidebar li a:active {
  color: #472901;
  text-decoration: none;
}

#sidebar li a:hover {
  color: chocolate;
}

.banner{
	margin: 0 auto;
	text-align: center;
	font-size: .75em;
	}

.banner img{
	margin: 8px 0 0 0;
	}

#sidebar p{
	/*margin: 0 0;*/
	padding: 3px 8px 0 10px;
	}

#sidebar h3{
	margin: 0 0;
	padding: 8px 8px 0 10px;
	}

/*******************
Browse page styles
*******************/

#alphabet a{
	font-weight: bold;
	text-decoration: none;
	}

#results tr{
	border-bottom: 1px dashed #945623;
	}

#results td {
    padding: 4px 0 4px 20px;
    font-size: .85em;
    }

.browse_img{
	width: 60px;
	}

#results img{
	border: 1px solid black;
}


#results td a:hover{
	text-decoration: underline;
	}

table#pagination{
	width: 5in;
	margin-top: 15px;
	font-size: 1em;
	}

td#prev{
	float: right;
	}

td#next{
	float: left;
	}

table#results {
    width: 5in;
   }



/******************
FAQ page styles
******************/

.FAQSection {
  display: block;
  font-size: 10pt;
  font-weight: bold;
  margin: 0 0 10px 0;
  }

#faq_toc {

}

a.FAQLink {
  color: #472910;
  text-decoration: none;
  font-weight: normal;
  display: block;
  padding: 0 0 5px 30px;
  background: url(/img/littlestarwhitebkgnd.gif) top left no-repeat;
}

a.FAQSection{
	color: #472910;
	text-decoration: none;
	}

a:hover.FAQLink, a:hover.FAQSection {
  text-decoration: underline;
}

.FAQQuestion {
  display: block;
  font-weight: bold;
}

div.FAQQuestion {
  margin: 8px 0px;
}

.FAQAnswer {
  display: block;
}

/*******************
Store styles
*******************/
.store_artist_name{
  font-size: 1.3em;
  font-weight: bold;
  margin-bottom: .3em;
}

.store_album_title, .store_album_artist{
 font-size: .98em;
 font-weight: bold;
 margin-bottom: .3em;
}

.store_single_title, .store_single_artist{
 font-size: 1.2em;
 font-weight: bold;
 margin-bottom: .3em;
}

#artist_bio, #song_bio{
font-size: .95em;
}

#album_bio{
font-size: .75em;
}

.link {
 font-size: 10pt;
 padding-left: 15px;
 margin-bottom: 5px;
background: url(/img/icon_arrow.gif) 0% 50% no-repeat;
}

.link a{
text-decoration: none;
}

.action_preview {
font-size: .90em;
text-decoration: none;
background: url(/img/icon_listen.gif) top left no-repeat;
padding-left: 25px;
	}

/*Used on Single page*/
.action_buy {
font-size: .90em;
/*background: url(/img/icon_buy.gif) top left no-repeat;*/
}

.action_buy a:link, .action_buy a:visited, .action_buy a:active, .action_download a:link, .action_download a:visited, .action_download a:active{
color: #2b81be;
}

.action_download{
padding-left: 25px;
font-size: .90em;
}

.action_cart{
	font-size: .90em;
	padding-left: 25px;
}

.album_left_margin{
padding-left: 27px;
}

.album_link{
font-size: .90em;
text-decoration: none;
}

.album_link a:link, .album_link a:visited, .album_link a:active{
color: #2b81be;
}


table.purchased_album {
      width: 100%;
}

table.purchased_album td {
      padding: 5px;
}

.album_preview a{
background: url(/img/icon_listen.gif) top left no-repeat;
padding-left: 20px;
}

.work_artist img {
  vertical-align: middle;
}

table.store_album {
	margin: 10px 0 15px 0;
  	border: 1px dashed #ace0f3;
	width: 99%;
}

table.store_album td {
  font-size: .85em;
}

table.store_album tr:nth-child(odd) td {
  background-color: #fff;
}

table.store_album tr:nth-child(even) td {
  background-color: #d5ebf3;
}

.store_album_cover {
  margin: 0 1em .5em 0;
  border-width: 0px 2px 2px 0px;
  border-style: solid;
  border-color: gray;
}

/*******************
My Cytunes
*******************/
.work_artist, .work_title {
  line-height: 22px;
  font-size: .90em;
}

.work_artist{
margin-right: 15px;
}

.work_artist .title {
  font-size: .90em;
}


#hr{
border-bottom: 1px dashed #945623;
width: 99%;
}


/*******************
Instructions
******************/

.whatnext {
  border: 1px dashed #945623;
  font-size: .9em;
  padding: 5px;
  margin: 10px 0px 10px 0px;
}

.whatnext .title {
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 7px;
}

#redeem_gift_certificate {
  font-size: 0.8em;
}

#redeem_gift_certificate input {
  font-size: 0.9em;
}

/**********************************************************************
 *
 * The following are old, disorganized and crappy looking styles which
 * predate Elizabeth Hammond's much needed style intervention.  There
 * may still be some elements of the site that depend on these styles,
 * although efforts to phase these out are appreciated.
 */

table {
  border-collapse: collapse;
}


#content_pane {
  border: 1px solid #40bde9;
}


/*
textarea {
  border: 1px solid #40bde9;
}*/

.error {
  color: red;
  font-size: 10pt;
}

table.songs {
    border-spacing: 0;
    border-color: black;
    empty-cells: show;
    border: 2px solid black;
    width: 95%;
}

table.songs td {
  padding: 5px;
  font-size: 10pt;
  border-top: 1px solid #d1e8f6;
}

table.songs td.head {
  font-weight: bold;
  vertical-align: bottom;
  background-color: #d1e8f6;
  border-bottom: 2px solid black;
}

#topbar {
  padding: 10px;
  font-size: 8pt;
  background-color:#d1e8f6;
}

#topbar td {
  padding: 10px;
}

#navbar {
  margin: 10px 0px 10px 2in;
}

#search {
  margin: 10px 0px 10px 2in;
}

#navbar .item {
  font-size: 12pt;
  font-weight: bold;
  padding: 5px 25px 5px 25px;
  margin: 0px 10px 0px 10px;
  color: black;
  text-decoration: none;
  border: 1px solid #40bde9;
}

#navbar .item:hover {
  background-color: #d1e8f6;
}

#topbar a.title {
  font-size: 14pt;
  font-weight: bold;
  color: #8f5a00;
  text-decoration: none;
}

#page_pane {
  padding: 5px 20px 20px 20px;
  vertical-align: top;
}


.subpanel {
  margin: 3px;
  border: 1px solid #d1e8f6;
  padding: 5px;
}

.subpanel .title {
  font-size: 14pt;
  font-weight: bold;
  line-height: 2.0;
}

.info {
  background-color: #d1e8f6;
  border: 1px solid #40bde9;
  font-size: 8pt;
  padding: 5px;
  margin: 10px 0px 10px 0px;
}

.warn {
  background-color: yellow;
}

.info .title {
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 5px;
}



.reviewer_info {
  border: 1px solid #40bde9;
  background-color: #d1e8f6;
  font-size: 8pt;
  padding: 5px;
  margin: 10px 0px 10px 0px;
}

.reviewer_info .h {
  font-size: 10pt;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 5px;
}

a.thumbnail {
  height: 70px;
  line-height: 70px;
  width: 100%;
}

a.img {
  vertical-align: middle;
  align: left;
}

a.title {
  color: blue;
}

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

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



table.store {
}

table.store td {
  padding: 5px 5px 30px 0;
  width: 180px;
  vertical-align: top;
  text-align: center;
}

table.store td.artwork {
  width: 100px;
}



table.store .title {
  font-size: 10pt;
  font-weight: bold;
}

table.store a.title {
  color: #472910;
  text-decoration: none;
}

.developer {
  clear: both;
  color: black;
  background-color: lightgray;
  padding: 10px;
}



table.cart {
  width: 100%;
  border: 1px dashed #945623;
}

table.cart td {
  padding: 5px;
  font-size: 0.9em;
}

table.cart td.price {
  text-align: right;
}

td.credit {
  color: red;
}

table.cart td.total {
  font-weight: bold;
  text-align: right;
}

#wireframe td {
  border: 1px solid #40bde9;
  padding: 10px;
}