body {
    background-color: rgb(238, 238, 134);
    display: flex;
    justify-content: center;
    
}
hr{
    color:  black;
    width: 100%;
}

form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1rem;
    width: fit-content;

    fieldset {
        display: flex;
        flex-direction: column;
        border-radius: 10px;
        background-color: white;
        padding: 1rem;
        border: 1px solid black;

        input[type="text"],
        input[type="date"],
        input[type="number"] {
            width: 350px;
            margin-top: 1.2rem;
        }

        input[type="text"]:focus,
        input[type="date"]:focus,
        input9[type="number"]:focus {
            background-color: rgb(238, 238, 134);
            outline: none;
            border: 1px solid black;
        }
    }

    fieldset:first-of-type {
        display: flex;
        flex-direction: column;
        h1,p{
            display: inline;
        }
    }
    .section-2 {
        display: flex;
        flex-direction: column;
        gap: 1rem;

        fieldset {
            display: flex;
            flex-direction: column;
            border-radius: 10px;
            background-color: white;
            padding: 1rem;

            input[type="text"],
            input[type="date"] {
                width: 350px;
                margin-top: 1.5rem;
            }
        }
    }

    button{
        width: 10rem;
        padding: 0.7rem;
        background-color: black;
        color: white
    }
    button:hover {
        background-color: white;
        color: black;
    }
}

@media screen and (max-width:450px) {

    form {
        width: 100vw;
        fieldset{
            input[type="text"],
        input[type="date"] {
            width: auto;
            margin-top: 1.2rem;
        }
        }
    }
}