#menuoben{
position: relative;
width: 1000px;
margin-top: 55px;
display:flex;
left: 50%;
margin-left: -500px;

}

#menuunten{
 position: relative;
margin-top: 613px;
width: 1000px;
display:flex;
left: 50%;
margin-left: -500px;
}

.menuoben {
position: relative;
background:#ffffff;
height: 44px;
min-width: 70px;
max-width:150px;
opacity: 1;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border: #000000;
border-radius:10px 10px 10px 10px;
border-width: 1px;
margin-left: auto;
margin-right: auto;
padding: 0;
}  

.txtinmenuoben {
text-align:center;
font-family: Arial;
font-weight:normal;
color: #000000;
font-size: 24px;
margin-top: 8px;
}


.menuunten {
position: relative;
background:#ffffff;
height: 44px;
min-width: 70px;
max-width:150px;
opacity: 1;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border: #000000;
border-radius:10px 10px 10px 10px;
border-width: 1px;
margin-left: auto;
margin-right: auto;
padding: 0;
}  

.activeGsa {
box-shadow: 3px 3px 30px #a49c99, 3px 3px 30px #000000;
border-width: 2px;
}  

.txtinmenuunten {
  position: relative;
text-align:center;
text-shadow:0 -0.1px 0.1px rgba(0,0,0,.5);
font-family: Arial;
font-weight:normal;
color: #000000;
top: 5px;
font-size: 25px;
margin-right: 2px;
margin-left: 2px;
}

#mitte{
position: absolute;
float: right;
background:#ccc7c5;
box-shadow: 3px 3px 30px #a49c99, 3px 3px 30px #000000;
background-repeat: repeat-x;
width: 1000px;
height: 590px;
left: 1%;
top: 110px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
overflow: scroll;
}

.inhalt {
position: relative;
float: left;
width:290px;
height:62px;
background:#ffffff;
font-family: Arial;
color: #5a566d;
margin-top: 19px;
margin-right: 20px;
margin-left: 20px;
box-shadow: 3px 3px 30px #a49c99, 3px 3px 30px #000000;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}

.packetinhal {
position: relative;
float: left;
width:290px;
height:62px;
background:#ffffff;
font-family: Arial;
color: #5a566d;
margin-top: 19px;
margin-right: 20px;
margin-left: 20px;
box-shadow: 3px 3px 30px #a49c99, 3px 3px 30px #000000;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}


.txtininhalt {
text-align:left;
position: relative;
font-family: Arial;
font-weight:normal;
color: #242120;
font-size: 19px;
margin-top: -43px;
margin-left: 70px;
resize: none;
border: none;
width: 200px;
height: 40px;
}

.iconininhalt {
text-align:center;
position: relative;
width: 62px;
height: 62px;
top: -0px;
left: -1px;
-webkit-border-radius: 10px 0px 0px 10px;
-moz-border-radius:10px 0px 0px 10px;
border-radius:10px 0px 0px 10px;
background: #ff7300;
}

.iconininhalt2 {
width: 45px;
height: 45px;
margin-top:6px;
    border: 3px solid #ffffff00;
  border-radius:80px 80px 80px 80px;
}

.iconininhalt2ring {
  animation: ring 1s infinite;
  animation-direction:alternate;
  animation-timing-function: ease-in-out;

    border: 3px solid white;
  border-radius:80px 80px 80px 80px;

}

@keyframes ring {
  0% {
    transform: rotateZ(80deg);
  }
  100% {
    transform: rotateZ(-80deg);
  }


  }

  .iconininhalt3ring {
  animation: ring3 1s infinite;
  animation-direction:alternate;
  animation-timing-function: ease-in-out;

    border: 3px solid white;
  border-radius:80px 80px 80px 80px;

}

@keyframes ring3 {
    from {
        opacity:0.3;
    }
    to {
        opacity:1;
    }

  }



textarea {
text-align:left;
position: relative;
top: -6px;
left: -6px;
}

.DD1 {
background: #ff7300;
text-align:center;
position: relative;
width: 63.3px;
height: 63.3px;;
-webkit-border-radius: 10px 0px 0px 10px;
-moz-border-radius:10px 0px 0px 10px;
border-radius:10px 0px 0px 10px;
white-space: pre-wrap;
}

.generate {
display: none; 
 position: fixed;
  top: 655;
  left: 850;
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  -webkit-box-shadow: 0px 0px 20px #666666;
  -moz-box-shadow: 0px 0px 20px #666666;
  box-shadow: 0px 0px 20px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  border: solid #000000 2px;
  text-decoration: none;
  background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
}

.generate:hover {
  background: #3bf508;
  text-decoration: none;
}

  .add {
  position: fixed;
  top: 720;
  left: 650;
  width: 171px;
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
      border-radius: 10px 10px 10px 10px;
  -webkit-box-shadow: 0px 0px 20px #666666;
  -moz-box-shadow: 0px 0px 20px #666666;
  box-shadow: 0px 0px 20px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  border: solid #000000 2px;
  text-decoration: none;
  background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
}

.add:hover {
  background: #3bf508;
  text-decoration: none;
}

  .send {
  position: fixed;
  top: 720;
  left: 843;
  width: 171px;
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
      border-radius: 10px 10px 10px 10px;
  -webkit-box-shadow: 0px 0px 20px #666666;
  -moz-box-shadow: 0px 0px 20px #666666;
  box-shadow: 0px 0px 20px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  border: solid #000000 2px;
  text-decoration: none;
  background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
}

.send:hover {
  background: #3bf508;
  text-decoration: none;
}


.sensoriconremove {
    position: absolute;
    width: 20px;
    height: 20px;
    margin-top: -59px;
    margin-left: 19px;
    }

          #white-background{
                display: none;
                width: 100%;
                height: 100%;
                position: fixed;
                top: 0px;
                left: 0px;
                background-color: #fefefe;
                opacity: 0.7;
                z-index: 9999;
            }
            
            #confbox{
                /*initially dialog box is hidden*/
                display: none;
                position: fixed;
                width: 480px;
                z-index: 9999;
                border-radius: 10px;
                background-color: #7c7d7e;
            }

                      #white-background2{
                display: none;
                width: 100%;
                height: 100%;
                position: fixed;
                top: 0px;
                left: 0px;
                background-color: #fefefe;
                opacity: 0.7;
                z-index: 9999;
            }
            
            #confbox2{
                /*initially dialog box is hidden*/
                display: none;
                position: fixed;
                width: 480px;
                z-index: 9999;
                border-radius: 10px;
                background-color: #7c7d7e;
            }

           #dlg-header{
                background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
                color: white;
                font-size: 20px;
                padding: 10px;
                margin: 10px 10px 0px 10px;
                font-weight: lighter;
text-shadow: 1px 1px 7px #656e70;
font-family: Arial;
    border: 1px solid #000000;
    border-radius: 3px;
            }
            
            #dlg-body{
                background-color: white;
                color: black;
                font-size: 14px;
                padding: 10px;
                margin: 0px 10px 0px 10px;
                  font-weight: lighter;
font-family: Arial;
            }
            
            #dlg-footer{
                background-color: #f2f2f2;
                text-align: right;
                padding: 10px;
                margin: 0px 10px 10px 10px;
            }
            
            #dlg-footer button{
                background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
                color: white;
                padding: 5px;
                border: 0px;
                  font-weight: lighter;
text-shadow: 1px 1px 7px #656e70;
font-family: Arial;
            }



.logo3 {
    position: fixed;
    top: 605px;
    left: 903px;
    width: 100px;
    height: auto;
    
}

#loadpng {
    position: fixed;
    top: 50%;
    left: 50%;
}


#waHeadTitle {
color: #000000;
}

.setpacket {
position: relative;
width: 42px;
top: -68px;
left: 270px;
}

#PacketboxFenster {
  position: fixed;
background:#ccc7c5;
height: 200px;
width: 702px;
top: 50%;
left: 50%;
margin-left: -375px;
margin-top: -200px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border: 2px solid #666666;
border-radius:10px 10px 10px 10px;
-webkit-box-shadow: 0px 0px 20px #666666;
-moz-box-shadow: 0px 0px 20px #666666;
box-shadow: 0px 0px 20px #666666;
}

.packetboxentitel {
text-align:left;
position: relative;
font-family: Arial;
font-weight:normal;
color: #242120;
font-size: 19px;
top: -43px;
left: 70px;
width: 230px;
}

.PacketboxIconClose {
position: relative;
width: 42px;
left: 1px; 
}

/* MBE1 */
#enterpin{
        background: #000000;
}

.pindigits{
        background: #000000;
}
/* MBE2 */

@media only screen and (min-device-width : 1300px)
{

#mitte{
position: absolute;
float: right;
background:#ccc7c5;
box-shadow: 3px 3px 30px #a49c99, 3px 3px 30px #000000;
background-repeat: repeat-x;
width: 1000px;
height: 590px;
left: 50%;
top: 110px;
margin-left: -500px;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}


.logo3 {
    position: fixed;
    top: 600px;
    left: 50%;
     margin-left: 394px;
    width: 100px;
    height: auto;
    
}

  .add {
  position: fixed;
  top: 720;
  left: 50%;
  margin-left: 100px;
  width: 171px;
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
      border-radius: 10px 10px 10px 10px;
  -webkit-box-shadow: 0px 0px 20px #666666;
  -moz-box-shadow: 0px 0px 20px #666666;
  box-shadow: 0px 0px 20px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  border: solid #000000 2px;
  text-decoration: none;
  background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
}

.add:hover {
  background: #3bf508;
  text-decoration: none;
}

  .send {
  position: fixed;
  top: 720;
  left: 50%;
  margin-left: 300px;
  width: 171px;
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
      border-radius: 10px 10px 10px 10px;
  -webkit-box-shadow: 0px 0px 20px #666666;
  -moz-box-shadow: 0px 0px 20px #666666;
  box-shadow: 0px 0px 20px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  border: solid #000000 2px;
  text-decoration: none;
  background:#656e70;
  background:-webkit-gradient(linear, left top, left bottom, from(#656e70), color-stop(50%, #515b5c), color-stop(5.1%, #465153), to(#323e40));
  background:-moz-linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
  background:linear-gradient(top, #656e70, #515b5c 50%, #465153 50.1%, #323e40);
}



}