body {
    background-repeat:repeat-y;
    background-color:#3882a9;
    background-image:url(roltileftback.jpg); 
	text-align: center;
	width: 780px; margin: auto; padding: 0;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	}

a {text-decoration: none; color: #ffffff; font-variant:small-caps}

a:hover {color: #a4cadf;}


	}
	



/* Page starts here. The #container ensures that the content remains within the 
specified perimeters. */

#container {width: 780px; margin: 0 0 0 0; padding: 0; text-align: left;}

/* The header and the top navigation. */

#header {width: 780px; height: 130px; text-align: left; margin-top: 20px; float: left;}

.nav {
	width: 180px; height: 130px; margin: 0 10px 0 0;
	float: left;  border-right: 1px dotted #fff;
	}
	
.nav ul {
	margin: 0; padding: 0 20px 0 20px ; 
	list-style-type: none;
	}
	
.nav ul li {
	padding: 5px 0 5px 0; display: block; border-bottom: 1px dotted #fff; 
	font-size: 8pt; color: #ffffff; line-height: 1.6em; 
	}
	
	/* The li:hover effect only works with Firefox and similar browsers, but looks nice, nevertheless. 
	IE users will simply not see any changes. */

.nav ul li:hover {
	background-color: #13628c;
	}

.title {
	float: left; margin: 0 10px 0 0;
	width: 300px; height: 130px; border-right: 1px dotted #fff;
	}
	
.logo {	float: left; background: url(logo.png) left no-repeat; height: 78px; width: 130px;}

h1 {
	float: left; 
	padding: 20px 0 0 0;
	color: #fff; font-weight: normal; font-size: 13pt; text-transform: uppercase; 
	}

/* This is the image. */
#middle_zonwering {
	float: left; width: 780px; height: 228px; 
	background: url(zonwering.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_markiezen {
	float: left; width: 780px; height: 228px; 
	background: url(markiezen.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_rolluiken {
	float: left; width: 780px; height: 228px; 
	background: url(rolluiken.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_screens {
	float: left; width: 780px; height: 228px; 
	background: url(screens.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_horren {
	float: left; width: 780px; height: 228px; 
	background: url(horren.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}

#middle_home {
	float: left; width: 780px; height: 228px; 
	background: url(home.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_contact {
	float: left; width: 780px; height: 228px; 
	background: url(contact.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}
#middle_about {
	float: left; width: 780px; height: 228px; 
	background: url(about.jpg) top left no-repeat; border: 1px solid #fff;
	text-align: left; margin-top: 20px;
	}

/* Column content. "#left" controls the general area, while ".block" controls each individual entry. */

#left {
	float: left; width: 250px; height: 80px;
	background: url(afspraak.png);
	text-align: left; 
	}

		/* Below is an example of how you can incorporate images into text. */

h3.left {
	background: url(circle.jpg) left no-repeat; height: 25px; padding: 7px 0 0 35px;
	font-size: 10pt; color: #fff; font-weight: bold; text-transform: uppercase;
	}

.block {
	width: 300px; padding-bottom: 20px;
	}

.block ul {
	margin: 0; padding: 0 20px 0 20px; 
	list-style-type: none;
	}
	
.block ul li {
	padding: 10px 0 10px 0; display: block; border-bottom: 1px dotted #fff; 
	font-size: 8pt; color: #fff; line-height: 1.6em; 
	}
	
.block ul li:hover { background-color: #626a73;}

/* The right content, where the main content is held. "#right" controls the general area, ".content" controls
each individual entry, "entryfooter" controls the bottom of each entry.*/

#right {
	float: right; width: 450px; 
	text-align: justify; 
	}

h2 {
	font-size: 13pt; color: #fff; font-weight: normal; 
	}
	
h2.main {
	font-size: 16pt; color: #fff;   line-height: 1.6em; font-weight: normal;
	
	}
	
h3 {
	font-size: 7pt; color: #fff; font-weight: normal; 
	text-transform: uppercase;
	}

.content {
	width: 450px; 
                line-height: 1.4em;
	font-size: 8pt; color: #fff; 
	}
	
.entryfooter {
	width: 450px; 
	text-align: right;
	}

/* End of the stylesheet. I hope you enjoyed it. */