﻿.form-horizontal {
    background-color: rgba(255, 255, 255, 0.8); /* Adds a white background with opacity for readability */
    padding: 20px;
    border-radius: 8px;
    max-width: 500px;
    margin: 50px auto;
}
@media (max-width: 768px) {
    .form-horizontal {
        max-width: 100%; /* Make the form take up more width on small screens */
        padding: 25px; /* Adjust padding to fit better on smaller devices */
        margin: 330px 27px auto;
    }

    .control-label {
        text-align: left; /* Align labels to the left for smaller screens */
    }

    .col-md-2, .col-md-10 {
        width: 100%; /* Make each form input span the entire width of the screen */
    }

    .btn-group-justified {
        width: 100%; /* Ensure buttons stretch across the screen on small devices */
    }

    .btn-secondary, .btn-primary {
        width: 100%; /* Ensure that buttons fill the screen on mobile */
        margin-bottom: 10px; /* Add some spacing between buttons */
        display: inline;
        font-size: 11px;
    }

    h2 {
        font-size: 2.5em;
        font-weight: bold;
    }
}
    body {
        background-size: auto; /* Adjust background to fit smaller screens better */
    }
}
