body, html { height: 100%; width: 100%; padding: 0; margin: 0; background-color: #fff; font: 12px verdana, arial, sans-serif;color: #333333;line-height: 20px;}
.container {width:930px; margin:0px auto; margin-top:10px; margin-bottom:10px; border:solid 1px #BCBCCA; font-size:1.0em; background: #fff}

.header {width:930px; font-family:"trebuchet ms",arial,sans-serif; background: #fff}
.header-top {width:920px; height:80px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;margin-left:35px;}
.header-breadcrumbs {clear:both; width:950px; padding:1.0em 0 1.5em 0;}
.sitename {width:136px; height:80px; position:absolute; z-index:1; padding: 5px; margin:1px 0 0 10px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
.sitename a {text-decoration:none;}
.sitename a:hover {text-decoration:none;}
.sitename a img { border: 0px;}

.nav01 {width:450px; position:absolute; z-index:3; margin:-45px 0 0 225px;}
.nav01 ul {float:right; padding:0 35px 0 0; font-weight:bold;} 
.nav01 li {display:inline; list-style:none;}
.nav01 li a {display:block; float:left; padding:2px 5px; color:rgb(125,125,125) ; text-decoration:none; font-size:100%;}
.nav01 a:hover {text-decoration:none; color:rgb(50,50,50);}

.nav1 {width:250px; height: 60px; position:absolute; z-index:3; margin:0 0 0 620px;}
.nav1 ul {float:left; font-weight:bold;} 
.nav1 li {display: inline; list-style:none;}
.nav1 li a {display: block; padding:3px; margin: -10px 0 0 60px; color: #326DD5; ) ; text-decoration:none; font-size:90%;}
.nav1 li a:hover {text-decoration:none; color: #FF6600;border-bottom: 2px dotted #FF6600;}

.main-content {display:inline; /*Fix IE floating margin bug*/; float:left; width:890px; margin: 5px 0 0 5px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}

.column1-unit {width:900px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-left {float:left; width:400px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-right {float:right; width:480px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column3-unit-left {float:left; width:300px; margin-bottom:5px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;margin-left:5px;}
.column3-unit-middle {float:left; width:375px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/; margin-left:5px;}
.column3-unit-right {float:left; width:210px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/; margin-left:5px;}

#footer { clear: both; text-align: center; padding: 15px 0px 15px 0px; border-top: 2px solid #FF6600; background-color: #fff; width: 95%; color: #bbb; font: 10px verdana, arial, sans-serif; margin-left: 3%;}
#footer a{ text-decoration: none; color: #999;}
#footer a:hover{ text-decoration: underline; color: #8EDC04;}

/*  CLEAR FLOATS  */
.container:after, .header:after, .header-breadcrumbs:after, .main:after, .main-navigation:after, .main-content:after, .main-content div:after, .main-subcontent:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.column1-unit:after, .column2-unit-left:after, .column2-unit-right:after, .column2-unit-left-2:after, .column2-unit-right-2:after, .column3-unit-left:after, .column3-unit-middle:after, .column3-unit-right:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}

.progressBarVisible { position: fixed; width: 14%; height: 20px; -moz-border-radius: 5px;  left: 43%;  bottom: 10px;  z-index: 555;  padding: 15px;  margin: 0px;  border: 2px double #ffffff;  text-align: center;  font: 8pt verdana, arial, sans-serif; background-color: #333333; color: #efefef; alpha(opacity:80); opacity:.80;}

progressBarInvisible { display: none;}

h1 { font: 26pt "trebuchet ms", verdana, arial, sans-serif; margin: 0px; padding: 0; color: #326DD3; text-align: left;}

h1 a { color: #326DD3; text-decoration: none;}

h1 a:hover { color: #326DD3; text-decoration: underline;}

h2 { font: 16pt "trebuchet ms", verdana, arial, sans-serif; margin: 10px 0px 5px 0px; padding: 0; color: #326DD3; border-bottom: 2px solid #FF6600; text-align: center;}

h2 a { color: #326DD3; text-decoration: none; }
h2 a:hover { color: #326DD3; text-decoration: underline; }

h3 { font: 17px "trebuchet ms", verdana, arial, sans-serif; display: inline; line-height: 1.3; margin: 0px; padding: 0px;}
 
h4 { font: 12pt "trebuchet ms", verdana, arial, sans-serif; margin: 0px; padding: 0; color: #326DD3; text-align: left;}
  
.subject { font: 12pt "trebuchet ms", verdana, arial, sans-serif; margin: 0px; padding: 0; color: #326DD3; text-align: left;}
.song { font: 12pt "trebuchet ms", verdana, arial, sans-serif; font-weight: bold;}

.intro { font: 10pt "trebuchet ms", verdana, arial, sans-serif; margin: 20px 0px 5px 0px; padding: 0; color: #326DD3; text-align: center;}

.intro a { color: #326DD3; text-decoration: none; }
.intro a:hover { color: #326DD3; text-decoration: underline; }

#artistimg { float: center; padding: 8px; border: 1px solid #efefef; background-color: #fff;   margin: 0px 0px 10px 10px; }

.wikiArticle { font: 12px verdana, arial, sans-serif; color: #333333; line-height: 20px; text-align: justify;}

.wikiArticle a{ color: #326DD3; border-bottom: 2px dotted #FF6600; text-decoration: none;}

.wikiArticle a:hover{ color: #C02804; border-bottom: 2px solid #FF6600; text-decoration: none;}

.similarContainer { text-align: center;}

.loginContainer { text-align: center;}

.artistSongContainer { text-align: center;}

.tagsContainer    { text-align: center;}

.flickrContainer  { text-align: center;}

.songsContainer   { text-align: center;}

.youtubeContainer { text-align: center;}

.releaseContainer { text-align: left;}

.fotoContainer { float: right; width: 185px; margin: 0px 15px 0px 0px;	}

.blogContainer {  text-align: left; }

.itemList { list-style: none outside; border: 1px solid #ccc; margin: 0px; padding: 5px; width: 96%;}

.itemList li{ text-align: center; font: 8pt verdana, arial, sans-serif; margin: 0px; padding: 0px;}

.itemsLink li a { display: block; padding: 6px 2px 6px 5px; margin: 0px; border-bottom: 1px solid #ddd; text-decoration: none; color: #000; font: bold 10pt "trebuchet ms", verdana, arial, sans-serif; background-color: #efefef;}

.itemsLink li a:hover{ color: #fff; text-decoration: underline; background-color: #326DD3;}

.blogLink { display: block; padding: 6px 2px 6px 5px; margin: 0px; border-bottom: 1px solid #fff; text-decoration: none; color: #fff; font: bold 10pt "trebuchet ms", verdana, arial, sans-serif; background-color: #326DD3;}

.blogLink:hover { color: #000; text-decoration: underline; background-color: #E4ECE6;}

.latestLink { display: block; padding: 6px 2px 6px 5px; margin: 0px; border-bottom: 1px solid #efefef; text-decoration: none; color: #000; font: bold 10pt "trebuchet ms", verdana, arial, sans-serif; background-color: #E4ECE6;}

.latestLink:hover{ color: #fff; text-decoration: underline; background-color: #326DD3;}

.viewsLink { display: block; padding: 6px 2px 6px 5px; margin: 0px; border-bottom: 1px solid #ddd; text-decoration: none; color: #000; font: bold 10pt "trebuchet ms", verdana, arial, sans-serif; background-color: #efefef;}

.viewsLink:hover{ color: #fff; text-decoration: underline; background-color: #326DD3;}

.newestLink { display: block; padding: 6px 2px 6px 5px; margin: 0px; border-bottom: 1px solid #efefef; text-decoration: none; color: #000; font: bold 10pt "trebuchet ms", verdana, arial, sans-serif; background-color: #fff;}

.newestLink:hover{ color: #fff; text-decoration: underline; background-color: #FF6600;}

.searchContainer { margin-left: 0px; width: 25%; float: left; margin-bottom: 20px; background-color: #fff; }

.miscContainer { margin-left: 0px; width: 35%; float: left; margin-bottom: 20px; background-color: #fff;}

.searchList { list-style: none outside; border: 1px solid #ccc; width: 173px; margin: 0px; padding: 5px;}

.searchList li{ font: 8pt verdana; margin: 0px; padding: 0px;}

.searchList a { display: block; padding: 5px; margin: 0px; width: 162px; height: 74px; border-bottom: 3px solid #fff; text-decoration: none; color: #1a1a1a; background-color: #C1DDEF;}

.searchList a:hover { color: #1a1a1a; text-decoration: underline; background-color: #0072BC;}

.similar { font-family: verdana, arial, sans-serif; line-height: 1.5; color: #FFFFCC; }
.similar a:link { color: #FF9900; text-decoration: none; }
.similar a:visited { color: #326DD5; text-decoration: none; }
.similar a:active { color: #FF9900; text-decoration: none; }
.similar a:hover { color: #326DD5; text-decoration: underline; }

.artistSong { font-family: verdana, arial, sans-serif; line-height: 1.5; color: #326DD5; }
.artistSong a:link { color: #FF9900; text-decoration: none; }
.artistSong a:visited { color: #326DD5; text-decoration: none; }
.artistSong a:active { color: #FF9900; text-decoration: none; }
.artistSong a:hover { color: #326DD5; text-decoration: underline; }

.image75 { border: 1px solid #cccccc; background-color: #fafafa; padding: 5px; width: 75px; height: 75px; display: inline; margin: 0px 5px 5px 0px; }

.image75:hover { border: 1px solid #aaaaaa; background-color: #efefef; }

.image140 { border: 1px solid #cccccc; background-color: #fafafa; padding: 5px; width: 140px; display: inline; margin: 0px 5px 5px 0px; }

.image140:hover { border: 1px solid #aaaaaa; background-color: #efefef; }


.image130 { border: 1px solid #cccccc; background-color: #fafafa; padding: 5px; width: 130px; height: 97px; display: inline; margin: 0px 5px 5px 0px; }

.image130:hover { border: 1px solid #aaaaaa; background-color: #efefef; }

.searchfield { border: 2px solid #DBDBDB; font: 18px "trebuchet ms", verdana, arial, sans-serif; background-color: #326DD3; padding: 3px 5px 5px 10px; color: #ffffff; width: 425px; height: 26px; -moz-border-radius: 5px; }

.searchfield:hover{ border: 2px solid #4C4C4C; background: #FF6600; }

.searchfield:focus{ border: 2px solid #4C4C4C; background: #FF6600; }

.tooltip { width: 260px; background-color: #fff; border: 1px solid #999; padding: 3px; font: 10px verdana, arial, sans-serif; line-height: 18px;}

.tooltip a { color: #326DD3; border-bottom: 2px dotted #FF6600; text-decoration: none; font: bold 12px verdana, arial, sans-serif; line-height: 22px;}

.tooltip a:hover { color: #C02804; border-bottom: 2px solid #FF6600; text-decoration: none; }

.songForm {width:600px; margin:2.0em 0 0 0; padding:10px 10px 0 10px;}
.songForm fieldset {padding:20px 0 0 0 !important /*Non-IE6*/; padding:0 /*IE6*/; margin:0 0 20px 0; border:solid 1px #325DD6;}
.songForm fieldset legend {margin:0 0 0 5px !important /*Non-IE*/; margin:0 0 20px 5px /*IE6*/; padding:0 2px 0 2px; color: #FF6600; font: 18px "trebuchet ms", verdana, arial, sans-serif;}
.songForm label.left {float:left; width:100px; margin:0 0 0 10px; padding:2px; font: 16px "trebuchet ms", verdana, arial, sans-serif;}
.songForm select.combo {width:175px; padding:2px; border:solid 1px rgb(200,200,200); font: 16px "trebuchet ms", verdana, arial, sans-serif;}
.songForm textarea {width:400px; ; border: 2px solid #DBDBDB;  background:  #FF6600;  padding: 1px 1px 1px 1px; color: #ffffff; font: 14px "trebuchet ms", verdana, arial, sans-serif; -moz-border-radius: 5px;}
.songForm textarea:hover{ border: 2px solid #4C4C4C; background: #FF6600; }
.sonfForm textarea:focus{ border: 2px solid #4C4C4C; background: #FF6600; }

.songForm input.button {float:right; width:9.0em; margin-right:20px; margin-bottom:10px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/;  background: #FF6600; border:solid 1px rgb(150,150,150); text-align:center; font: 14px "trebuchet ms", verdana, arial, sans-serif; -moz-border-radius: 5px;color: #000000;}
.songForm input.button:hover {cursor: pointer; border:solid 1px rgb(80,80,80); background: #FF6600; color: #FFFFFF;}

.star-rating{
	list-style:none;
	margin-bottom: 5px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	padding:0px;
	width: 150px;
	height: 30px;
	position: relative;
	background: url(http://www.mp3.ba/img/star_dims.gif) top left repeat-x;
	clear: both;
}
.star-rating li{
	padding:0px;
	margin:0px;
	float: left;
}
.star-rating li a{
	display:block;
	width:30px;
	height: 30px;
	text-decoration: none;
	text-indent: -9000px;
	z-index: 20;
	position: absolute;
	padding: 0px;
}
.star-rating li a:hover{
	background: url(http://www.mp3.ba/img/star_dims.gif) left center;
	z-index: 2;
	left: 0px;
}
.star-rating a.one-star{
	left: 0px;
}
.star-rating a.one-star:hover{
	width:30px;
}
.star-rating a.two-stars{
	left:30px;
}
.star-rating a.two-stars:hover{
	width: 60px;
}
.star-rating a.three-stars{
	left: 60px;
}
.star-rating a.three-stars:hover{
	width: 90px;
}
.star-rating a.four-stars{
	left: 90px;
}	
.star-rating a.four-stars:hover{
	width: 120px;
}
.star-rating a.five-stars{
	left: 120px;
}
.star-rating a.five-stars:hover{
	width: 150px;
}
.star-rating li.current-rating{
	background: url(http://www.mp3.ba/img/star_dims.gif) left bottom;
	position: absolute;
	height: 30px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
}


.star-rating-inactive{
	list-style:none;
	margin-bottom: 5px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	padding:0px;
	width: 150px;
	height: 30px;
	position: relative;
	background: url(http://www.mp3.ba/img/star_dims2.gif) top left repeat-x;
	clear: both;
}
.star-rating-inactive li{
	padding:0px;
	margin:0px;
	float: left;
}
.star-rating-inactive li.current-rating{
	background: url(http://www.mp3.ba/img/star_dims2.gif) left bottom;
	position: absolute;
	height: 30px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
}

