diff --git a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
index d62cad6f0..832b469c1 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
+++ b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
@@ -5,7 +5,12 @@
 <div *ngIf="movie" class="dark-theme">
 
     <top-banner [background]="movie.background" [available]="movie.available" [title]="movie.title" [releaseDate]="movie.releaseDate" [tagline]="movie.tagline"></top-banner>
+    <div class="social-icons-container">
 
+        <social-icons [homepage]="movie.homepage" [theMoviedbId]="movie.id" [hasTrailer]="movie.videos?.results?.length > 0" (openTrailer)="openDialog()" [imdbId]="movie.imdbId" [twitter]="movie.externalIds.twitterId" [facebook]="movie.externalIds.facebookId"
+            [instagram]="movie.externalIds.instagramId" [available]="movie.available" [plexUrl]="movie.plexUrl" [embyUrl]="movie.embyUrl" [jellyfinUrl]="movie.jellyfinUrl"></social-icons>
+
+    </div>
     <section id="info-wrapper">
         <div class="small-middle-container">
 
@@ -14,19 +19,27 @@
                 <media-poster [posterPath]="'https://image.tmdb.org/t/p/w300/' + movie.posterPath"></media-poster>
 
                 <!--Next to poster-->
-                <div class="col-12 col-lg-2 col-xl-3 media-row">
-
-                    <social-icons [homepage]="movie.homepage" [theMoviedbId]="movie.id" [hasTrailer]="movie.videos?.results?.length > 0" (openTrailer)="openDialog()" [imdbId]="movie.imdbId" [twitter]="movie.externalIds.twitterId" [facebook]="movie.externalIds.facebookId"
-                        [instagram]="movie.externalIds.instagramId" [available]="movie.available" [plexUrl]="movie.plexUrl" [embyUrl]="movie.embyUrl" [jellyfinUrl]="movie.jellyfinUrl"></social-icons>
-
-                </div>
-
-                <div class="col-12 col-lg-5 col-xl-5 media-row">
-
-                    <button mat-raised-button class="btn-green btn-spacing" *ngIf="movie.available"> {{
-            'Common.Available' | translate }}</button>
+                <div class="col-12 col-lg-8 col-xl-8 media-row">
+                    <span *ngIf="movie.available">
+                        <a *ngIf="movie.plexUrl" href="{{movie.plexUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn plex">
+                            {{'Search.ViewOnPlex' | translate}} 
+                            <i class="fa fa-play-circle fa-2x"></i>
+                        </a>
+                        <a *ngIf="movie.embyUrl" href="{{movie.embyUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn emby">
+                            {{'Search.ViewOnEmby' | translate}} 
+                            <i class="fa fa-play-circle fa-2x"></i>
+                        </a>
+                        <a *ngIf="movie.jellyfinUrl" href="{{movie.jellyfinUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn jellyfinUrl">
+                            {{'Search.ViewOnJellyfin' | translate}} 
+                            <i class="fa fa-play-circle fa-2x"></i>
+                        </a>
+                        <button mat-raised-button class="btn-green btn-spacing" *ngIf="movie.available && !movie.plexUrl && !movie.embyUrl && !movie.jellyfinUrl"> {{
+                            'Common.Available' | translate }}</button>
+                                    <span *ngIf="!movie.available">
+                    </span>
                     <span *ngIf="!movie.available">
-            <span *ngIf="movie.requested || movie.approved; then requestedBtn else notRequestedBtn"></span>
+                        <span *ngIf="movie.requested || movie.approved; then requestedBtn else notRequestedBtn"></span>
+                    </span>                   
 
                     <ng-template #requestedBtn>
                         <button mat-raised-button *ngIf="!hasRequest || hasRequest && movieRequest && !movieRequest.denied" class="btn-spacing" color="warn" [disabled]><i class="fa fa-check"></i>
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/movie/panels/movie-information-panel.component.html b/src/Ombi/ClientApp/src/app/media-details/components/movie/panels/movie-information-panel.component.html
index 479644203..13cb4d16a 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/movie/panels/movie-information-panel.component.html
+++ b/src/Ombi/ClientApp/src/app/media-details/components/movie/panels/movie-information-panel.component.html
@@ -98,11 +98,11 @@
     </div>
 
     <hr />
-    <div *ngIf="movie.genres">
+    <div class="genre-button-container" *ngIf="movie.genres">
         <strong>{{'MediaDetails.Genres' | translate }}:</strong>
         <div>
             <mat-chip-list>
-                <mat-chip color="accent" selected *ngFor="let genre of movie.genres">
+                <mat-chip selected *ngFor="let genre of movie.genres">
                     {{genre.name}}
                 </mat-chip>
             </mat-chip-list>
@@ -110,10 +110,10 @@
     </div>
 
     <hr />
-    <div *ngIf="movie?.keywords?.keywordsValue?.length > 0">
+    <div class="keyword-button-container" *ngIf="movie?.keywords?.keywordsValue?.length > 0">
         <strong>{{'MediaDetails.Keywords' | translate }}:</strong>
         <mat-chip-list>
-            <mat-chip color="accent" selected *ngFor="let keyword of movie.keywords.keywordsValue">
+            <mat-chip selected *ngFor="let keyword of movie.keywords.keywordsValue">
                 {{keyword.name}}
             </mat-chip>
         </mat-chip-list>
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html b/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html
index 934423512..6107ac9a4 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html
+++ b/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html
@@ -1,7 +1,7 @@
-<a *ngIf="homepage" class="media-icons" href="{{homepage}}" target="_blank">
+<div class="social-icons-container-inner">
+    <a *ngIf="homepage" class="media-icons" href="{{homepage}}" target="_blank">
         <i matTooltip="Homepage" class="fa fa-home fa-2x grow-social"></i>
     </a>
-
     <a *ngIf="theMoviedbId" href="https://www.themoviedb.org/movie/{{theMoviedbId}}" class="media-icons"
         target="_blank">
         <i matTooltip="The Movie DB" class="fa fa-film fa-2x grow-social"></i>
@@ -10,42 +10,18 @@
         <i matTooltip="The TV DB" class="fa fa-tv fa-2x grow-social"></i>
     </a>
 
-    <a *ngIf="hasTrailer" class="media-icons youtube" (click)="openDialog()"><i
-            matTooltip="Trailer" class="fa fa-youtube-play fa-2x grow-social"></i></a>
-
-    <a *ngIf="imdbId" class="media-icons imdb" [href]="doNotAppend ? imdbid : 'https://imdb.com/title/' + imdbId"
-        target="_blank">
+    <a *ngIf="hasTrailer" class="media-icons youtube" (click)="openDialog()">
+        <i matTooltip="Trailer" class="fa fa-youtube-play fa-2x grow-social"></i>
+    </a>
+    <a *ngIf="imdbId" class="media-icons imdb" [href]="doNotAppend ? imdbid : 'https://imdb.com/title/' + imdbId" target="_blank">
         <i matTooltip="Imdb" class="fa fa-imdb fa-2x grow-social"></i>
     </a>
-    <a *ngIf="twitter" class="media-icons"
-        [href]="doNotAppend ? twitter : 'https://twitter.com/' + twitter" target="_blank">
+    <a *ngIf="twitter" class="media-icons" [href]="doNotAppend ? twitter : 'https://twitter.com/' + twitter" target="_blank">
         <i matTooltip="Twitter" class="fa fa-twitter fa-2x grow-social"></i>
     </a>
-    <a *ngIf="facebook" class="media-icons"
-        [href]="doNotAppend ? facebook : 'https://facebook.com/' + facebook" target="_blank">
+    <a *ngIf="facebook" class="media-icons" [href]="doNotAppend ? facebook : 'https://facebook.com/' + facebook" target="_blank">
         <i matTooltip="Facebook" class="fa fa-facebook fa-2x grow-social"></i>
-    </a> <a *ngIf="instagram" class="media-icons"
-        [href]="doNotAppend ? instagram : 'https://instagram.com/' + instagram" target="_blank">
+    </a> <a *ngIf="instagram" class="media-icons" [href]="doNotAppend ? instagram : 'https://instagram.com/' + instagram" target="_blank">
         <i matTooltip="Instagram" class="fa fa-instagram fa-2x grow-social"></i>
     </a>
-
-    <span class="left-seperator" *ngIf="available">
-
-        <a *ngIf="plexUrl" href="{{plexUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn plex">
-            {{'Search.ViewOnPlex' | translate}} 
-            <i
-            class="fa fa-play-circle fa-2x"></i>
-        </a>
-
-        <a *ngIf="embyUrl" href="{{embyUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn emby">
-            {{'Search.ViewOnEmby' | translate}} 
-            <i
-            class="fa fa-play-circle fa-2x"></i>
-        </a>
-
-        <a *ngIf="jellyfinUrl" href="{{jellyfinUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn jellyfinUrl">
-            {{'Search.ViewOnJellyfin' | translate}} 
-            <i
-            class="fa fa-play-circle fa-2x"></i>
-        </a>
-    </span>
+</div>
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.scss b/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.scss
index 24e22e7b7..6e611a04f 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.scss
+++ b/src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.scss
@@ -1,19 +1,6 @@
+@import "~styles/variables.scss";
 
-.viewon-btn {
-    background-color: transparent;
-    margin-top: 7px;
-    text-decoration: none;
+a.media-icons:hover{
+    color:$ombi-active;
 }
 
-.viewon-btn.plex {
-    border: 1px solid #ffd740;
-    color: #ffd740;
-}
-.viewon-btn.emby {
-    border: 1px solid #52b54a;
-    color: #52b54a;
-}
-.viewon-btn.jellyfin {
-    border: 1px solid #00a4dc;
-    color: #00a4dc;
-}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html b/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html
index bdb9aac37..1b7ea2f76 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html
+++ b/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.html
@@ -4,15 +4,15 @@
         <div class="shadow-base" [ngClass]="available ? 'available-bottom-border' : ''"></div>
 
         <div class="container summary">
-            <div class="container">
+            <div class="container title-top-banner">
                 <div class="row">
                     <div
-                        class="col-xl-11 col-lg-8 offset-xl-1 offset-lg-4 col-md-8 col-sm-7 col-12 offset-md-4 offset-sm-5 mobile-top-text">
-                        <h1 class="large-text">{{title}} <span *ngIf="releaseDate" class="grey-text align-middle">
+                        class="col-xl-11 col-lg-8 col-md-8 col-sm-7 col-12 mobile-top-text">
+                        <h1 class="large-text">{{title}} <span *ngIf="releaseDate" class="grey-text">
                             ({{releaseDate | amLocal | amDateFormat: 'YYYY'}})</span>
                         </h1>
 
-                        <h2 class="tagline grey-text">{{tagline}}</h2>
+                        <h2 class="tagline">{{tagline}}</h2>
                     </div>
                 </div>
             </div>
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.scss b/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.scss
index 7ad12a274..91cfc606b 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.scss
+++ b/src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.scss
@@ -1,3 +1,13 @@
 .large-text {
     font: 500 40px/30px Roboto, "Helvetica Neue", sans-serif;
-}
\ No newline at end of file
+}
+
+@media (min-width:571px){
+    .title-top-banner{
+    margin-left:300px;
+}}
+
+@media (max-width:571px){
+    .title-top-banner{
+    text-align:center;
+}}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/media-details/media-details.component.scss b/src/Ombi/ClientApp/src/app/media-details/media-details.component.scss
index 49a5a5433..e8ed3e2e1 100644
--- a/src/Ombi/ClientApp/src/app/media-details/media-details.component.scss
+++ b/src/Ombi/ClientApp/src/app/media-details/media-details.component.scss
@@ -43,7 +43,7 @@
     background-size: cover;
     background-position: 50% 10%;
     transition: all .5s;
-    height: 450px;
+    height: 300px;
     color: #fff;
     position: relative;
 }
@@ -90,17 +90,6 @@
     right: 0;
 }
 
-#summary-wrapper,
-.summary-wrapper {
-    background-color: #000;
-    background-size: cover;
-    background-position: 50% 10%;
-    transition: all .5s;
-    height: 550px;
-    color: #fff;
-    position: relative;
-}
-
 .grey-text {
     color: #999;
 }
@@ -182,8 +171,8 @@
 }
 
 .media-icons {
-    color: white !important;
-    padding: 1%;
+    color: #FFF;
+    padding: 5px;
 }
 
 .media-row {
@@ -232,4 +221,37 @@
     border-radius: 1em;
     margin-right: 10px;
     margin-top: 5px;
-}
\ No newline at end of file
+}
+
+.social-icons-container{
+    position:absolute;
+    top:84px;
+    right:0px;
+    width:100%;
+    background-color:rgba(15,23,31,.6);
+}
+
+.social-icons-container-inner{
+    text-align:right;
+    display:flex;
+    justify-content: flex-end;
+    padding-right:2em;
+}
+
+.viewon-btn {
+    background-color: transparent;
+    text-decoration: none;
+}
+
+.viewon-btn.plex {
+    border: 1px solid #E5A00D;
+    color: #E5A00D;
+}
+.viewon-btn.emby {
+    border: 1px solid #52b54a;
+    color: #52b54a;
+}
+.viewon-btn.jellyfin {
+    border: 1px solid #00a4dc;
+    color: #00a4dc;
+}