body {
	background: white;
}


#container {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	width: 700px;
	height: 394px;
	margin: auto;
	overflow: hidden; /* alles was raussteht wird abgeschnitten */
	background: lightblue;
}

#baumstamm-1 {
	position: absolute;
	bottom: 0px;
	right: 105px;
	width: 30px;
	height: 150px;
	border-left: 2px solid black;
	border-right: 2px solid black;
}

#laub-1 {
	position: absolute;
	bottom: 80px;
	right: -60px;
	width: 145px;
    height: 250px;
    border-radius: 50%;
    border: 2px solid black;
	background-color: green;
}

#baumstamm-2 {
	position: absolute;
	bottom: 0px;
	right: 350px;
	width: 30px;
	height: 60px;
	border-left: 2px solid black;
	border-right: 2px solid black;
}

#laub-2 {
	position: absolute;
	bottom: 35px;
	right: -60px;
	width: 150px;
    height: 175px;
    border-radius: 50%;
    border: 2px solid black;
	background-color: green; 
}

#baumstamm-3 {
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 30px;
	height: 60px;
	border-left: 2px solid black;
	border-right: 2px solid black;
}

#laub-3 {
	position: absolute;
	bottom: 55px;
	right: -60px;
	width: 150px;
    height: 220px;
    border-radius: 50%;
    border: 2px solid black;
	background-color: darkgreen; 
}

#baumstamm-4 {
	position: absolute;
	bottom: 0px;
	right: 180px;
	width: 30px;
	height: 30px;
	border-left: 2px solid black;
	border-right: 2px solid black;
}

#laub-4 {
	position: absolute;
	bottom: 25px;
	right: -60px;
	width: 150px;
    height: 250px;
    border-radius: 50%;
    border: 2px solid black;
	background-color: lightgreen; 
}

#haus-1 {
	position: absolute;
	bottom: 0;
	left: 0px;
	width: 700px;
	height: 125px;
}

#dach-1 {
	position: absolute;
	bottom: 125px;
	left: 0px;
	width: 700px;
	height: 100px;
	border-top: 2px solid black;
	border-bottom: 2px solid black;
}

#fenster-1 {
	position: absolute;
	top: 30px;
	left: 10px;
	width: 40px;
	height: 50px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-2 {
	position: absolute;
	top: 30px;
	left: 90px;
	width: 40px;
	height: 50px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-3 {
	position: absolute;
	top: 30px;
	left: 170px;
	width: 40px;
	height: 50px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-4 {
	position: absolute;
	top: 30px;
	left: 250px;
	width: 40px;
	height: 50px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-5 {
	position: absolute;
	top: 30px;
	left: 330px;
	width: 40px;
	height: 50px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-6 {
	position: absolute;
	top: 30px;
	left: 410px;
	width: 40px;
	height: 50px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-7 {
	position: absolute;
	top: 30px;
	left: 490px;
	width: 40px;
	height: 50px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-8 {
	position: absolute;
	top: 30px;
	left: 570px;
	width: 40px;
	height: 50px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-9 {
	position: absolute;
	top: 30px;
	left: 650px;
	width: 40px;
	height: 50px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-10 {
	position: absolute;
	top: 45px;
	left: 15px;
	width: 30px;
	height: 40px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-11 {
	position: absolute;
	top: 45px;
	left: 115px;
	width: 30px;
	height: 40px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-12 {
	position: absolute;
	top: 45px;
	left: 195px;
	width: 30px;
	height: 40px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-13 {
	position: absolute;
	top: 45px;
	left: 295px;
	width: 30px;
	height: 40px;
	background-color: gray;
	border: 2px solid black;		
}

#fenster-14 {
	position: absolute;
	top: 45px;
	left: 445px;
	width: 30px;
	height: 40px;
	background-color: lightgray;
	border: 2px solid black;		
}

#fenster-15 {
	position: absolute;
	top: 45px;
	left: 605px;
	width: 30px;
	height: 40px;
	background-color: lightgray;
	border: 2px solid black;		
}

 .cloud1,  
 .cloud2,  
 .cloud3,  
 .cloud4,  
 .cloud5,  
 .cloud6 {  
  
     position: absolute;  
  
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }  
  
 .cloud1, .cloud4 {    
  
     width: 200px;    
     height: 60px;    
	 background: white;  
 }    
  
 .cloud1 {  
  
     top: 80px;  
     left:-230px;  
     animation: cloud1 50s infinite linear;  
 }  
  
 @keyframes cloud1 {  
     from{transform: translate3d(-130px,0,0)}  
     to{transform: translate3d(1900px,0,0)}  
 }  
  
 .cloud2 {  
  
     top: 200px;  
     left:-230px;  
     animation: cloud2 20s infinite linear;  
 }  
  
 @keyframes cloud2 {  
     from{transform: translate3d(-90px,0,0)}  
     to{transform: translate3d(1900px,0,0)}  
 }  
  
 .cloud3 {  
  
     top: 300px;  
     right:-230px;  
     animation: cloud3 60s infinite linear;  
 }  
  
 @keyframes cloud3 {  
     from{transform: translate3d(210px,0,0)}  
     to{transform: translate3d(-1900px,0,0)}  
 }  
  
 .cloud4 {  
  
     top: 400px;  
     left:-230px;  
     animation: cloud4 80s infinite linear;  
 }  
  
 @keyframes cloud4 {  
     from{transform: translate3d(-80px,0,0)}  
     to{transform: translate3d(1900px,0,0)}  
 }  
  
 .cloud5 {  
  
     top: 300px;  
     left:-230px;  
     animation: cloud5 100s infinite linear 1s;  
 }  
  
 @keyframes cloud5 {  
     from{transform: translate3d(-80px,0,0)}  
     to{transform: translate3d(1900px,0,0)}  
 }  
  
 .cloud6 {  
  
     top: 150px;  
     right:-230px;  
     animation: cloud6 40s infinite linear 1s;  
 }  
  
 @keyframes cloud6 {  
     from{transform: translate3d(300px,0,0)}  
     to{transform: translate3d(-1900px,0,0)}  
 }     
  
 .cloud1:after, .cloud4:after {    
  
     content: '';    
     position: absolute;    
     top:-40px;    
     left: 20px;    
     width: 80px;    
     height: 80px;     
     background:white;   
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }    
  
 .cloud1:before, .cloud4:before {    
  
     content: '';    
     position: absolute;    
     top:-60px;    
     right: 30px;    
     width: 100px;    
     height: 100px;    
     background: white;    
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }    
  
 .cloud2, .cloud5 {    
  
     width: 100px;    
     height: 30px;   
     background: white;    
 }    
  
 .cloud2:after, .cloud5:after {    
  
     content: '';    
     position: absolute;    
     width: 40px;    
     height: 40px;    
     top:-20px;    
     left: 10px;    
     background: white;     
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }    
  
 .cloud2:before, .cloud5:before {    
  
     content: '';  
     position: absolute;    
     top:-30px;    
     right: 15px;    
     width: 50px;    
     height: 50px;    
     background: white;   
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }    
  
 .cloud3, .cloud6 {    
  
     width: 200px;    
     height: 60px;    
     background: white;      
 }    
  
 .cloud3:after, .cloud6:after {    
  
     content: '';    
     position: absolute;   
     width: 80px;    
     height: 80px;    
     top:-40px;    
     left: 20px;    
     background: white;   
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }    
  
 .cloud3:before, .cloud6:before {    
  
     content: '';    
     position: absolute;   
     width: 100px;    
     height: 100px;    
     top:-60px;    
     right: 30px;    
     background: white;    
     -webkit-border-radius: 200px;    
     -moz-border-radius: 200px;    
     border-radius: 200px; 
 }