/*
CSS document: layout.css
Project: Hans Warnars Reportagefotografie
Design by: hbwConsultants - Bennebroek - The Netherlands www.hbwconsultants.nl
Media: screen, projection;
Last mod.: 03-08-2006
*/

body {
background: #000;
margin: 10px 0 20px 0;
font-family: Verdana, Tahoma, Arial, sans-serif;
font-size: 76%;
color: #d2d2d2;
text-align: center;  /* IE fix */
}

/* ========== global layout ========== */
#container {
width: 780px;
background: inherit;
margin: 0 auto;
text-align: left;  /* cancel IE fix */
}
#middle_img {
width: 780px;
height: 151px;
clear: both;
background: #000 url(../img/bg_middle_img.jpg);
margin: 0;
padding: 0;
}
#contentwrapper {
width: 780px;
margin: 0;
padding: 20px 0;
font-size: 100%;
}
#content {    /* 1-collumn pages */
width: 780px;
margin: 30px 0 20px 0;
padding: 0;
font-size: 100%;
}

#up {
width: 780px;
clear: both;
margin: 0 0 10px 0;
padding: 0;
text-align: right;
}
#footer {
width: 780px;
clear: both;
border-top: 1px solid #717171;
padding: 7px 0 0 0;
margin: 0;
font-size: 95%;
}
#footer_l {
width: 290px;
float: left;
color: #a8a8a8;
}
#footer_m {
width: 200px;
float: left;
font-size: 95%;
color: #a8a8a8;
text-align: center;
}
#footer_r {
width: 290px;
float: right;
font-size: 95%;
color: #a8a8a8;
text-align: right;
}

/* ========== index, contact, disclaimer, privacy ========== */
.home #header, .nieuws #header, .contact #header, .disclaimer #header, .privacy #header {
width: 580px;
height: 191px;
float: left;
background: #000 url(../img/bg_header.gif) top left no-repeat;
}
.home #nav, .nieuws #nav, .contact #nav, .disclaimer #nav, .privacy #nav {
width: 200px;
height: 191px;
background: #000 url(../img/bg_nav.jpg);
float: right;
}
.home #left_coll {
width: 160px;
float: left;
margin: 0 0 20px 0;
padding: 0 10px 0 0;
}
.home #mid_coll {
width: 310px;
float: left;
margin: 0 0 20px 0;
padding: 0 10px 0 10px;
}
.home #right_coll {
width: 270px;
float: right;
margin: 0 0 20px 0;
padding: 0;
}

/* ========== layout bruidsfotografie, bedrijfsfotografie ========== */
.bruidsfotografie #header, .bedrijfsfotografie #header {
width: 780px;
height: 100px;
background: #000 url(../img/header2.png) top left no-repeat;
margin: 0;
padding: 0;
}

.bruidsfotografie #contentwrapper, .bedrijfsfotografie #contentwrapper {
width: 780px;
margin: 0;
padding: 0;
font-size: 100%;
}

.bruidsfotografie #left_coll, .bedrijfsfotografie #left_coll, .contact #left_coll {
width: 480px;
float: left;
margin: 20px 0 0 0;
padding: 0;
line-height: 1.4em;
}

.bruidsfotografie #right_coll, .bedrijfsfotografie #right_coll, .contact #right_coll {
width: 280px;
float: right;
margin: 0 0 20px 20px;
padding: 0;
}
#right_coll #nav, .bedrijfsfotografie #right_coll #nav {
width: 280px;
height: 191px;
background: #000 url(../img/bg_nav2.png) top left no-repeat;
float: right;
margin: 0;
}
.bruidsfotografie #right_content, .bedrijfsfotografie #right_content {
width: 210px;
margin: 20px 0 0 70px;
}
/* ========== layout nieuwspagina ========== */
.nieuws #contentwrapper {
width: 780px;
margin: 0;
padding: 0;
font-size: 100%;
}

.newsitem {
width: 780px;
margin: 20px 0 50px 0;
padding: 0;
font-size: 100%;
line-height: 1.4em;
}
/* ========== layout fotoalbum ========== */
#fotoalbum #container {
  background: transparent;
  width: 920px;
  height: 520px;
  margin: 0 auto;
}
#fotoalbum #header {
  background: #000 url(../img/logo_fotoalbum.png) top left no-repeat;
  height: 30px;
  margin: 10px 0 0;
}
#fotoalbum #footer {
width: 920px;
clear: both;
border-top: 1px solid #717171;
padding: 7px 0 0 0;
margin: 0;
font-size: 95%;
}
#fotoalbum   #footer_l {
  width: 307px;
  float: left;
  color: #a8a8a8;
  }
#fotoalbum   #footer_m {
  width: 306px;
  float: left;
  font-size: 95%;
  color: #a8a8a8;
  text-align: center;
  }
#fotoalbum   #footer_r {
  width: 307px;
  float: right;
  font-size: 95%;
  color: #a8a8a8;
  text-align: right;
  }
/* ========== used for clearing floats in a wrapper  ========== */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline /*inline-block*/;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */