body{
  background-color:black;    
  font-family:Gill Sans Extrabold, sans-serif;
  background-repeat: no-repeat;
  background-position:center;
  background-size:contain;
  font-size:2vw;
} 

div{
  margin:1vw 5vw 1vw 5vw;
  padding:1vw 3vw 1vw 3vw;
  border-radius: 2vw;
  position:fixed;
  left: 0px;
  right: 0px;
}



.text{
  background:rgba(200, 200, 200, 0.6);
  top:0px;
}

.dialog{
  background:rgba(200, 200, 200, 0);
  text-align:center;
  bottom:0px;
}


.okdialog{
  background:rgba(76, 175, 80, 0.6);
  text-align:center;
  bottom:0px;
}

.nodialog{
  background:rgba(175, 76, 80, 0.8);
  text-align:center;
  bottom:0px;
}
a{
text-decoration:none;
color:blue;
}

input{
  margin:1vw;
  padding:1vw;
  font-size:2vw;
  height:5vw;
  border-radius: 1vw;    
}
input.txt{
  width:auto;
}

input.square{
  width:auto;
}

.login{
  position:absolute;
  padding:1vw;
  right:0px;
  bottom:0px;
  text-align:right;
}



@media only screen and (max-width: 1024px){
  /* For mobile phones: */
  body{
    font-size:5vw;
    background-size:cover;
  }


  .dialog{
  bottom:2vw;  
  }
  .okdialog{
  bottom:2vw;  
  }
  .nodialog{
  bottom:2vw;  
  }
  
  input{
    margin:1vw;
    font-size:5vw;
    width:90%;
    height:10vw;
    border-radius: 2vw;    
  }
  
  input.txt{
    width:60vw;    
  }
  
  input.square{
    width:20vw;
  }
  
} //end mobile
