style.css

body{
    width:100%;
    overflow:hidden;
    height:100vh;
}
.for{
    height:60vh;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    padding:40px;
    padding-bottom:auto;
    border:1px solid #00000030;
    transition: 0.5s;
}
.for:hover{
    box-shadow:4px 4px 5px #11111130,0px 0px 4px #11111130;
}
.hi{
    margin:30px;
    font-size:125%;
}
button{
    display:block;
    margin:auto;
    margin-top:40px;
    padding:5px;
    font-size:90%;
    border-radius:5px;
    background:#bedefd;
    transition:0.5s;
    outline:none;
}

input{
    height:25px;
    padding-left:4px;
    border:1px solid black;
}

button:hover{
    background:#5f791497;
    color:white;
    box-shadow:3px 3px 5px #11111130,0px 0px 2px #11111130;
}
button:active{
    transform:translate(0,8px);
}