/* Verwendete Hacks:

   - Box-Model -> für IE<6 Kompatibilität:
     Bei Verwendung von margin, border oder padding werden erst die Werte
     für Breite und Höhe eines Elements im falschen BM-Stil angegeben
     (Beispiel: width: 115px;). Danach folgt der Block
     -----------------------
     voice-family: "\"}\""; voice-family: inherit;
     -----------------------
     und dann die korrekten Breite- und Höheangaben (Beispiel: width: 109px;).
     Weitere Infos: http://www.tantek.com/CSS/Examples/boxmodelhack.html
*/ /***********************************************
  generelle Einstellungen
***********************************************/
* {
	margin: 0;
	padding: 0;
	border: 0;
}

html {
	scrollbar-face-color: #F4F4F4;
	scrollbar-highlight-color: #FFF;
	scrollbar-3dlight-color: #CECECE;
	scrollbar-darkshadow-color: #9D9D9D;
	scrollbar-shadow-color: #CECECE;
	scrollbar-arrow-color: #626262;
	scrollbar-track-color: #E8E8E8;
}



body {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	background: #fff;
}

/***********************************************
  Textformatierung
***********************************************/
img {
	border: 0;
	position: absolute;
}

p {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
}

h3 {
	font: 11px Verdana, Arial, Helvetica, sans-serif;
	color: #E9845B;
	font-weight: bold;
}

.info {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.0em;
	color: #000000;
	display: block;
	height: 130px;
	width: 270px;
	background: #FCF2ED;
	position: absolute;
	top: 9px;
	left: 409px;
	border: 1px solid #F8D2C2;
	display: none;
	padding: 5px 10px 5px 10px;
	overflow: auto;
}


#btn-close {
	position: absolute;
	top: 19px;
	left: 679px;
	z-index: 10;
	display: none;
}

.info h3 {width: 240px}

/***********************************************
  Links
***********************************************/
a.infolink:link,a.infolink:active,a.infolink:visited {
	color:#686BF6;
	text-decoration: none;
}

a.infolink:hover {
	color: #c00;
	text-decoration: underline;
}

a:link,a:active,a:visited {
	color:#000;
	text-decoration: none;
}

a:hover {
	color: #c00;
	text-decoration: underline;
}

div#navi a {
	display: block;
	padding: 7px 0 0 33px;
	height: 18px;
	width: 180px;
}

a#lnk-gemeinden {
	background: url("../img/lnk-gemeinden.gif") no-repeat;
}

a#lnk-kinder {
	background: url("../img/lnk-kinder.gif") no-repeat;
}

a#lnk-dia {
	background: url("../img/lnk-dia.gif") no-repeat;
}

a#lnk-seel {
	background: url("../img/lnk-seel.gif") no-repeat;
}

a#lnk-pflege {
	background: url("../img/lnk-pflege.gif") no-repeat;
}

a#lnk-fried {
	background: url("../img/lnk-fried.gif") no-repeat;
}

a#lnk-bild {
	background: url("../img/lnk-bild.gif") no-repeat;
}

a#lnk-info {
	background: url("../img/lnk-info.gif") no-repeat;
}

a#lnk-biblio {
	background: url("../img/lnk-biblio.gif") no-repeat;
}

a#lnk-ver {
	background: url("../img/lnk-ver.gif") no-repeat;
}

a#lnk-gemeinden:hover {
	background: url("../img/lnk-gemeinden.gif") 0 -25px no-repeat;
}

a#lnk-kinder:hover {
	background: url("../img/lnk-kinder.gif") 0 -25px no-repeat;
}

a#lnk-dia:hover {
	background: url("../img/lnk-dia.gif") 0 -25px no-repeat;
}

a#lnk-seel:hover {
	background: url("../img/lnk-seel.gif") 0 -25px no-repeat;
}

a#lnk-pflege:hover {
	background: url("../img/lnk-pflege.gif") 0 -25px no-repeat;
}

a#lnk-fried:hover {
	background: url("../img/lnk-fried.gif") 0 -25px no-repeat;
}

a#lnk-bild:hover {
	background: url("../img/lnk-bild.gif") 0 -25px no-repeat;
}

a#lnk-info:hover {
	background: url("../img/lnk-info.gif") 0 -25px no-repeat;
}

a#lnk-biblio:hover {
	background: url("../img/lnk-biblio.gif") 0 -25px no-repeat;
}

a#lnk-ver:hover {
	background: url("../img/lnk-ver.gif") 0 -25px no-repeat;
}

a#lnk-uebersicht {
	display: block;
	position: absolute;
	top: 90px;
	left: 20px;
	width: 150px;
	height: 26px;
	z-index: 5;
}

/***********************************************
  Forms
***********************************************/
	/***********************************************
  DIVs
***********************************************/
div#main-wrapper {
	/*margin: 191px 10px 0 271px;*/
	margin: 0;
	height: 510px;
	width: 630px;
}

div#active-wrapper {
	/*position: absolute;
	top: 24px;
	left: 126px;*/
	margin: 0;
	background: #ccc;
}

div#navi {
	display: block;
	position: absolute;
	top: 150px;
	left: 0px;
	padding-left: 10px;
}

div.navi-sued {
	top: 100px !important;

}

div#border-wrapper {
	display: block;
	position: absolute;
	/*top: 307px;
	left: 316px;*/
	top: 116px;
	left: 20px;
	background: transparent;
	border: 1px solid #F8D2C2;
	height: 379px !important;
	width: 584px !important;
}
div#headline-wrapper {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}
div#headline-wrapper h2 {
	font: 20px Verdana, Arial, Helvetica, sans-serif;
	color: #E9845B;
	margin-left: 18px;
}
div#headline-wrapper p {
	font: 11px Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	margin-left: 20px;
}


/***********************************************
  Tables
***********************************************/
	/***********************************************
  Images
***********************************************/
div#main-wrapper img#img-uebersicht-oog {
	top: 117px;
	left: 229px;
}
div#main-wrapper img#img-uebersicht-haven {
	top: 117px;
	left: 311px;
}
div#main-wrapper div#active-wrapper img.oogbild {
	top: 105px;
	left: 242px;
}
div#main-wrapper div#active-wrapper img.havengemeinden {
	top: 220px;
	left: 428px;
}
div#main-wrapper div#active-wrapper img.havenkinder {
	top: 218px;
	left: 442px;
}
div#main-wrapper div#active-wrapper img.havendia {
	top: 200px;
	left: 413px;
}
#img-uebersicht-nord, #img-uebersicht-sued, #img-uebersicht-ost,
#img-uebersicht-west, #img-uebersicht-city-mitte, #img-uebersicht-city
{
	left: -25px;
}

#active-wrapper .img-uebersicht {
	top: -118px;
	left: -47px;
}
#img-descr-nord {
	top: 130px;
	left: 124px;
	z-index: 5;
}
#img-descr-mitte {
	top: 329px;
	left: 449px;
	z-index: 5;
}
#img-descr-west {
	top: 234px;
	left: 429px;
	z-index: 5;
}
#img-descr-ost {
	top: 329px;
	left: 569px;
	z-index: 5;
}
#img-descr-sued {
	top: 396px;
	left: 299px;
	z-index: 5;
}
#img-descr-oog {
	top: 339px;
	left: 40px;
	z-index: 5;
}
#img-descr-haven {
	top: 339px;
	left: 130px;
	z-index: 5;
}
#img-lupe {
	top: 160px;
	left: 390px;
	z-index: 10;
	display: block;

}
#img-lupe:hover {
	cursor: pointer;
}
.img-oog {
	top: 352px;
	left: 22px;
}

.img-haven {
	top: 352px;
	left: 122px;
}

#img-active-oog {
	left: 0px;
	position: absolute;
	z-index: 4;
}

#img-active-haven {
	left: 00px;
	position: absolute;
	z-index: 4;
}

#img-uebersicht-active-nord, #img-uebersicht-active-sued,
#img-uebersicht-active-ost, #img-uebersicht-active-west,
#img-uebersicht-active-mitte {
	/*position: absolute;
	top: 167px;
	left: 145px;*/
	margin: 0;
}

.active {
	display: none;
}

.vis {
	display: block;
}

.pfeil {
	display: none;
	position: relative;
	top: 4px;
	left: -32px;
	float: left;
	z-index: 1;
	margin-right: -30px;
}

.map-icons {
	z-index: 3;
	display: block;
}

#img-uebersicht {
	top: 0;
	left: 0;
}

#img-pfeil-kinder {
	top: 2px;
}

#img-pfeil-dia {
	top: 0px;
}

#img-pfeil-seel {
	top: 2px;
}

#img-pfeil-pflege {
	top: 2px;
}

#img-pfeil-fried {
	top: 2px;
}

#img-pfeil-bild {
	top: 2px;
}

#img-pfeil-biblio {
	top: 1px;
	left: -31px;
}

#img-pfeil-info {
	top: 1px;
	left: -31px;
}

#img-pfeil-ver {
	top: 1px;
	left: -31px;
}

#img-kirchen, #img-pfeil-kirchen
	{
	display: block;
}