@import url("https://fonts.googleapis.com/css?family=Share+Tech+Mono|Montserrat:700");
    
  body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    font-family: "Share Tech Mono", monospace;
  }

  div {
    box-sizing: border-box;
  }

  .box {
    width: 100%;
    height: 100%;
    opacity: 0.8;
    padding: 5.3333vw 2.6667vw;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: rgba(255,255,255,0.2)!important;
  }

  .text {
    width: 100%;
    opacity: 0.95;
    background-color: #e7f0ff;
    border-radius: 5px;
    padding: 20px;
    position: relative;
    
  }

  .input-item {
    width: 93%;
    color: #757575;
    margin-bottom: 20px;
    border: 0;
    padding: 10px;
    border-radius: 5px;
    outline: none;
    box-shadow: 2px 2px 5px 2px #757575;
  }


  #appid {
    width: 98%;
    height: 37px;
    border: 0;
    border-radius: 5px;
    color: #757575;
    padding: 0 7px;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAANdJREFUWEftlM0NwyAMRmGDmInaydpO1kyE2YAKFKQUBfzTAz2YSxQJ854+G7xbvPxivjMBS8ASsAT+O4EQwrO8lDHG+pUuTv0wgVKcc34c0B0R7xIBAHg7525U/VAAAHIHZEt08HoMIl6yuAk0F1LiCu69f43aOB3Crg2khBReDiRvAVdCA2cJlE2UhBbOFphJHH1p015/Zz3vbxLZgnPBIImvMyVwUQKNMpOQwlUCo3Zo4GqBXkIL/0mgFG/bVocvpbRLnunzXtEQaiGzOhOwBCyB5Ql8AAPmfyGAKB5WAAAAAElFTkSuQmCC);
    background-repeat: no-repeat;
    background-position: right 17px center;
    background-size: 15px;
  }