* { margin: 0; }
html { background: url(../img/bg/html.gif) repeat-y top #fc0; }

body {
	background: url(../img/bg/body.gif) no-repeat top;
    font: 12px Arial, Helvetica, sans-serif;
    color: #222;
	}

h1, h2 { margin: 0 0 10px; line-height: normal; }
h1 { font: 18px "Calibri" Arial, Helvetica, sans-serif; color: #930000; letter-spacing: -1px; text-align: left; }
h2 { font-size: 15px; font-style: italic; }
a { color: #930000; text-decoration: none; }
a img { border: 0; }
input, textarea, select { font: 10px Arial, Helvetica, sans-serif; color: #222; text-transform: uppercase; border: 0; }

#container {
	width: 960px;
    padding: 40px 0 0;
    margin: auto;
    }
    #container .contentbottom { width: 960px; height: 20px; background: url(../img/bg/conent-bottom.png); }

#header {
	width: 960px;
    height: 160px;
    background: url(../img/bg/header.png);
	}
    #header a { text-indent: -9999px; float: left; }
    #header ul { list-style: none; float: left; }
    #header ul li { display: inline; }
    #header a.logo { width: 234px; height: 79px; margin: 42px 0 0 42px; background: url(../img/bg/logo.png); cursor: pointer; }
    #header .menu { padding: 110px 0 0 53px; }
    #header .menu li a { height: 40px; margin: 0 10px 0 0; background: url(../img/bg/menu.gif); }
    #header .menu .schade a { width: 145px; }
    #header .menu .schade a:hover { background-position: 0 -40px; }
    #header .menu .uitdeuk a { width: 110px; background-position: -145px 0; }
    #header .menu .uitdeuk a:hover { background-position: -145px -40px; }
    #header .menu .voorbeeld a { width: 134px; background-position: -255px 0; }
    #header .menu .voorbeeld a:hover { background-position: -255px -40px; }
    #header .shortcut { padding: 114px 0 0 118px; }
    #header .shortcut li a { width: 32px; height: 32px; margin: 0 8px 0 0; display: block; background: url(../img/icons/shortcut.gif); }
    #header .shortcut .home a:hover { background-position: 0 -32px; }
    #header .shortcut .contact a { background-position: -32px 0; }
    #header .shortcut .contact a:hover { background-position: -32px -32px; }

#content {
	width: 960px;
    background: url(../img/bg/content.gif) top;
    line-height: 20px;
    overflow: hidden;
    }
    #content p { padding: 0 0 20px; }
 
#left {
	width: 280px;
    padding: 19px 20px 0;
    border-top: 1px solid #fff;
	float: left;
	}
    #left a.bedrijf { width: 268px; height: 163px; padding: 7px 0 0 12px; margin: 0 0 20px; display: block; background: url(../img/bg/bedrijf.jpg); color: #fff; }
    #left a:hover.bedrijf { color: #a6c5e9; }
    #left .ms { width: 280px; height: 122px; margin: 0 0 20px; display: block; background: url(../img/bg/mission-statement.jpg); text-indent: -9999px; }
    #left .naw { background: url(../img/icons/naw.gif) no-repeat 0 2px; }
    #left .telefoon { background: url(../img/icons/telefoon.gif) no-repeat 0 2px; }
    #left .email { margin: 0 0 0 -30px; padding: 0 0 20px 30px; background: url(../img/icons/email.gif) no-repeat 0 2px; float: left; }
    #left .route { background: url(../img/icons/route.gif) no-repeat 0 2px; font-style: italic; }
    #left a { color: #222; }
    #left p { padding: 0 0 20px 30px; clear: both; }
    #left p a:hover { border-bottom: 1px dotted #000; }

#right {
	width: 600px;
    padding: 20px 20px 0;
    text-align: justify;
    float: left;
    }
    #right p a:hover { border-bottom: 1px dotted #000; }
    #right .links { width: 600px; height: 59px; padding: 20px 0 0; margin: 0 0 20px; background: url(../img/bg/links-kader.gif); list-style: none; text-align: center; }
    #right .links li { display: inline; margin: 0 20px; }
    #right .contact { width: 600px; height: 179px; background: url(../img/bg/contact.gif) no-repeat bottom; position: relative; clear: both; }
    #right .contact h3 { margin: 0 0 0 10px; font: 20px "Calibri" Arial, Helvetica, sans-serif; color: #999; text-transform: uppercase; letter-spacing: -1px; }
    #right .contact .naam       { width: 164px; height: 11px; padding: 8px; background: url(../img/bg/contact-veld.gif); position: absolute; bottom: 112px; left: 20px; }
		#right .contact .textnaam      {
	padding: 0px;
	position: absolute;
	bottom: 136px;
	left: 20px;
	color: #CCCCCC;
}
    #right .contact .telnum { width: 164px; height: 11px; padding: 8px; background: url(../img/bg/contact-veld.gif); position: absolute; bottom: 66px; left: 20px; }
		#right .contact .textnum      {
	padding: 0px;
	position: absolute;
	bottom: 90px;
	left: 20px;
	color: #CCCCCC;
}
    #right .contact .email      { width: 164px; height: 11px; padding: 8px; background: url(../img/bg/contact-veld.gif); position: absolute; bottom: 20px; left: 20px; }
		#right .contact .textmail      {
	padding: 0px;
	position: absolute;
	bottom: 44px;
	left: 20px;
	color: #CCCCCC;
}
    

    #right .contact .bericht { width: 344px; height: 104px; padding: 8px; background: url(../img/bg/contact-textarea.gif); position: absolute; bottom: 20px; right: 20px; overflow: auto; }
    #right .contact .btn { padding: 0; width: 78px; height: 28px; background: url(../img/bg/contact-btn.gif); position: absolute; bottom: 24px; right: 24px; cursor: pointer; }
    #right .contact .naam:focus, #right .contact .woonplaats:focus, #right .email:focus, #right .bericht:focus, #right .contact .btn:hover { background-position: bottom left; }
    #right .contactform { height: 159px; margin: 0 0 20px; }
    #right iframe { padding: 0; border: 1px solid #222; width: 598px; height: 300px; overflow: hidden; }

#footer {
	width: 620px;
    padding: 20px 0 20px 340px;
    color: #8e4601;
    font-size: 10px;
    text-transform: uppercase;
    line-height: 15px;
	}
    #footer a:hover { border-bottom: 1px dotted #000; }

.imgr { margin: 0 0 0 20px; float: right; }