/* ***********************************************************************
Body
*********************************************************************** */
body {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 100;
    color: #554242;
    font-size: 1em;
    text-align: justify;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

strong {
	font-weight: bold;
}

/* ***********************************************************************
Styles für Headerbereich
*********************************************************************** */
header {
    background-color: #fff;
    width: 50em; height: 6.6em;
    position: fixed;
    top: 0em; left: 50%;
    margin-left: -25em;
    background-image: url(/otg/images/header.png);
    background-repeat: no-repeat;
    z-index: 120;
}

#headerimg1 {
    position: absolute;
    left: 1em; top: 1.6em;
    width: 9.113em; height: 4.195em;
    background-image: url(/otg/images/logo_otg.png); 
    background-repeat: no-repeat;
    background-size: 9.113em 4.195em;
}

#headerimg2 {
    position: absolute;
    top: 1.6em; right: 1em;
    width: 10.58em; height: 4.785em;
    background-image: url(/otg/images/logo_uni.png); 
    background-repeat: no-repeat;
    background-size: 10.58em 4.785em;
}

/* ***********************************************************************
Styles für ersten (nav) und zweiten (aside) Menübereich
*********************************************************************** */
.menue-button { /* nav-Button für mobile Seiten */
   display: none;
}

nav {
    background-color: #d5f6fb;
    width: 10em; height: 100%;
    position: fixed;
    top: 6.6em; left: 50%;
    margin-left: 15em;
    opacity: 0.9;
    z-index:1000;
}

footer {
    background-color: #d5f6fb;
    position: fixed;
    width: 10em; left: 50%;
    bottom: 0em; height: 6em;
    margin-left: 15em;
    opacity: 0.9;
    z-index: 1200;
}

aside {
    background-color: #d5f6fb;
    width: 10em; height: 100%;
    position: fixed;
    top: 6.6em; left: 50%;
    margin-left: 5em;
    opacity: 0.8;
    padding-top: 10.1em; /* alter Wert: 12.8, wenn "Finde mich" wieder ins Menü aufgenommen wird! */
    display:none;
    z-index:100;
}

#info, #hilfe, #impressum, #datenschutz {
    padding: 1em;
    position: absolute;
    top: 6.6em; left: 50%; width: 38em; height: 100%;
    margin-left: -25em;
    z-index: 110;
    opacity: 0.9;
}

.info_h1 {
	width: 40em;
	border-bottom: 1px solid black;
}

#startInfoText {
    background-color: red;
    width: 10em; height: 100%;
    position: fixed;
    top: 6.6em; left: 50%;
    margin-left: 5em;
    opacity: 0.8;
    padding-top: 10.1em; /* alter Wert: 12.8, wenn "Finde mich" wieder ins Menü aufgenommen wird! */
    display:none;
    z-index:100;
}

#datenschutz {
    height: 170%;
}

nav ul, aside ul, footer ul {
    list-style-type: none;
    margin: 0.25em;
    padding: 0.25em;
    text-transform: uppercase;
}

nav ul {
    border-bottom: 1px solid #56494b;
}

aside ul {
    border-bottom: none;
    text-transform: none;
}

footer ul {
    border-top: 1px solid #56494b;
}

nav li, aside li, footer li {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

nav a, aside a, footer a {
    color: #554242;
    text-decoration: none;
    font-weight: 100;
}

nav a:hover, aside a:hover, footer a:hover {
    color: #00a9e0;
}

.navaktiv a, .navaktiv a:visited {
	color: #00a9e0;
}

nav img {
    width: 1.5em;
}

.img {
    margin-right: 0.5em;
    vertical-align: bottom;
}

.text {
    vertical-align: top;
    position: absolute;
    left: 2.5em;
}

.hilfe {
	bottom: 6em;
	height: 3em;
}

.hilfe ul {
	border: none;
}

.hilfe img {
	width: 1.5em;
}

/* ***********************************************************************
Section-Bereich für den Hauptinhalt
*********************************************************************** */
section {
    position: absolute;
    top: 6.6em; left: 50%; width: 40em; height: 100%;
    margin-left: -25em;
    background-color: #fff;
    z-index: 1;
}

noscript p {
	position: relative;
	margin-right: 1em;
	margin-top: 4em;
	color: red;
}

/* wird dieser Abschnitt benötigt?? 
#map {
    position: absolute;
    top: 6.6em; left: 50%; width: 40em; height: 100%;
    margin-left: -25em;
}
*/
.mapboxgl-popup-content {
    border: 1px solid #554242;
}

.mapboxgl-popup-tip {
    border: 1px solid #554242;
}

/* ***********************************************************************
Standardtextformate
*********************************************************************** */
a {
    color: #00a9e0;
    font-weight: 400
}

h3 a {
	text-decoration: none;
}

h1 {
    color: #00a9e0;
    font-size: 1.5em;
    font-weight: 100;
    text-transform: uppercase;
    display: table-cell; 
    vertical-align: top;
    line-height: 1.5em;
}

h2 {    
    font-size: 1.2em;
    font-weight: normal;  
    padding-top: 0.5em;
}

h3 {  /*wird verwendet für die Kartenmarker auf der Startseite */
    font-size: 0.9em;
    font-weight: normal;
    margin-top: 0em;
    margin-bottom: 0.5em;
    margin-right: 1em;
    border-bottom: 1px solid #554242;
    text-transform: uppercase;
}

h4 {    
    font-size: 0.9em;
    font-weight: bold;  
    margin-bottom: 0.5em;
}