diff --git a/src/app/main/ui/forms/forms.component.html b/src/app/main/ui/forms/forms.component.html
index 759a7def..02d4c41b 100644
--- a/src/app/main/ui/forms/forms.component.html
+++ b/src/app/main/ui/forms/forms.component.html
@@ -1,7 +1,7 @@
 <div id="forms" class="page-layout simple fullwidth" fxLayout="column">
 
     <!-- HEADER -->
-    <div class="header mat-accent-bg p-24 h-160" fxLayout="row" fxLayoutAlign="start center">
+    <div class="header accent p-24 h-160" fxLayout="row" fxLayoutAlign="start center">
         <div fxLayout="column" fxLayoutAlign="center start">
             <div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
                 <mat-icon class="secondary-text s-18">home</mat-icon>
@@ -27,11 +27,11 @@
             reactive patterns, testing, and validation.
         </p>
 
-        <div fxLayout="column" fxLayoutAlign="start start" fxLayout.gt-md="row">
+        <div class="mb-24" fxLayout="column" fxLayoutAlign="start" fxLayout.gt-md="row">
 
             <!-- REACTIVE FORM EXAMPLE -->
 
-            <form class="mat-white-bg mat-elevation-z4 p-24 mr-24 mb-24" fxLayout="column" fxLayoutAlign="start"
+            <form class="mat-elevation-z4 p-24 mr-24" fxLayout="column" fxLayoutAlign="start"
                   fxFlex="1 0 auto" name="form" [formGroup]="form">
 
                 <div class="h2 mb-24">Reactive Form Example</div>
@@ -48,16 +48,12 @@
 
                     <mat-form-field fxFlex="50">
                         <input matInput placeholder="First name" formControlName="firstName" required>
-                        <mat-error *ngIf="formErrors.firstName.required">
-                            First Name is required!
-                        </mat-error>
+                        <mat-error>First Name is required!</mat-error>
                     </mat-form-field>
 
                     <mat-form-field fxFlex="50">
                         <input matInput placeholder="Last name" formControlName="lastName" required>
-                        <mat-error *ngIf="formErrors.lastName.required">
-                            Last Name is required!
-                        </mat-error>
+                        <mat-error>Last Name is required!</mat-error>
                     </mat-form-field>
 
                 </div>
@@ -68,16 +64,12 @@
                         <textarea matInput placeholder="Address" formControlName="address" required>
                             1600 Amphitheatre Pkwy
                         </textarea>
-                        <mat-error *ngIf="formErrors.address.required">
-                            Address is required!
-                        </mat-error>
+                        <mat-error>Address is required!</mat-error>
                     </mat-form-field>
 
                     <mat-form-field fxFlex="100">
                         <textarea matInput placeholder="Address 2" formControlName="address2"></textarea>
-                        <mat-error *ngIf="formErrors.address2.required">
-                            Address 2 is required!
-                        </mat-error>
+                        <mat-error>Address 2 is required!</mat-error>
                     </mat-form-field>
 
                 </div>
@@ -86,28 +78,19 @@
 
                     <mat-form-field fxFlex="33">
                         <input matInput placeholder="City" formControlName="city" required>
-                        <mat-error *ngIf="formErrors.city.required">
-                            City is required!
-                        </mat-error>
+                        <mat-error>City is required!</mat-error>
                     </mat-form-field>
 
                     <mat-form-field fxFlex="34">
                         <input matInput placeholder="State" formControlName="state" required>
-                        <mat-error *ngIf="formErrors.state.required">
-                            State is required!
-                        </mat-error>
+                        <mat-error>State is required!</mat-error>
                     </mat-form-field>
 
                     <mat-form-field fxFlex="33">
                         <input matInput #postalCode placeholder="Postal Code" value="94043"
-                               formControlName="postalCode" required>
+                               formControlName="postalCode" maxlength="5" required>
                         <mat-hint align="end">{{postalCode.value.length}} / 5</mat-hint>
-                        <mat-error *ngIf="formErrors.postalCode.maxlength">
-                            Postal Code needs to be max. {{formErrors.postalCode.maxlength.requiredLength}} characters
-                        </mat-error>
-                        <mat-error *ngIf="formErrors.postalCode.required">
-                            Postal Code is required!
-                        </mat-error>
+                        <mat-error>Postal Code is required!</mat-error>
                     </mat-form-field>
 
                 </div>
@@ -135,9 +118,7 @@
                                 Turkey
                             </mat-option>
                         </mat-select>
-                        <mat-error *ngIf="formErrors.country.required">
-                            Country is required!
-                        </mat-error>
+                        <mat-error>Country is required!</mat-error>
                     </mat-form-field>
 
                 </div>
@@ -146,11 +127,9 @@
 
             <!-- / REACTIVE FORM EXAMPLE -->
 
-            <div class="form-errors-model mat-white-bg p-24 mat-elevation-z4">
-
-                <div class="h2 mb-24">Reactive Form Errors Model</div>
-
-                <pre><code>{{formErrors | json}}</code></pre>
+            <div class="form-errors-model p-24 mat-elevation-z4">
+                <div class="h2 mb-24">Reactive Form Model</div>
+                <pre><code>{{form.getRawValue() | json}}</code></pre>
             </div>
 
         </div>
@@ -171,24 +150,20 @@
 
                 <mat-step [stepControl]="horizontalStepperStep1">
 
-                    <form [formGroup]="horizontalStepperStep1">
+                    <form fxLayout="column" [formGroup]="horizontalStepperStep1">
 
                         <ng-template matStepLabel>Fill out your name</ng-template>
 
-                        <div fxFlex="1 0 auto" fxLayout="row">
+                        <div fxFlex="1 0 auto" fxLayout="column">
 
-                            <mat-form-field fxFlex="50">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="First name" formControlName="firstName" required>
-                                <mat-error *ngIf="horizontalStepperStep1Errors.firstName.required">
-                                    First Name is required!
-                                </mat-error>
+                                <mat-error>First Name is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="50">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="Last name" formControlName="lastName" required>
-                                <mat-error *ngIf="formErrors.lastName.required">
-                                    Last Name is required!
-                                </mat-error>
+                                <mat-error>Last Name is required!</mat-error>
                             </mat-form-field>
 
                         </div>
@@ -205,7 +180,7 @@
 
                 <mat-step [stepControl]="horizontalStepperStep2">
 
-                    <form [formGroup]="horizontalStepperStep2">
+                    <form fxLayout="column" [formGroup]="horizontalStepperStep2">
 
                         <ng-template matStepLabel>Fill out your address</ng-template>
 
@@ -215,9 +190,7 @@
                                 <textarea matInput placeholder="Address" formControlName="address" required>
                                     1600 Amphitheatre Pkwy
                                 </textarea>
-                                <mat-error *ngIf="horizontalStepperStep2Errors.address.required">
-                                    Address is required!
-                                </mat-error>
+                                <mat-error>Address is required!</mat-error>
                             </mat-form-field>
 
                         </div>
@@ -237,37 +210,27 @@
 
                 <mat-step [stepControl]="horizontalStepperStep3">
 
-                    <form [formGroup]="horizontalStepperStep3">
+                    <form fxLayout="column" [formGroup]="horizontalStepperStep3">
 
                         <ng-template matStepLabel>Fill out your address</ng-template>
 
-                        <div fxFlex="1 0 auto" fxLayout="row">
+                        <div fxFlex="1 0 auto" fxLayout="column">
 
-                            <mat-form-field fxFlex="33">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="City" formControlName="city" required>
-                                <mat-error *ngIf="horizontalStepperStep3Errors.city.required">
-                                    City is required!
-                                </mat-error>
+                                <mat-error>City is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="34">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="State" formControlName="state" required>
-                                <mat-error *ngIf="horizontalStepperStep3Errors.state.required">
-                                    State is required!
-                                </mat-error>
+                                <mat-error>State is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="33">
+                            <mat-form-field fxFlex="100">
                                 <input matInput #postalCode placeholder="Postal Code" formControlName="postalCode"
-                                       required>
+                                       maxlength="5" required>
                                 <mat-hint align="end">{{postalCode.value.length}} / 5</mat-hint>
-                                <mat-error *ngIf="horizontalStepperStep3Errors.postalCode.maxlength">
-                                    Postal Code needs to be max.
-                                    {{horizontalStepperStep3Errors.postalCode.maxlength.requiredLength}} characters
-                                </mat-error>
-                                <mat-error *ngIf="horizontalStepperStep3Errors.postalCode.required">
-                                    Postal Code is required!
-                                </mat-error>
+                                <mat-error>Postal Code is required!</mat-error>
                             </mat-form-field>
 
                         </div>
@@ -325,24 +288,20 @@
 
                 <mat-step [stepControl]="verticalStepperStep1">
 
-                    <form [formGroup]="verticalStepperStep1">
+                    <form fxLayout="column" [formGroup]="verticalStepperStep1">
 
                         <ng-template matStepLabel>Fill out your name</ng-template>
 
-                        <div fxFlex="1 0 auto" fxLayout="row">
+                        <div fxFlex="1 0 auto" fxLayout="column">
 
-                            <mat-form-field fxFlex="50">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="First name" formControlName="firstName" required>
-                                <mat-error *ngIf="verticalStepperStep1Errors.firstName.required">
-                                    First Name is required!
-                                </mat-error>
+                                <mat-error>First Name is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="50">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="Last name" formControlName="lastName" required>
-                                <mat-error *ngIf="formErrors.lastName.required">
-                                    Last Name is required!
-                                </mat-error>
+                                <mat-error>Last Name is required!</mat-error>
                             </mat-form-field>
 
                         </div>
@@ -359,7 +318,7 @@
 
                 <mat-step [stepControl]="verticalStepperStep2">
 
-                    <form [formGroup]="verticalStepperStep2">
+                    <form fxLayout="column" [formGroup]="verticalStepperStep2">
 
                         <ng-template matStepLabel>Fill out your address</ng-template>
 
@@ -369,9 +328,7 @@
                                 <textarea matInput placeholder="Address" formControlName="address" required>
                                     1600 Amphitheatre Pkwy
                                 </textarea>
-                                <mat-error *ngIf="verticalStepperStep2Errors.address.required">
-                                    Address is required!
-                                </mat-error>
+                                <mat-error>Address is required!</mat-error>
                             </mat-form-field>
 
                         </div>
@@ -391,37 +348,27 @@
 
                 <mat-step [stepControl]="verticalStepperStep3">
 
-                    <form [formGroup]="verticalStepperStep3">
+                    <form fxLayout="column" [formGroup]="verticalStepperStep3">
 
                         <ng-template matStepLabel>Fill out your address</ng-template>
 
                         <div fxFlex="1 0 auto" fxLayout="row">
 
-                            <mat-form-field fxFlex="33">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="City" formControlName="city" required>
-                                <mat-error *ngIf="verticalStepperStep3Errors.city.required">
-                                    City is required!
-                                </mat-error>
+                                <mat-error>City is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="34">
+                            <mat-form-field fxFlex="100">
                                 <input matInput placeholder="State" formControlName="state" required>
-                                <mat-error *ngIf="verticalStepperStep3Errors.state.required">
-                                    State is required!
-                                </mat-error>
+                                <mat-error>State is required!</mat-error>
                             </mat-form-field>
 
-                            <mat-form-field fxFlex="33">
+                            <mat-form-field fxFlex="100">
                                 <input matInput #postalCode placeholder="Postal Code" formControlName="postalCode"
-                                       required>
+                                       maxlength="5" required>
                                 <mat-hint align="end">{{postalCode.value.length}} / 5</mat-hint>
-                                <mat-error *ngIf="verticalStepperStep3Errors.postalCode.maxlength">
-                                    Postal Code needs to be max.
-                                    {{verticalStepperStep3Errors.postalCode.maxlength.requiredLength}} characters
-                                </mat-error>
-                                <mat-error *ngIf="verticalStepperStep3Errors.postalCode.required">
-                                    Postal Code is required!
-                                </mat-error>
+                                <mat-error>Postal Code is required!</mat-error>
                             </mat-form-field>
 
                         </div>
diff --git a/src/app/main/ui/forms/forms.component.ts b/src/app/main/ui/forms/forms.component.ts
index ca09a013..b69b0413 100644
--- a/src/app/main/ui/forms/forms.component.ts
+++ b/src/app/main/ui/forms/forms.component.ts
@@ -1,7 +1,6 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
 
 @Component({
     selector   : 'forms',
@@ -11,23 +10,16 @@ import { takeUntil } from 'rxjs/operators';
 export class FormsComponent implements OnInit, OnDestroy
 {
     form: FormGroup;
-    formErrors: any;
 
     // Horizontal Stepper
     horizontalStepperStep1: FormGroup;
     horizontalStepperStep2: FormGroup;
     horizontalStepperStep3: FormGroup;
-    horizontalStepperStep1Errors: any;
-    horizontalStepperStep2Errors: any;
-    horizontalStepperStep3Errors: any;
 
     // Vertical Stepper
     verticalStepperStep1: FormGroup;
     verticalStepperStep2: FormGroup;
     verticalStepperStep3: FormGroup;
-    verticalStepperStep1Errors: any;
-    verticalStepperStep2Errors: any;
-    verticalStepperStep3Errors: any;
 
     // Private
     private _unsubscribeAll: Subject<any>;
@@ -41,51 +33,6 @@ export class FormsComponent implements OnInit, OnDestroy
         private _formBuilder: FormBuilder
     )
     {
-        // Reactive form errors
-        this.formErrors = {
-            company   : {},
-            firstName : {},
-            lastName  : {},
-            address   : {},
-            address2  : {},
-            city      : {},
-            state     : {},
-            postalCode: {},
-            country   : {}
-        };
-
-        // Horizontal Stepper form error
-        this.horizontalStepperStep1Errors = {
-            firstName: {},
-            lastName : {}
-        };
-
-        this.horizontalStepperStep2Errors = {
-            address: {}
-        };
-
-        this.horizontalStepperStep3Errors = {
-            city      : {},
-            state     : {},
-            postalCode: {}
-        };
-
-        // Vertical Stepper form error
-        this.verticalStepperStep1Errors = {
-            firstName: {},
-            lastName : {}
-        };
-
-        this.verticalStepperStep2Errors = {
-            address: {}
-        };
-
-        this.verticalStepperStep3Errors = {
-            city      : {},
-            state     : {},
-            postalCode: {}
-        };
-
         // Set the private defaults
         this._unsubscribeAll = new Subject();
     }
@@ -117,12 +64,6 @@ export class FormsComponent implements OnInit, OnDestroy
             country   : ['', Validators.required]
         });
 
-        this.form.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
         // Horizontal Stepper form steps
         this.horizontalStepperStep1 = this._formBuilder.group({
             firstName: ['', Validators.required],
@@ -139,24 +80,6 @@ export class FormsComponent implements OnInit, OnDestroy
             postalCode: ['', [Validators.required, Validators.maxLength(5)]]
         });
 
-        this.horizontalStepperStep1.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
-        this.horizontalStepperStep2.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
-        this.horizontalStepperStep3.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
         // Vertical Stepper form stepper
         this.verticalStepperStep1 = this._formBuilder.group({
             firstName: ['', Validators.required],
@@ -172,24 +95,6 @@ export class FormsComponent implements OnInit, OnDestroy
             state     : ['', Validators.required],
             postalCode: ['', [Validators.required, Validators.maxLength(5)]]
         });
-
-        this.verticalStepperStep1.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
-        this.verticalStepperStep2.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
-
-        this.verticalStepperStep3.valueChanges
-            .pipe(takeUntil(this._unsubscribeAll))
-            .subscribe(() => {
-                this.onFormValuesChanged();
-            });
     }
 
     /**
@@ -206,31 +111,6 @@ export class FormsComponent implements OnInit, OnDestroy
     // @ Public methods
     // -----------------------------------------------------------------------------------------------------
 
-    /**
-     * On form values changed
-     */
-    onFormValuesChanged(): void
-    {
-        for ( const field in this.formErrors )
-        {
-            if ( !this.formErrors.hasOwnProperty(field) )
-            {
-                continue;
-            }
-
-            // Clear previous errors
-            this.formErrors[field] = {};
-
-            // Get the control
-            const control = this.form.get(field);
-
-            if ( control && control.dirty && !control.valid )
-            {
-                this.formErrors[field] = control.errors;
-            }
-        }
-    }
-
     /**
      * Finish the horizontal stepper
      */