@media only screen {
    body {
    	background-image: url(bilder/bg.png);
    }
    .BodyBG {
        background-color: rgba(0, 0, 50, 0.8);
        color: #FFFDF0; 
       	width: 90%;
    	margin-top: 10px;
    	margin-right: auto;
    	margin-left: auto;
    	margin-bottom: 10px;
    	word-wrap: normal;
        font-size: 1.0em;
    }
    tr, td {
        font-family: "Lucida Console", "Courier New", monospace;
        border: dashed 1px;
        border-color: grey;
    }
    .item {
        font-size: 0.6em;
    }
    h1 {
        font-size: 1.2em;
    }
    h2 {
        font-size: 1.0em;
        font-style: bold;
        text-decoration: underline;
    }
    h3 {
        font-size: 0.8em;
    }
    .footer {
        font-size: 0.8em;
        color: lightblue;
    }
    
    .box { 
        font-size: 12px;
    }

    .dropdown {
        font-size: 12px;
    }    
}

@media only screen and (min-width: 900px) {
    body {
    	background-image: url(bilder/bg.png);
    	color: black;
    }
    .BodyBG {
        background-color: rgba(0, 0, 50, 0.8);
        color: #FFFDF0; 
    	width: 800px;
    	margin-top: 50px;
    	margin-right: auto;
    	margin-bottom: 10px;
    	margin-left: auto;
    	word-wrap: normal;
        font-size: 1.2em;
    }    
    tr, td {
        font-family: "Lucida Console", "Courier New", monospace;
        border: dashed 1px;
        border-color: grey;
    }
    .item {
        font-size: 0.7em;
    }
    h1 {
        font-size: 1.4em;
    }
    h2 {
        font-size: 1.2em;
        font-style: bold;
        text-decoration: underline;
    }
    .footer {
        font-size: 1.0em;
        color: lightblue;
    }
    .box { 
        font-size: 18px;
    }

    .dropdown {
        font-size: 18px;
    }    
}

table {
  width: 90%;
  margin: 1em;
  border-collapse: collapse;
  border: solid 2px;
}
th {
    color: #EEDAAA;
}

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

a:link {
	color: blue;
    text-decoration: none;
}
a:visited {
	color: darkblue;
    text-decoration: none;
}

.WordSection {
    margin: 20px 20px 20px 20px;
}

a:link {
  color: #BACFED;
}
a:visited {
  color: #92B6EA;
}
a:hover {
  color: #E7EFFB;
}
a:active {
  color: blue;
}  

.box { 
  float: left; 
  margin-right: 2%; 
  padding: 5px; 
  background-color: rgba(0, 0, 110, 1);
  color: #dddddd;
  box-sizing: border-box; 
}

.dropdown {
  float: right; 
  position: relative;
  display: inline-block;
  margin-right: 0%; 
  padding: 5px; 
  background-color: rgba(0, 0, 110, 1); 
  color: #BACFED;
  box-sizing: border-box;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgba(0, 0, 110, 1);
  width: 220px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1;
  left: -105px;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.imagebox {
  width: 80%; /* Breite des Containers bzw. Hintergrundbildes */
  height: auto;
  margin: 0 auto; /* Container in der mitte */
  margin-top: 50px;
  margin-bottom: 50px;
  position: relative;
  padding: .5rem;
  text-align: right;
  background-color: #333366;
  color: #d9d9d9;  
}

.infobox {
  font-size: 0.8em;
}