body {
   font: Verdana, Tahoma, Arial, sans-serif;
   padding: 0;
   margin: 0;
   background: url("html/images/cfplus.png");
   background-repeat: repeat;
}

/* Top menu */
div#menu {
   height: 2em;
   text-align: center;
}

#playlink {
   font-size: x-large;
   text-align: center
}

.box {
   margin: 1em;
   padding: 1ex;
   border: 1ex solid #800;
   background: #ff0;
   font-size: large;
   color: black;
}

.box a {
   background: #ccc;
   padding: 0.3ex;
   border: 0.3ex solid #800;
}

.box a:hover {
   background: #fff;
   padding: 0.3ex;
   border: 0.3ex solid #f00;
}

#menu {
   width: 100%;
   height: 2em;
}

#menu ul, ul ul {
   border-bottom: 3px solid black;
   background-image: url("html/images/outline.png");
   padding-left: 0;
   cursor: default;
   margin: 0;
   line-height: 2em;
   display: inline;
}

#menu ul li {
   display: inline;
   list-style-type: none;
   margin: 0;
   position: relative;
   color: #fff;
}

#menu ul li > ul {
   display: none;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
}

#menu ul li:hover, ul li.hilight {
   background-color: #ffa;
   color: #000;
}

#menu ul ul.show {
   display: block;
}

#menu ul li:hover > ul {
   display: block;
}

#menu ul li a {
   color: #fff;
   width: 100%;
   text-decoration: underline;
}

#menu ul li a:hover, ul li a.hilink {
   color: #000;
}

#menu ul li:hover > a {
   color: #000;
}

/* Menus inside the top menu */
ul.inmenu, ul.inmenu ul {
   border-left: 3px solid black;
   border-right: 3px solid black;
   text-align: left;
}

ul.inmenu li a {
   color: #fff;
   display: block;
}

/* The sidebars */
div#bar-left {
   position: absolute;
   top: 2em;
   bottom: 0;
   width: 2em;
   background-image: url("html/images/outline.png");
   border-right: 3px solid black;
}

div#bar-right {
   position: absolute;
   top: 2em;
   bottom: 0;
   right: 0;
   width: 2em;
   background-image: url("html/images/outline.png");
   border-left: 3px solid black;
}

#bar-right img {
   float: right;
   padding-bottom: 1em;
   width: 2em;
}

#bar-left img {
   float: left;
   padding-bottom: 1em;
   width: 2em;
}

/* The server gauge box */
div#server {
   width: 7em;
   height: 10em;
   border: 3px solid #99c;
   position: absolute;
   right: 2.5em;
   top: 2.5em;
   background-color: #333;
   color: #ccc;
}

#server p {
   position: absolute;
   left: 1em;
   text-align: center;
}

#server img {
   float: left;
}

#server b {
   color: #0f0;
}

#server a {
   color: #ff0;
}

/* Contents windows */
div.window {
   position: absolute;
   top: 3em;
   left: 3em;
   right: 3em;
   background-image: url("html/images/background.png");
}

div.cborder-top {
   float: top;
   background-image: url("html/images/border_x.png");
   width: 100%;
   height: 16px;
   color: white;
   font-size: small;
   text-align: center;
}

div.cborder-bottom {
   position: absolute;
   background-image: url("html/images/border_x.png");
   width: 100%;
   height: 16px;
   bottom: 0;
}

div.cborder-left {
   position: absolute;
   background-image: url("html/images/border_y.png");
   width: 16px;
   height: 100%;
   left: 0;
}

div.cborder-right {
   position: absolute;
   background-image: url("html/images/border_y.png");
   width: 16px;
   height: 100%;
   right: 0;
}

/* Inside the contents windows */
p,table {
   margin-left: 2em;
   margin-right: 8em;
   color: white;
}

a {
   color: green;
}

a:visited {
   color: yellow;
}

a:hover {
   color: #0f0;
}

div.window img {
   margin-left: 3em;
}

p.date {
   color: yellow;
   font-style: italic;
}

p.date a {
   color: red;
}

ul li {
   margin-left: 1em;
   margin-right: 8em;
   color: white;
}

ol {
   list-style-type: none;
}

h1,h2,h3,h4 {
   color: #0ff;
   text-align: center;
}

h1 a {
   color: #0ff;
   text-align: center;
}

pre {
   padding: 0.5em;
   border: 2px solid black;
   background: #ddd;
   color: black;
   font-size: small;
   font-family: Bitstream Vera Sans Mono, Andale Mono, monospace;
   margin-left: 2.5em;
   margin-right: 2.5em;
}