Improve contact page responsivness

src/app/core/components/contact/contact.component.html

 <h1 class="has-text-centered" i18n="@@contact.contactUs">Contact us</h1>
 
-<div class="section">
+<div class="contact-form-container">
   <h2 i18n="@@contact.contactForm">Form contact</h2>
 
-  <form [formGroup]="form" class="columns is-multiline" (ngSubmit)="send()">
-    <div class="column is-2-touch is-3">
-      <h3 i18n="@@contact.identity">Identity</h3>
-    </div>
-
-    <div class="column is-10-touch is-9">
-      <div class="fields-container">
-
-        <div class="field">
-          <label class="label" for="lastname" i18n="@@contact.lastname">Lastname</label>
-          <p class="control has-icons-right">
-            <input id="lastname" class="input" type="text" formControlName="lastname" [ngClass]="{'is-danger': fieldIsInvalid('lastname'), 'is-success': fieldIsValid('lastname')}">
-            <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('lastname')">
-              <i class="fas fa-check-circle"></i>
-            </span>
-            <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('lastname')">
-              <i class="fas fa-exclamation-circle"></i>
-            </span>
-          </p>
+  <form [formGroup]="form" (ngSubmit)="send()">
+    <div class="columns is-multiline">
+      <div class="column is-12-mobile is-2-tablet is-3-desktop">
+        <h3 i18n="@@contact.identity">Identity</h3>
+      </div>
 
-          <div class="incorrect-field-message" *ngIf="fieldIsInvalid('lastname')">
-            <div *ngIf="form.controls['lastname'].errors.required" i18n="@@contact.errors.missingLastname">
-              You must indicate a lastname.
+      <div class="column is-12-mobile is-10-tablet is-9-desktop">
+        <div class="fields-container">
+
+          <div class="field">
+            <label class="label" for="lastname" i18n="@@contact.lastname">Lastname</label>
+            <p class="control has-icons-right">
+              <input id="lastname" class="input" type="text" formControlName="lastname" [ngClass]="{'is-danger': fieldIsInvalid('lastname'), 'is-success': fieldIsValid('lastname')}">
+              <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('lastname')">
+                <i class="fas fa-check-circle"></i>
+              </span>
+              <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('lastname')">
+                <i class="fas fa-exclamation-circle"></i>
+              </span>
+            </p>
+
+            <div class="incorrect-field-message" *ngIf="fieldIsInvalid('lastname')">
+              <div *ngIf="form.controls['lastname'].errors.required" i18n="@@contact.errors.missingLastname">
+                You must indicate a lastname.
+              </div>
             </div>
           </div>
-        </div>
 
-        <div class="field">
-          <label class="label" for="firstname" i18n="@@contact.firstname">Firstname</label>
-          <p class="control has-icons-right">
-            <input id="firstname" class="input" type="text" formControlName="firstname" [ngClass]="{'is-danger': fieldIsInvalid('firstname'), 'is-success': fieldIsValid('firstname')}">
-            <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('firstname')">
-              <i class="fas fa-check-circle"></i>
-            </span>
-            <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('firstname')">
-              <i class="fas fa-exclamation-circle"></i>
-            </span>
-          </p>
-
-          <div class="incorrect-field-message" *ngIf="fieldIsInvalid('firstname')">
-            <div *ngIf="form.controls['firstname'].errors.required" i18n="@@contact.errors.missingFirstname">
-              You must indicate a firstname.
+          <div class="field">
+            <label class="label" for="firstname" i18n="@@contact.firstname">Firstname</label>
+            <p class="control has-icons-right">
+              <input id="firstname" class="input" type="text" formControlName="firstname" [ngClass]="{'is-danger': fieldIsInvalid('firstname'), 'is-success': fieldIsValid('firstname')}">
+              <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('firstname')">
+                <i class="fas fa-check-circle"></i>
+              </span>
+              <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('firstname')">
+                <i class="fas fa-exclamation-circle"></i>
+              </span>
+            </p>
+
+            <div class="incorrect-field-message" *ngIf="fieldIsInvalid('firstname')">
+              <div *ngIf="form.controls['firstname'].errors.required" i18n="@@contact.errors.missingFirstname">
+                You must indicate a firstname.
+              </div>
             </div>
           </div>
-        </div>
-
-        <div class="field">
-          <label class="label" for="email" i18n="@@contact.email">Email</label>
-          <p class="control has-icons-right">
-            <input id="email" class="input" type="email" formControlName="email" [ngClass]="{'is-danger': fieldIsInvalid('email'), 'is-success': fieldIsValid('email')}">
-            <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('email')">
-              <i class="fas fa-check-circle"></i>
-            </span>
-            <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('email')">
-              <i class="fas fa-exclamation-circle"></i>
-            </span>
-          </p>
 
-          <div class="incorrect-field-message" *ngIf="fieldIsInvalid('email')">
-            <div *ngIf="form.controls['email'].errors.required" i18n="@@contact.errors.missingEmail">
-              You must enter an email address.
-            </div>
-
-            <div *ngIf="form.controls['email'].errors.email" i18n="@@contact.errors.invalidEmail">
-              You must enter a valid email address.
+          <div class="field">
+            <label class="label" for="email" i18n="@@contact.email">Email</label>
+            <p class="control has-icons-right">
+              <input id="email" class="input" type="email" formControlName="email" [ngClass]="{'is-danger': fieldIsInvalid('email'), 'is-success': fieldIsValid('email')}">
+              <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('email')">
+                <i class="fas fa-check-circle"></i>
+              </span>
+              <span class="icon is-small is-right has-text-danger" *ngIf="fieldIsInvalid('email')">
+                <i class="fas fa-exclamation-circle"></i>
+              </span>
+            </p>
+
+            <div class="incorrect-field-message" *ngIf="fieldIsInvalid('email')">
+              <div *ngIf="form.controls['email'].errors.required" i18n="@@contact.errors.missingEmail">
+                You must enter an email address.
+              </div>
+
+              <div *ngIf="form.controls['email'].errors.email" i18n="@@contact.errors.invalidEmail">
+                You must enter a valid email address.
+              </div>
             </div>
           </div>
-        </div>
 
-        <div class="field">
-          <label class="label" for="emailConfirmation" i18n="@@contact.emailConfirmation">Confirm your email address</label>
-          <p class="control has-icons-right">
-            <input id="emailConfirmation" class="input" type="email" formControlName="emailConfirmation" [ngClass]="{'is-danger': emailConfirmationError || fieldIsInvalid('emailConfirmation'), 'is-success': !emailConfirmationError && fieldIsValid('emailConfirmation')}">
-            <span class="icon is-small is-right has-text-success" *ngIf="!emailConfirmationError && fieldIsValid('emailConfirmation')">
-              <i class="fas fa-check-circle"></i>
-            </span>
-            <span class="icon is-small is-right has-text-danger" *ngIf="emailConfirmationError || fieldIsInvalid('emailConfirmation')">
-              <i class="fas fa-exclamation-circle"></i>
-            </span>
-          </p>
-
-          <div class="incorrect-field-message" *ngIf="fieldIsInvalid('emailConfirmation')">
-            <div *ngIf="form.controls['emailConfirmation'].errors.required" i18n="@@contact.errors.missingConfirmationEmail">
-              You must confirm your email address.
-            </div>
-
-            <div *ngIf="form.controls['emailConfirmation'].errors.email" i18n="@@contact.errors.invalidEmail">
-              You must enter a valid email address.
+          <div class="field">
+            <label class="label" for="emailConfirmation" i18n="@@contact.emailConfirmation">Confirm your email
+              address</label>
+            <p class="control has-icons-right">
+              <input id="emailConfirmation" class="input" type="email" formControlName="emailConfirmation" [ngClass]="{'is-danger': emailConfirmationError || fieldIsInvalid('emailConfirmation'), 'is-success': !emailConfirmationError && fieldIsValid('emailConfirmation')}">
+              <span class="icon is-small is-right has-text-success" *ngIf="!emailConfirmationError && fieldIsValid('emailConfirmation')">
+                <i class="fas fa-check-circle"></i>
+              </span>
+              <span class="icon is-small is-right has-text-danger" *ngIf="emailConfirmationError || fieldIsInvalid('emailConfirmation')">
+                <i class="fas fa-exclamation-circle"></i>
+              </span>
+            </p>
+
+            <div class="incorrect-field-message" *ngIf="fieldIsInvalid('emailConfirmation')">
+              <div *ngIf="form.controls['emailConfirmation'].errors.required" i18n="@@contact.errors.missingConfirmationEmail">
+                You must confirm your email address.
+              </div>
+
+              <div *ngIf="form.controls['emailConfirmation'].errors.email" i18n="@@contact.errors.invalidEmail">
+                You must enter a valid email address.
+              </div>
             </div>
-          </div>
-          <div class="incorrect-field-message" *ngIf="emailConfirmationError">
-            <div *ngIf="emailConfirmationError" i18n="@@contact.errors.confirmationEmailNotCorresponding">
-              You must enter the same email address.
+            <div class="incorrect-field-message" *ngIf="emailConfirmationError">
+              <div *ngIf="emailConfirmationError" i18n="@@contact.errors.confirmationEmailNotCorresponding">
+                You must enter the same email address.
+              </div>
             </div>
           </div>
-        </div>
 
+        </div>
       </div>
-    </div>
 
-    <div class="column is-2-touch is-3">
-      <h3 i18n="@@contact.message">Message</h3>
-    </div>
+      <div class="column is-12-mobile is-2-tablet is-3-desktop">
+        <h3 i18n="@@contact.message">Message</h3>
+      </div>
 
-    <div class="column is-10-touch is-9">
+      <div class="column is-12-mobile is-10-tablet is-9-desktop">
         <div class="field">
           <label class="label" [for]="subjectLabelFor" i18n="@@contact.subject">Sujet</label>
           <div class="dropdown" [ngClass]="{'is-active': subjectDropdownState}" (clickOutside)="closeSubjectDropdown()">
@@ -148,7 +150,7 @@
           <label class="label" for="text" i18n="@@contact.messageField">Message</label>
           <p class="control has-icons-right">
             <textarea id="text" class="textarea has-fixed-size" type="textarea" formControlName="text" [ngClass]="{'is-danger': fieldIsInvalid('text'), 'is-success': fieldIsValid('text')}"
-            rows=6></textarea>
+              rows=6></textarea>
             <span class="icon is-small is-right has-text-success" *ngIf="fieldIsValid('text')">
               <i class="fas fa-check-circle"></i>
             </span>
@@ -168,6 +170,6 @@
           <button type="submit" class="button is-primary" [disabled]="formIsInvalid()" i18n="@@contact.send">Envoyer</button>
         </div>
       </div>
+    </div>
   </form>
-
 </div>
\ No newline at end of file

src/app/core/components/contact/contact.component.scss

 @import '../../../../scss/variables.scss';
+@import "../../../../../node_modules/bulma/sass/utilities/_all";
 
 h1 {
   font-size: 2rem;
-  margin-bottom: 0;
+  margin: 0;
+  padding: 1.25rem;
+  background-color: white;
 }
 
 h2 {
@@ -16,9 +19,18 @@ h3 {
   margin-right: 0;
 }
 
-.section {  
-  .fields-container {
-    width: 66%;
+.contact-form-container {  
+  background-color: white;
+  padding: 0 1rem 0 1rem;
+  margin-left: 1.5rem;
+  margin-right: 1.5rem;
+  margin-bottom: 1.25rem;
+
+  
+  @media(min-width: $tablet) {
+    .fields-container {
+      width: 66%;
+    }  
   }
 
   label {