/*
CSS for hyp0static site - liquid layout test
*/

/* --- GENERAL RULES --- */

body {
	font-family: helvetica, arial, sans-serif;
	font-size: 0.9em;
	line-height: 1.25;
	padding: 0;
	margin: 0;
	background: #000 url(backgrounds/background.gif) no-repeat;
	background-attachment: fixed;
	}

/* Fix IE. Hide from IE Mac \*/
* html #body { background: #000 url(backgrounds/background.gif) repeat-y; }
/* End */


#header h1 {
	padding: 0;
	margin: 0;
	background: transparent url(backgrounds/hyp0static_header.jpg) no-repeat;
	height: 180px;
	width: 500px;
	}

#header h1 span {
	display: none;
	}

h2 {
	margin: 0;
	font-family:"Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
	font-size: 100%;
	line-height: 1.4em;
  	text-transform:uppercase;
  	letter-spacing:.2em;
  	color:#999;
	}

h3 {
	margin: 0;
	}

/* HIDE
#header, #nav, #bodycontent, #sidebar {
	border: 1px solid blue;
	padding: 2px;
	margin-bottom: 2px;
	}
END HIDE */

#header, #nav, #bodycontent, #sidebar {
	position: absolute;
	}

#header {
	left: 145px;
	}

#nav {
	top: 190px;
	left: 6em;
	}

#bodycontent {
	top: 190px;
	left: 10.5em;
	}

#sidebar {
	top: 30em;
	left: 0.5em;
	}


/* ---NAVIGATE RULES --- */
	
#nav {
	font-family: Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 0.85em;
	text-align: right;
	}

#nav, #nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 4.5em;
	}	

#nav li {
	position: relative;
	}

#nav li ul {
	position: absolute;
	margin: 0;
	left: -5.4em;
	top: 0;
	width: 5.4em;
	display: none;
	}

#nav li a:link, #nav li a:visited {
	display: block;
	text-decoration: none;
	color: #fff;  
 	background-color: #000;
	padding: 4px 4px 4px 0.3em;
	}

#nav li a:hover {
	color: #fd1f2b;
	}

#nav li:hover ul {
	display: block;
	}

*:first-child+html #nav li { 
height: 1%; 
} 
*:first-child+html #nav li a { 
height: 1%; 
}


/* ---BODYCONTENT RULES --- */

#bodycontent {
	width: 380px;
	text-align: left;
	color: #fd1f2b;
	}

/* HIDE #bodycontent h2 {
	font-size: 1.15em;
	font-weight: normal;
	}
END HIDE */

#bodycontent p {
	font-size: 0.85em;
	font-weight: normal;
	}

#bodycontent a {
	font-weight: bold;
	}
	
#bodycontent a:link {
	color: #999;
	background-color: transparent;
	}

#bodycontent a:visited {
	color: #999;
	background-color: transparent;
	}

#bodycontent a:hover {
	color: #fff;
	background-color: transparent;
	}

#bodycontent a:active {
	color: #fd1f2b;
	background-color: transparent;
	}

#bodycontent .image {
	float: left;
	margin-right: 1em;
	}

#bodycontent .footer {
	float: clear;
	color: #666;
	font-size: 0.6em;
	font-weight: normal;
	padding: 5em 0 3em 0;
	}


#studio p {
	font-size: 1em;
	padding-left: 0.3em;
	}

#studio ul {
	list-style: none;
	font-size: 0.9em;
	}

/* ---MEDIA RULES--- */
	
#music {
	padding: 3px;
    border-bottom:1px dotted #ccc;
	}
	
#remix {
	padding: 3px;
    border-bottom:1px dotted #ccc;
	}
	
#comp {
	padding: 3px;
    border-bottom:1px dotted #ccc;
	}

.promo {
	padding: 0.5em;
    border-bottom:1px dotted #ccc;
	}

.media {
	margin: 0;
	padding: 0;
	height: 263px;
	text-align: left;
	font-size: 1em;
	}

.media h3 {
	margin: 0;
	padding: 0.5em 0 0 0.2em;
	font-size: 1em;
	font-weight: normal;
	}

.media p {
	padding: 0.3em 0 0 0;
	}

.media ul {
	margin: -0.5em 0.1em 0 0;
	list-style-type: none;
	font-size: 0.9em;
	font-weight: normal;
	}

.leftimg {
	float: left;
	margin: 1em;
	}

.clear {
	clear: both;
	}

.video {
	margin: 0;
	padding: 0;
	height: 370px;
	text-align: left;
	font-size: 1em;
	}

.video h3 {
	margin: 0;
	padding: 0.5em 0 0 0.2em;
	font-size: 1em;
	font-weight: normal;
	}

.video p {
	padding: 0.3em 0.5em 0 1em;
	}

.video ul {
	margin: -0.5em 0.1em 0 0;
	list-style-type: none;
	font-size: 0.9em;
	font-weight: normal;
	}

.videocaption {
	font-size: 0.9em;
	margin: 0;
	}

/* ---IMAGES RULES___ */

div.float {
  float: left;
  margin-top: 0.5em;
  margin-right: 0.5em;
  }
  
div.float p {
   text-align: left;
   }


/* ---FORM RULES--- */
form.contact fieldset {
  border: 1px solid #fff;
  padding: 10px;
}

form.contact legend {
  padding: 5px;
  font-weight: bold;
  font-size: small;
  color: #fd1f2b;
}

form.contact {
  padding: 0;
  margin: 0;
  margin-top: -6px;
  margin-bottom: 30px;
}

form.contact label {
  font-weight: bold;
  font-size: 1em;
  color: #fd1f2b;
  line-height: 150%;
}

form.contact label.fixedwidth {
  display: block;
  width: 220px;
  float: left;
}

form.contact .buttonarea input {
  background: #000;
  color: #fff;
  font-weight: bold;
  margin-top: 1em;
  margin-bottom: 0.5em;
  padding: 5px;
  border: 1px solid #fd1f2b;
}

form.contact .buttonarea {
  text-align: center;
  padding: 4px;
}


/* BLOG RULES */

/* Posts
----------------------------------------------- */
@media all {
  .date-header {
    margin:0 0 .5em;
    }
  .post {
    margin:.5em 0 1.5em;
    border-bottom:1px dotted #ccc;
    padding-bottom:1.5em;
    }
  }
@media handheld {
  .date-header {
    padding:0 1.5em 0 1.5em;
    }
  .post {
    padding:0 1.5em 0 1.5em;
    }
  }
.post-title {
  margin:.25em 0 0 0.5em;
  padding:0;
  font-size:120%;
  font-weight:normal;
  line-height:1.4em;
  color:#FD8421;
  }
.post-title a, .post-title a:visited, .post-title strong {
  display:block;
  text-decoration:none;
  color:#FD8421;
  font-weight:normal;
  }
.post-title strong, .post-title a:hover {
  color:#333;
  }
.post div {
  margin:0 0 .75em 0.75em;
  line-height:1.3em;
  }
 .post-body div, p {
 	font-size: 0.85em;
 	font-weight: normal;
 	letter-spacing: 0.03em;
 	}
p.post-footer {
  margin:-.25em 0 0 0.8em;
  color:#ccc;
  }
.post-footer em, .comment-link {
  font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
  text-transform:uppercase;
  letter-spacing:.1em;
  }
.post-footer em {
  font-style:normal;
  color:#999;
  margin-right:.6em;
  }
.comment-link {
  margin-left:.6em;
  }
.post img {
  padding:4px;
  border:1px solid #ddd;
  }
.post blockquote {
  margin:1em 20px;
  }
.post blockquote p {
  margin:.75em 0;
  }


/* Comments
----------------------------------------------- */
#comments h4 {
  margin:1em 0;
  font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
  text-transform:uppercase;
  letter-spacing:.2em;
  color:#999;
  }
#comments h4 strong {
  font-size:130%;
  }
#comments-block {
  margin:1em 0 1.5em 0.5em;
  line-height:1.6em;
  }
#comments-block dt {
  margin:.5em 0;
  }
#comments-block dd {
  margin:.25em 0 0 0.75em;
  }
#comments-block dd.comment-timestamp {
  margin:-.25em 0 2em;
  font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
  text-transform:uppercase;
  letter-spacing:.1em;
  }
#comments-block dd p {
  margin:0 0 .75em;
  }
.deleted-comment {
  font-style:italic;
  color:gray;
  }

   
 /* Sidebar Content
----------------------------------------------- */

#sidebar {
	font-family: Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 0.85em;
	text-align: right;
	}

#sidebar ul {
	list-style: none;
	margin: 0;
	margin-bottom: 0.5em;
	padding: 0;
	}
	
#sidebar li {
	position: relative;
	}
 
#sidebar li a:link, #sidebar li a:visited {
	text-decoration: none;
	color: #fff;  
	padding: 4px 4px 4px 0.3em;
	text-transform: lowercase;
	}

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

#sidebar p {
  color:#666;
  line-height:1.2em;
  font-size: 0.50em;
  }