diff --git a/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.html b/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.html
index 88db832e2..4a5ad930e 100644
--- a/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.html
+++ b/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.html
@@ -4,98 +4,95 @@
 <div *ngIf="form">
     <fieldset>
         <legend>CouchPotato Settings</legend>
-        <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
-            <div class="col-md-6" style="display:block;">
-                <div class="col-md-4">
-                    <div class="form-group">
-                        <div class="checkbox">
-                            <input type="checkbox" id="enable" formControlName="enabled">
-                            <label for="enable">Enable</label>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-md-4">
-                    <div class="form-group">
-                        <div class="checkbox">
-                            <input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl">
-                            <label for="Ssl">SSL</label>
-                        </div>
+        <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
+            <div class="row">
+                <div class="col-md-12 col-12 col-sm-12" style="float: right; width:100%; text-align:right;">
+                    <div class="md-form-field">
+                        <mat-slide-toggle formControlName="enabled" id="enable">Enable</mat-slide-toggle>
                     </div>
                 </div>
             </div>
-            <div class="col-md-6">
-                <div class="form-group">
-                    <label for="Ip" class="control-label">Hostname or IP</label>
-                    <div class="">
-                        <input type="text" class="form-control form-control-custom" [ngClass]="{'form-error': form.get('ip').hasError('required')}"
-                            id="Ip" name="Ip" placeholder="localhost" formControlName="ip">
-                        <small *ngIf="form.get('ip').hasError('required')" class="error-text">The IP/Hostname is required</small>
+            <div class="row">
+                <div class="col-md-7 col-8 col-sm-12">
+                    <label for="username" class="control-label"><h3>Server Configuration</h3></label>
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>Hostname or IP</mat-label>
+                            <input matInput id="Ip" name="Ip" placeholder="Example: localhost" formControlName="ip" >
+                            <mat-error>The IP/Hostname is required</mat-error>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>Port</mat-label>
+                            <input matInput id="port" name="port" placeholder="Example: 8989" formControlName="port">
+                            <mat-error>The Port is required</mat-error>
+                        </mat-form-field>
+                        <mat-slide-toggle formControlName="ssl">SSL</mat-slide-toggle>
+                    </div>
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>API Key</mat-label>
+                            <input matInput id="apiKey" name="apiKey" placeholder="API Key" formControlName="apiKey">
+                            <mat-error>The API Key is required</mat-error>
+                        </mat-form-field>
+                    </div>
+
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>Base URL</mat-label>
+                            <input matInput id="SubDir" name="SubDir" placeholder="Example: /sonarr" formControlName="subDir">
+                        </mat-form-field>
+                    </div>
+                    <div class="md-form-field">
+                        <label for="username" class="control-label"><h3>Plex Credentials</h3></label>
+                        <div>
+                            <mat-form-field appearance="outline" floatLabel=auto>
+                                <mat-label>Username</mat-label>
+                                <input matInput id="username" placeholder="username" formControlName="username" value="{{username}}">
+                            </mat-form-field>
+                        </div>
+                        <div>
+                            <mat-form-field appearance="outline" floatLabel=auto>
+                                <mat-label>Password</mat-label>
+                                <input matInput type="password" id="password" placeholder="Password" formControlName="password" value="{{password}}">
+                            </mat-form-field>
+                        </div>
+                        <div>
+                            <button mat-raised-button class="mat-focus-indicator mat-stroked-button mat-button-base" (click)="requestToken(form)">Request Api Key <i class="fa fa-key"></i></button>
+                        </div>
                     </div>
                 </div>
-
-                <div class="form-group">
-                    <label for="portNumber" class="control-label">Port</label>
-                    <input type="text" class="form-control form-control-custom" [ngClass]="{'form-error': form.get('port').hasError('required')}" formControlName="port" id="portNumber" name="Port" placeholder="Port Number">
-
-                    <small *ngIf="form.get('port').hasError('required')" class="error-text">The Port is required</small>
-                </div>
-
-
-                <div class="form-group">
-                    <label for="ApiKey" class="control-label">API Key</label>
-                 
-                        <input type="text" class="form-control form-control-custom" [ngClass]="{'form-error': form.get('apiKey').hasError('required')}" id="ApiKey" name="ApiKey" formControlName="apiKey">
-
-                        <small *ngIf="form.get('apiKey').hasError('required')" class="error-text">The API Key is required</small>
-                </div>
-                <div class="form-group">
-                    <label for="SubDir" class="control-label">Base Url</label>
-                    <div>
-                        <input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
+                <div class="col-md-5 col-4 col-sm-12">
+                    <label for="username" class="control-label"><h3>Interface</h3></label>
+                    <div class="form-group col-md-12">
+                        <div id="profiles">
+                            <div class="md-form-field" style="display:contents;">
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Quality Profiles</mat-label>
+                                    <mat-select formControlName="defaultProfileId">
+                                      <mat-option *ngFor="let profile of profiles" value="{{profile._id}}">{{profile.label}}</mat-option>
+                                    </mat-select>
+                                    <mat-error>A Default Quality Profile is required</mat-error>
+                                  </mat-form-field>
+                            </div>
+                            <div class="md-form-field" style="display:inline;margin-left:20px;">
+                            <button mat-raised-button id="profiles" (click)="getProfiles(form)" class="mat-stroked-button load">
+                                    Load Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"></span></button>
+                            </div>
+                        </div>
                     </div>
                 </div>
-            </div>
-            <div class="col-md-6">
-                <div class="form-group">
-                    <label for="username" class="control-label">Username</label>
-                    <input type="text" class="form-control form-control-custom " formControlName="username" name="username">
-                </div>
-                <div class="form-group">
-                    <label for="password" class="control-label">Password</label>
-                    <input type="password" class="form-control form-control-custom " formControlName="password" name="password">
-                </div>
-                <div class="form-group">
-                    <button type="button" class="btn btn-primary-outline" (click)="requestToken(form)">Request Api Key <i class="fa fa-key"></i></button>
-                </div>
-
-
-                <div class="form-group">
-                    <div>
-                        <button type="submit" (click)="getProfiles(form)" class="btn btn-primary-outline">Get Quality Profiles <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"> </span></button>
+                <div class="col-md-12" style="margin-top:2em;">
+                    <div class="form-group">
+                        <div>
+                            <button mat-raised-button [disabled]="form.invalid" (click)="test(form)" class="mat-focus-indicator mat-stroked-button mat-button-base">Test Connectivity <span id="spinner"></span></button>
+                        </div>
                     </div>
-                </div>
-                <div class="form-group">
-                    <label for="select" class="control-label">Quality Profiles</label>
-                    <div id="profiles">
-                        <select formControlName="defaultProfileId" class="form-control form-control-custom" id="select">
-                            <option *ngFor="let profile of profiles?.list" value="{{profile._id}}">{{profile.label}}</option>
-                        </select>
-                    </div>
-                </div>
 
 
-
-
-                <div class="form-group">
-                    <div>
-                        <button [disabled]="form.invalid" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"></span></button>
-                    </div>
-                </div>
-
-
-                <div class="form-group">
-                    <div>
-                        <button type="submit" [disabled]="form.invalid" class="btn btn-primary-outline ">Submit</button>
+                    <div class="form-group">
+                        <div>
+                            <button mat-raised-button [disabled]="form.invalid" class="mat-focus-indicator mat-stroked-button mat-button-base mat-accent">Submit</button>
+                        </div>
                     </div>
                 </div>
             </div>
diff --git a/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.scss b/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.scss
index 439e9afc8..aa1beaebc 100644
--- a/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.scss
+++ b/src/Ombi/ClientApp/src/app/settings/couchpotato/couchpotato.component.scss
@@ -1,3 +1,4 @@
+@import "~styles/shared.scss";
 .small-middle-container {
     margin: auto;
     width: 95%;
@@ -7,21 +8,4 @@
 ::ng-deep .dark .btn:hover {
     box-shadow: 0 5px 11px 0 rgba(255, 255, 255, 0.18), 0 4px 15px 0 rgba(255, 255, 255, 0.15);
     color: inherit;
-}
-
-.col-md-6 {
-    display: contents;
-}
-
-.col-md-4 {
-    display: contents;
-}
-
-@media (min-width:1440px) {
-    .col-md-6 {
-        display: inline-table;
-    }
-    .col-md-4 {
-        display: inline-table;
-    }
 }
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/settings/dognzb/dognzb.component.html b/src/Ombi/ClientApp/src/app/settings/dognzb/dognzb.component.html
index d672a1d6b..70981adf4 100644
--- a/src/Ombi/ClientApp/src/app/settings/dognzb/dognzb.component.html
+++ b/src/Ombi/ClientApp/src/app/settings/dognzb/dognzb.component.html
@@ -1,53 +1,45 @@
 <settings-menu>
 </settings-menu>
-<div class="small-middle-container">
+<div>
 <wiki [url]="'https://github.com/tidusjar/Ombi/wiki/DogNzb-Settings'"></wiki>
-<div *ngIf="form">
+<div *ngIf="form" class="small-middle-container">
     <fieldset>
         <legend>DogNzb Settings</legend>
         <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:2%;">
-            <div class="col-md-6">
-                <div class="form-group">
-                    <div class="checkbox">
-                        <input type="checkbox" id="enable" formControlName="enabled" ng-checked="form.enabled">
-                        <label for="enable">Enable</label>
+            <div class="row">
+                <div class="col-md-12 col-12 col-sm-12" style="float: right; width:100%; text-align:right;">
+                        <div class="md-form-field">
+                            <mat-slide-toggle formControlName="enabled">Enabled</mat-slide-toggle>
+                        </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-md-7 col-8 col-sm-12">
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>DogNzb API Key</mat-label>
+                            <input matInput id="apiKey" name="apiKey" placeholder="API Key" formControlName="apiKey">
+                            <mat-error>The API Key is required</mat-error>
+                        </mat-form-field>
                     </div>
-                </div>
 
-
-               
-                <div class="form-group">
-                    <label for="ApiKey" class="control-label">API Key</label>
-                 
-                        <input type="text" class="form-control form-control-custom" [ngClass]="{'form-error': form.get('apiKey').hasError('required')}" id="ApiKey" name="ApiKey" formControlName="apiKey">
-
-                        <small *ngIf="form.get('apiKey').hasError('required')" class="error-text">The API Key is required</small>
-                </div>
-                
-
-
-
-                <div class="form-group">
-                    <div>
-                        <button type="submit" [disabled]="form.invalid" class="btn btn-primary-outline ">Submit</button>
+                    <div class="md-form-field">
+                        <mat-slide-toggle id="movies" formControlName="movies">Movies</mat-slide-toggle>
+                    </div>
+                    <div class="md-form-field">
+                        <mat-slide-toggle id="tvShows" formControlName="tvShows">TV Shows</mat-slide-toggle>
                     </div>
                 </div>
             </div>
-            <div class="col-md-6">
-                <div class="form-group">
-                    <div class="checkbox">
-                        <input type="checkbox" id="movies" formControlName="movies" ng-checked="form.movies">
-                        <label for="movies">Enable for Movies</label>
+            <div class="row">
+                <div class="col-md-7 col-8 col-sm-12">
+                    <div class="md-form-field">
+                        <div>
+                            <br />
+                            <button mat-raised-button type="submit" [disabled]="form.invalid" class="mat-stroked-button accent mat-accent" placeholder="API key">Submit</button>
+                        </div>
                     </div>
                 </div>
-
-                <div class="form-group">
-                    <div class="checkbox">
-                        <input type="checkbox" id="tvShows" formControlName="tvShows" ng-checked="form.tvShows">
-                        <label for="tvShows">Enable for Tv Shows</label>
-                    </div>
-                </div>
-
             </div>
         </form>
     </fieldset>
diff --git a/src/Ombi/ClientApp/src/app/settings/sickrage/sickrage.component.html b/src/Ombi/ClientApp/src/app/settings/sickrage/sickrage.component.html
index 8e63f318c..1f8eb3d03 100644
--- a/src/Ombi/ClientApp/src/app/settings/sickrage/sickrage.component.html
+++ b/src/Ombi/ClientApp/src/app/settings/sickrage/sickrage.component.html
@@ -3,73 +3,81 @@
 <div *ngIf="form" class="small-middle-container">
     <fieldset>
         <legend>SickRage Settings</legend>
-        <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:5%;">
-
-            <div class="col-md-6">
-                <div class="form-group">
-                    <div class="checkbox">
-                        <input type="checkbox" id="enable" formControlName="enabled">
-                        <label for="enable">Enable</label>
-                    </div>
-                </div>
-
-                <div class="form-group">
-                    <label for="Ip" class="control-label">Hostname or IP</label>
-                    
-                        <input type="text" class="form-control form-control-custom " formControlName="ip" id="Ip" name="Ip" placeholder="localhost" [ngClass]="{'form-error': form.get('ip').hasError('required')}">
-                        <small *ngIf="form.get('ip').hasError('required')" class="error-text">The IP/Hostname is required</small>
-                </div>
-
-                <div class="form-group">
-                    <label for="portNumber" class="control-label">Port</label>
-
-                        <input type="text" class="form-control form-control-custom " [ngClass]="{'form-error': form.get('port').hasError('required')}" formControlName="port" id="portNumber" name="Port" placeholder="Port Number">
-                        <small *ngIf="form.get('port').hasError('required')" class="error-text">The Port is required</small>
-                </div>
-
-
-                <div class="form-group">
-                    <label for="ApiKey" class="control-label">API Key</label>
-                    
-                        <input type="text" class="form-control form-control-custom " [ngClass]="{'form-error': form.get('apiKey').hasError('required')}" formControlName="apiKey" id="ApiKey" name="ApiKey">
-                        <small *ngIf="form.get('apiKey').hasError('required')" class="error-text">The API Key is required</small>
-                </div>
-                <div class="form-group">
-                    <div class="checkbox">
-
-                        <input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl"><label for="Ssl">SSL</label>
-
-                    </div>
-                </div>
-                <div class="form-group">
-                    <label for="SubDir" class="control-label">Base Url</label>
-                    <div>
-                        <input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
+        <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
+            <div class="row">
+                <div class="col-md-12 col-12 col-sm-12" style="float: right; width:100%; text-align:right;">
+                    <div style="float:right;text-align:left;">
+                        <div class="md-form-field">
+                            <mat-slide-toggle id="enable" formControlName="enabled">Enable</mat-slide-toggle>
+                        </div>
+                        <div class="md-form-field">
+                            <mat-slide-toggle formControlName="ssl">SSL</mat-slide-toggle>
+                        </div>
                     </div>
                 </div>
             </div>
-            <div class="col-md-6">
-                <div class="form-group">
-                    <label for="select" class="control-label">Quality Profiles</label>
-                    <div id="profiles">
-                        <select class="form-control form-control-custom"  [ngClass]="{'form-error': form.get('qualityProfile').hasError('required')}" id="select" formControlName="qualityProfile">
-                            <option *ngFor="let quality of qualities" value="{{quality.value}}" >{{quality.display}}</option>
-                        </select>
+            <div class="row">
+                <div class="col-md-7 col-8 col-sm-12">
+                    <label for="select" class="control-label"><h3>SickRage Server Configuration</h3></label>
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>SickRage Hostname or IP</mat-label>
+                            <input matInput id="Ip" name="Ip" placeholder="Example: localhost" formControlName="ip">
+                            <mat-error>The IP/Hostname is required</mat-error>
+                        </mat-form-field>
                     </div>
-                    <small *ngIf="form.get('qualityProfile').hasError('required')" class="error-text">A Default Quality Profile is required</small>
-                    
-                </div>
 
-                <div class="form-group">
-                    <div>
-                        <button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity <span id="spinner"> </span></button>
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>Port</mat-label>
+                            <input matInput id="port" name="port" placeholder="Example: 8081" formControlName="port">
+                            <mat-error>The Port is required</mat-error>
+                        </mat-form-field>
+                    </div>
+
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>SickRage API Key</mat-label>
+                            <input matInput id="apiKey" name="apiKey" placeholder="API Key" formControlName="apiKey">
+                            <mat-error>The API Key is required</mat-error>
+                        </mat-form-field>
+                    </div>
+
+                    <div class="md-form-field">
+                        <mat-form-field appearance="outline" floatLabel=always>
+                            <mat-label>SickRage Base URL</mat-label>
+                            <input matInput id="SubDir" name="SubDir" placeholder="Example: /sickrage" formControlName="subDir">
+                        </mat-form-field>
                     </div>
                 </div>
+                <div class="col-md-5 col-4 col-sm-12">
+                    <div class="form-group">
+                        <label for="select" class="control-label"><h3>SickRage Quality Profiles</h3></label>
+                        <div id="profiles">
+                            <div class="md-form-field" style="display:contents;">
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Quality Profiles</mat-label>
+                                    <mat-select formControlName="qualityProfile">
+                                      <mat-option *ngFor="let quality of qualities" value="{{quality.value}}">{{quality.display}} </mat-option>
+                                    </mat-select>
+                                    <mat-error>A Default Quality Profile is required</mat-error>
+                                  </mat-form-field>
+                            </div>
+                        </div>                      
+                    </div>
+
+                    <div class="form-group">
+                        <div>
+                            <button mat-raised-button type="button" (click)="test(form)" class="mat-stroked-button">Test Connectivity
+                            <span id="spinner"> </span></button>
+                        </div>
+                    </div>
 
 
-                <div class="form-group">
-                    <div>
-                        <button type="submit" class="btn btn-primary-outline ">Submit</button>
+                    <div class="form-group">
+                        <div>
+                            <button mat-raised-button type="submit" class="mat-stroked-button accent mat-accent">Submit</button>
+                        </div>
                     </div>
                 </div>
             </div>
diff --git a/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component copy.html b/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component copy.html
new file mode 100644
index 000000000..188f6ab76
--- /dev/null
+++ b/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component copy.html	
@@ -0,0 +1,192 @@
+<settings-menu></settings-menu>
+<div *ngIf="form" class="small-middle-container">
+    <fieldset>
+        <legend>Sonarr Settings</legend>
+        <form novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)" style="padding-top:3%;">
+            <div class="row">
+                <div class="col-md-6 col-6 col-sm-6" style="float: right; width:100%; text-align:right;">
+                    <div style="float:right;text-align:left;">
+                        <div class="md-form-field">
+                            <mat-slide-toggle formControlName="v3">V3</mat-slide-toggle>
+                        </div>
+                        <div class="md-form-field">
+                            <mat-slide-toggle formControlName="ssl">SSL</mat-slide-toggle>
+                        </div>
+                    </div>
+                    <div style="float: right; text-align: left; margin-left:20px;">
+                        <div class="md-form-field">
+                            <mat-slide-toggle formControlName="enabled" id="enable">Enable</mat-slide-toggle>
+                        </div>
+                        <div class="md-form-field">
+                            <mat-slide-toggle [(ngModel)]="advanced" [ngModelOptions]="{standalone: true}">Advanced</mat-slide-toggle>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div style="float: right;">
+                <span style="vertical-align: top;">Advanced</span>
+                <p-inputSwitch id="customInputSwitch" [(ngModel)]="advanced" [ngModelOptions]="{standalone: true}"></p-inputSwitch>
+            </div>
+
+            <div class="col-md-6" style="display:block;">
+                <div class="col-md-4">
+                    <div class="form-group">
+                        <div class="checkbox">
+                            <input type="checkbox" id="enable" formControlName="enabled">
+                            <label for="enable">Enable</label>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <div class="form-group">
+                        <div class="checkbox">
+                            <input type="checkbox" id="v3" formControlName="v3">
+                            <label for="v3">V3</label>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <div class="form-group">
+                        <div class="checkbox">
+                            <input type="checkbox" id="Ssl" name="Ssl" formControlName="ssl">
+                            <label for="Ssl">SSL</label>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-6">
+                <div class="form-group">
+                    <label for="Ip" class="control-label">Sonarr Hostname or IP 
+                        
+                        <i *ngIf="form.get('ip').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="The IP/Hostname is required"></i>
+                    </label>
+
+                    <input type="text" class="form-control form-control-custom " formControlName="ip" id="Ip" name="Ip" placeholder="localhost" [ngClass]="{'form-error': form.get('ip').hasError('required')}">
+                </div>
+
+                <div class="form-group">
+                    <label for="portNumber" class="control-label">Port
+                        
+                        <i *ngIf="form.get('port').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="The Port is required"></i>
+                    </label>
+
+                    <input type="text" class="form-control form-control-custom " [ngClass]="{'form-error': form.get('port').hasError('required')}" formControlName="port" id="portNumber" name="Port" placeholder="Port Number">
+                </div>
+
+
+                <div class="form-group">
+                    <label for="ApiKey" class="control-label">Sonarr API Key
+                        
+                        <i *ngIf="form.get('apiKey').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="The API Key is required"></i>
+                    </label>
+
+                    <input type="text" class="form-control form-control-custom " [ngClass]="{'form-error': form.get('apiKey').hasError('required')}" formControlName="apiKey" id="ApiKey" name="ApiKey">
+                </div>
+                <div class="form-group">
+                    <label for="SubDir" class="control-label">Sonarr Base Url</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom" formControlName="subDir" id="SubDir" name="SubDir">
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-5">
+
+                <div class="form-group col-md-12">
+                    <label for="profiles" class="control-label">Quality Profiles
+                            <i *ngIf="form.get('qualityProfile').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="A Default Quality Profile is required"></i>
+                        </label>
+                    <div id="profiles">
+                        <select class="form-control form-control-custom  col-md-5 form-half" [ngClass]="{'form-error': form.get('qualityProfile').hasError('required')}" id="select" formControlName="qualityProfile">
+                                <option *ngFor="let quality of qualities" value="{{quality.id}}">{{quality.name}}</option>
+                            </select>
+                        <button type="button" (click)="getProfiles(form)" class="btn btn-primary-outline col-md-4 col-md-push-1 load">
+                                Load Qualities <span *ngIf="profilesRunning" class="fa fa-spinner fa-spin"></span></button>
+
+                    </div>
+
+                </div>
+
+
+                <div class="form-group col-md-12">
+                    <label for="select" class="control-label">Quality Profiles (Anime)</label>
+                    <div id="qualityProfileAnime">
+                        <select class="form-control form-control-custom  col-md-5 form-half" id="qualityProfileAnime" formControlName="qualityProfileAnime">
+                            <option *ngFor="let quality of qualities" value="{{quality.id}}">{{quality.name}}</option>
+                        </select>
+                    </div>
+                </div>
+
+
+                <div class="form-group col-md-12">
+                    <label for="rootFolders" class="control-label">Default Root Folders
+                         
+                        <i *ngIf="form.get('rootPath').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="A Default Root Path is required"></i>
+                    </label>
+                    <div id="rootFolders">
+                        <select class="form-control form-control-custom  col-md-5 form-half" formControlName="rootPath" [ngClass]="{'form-error': form.get('rootPath').hasError('required')}">
+                            <option *ngFor="let folder of rootFolders" value="{{folder.id}}">{{folder.path}}</option>
+                        </select>
+                        <button type="button" (click)="getRootFolders(form)" class="btn btn-primary-outline load col-md-4 col-md-push-1">
+                            Load Folders <span *ngIf="rootFoldersRunning" class="fa fa-spinner fa-spin"></span></button>
+                    </div>
+                </div>
+
+                <div class="form-group col-md-12">
+                    <label for="rootFoldersAnime" class="control-label">Default Root Folders (Anime)</label>
+                    <div id="rootFoldersAnime">
+                        <select class="form-control form-control-custom  col-md-5 form-half" formControlName="rootPathAnime">
+                            <option *ngFor="let folder of rootFoldersAnime" value="{{folder.id}}">{{folder.path}}</option>
+                        </select>
+                    </div>
+
+                </div>
+
+                <div class="form-group  col-md-12" *ngIf="form.controls.v3.value">
+                    <label for="select" class="control-label">Language Profiles 
+                        <i *ngIf="form.get('languageProfile').hasError('required')" class="fa fa-exclamation-circle error-text" pTooltip="A Language Profile is required"></i>
+                    </label>
+                    <div id="langaugeProfile">
+                        <select formControlName="languageProfile" class="form-control form-control-custom  col-md-5 form-half" id="select" [ngClass]="{'form-error': form.get('languageProfile').hasError('required')}">
+                            <option *ngFor="let lang of languageProfiles" [ngValue]="lang.id">{{lang.name}}</option>
+                        </select>
+                        <button (click)="getLanguageProfiles(form)" type="button" class="btn btn-primary-outline col-md-4 col-md-push-1">Load
+                            Languages <span *ngIf="langRunning" class="fa fa-spinner fa-spin"> </span></button>
+
+                    </div>
+                </div>
+
+
+                <div class="form-group col-md-12">
+                    <div class="checkbox">
+                        <input type="checkbox" id="SeasonFolders" name="SeasonFolders" formControlName="seasonFolders">
+                        <label for="SeasonFolders">Enable season folders</label>
+                    </div>
+                    <label>Enabled Season Folders to organize seasons into individual folders within a show.</label>
+                </div>
+
+                <div class="form-group col-md-12" *ngIf="advanced" style="color:#ff761b">
+                    <div class="checkbox">
+                        <input type="checkbox" id="addOnly" formControlName="addOnly">
+                        <label for="addOnly">Do not search</label>
+                    </div>
+                </div>
+            </div>
+            <div class="col-md-4">
+                <div class="form-group col-md-7">
+                    <div>
+                        <button type="submit" class="btn btn-primary-outline ">Submit</button>
+                    </div>
+                </div>
+
+                <div class="form-group col-md-7">
+                    <div>
+                        <button type="button" (click)="test(form)" class="btn btn-primary-outline">Test Connectivity
+                        <span id="spinner"> </span></button>
+                    </div>
+                </div>
+            </div>
+        </form>
+    </fieldset>
+</div>
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component.html b/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component.html
index 6e3dc6720..ffbdabab3 100644
--- a/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component.html
+++ b/src/Ombi/ClientApp/src/app/settings/sonarr/sonarr.component.html
@@ -9,9 +9,6 @@
                         <div class="md-form-field">
                             <mat-slide-toggle formControlName="v3">V3</mat-slide-toggle>
                         </div>
-                        <div class="md-form-field">
-                            <mat-slide-toggle formControlName="ssl">SSL</mat-slide-toggle>
-                        </div>
                     </div>
                     <div style="float: right; text-align: left; margin-left:20px;">
                         <div class="md-form-field">
@@ -25,24 +22,22 @@
             </div>
             <div class="row">
                 <div class="col-md-7 col-8 col-sm-12">
+                    <label for="username" class="control-label"><h3>Sonarr Server Configuration</h3></label>
                     <div class="md-form-field">
-                        <mat-form-field appearance="outline" floatLabel=auto>
+                        <mat-form-field appearance="outline" floatLabel=always>
                             <mat-label>Sonarr Hostname or IP</mat-label>
-                            <input matInput id="Ip" name="Ip" placeholder="Example: localhost" formControlName="ip">
+                            <input matInput id="Ip" name="Ip" placeholder="Example: localhost" formControlName="ip" >
                             <mat-error>The IP/Hostname is required</mat-error>
                         </mat-form-field>
-                    </div>
-
-                    <div class="md-form-field">
-                        <mat-form-field appearance="outline" floatLabel=auto>
+                        <mat-form-field appearance="outline" floatLabel=always>
                             <mat-label>Port</mat-label>
                             <input matInput id="port" name="port" placeholder="Example: 8989" formControlName="port">
                             <mat-error>The Port is required</mat-error>
                         </mat-form-field>
+                        <mat-slide-toggle formControlName="ssl">SSL</mat-slide-toggle>
                     </div>
-
                     <div class="md-form-field">
-                        <mat-form-field appearance="outline" floatLabel=auto>
+                        <mat-form-field appearance="outline" floatLabel=always>
                             <mat-label>Sonarr API Key</mat-label>
                             <input matInput id="apiKey" name="apiKey" placeholder="API Key" formControlName="apiKey">
                             <mat-error>The API Key is required</mat-error>
@@ -50,14 +45,14 @@
                     </div>
 
                     <div class="md-form-field">
-                        <mat-form-field appearance="outline" floatLabel=auto>
+                        <mat-form-field appearance="outline" floatLabel=always>
                             <mat-label>Sonarr Base URL</mat-label>
                             <input matInput id="SubDir" name="SubDir" placeholder="Example: /sonarr" formControlName="subDir">
                         </mat-form-field>
                     </div>
                 </div>
                 <div class="col-md-5 col-4 col-sm-12">
-
+                    <label for="username" class="control-label"><h3>Sonarr Interface</h3></label>
                     <div class="form-group col-md-12">
                         <div id="profiles">
                             <div class="md-form-field" style="display:contents;">
@@ -142,16 +137,14 @@
 
                     <div class="form-group col-md-12">
                         <div class="checkbox">
-                            <input type="checkbox" id="SeasonFolders" name="SeasonFolders" formControlName="seasonFolders">
-                            <label for="SeasonFolders">Enable season folders</label>
+                            <mat-slide-toggle id="SeasonFolders" name="SeasonFolders" formControlName="seasonFolders">Enable season folders</mat-slide-toggle>
                         </div>
                         <label>Enabled Season Folders to organize seasons into individual folders within a show.</label>
                     </div>
 
                     <div class="form-group col-md-12" *ngIf="advanced" style="color:#ff761b">
                         <div class="checkbox">
-                            <input type="checkbox" id="addOnly" formControlName="addOnly">
-                            <label for="addOnly">Do not search</label>
+                            <mat-slide-toggle id="addOnly" formControlName="addOnly">Do not search</mat-slide-toggle>
                         </div>
                     </div>
                 </div>
diff --git a/src/Ombi/ClientApp/src/styles/shared.scss b/src/Ombi/ClientApp/src/styles/shared.scss
index c5ba4ee07..9d875d974 100644
--- a/src/Ombi/ClientApp/src/styles/shared.scss
+++ b/src/Ombi/ClientApp/src/styles/shared.scss
@@ -112,4 +112,8 @@ table {
 
 ::ng-deep .mat-form-field.mat-focused .mat-form-field-label{
     color: $accent;
-}
\ No newline at end of file
+}
+
+::ng-deep .mat-form-field-appearance-outline .mat-form-field-wrapper{
+    margin:0.5em;
+}