From a2da42877754775c79d1a16179009ef1aa3ea815 Mon Sep 17 00:00:00 2001
From: Ruud <ruud@crashdummy.nl>
Date: Wed, 11 Jun 2014 14:40:22 +0200
Subject: [PATCH] Chart css cleanup Tiny webkit scroll

---
 .../core/media/movie/charts/static/charts.css | 93 +++++++++++--------
 1 file changed, 55 insertions(+), 38 deletions(-)

diff --git a/couchpotato/core/media/movie/charts/static/charts.css b/couchpotato/core/media/movie/charts/static/charts.css
index 7ac372e2..e3f11fa4 100644
--- a/couchpotato/core/media/movie/charts/static/charts.css
+++ b/couchpotato/core/media/movie/charts/static/charts.css
@@ -3,26 +3,43 @@
 	margin-bottom: 30px;
 }
 
-.charts > h2 {
-	height: 40px;
-}
+    .charts ::-webkit-scrollbar {
+        width: 5px;
+        position: absolute;
+    }
 
-.charts .chart {
-	display: inline-block;
-	width: 50%;
-	vertical-align: top;
-    max-height: 510px;
-	overflow: hidden;
-    scrollbar-base-color: #4e5969;
-}
+    .charts ::-webkit-scrollbar-track {
+        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.4);
+        -webkit-border-radius: 5px;
+        border-radius: 5px;
+    }
 
-.charts .chart:hover {
-    overflow-y: auto;
-}
+    .charts ::-webkit-scrollbar-thumb {
+        -webkit-border-radius: 5px;
+        border-radius: 5px;
+        background: rgba(255,255,255,0.3);
+    }
 
-.charts .chart .media_result.hidden {
-    display: none;
-}
+    .charts > h2 {
+        height: 40px;
+    }
+
+    .charts .chart {
+        display: inline-block;
+        width: 50%;
+        vertical-align: top;
+        max-height: 510px;
+        overflow: hidden;
+        scrollbar-base-color: #4e5969;
+    }
+
+        .charts .chart:hover {
+            overflow-y: auto;
+        }
+
+    .charts .chart .media_result.hidden {
+        display: none;
+    }
 
 .charts .refresh {
 	clear:both;
@@ -36,30 +53,30 @@
 		text-align:center;
 	}
 
-	.charts .refresh a {
-		text-align: center;
-		padding: 0;
-		display: none;
-		width: 30px;
-		height: 30px;
-		position: absolute;
-		right: 10px;
-		top: -40px;
-		opacity: .7;
-	}
+        .charts .refresh a {
+            text-align: center;
+            padding: 0;
+            display: none;
+            width: 30px;
+            height: 30px;
+            position: absolute;
+            right: 10px;
+            top: -40px;
+            opacity: .7;
+        }
 
-	.charts .refresh a:hover {
-		opacity: 1;
-	}
+            .charts .refresh a:hover {
+                opacity: 1;
+            }
 
-.charts p.no_charts_enabled {
-	padding: 0.7em 1em;
-	display: none;
-}
+    .charts p.no_charts_enabled {
+         padding: 0.7em 1em;
+         display: none;
+     }
 
-.charts .chart h3 a {
-	color: #fff;
-}
+    .charts .chart h3 a {
+        color: #fff;
+    }
 
 
 .charts .chart .media_result {