style.css

body {
    background-color: rgb(56, 58, 89);
    font-family: 'Fredoka One', cursive !important;
}
h2 {
    text-align: center;
    color: #2572FF;
    font-family: 'Permanent Marker', cursive !important;
    font-size: 28px;
}
#MyButton {
    border-radius: 5px;
    width: 175px;
    height: 40px;
    font-size: 20px;
    color: white;
    border: none;
    font-family: 'Fredoka One', cursive !important;
    background-color: #2572FF;
    transition: background-color 1s;
    position: absolute;
    top: 50px; 
    left: 510px;
}
#MyButton:hover {
    background-color: #D64DBF;
}
#MyButton_upload {
    border-radius: 5px;
    width: 175px;
    height: 40px;
    font-size: 18px;
    color: white;
    border: none;
    font-family: 'Fredoka One', cursive !important;
    background-color: #2572FF;
    transition: background-color 1s;
    position: absolute;
    top: 100px; 
    left: 510px;
}
#MyButton_upload:hover {
    background-color: #D64DBF;
}
input {
    color: white;
    background-color: rgb(56, 58, 89);
    font-family: 'Fredoka One', cursive !important;
    font-size: 15px;
    border: 2px solid;
    border-color: #D64DBF;
    text-align: center;
    position: relative; 
    left: 45px;
    width: 400px;
    height: 45px;
    border-radius: 5px;
    transition: border-color 1s;
    letter-spacing: 2px; 
    
}
input:hover {
    border-color: #2572FF!important;
}
input:focus {
    outline: none;
}
input::placeholder {
    font-size: 16px;
}
h4 {
    position: absolute; 
    left: 600px;
    bottom: -12px;
    font-size: 14px;
    color: #DC143C;
}
h3 {
    text-align: center;
    color: white;
    letter-spacing: 1px;
    position: relative;
    top: 10%;
}