﻿body{
	top:0px;
	left:0px;
	width:960px;
	height:600px;
	background-image:url('../img/de65-bg.jpg');
	/* background-image:url('../img/de54-bg05.jpg'); */
	background-repeat:repeat;
	1text-shadow:1px 1px 2px #000000;
}

body:hover {
	cursor:default;	
}

html {
  	/* font-family: Tahoma, Arial, Helvetica, sans-serif; */
	font-family: 'Merienda One', cursive;  
}

header {
	width:375px;
	height:30px;	
}

header2 {
  position: fixed;
  width: 100%;
  background: rgba(0,0,0,0.8);
  z-index: 1000;
  
  -o-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  -moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
}

#mycursor {
 	cursor: none;
 	width: 50px;
 	height: 80px;
 	background: url("../img/cursor-person1.gif") no-repeat left top;
 	position: absolute;
 	display: none;
 	top: 0;
 	left: 0;
 	z-index: 10000;
}	

img {
  border:none;
}

a {
  color: #fff;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

#teil2 {
    position: fixed;
    width: 80px; 
    height: 47px;
    top:32%; 
    right: 16px;
	background-image:url('../img/arrows-hand-clear-pointer-right.png');
	z-index:100;
}

#teil2:hover {
	-webkit-box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, .75);
	box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, .75);
}

#teil2 {
	-webkit-box-shadow: 0px 0px 15px 5px rgba(0, 185, 233, .75);
	box-shadow: 0px 0px 15px 5px rgba(0, 185, 233, .75);
	-webkit-transition: all 0.7s ease;
	transition: all 0.7s ease;
	border-radius:60%;
}

#tipp1 {
    position: fixed;
    width: 175px; 
    height: 223px;
    top:32%; 
    right: 98px;
	background-image:url('../img/de65-tipps02.png');
	z-index:100;
}

h1{
	top:10px;
	left:40px;
	width:100%;
	height:20px;
	padding:15px;
	margin-left: 21px;
	line-height:18px;
 	color:mediumblue;
}

.info{
	position:absolute;
	top:350px;
	left:898px;
	width:89px;
}

.arbeitsbogen{
	position:absolute;
	top:227px;
	left:898px;
	width:89px;
}

#cf1 {
	position:absolute;
	top:363px;
	left:59px;
	width:62px;
	height:142px;
	background-image:url('../img/person-links01.png');
}

#cf1 img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

#cf1 img.top:hover {
  opacity:0;
}

#cf {
	position:absolute;
	top:232px;
	left:754px;
	width:62px;
	height:142px;
	background-image:url('../img/person-rechts02.png');
}

#cf2 {
  position:relative;
  height:281px;
  width:450px;
  margin:0 auto;
}

#cf img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

#cf img.top:hover {
  opacity:0;
}

#iconquelle {
  position: fixed;
  left:0;
  bottom:42px;
  width: 100%;
  height: 20px;
  color:#FFFFFF;
  background: rgba(0,0,0,0.4);
  z-index: 1000;
}

#iconquelle p {
  margin: 0px 0 5px 20px;
}

#name-input{
	position:absolute;
	/* top:4px;
	right:20px; */
	width:180px;
	height:90px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:30px;
	background-image:url('../img/de36-zettel01.png');
	background-repeat:no-repeat;
	cursor:move;

}

#name-input p{
	padding:5px 0 0 10px;
	color:black;
	font-family:"Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	font-size:16px;
	line-height:22px;	
}

#auswahl-oben {
	position:absolute;
	top:86px;
	left:32px;
	width:843px;
	height:54px;
	background-image:url('../img/de-65_felder-verteilen-oben01.png');
	background-size:contain;
	
}

#gesicht{
	position:absolute;
	top:100px;
	left:30px;
	width:843px;
	height:410px;
	background-image:url('../arbeitsblaetter/de-65-text01.jpg');
	background-size:cover;
    background-repeat:no-repeat; 
    border:solid 3px #fc052e;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;

   -moz-box-shadow: 9px 10px 11px #000000;
    -webkit-box-shadow: 9px 10px 11px #000000;
    box-shadow: 9px 10px 11px #000000;
}

#gesicht:hover {
	cursor:default;	
}

#gesicht p{
	position:fixed;
	top:104px;
	left:84px;
	width:600px;
	height:30px;
	font-family:"Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	font-size:30px;
	text-align:center;
	line-height:30px;	
}

#button-info{
	position:absolute;
	top:143px;
	right:30px;
	width:30px;
	height:30px;
	 background-image:url('plauen/de36-info.png');
}

.draggable1, .draggable2, .draggable3, .draggable4, .draggable5, .draggable6, .draggable7, .draggable8, .draggable9, .draggable10, .draggable11, .draggable12, .draggable13, .draggable14, .draggable15, .draggable16, .draggable17, .draggable18, .draggable19 {
	width:48px;
	height:48px;
  	padding-top: 0px;
  	z-index: 10;
  
  	/* border: 1px solid #fff;
  
	-o-border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	
	background: #3296fa; /* Old browsers */
	/* background: -moz-linear-gradient(top,  #3296fa 0%, #143278 100%); /* FF3.6+ */
	/* background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3296fa), color-stop(100%,#143278)); /* Chrome,Safari4+ */
	/* background: -webkit-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Chrome10+,Safari5.1+ */
	/* background: -o-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Opera 11.10+ */
	/* background: -ms-linear-gradient(top,  #3296fa 0%,#143278 100%); /* IE10+ */
	/* background: linear-gradient(top,  #3296fa 0%,#143278 100%); /* W3C */
	/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3296fa', endColorstr='#143278',GradientType=0 ); /* IE6-9 */
	
	/* -o-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	-moz-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	-webkit-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8); */
}

.draggable1 {
  	position: absolute;
  	left:34px;
}

.draggable2 {
  	position: absolute;
  	left:122px;
}

.draggable3 {
  	position: absolute;
  	left:210px;
}

.draggable4 {
  	position: absolute;
  	left:298px;
}

.draggable5 {
  	position: absolute;
  	left:385px;
}

.draggable6 {
  	position: absolute;
  	left:473px;
}

.draggable7 {
  	position: absolute;
  	left:561px;
}

.draggable8 {
  	position: absolute;
  	left:648px;
}

.draggable9 {
  	position: absolute;
  	left:735px;
}

.draggable10 {
  	position: absolute;
  	left:822px;
}

.draggable1, .draggable2, .draggable3, .draggable4, .draggable5, .draggable6, .draggable7, .draggable8, .draggable9, .draggable10 {
  	position: absolute;
	top:89px;
	background-image:url('../arbeitsblaetter/de-65-feld02.png');
	background-size: cover;
}

.draggable11, .draggable12, .draggable13, .draggable14, .draggable15, .draggable16, .draggable17, .draggable18, .draggable19 {
  	position: absolute;
	top:1110px;
}

.draggable1:hover, .draggable2:hover, .draggable3:hover, .draggable4:hover, .draggable5:hover, .draggable6:hover, .draggable7:hover, .draggable8:hover, .draggable9:hover, .draggable10:hover, .draggable11:hover, .draggable12:hover, .draggable13:hover, .draggable14:hover, .draggable15:hover, .draggable16:hover, .draggable17:hover, .draggable18:hover, .draggable19:hover {
  /* cursor: move; */
}

.draggable1 p, .draggable2 p, .draggable3 p, .draggable4 p, .draggable5 p, .draggable6 p, .draggable7 p, .draggable8 p, .draggable9 p, .draggable10 p, .draggable11 p, .draggable12 p, .draggable13 p, .draggable14 p, .draggable15 p, .draggable16 p, .draggable17 p, .draggable18 p, .draggable19 p,
.droppable1 p, .droppable2 p, .droppable3 p, .droppable4 p, .droppable5 p, .droppable6 p, .droppable7 p, .droppable8 p, .droppable9 p, .droppable10 p, .droppable11 p, .droppable12 p, .droppable13 p, .droppable14 p, .droppable15 p, .droppable16 p, .droppable17 p, .droppable18 p, .droppable19 p {
  font-weight: bold;
  color:black;
  font-size: 32px;
  text-align:center;
  padding-top:1px;
  margin: 0px 0 0px 0px; 
  text-shadow: -1px -1px 1px #000;
}

.droppable1, .droppable2, .droppable3, .droppable4, .droppable5, .droppable6, .droppable7, .droppable8, .droppable9, .droppable10, .droppable11, .droppable12, .droppable13, .droppable14, .droppable15, .droppable16, .droppable17, .droppable18, .droppable19 {
	width:52px;
	height:52px;
	padding: 0px;
	z-index: 0; 
	1border: 1px dotted red; 
	-o-border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 50%; 
	/* background:#FFFFCC; */
	/* background-color:#FFFFFF; */ 
	/* background-color:#FFCC66; */
	background-color: rgba(251,231,130,0.6);
	/* -o-box-shadow: 5px 5px 10px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	-moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	-webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
	box-shadow: 5px 5px 10px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8); */
}

.droppable1.hovered, .droppable2.hovered, .droppable3.hovered, .droppable4.hovered, .droppable5.hovered, .droppable6.hovered, .droppable7.hovered, .droppable8.hovered, .droppable9.hovered, .droppable10.hovered, .droppable11.hovered, .droppable12.hovered, .droppable13.hovered, .droppable14.hovered, .droppable15.hovered, .droppable16.hovered, .droppable17.hovered, .droppable18.hovered, .droppable19.hovered {
  	background:#CCFFCC;  

}

.dropfield01, .dropfield02, .dropfield03, .dropfield04, .dropfield05, .dropfield06, .dropfield07, .dropfield08, .dropfield09, .dropfield10, .dropfield11, .dropfield12, .dropfield13, .dropfield14, .dropfield15, .dropfield16, .dropfield17, .dropfield18, .dropfield19 {
}


.dropfield01 {
  position: absolute;
	top:185px;
	left:307px;	
}

.dropfield02 {
  position: absolute;
	top:237px;
	left:317px;	
}

.dropfield03 {
  position: absolute;
	top:288px;
	left:314px;	
}

.dropfield04 {
  position: absolute;
	top:338px;
	left:290px;	
}

.dropfield05 {
  position: absolute;
	top:333px;
	left:577px;	
}

.dropfield06 {
  position: absolute;
	top:371px;
	left:208px;	
}

.dropfield07 {
  position: absolute;
	top:371px;
	left:703px;	
}

.dropfield08 {
  position: absolute;
	top:423px;
	left:253px;	
}

.dropfield09 {
  position: absolute;
	top:422px;
	left:632px;	
}

.dropfield10 {
  position: absolute;
	top:511px;
	left:547px;	
}

.dropfield11 {
  position: absolute;
	top:1260px;
	left:484px;	
}

.dropfield12 {
  position: absolute;
	top:1325px;
	left:484px;	
}

.dropfield13 {
  position: absolute;
	top:1390px;
	left:484px;	
}

.dropfield14 {
  position: absolute;
	top:1455px;
	left:484px;	
}

.dropfield15 {
  position: absolute;
	top:1520px;
	left:484px;	
}

.dropfield16 {
  position: absolute;
	top:1260px;
	left:701px;	
}

.dropfield17 {
  position: absolute;
	top:1325px;
	left:701px;	
}

.dropfield18 {
  position: absolute;
	top:1390px;
	left:701px;	
}

.dropfield19 {
  position: absolute;
	top:1455px;
	left:701px;	
}

.titel {
	border:solid 1px #000000;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright:8px;
	-moz-border-radius-bottomleft:8px;
	-moz-border-radius-bottomright:8px;
	-webkit-border-top-left-radius:8px;
	-webkit-border-top-right-radius:8px;
	-webkit-border-bottom-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
	border-top-left-radius:8px;
	border-top-right-radius:8px;
	border-bottom-left-radius:8px;
	border-bottom-right-radius:8px;
	
	transition:All 1s ease-in;
	-webkit-transition:All 1s ease-in;
	-moz-transition:All 1s ease-in;
	-o-transition:All 1s ease-in;
	transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
	-webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
	-moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
	-o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
	-ms-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
	
	background:-moz-linear-gradient(47% 28% 0deg, #E2BA00, #FF6806 95%);

    -moz-box-shadow: 10px 10px 17px #242424;
    -webkit-box-shadow: 10px 10px 17px #242424;
    box-shadow: 10px 10px 17px #242424;
}

.titel:hover{
	transform: rotate(5deg) scale(1.67) skew(0deg) translate(130px);
	-webkit-transform: rotate(5deg) scale(1.67) skew(0deg) translate(130px);
	-moz-transform: rotate(5deg) scale(1.67) skew(0deg) translate(130px);
	-o-transform: rotate(5deg) scale(1.67) skew(0deg) translate(130px);
	-ms-transform: rotate(5deg) scale(1.67) skew(0deg) translate(130px);
}

.stack1,
.stack2,
.stack3 {
  width: 254px;
}

.stack1{
  top:140px;
  left:40px;
}

.stack2{
  top:200px;
  left:100px;
}

.stack3{
  top:260px;
  left:160px;
}

#sortable {
  position: absolute;
  top: 140px;
  left: 40px;
  list-style: none;
}

#sortable li {
  width: 314px;
  height: 19px;
  padding: 15px 20px 20px 20px;
  margin-bottom: 20px;
  z-index: 10;
  
  border: 3px solid #fff;
  
  -o-border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  
  background: #3296fa; /* Old browsers */
  background: -moz-linear-gradient(top,  #3296fa 0%, #143278 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3296fa), color-stop(100%,#143278)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #3296fa 0%,#143278 100%); /* IE10+ */
  background: linear-gradient(top,  #3296fa 0%,#143278 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3296fa', endColorstr='#143278',GradientType=0 ); /* IE6-9 */
  
  -o-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  -moz-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  -webkit-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
}

#sortable li:hover {
  cursor:move;
}

#sortable li p{
  font-weight: bold;
  font-size: 20px;
  color: #fff;
  text-shadow: -1px -1px 1px #000;
}

#list {
  position: absolute;
  top: 140px;
  left: 40px;
  list-style: none;
}

#list li {
  width: 314px;
  height: 19px;
  padding: 15px 20px 20px 20px;
  margin-bottom: 20px;
  z-index: 10;
  
  border: 3px solid #fff;
  
  -o-border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  
  background: #3296fa; /* Old browsers */
  background: -moz-linear-gradient(top,  #3296fa 0%, #143278 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3296fa), color-stop(100%,#143278)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #3296fa 0%,#143278 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #3296fa 0%,#143278 100%); /* IE10+ */
  background: linear-gradient(top,  #3296fa 0%,#143278 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3296fa', endColorstr='#143278',GradientType=0 ); /* IE6-9 */
  
  -o-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  -moz-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  -webkit-box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
  box-shadow: 5px 5px 20px rgba(0,0,0,0.8), inset 2px 2px 5px rgba(0,0,0,0.8);
}

#list li:hover {
  cursor:move;
}

#list li p{
  font-weight: bold;
  font-size: 20px;
  color: #fff;
  text-shadow: -1px -1px 1px #000;
}

li.ui-draggable-dragging {
  list-style: none;
  font-size: 20px;
  font-weight: bold;
}

#button {
	position:absolute;
	1left: 50%;
	1top: 50%;
	margin-left: 890px;
	margin-top: 420px;
	1position: absolute;
	width: 100px;
	height: 100px;  
	border-bottom: 2px solid #eee;
	
	background-image: -webkit-linear-gradient(top, #999, #d0d0d0 80% );
	background-image: -moz-linear-gradient(top, #999, #d0d0d0 80% );
	background-image: -ms-linear-gradient(top, #999, #d0d0d0 80% );
	background-image: -o-linear-gradient(top, #999, #d0d0d0 80% );
	background-image: linear-gradient(top, #999, #d0d0d0 80% );
	
	-moz-border-radius: 100px;  
	-webkit-border-radius: 100px;  
	border-radius: 100px;
	
	box-shadow: inset rgba(0,0,0,0.2) 0px 5px 6px ;
}

.butt {
  position: absolute;
  width: 80px;
  height: 52px;
  left: 10px;
  top: 10px;
  cursor: pointer;
  font-family: "Lucida Sans";
  font-weight: bold;
  font-size: 23px;
  color: #888;
  text-shadow: 0px 1px 0px #fff;
  text-align: center;
  padding-top: 28px;
  
  -moz-border-radius: 100px;  
  -webkit-border-radius: 100px;  
  border-radius: 100px;  
  
  background-image: -webkit-linear-gradient(top, #eee, #bbb 70%, #9f9f9f 100% );
  background-image: -moz-linear-gradient(top, #eee, #bbb 70%, #9f9f9f 100% );
  background-image: -ms-linear-gradient(top, #eee, #bbb 70%, #9f9f9f 100% );
  background-image: -o-linear-gradient(top, #eee, #bbb 70%, #9f9f9f 100% );
  background-image: linear-gradient(top, #eee, #bbb 70%, #9f9f9f 100% );
  
  background-position: 0 6px;
  background-color: #eee;
  background-repeat: no-repeat;
  
  -webkit-box-shadow: rgba(0,0,0,.4) 0 3px 6px;  
  -moz-box-shadow: rgba(0,0,0,.4) 0 3px 6px;  
  box-shadow: rgba(0,0,0,.4) 0 3px 6px;
  
  -webkit-transition: all .1s ease-in;
  -moz-transition: all .1s ease-in;
  -ms-transition: all .1s ease-in;
  -o-transition: all .1s ease-in;
  transition: all .1s ease-in;
}

.butt:hover {
  background-position: 0 0px;
  
  -webkit-box-shadow: rgba(0,0,0,.4) 0 3px 8px;  
  -moz-box-shadow: rgba(0,0,0,.4) 0 3px 8px;  
  box-shadow: rgba(0,0,0,.4) 0 3px 8px;
}

.butt:active {
  width: 76px;
  height: 48px;
  margin: 2px 0 0 2px;   
  border-bottom: 1px solid #fff;
  font-size: 21px;
  color: #777;

  -webkit-box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
  -moz-box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
  box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
}


nav#nav{ 
	margin-top: 41px; 
	margin-left:14px;

} 
nav#nav > a{ 
	background:#B9E1FF; 
	color:#000; 
	padding:5px; 
	margin:7px;
	text-decoration:none; 
	border-radius:5px; 
	font-family:"Arial Black", Gadget, sans-serif; 
    -moz-box-shadow: 7px 7px 5px #212121;
    -webkit-box-shadow: 7px 7px 5px #212121;
    box-shadow: 7px 7px 5px #212121;
} 

nav#nav > a:hover{ 
	background: #BBEA00; 
} 

nav#nav > 
	a:active{ 
	background: #EEFFA8; 
} 

/* "You did it!" message */
#successMessage {
  position: absolute;
  left: 580px;
  top: 250px;
  width: 0;
  height: 0;
  z-index: 100;
  background-image:url('../img/success-bg-de54.jpg');
  background-size: cover;
  background-color:white;
  border: 2px solid #333;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  padding: 20px;
  z-index:350;
}

#clickme {
  position: absolute;
  left: 125px;
  top: 412px;
  width: 250px;
  height:25px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:large;
  text-align:center;
  background-color:lime;
  z-index: 100;
  border: 2px solid #333;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  padding: 0px;
  z-index:360;
}

#arbeitsanweisung {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 0;
  height: 0;
  z-index: 100;
  background-image:url('../img/de65-info01.png');
  background-size: cover;
  background-color:white;
  border: 2px solid #333;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  padding: 20px;
  z-index:350;
}

#clickme2 {
  position: absolute;
  left: 125px;
  top: 412px;
  width: 250px;
  height:25px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:large;
  text-align:center;
  background-color:lime;
  z-index: 100;
  border: 2px solid #333;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  box-shadow: 1.3em 1.3em 1.5em rgba(0, 0, 0, .8);
  padding: 0px;
  z-index:360;
}

#arbeitsanweisung2 {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 0;
  height: 0;
  z-index: 100;
  background-image:url('../img/de65-info01.png');
  background-size: cover;
  background-color:white;
  border: 2px solid #333;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  box-shadow: .3em .3em .5em rgba(0, 0, 0, .8);
  padding: 20px;
  z-index:350;
}

footer {
  position: fixed;
  left:0;
  bottom:0;
  width: 100%;
  height: 40px;
  color:#FFFFFF;
  background: rgba(0,0,0,0.9);
  z-index: 1000;
  
  -o-box-shadow: 0px 5px 10px rgba(0,0,0,0.9);
  -moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.9);
  -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.9);
  box-shadow: 0px 5px 10px rgba(0,0,0,0.9);
}

footer p {
  margin: 9px 0 0 20px;
}