/* ############################################### */
/* CSS reset / base HTML elements */
/* ############################################### */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* ############################################### */
/* Defaults for base HTML elements (after reset) */
/* ############################################### */
body { background: #b2cce5; font: 0.8em "Trebuchet MS", Helvetica, Arial, sans-serif; color: #333; }
p { margin: 1.33em 0; }
ul { padding-left: 30px; margin: 0; list-style-type: disc; }
li { display: list-item }

/* globals */
.cellstring { text-align: left; }

/* ############################################### */
/* Main Panel, wrap the whole layout in a div to keep it narrow and centered */
/* ############################################### */
#container { font-size: 0.8em; width: 760px; margin: 0 auto; }
#wrapper { background: #b2cce5; }
#wrapper, .wrapper { width: 1000px; vertical-align: top; padding: 0; margin-left: auto; margin-right: auto; }

/* ############################################### */
/* Headers */
/* ############################################### */
.wrapcurveedge {width: 100%; height: 15px; background: #b2cce5; } 
#header {clear: both; background: #336699; }
h1.sitetitle { position: relative; font-size: 32px; padding: 0 0 0 9px; margin: 0 0 0 0; color: #ffffff; text-align: left; vertical-align: bottom; }

#titlediv { clear: both; background: #336699; }
img.logo { width: 240px; height: 165px; float: left; padding-left: 9px; vertical-align: bottom; }

.banneradwrappper { float: right; }
.bannerad { padding: 5px 0px 0px 0px; margin: 0 9px 0px 20px; }
.mottohead { padding: 7px 30px 12px 30px; margin: 10px 0 0 0; text-align: center; font-family: verdana,arial,helvetica,sans-serif; }
.mottoquote { color: #ffffff; font-style: italic; font-weight: bold; font-size: 10pt; }
.mottoauthor { color: #f0f0f0; font-style: normal; font-weight: normal; font-size: 8pt; }

h2.subheading { text-align: left; width: 100%; margin: 10px 0 10px 0; padding: 0px 0 3px 5px; font: bold 1.4em "Lucida Sans", sans-serif; color: #000000; border-bottom: 1px solid #c0c0c0; letter-spacing: 1px; }
h3.section { font-family: verdana,arial,helvetica,sans-serif; font-weight: bold; font-size: 14px; letter-spacing: 1px; margin: 10px 0 5px 0; clear: both;}
h4 { font-family:verdana,sans-serif; font-size:11pt; font-weight:bold; color: #666666; background: #f0f0f0; border-bottom: solid 1px  #c0c0c0; margin: 10px 0 5px 0; padding: 0 0 0 5px; }
h5 { font-family:sans-serif; font-size:10pt; font-weight:bold; }

.subtitle { font-size: .5em; text-align: center; }

.roundedcornr_hdr_box { background: #336699; }
.roundedcornr_hdr_top div { background: url(/img/roundedcornr_hdr_tl.gif) no-repeat top left; }
.roundedcornr_hdr_top { background: url(/img/roundedcornr_hdr_tr.gif) no-repeat top right; }
.roundedcornr_hdr_top div, .roundedcornr_hdr_top, .roundedcornr_hdr_bottom div, .roundedcornr_hdr_bottom { width: 100%; height: 15px; font-size: 1px; }
.roundedcornr_hdr_content { margin: 0; padding: 0; height: 165px; }

/* ############################################### */
/* Login bar (smaller text) )*/
/* ############################################### */
.login { z-index: 1; clear: both; height: 51px; text-align: left; background: #666666; vertical-align: middle; color: #ccccd9; font-family: arial, sans-serif; padding: 0px; margin: 0px; }
.logout { z-index: 1; text-align: left; background: #666666; color: #ccccd9; font-family: arial, sans-serif; padding: 10px 10px 10px 30px; margin: 0 0 0 0; clear: both; }
a.nav2login:link {color: #ffffff; text-decoration: underline; }
a.nav2login:visited {color: #ffffff; text-decoration: underline; }
a.nav2login:active {color: #ffffff; text-decoration: underline; }
a.nav2login:hover {color: #f60; text-decoration: underline; }

a.nav2loginwish:link {color: #CCFF66; text-decoration: underline; }
a.nav2loginwish:visited {color: #CCFF66; text-decoration: underline; }
a.nav2loginwish:active {color: #CCFF66; text-decoration: underline; }
a.nav2loginwish:hover {color: #99FF66; text-decoration: underline; }

.albumcarousel_itemtext { line-height:1.1; margin:3px; }
.albumcarousel_item { overflow: hidden; float: left; width: 188px; height: 188px; padding:5px; text-align: center; border: 1px dotted gray; margin: 5px; } 

/* ############################################### */
/* Toolbar */
/* ############################################### */
#toolbar {clear: both; padding: 0px 5px 0px 5px; text-align: center; }

/* ############################################### */
/* Main Content Area - (needs to be at least 680px due to charts but can be less on homepage)
/* ############################################### */
#allcontent { background: #ffffff; padding-top: 0px; width: 1000px; }
#main { clear: both; margin: 0px; }

#content { float: left; width: 650px; margin: 0; line-height: 1.8; vertical-align: top; padding: 0px 10px 0px 10px; }

/* flanks - need to be separate l&r 300px min */
#lflank { float: left; position: relative; width: 310px; vertical-align: top; line-height: 1.8; margin: 0 2px 0 2px; padding: 0 0 0 0; }
#rflank { float: right; text-align: center; position: relative; width: 310px; vertical-align: top; line-height: 1.8; margin: 0 2px 0 2px; padding: 1.33em 5px 0 5px; }

/* ############################################### */
/* Navigation Bar */ #B2D281
/* ############################################### */
#navbar {clear: both; background: #000000; position: relative; text-align: center; font-weight: bold; }
a.navbar:link {color: #ccccd9; text-decoration: none; }
a.navbar:visited {color: #ccccd9; text-decoration: none; }
a.navbar:active {color: #ccccd9; text-decoration: none; }
a.navbar:hover {color: #ffffff; text-decoration:none; }

.navadunit { z-index: 1; text-align: center; background: #90B557; padding: 5px 5px 5px 5px; margin: 0; border: 0; }


/* ############################################### */
/* Bulletin Board Navigation same style as above but renamed due to name clash */
/* ############################################### */
a.navbb:link {color: #ccccd9; text-decoration: none; }
a.navbb:visited {color: #ccccd9; text-decoration: none; }
a.navbb:active {color: #ccccd9; text-decoration: none; }
a.navbb:hover {color: #ffffff; text-decoration:none; }

/* ############################################### */
/* Tabbed primary navigation 					   */
/* ############################################### */
/* menu */
.menu { z-index: 500; background-color: #172322; } /* used to style background colour of surrounding HTML elements */
#menu { background-color: #172322; width: 970px; float: left; display: inline-block; margin: 0px; list-style: none; line-height: 25px; font-family: arial, sans-serif; font-size: 9pt; text-align: center; padding: 10px 0px 0px 30px; }
		
#menu a { float: left; background: url(/img/tableftH.gif) no-repeat left top; margin: 0px; padding: 0px 0px 0px 4px; text-decoration: none; }
#menu a span { float: left; display: block; background: url(/img/tabrightH.gif) no-repeat right top; margin: 0px; padding: 5px 9px 4px 7px; color: #fff; }	

#menu .menutab { z-index: 100; background: #172322 none repeat scroll 0 0; cursor: pointer; float: left; position: relative; padding: 5px 1px 0px 0px; } 
#menu .menutab a:hover { cursor: pointer; background-position: 0% -42px; } 
#menu a:hover span { cursor: pointer; background-position: 100% -42px; color: #ccccd9; }

/* selected tab */
#menu .menuselected { z-index: 400; background: #172322 none repeat scroll 0 0; cursor: pointer; float: left; position: relative; padding: 5px 1px 0px 0px; }  
#menu .menuselected { cursor: pointer; background-position: 0% -42px; } 
#menu .menuselected span { cursor: pointer; background-position: 100% -42px; color: #ccccd9; } 

/* inline search */
.searchContainer div { float: left; display: inline; background-color: #172322; margin: 0px; padding: 0px 0px 0px 5px; vertical-align: bottom; }
.searchContainer input[type="text"] { border: none; width: 125px; }
.searchContainer input[type="button"], .searchContainer input[type="submit"] { border: none; }
.searchContainer img { vertical-align: middle;}

/* sub-menus*/
#menu ul { z-index: 300; background-image: none; padding: 0px; margin: 0px; display: inline; background: none; } 
#menu li ul { text-align: left; position: absolute; left: 0px; top: 0px; margin-top: 32px; width: 180px; background-color: #172322; color: #ffffff; display: none; }
								
#menu li:hover ul { display: block; }
#menu li ul li { margin: 0px 0px 0px 0px; list-style-type: none; }
#menu li ul li a { line-height: 20px; width: 100%; background-image: none; padding: 5px 0px 5px 5px; color: #ffffff; border-top: dotted 1px #606060; } /* color of text in dropdown list */
#menu li ul li a:hover { line-height: 20px; background-image: none; padding: 5px 0px 5px 5px; color: #ccccd9; border-top: dotted 1px #606060; } /* hover-color of tab text in dropdown list */	

/* tabs on object and fav pages*/
#navset2 { margin: 10px 0px 10px 0px; float: left; width: 100%; background: #F4F7FB; font-size: 93%; line-height: normal; border-bottom: 1px solid #6699cc; }
#navset2 ul { margin: 0; padding: 10px 5px 0 20px; list-style: none; }
#navset2 li { display: inline; margin: 0; padding: 0; }
#navset2 a { float: left; background: url(/img/navset2tableft1.gif) no-repeat left top; margin: 0; padding: 0 0 0 4px; text-decoration:none; }
#navset2 a span { float:left; display: block; background: url(/img/navset2tabright1.gif) no-repeat right top; padding: 5px 15px 4px 6px; color: #6699cc; }

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#navset2 a span {float: none;}
/* End IE5-Mac hack */
#navset2 a:hover span { color: #6699cc; }
#navset2 a:hover { background-position: 0% -42px; }
#navset2 a:hover span { background-position: 100% -42px; }
#navset2 #current2 a { background-position: 0% -42px; }
#navset2 #current2 a span { background-position: 100% -42px; }

#navset2 #select { float: left; display: block; padding-right: 7px }

/* ############################################### */
/* Ads */
/* ############################################### */
.sqflankad { float: right; text-align: right; padding: 10px 5px 5px 5px; }
.topad { z-index: 1; clear: both; padding: 10px 5px 5px 5px; position: relative; text-align: center; } /* leaderboard ad */
.footerad { clear: both; padding: 50px; text-align: center; }

.flag { width: 32px; height: 32px; vertical-align: middle; }
.flagmini { width: 16px; height: 11px; }

/* ############################################### */
/* Album bar */
/* ############################################### */
#albumbar { padding: 0 5px 0 5px; margin: 5px 0 0 0;}
.tabalbumbar { float: left; }

.albumbarrounded_box { background: #e1e1e1; color: #000000; font-family: arial, sans-serif; line-height: 1.6; width: 140px; }
.albumbarrounded_top div { background: url(/img/roundedcornr_bar_tl.png) no-repeat top left; }
.albumbarrounded_bottom div { background: url(/img/roundedcornr_bar_bl.png) no-repeat bottom left; }
.albumbarrounded_top div, .albumbarrounded_bottom div { width: 100%; height: 10px; font-size: 1px; }
.albumbarrounded_content { padding: 0 0 0 10px; }

/* ######### Shade Tabs ######### */
.shadetabs{
padding: 3px 0;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 12px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
}

.shadetabs li{
display: inline;
margin: 0;
}

.shadetabs li a{
text-decoration: none;
position: relative;
z-index: 1;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid #778;
color: #2d2b2b;
background: white url(/img/shade.gif) top left repeat-x;
}

.shadetabs li a:visited{
color: #2d2b2b;
}

.shadetabs li a:hover{
text-decoration: underline;
color: #2d2b2b;
}

.shadetabs li a.selected{ /*selected main tab style */
position: relative;
top: 1px;
}

.shadetabs li a.selected{ /*selected main tab style */
background-image: url(/img/shadeactive.gif);
border-bottom-color: white;
}

.shadetabs li a.selected:hover{ /*selected main tab style */
text-decoration: none;}

/* ############################################### */
/* User Views */
/* ############################################### */
.views { margin-left: auto; margin-right: auto; width: 160px; border: 1px solid #0000ff; }
.viewsheader { text-align: center; color: #ffffff; font-weight: bold; background: #369; }
.viewscell { text-align: center; }
.viewscellstring { text-align: left; }
.viewsrow { border-bottom: 1px dotted #c0c0c0; padding-bottom: 5px; text-align: center; }

/* ############################################### */
/* CAlbum */
/* ############################################### */
.album { background-color: #FDFEDA; }
.albumleft { background-color: #FDFEDA; }
.albumlight { background-color: #ffffff; }
.albumsep { border-top: 1px solid #0000ff; }
.albumheader { vertical-align: top; }

/* ############################################### */
/* Favourites */
/* ############################################### */
table.favtbl { width: 100%; }
.fav { background-color: #FDFEDA; text-align: center; }
.favlight { background-color: #ffffff; text-align: center; }
.favsep { text-align: left; border-bottom: 3px solid #c0c0c0; padding: 3px 3px 3px 3px;} 
.favlinks { background-color: #E3ECD5; }
.favlinks2 { background-color: #E3ECD5; }
.favcell { padding: 7px 7px 7px 7px; }
.favbar {width: 160px; border: 1px solid #0000ff; }
.favbarheader {text-align: center; color:#ffffff; font-weight: bold; background: #369; }
.favbarcell {text-align: left; }
.favbardiv {border-top: 1px dotted #c0c0c0; background-color: #c0c0c0; padding-bottom: 5px; text-align: center;}
.favheading {padding: 0px; font: bold 1.2em "Lucida Sans", "Lucida Sans Unicode", sans-serif; color: #000000; letter-spacing: 1px; }

.ajaxdiv { float: left; padding-left: 8px; font-size: 0.8em; width: 130px; }
.interactdiv { float: left; font-size: 0.8em; width: 130px; }

/* ############################################### */
/* Poll */
/* ############################################### */
.polltitle { color: #ffffff; font-weight: bold; background: #369; }
.pollborder { border: 1px solid #0000ff; }
.pollshaded { background-color: #E1E1E1;}

/* ############################################### */
/* Content Links */
/* ############################################### */
a.nav2:link {color: #0066CC; text-decoration: underline; }
a.nav2:visited {color: #0066CC; text-decoration: underline; }
a.nav2:active {color: #0066CC; text-decoration: underline; }
a.nav2:hover {color: #f60; text-decoration: underline; }

a.nav2emph:link {color: #0066CC; font-weight: bold; text-decoration: underline; }
a.nav2emph:visited {color: #0066CC; font-weight: bold; text-decoration: underline; }
a.nav2emph:active {color: #0066CC; font-weight: bold; text-decoration: underline; }
a.nav2emph:hover {color: #f60; font-weight: bold; text-decoration: underline; }


/* ############################################### */
/* Rank Links */
/* ############################################### */
a.rank:link {color: #000000; text-decoration: none; }
a.rank:visited {color: #000000; text-decoration: none; }
a.rank:active {color: #000000; text-decoration: none; }
a.rank:hover {color: #000000; text-decoration: underline; }

/* ############################################### */
/* Small Content Links */
/* ############################################### */
a.nav2sm:link {color: #0066CC; text-decoration: underline; font-size: 10px;  }
a.nav2sm:visited {color: #0066CC; text-decoration: underline; font-size: 10px; }
a.nav2sm:active {color: #0066CC; text-decoration: underline; font-size: 10px; }
a.nav2sm:hover {color: #f60; text-decoration: underline; font-size: 10px;  }

/* ############################################### */
/* Header (page title area) links    			   */
/* ############################################### */ 
a.navlogin:link {color: #ccccd9; font-weight: bold; text-decoration: underline; }
a.navlogin:visited {color: #ccccd9; font-weight: bold; text-decoration: underline; }
a.navlogin:active {color: #ccccd9; font-weight: bold; text-decoration: underline; }
a.navlogin:hover {color: #ffffff; font-weight: bold; text-decoration: underline; }

/* ############################################### */
/* RSS Link (smaller than top nav) )*/
/* ############################################### */
a.rssnav:link {color: #ffffff; text-decoration: none; font-size: 10px; font-family: arial, sans-serif; }
a.rssnav:visited {color: #ffffff; text-decoration: none; font-size: 10px; font-family: arial, sans-serif; }
a.rssnav:active {color: #ffffff; text-decoration: none; font-size: 10px; font-family: arial, sans-serif; }
a.rssnav:hover {color: #ffffff; text-decoration: underline; font-size: 10px; font-family: arial, sans-serif; }



/* ############################################### */
/* External Links (with icon) */
/* ############################################### */
a.external:link { background: url(/img/externalurl.jpg) no-repeat center right; padding: 0 20px 0 0; display: inline-block; }
a.external:visited { background: url(/img/externalurl.jpg) no-repeat center right; padding: 0 20px 0 0; display: inline-block; }
a.external:hover { color: red; background: url(/img/externalurl_hover.jpg) no-repeat center right; padding: 0 20px 0 0; display: inline-block; }

/* ############################################### */
/* Comments */
/* ############################################### */
.quotecon { clear: both; border-bottom: 1px dotted #c0c0c0; padding: 10px 0 15px; } /* div container */
.quote { padding: 0 0 0 35px; background: transparent url(/img/quote.gif) no-repeat; font-style: italic; }
.quoter { font-style: normal; font-size: 85% }
.qvotes { display: inline-block; padding-left: 35px; }

/* ############################################### */
/* Chart tables */
/* ############################################### */

#divscroll { width: 680px }

.chart { margin-left: auto; margin-right: auto; text-align: left; border-spacing: 0; font: 11px/14px arial, sans-serif; }
.charthead { background: #c0c0c0; color: #000000; padding: 3px; font-size: 10pt; font-weight: bold; border-right: 1px solid #c0c0c0; border-top: 1px solid #c0c0c0; }
.chartheadleft { border-left:  1px solid #d9d9d9; }
.chartheadtall { background: #c0c0c0; color: #000000; padding: 3px; font-size: 10pt; font-weight: bold; border-right: 1px solid #d9d9d9;  border-top: 1px solid #d9d9d9; }
.chartfoot { background: #c0c0c0; color: #000000; font-size: 10pt; font-weight: bold; border-right: 1px solid #d9d9d9; }
.chartrow  { vertical-align: top; background-color: #ffffff; }
.chartrow2 { vertical-align: top; background-color: #f1f5fa; }
.chartcell { border-bottom: 1px solid #c0c0c0; border-right: 1px solid #d9d9d9; padding: 5px; vertical-align: top; } /* chart cells all have this base class assigned */
.chartcellleft { border-left: 1px solid #d9d9d9; }
.chartcellbottom { border-bottom: 1px solid #c0c0c0; }
.chartcelltop { border-top: 1px solid #c0c0c0; }
.chartcellnobottom { border-right: 1px solid #d9d9d9; padding: 5px 5px 5px 5px; }
.chartcellnoborder { padding: 5px 5px 5px 5px; }
.chartcellnopadding { border-bottom: 1px solid #c0c0c0; border-right: 1px solid #d9d9d9; vertical-align: top; } /* chart cells all have this base class assigned */
.chartcellfeedback { background-color: #eae6e6; }
.chartcellfeedback2 { background-color: #ddd9d9; }

.medsep { border-bottom: 2px solid #c0c0c0; }
.thicksep { border-bottom: 1px solid #666666; }

 .wishlistpanel { background:#F8F8F8; margin:0px; padding: 5px; }
 .wishlistpanelro { margin:0px; padding: 5px; } 

.chartstat { font: 10px arial, helvetica, sans-serif; border: 1px; width: 100%; }
.chartstatcell { line-height: 0.3;  padding: 5px 5px 5px 5px; }
.chartstatdiv { padding: 5px 5px 10px 5px; }

.chartnumber { text-align: center; }
.chartstring { text-align: left; word-wrap: break-word; } 
.chartright  { text-align: right; }
.chartcenter { text-align: center; }
.chartad { text-align: center; line-height: 2; }
.radio { background-color: #FFFFCC; text-align: center; }
.imgpad { padding: 2px 2px 2px 2px; vertical-align: text-top; }
.highlight { background-color: #FFFF99;}
.dim { color: #c0c0c0; }

a.chartsort:link {color: #000000; font-weight: bold; text-decoration: none; }
a.chartsort:visited {color: #000000; font-weight: bold; text-decoration: none; }
a.chartsort:active {color: #000000; font-weight: bold; text-decoration: none; }
a.chartsort:hover {color: #000000; font-weight: bold; text-decoration: underline; }

.memberfeedbacktable { padding: 2px 2px 2px 2px; margin: 2px 2px 2px 2px; vertical-align: middle; font: 10px arial, helvetica, sans serif; }
.memberfeedbackbottom  { padding-bottom: 10px; }
/* ############################################### */
/* My Chart */
/* ############################################### */
#chartentries { clear: both; }
.ucbusy input[type="text"] { background: #ffff99; } 
.ucupdown { clear: both; float: left; width: 40px; padding: 2px 2px 2px 2px; text-align: center; }
.ucrank { text-align: center; float: left; width: 65px; padding: 2px 2px 2px 2px; }
.ucba { float: left; width: 180px; padding: 2px 2px 2px 2px; }
.uctxtba { width: 180px; }
.ucstatus { float: left; width: 45px; padding: 2px 2px 2px 2px; text-align: center; }
.uctxtan { width: 575px; height: 50px; }
.uctxtah { vertical-align: top; font-weight: bold; }
.ucrow { border-bottom: 1px dotted #666666; padding: 5px 2px 15px 2px; width: 630px; }

/* Filter page */
.filtercell { padding: 3px 3px 3px 3px; vertical-align: top; width: 75px; } 

/* ############################################### */
/* List of charts on the chart page */
/* ############################################### */
table.chartlist { width: 100%; border-style: solid; border-width: 1px; border-color: #c0c0c0; vertical-align: top; }
.chartlist thead { background: #90B557; ; color: #000000; font-weight: normal; }
.chartlist th { padding: 5px; text-align: left; }
.chartlist td { padding: 5px; }
.chartlistsh  { background: #c0c0c0; color: #000000; font-weight: normal; }
.chartlistad { text-align: center; vertical-align: top; }
.chartlistbuy { vertical-align: bottom; text-align: right; }
.chartlistbody { width: 350px; }

a.chartlist:link {color: #ffffff; text-decoration: underline; }
a.chartlist:visited {color: #ffffff; text-decoration: underline; }
a.chartlist:active {color: #ffffff; text-decoration: underline; }
a.chartlist:hover {color: #f60; text-decoration: underline; }

.chartlistalbum  { padding: 10px 10px 10px 10px; vertical-align: top; } 
#chartsdiv { text-align: center; }
.artwork { border:1px solid #ffffff; }

/* ############################################### */
/* Moderation lists
/* ############################################### */
.modrow { border-bottom: solid 1px #c0c0c0; }
.modtable { margin-left: 0; border: 1px solid #c0c0c0; border-spacing: 0; font: 11px/14px Verdana, Helvetica, Arial, sans-serif; }
table.modinlinetable td { padding: 3px; border: 1pt solid #C0C0C0; }
table.modinlinetable th { font-weight: bold; padding: 3px 3px 0 3px; border: 1pt solid #C0C0C0; }
.modlabelcol { width: 300px; }
.modpanel { background:#F5F5F5; }
.modpanelgreen { background:#CCFF99; }

/* ############################################### */
/* Object interaction panel */
/* ############################################### */
table.objectinteractionpanel { width: 100%; }
table.objectinteractionpanel td { padding: 3px; }

fieldset { border: 1px solid #c0c0c0; background: #ffffff; color: #000000; padding: 3px 3px 3px 3px; margin: 1.33em 0; }
legend { padding: 0.2em 0.5em; color: #ffffff; font-size: 90%; font-weight: bold; border: 1px solid #c0c0c0; background: #666666; }

/* ############################################### */
/* Render object */
/* ############################################### */
.objecttitle    { font-family: verdana,arial,helvetica,sans-serif; font-size: medium; }
.subobjecttitle { font-family: verdana,arial,helvetica,sans-serif; font-size: small; }
.smallerbody { font-size: 85%; }
.tinybody { font-size: 70%; }
.bigger { font-size: 1.2em; }

.buybox { width: 100%; margin: 10px; vertical-align: top; }
.buyboxheader { margin: 0px; padding: 0px; }
.buyboxcontent { border: 1px solid #3163CE; margin: 0px; }
.buypanel { width: 100%; }
.buypaneltitle { font-size: 1.2em; font-weight: bold; }
.buypanelartwork { vertical-align: top; width: 125px; margin: 0px; padding: 5px; }
.buypaneltext { text-align: left; vertical-align: top; margin: 0px; padding: 5px; width: 500px; }
.buypanelbuy { text-align: center; background: #f1f5fa; padding: 3px; } 
.eyebrow { font-family: verdana,arial,helvetica,sans-serif; font-size: 10px; font-weight: bold; text-transform: uppercase; text-decoration: none; color: #ffffff; }
.listprice { font-family: arial,verdana,sans-serif; text-decoration: line-through; font-size: small; }
.price { font-family: verdana,arial,helvetica,sans-serif; color: #990000; font-size: small; }
.buyprice { color:#990000; font-size:1.35em; font-weight:normal; letter-spacing:-1px; }

a.calltoaction:link {color: #008000; text-decoration: underline; font-size: 1.2em; font-weight: bold; }
a.calltoaction:visited {color: #008000; text-decoration: underline; font-size: 1.2em; font-weight: bold; }
a.calltoaction:active {color: #008000; text-decoration: underline; font-size: 1.2em; font-weight: bold; }
a.calltoaction:hover {color: #33CC33; text-decoration: underline; font-size: 1.2em;   }

a.calltoactionbody:link {color: #008000; text-decoration: underline; font-size: 1em; font-weight: bold; }
a.calltoactionbody:visited {color: #008000; text-decoration: underline; font-size: 1em; font-weight: bold; }
a.calltoactionbody:active {color: #008000; text-decoration: underline; font-size: 1em; font-weight: bold; }
a.calltoactionbody:hover {color: #33CC33; text-decoration: underline; font-size: 1em;   }

a.buycolumn:link {color: #0000FF; text-decoration: none; font-size: 1em; }
a.buycolumn:visited {color: #0000FF; text-decoration: none; font-size: 1em; }
a.buycolumn:active {color: #0000FF; text-decoration: none; font-size: 1em; }
a.buycolumn:hover {color: #0000FF; text-decoration: underline; font-size: 1em; }
	
/* Awards */
.awardcol1 { text-align: left; width: 100px; font-weight: bold; display: inline-block; vertical-align: top; }
.awardcol2 { text-align: left; width: 300px; }

.rank_box { background: #f7f273; }
.roundedcornr_rank_box { background: #f7f273; }
.roundedcornr_rank_top div { background: url(/img/roundedcornr_rank_tl.png) no-repeat top left; }
.roundedcornr_rank_top { background: url(/img/roundedcornr_rank_tr.png) no-repeat top right; }
.roundedcornr_rank_bottom div { background: url(/img/roundedcornr_rank_bl.png) no-repeat bottom left; }
.roundedcornr_rank_bottom { background: url(/img/roundedcornr_rank_br.png) no-repeat bottom right; }
.roundedcornr_rank_top div, .roundedcornr_rank_top, .roundedcornr_rank_bottom div, .roundedcornr_rank_bottom { width: 100%; height: 10px; font-size: 1px; }
.roundedcornr_rank_content { margin: 0 10px; }

.rankdesc { font-size: 12px; text-align: center; color: #000000; font-weight: bold; }
.rankobject { font-family: verdana,arial,helvetica,sans-serif; font-size: 10px; font-weight: bold; text-transform: uppercase; text-decoration: none; color: #666666; text-align: center; }
.ranklabel { font-family: verdana,arial,helvetica,sans-serif; font-size: 10px; text-decoration: none; color: #666666; text-align: left; }
.ranknumber { font-size: 30px; text-align: center; } 
.rankpaneltable { float: right; margin-left: 10px; text-align: right; }

/* ############################################### */
/* Add chart */
/* ############################################### */
.ajaxTitle    {}
.ajaxResult   { background: #f2f2f2; color: #000000; font-family: arial, sans-serif; line-height: 1.6; display: inline-block; width:620px; font-size: 12px; }
a.ajaxResult:link a.ajaxResult:visited a.ajaxResult:active { text-decoration: none; }
a.ajaxResult:hover { text-decoration: underline; }
.ajaxFooter   { background: #f8fafc url(/img/help.png) center no-repeat; background-position: 0px 50%; text-align: left; padding: 0px 0px 0px 20px; }
.ajaxNoMatch  { background: #fff6bf; text-align: left; padding: 0px 0px 0px 0px; display: inline-block; width:620px; }
ul.instructions { padding: 0 0 0 50px; margin: 0; }
.addrankenabled { text-decoration: none; color: #000000; }
.addrankdisabled { text-decoration: none; color: #c0c0c0; }

/* ############################################### */
/* iTunes RSS ads */
/* ############################################### */
a.itunesrss:link { text-decoration: none; }
a.itunesrss:visited { text-decoration: none; }
a.itunesrss:active { text-decoration: none; }
a.itunesrss:hover { text-decoration: underline; }

/* ############################################### */
/* Search */
/* ############################################### */
#divsearch { text-align: center; }
.searchbox { 
				background: #336699 url(/img/magnifier.png) center no-repeat;
				background-position: 15px 17px; border: 1px solid #666666;
				color: #ffffff; padding: 10px 10px 10px 35px;  
			}

#divsuggests {  visibility:hidden;
				background:#ffffff; font-size: 9pt; cursor: default; border: 1px solid black; 
				left: 0px; position: absolute; width: 350px; 
				margin: -1px 0 0 0; padding: 0 3px 0 0; 
			}

#divsuggests div, #divsuggests div a { background:#ffffff; background-image: none; clear:both; width:100%; text-align:left;}
#divsuggests div a:hover { background:#f0f0f0 !important; }
#divsuggests a { color: #0000ff; }

/* ############################################### */
/* Year stats nav */
/* ############################################### */
.yearstats td { padding: 5px 5px 5px 5px; }
.yslink { width: 40px; text-align: center; }
.nyd { color: #0066CC; text-align: center; font-weight: bold; }
.yearnav { overflow: hidden; float: left; width: 40px; }

/* ############################################### */
/* Pagination */
/* ############################################### */
div.pagination { padding: 3px; margin: 3px; text-align: center; font-size: 90%; line-height: 1.6; }
div.pagination a { padding: 2px 4px 2px 4px; margin: 2px; border: 1px solid #c0c0c0; text-decoration: none; color: #0066CC; font-weight: bold }
div.pagination a:hover, div.pagination a:active { border: 1px solid #c0c0c0; color: #f60; font-weight: bold }
div.pagination span.current { padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; border: 1px solid #c0c0c0; font-weight: bold; background-color: #000000; color: #ccccd9; }
div.pagination span.disabled { padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; border: 1px solid #c0c0c0; color: #c0c0c0; }
div.pagination input[type="button"] { border: none; }
div.pagination div.desc { margin: 10px; }

/* ############################################### */
/* Ratings */
/* ############################################### */
.starlabel { float: left; font-weight: bold; }
#star { display: table-cell; display: inline-block; white-space: nowrap; float: left; }
/*
#star ul.static { list-style: none; margin: 0; padding: 0; width: 80px; height: 20px; left: 0px; top: 0px; position: relative; float: left; background: url(/img/stars.gif) repeat-x; }
#star ul.interactive { list-style: none; margin: 0; padding: 0; width: 80px; height: 20px; left: 0px; top: 0px; position: relative; float: left; background: url(/img/stars.gif) repeat-x; cursor: pointer; }
*/
#star ul.static { list-style: none; margin: 0; padding: 0; width: 80px; height: 20px; left: 0px; top: -2px; position: relative; float: left; background: url(/img/stars.gif) repeat-x; background-position: 0px -25px; }
#star ul.interactive { list-style: none; margin: 0; padding: 0; width: 80px; height: 20px; left: 0px; top: -2px; position: relative; float: left; background: url(/img/stars.gif) repeat-x; background-position: 0px 0px; cursor: pointer; }
#star li { padding: 0; margin: 0; float: left; display: block; width: 80px; height: 20px; text-decoration: none; text-indent: -9000px; z-index: 20; position: absolute; padding: 0; }
#star li.curr { background: url(/img/stars.gif) left 25px; font-size: 1px; }
.stardel { padding-top: 3px; }
div.user { left: 2px; top: 3px; position: relative; float: left; font-size: 11px; font-family: arial, helvetica, sans serif; color: #888; }
.ratinghead { background: #c0c0c0; color: #000000; font-weight: bold; border-right: 1px solid #c0c0c0; border-top: 1px solid #c0c0c0; }
.ratinglist { clear: both; float: left; display: inline; width: 100%; }
.ratingcol  { float: left; width: 115px; height: 25px; padding-right: 3px; }
.ratingcol1 { float: left; width: 150px; height: 25px; padding-right: 3px; }
/* rating band shades */
.best { background-color: #9afc9a; color: #000000; }

/* ############################################### */
/* Tracks */
/* ############################################### */
.tracks { text-align: left; border-spacing: 0; font: 11px/14px Verdana, Helvetica, Arial, sans-serif; }
.trackcell { padding-bottom: 15px; }
			
/* ############################################### */
/* Portal box */ 
/* ############################################### */

/* generic */
.portalboxsubtitle { background: #E1E1E1; margin-bottom: 5px; padding: 0px 5px 0px 5px; }
.portalboxdiv {border-bottom: 1px solid #c0c0c0; padding: 5px 5px 5px 5px; vertical-align: top; }
.portalhighlight { background: #FBF0FA; }

/* home */
table.portalboxhome { width: 100%; text-align: left; }
table.portalboxhome th { color: #ffffff; font-weight: bold; background: #369; padding: 0 5px 0 5px; }
table.portalboxhome td {  }

/* flank */
table.portalboxflank { width: 300px; margin: 10px 0 0 0; text-align: left; border: solid 1px #f0f0f0; }
table.portalboxflank th { color: #ffffff; font-weight: bold; background: #90B557; padding: 0px 5px 0px 5px; text-align: left; }
table.portalboxflank td {  }

table.portalboxflank a:hover { text-decoration: underline; }
table.portalboxflank a:link { text-decoration: none; }
table.portalboxflank a:visited { text-decoration: none; }
table.portalboxflank a:active { text-decoration: none; }

.titleprefix { color: #000000; font-size: 12pt; }
.titlesuffix { color: #ffffff; font-size: 12pt; }

.flash { z-index: 1; }

/* Textbox containing default text */
.defaulttext { font-size: 13px; padding: 3px 5px; color: #a0a0a0; }
.undefaulttext { font-size: 13px; padding: 3px 5px; }
.newssignup { width: 175px; }

.buyflank { background: #FBF0FA; }
.buytext { width: 180px; }
.searchtext { width: 375px; }

.newslettercell, .buypanelcell { padding: 3px 3px 0 6px; }
.submit { font-weight: bold; font-size: 11pt; margin-right: 10px; color: #008000; }
.greenbody { color: #008000; }
.redbody { color: #ff0000; }

/* Price toolbar */
.storeicon { padding: 3px; }
.storeiconbutton { border:1px outset #f0f0f0; }
.storeiconbutton:hover { border:1px inset #666666; }

.storetoolbar { background-color: #EFEFEF; padding: 5px; }
.storetoolbar2 { background-color: #D1DFD4; padding: 5px; }

/* Price table */
table.prices { background: #F8F8F8; font: 10pt "Trebuchet MS", Helvetica, Arial, sans-serif; color: #333; line-height: 1.3; }
.pricecon { color: #000000; background-color: #ffffff; }
.buynow { font-weight: bold; font-size: 10pt; font-family: tahoma; line-height: 1.4; vertical-align: top; padding-right: 8px; }
.priceheader { font-family: verdana,arial,helvetica,sans-serif; font-weight: bold; font-size: 10pt; color: #666666; line-height: 1.5; }

/* album */
table.wideportalbox { width: 475px; padding: 0 0 0 0; margin: 5px 5px 5px 5px; line-height: normal; border: 1px solid #0000ff; vertical-align: top; }
table.wideportalbox th { text-align: center; color: #ffffff; font-weight: bold; background: #369; vertical-align: middle; }
table.wideportalbox td { vertical-align: top; padding: 5px 5px 5px 5px; text-align: left; }
table.wideportalbox .feedback {text-align: left; vertical-align: top; padding: 2px 5px 2px 5px; }

/* YouTube */
#ytwidget_body { width:450px; margin:0; padding:0; border:1px solid #f9f9f9; }
#ytwidget_flank { width:400px; margin:0; padding:0; border:1px solid #f9f9f9; }
table.resultTable_gsvb td { border: 4px solid red; padding: 2px; }

/* ############################################### */
/* Inline ad (different shade)                     */
/* ############################################### */
td.inlineadtitle { background-color: #D1D7DC; border: #FFFFFF; border-style: solid; border-width: 1px; }
td.inlinead { background-color: #D1D7DC; border: #FFFFFF; border-style: solid; border-width: 1px; text-align: center; }

/* ############################################### */
/* System validation messages */
/* ############################################### */
.valmsg { color: red; font-weight: bold; }
.disabled { color: #c0c0c0; }

.alert {
	background: #fff6bf url(/img/exclamation.png) center no-repeat;
	background-position: 15px 50%; /* x-pos y-pos http://www.w3.org/TR/CSS21/colors.html */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border: 2px solid #ffd324;
	}

.info {
	background: #f8fafc url(/img/information.png) center no-repeat;
	background-position: 15px 50%;
	text-align: left;
	color: #000000;
	padding: 5px 20px 5px 45px;
	border: 1px solid #6699cc;
	}

.help {
	background: #f8fafc url(/img/help.png) center no-repeat;
	background-position: 15px 50%;
	text-align: left;
	padding: 5px 20px 5px 45px;
	border: 1px solid #6699cc;
	}
	
/* Tooltips */
a.tooltip:hover {background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:400px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c; text-align: left; font-weight: normal; z-index:10000;}
a.tooltip img { border:none; width:16px; height:16px; vertical-align:text-bottom; }

/* ############################################### */
/* Footer */
/* ############################################### */
.footer { clear: both; background: #000000; color: #ccccd9; font-weight: bold; text-align: center; padding: 3px; }
.copy { clear: both; background: #369; color: #ccccd9; font-weight: normal; text-align: center; }
a.footernav:link { color: #ccccd9;  text-decoration: underline; }
a.footernav:visited {color: #ccccd9; text-decoration: underline; }
a.footernav:active {color: #ffffff; text-decoration: underline; }
a.footernav:hover {color: #ffffff; text-decoration: none; }

div.footernav { background:none repeat scroll 0 0 #666666; color:#CCCCD9; font-family:arial,sans-serif; text-align: center;  padding: 3px; }
.icon { vertical-align: text-bottom; width: 16px; height: 16px; }
