diff --git a/src/css/style.css b/src/css/style.css
index f0963ad476250d684a0beb4b1bcd5862793ecfbe..3bbb4e9f92bdd02bbdedc0dd804986a10f3edd76 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -202,6 +202,72 @@ h4 {
     }
 }
 
+.contact-section .contact-container {
+    display: flex;
+    flex-direction: column;
+    margin: 5rem auto;
+    text-align: center;
+}
+
+.contact-section .contact-form {
+    margin-top: 2rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+}
+
+.contact-section .contact-form-input {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: start;
+    justify-content: center;
+    width: 100%;
+}
+
+.contact-section .contact-fields {
+    margin-right: 1rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
+.contact-section .contact-field {
+    margin: 0.5rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
+.contact-section .contact-message {
+    margin: 0.5rem;
+}
+
+.contact-section .contact-message textarea {
+    width: 100%;
+    box-sizing: border-box;
+}
+
+.contact-section .submit-button {
+    appearance: none;
+    border: none;
+    margin: 0.5rem;
+}
+
+@media screen and (max-width: 600px) {
+    .contact-section .contact-form-input {
+        flex-direction: column;
+        align-items: center;
+    }
+    .contact-section .contact-fields {
+        flex-direction: row;
+        flex-wrap: wrap;
+    }
+}
+
 footer .footer-container {
     display: flex;
     flex-direction: row;
@@ -235,8 +301,6 @@ footer .footer-nav {
     justify-content: center;
 }
 
-
-
 a {
     text-decoration: none;
     transition: box-shadow 300ms ease;
@@ -256,6 +320,7 @@ a {
 
 .button:hover {
     box-shadow: 0px 5px 40px -5px rgba(var(--primary), 0.35);
+    cursor: pointer;
 }
 
 * {
diff --git a/src/index.html b/src/index.html
index c66bc39c11ec518d3a7c785d0ceb72f015c7b33a..5def90975e888c70504d922ececc06a4970faa8f 100644
--- a/src/index.html
+++ b/src/index.html
@@ -131,48 +131,41 @@
                     </div>
                 </div>
             </section>
-            <section class="contact-form" id="contact">
-                <h2>Get in touch</h2>
-                <p>
-                    Do you still have a question? Just contact us directly and we will be glad
-                    to help you resolve the issue.
-                </p>
-                <form action="mailto:dplanoetscher@unibz.it" method="POST">
-                    <table>
-                        <tr>
-                            <td>
-
-                                <label for="firstname">Firstname</label> <br>
-                                <input type="text" required name="firstname" id="firstname">
-                            </td>
-                            <td>
-                                <label for="lastname">Lastname</label> <br>
-                                <input type="text" required name="lastname" id="lastname">
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <label for="email">Email</label> <br>
-                                <input type="email" required name="email" id="email">
-                            </td>
-                            <td>
-                                <label for="subject">Subject</label> <br>
-                                <input type="text" required name="subject" id="subject">
-                            </td>
-                        </tr>
-                        <tr>
-                            <td colspan="2">
-                                <label for="message">Message</label> <br>
-                                <textarea name="message" required id="message" cols="48" rows="10"></textarea>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <input type="submit" value="Send">
-                            </td>
-                        </tr>
-                    </table>
-                </form>
+            <section class="contact-section" id="contact">
+                <div class="content-container contact-container">
+                    <h2>Get in touch</h2>
+                    <p>
+                        Do you still have a question? Just contact us directly and we will be glad
+                        to help you resolve the issue.
+                    </p>
+                    <form class="contact-form" action="mailto:dplanoetscher@unibz.it" method="GET">
+                        <div class="contact-form-input">
+                            <div class="contact-fields">
+                                <div class="contact-field">
+                                    <label for="firstname">Firstname</label>
+                                    <input type="text" required name="firstname" id="firstname">
+                                </div>
+                                <div class="contact-field">
+                                    <label for="lastname">Lastname</label>
+                                    <input type="text" required name="lastname" id="lastname">
+                                </div>
+                                <div class="contact-field">
+                                    <label for="email">Email</label>
+                                    <input type="email" required name="email" id="email">
+                                </div>
+                                <div class="contact-field">
+                                    <label for="subject">Subject</label>
+                                    <input type="text" required name="subject" id="subject">
+                                </div>
+                            </div>
+                            <div class="contact-message">
+                                <label for="message">Message</label>
+                                <textarea name="message" required id="message" cols="48" rows="13"></textarea>
+                            </div>
+                        </div>
+                        <input class="button submit-button" type="submit" value="Send">
+                    </form>
+                </div>
             </section>
         </main>
         <footer>