/*-------------------------------------------------------
Cascading Style Sheet for Dispuutscaramouche.nl
Created by Hugo Meeuwes
-------------------------------------------------------*/

/*------MAIN Body-------*/
body
{
    margin-left: 0px;
    margin-top: 5px;
    margin-right: 0px;
    margin-bottom: 5px;
    background: #fff url(img/back.jpg) repeat-x 100% 0  ;
    color: #000000;
    font-family: Verdana;
    font-size: 10pt;
}
table.body  {
  width:995px;
  padding:0px;
}  
    
/* om png bestanden in IE goed transparant te maken */
/* plaatje moet mbv img tag waarin ook height en width (geen css) staan neergezet worden */
/* behaviour is door MS voor DHTML ontworpen, het wordt door elke normale browser genegeerd*/
/* een normale browser kan zo en zo wel met transparante png omgaan*/
/* voor wie het wil weten, een htc file is een xml file met erin javascript*/ 
img { behavior: url("scripts/pngbehavior.htc"); }

a:link, a:visited {
  text-decoration:none;
  font-family:  Verdana, Arial, Helvetica;
  color:#000000;
}
a:hover{ color:#f00;}

/*------Header----------*/
div.header {
  position: relative;
  width: 995px;
  height: 200px;
  /*Bij voorkeur zou de header img een achtergrond zijn van deze div,*/
  /*dit kon hier alleen niet ivm transparantie script png afbeelding (zie elders)*/
  overflow: hidden; /*Nu moet dit wel om <img> afbeelding div niet te laten verpesten.*/ 
}

/*------Spacer links (1e kolom) en rechts (5e kolom) (om body recht onder koplogo te houden)-----*/
td.sidespace {  width:50px; vertical-align: top;}
div.minheight { min-height: 450px; }

/*------Menubalk (= linker balk, 2e kolom)--------*/
td.menu {
  width: 150px;
  background: /*#fff4f4;*/ #ffcccc;
  height:100%;
  padding:0px;
  border-left: solid 1px #f00;
  border-right: solid 1px #f00;
  vertical-align: top;
  text-align:left;
  overflow: hidden;
}

/*------Rechter balk (4e kolom)----*/
td.rechts {
  width: 150px;
  background: #fff4f4;
  vertical-align:top;
  height:450px;
  border-right: solid 1px #f00;
  text-align: left;
  overflow:hidden;
}

/*------Middle vlak (3e, middelste kolom)--------*/
td.midden {
  width: 594px;
  margin-top: 0px;
  
  float: center;
  background: #fff4f4;
  vertical-align: top;
  border-right: solid 1px #f00;
}

/*------Bottombalk (valt onder 2e t/m 4e kolom en tussen 1e en 5e)--------*/
td.bottom {
  height: 1px;
  width: 895px;
  background: #f00;
}

/*- Menu - */
  
div.menu {
  overflow: hidden;
  width: 150px;
}
div.menuItem {
  background: #ffcccc;
  border-bottom: solid 1px #f00;
  padding: 5px 0px 5px 5px;
  width: 145px;
  font-weight: bold;
  cursor:pointer;
  behavior: url(scripts/hover.htc);  
}
div.menuItem:hover, div.menuItem.hover {
  background: #ffaaaa;
  padding-left: 8px;
  width: 142px;
  overflow: hidden;
}

a.menuItem {
  color: #000000;
  font-family: Verdana;
  font-size: 10pt;
  text-decoration: none;
  font-weight: bold;
}
a.menuItem:hover {               
  color:#f00;
}

h1  {
  color: #ffff;
  font-family: Arial;
  margin-bottom: 0px;
  margin-top: 0px;
  font-size: 24px;
  display: block;
  border-bottom: 1px dotted #f00;
}

/*Content*/
div.content {
	border: none 0px;
	margin: 4px;
	width: 584px;
	overflow: hidden;
}

/*Alles binnen td rechts*/
#fotos {
  position: absolute;
	width: 148px;
	overflow:hidden;
	height: 450px;
	border-right: 1px solid #f00;
	border-bottom: 1px solid #f00;
}  
div#login {
  position: absolute;
  background: #ffcccc; 
	top: 0px; left:0px;
	border: 0px solid #f00;
	height:64px; width: 148px;
  overflow:none;
  border-bottom: solid 1pt #f00;
  font-size: 8pt;
  overflow: none;
}

input.login {
  font-size: 8pt;
  background: #fff4f4;
  border: inset 1px #f99;
}

.headerfoto div { position: absolute; left: 0; top: 0; }

.headerfoto{
	position: absolute;
	top: 0px;
	border: 0px none;
	height: 150px;	width: 150px;
}



div#foto1 {
	position: absolute;
	top: 0px; left:0px;
	border: 0px solid #f00;
	background: url(fotostrip/image.php?c=1);
	height:150px; width: 149px;overflow:hidden;
}

div#foto2 {
	position: absolute;
	top: 150px; left:0px;
	border: 0px solid #f00;
	background: url(fotostrip/image.php?c=2);
	height:150px; width: 149px;overflow:hidden;
}

div#foto3 {
	position: absolute;
	top: 300px; left:0px;
	border: 0px solid #f00;
	background: url(fotostrip/image.php?c=3);
	height:150px; width: 149px;overflow:hidden;
}
/*----*/