diff --git a/src/components/themes/purple-haze/theme.css b/src/components/themes/purple-haze/theme.css
index dcfa0ec494..11cb044211 100644
--- a/src/components/themes/purple-haze/theme.css
+++ b/src/components/themes/purple-haze/theme.css
@@ -574,8 +574,8 @@ a[data-role=button] {
     background-color: rgba(0, 0, 0, 0.4)
 }
 
-.personCard .portraitCard {
-    width: 50%;
+.personCard .overflowPortraitCard {
+    width: 40vw;
 }
 
 .personCard .cardScalable {
diff --git a/src/controllers/itemdetailpage.js b/src/controllers/itemdetailpage.js
index f5d32f34e8..e02063c031 100644
--- a/src/controllers/itemdetailpage.js
+++ b/src/controllers/itemdetailpage.js
@@ -895,7 +895,7 @@ define(["loading", "appRouter", "layoutManager", "userSettings", "connectionMana
 
             var html = cardBuilder.getCardsHtml({
                 items: result.Items,
-                shape: getThumbShape(false),
+                shape: "overflowBackdrop",
                 showTitle: true,
                 displayAsSpecial: "Season" == item.Type && item.IndexNumber,
                 overlayText: false,
@@ -1400,7 +1400,7 @@ define(["loading", "appRouter", "layoutManager", "userSettings", "connectionMana
                 scrollX = enableScrollX();
                 html = cardBuilder.getCardsHtml({
                     items: result.Items,
-                    shape: getPortraitShape(),
+                    shape: "overflowPortrait",
                     showTitle: true,
                     centerText: true,
                     lazy: true,
@@ -1419,7 +1419,7 @@ define(["loading", "appRouter", "layoutManager", "userSettings", "connectionMana
                 if ("Episode" === item.Type) {
                     html = cardBuilder.getCardsHtml({
                         items: result.Items,
-                        shape: getThumbShape(scrollX),
+                        shape: "overflowBackdrop",
                         showTitle: true,
                         displayAsSpecial: "Season" == item.Type && item.IndexNumber,
                         playFromHere: true,
@@ -1857,7 +1857,7 @@ define(["loading", "appRouter", "layoutManager", "userSettings", "connectionMana
                 coverImage: true,
                 serverId: item.ServerId,
                 width: 160,
-                shape: getPortraitShape()
+                shape: "overflowPortrait"
             });
         });
     }
diff --git a/src/css/librarybrowser.css b/src/css/librarybrowser.css
index ba0148e036..879ee010ea 100644
--- a/src/css/librarybrowser.css
+++ b/src/css/librarybrowser.css
@@ -491,6 +491,7 @@
     position: sticky;
     top: 15%;
     float: left;
+    width: 22.786458333333332vw;
 }
 
 .detailPagePrimaryContent {
@@ -535,9 +536,10 @@
 }
 
 .itemDetailImage {
-    width: 350px;
     -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
-    box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37)
+    box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
+    width: 100% !important;
+
 }
 
 @media all and (max-width:62.5em) {
@@ -545,14 +547,6 @@
         position: relative
     }
 
-    .detailImageContainer {
-        width: 100px !important
-    }
-
-    .itemDetailImage {
-        width: 100px !important
-    }
-
     .btnPlaySimple {
         display: none !important
     }