<style>
    /* Basic styling for the form */
    .contact-form {
        width: 300px; /* Set form width */
        margin: 0 auto; /* Center the form */
        background-color: #f9f9f9; /* Light background color */
        padding: 20px; /* Padding for inner space */
        border-radius: 5px; /* Rounded corners */
        box-shadow: 0 2px 10px rgba(0,0,0,0.1); /* Subtle shadow */
    }
 
    /* Styling labels */
    .contact-form label {
        display: block; /* Make labels block elements */
        margin-bottom: 5px; /* Margin below labels */
        font-weight: bold; /* Bold font-weight */
    }
 
    /* Styling input fields and textarea */
    .contact-form input[type="text"],
    .contact-form input[type="email"],
    .contact-form textarea {
        width: 100%; /* Full-width input */
        padding: 10px; /* Inner padding */
        margin-bottom: 15px; /* Space below elements */
        border: 1px solid #ccc; /* Border style */
        border-radius: 4px; /* Slightly rounded corners */
        box-sizing: border-box; /* Include padding in width */
    }
 
    /* Change border color on focus */
    .contact-form input:focus,
    .contact-form textarea:focus {
        border-color: #007BFF; /* Change border color on focus */
        outline: none; /* Remove outline */
    }
 
    /* Styling the submit button */
    .contact-form button {
        background-color: #28a745; /* Green background */
        color: white; /* White text */
        padding: 10px 15px; /* Padding */
        border: none; /* No border */
        border-radius: 5px; /* Rounded corners */
        cursor: pointer; /* Pointer cursor */
        font-size: 16px; /* Font size */
    }
 
    /* Button hover effect */
    .contact-form button:hover {
        background-color: #218838; /* Darker green on hover */
    }
</style>