
<div>
    <div class="mx-auto border border-secondary shadow p-3 text-light rounded "
        style="width: 720px;">

        <form class="form-signin text-center">
            <h2 class="text-light">Creación de Tipo de Suelo</h2>

            <div class="d-flex justify-content-around">

                <div class="form-label-group m-4">
                    <label class="my-3" for="inputPh">pH del Suelo</label>
                    <input style="background-color: rgb(45, 45, 45);"
                        type="text"
                        id="inputPh" class="form-control text-light"
                        placeholder="pH" required>
                </div>

                <div class="form-label-group m-4">
                    <label class="my-3" for="inputPhosphorus">Fósforo del
                        Suelo</label>
                    <input style="background-color: rgb(45, 45, 45);"
                        type="text"
                        id="inputPhosphorus" class="form-control text-light"
                        placeholder="Fósforo" required>
                </div>
            </div>

            <div class="d-flex justify-content-around">
                <div class="form-label-group m-3">
                    <label class="my-3" for="inputNitrogen">Nitrógeno del
                        Suelo</label>
                    <input style="background-color: rgb(45, 45, 45);"
                        type="text"
                        id="inputNitrogen" class="form-control text-light"
                        placeholder="Nitrógeno" required>
                </div>

                <div class="form-label-group m-3">
                    <label class="my-3" for="inputOrganicMatter">Materia
                        Orgánica
                        del
                        Suelo</label>
                    <input style="background-color: rgb(45, 45, 45);"
                        type="text"
                        id="inputOrganicMatter" class="form-control text-light"
                        placeholder="Materia Orgánica" required>
                </div>
            </div>

            <div class="d-flex justify-content-around">
                <div class="form-label-group m-3">
                    <label class="my-3" for="inputPotassium">Potasio del
                        Suelo</label>
                    <input style="background-color: rgb(45, 45, 45);"
                        type="text"
                        id="inputPotassium" class="form-control text-light"
                        placeholder="Potasio" required>
                </div>
            </div>

            <div class="form-label-group text-center m-3">
                <button class="btn btn-lg btn-block text-light"
                    style="background-color: rgb(76,175,80);"
                    type="submit">Registrar Tipo de Suelo</button>
            </div>
        </form>
    </div>
</div>