/* ================================================================
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/menus/flyoutt.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any
way to fit your requirements.
=================================================================== */

table {
  border-collapse:collapse;
  border:0;
  margin:0;
  padding:0;
  }

.menu ul li a.hide, .menu ul li a:visited.hide {
  display:none;
  }
.menu ul li a:hover ul li a.hide {
  display:none;
  }

.menu ul li a:hover {
  color:#000000; /* text kleur sub1 mouseover */
  background:#FFFF00; /*achtergrond kleur sub1 mouseover */
  border-left:5px solid #FF0000;
  border-right:5px solid #FF0000;
}
.menu ul li a:hover ul {
  display:block;
  position:absolute;
  top:0;
  left:104px;
  width:105px;
  }
.menu ul li a:hover ul li a.sub {
  background:#FFAA33; /* vaste kleur sub2*/
  color:#000000; /* vaste text kleur sub2 */
  }
.menu ul li a:hover ul li a {
  display:block;
  background:#FFFF00; /* achtergrond sub2 */
  color:#000000; /* text kleur sub2  */
  width:128px;}
.menu ul li a:hover ul li a ul {
  visibility:hidden;
  }
.menu ul li a:hover ul li a:hover {
  background:#333333; /* achtergrond sub2 mouseover */
  color:#FFFFFF; /* text kleur sub2 mouseover */
  }
.menu ul li a:hover ul li a:hover ul {
  visibility:visible;
  position:absolute;
  left:128px;
  top:0;
  color:#000;
}
.menu ul li a:hover ul li a:hover ul li a {
  display:block;
  width:128px;
  background:#FFAA33; /* achtergrond sub3 */
  color:#000; /* text kleur sub3 */
  }
.menu ul li a:hover ul li a:hover ul li a:hover {
  background:#333333; /* achtergrond sub3 mouseover */
  color:#FFFFFF; /* text kleur sub3 mouseover */
  border-left:5px solid #FF0000;
  }

/* ------------------------- LAYOUT ------------------------------------------*/
/*#container {
  position: relative;
  width:100%;
  height:100%;
  background:#000000;
  border:0px solid #000;
  margin:10px auto;
  border:0px solid green;
/*  overflow:hidden;*/
/*}*/

html {
height:100%;
max-height:100%;
padding:0;
margin:0;
border:0;
background:#000;
/*background-color: #E6E2DF;*/
font-size:90%;
font-family: georgia, verdana, 'palatino linotype', 'times new roman', serif;
color: #FFFFFF;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow: hidden;
/* */
scrollbar-arrow-color:white;
scrollbar-track-color:black;
scrollbar-darkshadow-color:black;
scrollbar-face-color:black;
scrollbar-highlight-color:white;
scrollbar-shadow-color:white;
}

body {
/*  background:#000;*/
  height:100%;
  max-height:100%;
  overflow:hidden;
/*  width:auto;*/
  padding:0;
  margin:0;
  border:0;
}

table {
  font-size:100%;
  font-family: georgia, verdana, 'palatino linotype', 'times new roman', serif;
  color: #FFFFFF;
}

#head {
  position:absolute;
  margin:0;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:120px;
  background: url(rainbow2.png) #000000;
  background-position: 0 0;
  background-repeat:repeat-x;
  font-size:1em;
  z-index:5;
  overflow:hidden;
  color:505050; /*#333333;*/
  border: 0px solid blue;
}

#footer {
  position:absolute;
  margin:0;
  bottom:0;
  left:0;
  display:block;
  width:100%;
  height:80px;
  text-align: center;
  font-size:1em;
  z-index:5;
  overflow:hidden;
  background: url(rainbow2.png) #000000;
  background-position: 0 0;
  background-repeat:repeat-x;
/*  background: rgb(76,76,76); /*opacity:.75;filter: alpha(opacity=75); -moz-opacity: 0.75;*/
  color:#fff;
  border: 0px solid blue;
}

#left {
  position:relative;
  left:0;
  top:100px;
  height:auto;
  bottom:50px;
  width:100px;
/*  width:375px;*/
/*  background: transparant; /*#000000;*/
/*    background:#000000;*/
/*  font-size:1.0em;*/
  z-index:5;
  overflow:hidden;
  /*background-repeat:no-repeat;*/
  border: 0px solid green;
}
#left:hover {
  width:375px;
}

* html #left {
    width:375px;
/*  height:100%;
  top:0;
  bottom:0;
  border-top:100px solid #fff;
  border-bottom:50px solid #fff;
  color:#fff;*/
}

#content {
  position:absolute;
  text-align:left;
  display:block; /* set up as a block */
  right:0px;
  left:130px;
  top:120px;
  bottom:100px;
  height:auto;
/*  width:auto;*/
  overflow:auto;
  z-index: 4;
  /*background: transparant;*/
  background: #000000; /*opacity:.75;filter: alpha(opacity=75); -moz-opacity: 0.75;*/
  padding: 25px;
  border: 0px solid red;
}

.pad {
display:block;
height:100%; /* height to miss header and footer */
}

* html #content { /*star hack voor IE */
/*  top:0;
  left:0;
  right:0;
  bottom:0;*/
  height:58%;
  width:80%;
/*  max-height:100%;
/*  width:100%;
  overflow:auto;
  position:absolute;
  z-index:3;
  border-top:100px solid #fff;
  border-bottom:50px solid #fff;
  border-left:200px solid #fff;*/
}

#content p {
  padding-left:25px;
/*  z-index:100;*/
}

.bold {
  font-size:1.2em;
  font-weight:bold;
}

dd {
  display:none;
}

/*a.nav, a.nav:visited {
  margin-left:50px;
  display:block;
  width:100px;
  height:25px;
  background:#aaa;
  color:#eee;
  border:1px solid #000;
  text-decoration:none;
  text-align:center;
  line-height:25px;
}*/

a.nav:hover {
  background:#000;
  color:#fff;
}


/*---------------- links -------------------*/

a:link {
  text-decoration:none;
  border-bottom: none !important;
  color:#3366ff;
/*  font-size:15px;*/
}

a:visited {
  color:#990000;
  text-decoration:none;
/*  font-size:15px;*/
}

a:hover {
  color:#FFEE00;
  text-decoration:underline;
/*  font-size:15px;*/
}

a:active {
  color:#6600CC;
  text-decoration:none;
/*  font-size:15px;*/
}

/*---------------- Transition effects -------------------*/
/*div.transOFF {width: 100%; background-color: border:0px solid black; }

div.transON {width: 100%; background-color: white;opacity:.75;filter: alpha(opacity=75); -moz-opacity: 0.75;border:0px solid black; }

div.trans25 {width: 100%; background-color: silver;opacity:.25;filter: alpha(opacity=25); -moz-opacity: 0.25;border:1px solid black; }

div.trans75 {width: 100%; background-color: silver;opacity:.75;filter: alpha(opacity=75); -moz-opacity: 0.75;border:1px solid black; }*/

.text {        /* ----- voor alle overige text -----*/
/*background-color:#F8F8F8;*/
/*color: #000000;*/
/*border:1px solid #006666;*/
font-size:08pt;
font-family:Verdana, sans-serif;
text-decoration:none;
}

.input {        /* ----- voor invul velden bijv bij: contact -----*/
background-color:#F8F8F8;
/*color: #000000;*/
border:1px solid #FFFF66;
font-size:08pt;
font-family:Verdana, sans-serif;
color: #8B0000;
text-decoration:none;
}

.input:focus {
  background-color: #ffff99  /*E8E8E8=lichtgrijs*/
}



/* ----- Alle buttons op de site mooi stylen ----- */

.button {
background-color:#F8F8F8;
border: 2px solid;
font-size:08pt;
font-family:Verdana, sans-serif;
text-decoration:none;
/*display: block;*/
border-color: #FFFF99 #FF9900 #FF9900 #FFFF99;
/*width: 8em;*/
/*background: #F8F8F8;*/
}

.button:hover {
background-color:#ffff99; /*E8E8E8=lichtgrijs*/
border: 2px solid;
font-size:08pt;
font-family:Verdana, sans-serif;
text-decoration:none;
/*position: relative;
top: 1px;
left: 1px;*/
border-color: #FF9900 #FFFF99 #FFFF99 #FF9900;
}

/* ----- Dus ook in IE want daar werkt hover niet ----- */

/* ----- Samen met javascript hoverButton in config_html.php ----- */

.button:hover, .over {
background-color:#ffff99; /*E8E8E8=lichtgrijs*/
border: 2px solid;
font-size:08pt;
font-family:Verdana, sans-serif;
text-decoration:none;
/*position: relative;
top: 1px;
left: 1px;*/
border-color: #FF9900 #FFFF99 #FFFF99 #FF9900;

}

textarea, select {     /* ----- voor invul velden bijv bij: contact -----*/
    background-color:#F8F8F8;
    border:1px solid #FFFF66;
    font-size:08pt;
    font-family:Verdana, sans-serif;
    /*color:#666666;*/
    overflow: auto;
/*    scrollbar-base-color:#F7F5F6;*/
    color:#000033;
    text-decoration:none;

}

textarea:focus {
  background-color: #ffff99
 }