diff --git a/src/common/HorizontalNavBar/HorizontalNavBar.js b/src/common/HorizontalNavBar/HorizontalNavBar.js
index 85fecad3d..84bc8c2a1 100644
--- a/src/common/HorizontalNavBar/HorizontalNavBar.js
+++ b/src/common/HorizontalNavBar/HorizontalNavBar.js
@@ -29,6 +29,7 @@ const HorizontalNavBar = React.memo(({ className, backButton, searchBar, addonsB
                         className={styles['nav-tab-button']}
                         icon={'ic_back_ios'}
                         label={'Back'}
+                        direction={'horizontal'}
                         onClick={backButtonOnClick}
                     />
                     :
diff --git a/src/common/NavBar/NavTabButton/NavTabButton.js b/src/common/NavBar/NavTabButton/NavTabButton.js
index 7a525b868..e3809bf24 100644
--- a/src/common/NavBar/NavTabButton/NavTabButton.js
+++ b/src/common/NavBar/NavTabButton/NavTabButton.js
@@ -5,9 +5,9 @@ const Icon = require('stremio-icons/dom');
 const Button = require('stremio/common/Button');
 const styles = require('./styles');
 
-const NavTabButton = ({ className, icon, label, href, selected, onClick }) => {
+const NavTabButton = ({ className, icon, label, href, selected, direction, onClick }) => {
     return (
-        <Button className={classnames(className, styles['nav-tab-button-container'], { 'selected': selected })} title={label} tabIndex={-1} href={href} onClick={onClick}>
+        <Button className={classnames(className, styles['nav-tab-button-container'], styles[`nav-tab-button-${direction}`], { 'selected': selected })} title={label} tabIndex={-1} href={href} direction={direction} onClick={onClick}>
             {
                 typeof icon === 'string' && icon.length > 0 ?
                     <Icon className={styles['icon']} icon={icon} />
@@ -30,6 +30,7 @@ NavTabButton.propTypes = {
     label: PropTypes.string,
     href: PropTypes.string,
     selected: PropTypes.bool,
+    direction: PropTypes.oneOf(['horizontal', 'vertical']),
     onClick: PropTypes.func
 };
 
diff --git a/src/common/NavBar/NavTabButton/styles.less b/src/common/NavBar/NavTabButton/styles.less
index 6409caa36..89ce6c773 100644
--- a/src/common/NavBar/NavTabButton/styles.less
+++ b/src/common/NavBar/NavTabButton/styles.less
@@ -1,8 +1,6 @@
 .nav-tab-button-container {
     display: flex;
-    flex-direction: row;
     align-items: center;
-    padding: 0 1rem;
 
     &:hover {
         background-color: var(--color-secondary);
@@ -12,6 +10,31 @@
         background-color: var(--color-background);
     }
 
+    &.nav-tab-button-horizontal {
+        flex-direction: row;
+        padding: 0 1rem;
+
+        .label {
+            max-height: 2.4em;
+        }
+    }
+
+    &.nav-tab-button-vertical {
+        flex-direction: column;
+        justify-content: center;
+        height: var(--nav-bar-size);
+        padding: 0.5rem;
+
+        .icon {
+            margin: 0 0 0.5rem 0;
+        }
+
+        .label {
+            max-height: 1.2em;
+            font-size: 0.75rem;
+        }
+    }
+
     .icon {
         flex: none;
         width: 1.5rem;
@@ -26,7 +49,6 @@
 
     .label {
         flex: 1;
-        max-height: 2.4em;
         color: var(--color-surfacelighter);
     }
 }
\ No newline at end of file
diff --git a/src/common/VerticalNavBar/VerticalNavBar.js b/src/common/VerticalNavBar/VerticalNavBar.js
index c0c3b3306..06afe7a08 100644
--- a/src/common/VerticalNavBar/VerticalNavBar.js
+++ b/src/common/VerticalNavBar/VerticalNavBar.js
@@ -16,6 +16,7 @@ const VerticalNavBar = React.memo(({ className, tabs }) => {
                             href={href}
                             icon={icon}
                             label={label}
+                            direction={'vertical'}
                             onClick={onClick}
                         />
                     ))
diff --git a/src/common/VerticalNavBar/styles.less b/src/common/VerticalNavBar/styles.less
index 1ff897f4d..bcbfe94ec 100644
--- a/src/common/VerticalNavBar/styles.less
+++ b/src/common/VerticalNavBar/styles.less
@@ -9,21 +9,4 @@
     &::-webkit-scrollbar {
         display: none;
     }
-
-    .nav-tab-button {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        height: var(--nav-bar-size);
-        padding: 0.5rem;
-
-        > :first-child {
-            margin: 0 0 0.5rem 0;
-        }
-
-        > :last-child {
-            max-height: 1.2em;
-            font-size: 0.75rem;
-        }
-    }
 }
\ No newline at end of file