/**
 * CSS for nevercraft.net version 3
 * my first fully blown CSS site...
 * steal and die. (c) oct/nov 2005
 */


body,td,th {
  font-family: Arial, Helvetica, sans-serif;
}
body {
  background-color: #FFFFFF;
  color: #000000;
}

div#overall {
  width: 700px;
  margin: auto;
}
div#head {
  width: 700px;
  height: 99px;
}

div#nav {
  width: 700px;
  height: 35px;
  display: block;
  clear: none;
  padding: 0px;
  margin: 0px;
  position: relative;
}
div#nav div.head {
  width: 700px;
  height: 7px;
  background: url(/nevercraft/v3/images/v3.nav.top.gif);
  margin: 0px;
  padding: 0px;
  clear: both;
  display: block;
  font-size: 1px;
  line-height: 1px;
}
div#nav div.left {
  width: 10px;
  height: 20px;
  background:url(/nevercraft/v3/images/v3.nav.left.gif);
  float: left;
  display: block;
  clear: none;
}
div#nav div.links {
  width: 400px;
  height: 20px;
  float: left;
  display: block;
  clear: none;
}
div#nav div.blank {
  width: 98px;
  height: 20px;
  background:url(/nevercraft/v3/images/v3.nav.blank.gif);
  float: left;
  clear: none;
}
div#nav div.mininav {
  width: 182px;
  height: 20px;
  display: block;
  float: left;
  clear: none;
  background-image: url(/nevercraft/v3/images/v3.navigate.gif);
}
div#nav div.right {
  width: 10px;
  height: 20px;
  background:url(/nevercraft/v3/images/v3.nav.right.gif);
  float: left;
  clear: none;
}
div#nav div.bottom {
  width: 700px;
  height: 8px;
  background:url(/nevercraft/v3/images/v3.nav.bot.gif);
  display: block;
  clear: both;
  font-size: 1px;
  line-height: 1px;
}
div#nav div#home,
div#nav div#about,
div#nav div#portfolio,
div#nav div#experiments,
div#nav div#tutorials {
  float: left;
  height: 20px;
  width: 80px;
}
div#nav div#home a,
div#nav div#about a,
div#nav div#portfolio a,
div#nav div#experiments a,
div#nav div#tutorials a {
  height: 20px;
  width: 80px;
  display: block;
  z-index: 24;
  position: relative;
  text-decoration: none;
}

div#nav a {
  cursor: pointer;
}

div#nav div#home a {
  background: url(/nevercraft/v3/images/v3.home1.gif);
}
div#nav div#home a:hover {
  background: url(/nevercraft/v3/images/v3.home2.gif);
  font-size: 99%;
  /* Thank you http://lixlpixel.org/css_tooltip/ for the
     font-size change trick... I spent HOURS trying to get
     this to work to no avail...

     Anyone stealing from me what I stole from them...
     you have to apply some kind of change to the hover
     state of the button for it to work in IE.

     I'm using CSS buttons so you can change the font-size
     without anything changing visually..

  */
}
div#nav div#about a {
  background: url(/nevercraft/v3/images/v3.about1.gif);

}
div#nav div#about a:hover {
  background: url(/nevercraft/v3/images/v3.about2.gif);
  font-size: 99%;
}
div#nav div#portfolio a {
  background: url(/nevercraft/v3/images/v3.portfolio1.gif);
}
div#nav div#portfolio a:hover {
  background: url(/nevercraft/v3/images/v3.portfolio2.gif);
  font-size: 99%;
}
div#nav div#experiments a {
  background: url(/nevercraft/v3/images/v3.experiments1.gif);
}
div#nav div#experiments a:hover {
  background: url(/nevercraft/v3/images/v3.experiments2.gif);
  font-size: 99%;
}
div#nav div#tutorials a {
  background: url(/nevercraft/v3/images/v3.tutorials1.gif);
}
div#nav div#tutorials a:hover {
  background: url(/nevercraft/v3/images/v3.tutorials2.gif);
  font-size: 99%;
}
div#nav div.links a span {
  display: none;
}
div#nav div#home a:hover span.mini {
    display:block;
    position:absolute;
  left: 498px;
  width: 182px;
  height: 20px;
  z-index: 100;
  background-image: url(/nevercraft/v3/images/v3.home.gif);
}
div#nav div#about a:hover span.mini {
    display:block;
    position:absolute;
  left: 418px;
  width: 182px;
  height: 20px;
  z-index: 110;
  background-image: url(/nevercraft/v3/images/v3.about.gif);
}
div#nav div#portfolio a:hover span.mini {
    display:block;
    position:absolute;
  left: 338px;
  width: 182px;
  height: 20px;
  z-index: 100;
  background-image: url(/nevercraft/v3/images/v3.portfolio.gif);
}
div#nav div#experiments a:hover span.mini {
    display:block;
    position:absolute;
  left: 258px;
  width: 182px;
  height: 20px;
  z-index: 100;
  background-image: url(/nevercraft/v3/images/v3.experiments.gif);
}
div#nav div#tutorials a:hover span.mini {
    display:block;
    position:absolute;
  left: 178px;
  width: 182px;
  height: 20px;
  z-index: 100;
  background-image: url(/nevercraft/v3/images/v3.tutorials.gif);
}


div#content {
  width: 700px;
  height: 100%;

}
div#content div.head {
  width: 700px;
  height: 19px;
  background:url(/nevercraft/v3/images/v3.content.top.gif);
  display: block;
  clear: both;
  font-size: 1px;
  line-height: 1px;
}
div#content div.bottom {
  width: 700px;
  height: 21px;
  background: url(/nevercraft/v3/images/v3.content.bot.gif);
  display: block;
  clear: both;
  font-size: 1px;
  line-height: 1px;
}
div#content div.left {
  width: 21px;
  height: 100%;
  background: url(/nevercraft/v3/images/v3.content.left.gif);
  background-repeat: repeat-y;
  float: left;
  display: block;
  clear: none;

}

div#content div.main {
  background: url(/nevercraft/v3/images/v3.content.mid.gif);
  width: 700px;
  display: block;
  clear: none;


}
div#content div.main div.left {
  width: 441px;
  float: left;
  clear: none;
  display: block;


}
div#content div.main div.left div.content {
  width: 441px;
  /*padding: 0px 0px 0px 20px;*/
  position: relative;
  left: 20px;
  margin: 0px 0px 10px 0px;
}

div#content div.main div.left div.content div.head {
  width: 441px;
  height: 6px;
  font-size: 1px;
  line-height: 1px;
  background: url(/nevercraft/v3/images/v3.content.left.celltop.gif);
}
div#content div.main div.left div.content div.body {
  width: 441px;
  background: url(/nevercraft/v3/images/v3.content.left.cellmid.gif);

}
div#content div.main div.left div.content div.bottom {
  width: 441px;
  height: 6px;
  font-size: 1px;
  line-height: 1px;
  background: url(/nevercraft/v3/images/v3.content.left.cellbot.gif);
}




div#content div.main div.right {
  width: 210px;
  float: left;
  clear: right;
  display: block;


}
div#content div.main div.right div.content {
  width: 210px;
  /*padding: 0px 0px 0px 10px;*/
  position: relative;
  left: 30px;
  margin: 0px 0px 10px 0px;
}

div#content div.main div.right div.content div.head {
  width: 210px;
  height: 6px;
  font-size: 1px;
  line-height: 1px;
  background: url(/nevercraft/v3/images/v3.content.right.celltop.gif);
}
div#content div.main div.right div.content div.body {
  width: 210px;
  background: url(/nevercraft/v3/images/v3.content.right.cellmid.gif);

}
div#content div.main div.right div.content div.bottom {
  width: 210px;
  height: 6px;
  font-size: 1px;
  line-height: 1px;
  background: url(/nevercraft/v3/images/v3.content.right.cellbot.gif);
}

div.body p {
  margin: 0px 6px 0px 6px;
}
p.header {
  font-size: 10pt;
  text-transform: capitalize;
  color: #FF5200;
  background-color: inherit;
  font-weight: bold;
  padding-bottom: 4px;
  border-bottom: 1px solid #FF5200;
}
p.header a, p.header a:link, p.header a:visited {
  font-size: 10pt;
  color: #FF5200;
  background-color: inherit;
  font-weight: bold;
  text-transform: none;
}
p.header a:link {
  text-decoration: underline;
}
p.header a:hover {
  text-decoration: none;
}
p.main,
ul.main li,
.content-main p {
  font-size: 8pt;
  color: #000000;
  padding-top: 3px;
  padding-bottom: 3px;
  background-color: inherit;
}

ul.main {
  margin: 0;
  padding-left: 20px;
}

p.footer {
  font-size: 8pt;
  color: #FF5200;
  font-weight: bold;
  text-align: right;
  padding-top: 4px;
  border-top: 1px solid #FF5200;
  background-color: inherit;
}
p.footer a, p.footer a:link, p.footer a:visited, p.main a:link, p.main a:visited, p.main a,
div.content-main a, div.content-main a:link, div.content-main a:visited {
  font-size: 8pt;
  color: #FF5200;
  background-color: inherit;
  font-weight: bold;
}
p.footer a:link, p.main a:link {
  text-decoration: underline;
}
p.footer a:hover, p.main a:hover,
div.content-main a:hover {
  text-decoration: none;
}
form#shoutbox {
  margin: 0px;
  padding: 0px;
}
.hidden {
  display:none;
}
form#shoutbox {
  display: none;
}
div#footerbuttons {
  margin-top: 20px; clear:both; text-align: center;
}
div#footerbuttons img {
  border: 0;
}

a img {
  border: 0;
}