diff --git a/assets/css/250.less b/assets/css/250.less
index ebe101a156e..e67f24a1d4e 100644
--- a/assets/css/250.less
+++ b/assets/css/250.less
@@ -517,7 +517,7 @@ span.filtered {
 }
 
 .ranking > header > h2:first-of-type {
-    width: 120px;
+    width: 170px;
     box-sizing: border-box;
     padding-left: 1.5em;
     margin-left: .5em;
@@ -570,10 +570,11 @@ span.filtered {
     max-width: 100%;
 }
 
+// Capsule image container.
 .ranking > header ~ div > div:first-child {
     flex-shrink: 0;
     width: 25%;
-    max-width: 120px;
+    max-width: 170px; // Nominally 184px.
     min-width: 80px;
     aspect-ratio: 184/69;
 
@@ -625,6 +626,8 @@ span.filtered {
 .ranking > div > div > .title {
     /* Prevent breaking around title at small resolutions. */
     display: inline;
+
+    font-size: 150%;
 }
 // Shared S250/C250 appline styles.
 .appline {
diff --git a/assets/css/home.less b/assets/css/home.less
index 7077ae8c886..1084d663d60 100644
--- a/assets/css/home.less
+++ b/assets/css/home.less
@@ -70,7 +70,7 @@ section.top10 {
       background: linear-gradient(135deg, #1f202e, #343834, #212333, #291f29);
       box-shadow: 0 0 4px #ffc82c;
 
-      transition: opacity .1s;
+      transition: opacity 50ms;
     }
     &:hover:before {
       opacity: 1;
diff --git a/assets/css/inc/ranking fade.css b/assets/css/inc/ranking fade.css
deleted file mode 100644
index 15edf622c60..00000000000
--- a/assets/css/inc/ranking fade.css	
+++ /dev/null
@@ -1,142 +0,0 @@
-.ranking > header > h2:first-of-type {
-    width: 184px;
-}
-
-/* Sinusoidal in/out fade. */
-.ranking > div[id='1'] {
-    width: 100%;
-}
-.ranking > div[id='2'] {
-    width: calc(100% - 1px);
-}
-.ranking > div[id='3'] {
-    width: calc(100% - 3px);
-}
-.ranking > div[id='4'] {
-    width: calc(100% - 6px);
-}
-.ranking > div[id='5'] {
-    width: calc(100% - 11px);
-}
-.ranking > div[id='6'] {
-    width: calc(100% - 16px);
-}
-.ranking > div[id='7'] {
-    width: calc(100% - 22px);
-}
-.ranking > div[id='8'] {
-    width: calc(100% - 29px);
-}
-.ranking > div[id='9'] {
-    width: calc(100% - 35px);
-}
-.ranking > div[id='10'] {
-    width: calc(100% - 42px);
-}
-.ranking > div[id='11'] {
-    width: calc(100% - 48px);
-}
-.ranking > div[id='12'] {
-    width: calc(100% - 53px);
-}
-.ranking > div[id='13'] {
-    width: calc(100% - 58px);
-}
-.ranking > div[id='14'] {
-    width: calc(100% - 61px);
-}
-.ranking > div[id]:nth-of-type(n+16) {
-    width: calc(100% - 64px);
-}
-
-.ranking > div[id='1'] > div:first-child {
-    max-width: 184px;
-}
-.ranking > div[id='2'] > div:first-child {
-    max-width: 183px;
-}
-.ranking > div[id='3'] > div:first-child {
-    max-width: 181px;
-}
-.ranking > div[id='4'] > div:first-child {
-    max-width: 178px;
-}
-.ranking > div[id='5'] > div:first-child {
-    max-width: 173px;
-}
-.ranking > div[id='6'] > div:first-child {
-    max-width: 168px;
-}
-.ranking > div[id='7'] > div:first-child {
-    max-width: 162px;
-}
-.ranking > div[id='8'] > div:first-child {
-    max-width: 155px;
-}
-.ranking > div[id='9'] > div:first-child {
-    max-width: 149px;
-}
-.ranking > div[id='10'] > div:first-child {
-    max-width: 142px;
-}
-.ranking > div[id='11'] > div:first-child {
-    max-width: 136px;
-}
-.ranking > div[id='12'] > div:first-child {
-    max-width: 131px;
-}
-.ranking > div[id='13'] > div:first-child {
-    max-width: 126px;
-}
-.ranking > div[id='14'] > div:first-child {
-    max-width: 123px;
-}
-.ranking > div[id='15'] > div:first-child {
-    max-width: 121px;
-}
-
-.ranking > div[id='1'] .title {
-    font-size: 200%;
-}
-.ranking > div[id='2'] .title {
-    font-size: 198.91%;
-}
-.ranking > div[id='3'] .title {
-    font-size: 195.68%;
-}
-.ranking > div[id='4'] .title {
-    font-size: 190.45%;
-}
-.ranking > div[id='5'] .title {
-    font-size: 183.46%;
-}
-.ranking > div[id='6'] .title {
-    font-size: 175%;
-}
-.ranking > div[id='7'] .title {
-    font-size: 165.45%;
-}
-.ranking > div[id='8'] .title {
-    font-size: 155.23%;
-}
-.ranking > div[id='9'] .title {
-    font-size: 144.77%;
-}
-.ranking > div[id='10'] .title {
-    font-size: 134.55%;
-}
-.ranking > div[id='11'] .title {
-    font-size: 125%;
-}
-.ranking > div[id='12'] .title {
-    font-size: 116.54%;
-}
-.ranking > div[id='13'] .title {
-    font-size: 109.55%;
-}
-.ranking > div[id='14'] .title {
-    font-size: 104.32%;
-}
-.ranking > div[id='15'] .title {
-    font-size: 101.09%;
-}
diff --git a/assets/css/ranking.less b/assets/css/ranking.less
index e2cb43b1199..f373f2a3926 100644
--- a/assets/css/ranking.less
+++ b/assets/css/ranking.less
@@ -1,5 +1,3 @@
-@import "inc/ranking fade.css" (min-width: 850px);
-
 .col3 {
   ins {
     margin: 0;
diff --git a/template/layout/ranking.twig b/template/layout/ranking.twig
index 0ce7eeccd15..0597e74be39 100644
--- a/template/layout/ranking.twig
+++ b/template/layout/ranking.twig
@@ -116,8 +116,8 @@
         <div{% if game.rank is defined %} id="{{ game.rank }}"{% endif %}>
             <div>
                 <a href="{{ steam.app_url(game.id) }}" {{ steam.video_attr(game.name, game.videos) }}>
-                    <img alt="Logo" data-src="//steamcdn-a.akamaihd.net/steam/apps/{{ game.id }}/capsule_
-                        {{- loop.index <= 14 ? '184x69.jpg' : 'sm_120.jpg' }}" class="lazy"
+                    <img alt="Logo" data-src="//steamcdn-a.akamaihd.net/steam/apps/{{ game.id }}/capsule_184x69.jpg"
+                        class="lazy"
                 ></a>
             </div>
             <div class="appline">