:root{
  --primary-font: 'Google Sans', sans-serif;
  --blue: #5C87FE;
}

html, body{
  font-family: var(--primary-font);

}

body{
  height:100vh;
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  overflow: hidden;
}

.container{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction: column;
}

input{
  font-family: var(--primary-font);
}

h2{
  font-size:40px;
  color:var(--blue);
  font-weight:500;
}

.form-group{
  display:flex;
  flex-direction: column;
  margin-bottom:30px;
}

.form-group label{
  font-weight:500;
  color:var(--blue);
  font-size:20px;
  margin-bottom:5px;
}

.form-group input{
  padding:10px 20px;
  border:1px solid #d2d2d2;
  box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
  border-radius: 5px;
  font-size:18px;
}

.form-group small{
  margin-top:5px;
}

.btn{
  background:var(--blue);
  color:#fff;
  font-family:var(--primary-font);
  padding:10px 20px;
  font-size:20px;
  border-radius: 5px;
  border:none;
  cursor: pointer;
  transition: 0.2s ease-in-out;
  box-shadow: 0px 3px 6px rgba(0,0,0,0.16);

}

.btn:hover{
  background:#3a6efe;
}