/*		catalog.css		*/


/*
h1 = site title
h2 = page title
h3 = page section (footer title); artist name
h4 = album titles
h5 = sections within album description
*/


/*==============================
	Catalog Detail Pages
================================*/
div#contentwrapper
{
	clear: left;
	min-height: 375px;
	margin-top: 15px;
}
* html div#contentwrapper
{
	height: 375px;
}
body.CatalogIndex div#contentwrapper,
body.CatalogCategories div#contentwrapper
{
	width: 100%;
}
body.CatalogArtist div#contentwrapper
{
	width: 760px;
	margin-left: auto;
	margin-right: auto;
}
/*------------------------------
		artist
------------------------------*/
#artistblock
{
	float: left;
	width: 197px;	/* 10 + 1 + 175 + 1 + 10 */
	margin-bottom: 15px;
	padding: 10px;
	border: 1px solid #800000; 	/* Maroon */
	background-color: #EE8800;
}
#artistblock h1
{
/*
	text-align: center;
*/
	color: #800000; 	/* Maroon */
}
#artistblock img
{
	display: block;
	xwidth: 175px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1em;
	border: 1px solid black;
	text-align: center;
}
#artistblock p
{
	margin-bottom: .6em;
	line-height: 1.3em;
	font-size: 95%;
}
div#ArtistURL
{
	font-size: small;
}

/*------------------------------
		On this page
------------------------------*/
div.onThisPage
{
	margin-bottom: 15px;
}
div.onThisPage h3
{
	margin: 0;
	font-size: normal;
	color: teal;
}
div.onThisPage ul
{
	margin: 0;
	padding-left: 1em;
	font-size: small;
}
/*------------------------------
		see also
------------------------------*/
div.seeAlso
{
	margin-bottom: 15px;
}
div.seeAlso h3
{
	margin: 0;
	font-size: normal;
	color: teal;
}
div.seeAlso ul
{
	margin: 0;
	padding-left: 1em;
	font-size: small;
}

/*------------------------------
		titles
------------------------------*/
div#titlesblock
{
	float: left;
	width: 520px;		/* 760 - 197 - 10 */
	padding-left: 20px;
}

div.titleblock
{
	clear: right;
	margin-bottom: 15px;
}
div.titleblock img.cover
{
	float: right;
	width: auto;	/*150px;*/
	margin-bottom: 1ex;
	margin-left: 1em;
	border: 1px solid black;
}
div.albumtitle
{
	float: left;
	width: 340px;
	margin-bottom: 3px;
	padding: 3px 5px 5px 5px;
	font-style: italic;
	background-color: teal;
	color: #FFF;
}
div.albumtitle h4 /* title */
{
	margin: 0;
	font-size: x-large;
	color: #FFF;
}
div.albumtitle h5.subtitle
{
	margin: 0;
	font-size: large;
	color: #FFF;
}
div.albumtitle h5.translation
{
	margin: 0;
	font-size: large;
	font-style: italic;
	color: #FFF;
}
div.titleblock h5	/* section title */
{
	margin-top: .4em;
	color: teal;
}
div.titleblock span.availability
{
	xpadding: 0 3px 1px 3px;
	xborder: 1px solid teal;
/*
	text-transform: uppercase;
*/
	font-variant: small-caps;
	xbackground-color: #1FB;
	color: Teal;
}
div.titleblock p
{
	line-height: 1.3em;
	font-size: 95%;
}
div.titleblock .workstats
{
	clear: left;
	margin-bottom: 1ex;
}
div.titleblock .workstats p
{
	margin-bottom: 0;
	font-size: 80%;
}
div.titleblock ul.tracks
{
	list-style-type: none;
}
div.titleblock ul.tracks li
{
	clear: left;
	line-height: 1.3em;
	font-size: small;
}
div.titleblock ul.tracks li span.marker
{
	display: block;
	float: left;
	clear: left;
	width: 2em;
	height: 1.4em;
	padding-right: 1ex;
	text-align: right;
}
div.titleblock ul.tracks li span.subhead
{
	line-height: 1.5;
	margin-left: -1em;
	font-size: large;
	xfont-weight: bold;	
}
div.titleblock ul.tracks li span.title
{
	font-weight: bold;	
}
div.titleblock ul.tracks li a.listen
{
	padding: 1px 3px 1px 18px;
	padding-bottom: 1px;
	background: url("../Images/iconSpeaker.gif") left center no-repeat;
	text-decoration: none;
	xbackground-color: #CCC;
	font-variant: small-caps;
	text-decoration: none;
	xborder: 1px outset #000;
	xborder-left: 18px solid #FFF;
	border-bottom: 1px solid bisque;
}
div.titleblock ul.tracks li a.listen:hover
{
	xpadding-bottom: 0;
	border-bottom: 1px dotted teal;
	color: teal;
}
div.titleblock ul.tracks li a img
{
	height: 1.1em;
	border: none;
}
div.titleblock ul.tracks span.time
{
	font-size: smaller;
}

dl.tracks
{
	font-size: small;
}
dl.tracks dt
{
	float: left;
	clear: left;
	width: 1em;
	line-height: 1.3em;
}
dl.tracks dd
{
	float: left;
	margin-left: 1em;
	line-height: 1.3em;
/*
	background-color: Yellow;
*/
}
dl.tracks dd span.title
{
	font-weight: bold;	
}
dl.tracks dd span.subhead
{
	margin: 0;
	padding: 0;
	font-size: larger;
	xfont-weight: bold;	
}
dl.tracks dd a
{
	background-image: url("../Images/iconSpeaker.gif");
	background-repeat: no-repeat;
	background-position: right top;
	text-decoration: none;
}
dl.tracks dd a:hover
{
	xtext-decoration: underline;
	color: Teal;
}
dl.tracks dd a span
{
	padding-right: 18px;
}
h5 span
{
	font-size: small;
}

br
{
	clear: left;
	font-size: 1px;
}


.ArtistDescription
{
	margin-bottom: 0.6em;
}
.DescriptionCategory
{
	margin-top: .4em;
}
.DescriptionCategoryHead
{
}
a.button img
{
	border: 1px transparent;
}

/*==============================
Catalog Detail Page Navigation Menu
================================*/
/*
<div id="CatalogNav"
	><ul
		><li><a id="prev" href="Anzanga.asp"><span>Previous</span></a></li
		><li><a id="index" href="../index.asp"><span>Index</span></a></li
		><li><a id="order" href="../HowToOrder.asp"><span>Order Form</span></a></li
		><li><a id="next" href="Azumah.asp"><span>Next</span></a></li
	></ul>
	<div class="clearboth">&nbsp;</div>
</div>
*/
.CatalogNav
{
	clear: both;
	width: 100%;
	height: 14px;

	position: relative;
	margin: 10px 0px 10px 0px;
	padding: 0px;
	text-align: center;
	/* border: 1px solid rgb(255,255,192);		/* bisque */
}
.CatalogNav ul
{
	display: block;
	width: 674px;	/* (118 * 4 = 472) + (20 * 8 = 160) = 632 */
	margin: 0 auto;
	list-style: none;
}
.CatalogNav li
{
	display: block;
	float: left;
	width: 118px;
	margin: 0 20px;
}
.CatalogNav a
{
	display: block;
	text-decoration: none;
	width: 118px;
	height: 14px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	border: none;
}

.CatalogNav a.prev
{
	background-image: url("../Images/CatalogPageNavPrevious.gif");
}
.CatalogNav a.index
{
	background-image: url("../Images/CatalogPageNavIndex.gif");
}
.CatalogNav a.order
{
	background-image: url("../Images/CatalogPageNavOrderForm.gif");

}
.CatalogNav a.next
{
	background-image: url("../Images/CatalogPageNavNext.gif");
}
.CatalogNav a:hover
{
	background-position: 0px -28px;
}
.CatalogNav span
{
	display: none;
}


.clearboth
{
	clear: both;
	height: 0.001px;
	font-size: 0.001px;
}
#contentwrapper td
{
	text-align: left;
}

/*==============================
Detail Menu
==============================*/
div.DetailMenu
{
	float: left;
	max-width: 70%;
/*
*/
	margin: 25px 0 3em 15px;
/*
	border: 1px dashed red;
	background-color: yellow;
*/
}
div.DetailMenu h1
{
	margin: 0;
	padding: 0;
	font-size: x-large;
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
	color: rgb(0,88,89);		/* dark blue */
}
div.DetailMenu ul
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
div.DetailMenu ul ul
{
	list-style-type: square;
}

div.DetailMenu ul ul li
{
	margin: 0 3px 0 1em;
}
div.DetailMenu ul li
{
	font-size: small;
	font-family: Verdana, Trebuchet MS, Arial, sans-serif !important;
}
div.DetailMenu ul li a
{
	display: block;
	padding: 0 .5ex;
	border: 1px solid rgb(255,255,192);			/* bisque */ 
	text-decoration: none;
}

div.DetailMenu ul li.subcat
{
	padding: 0;
	font-size: 100%;
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif !important;
	color: rgb(5,147,157);	/* light blue */
}

div.DetailMenu ul li ul li
{
	font-size: 90%;
	font-family: Verdana, Trebuchet MS, Arial, sans-serif !important;
}
div.DetailMenu ul li ul li a
{
	margin: 0;
	text-decoration: none;
	color: rgb(0,88,89);		/* dark blue */
}
div.DetailMenu ul li a:hover
{
	border-color: brown;
	background-color: yellow;
	color: brown;
}
/*
div.DetailMenu ul li a:hover span.title
{
	background-color: orange;
}
*/
div.DetailMenu ul li a:hover span.by
{
}

div.DetailMenu li span.title
{
	font-weight: bold;
	font-style: italic;
}

br
{
	clear: both;
}





/*==============================
	Logo Bar
================================*/
div#logobar h2 a,
xdiv#logobarOLD div#pagetitle h2
{
	background-image: url("../Images/PageTitleCatalog.jpg");
}


/*==============================
	Catalog Menu
================================*/
#catalogmenu
{
	float: left;
	/* min-width: 262px; */
	margin: 25px 25px 0 15px;
	background-color: rgb(255,255,192);		/* bisque */ 
	font-size: 100%;
}
#catalogmenu h6
{
	margin: 0 3px;
	padding: 0;
	font-size: 120%;
	font-weight: normal;
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
	color: rgb(0,88,89);		/* dark blue */
}
#catalogmenu ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 100%;
}
#catalogmenu li#Menu1OrderForm
{
	margin-top: 1em;
}
#catalogmenu acronym
{
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
}
#catalogmenu li a
{
	margin: 0 3px;
	padding: 0px 3px;
	text-decoration: none;
	border: none;
	/* color: orange;			/* rgb(255,179,64);		/* orange */
	color: rgb(0,88,89);		/* dark blue */
	font-size: large;
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
}
#catalogmenu li a:hover
{
	/* color: rgb(5,147,157);	/* light blue */
	/* color: rgb(255,179,64);		/* orange */
	color: #FF8C00;			/* darkorange */
}
/*
#catalogmenu li.selected a,
#catalogmenu li.selected a:active,
#catalogmenu li.selected a:hover
{
	color: rgb(0,88,89);		/* dark blue * /
	cursor: default;
}
*/
body.CatalogBooks #catalogmenu li.CatalogBooks a,
body.CatalogClothing #catalogmenu li.CatalogClothing a,
body.CatalogFilms #catalogmenu li.CatalogFilms a,
body.CatalogInstruments #catalogmenu li.CatalogInstruments a,
body.CatalogMagazines #catalogmenu li.CatalogMagazines a,
body.CatalogMusic #catalogmenu li.CatalogMusic a,
body.CatalogPosters #catalogmenu li.CatalogPosters a,
body.CatalogSoftware #catalogmenu li.CatalogSoftware a,
body.CatalogToys #catalogmenu li.CatalogToys a,
body.CatalogTea #catalogmenu li.CatalogTea a
{
	/* color: rgb(0,88,89);		/* dark blue */
	color: #FF8C00;			/* darkorange */
	cursor: default;

}
body.CatalogBooks #catalogmenu li.CatalogBooks li a,
body.CatalogClothing #catalogmenu li.CatalogClothing li a,
body.CatalogFilms #catalogmenu li.CatalogFilms li a,
body.CatalogInstruments #catalogmenu li.CatalogInstruments li a,
body.CatalogMagazines #catalogmenu li.CatalogMagazines li a,
body.CatalogMusic #catalogmenu li.CatalogMusic li a,
body.CatalogPosters #catalogmenu li.CatalogPosters li a,
body.CatalogSoftware #catalogmenu li.CatalogSoftware li a,
body.CatalogToys #catalogmenu li.CatalogToys li a,
body.CatalogTea #catalogmenu li.CatalogTea li a
{
	cursor: pointer;
	/* word-spacing: 1em; */
}
#catalogmenu li ul
{
	display: none;
}
body.CatalogBooks #catalogmenu li.CatalogBooks ul,
body.CatalogClothing #catalogmenu li.CatalogClothing ul,
body.CatalogFilms #catalogmenu li.CatalogFilms ul,
body.CatalogInstruments #catalogmenu li.CatalogInstruments ul,
body.CatalogMagazines #catalogmenu li.CatalogMagazines ul,
body.CatalogMusic #catalogmenu li.CatalogMusic ul,
body.CatalogPosters #catalogmenu li.CatalogPosters ul,
body.CatalogSoftware #catalogmenu li.CatalogSoftware ul,
body.CatalogToys #catalogmenu li.CatalogToys ul,
body.CatalogTea #catalogmenu li.CatalogTea ul
{
	display: block;
}
#catalogmenu li li a
{
	margin: 0 3px;
	padding: 0px 3px 0 2em;
	text-decoration: none;
	/* color: orange;			/* rgb(255,179,64);		/* orange */
	color: #05949D !important;				/* light blue */
	font-size: small;
	xfont-family: Verdana, Arial, sans-serif;
	cursor: hand !important;
}
#catalogmenu li li a:hover
{
	/* color: rgb(255,179,64) !important;			/* orange */
	color: #FF8C00 !important;		/* darkorange */
}

/*==============================
	Catalog - How to Order
================================*/
body#CatalogHowToOrder div#logobar h2 a
{
	background-image: url("../Images/PageTitleCatalogHowToOrder.jpg");
}
body#CatalogHowToOrder ol,
body#CatalogHowToOrder ul
{
	margin: 0;
	margin-left: 3em;
	padding: 0;
}
body#CatalogHowToOrder li
{
	margin-bottom: 1em;
}
body#CatalogHowToOrder ul#currencies li
{
	margin: 0;
	font-size: small;
}
body#CatalogHowToOrder ul#extracosts
{
	list-style-type: none;
}
body#CatalogHowToOrder h1
{
	font-size: 150%;
	font-weight: normal;
	text-align: left;
}
body#CatalogHowToOrder #vacation
{
	display: none;
	width: 20em;
	margin: 1em;
	padding: 1em;
	border: 1px solid brown;
	background-color: bisque;
	color: brown;
}
body#CatalogHowToOrder #vacation p
{
	margin-bottom: -0.6em;
}

/*------------------------------
performer & track pages
------------------------------*/
body.CatalogPerformer ul,
body.CatalogTrack ul
{
	margin-left: 3em;
	font-size: small;
}
body.CatalogPerformer .CatalogNav a.prev,
body.CatalogPerformer .CatalogNav a.next,
body.CatalogTrack .CatalogNav a.prev,
body.CatalogTrack .CatalogNav a.next
{
	visibility: hidden;
}
body.CatalogPerformer li,
body.CatalogTrack li
{
	padding-top: 1ex;
}
body.CatalogPerformer li li  li,
body.CatalogTrack li li  li
{
	padding-top: 0;
}


/*------------------------------
catalog nav menu
------------------------------*/
#navMenu *
{
	font-size: small;
	font-family: Lithograph, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
}
#navMenu h3
{
	float: left;
	margin: 1ex 0 1ex 1ex;
	padding: .3ex 0;
	color: rgb(0,88,89);		/* dark blue */
}
#navMenu li
{
	float: left;
	margin: 1ex;
	list-style-type: none;
}
#navMenu li a
{
	display: block;
	padding: .3ex 1em;
	border: 1px solid rgb(0,88,89);		/* dark blue */
	text-decoration: none;
	xbackground-color: rgb(0,88,89);		/* dark blue */
	color: #05949D;		/* light blue */
}
#navMenu li a:hover
{
	border: 1px solid rgb(0,88,89);		/* dark blue */
	xbackground-color: #05949D;		/* light blue */
	xcolor: rgb(0,88,89);		/* dark blue */
	background-color: rgb(0,88,89);		/* dark blue */
	color: #05949D;		/* light blue */
}

body.CatalogIndex li#navCat a,
body.CatalogCategories li#navCat a,
body.CatalogIndexArtists li#navArtist a,
body.CatalogIndexSongs li#navSong a,
body.CatalogIndexPerformers li#navPerformer a
{
	border: 1px solid rgb(0,88,89);		/* dark blue */
	background-color: #05949D;		/* light blue */
	color: rgb(0,88,89);		/* dark blue */
	cursor: default;
}

/*------------------------------
initial index
------------------------------*/
#initialIndex h4
{
	font-family: Lithograph, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
	color: #05949D;		/* light blue */
}
#initialIndex ul
{
	margin: 0 auto;
}
#initialIndex li
{
	float: left;
	margin: 0;
	list-style-type: none;
	border-collapse: collapse;
}
#initialIndex li.reset
{
	clear: left;
}
#initialIndex li a
{
	display: block;
	width: 1em;
	padding: .3ex 1em;
	border: 1px solid rgb(0,88,89);		/* dark blue */
	font-family: Lithograph, Lithos, Austere, Krypta, Liddie, Liste, Listium, Literat, Lithographic Script, Litschi, Tribeca, Trebuchet MS, sans-serif;
	xbackground-color: rgb(0,88,89);		/* dark blue */
	color: #05949D;		/* light blue */
}
#initialIndex li a:hover
{
	border: 1px solid rgb(0,88,89);		/* dark blue */
	background-color: rgb(0,88,89);		/* dark blue */
	color: #05949D;		/* light blue */
}
#initialIndex li.selected a
{
	background-color: #05949D;		/* light blue */
	color: rgb(0,88,89);		/* dark blue */
	cursor: default;
}

/*------------------------------
track index
------------------------------*/
.CatalogIndexSongs #contentwrapper h5
{
	clear: left;
	padding-top: 1ex;
}
#trackIndex
{
	clear: left;
	float: left;
	xwidth: 64em;
	margin: 0 auto 2.5em auto;
	padding: 1em 0;
}
#trackIndex li
{
	overflow: hidden;
	white-space: nowrap;
	xposition: relative;
	width: 33%;
	width: 15em;
	margin-right: 1em;
	margin-left: 1em;
	xpadding-left: 2em;
	line-height: 1.2em;
	list-style-type: none;
	background-color: rgb(255,255,192);			/* bisque */ 
}
#trackIndex li.col1 { margin-left: 0em; }
#trackIndex li.col2 { margin-left: 16em; }
#trackIndex li.col3 { margin-left: 32em; }
#trackIndex li.col4 { margin-left: 48em; }
#trackIndex li.col5 { margin-left: 64em; }

#trackIndex li a
{
	xdisplay: block;
	margin: 0;
	padding: 0;
	xborder: 1px solid bisque;
	border: none;
}
#trackIndex li a:hover
{
	xborder-color: brown !important;
	background-color: yellow;
	color: brown;
	background-color: rgb(0,88,89);		/* dark blue */
	color: #05949D;		/* light blue */
	font-weight: bold;
	xbackground-color: #05949D;		/* light blue */
	xcolor: rgb(0,88,89);		/* dark blue */
}

#pagefooter
{
	clear: left;
	margin-top: 10em;
}

/*==============================
Song - copyright details
================================*/
table.copyright
{
	width: 760px;
	margin: .25em 0 1em 0;
	border: 1px solid rgb(0,88,89);
	border-collapse: collapse;
}
table.copyright td,
table.copyright th
{
	padding: .25em .6em;
	vertical-align: top;
}
table.copyright th
{
	text-align: right;
	white-space: nowrap;
}
div#contentwrapper table.copyright tfoot td
{
	font-size: .9em;
	border-top: 1px solid rgb(0,88,89);
	text-align: center;
	background-color: #E0E0E0;
}
div#contentwrapper table.copyright thead td
{
	border-bottom: 1px solid rgb(0,88,89);
	text-align: center;
	background-color: #E0E0E0;
}

/*==============================
sample pages
================================*/
a.sample-page
{
	border: none;
	text-decoration: none;
}
a.sample-page img
{
	padding: 1px;
	border: 1px solid #000;
}
a.sample-page:hover img
{
	padding: 0;
	border: 2px solid #00F;
}
