* {
	marging: 0;
	padding: 0;
}

.wrapper {
   width: 318px;
   height: 556px;
   font-family: arial;
}

.bilddiv {
padding-top: 1px;
}

.diadiv {
width: 315px;
height: 280px;
background: white;
position: relative;
}

#uIElement {
/*width: 360px;*/
padding-left: 1px;
border: 1px solid #333333;
border-color: "yellow";
float: left;
}

.img-les {
  width: 150px;
  padding-left: 35px;
}

.pfeil {
  width: 50px;
  height: 30px;
  padding-left: 35px;
}

.TESTDIV {
 position: absolute; 
 bottom: 0;
 width: 20px;
 height: 10px;
 background-color:blue;
}

.btn5 {
  position: absolute; 
  bottom: 0;
  height: 15px;
  width: 261px;
  background: #fcffcc;
  background-image: -webkit-linear-gradient(top, #fcffcc, #f3f570);
  background-image: -moz-linear-gradient(top, #fcffcc, #f3f570);
  background-image: -ms-linear-gradient(top, #fcffcc, #f3f570);
  background-image: -o-linear-gradient(top, #fcffcc, #f3f570);
  background-image: linear-gradient(to bottom, #fcffcc, #f3f570);
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666;
  font-family: Arial;
  color: #28190b;
  font-size: 19px;
  padding: 4px 3px 8px 3px;
  border: solid #230559 2px;
  text-decoration: none;
  text-align: center;
}

.btn5:hover {
  background: #e6f2ff;
  background-image: -webkit-linear-gradient(top, #e6f2ff, #efe8fc);
  background-image: -moz-linear-gradient(top, #e6f2ff, #efe8fc);
  background-image: -ms-linear-gradient(top, #e6f2ff, #efe8fc);
  background-image: -o-linear-gradient(top, #e6f2ff, #efe8fc);
  background-image: linear-gradient(to bottom, #e6f2ff, #efe8fc);
  text-decoration: none;
}



/*Smartphone ausgehend von IphoneSE - Samsung Galaxy hoch*/
@media only screen and (min-width: 319px) and (min-height: 567px) {
	
	 .wrapper {
    width: 300px;
    height: 530px;
    margin: 0 auto;
    }
	
	.bilddiv {
   padding-top: 0px;
	width: 334px;
   background: white;
   }
   
   .img-les {
     padding-top: 3px;
     width: 250px;
     padding-left: 2px;
   }
   
    #uIElement {
     width: 270px;
     height: 180px;
     margin-bottom: 10px;
    }

   
   .diadiv {
     width: 272px;
     height: 220px;
     background-color: white;
    }
}

/*Smartphone ausgehend von IPhoneSE - Samsung Galaxy quer*/
@media only screen and (min-width: 567px) and (min-height: 319px) {
	
 .wrapper {
    width: 480px;
    height: 290px;
    margin: 0 auto;
    }
	
	.bilddiv {
   width: 260px;
	padding-top: 1px;
	padding-left: 1px;
   padding-right: 5px;	
   float: right;
   }
   
   .img-les {
     width: 200px;
     padding-left: 1px;
     float:right;
   }   
   
    #uIElement {
     width: 270px;
     height: 180px;
    }
   
   .diadiv {
     width: 272px;
     height: 220px;
     background-color: white;
    }


/*Tablet Hochformat*/
@media only screen and (min-width: 762px) and (min-height: 1000px) {

   .wrapper {
    width: 750px;
    height: 990px;
    }
    
 	.bilddiv {
	 width: 400px;
	 padding-top: 1px;
 	 padding-left: 1px;
    padding-right: 5px;		
    background-color: white; 
   }

   .img-les {
     float:left;
     width: 350px;
     padding-left: 100px;
   }
   
     #uIElement {
     width: 545px;
     height: 356px;
    }
    
   .diadiv {   
     margin-top: 400px;	
     width: 545px;
     height: 400px;
     background-color: white;
   }
   
   .btn5 {
      width: 535px;	
   }
}	

/*Tablet Quer und PC*/
@media only screen and (min-width: 1000px) and (min-width: 762px)  {
	.wrapper {
    width: 990px;
    height: 730px;
    margin: 0 auto;
   }
     	
	.bilddiv {
    width: 400px;
 	 padding-top: 1px;
	 padding-left: 1px;
    padding-right: 55px;	
    float: right;		
   }
   
   .img-les {
     width: 350px;
     padding-right: 3px;
   }
   
   #uIElement {
     width: 534px;
     height: 356px;
    }
      
   .diadiv {
     width: 545px;
     height: 400px;
     background-color: white;
    }
    
   .btn5 {
     width: 525px;	
    }
}