body {
  background: black;
  font-family: arial;
  font-size: 10pt;
}


/* ---------------------------- Overall Layout Styles ------------------------------- */

#container {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -500px;
/*  width: 100%; */
  width: 1000px;
  _width: 1000px;
  min-width: 1000px;
}

#minWidthHack {
  /* Was hoping this would work in IE, but unfortunately there's nasty
     canvase-size issues which I can't figure out. I can't get this
     working in Firefox either, but Firefox has min-width, so I don't
     need it in Fx. Oh well...
   */
  display: block;
  height: 1px;
  width: 500px;
  background: green;
}

#minHeightHack {
  height: 348px;
  width: 2px;
  float: left; display: inline;
}

#header {
  position: absolute;
  background: black url(images/mainHeaderBackground.jpg);
  height: 155px;
  width: 100%;
}
  #header .part1 {
    position: absolute;
    background: url(images/header1.jpg);
    width: 263px;
    left: 0px;
    height: 100%;
  }
  #header .part2 {
    position: absolute;
    background: url(images/header2.jpg);
    width: 530px;
    right: 207px;
    height: 100%;
  }
  #header .part3 {
    position: absolute;
    background: url(images/header3.jpg);
    width: 207px;
    right: 0px;
    height: 100%;
  }

#menubarStrip {
  position: absolute;
  top: 155px;
  width: 100%;
  height: 54px;
  background: #0e0d7d url(images/menubar/mainBackground.jpg) repeat-x;
  background-position: left bottom;
  z-index: 2;
}
  #menubarStrip .left {
    position: absolute;
    background: black url(images/menubar/leftSide.jpg) no-repeat;
    width: 150px;
    left: 0px;
    height: 100%;
  }
  #menubarStrip .right {
    position: absolute;
    background: black url(images/menubar/rightSide.jpg) no-repeat;
    width: 109px;
    right: 0px;
    height: 100%;
  }

#menubar {
  position: absolute;
  width: 741px;
  left: 150px;
  height: 54px;
}

#menubar a {
  display: block;
  color: white;
  height: 25px;
  font-size: 90%;
}
#menubar a:hover {
  background: #0e0d7d;
  text-decoration: underline;
}

#menubar .menuItem {
  position: absolute;
  overflow: visible;
}

#menubar .menuItem img {
  position: absolute;
}

#menubar .textMenuItem {
  margin: 0 0 0 35px;
  display: inline;
  position: relative;
  overflow: visible;
}
#menubar .textMenuItem a { display: inline; padding-bottom: 20px; }
#menubar .textMenuItem a:hover { background: transparent; }
#menubar .textMenuItem .popupMenu { position: absolute; }

#menubar .popupMenu {
  position: absolute;
  left: auto;
  top: 24px;
  width: 150px;
  background: #0e0d7d;
  filter:alpha(opacity=75);
  opacity: 0.75;
  -moz-opacity: 0.75;
  padding-bottom: 10px;
}

#menubar .popupMenu ul {
  list-style-type: none;
  list-style-position: outside;
  margin: 0;
  padding: 0;
}

#menubar .popupMenu li {
  _border-bottom: 1px solid #0e0d7d;
  margin: 0;
  padding: 0;
  text-align: center;
  font-variant: small-caps;
}

#menubar .popupMenu a {
  display: block;
  width: 100%;
  height: auto;
  color: white;
  text-decoration: none;
  padding: 4px 0px 4px 0px;
  font-size: 100%;
}

#menubar .popupMenu a:hover {
  background: #3b3597;
  text-decoration: none;
}

#leftSide {
  position: absolute;
  left: 0px;
  top: 209px;
  width: 263px;
  height: 341px;
  background: black url(images/leftSide.jpg) no-repeat;
  z-index: 1;
}


#middle {
  position: absolute;
  top: 209px;
  left: 150px;
  right: 109px;
  background: white;
  _width: 741px;
  z-index: 0;
}

#content {
  margin-left: 113px;
  margin-right: 98px;
  color: rgb(100,100,100);
  text-align: justify;
  margin-bottom: 65px; /* Space to clear #logosBox */
}

#logosBox {
  position: absolute;
  height: 60px;
  bottom: 0px;
  width: 530px;
  _right: 100px; /* only for single logo; only in IE */
  text-align: right; /* "center" for multiple logos */
}
#logosBox img {
  margin-right: 40px;
}

#rightSide {
  position: absolute;
  width: 207px;
  height: 320px;
  background: black url(images/rightSide.jpg) no-repeat;
  right: -109px;
  _right: -110px;
  bottom: 0px;
  z-index: 1;
}


#footer {
  position: absolute;
  background: black url(images/mainFooterBackground.jpg) repeat-x;
  margin-top: 200px;
  bottom: -200px;
  left: -150px;
  right: -109px;
  height: 200px;
  _width: 1000px;
  background-color: black;
}
  #footer .part1 {
    position: absolute;
    overflow: visible;
    background: url(images/footer1.jpg) no-repeat;
    width: 500px;
    left: 0px;
    height: 100%;
    z-index: 2;
  }
  #footer .part2 {
    position: absolute;
    background: url(images/footer2.jpg) no-repeat;
    width: 500px;
    right: 0px;
    height: 100%;
    z-index: 1;
  }
  

#quoteBoxTable {
  font-size: 110%;
  color: white;
  width: 500px;
  margin: -16px 0 0 250px;
  text-align: center;
  font-variant: small-caps;
  height: 70px;
}
#quoteBox {
  vertical-align: middle;
}

#quoteBox p * {
}


/* --------------------------- Generic Element Styles ----------------------------- */

h1 {
  font-variant: small-caps;
  font-weight: bold;
  font-size: 160%;
  color: rgb(15,10,128);
}

h2 {
  font-variant: small-caps;
  font-weight: bold;
  font-size: 140%;
  color: rgb(15,10,128);
  width: 85%;
  margin-bottom: 25px;
  border-bottom: 2px solid rgb(15,10,128);
}

h3 {
  font-size: 110%;
  font-weight: bold;
  font-variant: small-caps;
  letter-spacing: 1px;
  margin-bottom: 4px;
}

h4 {
  font-size: 100%;
  font-weight: bold;
  font-variant: none;
  margin-top: 7px;
}

table {
  border-collapse: collapse;
  margin-left: 1px;
  border: 0;
}
td, th {
  text-align: center;
  border-bottom: 1px solid #777;
}
td.button {
  text-align: left;
}
table .left {
  text-align: left;
}

table.login td {
  text-align: left;
}

table.evenOdd tr.even td, table.evenOdd tr.odd td { border: none; }

table.evenOdd tr.odd { background: #f1f1f1; }
table.evenOdd tr.even { background: white; }

table.plain td, table.plain th { border: none; }

table.fullWidth {
  width: 99%;
  clear: right;
}


form table .left { text-align: left; }
form table * { text-align: left; }
form td, th {
  padding: 4px;
  background: rgb(229,228,233);
}
form th.left {
  background: rgb(8,37,139) url(images/formTopLeft.jpg) no-repeat left top;
  padding-left: 18px;
}
form th.right { background: rgb(8,37,139) url(images/formTopRight.jpg) no-repeat right top; }
form tr.last td.left { background: rgb(8,37,139) url(images/formBottomLeft.jpg) no-repeat left top; }
form tr.last td.right { background: rgb(8,37,139) url(images/formBottomRight.jpg) no-repeat right top; }
form th {
  font-size: 90%;
  letter-spacing: 1.5px;
  color: white;
  height: 18px;
  background: rgb(8,37,139);
}
form tr.last td {
  height: 18px;
  background: rgb(8,37,139);
}

input.text, input.ordinal, input.file, textarea.textarea, select, input.file, input.password {
  width: 20em;
  padding: 2px;
  border: 1px inset #777;
}
input.button {
  width: auto;
  _padding: 0 1px 0 10px;
}



a { color: #0e0d8d; text-decoration: none; }
a:hover { background: #eef; }
a:visited { color: #482d9d; }
a:active { background: #ccf; }

img {
  border: none;
}


/* --------------------------- Specific Content Styles ----------------------------- */

.mauiDetails {
  /* text-align: left */
}

table.address td {
/*  float: right; */
  padding: 0px;
  padding-right: 4px;
  padding-top: 3px;
}
td.address {
  text-align: left;
}

.quoteText {
  font-style: italic;
  font-weight: bold;
}

p.comment, p.description {
  margin-top: 6px;
}

.author, .detail, .email, table.address, .date {
  display: block;
  font-size: 90%;
  padding: 5px 0 5px 0;
}
.label {
  font-weight: bold;
}

p.screenres {
  display: inline;
}

.caption {
  display: inline;
  font-weight: bold;
}

.name {
  font-size: 120%;
  font-weight: bold;
}

.resources {
  margin-top: 10px;
}

.resourceThumbnail {
  float: right;
  padding: 0 0 10px 10px;
}

.resourceThumbnail a:hover {
  background: transparent;
}

.resourceThumbnail.showPic, .resourceThumbnail.video, .resourceThumbnail.wallpaper, .resourceThumbnail.music, .resourceThumbnail.PDF {
  float: none;
}

.resourceThumbnail.PDF {
  float: none;
  padding: 0;
}

.resourceThumbnail.PDF a:hover {
  background: #eef;
}

.infoMessage {
  padding: 5px;
  background: #faeaea;
  border: 1px solid #bbb;
}

a.actionLink {
  float: right;
}