html {
     height: 101%;
}

@font-face
{
font-family:cool;
src: url(Ogirema.ttf);
}

* {
        margin: 0;
        padding: 0;
}

/* 
leichtes blau: #e5ede8
dunkles blau: #134347
schriftfarbe: #325050
gräulich: #F0F6F2
*/


body {
        font-family: serif;
          font-size: 81.25%;   
        background-color:#DCE1DE;
        z-index: 2;
       
		}
		
	

@media screen and (min-width: 68em) and (min-height: 53em) {
  body {
    font-size: 83%;
  }
}

@media screen and (min-width: 75em) and (min-height: 57em) {
  body {
    font-size: 100%;
  }
}

@media screen and (min-width: 80em) and (min-height: 62em) {
  body {
    font-size: 115%;
  }
}


		/* Überschrift */
h1 {	font-family: Georgia;	
	
	color:white;
	font-size: 2em;
	
	}

h2 {
	font-family: Times;
	color: #325050;
	font-size: 1.5em;
	margin: 1% 0 1% 0;
	text-decoration: underline;

	}
	
h3 {font-family: Georgia;
	color:#e5ede8;
	font-size: 2em;
	padding: 10px 0 0 5px;
//	padding: 30px 0 0 220px;
	 }
	 
h4 {
	font-family: Times;
	color: #325050;
	font-size: 1.5em;
	margin: 1% 0 1% 0;

	}
	
p {font-family: Times;

	color:#325050;
	font-size: 1.2em;}
	
	
a {color: #325050;
  text-decoration:none;
  text-decoration: underline;}
  
a:hover
{color: #74B97D;} 
  
 
	
#languages {
	float: right;
	margin-right: 2.5%;
	color: #e5ede8;
	 font-size: 0.9em;}
	 
	 
#breadcrumb {
font-size: 1em;
color: #325050;
  font-weight:bold;
  text-decoration:none;
 margin: 0 0 5% 0;
}

#breadcrumb ul { list-style-type:none;}



article {
width: 70%;
padding-bottom: 1%;
margin-bottom: 8%;
border-bottom: 1px solid #134347; }


#wiki {
float:right;
padding: 1% 4% 2% 0.5%;
border: 2px solid #134347;
font-size: 1.4em;
list-style:none;
background-color: #74B97D;
border-radius: 5px;
font-family: Georgia;
}

#wiki lh {text-decoration: underline;
font-size: 1.45em;
} 
	
.content {
position: absolute;
top: 15%;
left: 1%;
padding: 1% 15% 0 1%;
background-color: #F0F6F2;
min-height: 150%;
width: 65%;
z-index: 1;
}

.kurz {padding-right: 30%;
width: 50%}

.lesson {
	width: 200px;
	height: 200px;
//	background-color: #DCE1DE;	
	background-color: #e5ede8;
	margin: 40px 40px 40px 40px;
	padding-bottom: 22px;
	padding-top: 10px;
	text-align: center;
	border: 1px solid #325050;
	float: left; }
	
img {border: 1px solid #325050;
margin-bottom: 4px;
	}


.header {
	margin: 1% 0 0 1%;
	padding: 0 0 0.4% 0.4%;
	height: 5%;
	width: 97.5%;
   background-color: #134347;
	position: absolute;
	}
	
.sidebar {
	width:10%;
//	width: 230px;
	min-height: 150%;
	position:absolute; 
	top: 13.5%; 
	right: 1%;
	background-color: #134347;
	padding: 10% 0 0 0.5%;}


	
	
#menu {
background-color: #134347;
  position:absolute;  
  left:1%;
  padding-left: 0.5%;
  top: 9%;
  width: 97.5%;
 line-height:1.5;
  float:left;
}

#menu ul {
  list-style-type:none;
  float: left;
  width: 160px;

}

#menu h3 { 
	margin:0;
	padding:0;
font-size: 1.5em; 
text-align: center; 
color: white;
background: #134347; 
} 

#menu a{
font-family: Georgia;
text-decoration: none;
display: block;
  margin: auto;
text-align: center;
  color: white;

}

#menu a:hover
{color: #74B97D; 
background: #325050 ;}

#menu li {position: relative; text-align: center;}

#menu ul ul {
position: absolute;
z-index: 2;
display:none;
background: #134347;
}

#menu ul li:hover ul {display: block;
}


.header {
 background-image: -webkit-linear-gradient(#185C63 0%, #134347 100%); 
background-image: -moz-linear-gradient(#185C63 0%, #134347 100%);
background-image: -o-linear-gradient(#185C63 0%, #134347 100%);
background-image: linear-gradient(#185C63 0%, #134347 100%);}

	

.rechts {
float: right;
margin: 0px 0px 0px 0.5%;
}

.links {
	float: left;
	}