body {
  background-color: #0a0a0a;
  text-align: center;
}
#wrapper {
  margin-right: auto;
  margin-left: auto;
  text-align: left;
  color: #d7d7d7;
  font-size: 10pt;
  font-family: verdana;
  width: 1000px;
}
#header {
  height: 50px;
  width: 1000px;
  background-repeat: no-repeat;
  background-image: url(graphics/header.jpg);
  color: white;
  text-align: center;
  font-size: 20px;
  line-height:50px;
  font-family: Palatino Linotype, Book Antiqua, Palatino, serif;
  font-weight: bold;
}
#menucontainer {
  height: 25px;
  width: 1000px;
  clear: right;
}
#leftcolumn {
  padding-right: 10px;
  padding-left: 10px;
  width: 220px;
  height: 1425px;
  float: left;
  text-align: center;
  background-image: url(graphics/leftcolumn.jpg);
}
#rightcolumn {
  padding-left: 10px;
  padding-right: 10px;
  width: 220px;
  height: 1425px;
  float: right;
  text-align: center;
  background-image: url(graphics/rightcolumn.jpg);
}

/* quote */

.quote {
  font-family: "Times New Roman",Times,serif;
  margin: 5px;
  color: silver;
  font-size: 16px;
}

/* contents and footer below */

#content {
  width: 478px;
  padding-left: 260px;
  padding-right: 260px;
  border-width: 0px 1px;
  border-style: none solid;
  border-color: white;
  background-color: black;
  padding-top: 1px;
  background-image: url(graphics/content.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  margin-bottom:25px;
  clear:none;
}
#content a {
  color: #7070ff;
}
.infobar {
  margin: 12px auto 0px auto;
  height: 20px;
  width: 465px;
  text-transform: capitalize;
  text-align: center;
  font-weight: bold;
  font-size: 12px;
  line-height: 20px;
  color: #ccccff;
  background-image: url(graphics/infobar.gif);
  background-repeat: no-repeat;
}
#footer {
  border-top: 1px solid #ccccff;
  position: fixed;
  clear: both;
  height: 20px;
  bottom: 0px;
  background-image: url(graphics/footer.jpg);
  text-align: center;
  width: 1000px;
  background-repeat: no-repeat;
  background-color: #0a0a0a;
  padding-bottom: 5px;
  font-size: 11px;
  line-height: 19px;
}

/* a: all link styling here! */

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

/* headings */

h1 {
  color: white;
  text-transform: capitalize;
  font-size: 13pt;
  font-weight: bold;
}
h2 {
  font-weight: normal;
  font-size: 8pt;
  color: #b4b4b4;
}
h3 {
  font-size: 11pt;
  font-weight: bold;
  line-height: 10pt;
  text-decoration: underline;
  color: #dbdbff;
}
h4 {
  font-weight: normal;
  font-size: 8pt;
  color: #b4b4b4;
  border-bottom:dashed 1px #d7d7d7;
  padding-bottom:15px;
  margin:10px 0px
}

/* menu divs */

.menu1 {
  float: left;
  height: 25px;
  width: 200px;
  background-image: url(graphics/menu1.jpg);
}
.menu2 {
  float: left;
  height: 25px;
  width: 200px;
  background-image: url(graphics/menu2.jpg);
}
.menu3 {
  float: left;
  height: 25px;
  width: 200px;
  background-image: url(graphics/menu3.jpg);
}
.menu4 {
  float: left;
  height: 25px;
  width: 200px;
  background-image: url(graphics/menu4.jpg);
}
.menu5 {
  float: left;
  height: 25px;
  width: 200px;
  background-image: url(graphics/menu5.jpg);
}

/* menubox and design for its span starts here! */

.menubox {
  margin: 0px auto;
  border: 1px solid #999;
  text-align: center;
  width: 170px;
  height: 19px;
  background-color: black;
  color: white;
}
.menubox a {
  text-decoration: none;
}
.menubox a span {
  display: none;
}
.menubox a:hover span {
  z-index: 1;
  display: block;
  position: relative;
  top: 5px;
  left: -17px;
  height: 130px;
  width: 180px;
  padding: 10px;
  border: 2px ridge #999;
  font-size: 9pt;
  background-color:black;
  color: #ccccff;
}
  
/* regular box */

.box {
  border: 1px solid #999999;
  padding: 0px 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  background-color: #000019;
  text-align: center;
  color: #ccccff;
  font-size: 8pt;
}
.box h3 {
  text-decoration: none;
}
.box ul {
  margin: 10px 0px 10px 0px;
  padding: 0px;
  list-style:none;
}
.box ul p {
  font-weight: bold;
  display: block;
  background: black;
  border: 2px ridge white;
  margin: 12px 0px 3px 0px;
  padding: 1px 0px;
}
.box ul a {
  display: block;
  background: #121212;
  padding: 4px 0px;
  border: 1px solid #404040;
  margin: 3px 8px;
}
.box ul a:hover {
  background: #252525;
  text-decoration: none;
  color: #ccccff;
  border: 1px solid #777;
}

/*
gallery styling
===================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/slides.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
===================================================================
*/

.photo {padding:5px; background:#000019; width:466px; text-align:left; margin-left:auto; margin-right:auto; border:1px solid #999999; color: #ccccff; font-size: 8pt;}

/* that makes the photo div 476/478 px wide, 466px for contents
.photo h1 {font-size:11px; font-weight:bold; color:white; margin:0 0 0 5px; padding:0;}
below: pictures are 80x63, with 4px margins + 1px borders, leaving 70x53 for the picture itself (allowing for IE)
*/

.photo ul {list-style:none; padding:0px; margin:0px; width:240px; position:relative;}

.photo ul li {display:inline; width:72px; height:55px; float:left; margin:4px; background:url(graphics/click.gif);}
.photo ul li a {display:block; width:72px; height:55px; text-decoration:none;}

.photo ul li a img {display:block; width:70px; height:53px; border:1px solid #999;}
.photo ul li a span {display:none;color:white;}
.photo ul li a:hover {white-space:normal; position:static; cursor:crosshair;}

.photo ul li a.vert:hover img {position:absolute; top:4px; left:245px; width:165px; height:220px; border-color:white;}
.photo ul li a.hor:hover img {position:absolute; top:4px; left:245px; width:216px; height:162px; border-color:white;}

.photo ul li a:active, .photo ul li a:focus {position:static; outline:30;}

.photo ul li a:focus.vert img, .photo ul li a:active.vert img {position:absolute; left:10px; top:-85px; width:450px; height:600px; border:2px ridge white;}
.photo ul li a:focus.hor img, .photo ul li a:active.hor img {position:absolute; left:-75px; top:-85px; width:600px; height:450px; border:2px ridge white;}

.photo ul li a:focus.vert span, .photo ul li a:active.vert span {display:block; position:absolute; width:452px; height:22px; border:1px solid white; top:522px; left:10px; background:black; font-weight:normal; font-size: 12px; padding-top: 4px; text-align: center;}
.photo ul li a:focus.hor span, .photo ul li a:active.hor span {display:block; position:absolute; width:602px; height:22px; border:1px solid white; top:372px; left:-75px; background:black; font-weight:normal; font-size: 12px; padding-top: 4px; text-align: center;}
