diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
index 27079acbf..e7fe00c60 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
@@ -42,4 +42,4 @@ h3 strong {
 .overview {
     height:300px;
     overflow-y: auto;
-}
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
index 92b940a08..03fc37187 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
@@ -61,8 +61,12 @@ small {
 }
 
 @media (min-width: 2000px) {
+    .ombi-card{
+      height:100%;
+    }
+
     #cardImage {
-        height: 80%;
+        height: 100%;
         object-fit: cover;
         display: block;
     }
diff --git a/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.html b/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.html
index 0f2284b87..224a43be2 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.html
+++ b/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.html
@@ -1,8 +1,8 @@
 <div class="right">
-<mat-button-toggle-group name="discoverMode">
-    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Combined)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Combined}}">{{'Discovery.Combined' | translate}}</mat-button-toggle>
-    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Movie)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Movie}}">{{'Discovery.Movies' | translate}}</mat-button-toggle>
-    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Tv)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Tv}}">{{'Discovery.Tv' | translate}}</mat-button-toggle>
+<mat-button-toggle-group name="discoverMode" class="discover-filter-buttons-group">
+    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Combined)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Combined}}" class="discover-filter-button">{{'Discovery.Combined' | translate}}</mat-button-toggle>
+    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Movie)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Movie}}" class="discover-filter-button">{{'Discovery.Movies' | translate}}</mat-button-toggle>
+    <mat-button-toggle ngDefaultControl (click)="switchDiscoverMode(DiscoverOption.Tv)" [(ngModel)]="discoverOptions" value="{{DiscoverOption.Tv}}" class="discover-filter-button">{{'Discovery.Tv' | translate}}</mat-button-toggle>
   </mat-button-toggle-group>
 </div>
 
diff --git a/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.scss b/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.scss
index 4fa0b756b..d640fbe8e 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/carousel-list/carousel-list.component.scss
@@ -59,4 +59,29 @@
 
 .right {
   text-align: right;
+  margin-top:-61px;
+}
+
+.discover-filter-buttons-group {
+  background: #0f171d;
+  border: 1px solid #35465c;
+  border-radius: 30px;
+  color:#fff;
+  margin-bottom:10px;
+
+  .discover-filter-button{
+    background:inherit;
+    color:inherit;
+    padding:0 20px;
+    border-radius: 30px;
+    margin:5px;
+  }
+
+  .discover-filter-button.cdk-focused{
+    background:#62d2fa;
+  }
+
+  .discover-filter-button .mat-button-toggle-button:focus{
+    outline:none;
+  }
 }
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
index c1add14c9..d95586507 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
@@ -4,4 +4,9 @@
 ::ng-deep .p-carousel-indicators {
     display: none !important;
     }
-  
\ No newline at end of file
+
+h2{
+    margin-top:40px;
+    margin-left:40px;
+    font-size: 24px;
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
index 4a212ef8e..ff54f9241 100644
--- a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
+++ b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
@@ -3,7 +3,7 @@
         [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'" [mode]="(isHandset$ | async) ? 'over' : 'side'"
         [opened]="!(isHandset$ | async)">
 
-        <mat-toolbar>{{applicationName}}</mat-toolbar>
+        <mat-toolbar class="application-name">{{applicationName}}</mat-toolbar>
 
         <div class="outer-profile">
             <div class="profile-img-container">
@@ -65,14 +65,14 @@
         </div>
     </mat-sidenav>
 
-    <mat-sidenav-content>
-        <mat-toolbar color="primary">
+    <mat-sidenav-content class="content-container">
+        <mat-toolbar color="primary" class="top-bar-container">
             <button type="button" aria-label="Toggle sidenav" mat-icon-button (click)="drawer.toggle()"
                 *ngIf="isHandset$ | async">
                 <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
             </button>
 
-            <div class="col-8 col-lg-10">
+            <div class="col-8 col-lg-10 top-search-bar">
                 <span class="justify-content-center align-items-center">
                     <!-- Search Bar -->
                     <div>
@@ -80,7 +80,7 @@
                     </div>
                 </span>
             </div>
-            <div class="col-2">
+            <div class="col-2 top-filter">
                 <button mat-icon-button [matMenuTriggerFor]="filterMenu">
                     <mat-icon>filter_alt</mat-icon>
                 </button>
diff --git a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss
index b8abd28dc..d0f1bdcc9 100644
--- a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss
+++ b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.scss
@@ -5,10 +5,6 @@
     overflow:auto;
 }
 
-.sidenav {
-    width: 220px;
-}
-
 .sidenav .mat-toolbar {
     background: inherit;
 }
@@ -44,11 +40,6 @@
     padding: 0px 5px;
 }
 
-.active-list-item {
-    background: $accent !important;
-    color:white;
-}
-
 ::ng-deep .dark .active-list-item {
     background: $accent-dark !important;
     color:black !important;
@@ -119,4 +110,64 @@
     bottom: 0;
     left: 0;
     text-align: center;
+}
+// New CSS for new style //
+
+.sidenav-container .sidenav{
+    background: #1b242f;
+    color:#FFF;
+    width: 23rem;
+    font-family: 'Montserrat', sans-serif;
+
+    .application-name{
+        font-family: 'Montserrat', sans-serif;
+        text-transform: uppercase;
+        color:#62d2fa;
+        align-items:center;
+        justify-content: center;
+        font-weight: 700;
+        font-size:24px;
+        padding:40px 20px;
+        height:auto;
+    }
+
+    .outer-profile {
+        background: inherit;
+        box-shadow:none;
+    }
+
+    .mat-list-item{
+        color:#FFF;
+        font-family:Roboto, sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        padding:10px 20px;
+        height:auto;
+        width:20rem;
+        margin-bottom:1rem;
+    }
+    
+    .active-list-item{
+        color:#1b242f;
+        background: #62d2fa;
+        border-radius:0px 30px 30px 0px;
+        padding:10px 20px;
+        height:auto;
+        width:20rem;
+    }
+}
+
+.outer-profile .profile-img-container {
+    background: inherit;
+}
+
+.content-container{
+    background: #0f171d;
+    color:#FFF;
+
+    .top-bar-container{
+        background: #0f171d;
+        color:#35465c; 
+    }
+
 }
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/styles/shared.scss b/src/Ombi/ClientApp/src/styles/shared.scss
index 27bfa6c7d..dda039602 100644
--- a/src/Ombi/ClientApp/src/styles/shared.scss
+++ b/src/Ombi/ClientApp/src/styles/shared.scss
@@ -62,7 +62,7 @@ body {
 
 ::-webkit-scrollbar {
     width: 7px;
-    background: #818181;
+    background: #0f171d;
 }
 
 ::-webkit-scrollbar-track {
@@ -72,7 +72,7 @@ body {
 // Changed color of the scrollbar 
 ::-webkit-scrollbar-thumb {
     border-radius: 3px;
-    background: #303030;
+    background: #35465c;
 }
 
 .sidenav ::-webkit-scrollbar-track {