body
{ margin: 5%;
  max-width: 90%}

@media screen and (min-width: 0px) and (max-width: 550px)
{
  body {background-color: #e1f2fc}
}

@media screen and (min-width: 551px)
{
  body {background: url("wolken neu.png") no-repeat center center fixed;
        background-size: 100%}
}


header,
nav,
main,
article,
section,
aside,
footer 
{ border-radius: 0.7em;
  border: 1px solid;
  padding: 0.5% 0.5%;
  margin: 0.5%}


header 
{ background: #FFFFFF;
  border-color: #003399}


nav 
{ background: #FFFFFF;
  border-color: #003399}

ul 
{ list-style-type: none;
  margin: 0.5%;
  padding: 0;
  overflow: hidden;
  border: 1px solid;
  border-color: #FFFFFF;
  border-radius: 0.7em}

li 
{ float: left}

li a 
{ display: block;
  width: 155px;
  color: #1811E0;
  text-align: left;
  margin: 5px;
  padding: 10px;
  text-decoration: none;
  font-family: Garamond;
  font-size: 17px}

li a.one:hover {
  background-color: #1811E0;
  color: #FFFFFF;
  border-radius: 0.7em}


ul#footer {list-style-type: none;
  margin: 0.5%;
  padding: 0;
  overflow: hidden}

ul#footer
li a {
  display: block;
  width: 155px;
  color: #1811E0;
  text-align: left;
  margin: 5px;
  padding: 10px;
  text-decoration: none;
  font-family: Garamond;
  font-size: 17px}

ul#footer
li a:hover {
  background-color: #1811E0;
  color: #FFFFFF;
  border-radius: 0.7em}


main 
{ display: block;
  background-color: #d3d6d8;
  background-size: 100%;
  border-color: #003399}


article 
{ background: #FFFFFF;
  border-color: #003399}

article 
{ font-family: Garamond;
  font-size: 17px;
  color: #1811E0;
  padding: 35px 25px}


#galerie 
{ list-style-type: none;
  margin: 0.5%;
  padding: 0}

#galerie li 
{ float: left;
  margin: 50px 0 0 15px}

#galerie li a 
{ display: block;
  width: 295px;
  color: #1811E0;
  text-align: left;
  margin: 10px 0 10px 0;
  padding: 0px;
  text-decoration: none;
  font-family: Garamond;
  font-size: 17px}

#galerie li a.two:hover
{ color: #FF0000}

#galerie img
{ width: 200px;
  height: 200px;
  display: block;
  padding: 3px}

img 
{ display: inline-block}
  
@media screen and (min-width: 0px) and (max-width: 550px)
{
  img {width: 100%;
  margin-left: 0%;}
}

@media screen and (min-width: 551px)
{
  img {width: 50%;}
}