.box {
    width: 390px;
    padding: 60px;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%,0%);
    background: #053bc5;
    text-align: center;
    border-radius: 100px;
}
    .box h1 {
        color: white;
        text-transform: uppercase;
        font-weight: 500;
    }
        .box input[type = "text"], .box input[type = "password"] {
        border: 0;
        background: none;
        display: block;
        margin: 20px auto;
        text-decoration-color: white;
        text-align: center;
        border: 2px solid #2c3e50;
        padding: 14px 10px;
        width: 255px;
        outline: none;
        color: white;
        border-radius: 24px;
        transition: 0.25s;
    }

            .box input[type = "text"]:hover, .box input[type = "password"]:hover {
                width: 255px;
                border-color: white;
            }

            .box input[type = "text"]:focus, .box input[type = "password"]:focus {
                width: 255px;
                border-color: white;
            }

    .box input[type = "submit"] {
        border: 0;
        background: none;
        display: block;
        margin: 20px auto;
        text-align: center;
        border: 2px solid #BE0033;
        padding: 14px 10px;
        width: 55px;
        outline: none;
        color: white;
        border-radius: 24px;
        transition: 0.25s;
        cursor: pointer;
    }

        .box input[type = "submit"]:hover {
            background: #BE0033;
            width: 180px;
        }