/*************************************************************
   Design:   MusicWorld            
   Original:    G. Wolfgang (www.1-2-3-4.info).            
   Date:     May 2008                            
/*************************************************************/
*{ padding: 0; margin: 0;}
body{ 
	background: #fff; 
	}
#wrapper{ 
	width: 900px; 
	margin: 10px auto; 
	font: small arial,sans-serif;
	border: 1px solid #969696; 
	}
#header{
	width:100%; height:80px; 
	font-family:"trebuchet ms",arial,sans-serif;
	color: #7d7d7d;
	background:#f0f0f0 url(img/bg_head.jpg); 
	overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;
	}
	#header a.sitelogo {
		position:absolute; 
		width:60px; height:40px; 
		margin:18px 0 0 610px; 
		z-index:1; 
		background:url( img/bg_logo.jpg); 
		}
	#header h1{
		position:absolute; 
		line-height:15px; 
		margin:20px 0 0 680px; 
		font-size:170%;
		z-index:1; 
		}
		#header h1 span{ font-size:60%; }
	#header #sitemessage {
		width:900px; height:120px; 
		position:absolute; 
		z-index:0; 
		margin-top:70px; 
		overflow:hidden /*IE6*/; /*xoverflow:visible !important /*Activate if Firefox print problems*/
		color:#eaeff7;
		background:rgb(230,230,230) url( img/bg_head_middle.jpg)
		}
		#header #sitemessage  h1{ margin:10px 0 0 15px; font-size:190%; line-height:100%;}
		#header #sitemessage  h2{ margin:30px 0 0 15px; font-size:140%; line-height:90%;}
		#header #sitemessage  h3{ margin:-5px 0 0 230px; font-size:110%;}
		#header #sitemessage  a{ text-decoration:none; color:#eaeff7;}
			#header #sitemessage  a:hover{ color:#323232;}

/*********************  Navigation  *********************/
#nav{ 
	float:left; 
	width: 898px; height: 2.4em; 
	margin-top: 110px;
	white-space:nowrap /*IE hack*/; 
	font-size: 130%;
	border: 1px solid #afafaf;
	background: #dddddd url( img/bg_nav.jpg) repeat-y; 
	}
/* -----------------------------------------  Top-level menu  ----------------------------------------- */
#nav ul{ list-style: none;}
#nav li{ 
	float: left; 
	z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; 
	border-right: 1px solid #afafaf;
	}
#nav a{ 	/* main cells normal mode */
	float:none !important /*Non-IE6*/; float:left /*IE-6*/; 
	display: block; 
	width: 7.4em; 
	padding: 0 12px; 
	line-height: 2.4em; 
	font-weight: bold; 
	text-decoration: none; 
	color: #646464;
	}
#nav li:hover{ position:relative;} /*Sylvain IE hack*/
#nav li:hover a{ background:#d2d2d2;} /* main cells hovering mode */
/* -----------------------------------------  Drop-down menu  ----------------------------------------- */
#nav li ul{ display:none; border:none;}	/* hide submenu */

/* SUBMENU Non-IE6 */
#nav li:hover ul{	/* show submenu */
	position: absolute; 
	top: 2.4em; left: 0;
	display: block; 
	width:10.0em; 
	z-index: 98; 
	border-top: solid 1px #afafaf; 
	}
#nav li:hover ul a{	/* subcells normal mode */
	display: block; 
	width: 7.4em; height: auto; 
	line-height: 1.3em; 
	margin-left: -1px; 
	padding: 4px 12px; 
	font-weight: normal; 
	border-left: solid 1px #afafaf; 
	border-bottom: solid 1px #afafaf; 
	color: #323232; background: #ededed; 
	} 
#nav li:hover li a:hover{ background: #d2d2d2; } /* subcells hovering */

/* SUBMENU  IE6 */
#nav table{ position:absolute; top:0px; left:-1px; z-index:1000; border-collapse:collapse;}
#nav li a:hover{  /* main cells hovering mode*/
	position:relative /*Sylvain IE hack*/; z-index:1000 /*Sylvain IE hack*/; 
	background:#d2d2d2; 
	}
#nav li a:hover ul{ 
	position:absolute; 
	top:3.1em; t\op:2.3em; 
	left:0px; 
	marg\in-top:0.1em; 
	display:block; 
	width:10.0em; 
	z-index:1000; 
	}
#nav li a:hover li a{  /* subcells normal mode*/
	display:block; 
	w\idth:10.0em; 
	height:1px; 
	line-height:1.3em; 
	padding:4px 16px; 
	white-space:normal; 
	font-weight:normal; 
	border:1px solid #d7d7d7; 
	color:#646464; background:#ededed; 
	}
#nav li a:hover li a:hover{ background:#d2d2d2;} /* subcells hovering mode*/ 

/*******************  MAIN   *******************/
#main{
	clear: both;
	float: left;
	width: 870px;
	padding: 15px; 
	font: small arial,sans-serif;
	background: url( img/bg_main.jpg) repeat-y; 
	}
h2{ font-size: 120%; padding: 10px 0; color: #646464;}
p{ padding-bottom: 7px; }
img{ float: right; padding: 10px; }
a{ color: #7d7d7d; }
	a:hover{ text-decoration: none; }
blockquote{ margin: 10px 20px; padding: 5px; border-left: 5px solid #999; color: #000; background: #ececec;}
#jukebox{
	float: right;
	width: 400px;
	margin-left: 20px;
	}
	#jukebox object{ margin: 5px 0;}
	#jukebox h2,#jukebox p{ color: #009241;}
/*********************  FOOTER   *********************/
#footer p{ 
	text-align: center; 
	line-height: 2.8em;
	font-size: 88%;
	color: #7d7d7d;
	background: #e8e8e8 url( img/bg_foot.jpg) bottom no-repeat;
	}
/*********************************  PRINTING ********************************/
@media print {#wrapper {width:900px; border:1px solid #000; }}
@media print {#header {width:900px; }
@media print {#nav {width:900px; font-size:130%; border:1px solid #000; }} 
@media print {#main {width:880px; padding-bottom:30px; }}
@media print {#footer {width:898px; height:3.7em; padding:1.1em 0;}}