

html 
{ 
  background: #444;
  font-size: 75%;
}

body {
 font-family: "courier new" courier monospace;
 text-align: center;
/* font-size: 90%; */
}

* {
 padding: 0;
 margin: 0; 
 color: #444 ;
}

* { 
 background: transparent;
}

/* header styles */
#header {
  clear: left;
  float: left;
  width: 100%;
  text-align: center;
  padding: .2em 0 0 0;
/*  overflow: hidden; */
  font-size: 400%;
  height: 170px;
/* border-bottom: 4px solid #000; */
}

#header a:hover { border: 2px dotted #893333; }

#header a 
{ 
  text-decoration: none;
  display: block;
  position: absolute;
  left: 280px; 
  top: 50px;
  width: 700px;
  height: 120px;
  }

#header p,
#header h1,
#header h2 
{
  clear:left;
  float:left;
  width:96%;
  margin:0;
  padding:.4em 2% .1em 2%;
  }

#header ul 
{
  clear:left;
  float:left;
  width:96%;
  margin:.7em 0 0 2%;
  padding:0;
  list-style:none;
  }

#header ul li 
{
  display:inline;
  }

#header ul li a 
{
  display:block;
  float:left;
  list-style:none;
  padding:.2em .5em;
  text-decoration:none;
  margin-right:10px;
  border-top:1px solid #ddd;
  border-left:1px solid #ddd;
  border-right:1px solid #ddd;
  }

#header ul li a.active 
{
  font-weight:bold;
  color:#fff;
  border-top:1px solid #000;
  border-left:1px solid #000;
  border-right:1px solid #000;
  }

#container { 
    width: 1200px ;
    margin: 0 auto ;
    position: relative ;
    background-image: url(beeld/achtergrond.jpg); 
    background-repeat: no-repeat;
}

/* column container */
.colmask 
{
/*
  clear:both;
  float:left;
  overflow:hidden;
*/
  margin: 0 auto;
  width: 1000px;
  text-align: left;
}
/* common column settings */
.colright,
.colmid,
.colleft 
{
  float:left;
  width:100%;				/* width of page */
  position:relative;
}

.col1,
.col2,
.col3 
{
  float:left;
  position:relative;
  padding: 1em 0; /* no left and right padding on columns, we
                     just make them narrower instead only
                     padding top and bottom is included here,
                     make it whatever value you need */
  overflow:hidden;
}

.col1 { padding: 3pt; }
.col1 img { float: right; padding: 10px; }
.col1 p {  padding-bottom: 1em; }
.col1 h1, h2, h3 {  color: #893333; }
.col1 h1 {  font-size: 160%; margin: 0 0 10pt 0; }
.col1 h2 {  font-size: 130%; margin: 0 0 7pt 0; }
.col1 h3 {  font-size: 100%; margin: 0 0 3pt 0; }
.col1 ul {  list-tyle-type: disc; margin: 0 0 1em 0; }
.col1 ul li { margin: 0 0 0 20px; }

/* 3 Column settings */
.threecol {
}
.threecol .colmid 
{
  right:18%;				/* width of the right column */
}
.threecol .colleft 
{
  right:62%;				/* width of the middle column */
}
.threecol .col1 
{
  width: 62%;		/* width of center column content (column width minus padding on either side) */
  left: 100%;		/* 100% plus left padding of center column */
}
.threecol .col2 
{
  width:18%;				/* Width of left column content (column width minus padding on either side) */
  left:18%;				/* width of (right column) plus (center column left and right padding) plus (left column left padding) */
}
.threecol .col3 
{
  width:18%;				/* Width of right column content (column width minus padding on either side) */
  left:82%;				/* Please make note of the brackets here:
                                           100% - left column width) plus (center column left and right padding) plus (left column left and right padding) 
                                           plus (right column left padding) */
}

/* Footer styles */
#footer {
 clear:both;
 padding:1em 2%;
/* border-top:1px solid #ccc; */
}

th, td { vertical-align: top; font-size: 12px; }
th 
{  
/*  border-top: 1px dotted red;
  border-bottom: 1px solid #444; */
}

th.h { text-align: right; font-weight: normal; padding: 4pt; } 

td.h 
{ 
/* border-top: 1px dotted red;
 border-bottom: none; 
 border-right: none;
 border-left: 1px dotted #444; 
*/
 }

td.h input, td.h textarea 
{ 
/*  border: none; */ 
    border-top: none;
    border-right: none;
    border-left: 1px dotted #444;  
    border-bottom: 1px dotted #444;  
  }

td.h textarea 
{ border-left: 1px dotted #444;  }

table#feedback 
{ 
 margin: 20px 0; border-spacing: 1px; 
}

table#feedback th
{ text-align: left; padding-right: 1em; }

table#guestbook 
{ 
 border-top: 1px dotted #893333;
 border-bottom: 1px dotted #893333;
 border-spacing: 1px; 
}

table#guestbook th,
table#guestbook td
{ text-align: left; padding: 2px 0.5em; }


.col2-1,
.col2-2,
.col2-3 { float: right }
.col3-1,
.col3-2,
.col3-3 { float: left }

.col3-2 { padding-left: 18px ; }

.col2 a { display: block; }
.col2 a, .col3-a { text-align: center;  }

div.main { padding: 0 2em; height: 620px; overflow: auto; }

.main-text { line-height: 180%; }

.main-text.bestel { line-height: 100%; }

div.icoon a img 
{
  border: 0; 
  padding: 16px 8px; 
}
div.icoon 
{
}
div.icoon a:link,
div.icoon a:visited,
div.icoon a:hover,
div.icoon a:active
{ color: #969420; text-decoration: none; font-weight: bold; }

div.icoon a:hover { color: white; }

div.icoon a { color: #969420; }

/* padding-left: 4em; } */

.alert {  color: red; }

td.h p img,
td.h p { margin: 0; padding: 0; }

td.h p img { display: block; float: left; padding: 6px 0; }
