html, body
{
  background-color: #ffffff;
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: none; /* unterbindet die Textvergroesserung im Webkit beim Aendern der Aufloesung (Schwenk) */
  -ms-text-size-adjust: none;
}

body
{
  width: 100%;
  font-size: 100%;
  font-family:  Verdana, Arial, Helvetica, sans-serif;
  color: #000000;
  background-color: #ffffff;
}

main
{
  display: block;
}

header{
	width: 100%;
	position: relative;
}

header #headeroben
{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 100%;
  height: 90px;
  padding: 2% 0.5% 2% 0.5%;
}

header #headeroben .headerlinks,
header #headeroben .headerrechts
{
  margin: 0 0 2% 0;
  display: block;
  width: 99%;
}
header #headeroben .headerlinks
{
  position: absolute;
  top: 6px;
}
header #headeroben .headerrechts
{
  position: absolute;
  top: 50px;
}
header #headeroben h1{
	display: block;
	margin: 0;
	padding: 0;
}
header #headeroben h1 a img{
	width:242px;
	height:40px;
	border:none 0;
}

#mainnav
{
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #ffffff;
  border-top: 3px solid #e00a22;
}

.wrapper{
	max-width: 64em;
	width: auto;
	margin: 0 auto 0 auto;
	background-color: #ffffff;
}

.unsichtbar{
	position: absolute;
	left: -9999px;
	top: -9999px;
	width: 0px;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	display: inline;
}

/*** Allgemein ***/
/**** http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ ****/

#toolbar{
	width:100%;
	background-color: #FFFFFF;
	height:35px;
	margin-top:2px;
}

#field {
	left:0px;
	right:0px;
	display:block;	
	width:99%;
	height:28px;
	float:left;
	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAUBAMAAAANaGKIAAAAJFBMVEX///////+ZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmUQqV7AAAAC3RSTlMAABxwtzixj0jjTnhk5e0AAAB7SURBVBiVYxDEAhiAePfu3RsFBZW9txghC24ECopmA+UC0QTVdle0z05CE7TeJSi4ejOaoHehoKD4FjSLdjcKCkrsJiSIVTvMopXoFoGctBtdO9jxIJ9heBOqFCEIAtIQBlw7BECUoglClKIJQpSiC0rDBXcjBOG2YwAA7URojjYmBCgAAAAASUVORK5CYII=") no-repeat scroll left center #FFFFFF;
	border: 2px solid #666666;
	z-index:1;	
}

#adresse {
    background-color: transparent;
    background-image: none;
    border:0 none;
    padding:6px 3px;
	padding-left:35px;
	font-size:16px;
	width:100%;
	z-index:4;
}

#map{
	display:block;
	width:100%;
    z-index:1;
}

#result,
#services{
	display:none;
	position:absolute;
	width:0%;
	height:0%;
	background-color:#FFFFFF;
	border-right:1px solid #666666;
	z-index:5;
}

.dienst #services,
.suche #result{
	display:block;
	margin:0px;
	width:300px;
	height:auto;
	overflow:auto;
}

.suche #services,
.dienst #result{
	display:none;
	width:0%;
	height:0%;
}


/***** Themen / Layers *****/

#werkzeug{
	 -moz-user-select: none;
    border:none;
    color: #666666;
    position: absolute;
	display:block;
	width:auto;
    text-align: center;	
	margin-top:90px;
	margin-left:20px;
	z-index:3;
}

#servbutton{
	padding:2px;
	background-color: #FFFFFF;
    border: 2px solid #666666;
    border-radius: 5px;
	margin-bottom:2px;
	z-index:2;
}

#servbutton div{
	cursor: pointer;
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcAgMAAAAPYzcHAAAACVBMVEX///9mZmb///+ofUk6AAAAAXRSTlMAQObYZgAAAC5JREFUCJljWAUBDOj01FAQCIPT6PIrweJZcBq7fBicxiofhqDJ0h8aBadx+AMAw/pq8wohG9EAAAAASUVORK5CYII=");	
    height: 26px;
    width: 26px;
	z-index:1;
}

#mapgallery{
	padding:2px;	
	background-color: #FFFFFF;
    border: 2px solid #666666;
    border-radius: 5px;	
	z-index:2;
}

#mapgallery div{
    cursor: pointer;
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAMAAACelLz8AAAAmVBMVEX////////f399PT0+/v7+srKxnZ2c6OjqBgYF1dXVLS0vV1dVZWVmRkZF0dHRYWFh6enqzs7NgYGCxsbFfX19/f3/t7e1HR0dTU1NoaGhKSkpycnLJycnNzc13d3dcXFzb29ve3t7d3d3m5uaSkpKAgIBhYWGUlJSTk5OOjo5wcHBzc3NWVlZVVVVXV1dJSUny8vLv7+/u7u6SFrChAAAAAnRSTlMAAHaTzTgAAADCSURBVCiRndLXEoIwEEBR1t5AitJEQKWXUP7/43RY0AQlD96nZc5MgCQCTCYAtA1VTVNbkfJdkdPUkCztSuI4iUKGygDHx/3me+4Vc5BSpEtp21Zkd5mGTtP5pGlqrnTJpGHoCGBIOIslSwcAZ49z+k1DP0iKJ2m3/WdBDnEW5HwGZ8HxL4v4uHlt1HrFEJFxS3NVU5YLmnTDxIOILHvOvguc/vRcz58NFCANhVESp30ZYSgvPteHVC1NNX3pWqBp3BN8dCuEo7pxMAAAAABJRU5ErkJggg==");	
    height: 26px;
    width: 26px;
	z-index:1;
}

ul#themen,
ul#search {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}

ul#themen li,
ul#search li{
    border-bottom: 1px solid #CCCCCC;
    color: #666666;
    cursor: pointer;
    display: block;
    padding: 0.5em 5px 0.5em 30px;
    position: relative;
}

ul#themen li img,
ul#search li img{
	display: block;
    left: 5px;
    position: absolute;
    top: 0.5em;
}

ul#themen li.aktiv,
ul#search li.aktiv{
	color:#FFFFFF;
	background-color: #6C655F;
}

.esriPopup {
    font-size: 12px;
}
.esriPopup .titleButton.maximize{
	display:none;
}

.esriScalebar {
    z-index: 2;
}

/*** Zoom-Button ****/

#map_zoom_slider{
	z-index:4 !important;
}

/***** Basiskarte Change End *****/

@media only screen and (min-width : 320px) and (max-width:767px) {
	main #toolbar{
		margin-top:0px;
	}
	.suche #map, 
	.dienst #map{
		left:0px;
		border:none 0;
	}
	.dienst #services,
	.suche #result{
		display:block;
		margin:0px;
		width:100%;
		height:auto;
		overflow:auto;
	}		
}

@media only screen and (min-width:320px){
	.wrapper{
		width:100%;
	}
	header{
		width:99%;	
	}
	header #headeroben{
		height: 31px;
	}
	header #headeroben h1 a{
		margin-top:0px;
		width: 190px;
		height: 31px;
	}
	header #headeroben h1 a img{
		width: 190px;
		height: 31px;
	}
	header #headeroben .headerlinks,
	header #headeroben .headerrechts{
		top:0px;
	}
	#mainnav{
		display:none;
		border:0px none;
	}
}
@media only screen and (min-width:480px){
	.wrapper{
		width:100%;
	}
	header #headeroben{
		height: 31px;
	}
	header #headeroben h1 a{
		margin-top:0px;
		width: 190px;
		height: 31px;
	}
	header #headeroben h1 a img{
		width: 190px;
		height: 31px;
	}
	header #headeroben .headerlinks,
	header #headeroben .headerrechts{
		top:0px;
	}
	#mainnav{
		display:none;
		border:0px none;
	}
}
@media only screen and (min-width:768px){
	.wrapper{
		max-width:48em;
	}
	header #headeroben{
		height:auto;
		height:7.3em;
		padding:0 0.5%  0.5%;
		background-image:url('/img/layout/header.png');
		background-repeat:no-repeat;
		background-position:top right;
	}
	header #headeroben .headerlinks{
		position:relative;
		top:auto;
		float:left;
		display:block;
		width:50%;
	}
	header #headeroben .headerrechts{
		position:relative;
		top:auto;
		float:right;
		display:block;
		width:50%;
	}
	header #headeroben h1{
		margin-top:48px;
	}
	header #headeroben h1 a{
		width:242px;
		height:40px;
		min-height:1px;
		margin-top:48px;
	}
	header #headeroben h1 a img{
		width:242px;
		height:40px;
	}
	header #mainnav{
		clear: both;
	}
}
@media only screen and (min-width:1024px){
	.wrapper{
		max-width:64em;
	}
}