/*
#
#	project : puurdenhaag.nl
#	version : v.1 (15-05-2009)
#   author  : Tim Honders
#
*/


/* ############## GENERAL ############# */

button {
	cursor: pointer;
}

.structural{
	display: block;
	text-indent: -9999px;
}

body {
	color: #000;
	font: 9pt 'verdana', sans-serif;
	background:#e0e1e2 url(images/bg.gif) no-repeat top center;
}

/* ############## HASLAYOUT FIX ############## */
.cont_block_top:after, .cont_block_bottom:after,
#events li:after, #route_locations:after,
#menu:after, #content div.block:after, .pri_content:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}


/* ############## CONTAINER ############## */
#container{
	position:relative;
	margin:0 auto;
	padding:0px 18px;
	width:978px;
	background:#fff;
	background:url(images/container_bg.png);
}


/* ############## HEADER ############## */
#header{
	width:978px;
	height:123px;
}
	#binnenstad{
		position:absolute;
		right:100px;
		width:168px;
		height:136px;
		background:url(images/binnenstad.png) no-repeat;
	}

	#header h1{
		display:block;
		float:left;

		margin: 0;
		padding: 0;
	}

	#header h1 a {
		margin:20px 0px 0px 13px;
		background:url(images/header_logo_pink.png) no-repeat;

		height:65px;
		width:423px;
	}

	#header #language{

		float:right;
		width:205px;
		height:123px;

		background:#a01065;

		margin-right:9px;
	}
		#language a{
			color:#000;
			text-decoration: none;
		}

/* ############## MENU ############## */
/* ## Width: 978px */

#menu_cont{
	margin:8px 9px 3px 9px;
	background:url(images/bg_menu.gif);
}

#menu{
	/*background:url(images/denhaag-logo.gif) no-repeat right top;*/
}
	#menu li{
		float:left;
		list-style-type: none;
	}

	#menu li a{
		display:block;
		color:#000;
		font-size: 8pt;
		text-decoration: none;
		text-transform: uppercase;
		text-align:center;
		padding:8px 10px 10px 10px;
		border-right:dashed 1px #000;
	}
		#menu a:active, #menu a:hover,#menu .active{
			color:#fff;
			border-right:dashed 1px #fff;
			background:url(images/btn_bg_home.gif);
		}

		#home a{background:url(images/bg_menu.gif);}
		#home a:active, #home a:hover,#home .active{background:url(images/btn_bg_home.gif);}
		#shoppen a{background:url(images/bg_menu.gif);}
		#shoppen a:active, #shoppen a:hover,#shoppen .active{background:url(images/btn_bg_shoppen.gif);}
		#uitgaan a{background:url(images/bg_menu.gif);}
		#uitgaan a:active, #uitgaan a:hover,#uitgaan .active{background:url(images/btn_bg_uitgaan.gif);}
		#eten a{background:url(images/bg_menu.gif);}
		#eten a:active, #eten a:hover,#eten .active{background:url(images/btn_bg_uit_eten.gif);}
		#cultuur a{background:url(images/bg_menu.gif);}
		#cultuur a:active, #cultuur a:hover,#cultuur .active{background:url(images/btn_bg_cultuur.gif);}
		#evenementen a{background:url(images/bg_menu.gif);}
		#evenementen a:active, #evenementen a:hover,#evenementen .active{background:url(images/btn_bg_evenementen.gif);}

		#menu #search{
			height:31px;
			float:right;
			padding-right:200px;
		}

		#search form{
			height:27px;
			padding:3px 5px;
		}

			#search form button{
				height:23px;
				width:22px;
				border:0px;
				background:url(images/btn_go2.gif) no-repeat center center;
				text-indent: -9999px;

			}

			#search form input{
				width:130px;
				margin:0px 5px;
			}

			#search form label{
				font-weight:bold;
			}
/* ############## CONTENT - LEFT BAR ############## */
/* ## Width: 214px */

#aside_primary{
	float:left;

	width:180px;
	min-height:800px;

	padding:0px 25px 0px 9px;

	font-size:8pt;

}
	#aside_primary h2{
		font-size:8pt;
		line-height:22px;
		text-align:center;
		text-transform: uppercase;
		background:#a01065;
		color:#fff;
	}

	#aside_primary h2.lbg{
		background:#af0a6b;
	}

	#aside_primary img{
		border:none;
		margin-bottom:5px;
	}

	#aside_primary #btn_up{
		height:12px;
		width:100%;
		background:#555557 url(images/btn_up.gif) no-repeat top center;
		cursor:pointer;
	}

	#aside_primary .pri_content{
		background:#555557;
		padding:7px;
		color:#fff;
	}

	#aside_primary #btn_down{
		height:12px;
		width:100%;
		background:#555557 url(images/btn_down.gif) no-repeat bottom center;
		cursor:pointer;
	}

	#aside_primary input, #aside_primary label{
		cursor:pointer;
	}

	#aside_primary .puurhaags{
		margin:3px 5px;
	}

	#aside_primary .spacer{
		display:block;
		height:32px;
		width:200px;

	}
	#aside_primary .banner{
		margin-botto:10px;
	}
/* ############## CONTENT - Breathcrumbs ############## */

#breathcrumbs{
	margin:0px;
	height:32px;
}

#breathcrumbs a{
	color:#000;
	font: 9pt 'verdana', sans-serif;
}

/* ############## CONTENT -- GENERAL ############# */
#content{
	float:left;
	width:550px;

	min-height:800px;
	background:#fff;
}
	#content #content_header, #content .news_header{
		width:550px;
		height:181px;
	}
		#content_header #header_block, .news_header .news_block{
			width:239px;
			height:159px;
			padding:11px 40px 11px 11px;
			background:url(images/block-banner2.png) no-repeat;
			color:#fff;
		}

		.news_header.uitgaan .news_block{background:url(images/block-banner-uitgaan.png) no-repeat;}
		.news_header.eten .news_block{background:url(images/block-banner-uit_eten.png) no-repeat;}
		.news_header.shoppen .news_block{background:url(images/block-banner-shoppen.png) no-repeat;}
		.news_header.cultuur .news_block{background:url(images/block-banner-cultuur.png) no-repeat;}
		.news_header.evenementen .news_block{background:url(images/block-banner-evenementen.png) no-repeat;}

	#content .news_block a{color:#fff;}

	#content a{color:#000;}

	#content div.block{
		width:550px;

		font-size:9pt;
		line-height:11pt;
	}

	#content div.block{
		color:#000;
	}

	#content div.block h2{
		display: block;
		text-indent: -9999px;

		width:550px;
		height:19px;
		margin:10px 0px 20px 0px;
	}


	#content div.uitgaan h2{background:url(images/h2_uitgaan.gif);}
	#content div.eten h2{background:url(images/h2_uit_eten.gif);}
	#content div.shoppen h2{background:url(images/h2_shoppen.gif);}
	#content div.cultuur h2{background:url(images/h2_cultuur.gif);}
	#content div.evenementen h2{background:url(images/h2_evenementen.gif);}

	#content #header_block h2, #content div.news_header h2{
		font-size:12pt;
		background:none;
		margin-bottom:5px;
	}

	#content .cont_block_bg{
		width:560px;
		height:163px;
	}

	#content .cont_block_content{
		color:#fff;

		width:258px;
		height:148px;

	}

	.cont_block_content p{
		font-size:8pt;
		line-height:8pt;
	}

	#content .cont_block_content a,#content #header_block a{
		color:#fff;
	}

	#content .cont_block_content h3{
		margin-top:5px;
		margin-bottom:5px;
		font-size:140%;
	}

	#content .cont_block_content a{
		text-decoration:none;
		margin:0px;
		padding:0px;
		font-size:8pt;
	}

	#content .cont_block_content div.dotedline{
		height:2px;
		width:157px;
		margin-top:3px;
		margin-bottom:1px;
		background:url(images/home_dot.gif);
	}

	#content div.right .cont_block_content{
		padding:15px 20px 0px 47px;
		float:right;
	}

	#content div.left .cont_block_content{
		float:left;
		padding:15px 47px 0px 20px;
	}

	#content div.shoppen .cont_block_content{background:url(images/block-shoppen.png) repeat-x top left;}
	#content div.eten .cont_block_content{background:url(images/block-eten.png) repeat-x top left;}
	#content div.uitgaan .cont_block_content{background:url(images/block-uitgaan.png) repeat-x top left;}
	#content div.cultuur .cont_block_content{background:url(images/block-cultuur.png) repeat-x top left;}
	#content div.evenementen .cont_block_content{background:url(images/block-evenementen.png) repeat-x top left;}

	#content .cont_block_top{padding-top:30px;}


	#detailcontent h2, #zoekencontent h2{
		color:#9F1065;
		font-size:20pt;
		margin-bottom:10px;
	}

	#detailcontent{
		margin-bottom:10px;
	}

	#detailcontent a{
		color:#000;
	}

	#zoekencontent a{
		color:#9F1065;
		font-weight:bold;
	}


	#content div.evenement h2{
		float:left;
		background:url(images/h2_evenementen.gif);
		color:#ed1c24;
		margin-bottom:10px;
	}
	#content div.evenement h3{
		font-size:120%;
		font-family:arial;
	}
	#content div.evenement div, #content .detail div{
		display:block;
		float:left;
		width:380px;
	}

	#content .detail div.logo{
		display:block;
		float:left;
		width:170px;
	}

	#content div.evenement img, #content .detail img{
		float:left;
		margin-right:10px;
	}

	#content .detail img{
		margin-bottom:10px;
	}

	#content .date{
		color:#a39662;
		text-transform: uppercase;
	}
	#content div.evenement a{
		color:#a39662;
	}
	#content div.dotline{
		float:left;
		height:1px;
		width:100%;
		background:url(images/title_dotted_line.gif)repeat-x bottom left;
	}

	#content .newsnumber{
		display:block;
		width:20px;
		height:20px;
		cursor:pointer;
		float:right;
		color:#9f1065;
		text-decoration:underline;

	}

	#content #breathcrumbs a{
		color:#000;
	}

/* ############## CONTENT - RIGHT BAR ############## */
/* ## Width: 214px */

#aside_secondary{
	float:right;

	width:180px;
	min-height:800px;

	padding:32px 9px 0px 25px;
}
	.scrollbar{
		overflow-y: auto;
		overflow-x: hidden;
		width:100%;
	}

	#aside_secondary .sec_content{
		padding:5px;
		width:170px;
		background:#555557;
		color:#fff;
		margin-bottom:3px;
	}

	#aside_secondary h2{
		width:174px;
		height:28px;
		margin:0;
		padding:5px 0px 0px 6px;

		font: 8pt 'arial', sans-serif;
		font-weight:bold;
		text-transform: uppercase;
		color:#fff;
	}

	#aside_secondary h2.laatst_bekeken {
		padding:0px;
	}

	#aside_secondary h2.laatst_bekeken a{
		display:block;
		padding:7px 0px 0px 6px;
		background:url(images/title_bg_laatst_bekeken.gif);
		height:21px;
		width:174px;

		font: 8pt 'arial', sans-serif;
		font-weight:bold;
		text-transform: uppercase;
		text-decoration:none;
		color:#fff;

	}



	#aside_secondary .zoek_een_locatie{
		padding:7px 0px 0px 6px;
		background:url(images/title_bg_zoeken_een_locatie.gif);
		height:51px;
		font: 8pt 'arial', sans-serif;
		font-weight:bold;
		text-transform: uppercase;
		color:#fff;
	}
		.zoek_een_locatie input{
			margin-top:7px;
			width:130px;
		}
	#aside_secondary h2.pink{background:url(images/title_bg_pink.gif);}
	#aside_secondary h2.green{background:url(images/title_bg_green.gif);}
	#aside_secondary h2.purpel{background:url(images/title_bg_purpel.gif);}
	#aside_secondary h2.orange{background:url(images/title_bg_orange.gif);}
	#aside_secondary h2.red{background:url(images/title_bg_red.gif);}
	#aside_secondary h2.blue{background:url(images/title_bg_blue.gif);}
	#aside_secondary h2.lightblue{background:url(images/title_bg_lightblue.gif);}
	#aside_secondary h2.brown{background:url(images/title_bg_brown.gif);}

	#aside_secondary ul{
		width:180px;
		margin-bottom:10px;
		padding-bottom:10px;
		background:#555557 url(images/title_dotted_line.gif) repeat-x bottom left;
	}
	#aside_secondary li{
		padding:0px 0px 0px 6px;
		list-style-type: none;
	}
	#aside_secondary a{
		font-size:7pt;
		text-decoration:none;
		text-transform: uppercase;
		color:#fff;
	}

	#aside_secondary #locations_list a{
		padding-left:10px;
	}

	#aside_secondary #locations_list a:hover{
		background:url(images/pijl.gif) no-repeat center left;
	}
	/*#aside_secondary #pink a{color:#7f0869;}
	#aside_secondary #green a{color:#cacf36;}
	#aside_secondary #purpel a{color:#34136e;}
	#aside_secondary #orange a{color:#f18f01;}
	#aside_secondary #red a{color:#ed1c24;}
	#aside_secondary #blue a{color:#003d79;}
	#aside_secondary #lightblue a{color:#12adb9;}*/

	#aside_secondary .sec_content a{
		text-transform:none;
		font-size:8pt;
	}

	#aside_secondary .sec_content ul, #aside_secondary .sec_content li{
		margin:0;
		padding:0;
		background:none;
		width:140px;
	}

	#aside_secondary #mandje{
	}

/* ############## FOOTER ############## */
#footer{
	width:960px;
	border-top:solid 1px #000;
	clear:both;
	text-align:center;
	margin:0px 9px;
	padding:10px 0px;
}
#footer a{
	margin:10px 20px;
	color:#000;
	font-weight:bold;
	text-decoration:none;

}

/* ############## GoogleMap ############## */


#map{
	width:550px;
	height:375px;
	overflow:hidden;
	margin-bottom:10px;
}

#map_expand_btn{
	width:550px;
	height:22px;

	padding-top:6px;

	cursor:pointer;
	background:url(images/bg_kaart_uitklappen.gif);

	font-size: 8pt;
	text-align:center;
	text-transform: uppercase;
	font-weight:bold;
	color:#fff;
}

#map a, #map b{
	color:#a01065;
	font-size:8pt;
}

#map .info{
	font-size:7pt;
}
/* ############## Events menu ############## */

#events, #events ul,  #events li  {
	list-style-type:none;
	margin: 0;
	padding: 0;
	width: 550px;
}

	#events div{
		background:url(images/title_bg_events.gif);
		cursor:pointer;
		padding:7px 15px;
		color:#fff;
		text-transform: uppercase;
		border-bottom:dashed 1px #fff;
	}
	#events ul li{
		padding:10px 0px;
		border-bottom:dashed 1px #000;
		margin: 0px 0px 15px 0px;
	}
	#events .date{
		color:#a39662;
		text-transform: uppercase;
	}
	#events a{
		float:left;
		width:100%;
		color:#a39662;
	}
	#events li p{
		float:left;
		font-size:8pt;
		line-height:20px;
	}
	#events li h3{
		font-size:120%;
		font-family:arial;
	}

/* ############## Route menu ############## */

#route_menu{
	height:30px;
	background:url(images/bg_menu.gif);
}
	#route_menu ul, #route_menu li{
		float:left;
		list-style-type: none;
	}

	#route_menu li a{
		display:block;
		color:#000;
		font-size: 8pt;
		text-decoration: none;
		text-transform: uppercase;
		text-align:center;
		padding:8px 10px 10px 10px;
		border-right:dashed 1px #000;
	}

	#route_menu li a:active, #route_menu li a:hover,#route_menu .active{
		color:#fff;
		border-right:dashed 1px #fff;
		background:url(images/btn_bg_route.gif);
	}

	#route_menu .mail{
		display:block;
		float:right;
		width:27px;
		height:16px;
		background:url(images/icon_mail.gif);
		text-indent: -9999px;
		margin:7px 15px 0px 0px;
	}

	#route_menu .print{
		display:block;
		float:right;
		width:27px;
		height:16px;
		background:url(images/icon_print.gif);
		text-indent: -9999px;
		margin:7px 15px 0px 0px;
	}

	#route_menu .help{
		display:block;
		float:right;
		width:22px;
		height:23px;
		background:url(images/icon_help.gif);
		text-indent: -9999px;
		margin:5px 15px 0px 0px;
	}

#route_locations{
	display:block;
	background:url(images/bg_route_points.gif) top left;
	border-top:dashed 1px #000;
	border-bottom:dashed 1px #000;
}


	#route_locations ul, #route_locations li{
		float:left;
		list-style-type: none;
	}

	#route_locations li{
		height:57px;
		width:100%;
		cursor:pointer;
	}

	#route_locations .pinkbg{
		background:#fde5f3;
	}

	#route_locations .arrows{
		float:left;
		height:42px;
		width:35px;
		padding:15px 0px 0px 5px;
	}

	#route_locations .adress{
		float:left;
		height:42px;
		width:430px;
		padding:15px 0px 0px 0px;
	}

	#route_locations .delete{
		float:right;
		height:32px;
		width:80px;
		padding:25px 0px 0px 0px;
	}

	#route_locations .delete a{
		color:#ec008c;
	}

#route_div{

}

#route_div table{
	border-top:dashed 1px #000;
	border-bottom:dashed 1px #000;
}

#route_div td{
	height:20px;
	padding:5px;
}

#route_div .nr, #route b{
	color:#ec008c;
	font-weight:bold;
}

#route_div td.point{
	font-weight:bold;
	height:40px;
	background:#fde5f3;

}

.form{
	display:block;
	width:500px;
	margin-top:10px;
}

	.form p{
		display:block;
		float:left;
		width:100%;
		height:30px;
		margin:0px 3px;
	}

	.form label{
		display:block;
		float:left;
		width:120px;
		font-weight:bold;
	}

	.form .input{
		display:block;
		float:left;
		width:250px;
	}