Given the following HTML-Code:

```
<form id="contact-form">
    <label for="form-company">Company</label>
    <input id="form-company" name="form-company" type="text">

    <label for="form-name">Name</label>
    <input id="form-name" name="form-name" type="text" required>

    <label for="form-email">Email</label>
    <input id="form-email" name="form-email" type="email" required>

    <label for="form-tel">Phone</label>
    <input id="form-tel" name="form-tel" type="tel" required>

    <label for="form-message">Message</label>
    <textarea id="form-message" name="form-message" required>
    </textarea>            

    <input type="submit" value="Submit">
</form>

```

I want to style this form with the result that it looks like the following image illustrates:
![enter image description here](https://i.stack.imgur.com/d62g4.png)

What's the best and most compatible way to do that?