*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
  font-family: 'Roboto Condensed', sans-serif;
  background-position: center ;
  background-size: auto;
  text-align: center;

}
.header{
  height: 100vh;
  background-image:linear-gradient(to right bottom, rgba(126, 213, 111, 0.16),rgba(40, 180, 133, 0.16)) ,url(../img/med-bg.jpg);
  background-position: bottom ;
}
.login-form{
  display: inline-block;
  background-image: linear-gradient(to bottom right,rgba(0, 187, 240, 0.85),rgba(144, 242, 255, 0.85));
  padding: 30px 30px 15px;
  margin-top: 140px;
  border-radius: 50px;
  box-shadow: 0 20px 10px rgba(0, 0, 0, 0.2);
}
input{height: 30px;}
label{font-size: 20px;}
h1{line-height: 1.7;
color: #fff;
}

.bio{letter-spacing: 3px;
box-shadow: 5px 10px 15px rgba(0, 0, 0, 0.2);}

.med{font-size: 25px;
box-shadow: 5px 10px 15px rgba(0, 0, 0, 0.2);}

.username{padding: 15px 0;}

.submit1{
  display: inline-block;
  padding:15px 25px;
  margin: 30px;
  text-decoration: none;
  background-image: linear-gradient(to right, #a7ff83,#17b978);
  border-radius: 50px;
  transition: 1s;
  backface-visibility: hidden;
}
.submit1:hover{
  background-color: #005792;
  color:#fff;
  transform: translateY(-5px);
  box-shadow: 0 10px 14px rgba(0, 0, 0, 0.2);
  transition: 0.4s;
}
.submit1:active{
  transform: translateY(-3px);
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.2);
  background-color:  #005792;
  transition: 0.3s;
}