body > .container {
    min-height: 60%;
    margin-bottom: 20px;
    padding-left: 400px;
    padding-right: 400px;
}

/* Media Query for small devices (e.g., phones) */
@media screen and (max-width: 767px) {
    body > .container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* Media Query for medium devices (e.g., tablets) */
@media screen and (min-width: 768px) and (max-width: 991px) {
    body > .container {
        padding-left: 50px;
        padding-right: 50px;
    }
}

/* Media Query for large devices (e.g., laptops and desktops) */
@media screen and (min-width: 992px) and (max-width: 1199px) {
    body > .container {
        padding-left: 100px;
        padding-right: 100px;
    }
}

/* Media Query for extra-large devices (e.g., large desktops) */
@media screen and (min-width: 1200px) {
    body > .container {
        padding-left: 200px;
        padding-right: 200px;
    }
}
