/*
 * General style
 */

h1  { font-size: x-large; }

h2  { font-size: large; }

h3  { font-size: medium; }

strong  { color: #990000; }


#body {
	position: absolute;
}


/*
 * Sidebar
 */

#sidebar {
	position: absolute;

	left: 0px;
	top: 0px;
	bottom: 0px;

	padding-top: 20px;
	padding-bottom: 20px;
	
	background-image: url(sidebar_background.png);
	background-repeat: repeat-y;
}

.SidebarHidden {
	width: 0px;

	padding-left: 20px;
	padding-right: 0px;

	overflow: hidden;

	background-position: 10px 0px;
}

.SidebarVisible {
	width: 210px;

	padding-left: 25px;
	padding-right: 25px;

	overflow: auto;

	background-position: 250px 0px;
}

#sidebar_toggle {
	position: absolute;
	
	top: 3px;
	right: 5px;

	font-size: large;
	font-weight: bold;

	cursor: pointer;
}

#sidebar_toggle:hover {
	color: red;
	cursor: pointer;
}

.layer_selector {
	margin-bottom: 5px;
	color: black;
}

.layer_selector h3 {
	color: black;
	margin-left: 8px;
}

.layer_selector ul {
    margin-left: 10px !important;
}

.layer_selector li {
    margin-top: 2px !important;
}

.layer_selector input {
    margin-right: 5px;
}

#layer_selector_map {
	background-color: #7B4100;
	color: white;
}
#layer_selector_map h3 { color: white; }

#layer_selector_green { background-color: #B4FE7F; }
#layer_selector_local { background-color: #CBCBCB; }

/*
 * Map style
 */

#map {
	position: absolute;

	left: 250px;
	top: 0px;
	right: 0px;
	bottom: 0px;

	height: 100%;
	
	background-color: #cbced5;
}

/* For some bizairre reason the image is having an top offset of 6px which results
 * in a displacement of the slider on the zoombar. Setting top to -6px solves this
 * issue. However it should not be neccessary in the first place!
 */
/*img[src="http://openlayers.org/api/img/slider.png"] {
	top: -6px;
}*/


/*
 * OpenStreetbugs popup style
 */

.olFramedCloudPopupContent
{
	max-width: 380px;

	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 5px;

	overflow: auto;

	font-size: small;
}


.olFramedCloudPopupContent h1
{
	margin-top: 0px;
	margin-bottom: 7px;

	font-size: medium;
}

.olFramedCloudPopupContent h2
{
	border-bottom: thin solid #3399ff;
}

.olFramedCloudPopupContent p
{
	margin-top: 5px;
	margin-bottom: 0px;
}

.olFramedCloudPopupContent p.Comment
{
	margin-top: 5px;
	margin-left: 15px;
}

.olFramedCloudPopupContent p.Note
{
	margin-top: 7px;
	padding-top: 3px;

	border-top: solid 1px gray;

	font-size: x-small;
}

.olFramedCloudPopupContent form+p
{
	margin-top: 15px;
	padding-top: 10px;

	border-top: solid 1px gray;
}


.olFramedCloudPopupContent ul
{
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 0px;
	
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 5px;
	padding-bottom: 0px;

	border-top: solid 1px gray;

	text-align: center;
}

.olFramedCloudPopupContent ul li
{
	display: inline;

	margin-left: 8px;
	margin-right: 8px;

	padding: 0px;
}

.olFramedCloudPopupContent form
{
	margin-top: 10px;
	margin-bottom: 0px;
}

.olFramedCloudPopupContent form.NewComment
{
	padding-top: 5px;

	border-top: solid 1px gray;
}

.olFramedCloudPopupContent form div
{
	margin-top: 5px;
	margin-left: 15px;
	margin-right: 15px;
}

.olFramedCloudPopupContent form div.FormFooter
{
	margin-top: 15px;
	margin-bottom: 0px;
	text-align: center;
}

.olFramedCloudPopupContent span.InputLabel
{
	display: inline-block;

	min-width: 110px;
	margin-right: 10px;
}

.olFramedCloudPopupContent input[type=text]  { min-width: 190px; }

.olFramedCloudPopupContent input[type=button]
{
	min-width: 75px;

	margin-left: 3px;
	margin-right: 3px;
}