body
{
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      font: normal 11px Verdana, Arial, Helvetic, sans-serif;
      text-align: center;
      background-color: #FFECBF;
  behavior: url('files/csshover.htc'); /* WinIE behavior call */
}

/* debug = paragraph */
p
{
      /*border: 1px dotted navy;*/
}

/* Replacement for the normal paragraph when images are floated near the texts
      (IE6 doesn't show them correctly! */
.par
{
      padding-bottom: 10px;
      /*border: 1px dotted red;*/
}

div#page-frame
{
      position: relative;
      width:770px;
      margin-left: auto;
      margin-right: auto;
      text-align: left;
}

div#main-border
{
      position: absolute;
      z-index: 1;
      top: 10px;
      right: 0px;
      width: 770px;
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      background-color: #FFF7E8;
      border: 2px solid #7088B0;
      _height: 630px;
      /*    let op: _height is een HACK voor IE
            min-height is een property die IE niet kent en Mozilla FF wel
            door de underscore snapt FF het niet en wordt de property genegeerd.. terwijl IE het denkt te snappen..
      */
      min-height: 230px;
  voice-family: "\"}\"";
  voice-family: inherit;
}
html>body #main-border
{
  height: auto; /* Hack voor IE of Firefox om hoogte aan te passen */
}

/* Header styles */
div#head
{
      position: absolute;
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      z-index: 2;
  width: 770px;
  height: 100px;
      color: FF0000;
      background-color: #4D5F8C;
}

.desc-text
{
      font-size: 110%;
      padding-bottom: 10px;
}

.head-text
{
      float: left;
      /*text-align: center;*/
      margin-top: 35px;
      margin-left: 5px;
      width: 350px;
      color: #FFFFFF;
      font-weight: bold;
      font-size: 250%;
      font-variant: small-caps;
      /*font-style: oblique;*/
      border: 0px solid blue
}

.head-archive-pic
{
      float: left;
      border: 0px;
}

.head-text3
{
      color: #E7EFF8;
      font-weight: bold;
      font-size: 120%;
      font-variant: small-caps;
}

/* Top menu styles */
.top-menu
{
      position: absolute;
      z-index: 2;
  width: 770px;
  top: 95px;
  right: 0px;
  text-align: right;
      padding: 4px 0 4px 0;
      background-color: #3A486B;
      /*border-bottom: 2px solid #7088B0;*/
      color: #E7EFF8;
}

.top-menu ul
{
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      text-align: right;
}

.top-menu ul li
{
      list-style: none;
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      display: inline;
}

.top-text-left
{
      float: left;
      top: 0px;
      margin-left: 4px;
      text-align: left;
      /*border: 1px dotted yellow;*/
      font-weight: bold;
      font-size: 90%;
      width: 60%;
}

.top-text-right
{
      float: right;
      top: 0px;
      margin-right: 4px;
      text-align: right;
      /*border: 1px dotted yellow;*/
      color: white;
      font-weight: bold;
      font-size: 90%;
      width: 30%;
}

.top-menu a
{
      color: #E7F5F5;
      padding: 0px 10px 0px 5px;
      border-right: 2px solid #E7EFF8;
      text-decoration: none;
      font-weight: bold;

}

.top-menu li a.no-border
{
      border-right: 0px;
      padding-right: 2px;
}

.top-menu li a:hover
{
      color: #FF8000;
}

/* Left menu styles */
div#left-menu
{
      position: absolute;
      float: left;
      top: 124px;
      left: 4px;
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      width: 124px;
      margin: -1px 0 0 -1px;
}

div#menu-title
{
      margin: 2px;
      height: 14px;
      color: #FFFFFF;
      text-decoration: none;
      text-align: center;
      font-weight: bold;
      background-color: #4D5F8C;
}

div#left-menu ul
{
      margin: 0 0 0 0;
      padding: 0 0 0 0;
      width: 130px;
      background: #F5F5F5;
      border: 2px solid #7088B0;
}

div#left-menu ul.level2
{
      background: #F5F5F5;
}

div#left-menu ul.level3
{
      background: #F5F5F5;
}

div#left-menu li
{
      position: relative;
      list-style: none;
      margin: 0 0 0 0;
  border-bottom: 1px solid #7088B0;
}

div#left-menu li.noborder
{
  border-bottom: 0px solid #7088B0;
}

div#left-menu li:hover
{
      /*background-color: #CEDFF1;*/
}

div#left-menu li.submenu
{
      background: url('submenu.gif') no-repeat 95% 50%;
}

div#left-menu li:hover.submenu
{
      /*background-color: #CEDFF1;*/
}

div#left-menu li a
{
      display: block;
      text-decoration: none;
      width: 124px;
      color: #3A486B;
      font-weight: bold;
      border-left: 0px solid #BBBBBB;; padding-left:4px; padding-right:0; padding-top:2px; padding-bottom:2px
}

div#left-menu li a:hover
{
      color: #FF8000;
}

div#left-menu>ul a
{
      width: auto;
}

div#left-menu ul ul
{
      position: absolute;
      top: 0px;
      left: 128px;
      _left: 124px;
  display: none;
}

div#left-menu ul.level1 li:hover.submenu ul.level2, div#left-menu ul.level2 li:hover.submenu ul.level3
{
      display:block;
}

/* Footer styles */
div#footer
{
      position: absolute;
      z-index: 2;
      margin: 0 0 0 0;
      padding: 2px 0 2px 0;
      bottom: -1px;
      width: 770px;
      border-top: 1px solid #888888;
      height: 20px;
      background-color: #3A486B;
      /*border-bottom: 2px solid #7088B0;*/
      font-size: 90%;
      font-weight: bold;
      color: #E7EFF8;
}

/* Extra space below footer */
div#below-footer
{
      position: absolute;
      z-index: 2;
      left: 0px;
      bottom: -20px;
      width: 770px;
}

/* Extra attention givers... */
div#stats
{
      margin: 0 0 0 1px;
      padding: 0 0 0 0;
      width: 128px;
      background-color: blue;
      border: 1px solid black;
}

div#main
{
      top: 130px;
      margin: 0 0 0 0;
      padding: 123px 4px 20px 0px;
      width: 770px;
      color: black;
      border: 0px solid pink;

      min-height: 100px;
  voice-family: "\"}\"";
  voice-family: inherit;
}
html>body #main
{
  height: auto; /* Hack voor IE of Firefox om hoogte aan te passen */
}


div#border-content
{
      margin: 0px 2px 0 140px;
      padding: 0px 5px 5px 5px;
      _padding: 10px 5px 5px 5px;
      background-color: #F5F5F5;
      border: 2px solid #7088B0;

      min-height: 100px;
  voice-family: "\"}\"";
  voice-family: inherit;
}
html>body #border-content
{
  height: auto; /* Hack voor IE of Firefox om hoogte aan te passen */
}


div#border-content h1
{
      font-size: 110%;
      padding: 0 2px 0 2px;
      height: 16px;
      background-color: #7288B4;
      color: #FFF3DD;
      border: 1px solid #7088B0;
}

div#border-content h2
{
      font-size: 140%;
      font: Verdana, Arial, Helvetic, sans-serif;
      padding: 0 0 5px 0;
      color: black;
      font-weight: bold;
}

div#border-content h3
{
      font-size: 120%;
      font: Verdana, Arial, Helvetic, sans-serif;
      padding: 0 35 5px 50;
      color: black;
}

div#border-content h4
{
      font-size: 90%;
      font: Verdana, Arial, Helvetic, sans-serif;
      color: black;
}

div#border-content a
{
      padding: 2px 0 2px 0;
  text-decoration: none;
      color: #006699;
      font-weight: bold;
}

div#border-content a:hover, a:active
{
      color: #FF8000;
}

/* Game list table styles */
.gl-table
{
      font-size: 100%;
      width: 611px;
      _width: 601px;
      border-top: 1px solid #7088B0;
      border-left: 1px solid #7088B0;
}

.gl-label1, .gl-label2, .gl-label3
{
      float: left;
      padding: 2px 2px 2px 4px;
      background-color: #006699;
      color: white;
      font-weight: bold;
      border-left: 1px solid #7088B0;
      border-bottom: 1px solid #7088B0;
}

.gl-value1-odd, .gl-value2-odd, .gl-value3-odd,
.gl-value1-even, .gl-value2-even, .gl-value3-even
{
      float: left;
      padding: 2px 0px 2px 6px;
      color: #006699;
      border-right: 1px solid #7088B0;
      border-bottom: 1px solid #7088B0;
}

.gl-label1, .gl-value1-odd, .gl-value1-even
{
      width: 300px;
}

.gl-label2, .gl-value2-odd, .gl-value2-even
{
      width: 198px;
      _width: 200px;
}

.gl-label3, .gl-value3-odd, .gl-value3-even
{
      width: 92px;
      _width: 100px;
}

.gl-value1-odd, .gl-value2-odd, .gl-value3-odd
{
      background-color: #CEDFF1;
}

.gl-value1-even, .gl-value2-even, .gl-value3-even
{
      background-color: white;
}

.gl-tr
{
      clear: both;
}

div#paging
{
      text-align: center;
      color: #006699;
      font-weight: bold;
      font-size: 110%;
}


/* Game Detail screen */
div#game-detail-content
{
      padding: 5px 5px 5px 5px;
      margin: 0px 0px 0px -2px;
      height: 100px;
      background-color: white;
      border: 1px solid #7088B0;

      /*min-height: 100px;*/
  voice-family: "\"}\"";
  voice-family: inherit;
}
html>body #game-detail-content
{
  height: auto; /* Hack voor IE of Firefox om hoogte aan te passen */
}

/* Picture styles: */
.pict1
{
      float: right;
      background-color: #F5F5F5;
      border: 1px solid #F5F5F5;
      padding-left:10px;
      padding-right:5px;
      padding-top:1px;
      padding-bottom:1px
}

.pict2
{
      float: left;
      background-color: #F5F5F5;
      border: 1px solid #F5F5F5;
      padding-left:5px;
      padding-right:10px;
      padding-top:1px;
      padding-bottom:1px
}



/* Game detail table styles */
.gd-table
{
      font-size: 110%;
      width: 430px;
      /*border: 1px dotted green;*/
}

.gd-label
{
      float: left;
      width: 150px;
      padding: 2px 2px 2px 4px;
      font-weight: bold;
}

.gd-value
{
      float: left;
      padding: 2px 2px 2px 6px;
}

.gd-tr
{
      clear: both;
}

/* Game Detail scans styles: */
/*div#gd-scans-area*/
.gd-scans-area
{
      float: left;
      width: 600px;
      /*border: 1px dotted red;*/
}

/* these styles are for the pictures and texts below the main details: */
.gd-pic-comment
{
      width: 280px; /* fix for IE humbug: width in IE is minus padding.. so 290 - 5 - 5 */
      _width: 290px; /* FF works ok.. and the _width is ignored in FF */
      padding: 5px 5px 5px 5px;
      margin-left: 0px;
      margin-right: 5px;
      margin-bottom: 3px;
      float: left;
      background-color: white;
      font-size:100%;
      /*border: 1px dotted green;*/
}

.gd-boxes-comment
{
      width: 590px; /* fix for IE humbug: width in IE is minus padding.. so 290 - 5 - 5 */
      padding: 5px 5px 5px 5px;
      margin-left: 0px;
      margin-right: 5px;
      margin-bottom: 3px;
      float: left;
      background-color: white;
      font-size:100%;
      /*border: 1px dotted green;*/
}

.gd-manuals
{
      width: 135px; /* fix for IE humbug: width in IE is minus padding.. so 290 - 5 - 5 */
      _width: 145px; /* fix for IE humbug: width in IE is minus padding.. so 290 - 5 - 5 */
      padding: 5px 5px 5px 5px;
      margin-left: 0px;
      margin-right: 0px;
      margin-bottom: 3px;
      float: left;
      background-color: white;
      font-size: 100%;
      /*border: 1px dotted green;*/
}

.gd-scans-right, .gd-boxes-right2, .gd-boxes-right1
{
      padding: 5px 5px 5px 5px;
      background-color: white;
      float: right;
      border: 1px solid #7088B0;
}

.gd-scans-left
{
      padding: 5px 5px 5px 5px;
      margin-right: 3px;
      background-color: white;
      float: left;
      border: 1px solid #7088B0;
}

.gd-scans
{
      padding: 5px 5px 5px 5px;
      background-color: white;
      float: right;
      border: 1px solid #7088B0;
}

.box-comments
{
      margin-left: 260px;
}

.manual-pageno
{
      margin: 0px 0px 3px 5px;
}

/* styles for the <hr>: */
hr
{
      text-align: right;
      width: 100%;
      height: 2px;
      color: #006699;
      border: none;
} /* For Internet Explorer */

html>body hr
{
      clear: both;
      margin-right: 0;
      width: 100%;
      height: 2px;
      background-color: #006699;
      border: 0px solid #006699;
} /* For Opera and Gecko-based browsers */

/* Styles for news items with pictures: */
.news-area
{
      float: left;
      width: 600px;
      /*border: 1px dotted red;*/
}


.news-border-right
{
      float: right;
      margin: 0px 5px 0px 0px;
      _margin: -10px 5px 0px 0px;
      padding: 5px 5px 5px 5px;
      background-color: white;
      border: 1px solid #7088B0;
}

.news-border-left
{
      float: left;
      margin: 0px 5px 0 0px;
      _margin: -10px 5px 0 0px;
      padding: 5px 5px 5px 5px;
      background-color: white;
      border: 1px solid #7088B0;
}

/* form styles: */

label
{
      float: left;
      width: 25%;
      margin-right: 10px;
      padding-top: 3px;
      text-align: right;
}

fieldset
{
      padding: 10px;
      border: 1px solid #7088B0;
      /*background-color: #CEDFF1;*/
}

input.btn {
      margin-left: 0px;
      _margin-left: -130px;
      border: 2px outset #7088B0;
      background-color: #CEDFF1;
}

.input, .textarea
{
      border: 1px solid #7088B0;
      padding: 0px 0px 0px 4px;
      margin: 0px 0px 4px 0px;
      _margin: 0px 0px 3px 0px;
      background-color: white;
}

.error
{
      color: red;
      font-weight: bold;
}