@import "mystyles.css";

body {
  margin:0;
  padding:0;
  font-family:Roboto,sans-serif;
  color:#395564;
  height:100%;
  font-size:.9em;
  background-color: #fff;
}

html {
  overflow-y:scroll;
  height:100%;
}

#banner {
 background-color: #cccccc;
  background-image: url('../img/banner_bg.jpg');	
}

#grad1 {
  height: auto;
  background-color: #cccccc;
  padding: 30px 0px 0px 0px;
  background-image: url('../img/banner_bg.jpg');
}

#blankrow {height:10px}

#fzcenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  background-color: #a5c6bb;
  padding: 10px 0px 10px 0px;
}
#fzeile {
  margin-top:0;
  font-size:1.2em;
  background-color: #878787;
  text-align: center;
  display: block;
  margin-left: auto;
  margin-right: auto;
  color: #ffffff;
  height: 40px;
  padding: 10px 0px 10px 0px;
}

#seite {
  margin-top:0;
  font-size:1.6em;
  font-weight:400;
  background-color: #878787;
  text-align: center;
  display: block;
  margin-left: auto;
  margin-right: auto;
  color: #ffff00;
}

.ifl {
  float:left;
  margin:0 1em 1em 0;
}

.ifr{
  float:right;
  margin:0 0 1em 1em;
}

.logo img {
  margin-bottom:2em;
}

.meta {
  text-align:right;
}

.meta ul {
  margin:0;
  padding:0;
  display:inline;
}

.meta ul li {
  list-style-type:none;
  font-size:80%;
  text-transform:uppercase;
  display:inline-block;
  margin:0;
  padding:0 1em;	
}

.meta ul li a:link, 
.meta ul li a:visited {
  text-decoration:none;
  color:#00489a;
}

.meta ul li a:hover, 
.meta ul li a:visited:hover,
.meta ul li a:active, 
.meta ul li a:visited:active {
  color:#e67f00;
}

img {
  max-width:100%;
  height:auto !important;
}

nav {
  background-color:#878787;
  display:block !important;
z-index:100;
}

#main {
		background: #eee;
}

.main p {
  text-align:justify;
  line-height:1.3em;
  margin:0 0 0.8em 0;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto; 
}

.main a:link, 
.main a:visited {
  color:#00489a;
  text-decoration:none;
}

.main a:hover,
.main a:visited:hover {
  color:#000;	
}

h1, h2 {
  color:#878787;
}

.main h1 {
  margin-top:0;
  font-size:1.8em;
  font-weight:400;
}

.main h2 {
  margin-top:1em;
}

.main h4 {
  text-transform:uppercase;
  font-size:0.8em;
  margin:0;
}

aside p {
  text-align:left !important;
  font-size:85%;
}

.clr {
  clear:both;
}

footer .fg12 div {
  margin:1em 0;
  padding:0.5em 0;
  font-size:85%;
  border-top:1px solid #00489a;
  border-bottom:1px solid #00489a;
}

.bildrechts {float:right; margin-left:10px;}
.bildlinks {float:left; margin-right:10px;}

img.picfull {width:100%; height:auto;}
img.pic2left {float:left; width:49%; margin: 3px 1% 2px 0; height:auto;}
img.pic2right {float:right; width:49%; margin: 3px 0 2px 0.5%; height:auto;}

img.pic3left {float:left; width:32%; margin: 3px 1.5% 2px 0; height:auto;}
img.pic3right {float:right; width:32%; margin: 3px 0 2px 0.3%; height:auto;}

img.pic4left {float:left; width:24%; margin: 3px 1% 2px 0; height:auto;}
img.pic4right {float:right; width:24%; margin: 3px 0 2px 0.5%; height:auto;}

@media screen and (max-width:800px) {
.logo {
  text-align:center;
  padding-top:2em;
}
}