@import url(http://fonts.googleapis.com/css?family=Droid+Sans:400,700);

body {
	background: rgb(229,229,229);
	background: -moz-linear-gradient(top,  rgba(229,229,229,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229,229,229,1)), color-stop(100%,rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top,  rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(top,  rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(top,  rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(top,  rgba(229,229,229,1) 0%,rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff',GradientType=0 );
	background-attachment: fixed;
	
	font-family: 'Droid Sans', sans-serif;
}

/*Kopfzeile und Menü oben am Rand fixieren*/
#TopRow {
	position: fixed;
	top: 0px;
	width: 100%;
	padding-top: 5px;
	background-color: #e9e9e9;
	z-index: 5;
}

/*Kopfzeile und Menü oben am Rand fixieren*/
#AbstandOben {
	margin-top: 80px;
}

/*Divs für Titelleiste*/
#Titelleiste {
	position: relative;
	width: 900px;
	height: 80px;
}
#Lernwerkstatt {
	position: absolute;
	width: 500px;
	height: 80px;	
}
#TextLernplan {
	position: absolute;
	margin-left: 490px;
	margin-top: 40px;
}
#VorZuNamen {
	position: absolute;
	margin-left: 660px;
	margin-top: 16px;
}


#menu {
	width: 100%;
	height: 50px;
	margin: 10px auto;
	font-family: 'Droid Sans', sans-serif;
	background: #fff;		/*zuvor: #fff  Menüstreifen-Farbe  */
	box-shadow: 0 0 10px #aaa; /*zuvor: 10px  */
}

#menu a {
	color: #000;	/*zuvor: #000  Menü-Schrift-Farbe  */
	text-decoration: none;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;	
}

#menu .inhalt {
	width: 900px;
	margin: 10px;		
}

#menu .inhalt ul {
	position: absolute;
	margin: 0 auto; /* Haupt-Menü Fächer  */
	list-style: none;
	
}

#menu .inhalt ul li {/* Haupt-Menü Fächer  */
	float: left;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 5px;
	
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 50px;
	padding-right: 10px;	
	
	font-size: 18px; /* Schriftgröße Haupt-Menü Fächer*/
	font-weight: bold;
	line-height: 50px;	
}

#menu .inhalt>ul>li:hover {	/* Oberste Zeile der Bereichsmenüs */
	height: 50px;
	margin-top: -5px;
	padding-left: -20px;
	background: #eee;	/*zuvor: #eee  Menü-Schrift-Hintergrund Farbe  */
						/*background: rgb(255,1,1);*/
	border-top: 5px solid #333;
	box-shadow: 0 0 5px #aaa;
}

#menu .inhalt ul li img { /*Platzierung des Haupt-Menüs: Bild-Schrift */
	float: left;
	
	height: 28px;
	margin-top: 11px;
	margin-left: -50px;
	margin-right: 5px;
	padding: 0px;
	background: #000;  /*zuvor: #000  Menü-Schrift-Hintergrund Farbe  */
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

#menu .inhalt ul li ul {
	top: -9999px;
	min-width: 180px;
	background: #eeeeee;  /*zuvor: #eeeeee  Menü-Hintergrund Farbe nach unten auslaufend  */
	background: -moz-linear-gradient(top,  #eeeeee 0%, #ffffff 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#ffffff));
	background: -webkit-linear-gradient(top,  #eeeeee 0%,#ffffff 100%);
	background: -o-linear-gradient(top,  #eeeeee 0%,#ffffff 100%);
	background: -ms-linear-gradient(top,  #eeeeee 0%,#ffffff 100%);
	background: linear-gradient(top,  #eeeeee 0%,#ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 );
	padding: 0;	/*Menü der Bereiche Platzierung */
	margin: 0 0 0 -10px;
	box-shadow: 0 1px 5px #aaa;
}

#menu .inhalt ul li:hover ul {
	top: 50px; /* da erscheint das Bereichs Menü*/
	margin-left: -50px;	
}

#menu .inhalt ul ul li { /*Bereichs Menü*/
	float: none;
	font-size: 16px;
	padding: 10px 20px;
	text-align: left;
	margin-top: 0px;
	margin-left: -5px;
	margin-right: 0px;
	margin-bottom: 0px;
	border-bottom: 1px solid #ddd;
	line-height: 20px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

#menu .inhalt ul ul li:hover {
	background: #999; 	/*zuvor: #333  Menü-Feld-Hintergrund Farbe bei hover */
	color: #fff;		/*zuvor: #fff  */
	padding-left: 22px;
}

#menu .inhalt ul ul li a {
	display: block;
}

#menu .inhalt ul ul li a:hover {
	color: #fff;
}

#menu li ul li ul {
	position: absolute;
	left: -9999px;
}

#menu .inhalt ul ul li:hover ul {/* platziert das Einzelübungsmenü  */
	left: 100%;
	top: auto;
	margin-top: -20px;
	margin-left: -80px;
	z-index: 3;
}

#menu .inhalt ul li ul li ul li img {
	float: left;
	
	height: 28px;
	margin: -4px 2px ;
	padding: 0px; 
	background: #000;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
	z-index: 3;
}

#box { position: absolute;   
       height: auto; width: 800px;    
       left: 20px; top: 120px; 
	   background: #fff;
	   padding: 30px;
	   padding-left: 60px;
}

/*die bis zu 10 divs mit den Aufträgen*/
#ue0, #ue1, #ue2, #ue3, #ue4, #ue5, #ue6, #ue7, #ue8, #ue9, #ue10, #ue11 {
	position: relative;
	background-color: white;
	z-index: 2;
	border-style: solid;
	border-color: #F7B12A;
	border-width: 2px;
	padding-left: 2px;
	padding-right: 2px;
	width: 798px;
	height: 90px;
}
/*die divs mit den Icons*/
#mini0, #mini1, #mini2, #mini3, #mini4, #mini5, #mini6, #mini7 ,#mini8, #mini9, #mini10, #mini11 {
	position: absolute;
	width: 69px;
	height: 69px;
	margin-left: 5px;
	margin-top: 10px;
}
/*die divs mit den Aufgaben und Freitexten*/
#uelabt0, #uelabt1, #uelabt2, #uelabt3, #uelabt4, #uelabt5, #uelabt6, #uelabt7, #uelabt8, #uelabt9, #uelabt10, #uelabt11 {
	position: absolute;
	margin-left: 80px;
	margin-top: 4px;
	padding-right: 0px;
	width: 380px;
	height: 85px;
}
#other {
    resize: none;
	margin-left: 0px;
	font-size: 100%;
	font-family: 'Droid Sans', sans-serif;
	color: #000000;
	z-index: 0;
} 
#lblother {
	display: block;
	margin-left: 6px;
	float: none;
	font-size: 16px;
	font-family: 'Droid Sans', sans-serif;	
	font-style: normal;
	text-align: left;
}

/*die bis zu 10 divs mit den Aufträgen*/
#ueart0, #ueart1, #ueart2, #ueart3, #ueart4, #ueart5, #ueart6, #ueart7, #ueart8, #ueart9, #ueart10, #ueart11 {
	position: absolute;
	margin-left: 466px;
	margin-top: 10px;
	width: 195px;
	height: 45px;
}

/*die 10 divs mit den Erfolgssmileys und Aufgabennummern*/
#posi0, #posi1, #posi2, #posi3, #posi4, #posi5, #posi6, #posi7, #posi8, #posi9, #posi10, #posi11 {
	position: absolute;
	margin-left: 666px;
	margin-top: 12px;
	width: 120px;
	height: 60px;
	Text-align: center;
	font-weight: bold;
}

/*die 10 divs mit den Sternenzahlen ya: Ohne Sterne*/
#ueya0, #ueya1, #ueya2, #ueya3, #ueya4, #ueya5, #ueya6, #ueya7, #ueya8, #ueya9, #ueya10, #ueya11 {
	position: absolute;
	margin-left: 465px;
	margin-top: 58px;
	width: 200px;
	height: 30px;
	Text-align: center;
}
/*die 10 divs mit den Sternenzahlen yb: Einfache Sterne*/
#ueyb0, #ueyb1, #ueyb2, #ueyb3, #ueyb4, #ueyb5, #ueyb6, #ueyb7, #ueyb8, #ueyb9, #ueyb10, #ueyb11 {
	position: absolute;
	margin-left: 468px;
	margin-top: 58px;
	width: 50px;
	height: 30px;
}
/*die 10 divs mit den Sternenzahlen yc: Mittlere Sterne*/
#ueyc0, #ueyc1, #ueyc2, #ueyc3, #ueyc4, #ueyc5, #ueyc6, #ueyc7, #ueyc8, #ueyc9, #ueyc10, #ueyc11 {
	position: absolute;
	margin-left: 518px;
	margin-top: 58px;
	width: 50px;
	height: 30px;
}
/*die 10 divs mit den Sternenzahlen yd: Schwere Sterne*/
#ueyd0, #ueyd1, #ueyd2, #ueyd3, #ueyd4, #ueyd5, #ueyd6, #ueyd7, #ueyd8, #ueyd9, #ueyd10, #ueyd11 {
	position: absolute;
	margin-left: 567px;
	margin-top: 58px;
	width: 50px;
	height: 30px;
}
/*die 10 divs mit den Sternenzahlen ye: Sehr schwere Sterne*/
#ueye0, #ueye1, #ueye2, #ueye3, #ueye4, #ueye5, #ueye6, #ueye7, #ueye8, #ueye9, #ueye10, #ueye11 {
	position: absolute;
	margin-left: 617px;
	margin-top: 58px;
	width: 50px;
	height: 30px;
}
/*die 10 divs zum Löschen von Aufgaben*/
#koxx0, #koxx1, #koxx2, #koxx3, #koxx4, #koxx5, #koxx6, #koxx7, #koxx8, #koxx9, #koxx10, #koxx11 {
	position: relative;
	margin-left: 777px;
	margin-top: -23px;
	width: 46px;
	height: 46px;
	cursor: pointer;	
}  

#sta0, #sta1, #sta2, #sta3, #sta4, #sta5, #sta6, #sta7, #sta8, #sta9, #sta10, #sta11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#stb0, #stb1, #stb2, #stb3, #stb4, #stb5, #stb6, #stb7, #stb8, #stb9, #stb10, #stb11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#stc0, #stc1, #stc2, #stc3, #stc4, #stc5, #stc6, #stc7, #stc8, #stc9, #stc10, #stc11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#std0, #std1, #std2, #std3, #std4, #std5, #std6, #std7, #std8, #std9, #std10, #std11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#ste0, #ste1, #ste2, #ste3, #ste4, #ste5, #ste6, #ste7, #ste8, #ste9, #ste10, #ste11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#stf0, #stf1, #stf2, #stf3, #stf4, #stf5, #stf6, #stf7, #stf8, #stf9, #stf10, #stf11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#stg0, #stg1, #stg2, #stg3, #stg4, #stg5, #stg6, #stg7, #stg8, #stg9, #stg10, #stg11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

#sth0, #sth1, #sth2, #sth3, #sth4, #sth5, #sth6, #sth7, #sth8, #sth9, #sth10, #sth11 {
	font-size: 15px;
	width: 2.4em;
	cursor: pointer;
}

input {
	font-size: 15px;
	width: 6.95em;
	cursor: pointer;
} 
	   
label {
	display: block;
	margin-left: 0px;
}


#pdf {
  background-color: #ffb900;
  border: none;
  padding: 8px 12px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  margin: 2px 1px;
  cursor: pointer;
}

#machpdf1 { 
	position: relative;   
    height: auto; 
	width: 300px;
	margin-left: 510px;	
	cursor: pointer;
}

#machpdf2 { 
	position: relative;   
    height: auto; 
	width: 300px;
	margin-left: 510px;	
	cursor: pointer;
}

#kill {
  background-color: #cccccc;
  border: none;
  color: red;
  padding: 3px 5px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  margin: 0px 0px;
  cursor: pointer;
}

#safe {
  background-color: #cccccc;
  border: none;
  color: blue;
  padding: 3px 5px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  margin: 0px 0px;
  cursor: pointer;
}

/*
button {
  background-color: #cccccc;
  border: none;
  color: blue;
  padding: 3px 5px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  margin: 0px 0px;
  cursor: pointer;
}
*/

#my_textarea {
    resize: none;
	font-size: 128%;
	font-family: 'Droid Sans', sans-serif;
	color: #000000;
	z-index: 0;
} 


#but_ok { position: absolute;       
       left: 865px; top: 174px; 
	   background: #fff;
	   z-index: 0;
}

#but_ok2 { position: absolute;       
       left: 805px; top: 139px; 
	   background: #fff;
	   z-index: 0;
}

/*sb sind die Vorschau-Bilder Mini bei hover über Menübildchen*/
#sb0, #sb1, #sb2, #sb3, #sb4, #sb5, #sb6, #sb7, #sb8, #sb9, #sb10, #sb11 { 
	position: fixed;
    left: 120px;
	top: 150px;
	width: 320px;
	height: 240px;
	border: 2px solid silver;
	visibility: hidden;
	z-index: 10;
}


#rahmenM {position: fixed;
    left: 720px;
	top: 120px;
    width: 320px;
    height: 240px;
	border: 2px solid blue;
	visibility: hidden;
	z-index: 10;	
}

#rahmenD {position: fixed;
    left: 720px;
	top: 120px;
    width: 320px;
    height: 240px;
	border: 2px solid red;	
	visibility: hidden;
	z-index: 10;
}

#rahmenW {position: fixed;
    left: 720px;
	top: 120px;
    width: 320px;
    height: 240px;
	border: 2px solid magenta;	
	visibility: hidden;
	z-index: 10;
}

#rahmenF {position: fixed;
    left: 200px;
	top: 120px;
    width: 320px;
    height: 240px;
	border: 2px solid cyan;	
	visibility: hidden;
	z-index: 10;
}

#rahmenG {position: fixed;
    left: 200px;
	top: 120px;
    width: 320px;
    height: 240px;
	border: 2px solid green;
	z-index: 1;
	visibility: hidden;
	z-index: 10;
}

#st1 {z-index: 20;}

#Keksdings {position: absolute; 
	bottom: 0;
	right: 10px;
}

h2 { 
  display: block;
  font-size: 18px;
  margin-top: 0;
  margin-bottom: 1em;
  margin-left: 2.25em;
  margin-right: 1.5em;
  font-weight: bold;
}

h3 { 
  display: block;
  font-size: 18px;
  margin-top: 0.3em;
  margin-bottom: 0.3em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}