.login-box {
  width: 30vw;
  margin: 0 auto;
  text-align: center;
  background: linear-gradient(to bottom, #31313163, rgba(160, 160, 161, 0.493) ,#ffffff);;
  padding: 10vw;
  padding-top: 3vw;
  border-radius: 5vw;
  box-shadow: 0vw 0vw 5vw #aaa;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.login-box h2 {
  margin-bottom: 3vw;
  font-size: 5vw;
  font-family:fantasy;
  color: whitesmoke;
  text-shadow: 0.5vw 1vw 1vw black;
}

.login-box form {
  display: inline-block;
  text-align: left;
}

.login-box input[type="text"], .login-box input[type="password"] {
  width: 100%;
  padding: 1vw;
  margin-bottom: 2vw;
  border: none;
  border-bottom: 0.1vw solid #ccc;
  outline: none;
}

.login-box input[type="button"] {
  background: linear-gradient(to bottom, #00720963, rgba(1, 204, 52, 0.493) ,#055802ea);;;
  box-shadow: 0vw 0.3vw rgba(0, 0, 0, 0.637);
  font-size: 4vw;
  font-family: fantasy;
  letter-spacing: 0.3vw;
  color: white;
  padding: 1vw 2vw;
  border: none;
  border-radius: 1vw;
  cursor: pointer;
  margin-left: 28%;
}

.login-box input[type="button"]:hover {
  background-color: #3e8e41;
}