diff --git a/src/common/ShareAddon/ShareAddon.js b/src/common/ShareAddon/ShareAddon.js
index 68766f7ae..13b816804 100644
--- a/src/common/ShareAddon/ShareAddon.js
+++ b/src/common/ShareAddon/ShareAddon.js
@@ -12,9 +12,9 @@ const renderUrl = (copyToClipboard, url) => {
     return (
         <div className={styles['url-container']}>
             <input className={styles['url']} defaultValue={url} readOnly={true} />
-            <span onClick={copyToClipboard} className={styles['copy-label']}>
+            <div onClick={copyToClipboard} className={styles['copy-label']}>
                 <Icon className={styles['copy-icon']} icon={'ic_link'} />Copy
-            </span>
+            </div>
         </div>
     );
 }
@@ -22,8 +22,6 @@ const renderUrl = (copyToClipboard, url) => {
 const ShareAddon = (props) => {
     const placeholderIconUrl = iconDataUrl({ icon: 'ic_x', fill: colors.neutrallight });
     const imageStyle = {
-        width: 10,
-        height: 10,
         backgroundImage: `url('${placeholderIconUrl}')`
     };
 
@@ -33,7 +31,7 @@ const ShareAddon = (props) => {
                 <div onClick={props.closeModalDialog} style={imageStyle} className={styles['x-icon']} />
             </div>
             <div className={styles['info-container']}>
-                <span className={styles['share-label']}>Share Add-on</span>
+                <div className={styles['share-label']}>Share Add-on</div>
                 <div className={styles['buttons']}>
                     <div onClick={props.shareInFacebook} className={styles['facebook-button']}>
                         <Icon className={styles['facebook-icon']} icon={'ic_facebook'} />FACEBOOK
diff --git a/src/common/ShareAddon/styles.less b/src/common/ShareAddon/styles.less
index df48ff5b4..de2416b0d 100644
--- a/src/common/ShareAddon/styles.less
+++ b/src/common/ShareAddon/styles.less
@@ -1,8 +1,62 @@
 @import 'stremio-colors';
 
+@share-addon-width: 380px;
+@spacing: floor((@share-addon-width * 0.06));
+
+.share-addon {
+    width: @share-addon-width;
+    padding: ceil((@spacing * 0.5));
+
+    .x-icon {
+        width: ceil((@spacing * 0.5));
+        height: ceil((@spacing * 0.5));
+    }
+
+    .info-container {
+        padding: floor((@spacing * 0.3)) ceil((@spacing * 0.9)) @spacing ceil((@spacing * 0.9));
+
+        .buttons {
+            padding: @spacing 0;
+        }
+
+        .facebook-button, .twitter-button, .gplus-button {
+            width: ceil((@share-addon-width * 0.26));
+            height: floor((@share-addon-width * 0.09));
+
+            .facebook-icon, .twitter-icon, .gplus-icon {
+                width: ceil((@spacing * 0.6));
+                height: ceil((@spacing * 0.6));
+                margin-right: floor((@spacing * 0.3));
+            }
+        }
+
+        .url-container {
+            border-radius: 4px;
+            border-width: 1px;
+
+            .url {
+                font-size: 12px;
+                border-radius: 4px;
+                padding: ceil((@spacing * 0.5));
+            }
+
+            .copy-label {
+                font-size: 14px;
+                border-top-right-radius: 3px;
+                border-bottom-right-radius: 3px;
+                padding: ceil((@spacing * 0.5));
+
+                .copy-icon {
+                    width: ceil((@spacing * 0.7));
+                    height: ceil((@spacing * 0.7));
+                    margin-right: floor((@spacing * 0.3));
+                }
+            }
+        }
+    }
+}
+
 .share-addon {
-    width: 380px;
-    padding: 10px;
     color: @colorwhite;
     background-color: @colorwhite;
 
@@ -17,87 +71,67 @@
         }
     }
 
-    .info-container {
-        padding: 6px 20px 30px 20px;
+    .share-label {
+        color: @colorblack;
+        font-weight: 500;
+    }
 
-        .share-label {
-            color: @colorblack;
-            font-weight: 600;
-        }
+    .buttons {
+        display: flex;
+        font-size: 11px;
+        justify-content: space-between;
 
-        .buttons {
+        .facebook-button, .twitter-button, .gplus-button {
             display: flex;
-            font-size: 11px;
-            margin: 22px 0px;
-            justify-content: space-between;
+            cursor: pointer;
+            align-items: center;
+            justify-content: center;
 
             .facebook-icon, .twitter-icon, .gplus-icon {
-                width: 14px;
-                height: 14px;
-                margin-right: 6px;
                 fill: @colorwhite;
             }
-
-            .facebook-button {
-                background-color: @colorfb;
-            }
-
-            .twitter-button {
-                background-color: @coloraccent;
-            }
-
-            .gplus-button {
-                background-color: #dd4b39;
-            }
-
-            .facebook-button, .twitter-button, .gplus-button {
-                display: flex;
-                cursor: pointer;
-                width: 100px;
-                height: 32px;
-                align-items: center;
-                justify-content: center;
-            }
         }
 
-        .url-container {
-            display: flex;
-            border-radius: 4px;
+        .facebook-button {
+            background-color: @colorfb;
+        }
+
+        .twitter-button {
+            background-color: @coloraccent;
+        }
+
+        .gplus-button {
+            background-color: #dd4b39;
+        }
+    }
+
+    .url-container {
+        display: flex;
+        border-style: solid;
+        border-color: @colorneutrallight;
+
+        .url, .copy-label {
+            color: @colorblack40;
+        }
+
+        .url {
+            width: 75%;
+            outline: none;
+            font-weight: 600;
             text-align: center;
-            border: 1px solid @colorneutrallight;
+            text-overflow: ellipsis;
+        }
 
-            .url, .copy-label {
-                padding: 10px;
-                font-weight: 600;
-                color: @colorblack40;
-            }
+        .copy-label {
+            cursor: pointer;
+            width: 25%;
+            font-weight: 500;
+            display: flex;
+            justify-content: center;
+            background-color: @colorblack20;
 
-            .url {
-                width: 90%;
-                outline: none;
-                font-size: 12px;
-                text-align: center;
-                border-radius: 4px;
-                padding-right: 30px;
-                text-overflow: ellipsis;
-            }
-
-            .copy-label {
-                width: 30%;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                cursor: pointer;
-                border-top-right-radius: 3px;
-                border-bottom-right-radius: 3px;
-                background-color: @colorblack20;
-
-                .copy-icon {
-                    width: 16px;
-                    height: 16px;
-                    margin-right: 4px;
-                    fill: @colorblack40;
-                }
+            .copy-icon {
+                fill: @colorblack40;
             }
         }
     }