*{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
html, body {
    height: 100vh;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
body{
    background-image: linear-gradient(to top, #fff1eb 0%, #ace0f9 100%); 
    background-repeat: no-repeat;
    background-size: cover;  
}
.form-box{
    padding:50px 70px;
    width: 600px;
    border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
    background-image: linear-gradient(to top, #ace0f9 0%, #f3edeb 100%);
}
.form-control,.form-select{
    border-radius: 12px;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    background-color: white;
    font-size: 14px;
}
.form-control:focus,.form-select:focus{
    /* From https://css.glass */
    border-radius: 16px;
    box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    outline: none;
}
#submitbtn{
    background-color: #b3e1f8;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
    border: 1px solid #b3e1f8;
    font-weight: 500;
    transition: all linear 0.3s;
    border-radius: 12px;
}
#submitbtn:hover{
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
    border: 1px solid #f6efed;
    color: black;
    background-color: #f6efed;
}