/*
Title: 		
Updated: 	
Version: 1.0
Author: yse
*/

* {margin: 0; padding: 0;}

body { 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 13px;
	text-align:center;
	background: #150803 url('../img/body.bg.jpg') no-repeat top center;
	overflow-x: hidden; 
	
}
a:focus { outline: none; }

table  td { border: 1px solid #CCC;}

img { border: 0;}
hr { display:none; }

#wrapper {width: 880px;margin: 0 auto;text-align:left; margin-bottom: 20px; position:relative;}

a { color:#4f749b }

ul { margin: 1em 2em;}

.large { font-size: 16px;font-family:"Lucida Grande", "Lucida Sans","Lucida Sans Unicode","Lucida Console",Verdana;width: 90%;background: #FFF;}

/* header
------------------------------------------------------------- */

#header { background: url('../img/new-header.jpg') no-repeat top left; display: block; height: 254px; }

/*
Versie 1
#header { background: url('../img/header.jpg') no-repeat top left; display:block; height: 255px;}
*/

#header a { display:block; height: 0 !important; padding: 255px 0 0 0; overflow:hidden; float:left;}
	#header #b-home { width: 700px; }
	#header #b-contact { width: 120px; margin: 0 0 0 60px; }

#main { background: url('../img/main.bg.gif') repeat-y top left; min-height: 400px; _height: 400px; padding: 20px 80px; font-family: Georgia, "Times New Roman", Times, serif; color: #5B5B5B; line-height: 1.5em; font-size: 12px; }

/*
#pencil { position:absolute; top: 140px; _top: 140px; background:url('../img/full-pencil.png') no-repeat top left; _background:url('../img/pencil.gif') no-repeat top left; width: 572px; height: 202px; right: -168px; _right: -168px; z-index: 1; }
*/
#pencil { position:absolute; top: 247px; _top: 247px; background:url('../img/pencil.gif') no-repeat top left; width: 221px; height: 90px; right: -168px;}




/* mainnav
------------------------------------------------------------- */
#mainnav { clear:both; height: 67px; margin-bottom: 10px; position: relative; z-index: 50; }
#mainnav ul { list-style: none; margin:0; padding:0;}
#mainnav ul li{ float:left; display:block; list-style:none;}
#mainnav a{ float:left; height: 0 !important; padding: 67px 0 0 0; overflow:hidden;}
#mainnav a:hover, #mainnav li.active a, #mainnav li a.active { background-position: 0px -67px;}

#li-wat a{ background:url('../img/nav/wat.gif') no-repeat top left; width:96px;}
#li-fietsverkeer a{ background:url('../img/nav/fietsverkeer.gif') no-repeat top left; width:145px;}
#li-waarom a{ background:url('../img/nav/waarom.gif') no-repeat top left; width:108px;}
#li-omleidingsweg a{ background:url('../img/nav/omleidingsweg.gif') no-repeat top left; width:194px; margin-left: 10px;}
#li-proute a{ background:url('../img/nav/p-route.gif') no-repeat top left; width:113px;}


#p-fietsverkeer #visual1 { float:left; margin-left: -240px; margin-right: 20px;}
#p-fietsverkeer .block { padding-left: 160px;}
#p-fietsverkeer #visual2 { float:right; margin-right: -40px;}

#omleidingsweg { float:left; margin-left: -116px; margin-right: 20px;}
/*#p-omleidingsweg .block { width: 725px;}*/

#psign { float:right; margin-right: -94px; margin-top: -54px;}

#p-home #visual1 { float:right; margin-right: -76px; margin-top: -43px; }
#p-home #voorbeeld{ float:left; margin-left: -305px; margin-top: -30px; margin-right: 20px;}
#p-home .block2 { padding-left: 240px; margin-bottom: 40px; padding-bottom: 30px;}
#button-beleidsplan { margin-right: -10px; float:right; margin-top: -20px;}

#p-p-route #visual1 { float:left; margin-left: -110px; margin-right: 20px;}
#p-p-route .block {margin-bottom: 40px;}
#p-p-route #button-ab { margin-right: -66px; float:right; margin-top: -47px;}
#p-p-route #main { padding-bottom: 60px;}

#directions-table { border-collapse:  collapse; }
	#directions-table td { padding: 15px;border:0; }
	#directions-table ul { list-style: none; margin:0; padding:0;}
	#directions-table ul li { padding: 2px 0;}
	#directions-table td.td-map { padding:0;}
	
	#directions-table a.active { color: #B63D60; font-weight: bold;}
	
	#directions-a { background: url('../img/arrow.png') no-repeat 100% 50px; }

#knelpunt { background:url('../img/knelpunt.bg.gif') no-repeat top left; width: 627px; height: 224px; padding: 40px 50px 60px 60px; font-size: 11px; }
	#knelpunt-txt { height: 220px; overflow:auto; margin-bottom: 5px;}

#button-topics { float:right; margin-right: -44px; margin-top: 10px;}

.readmore { float:right;}

#block-detail { width: 803px; height: 604px; background:url('../img/detail_vergroten.gif') no-repeat top left; margin-left: -21px;  position:relative;}
	#main-title { margin-top: -20px; height: 38px; margin-left: 11px; }
	#block-about { width: 310px; padding: 90px 0 0 40px;}
	#block-about-txt { width: 315px; overflow:auto; height: 400px; padding-right: 5px;}
	
	#block-forum { position:absolute; top: 340px; left: 430px; width: 350px; height: 232px; overflow:auto;  }

.comment { border-bottom: 1px dotted #CCC; padding-bottom: 5px; margin-bottom: 10px;}
	.comment-title { background:none; padding:0; font-weight:bold;font-size: 11px; }
	.comment-meta { color: #2B949B; font-style:italic; font-size: 10px;}
	.comment-meta strong {background:none;  color: #990000;}
	
#detail-pics { position:absolute; top: 27px; right: 69px;}
#detail-nav { margin-left: -40px; margin-top: 17px;}

#toondetail:focus { border:0;}
#toondetail { display:block; width: 122px; height: 45px; position: absolute; top: 0px; right: 295px; z-index:99999;}
#toondetail span { display:none;}	


.block2 ul li { margin-left: 2em;}
/* site
------------------------------------------------------------- */
.clr {clear:both;}
h1,h2, h3 { color: #01828A; font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Console", Verdana; font-size: 19px; font-weight:bold;  margin-bottom: .5em;  }

h2 { color: #B63D60; font-size: 16px; letter-spacing: -1px; }
	h2 span { background-color:#B63D60; color: #FFF; padding: 3px;}
	h2.comment_title a { text-decoration: none; color: #B63D60;}
	h2.comment_title a:hover { background: #B63D60; color: #FFF;border-bottom: 3px solid #B63D60; }
	h2.comment_title a:hover span { background-color: #FFF; color: #B63D60;}
h3 { color: #01828A; font-size: 13px; margin-bottom:0;}

p { margin-bottom: 1em;}

strong { background-color:#FFFFDD; padding: 3px;}

.block { padding: 15px 10px; background:#FFF; margin-bottom: 20px; }
.block.overflow {_overflow:hidden; _width:700px; }

/* footer
------------------------------------------------------------- */

#footer { clear:both; color: #CCC; position: relative;font-size: 10px; }
	#footer a { color: #999; text-decoration: none;}
	#footer a:hover {color: #FFF;}
	#footer p { padding: 5px 40px;  text-align: right;}

#footerlogo { position: absolute; left: 50px; top: 10px;}

/* forms
------------------------------------------------------------- */
form, fieldset, input,select,textarea { }
fieldset {border:0;}
legend {display:none;}
input, textarea {}
input:hover, input:active, input:focus, textarea:hover, textarea:active, textarea:focus { }

.input { padding-bottom: 5px;}
.input label { display:block; font-weight:bold;}
.input input, .input textarea { width: 450px; padding: 3px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;}
.input textarea { height: 11em;}
.error { color: #990000;}

	.error input, .error textarea { border: 1px solid #990000;}
.error-message { font-size: 10px; color: #999999}

.input label em { color: #990000;}

.submit { padding-top: 10px; }
	.submit input { background: #1B3E7D; color: #FFF; border:0; padding: 5px; font-size: 13px; }

.nb-fietsverkeer { }
	.nb-fietsverkeer #js-message { color:#ff0e57 }
	.nb-fietsverkeer .col { float:left; width: 175px;}
	.nb-fietsverkeer #js-submit { background: #1B3E7D; color: #FFF; border:0; padding: 3px; margin-top: 15px; }



/* splash
------------------------------------------------------------- */
#splash {
	background: url('../img/splashscreen_2.jpg') no-repeat;
	display: block;
	width: 880px;
	height: 0 !important; /* 764px */;
	padding: 614px 0 0 0;
	overflow: hidden;
}

#splashtxt { width: 630px; background: #813911; color: #FFF; padding: 20px; margin: 0 auto;}

#pencil-splash { position:absolute; top: 20px; _top: 20px; background:url('../img/full-pencil.png') no-repeat top left; width: 572px; height: 202px; right: -80px; _right: -80px; z-index: 1; }