/***********
* BASE CSS
*/
.green {
	color: #3CB93B;; 
}
body, ol, ul, dl, table, th, td, fieldset, p,
h1, h2, h3, h4, h5, h6, blockquote, dd {
	margin: 0;
	padding: 0;}

.group:after {
	content: '.';
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;}

.group {
	zoom: 1;}

body, p, td, th, ul, ol, dl {
	font-size: 11px;}

p, ul, ol, dl, table {
	margin-bottom: 1em;}

a img {
	border: 0;}

label.error {
	color: #F00;
	font-weight: bold;}

input.error {
	border: 1px solid #F00;}

.feedback-success,
.feedback-error,
.feedback-warning,
.feedback-message {
	padding: 5px 10px;
	color: #000;
	border-width: 1px 0;
	border-style: solid;}

.feedback-success {
	border-color: #0F0;
	background-color: #CFC;}

.feedback-error {
	border-color: #F00;
	background-color: #FCC;}

.feedback-warning {
	border-color: #FF0;
	background-color: #FFC;}

.feedback-message {
	border-color: #00F;
	background-color: #CCF;}



/************
 * LAYOUT
 */
html, body {
	width: 100%;
	height: 100%;}

body {
	background-color: #F5F5F5;
	overflow: hidden;}

#shadow-left, #shadow-right {
	position: absolute;
	top: 10px;
	height: 4px;}

#wrapper {
	position: absolute;
	left: 14px;
	top: 14px;
	right: 14px;
	bottom: 14px;
	border: 1px solid #C4C4C4;
	background-color: #FFF;}

#header, #header div {
	position: absolute;
	height: 100px;}

#header {
	left: 5px;
	right: 5px;
	top: 5px;
	background: transparent url(/images/header_bg_repeater.png) left center repeat-x;}	
	
#header div {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: transparent url(/images/header_bg_v2.png) right center no-repeat;}

#header img {
	position: absolute;
	left: 10px;
	top: 10px;}



/**
 * NAVIGATION
 */
#navigation {
	position: absolute;
	left: 5px;
	right: 5px;
	top: 110px;
	height: 35px;
	list-style: none;
	background: transparent url(/images/menu_bg.gif) left center repeat-x;}

#navigation li {
	display: inline;
	float: left;
	line-height: 35px;
	height: 35px;}

#navigation li a {
	display: block;
	border-left: 1px solid #6FCE6C;
	height: 25px;
	margin: 5px 0;
	padding: 0 12px;
	line-height: 25px;
	font: bold 13px Arial, sans-serif;}

#navigation li#nav-contact a,
#navigation li#nav-kaart a {
	border: 0;}

#navigation li#nav-contact {
	float: right;}

#navigation li a:link,
#navigation li a:visited {
	color: #FFF;
	line-height: 25px;
	text-decoration: none;
	vertical-align: middle;	}



/**
* FORM STYLING
*/
form ol {
	list-style: none;
	margin: 0;
	padding: 0;}

form ol li {
	margin-bottom: 1em;
	zoom: 1;}

form ol li:after {
	content: '.';
	height: 0;
	display: block;
	visibility: hidden;
	clear: both;}

ol li ol {
	float: left;
}

form ol li ol li {
	margin-bottom: auto;}
				
form ol li ol li label {
	float: none;
}

form ol.horizontal {
	zoom: 1;}

form ol.horizontal:after {
	content: '.';
	height: 0;
	display: block;
	visibility: hidden;
	clear: both;}

form ol.horizontal li {
	float: left;}

form ol.vertical li label, ol li.vertical label {
	display: block;
	clear: both;
	float: none;}

form ol.vertical li ol li label, ol li.vertical ol li label {
	display: inline;}



/********************
 * MAP
 */
#map_canvas {
	position: absolute;
	left: 5px;
	top: 150px;
	right: 5px;
	bottom: 5px;}

#map_controls {
	display: none;}



/********************
 * MARKER
 */
.markerCluster {
	height: 46px;
	width: 46px;
	cursor: pointer;
	top: 100px;
	left: 419px;
	color:#333;
	position: absolute;
	font: bold 10px Arial, Helvetica, sans-serif;
	background-repeat: no-repeat;
	cursor: pointer;
	background-position: 2px 0;
	text-align: center;
	padding-top: 12px;
	padding-right: 17px;
	font-size: 14px;
	line-height: normal;
	width: 41px;}

.markerCluster .countText {}

.C1 {
	height: 33px;
	width: 50px;
	background-image: url(../images/map/icon-marker-cluster.png);
	background-position: 0 0;
	padding-top: 17px;
	padding-right: 0;
	color: #FFF;}
/*
.C1:hover {
	height: 40px;
	width: 38px;
	margin-top:-1px;
	margin-left:-1px;
	background-image: url(../images/map/c2.png);
	padding-top: 11px;
	padding-right: 18px;}*/

.C2 {
	height: 40px;
	width: 40px;
	background-image: url(../images/map/c2.png);}

.C2:hover {
	margin-top: -2px;
	margin-left: -2px;
	height: 43px;
	width: 43px;
	background-image: url(../images/map/c2over.png);
	padding-top: 13px;
	padding-right: 19px;}

.C3 {
	height: 46px;
	width: 46px;
	background-image: url(../images/map/c3.png);
	padding-top: 15px;}

.C3:hover {
	margin-top: -2px;
	margin-left: -2px;
	height: 50px;
	width: 50px;
	background-image: url(../images/map/c3over.png);
	padding-top: 16px;}

.C3 .countText  {
	padding-top: 24px;
	width: 43px;}

.ie6 {
	background-image:none;}



/************************
 * WIDGETS & PANELS
 */
.widget {
	position: absolute;
	background-color: #FFF;
	border: 1px solid #000;
	padding: 5px;
	font: 11px Arial, sans-serif;}

#widget-searchaddress {
	top: 7px;
	left: 85px;}

#widget-message {
	z-index: 99;
	top: 48px;
	left: 85px;
	font: 12px Arial, sans-serif;}

#widget-message.hide {
	display: none;}

#widget-addbtns {
	right: 7px;
	top: 30px;
	padding: 0;
	width: 198px;
	background: transparent url(/images/addbtns-bg.gif) center center no-repeat;}

#widget-addbtns img {
	display: inline;
	cursor: pointer;
	float: left;
	margin-left: 1px;}

#widget-addbtns img#new-problem-btn {
	margin-left: 0;}

#widget-council-info {
	z-index: 98;
	left: 85px;
	top: 48px;
	background: #FFF;
	display: none;
	line-height: 1.5em;}

#widget-council-info a:link, #widget-council-info a:visited {
	color: #3CB93B;}

#widget-council-info img{
	float:left;
	margin-right:5px;
}
#widget-council-info div{
	float:left;
}

.panel-content {
	margin: 25px 0 0 0;
	border-top: 1px solid #A2A2A2;}

div.panel-content {
	padding: 0 10px;
	overflow: auto;}

iframe.panel-content {
	position: relative;
	padding: 0;
	width: 100%;
	border-left: none;
	border-right: none;}

/* Bullet lijsten moeten wel inspringen!*/
.panel-content ul, .panel-content ul ul {
	padding-left: 20px;}

#panel-info {
	position: absolute;
	right: 5px;
	top: 5px;
	display: none;
	border: 5px solid #34459B;
	background: #FFF url(/images/bg-closebar.gif) top left repeat-x;
	z-index: 2}

#panel-info p, #panel-info legend, #panel-info li,
#frame p, #frame legend, #frame li, #frame th, #frame td {
	font: 13px/1.35em Arial, sans-serif;}

#panel-info p a:link, #panel-info p a:visited,
#panel-info li a:link, #panel-info li a:visited,
#frame p a:link, #frame p a:visited,
#frame li a:link, #frame li a:visited {
	text-decoration: underline;
	color: #34459B;}

#panel-info p a:link:hover, #panel-info p a:visited:hover,
#panel-info li a:link:hover, #panel-info li a:visited:hover,
#frame p a:link:hover, #frame p a:visited:hover,
#frame li a:link:hover, #frame li a:visited:hover {
	text-decoration: none;}

#panel-welcome {
	position: absolute;
	width: 540px;
	border: 5px solid #34459B;
	background-color: #FFF;
	left: 50%;
	margin-left: -275px;}

#panel-welcome .panel-content {
	width: 520px;}

#widget-categories {
	width: 188px;
	right: 7px;
	top: 137px;
	font-size: 12px;}
	
#widget-categories ol li {
	margin-bottom: 0;}

#widget-categories input {
	margin: 2px 3px 2px 4px;}

#widget-categories input,
#widget-categories label {
	vertical-align: middle;}

#widget-categories label {
	display: inline;}

#widget-categories form strong {
	cursor: pointer;
	display: block;
	margin-top: 5px;
	padding-top: 5px;
	border-top: 1px solid #CCC;
	background: transparent url(/images/category_open.gif) right center no-repeat;}

#widget-categories form strong.closed {
	background: transparent url(/images/category_closed.gif) right center no-repeat;}

#widget-categories div.mask {
	width: 100%;
	height: 100%;
	background-color: #FFF;
	opacity: 0.5;
	_filter: alpha(opacity=50);
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;}

span.close {
	position: absolute;
	right: 5px;
	font: 13px Arial, sans-serif;
	color: #34459B;
	padding-right: 15px;
	cursor: pointer;
	background: transparent url(/images/close.gif) right center no-repeat;}

span#upper.close {
	top: 5px;}

span#lower.close {
	bottom: 5px;}





/************
 * INFOWINDOW
 */
.infowindow,
.infowindow-error {
	position: relative;
	width: 300px;
	font: 12px Arial, sans-serif;}

.infowindow h2 {
	font-size: 14px;
	color: #3CB93B;}

.infowindow p {
	margin: 0 0 1em 0;}

.infowindow p.votes {
	margin: 0;
	text-align: center;
	background-color: #33BC40;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border: 2px solid #32972F;
	color: #FFF;
	padding: 3px; 
	float: right;}

.infowindow p.votes span {
	display: block;
	clear: both;
	font-size: 14px;}

.infowindow span.describe,
.infowindow span.remove {
	float: left;
	display: inline;
	text-decoration: underline;
	color: #34459B;
	font-weight: bold;
	cursor: pointer;}

.infowindow span.remove {
	float: right;
	display: inline;}

.infowindow-error {
	font-weight: bold;
	color: #F00;}



/**************
 * INFO PANEL STYLING
 */
h1 {
	color: #3CB93B;
	font: 20px Arial, sans-serif;
	margin-bottom: 1em;}

h2 {
	font: bold 12px Arial, sans-serif;}

#panel-welcome p {
	font: 12px Arial, sans-serif;
	margin-bottom: 1.5em;}

#panel-welcome form {
	margin-bottom: 30px;}

#panel-welcome label {
	display: none;}

#panel-welcome a:link, #panel-welcome a:visited {
	color: #34459B;
	text-decoration: none;
	border-bottom: 1px dotted #34459B;}

#panel-welcome a:link:hover, #panel-welcome a:visited:hover {
	border-bottom: none;}

#issue-probleem {
	background: transparent url(/images/icon_problem.gif) 10px 10px no-repeat;}

#issue-idee {
	background: transparent url(/images/icon_idea.gif) 10px 10px no-repeat;}

#issue-probleem.new-probleem, #issue-idee.new-idee{
	background-image: url(/images/icon_new.jpg);}
}

#issue-probleem.closed, #issue-idee.closed {
	background-image: url(/images/icon_resolved.gif);}

#issue-probleem.nosolution, #issue-idee.nosolution {
	background-image: url(/images/icon_noresponse.gif);}

#issue-report th, #issue-report td {
	font: 12px Arial, Helvetica, sans-serif;
	padding: 2px 5px 2px 0;}

#issue-report th {
	font-weight: bold;
	color: #3CB93B;
	text-align: left;}

#frame {
	position: relative;
}

#frame .issue {
	position: relative;
	padding-left: 50px;
	padding-top: 7px;}

#frame .issue h1 {
	font: bold 20px Arial, sans-serif;
	color: #34459b;
	margin-bottom: 0;}



/**
 * ISSUE PANEL
 */
#frame .issue dl {
	margin-bottom: 2em;}

#frame .issue dl dt,
#frame .issue dl dd {
	font: 13px/18px Arial, sans-serif;}

#frame .issue dl dt {
	clear: left;
	float: left;
	margin-right: 3px;
	font-weight: bold;}

#frame .issue p.issue-status span, .issue p.issue-category span, .issue p.issue-address span {
	color: #000000;}	

#frame .issue h2 {
	color: #34459B;
	font: bold 13px Arial, sans-serif;}	

#frame .issue form th {
	font: 13px Arial, sans-serif;}

#frame .issue form td {
	font: 11px Arial, sans-serif;} 

.issue .first_time_alert {
	_zoom: 1;
	margin: 0 20px 1.5em 20px;
	background: #3FBD3B url(/images/voting_idea_top_left.gif) top left no-repeat;}

.issue .first_time_alert div {
	background: transparent url(/images/voting_idea_top_right.gif) top right no-repeat;}

.issue .first_time_alert div div {
	background: transparent url(/images/voting_idea_bottom_left.gif) bottom left no-repeat;}

.issue .first_time_alert div div div {
	color: #FFF;
	padding: 10px;
	background: transparent url(/images/voting_idea_bottom_right.gif) bottom right no-repeat;}
#frame .issue .first_time_alert p{
	color: #FFF;
	margin-left:0px;
	margin-right:5px;
}	
.issue .first_time_alert .at300b{
	float:left;
	padding: 0px 2px;
}

.issue .first_time_alert div div div div {
	background: none;
	padding: 0px;
}	

#issue-probleem .voting {
	_zoom: 1;
	margin: 0 20px 1.5em 20px;
	background: #FA1E00 url(/images/voting_problem_top_left.gif) top left no-repeat;}

#issue-probleem .voting div {
	background: transparent url(/images/voting_problem_top_right.gif) top right no-repeat;}

#issue-probleem .voting div div {
	background: transparent url(/images/voting_problem_bottom_left.gif) bottom left no-repeat;}

#issue-probleem .voting div div div {
	color: #FFF;
	padding: 10px;
	background: transparent url(/images/voting_problem_bottom_right.gif) bottom right no-repeat;}

#issue-probleem .voting div p,
#issue-idee .voting div p {
	float: none;
	margin: 0;}
	
#issue-idee .voting div p {
	margin: 0;}	

#frame .issue .voting div span.votecount {
	text-align: center;
	font-size: 28px;
	line-height: 30px;
	display: block;}

#frame .issue .voting div a,
#frame .issue .voting div span.voted {
	float: right;
	display: inline;
	padding: 2px 7px 3px 7px;
	font-weight: bold;
	text-align: center;}

#frame .issue .voting div a:link,
#frame .issue .voting div a:visited {
	text-decoration: none;}

#frame .issue .voting div input {
	*margin-left: 0;
	_margin-left: 0;
	float: left;
	width: 130px;
	_width: 124px;}

#frame .issue .voting div a,
#frame .issue .voting div span.voted,
#frame .issue .voting div input {
	margin-top: 4px;}

#frame #issue-probleem .voting div a,
#frame #issue-probleem .voting div input {
	margin-top: 0;}

#frame #issue-probleem .voting div input {
	margin-right: 10px;}

#issue-probleem .voting div a,
#issue-probleem .voting div span.voted {
	background-color: #CE1900;}

#issue-probleem .voting div a:link,
#issue-probleem .voting div a:visited {
	color: #FFF;}

#issue-idee .voting {
	margin: 0 20px 1.5em 20px;
	zoom: 1;
	background: #3FBD3B url(/images/voting_idea_top_left.gif) top left no-repeat;}

#issue-idee .voting div {
	background: transparent url(/images/voting_idea_top_right.gif) top right no-repeat;}

#issue-idee .voting div div {
	background: transparent url(/images/voting_idea_bottom_left.gif) bottom left no-repeat;}

#issue-idee .voting div div div {
	color: #FFF;
	padding: 10px;
	background: transparent url(/images/voting_idea_bottom_right.gif) bottom right no-repeat;}

#issue-idee .voting div a:link,
#issue-idee .voting div a:visited {
	color: #34459B;}
	
#issue-idee .voting div a,
#issue-idee .voting div span.voted {
	background-color: #34459B;}

#issue-idee .voting div a:link,
#issue-idee .voting div a:visited {
	color: #FFF;
	text-decoration: none;}


#frame .issue .comment {
	font-weight: bold;}
	
#frame .issue .council_comment {
	/*border-width: .2em; 
	border-style: solid; 
	border-color: #666;*/
	color: #344598;
}

#frame .issue .comment span {
	color: #555;}

/**
 * ISSUE LOG MESSAGES
 */
#frame .issue div.logs {
	clear: both;
	margin-bottom: 1.5em;}
	
#frame .logs #log-messages {
	display: none;}	

#frame .issue div.logs dl {
	margin-bottom: 0;}

#frame .issue dl.log {
	font-size: 11px;}

#frame .issue dl.log dt{
	font-size: 11px;
	font-weight: bold;}

#frame .issue dl.log dd {
	color: #3CB93B;	
	font-size: 11px;}

#issue-idee span.progress {
	padding: 2px;
	background-color: #32972F;
	display: block;}

/***
 * FRAMED
 */
#frame {
	background-color: #FFF;
	overflow: auto;}

#frame h1, #frame h2, #frame h3, #frame h4, #frame h5, #frame h6,
#frame p, #frame ul, #frame fieldset, #frame ol, #frame table, #frame dl {
	margin: 0 20px 1.5em 20px;}

#frame h2 {
	margin-bottom: 0;}

#frame form fieldset {
	margin: 0 0 0 20px;}


#frame #create-issue input, #frame #create-issue textarea {
	width: 100%;}

#frame #create-issue select {
	width: 50%;}

#frame #create-issue input.submit {
	width: auto;}

#frame #create-issue h1 {
	color: #3CB93B;
	margin-bottom: 5px;}

#frame #create-issue-container {
	padding-top: 12px;}

#frame #create-issue-container.problem {
	background: transparent url(/images/map/icon-problem.png) no-repeat 10px 15px;}

#frame #create-issue-container.idea {
	background: transparent url(/images/map/icon-idea.png) no-repeat 10px 15px;}

#frame #create-issue {
	margin-left: 30px;}


#frame #create-issue ol {
	margin-left: 0;}

#frame #create-issue ol li {
	margin-left: 0;
	font-size: 13px;}

#frame ol li label, form ol li label {
	font-weight: bold;}



/***
 * ERRORS IN FORMS
 ****/
 #frame form fieldset {
	border: 0;}
 
#frame form fieldset legend {
	color: #34459B;
	font-size: 13px;
	margin: 0 0 2px 0;
	font-weight: bold;
	padding: 0;}
 
#frame ul.error_list, #frame ol li span.help {
	list-style: none;
	padding: 0;
	margin: 0;}

#frame #create-issue ol ul.error_list, #frame #create-issue ol li span.help {
	margin: 2px 0;}

#frame ul.error_list li, #frame #create-issue ul.error_list li {
 	color: #f00;
	font-size: 11px;
	margin-bottom: 2px;}
 
form ol li span.help {
 	color: #555;
	font-size: 11px;
	margin-bottom: 2px;} 
/*
* Message
*/
.message {
	margin: 0 20px 1.5em 20px;
	border: 1px solid #34459B;
	padding: 0px;
	background-color: #34459B;
	}