style.css

@charset "utf-8";
body{
    background: linear-gradient(to left, #0fb0f3 0%, #442ac0 100%);
    text-align: center;
    direction: rtl;
}
#main{
    width: 60%;
    height: auto;
    margin: 40px auto;
    background-color: #fff;
    padding: 25px;
    border:none;
    border-radius: 30px;
}
h1{
    color: #2a6dc0;
    text-align: center;
    font-size: 45px;
}
input , textarea{
    display: block;
    margin: 10px auto;
}

input[type="text"] {
    width: 200px;
    height: 30px;
    border: none;
}

input[type="email"]{
    width: 200px;
    height: 30px;
    border: none;
}
input[type="text"]:focus{
    border: 2px solid #10b9ff;
    border-radius: 5px;
}
input[type="email"]:focus{
    border: 2px solid #10b9ff;
    border-radius: 5px;
}
input[type="submit"]{
    display: inline;
    width: 230px;
    padding: 15px 0;
    border: none;
    color: #fff;
    font-weight:bold;
    border-radius: 8px;
    background-color: #00c701;
    margin: 22px 5px;
}
input[type="submit"]:hover{
    opacity: .8;
}
textarea{
    border: none;
}
textarea:focus{
    border: 2px solid #10b9ff;
    border-radius: 5px;
}

input[type="reset"]{
    display: inline;
    width: 230px;
    padding: 15px 0;
    border: none;
    color: #fff;
    font-weight:bold;
    border-radius: 8px;
    background-color: #0fb0f3;
    margin: 22px 5px;
}
input[type="reset"]:hover{
    opacity: .8;
}