div{
  behavior: url('IEFixes.htc');
}

/* The header class */
#header{
  background: url("red_black_logo.jpg") no-repeat scroll top left;
  
  position: absolute;
  top: 0px;
  left: 70px;

  width: 547px;
  height: 95px;
  opacity: 0.6;
}

/* Navigation class. This is (duh) the nav panel. */
#nav{
  position: absolute;
  top: 110px;
  left: 70px;
  width: 90%;
  z-index: 2;

  font-family: Arial, Verdana;
  font-size: .9em;
}

#nav a{
  color: #903;
}

#nav .heading,
#nav .home_link{
  font-size: 25px;
  color: #F66;

  position: absolute;
  text-decoration: underline;
  padding-bottom: 5px;
  z-index: 2;
  top: 0;
}

#nav a.home_link:hover{
  color: white;
  text-decoration: line-through;
}

#nav #projects .heading{
  left: 170px;
}
#nav #projects .links{
  left: 170px;
}

#nav #links .heading{
  left: 300px; 
}
#nav #links .links{
  left: 300px;
}

#nav #about .heading{
  left: 400px; 
}
#nav #about .links{
  left: 400px;
}

#nav .home_link{
  left: 520px;
}

#nav .link{
  padding-top: 5px;
  padding-bottom: 3px;
  padding-left: 4px;
  padding-right: 4px;

  background: black;
  z-index: 2;
}

#nav .links{  
  position: absolute;
  z-index: 2;
  top: 30px;
  width: 100px;

  border-bottom: solid 1px #808080;
  border-left: solid 1px #808080;
  border-right: solid 1px #808080;
  border-top: solid 1px #808080;

  text-align: center;

  background: black;
  display: none;
}

#nav .group:hover .links,
#nav div.group.hover .links{
  display: block;
}

#nav .group:hover .heading,
#nav div.group.hover .heading{
  width: 100px;
  color: white;
  background: black;
  text-decoration: line-through;

  border-top: solid 1px #808080;
  border-left: solid 1px #808080;
  border-right: solid 1px #808080;
}

#nav .copyright{
  position: absolute;
  right: 0px;
  top: 20px;

  width: 100px;
}

#nav #proj_box{ display: none; }
#nav .seperator{ display: none; }
#nav hr{ dispalay: none; }
#nav select{ display: none; }
#nav option{ dispaly: none; }  

/* The main content class */
#content{
  position: absolute;
  top: 190px;
  left: 163px;
  width: 64%;

  font-family: Arial, Verdana;
  font-size: 1em;
  color: #808080;  

  border: dashed 1px #FF8000;
  padding: 20px 10px 10px 10px;
  background: #000;
  
  z-index: 1;
}

/* The comments */
#comments{
  position: relative;
  border-top: dashed 1px #F66;
  border-left: dashed 1px #F66;
  border-right: dashed 1px #F66;

  padding: 0px 5px 0px 5px;

  width: 90%;
  left: 5%;
}

#comments .comment{
  padding-top: 5px;
  padding-bottom: 5px;
  //height: 100%;
  border-bottom: dashed 1px #F66;
}

#comments .comment .name{
   position: absolute;
   width: 20%;
  // height: 100%;
   //border-right: dashed 1px #F66;
}

#comments .comment .text{
   position: relative;
   left: 20%;
   padding-left: 2%;
   width: 80%;
   top: -0px;
   border-left: dashed 1px #F66;
}


/* regular ol' boring stuff */
body{
  background: black url("new_age.png") repeat scroll top left;
}

h2.title{
  position: absolute;
  left: 80px;
  top: 100px;
  
  font-size: x-large;
  font-family: Arial, Verdana;
  color: #C11;
}

h2{
  text-align: center;
}
 
big{
  font-family: Arial, Verdana;
  font-size: larger;
  
  color: #808080;
}

a.anchor, a.anchor:hover{
  text-decoration: none;
  color: #933;
}

a{
  color: #933;
  text-decoration: none;
}

a:hover{
  text-decoration: underline;
  color: white;
}

img, img:hover{ border: 0; }