/* Container for the form with shadow */ .form-container { box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; padding: 20px; border-radius: 8px; background-color: #fff; max-width: 600px; margin: 0 auto; /* Center the form horizontally */ } /* General form row styling */ .form-row { display: flex; flex-wrap: wrap; margin-bottom: 15px; } /* Styling for form group to create two columns */ .form-group { flex: 1; padding: 0 10px; } /* Ensure equal width for half-width elements */ .half-width { flex: 0 0 50%; max-width: 50%; } /* Full width form group */ .full-width { flex: 0 0 100%; max-width: 100%; } /* Adjust text areas and input fields */ textarea, input[type="text"], input[type="email"], input[type="tel"], input[type="date"] { width: 100%; padding: 10px; box-sizing: border-box; } /* Customized submit button */ input[type="submit"] { padding: 15px 40px; background-color: #0051a1; color: #fff; border: none; cursor: pointer; display: block; margin: 0 auto; /* Center the button */ border-radius: 15px; } input[type="submit"]:hover { background-color: #003d7e; } /* Heading style */ .form-heading { text-align: center; font-size: 27px; margin-bottom: 20px; color: #333; font-weight: bold; } /* Mobile responsiveness: Make form single-column on screens <= 768px */ @media (max-width: 768px) { .half-width { flex: 0 0 100%; max-width: 100%; } }