update UGC logo

style/ugc.scss

@@ -7,7 +7,9 @@
 
 /* Variables */
 
-$poster_size:175px;
+$poster_size: 175px;
+$ugc_color: #08288B;
+$comp_color: #666;
 
 /* Default Tags */
 
@@ -26,11 +28,11 @@ a {
 	color:#222;
 }
 a:hover {
-	color:#08288B;
+	color: $ugc_color;
 }
 
 h1 {
-	color:#08288B;
+	color: $ugc_color;
 	margin:0 0 0.8em 0;
 }
 
@@ -42,7 +44,7 @@ h2 {
 select {
 	border:none;
 	background:transparent;
-	color:#666;
+	color: $comp_color;
 }
 
 /* Common Classes */
@@ -56,14 +58,14 @@ select {
 }
 
 .button {
-	background:#666;
+	background: $comp_color;
 	color:white;
 	padding:0.1em 0.4em;
 	border-radius:3px;
 	cursor: pointer;
 }
 .button:hover, .button.clicked {
-	background:#08288B;
+	background: $ugc_color;
 	color:white;
 }
 .button.square {
@@ -71,11 +73,11 @@ select {
 }
 .button.no_bg {
 	background:none;
-	color:#666;
+	color: $comp_color;
 }
 .button.no_bg:hover, .button.no_bg.clicked {
 	background:inherit;
-	color:#08288B;
+	color: $ugc_color;
 }
 
 /* Font Awesome Classes */
@@ -90,7 +92,7 @@ select {
 	content: "\f007";
 }
 .fa-spinner {
-	color:#08288B;
+	color: $ugc_color;
 	font-size:2em;
 }
 .fa-spinner:before {
@@ -161,7 +163,7 @@ header #nav #btn_settings {
 }
 
 header .title {
-	color:#08288B;
+	color: $ugc_color;
 	display:inline-block;
 	padding-left:113px;
 	background:url(../images/logo_ugc.png) 0 50% no-repeat;
@@ -176,14 +178,14 @@ header .title time {
 /* Section - Nav */
 
 nav a {
-	color: #08288B;
+	color: $ugc_color;
 	
-	&.hidden {
-    	color:#666;
+	&:hover, &.hidden {
+    	color: $comp_color;
     }
     
     &.hidden:hover {
-	    color: #08288B;
+	    color: $ugc_color;
     }
 }
 
@@ -319,7 +321,7 @@ main {
 footer {
 	font-size: 0.8em;
 	margin: 1em 0 0 0;
-	color:#08288B;
+	color: $ugc_color;
 }
 
 /* Section - Settings */
@@ -349,44 +351,44 @@ footer {
 	-moz-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
 	box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
 	z-index: 4;
-}
 
-#settings h1 {
-	position:relative;
-}
+	h1 {
+		position:relative;
+	
+		.button {
+			position:absolute;
+			right:0;
+		}
+	}
 
-#settings h1 .button {
-	position:absolute;
-	right:0;
-}
+	#buffer_settings {
+		text-align:center;
+		margin:2em auto;
+	}
 
-#settings #buffer_settings {
-	text-align:center;
-	margin:2em auto;
-}
+	ul.cinemas {
+		-webkit-column-count: 2;
+		-moz-column-count: 2;
+		column-count: 2;
+		list-style: none;
+		padding: 0;
+		margin: 0;
 
-#settings ul.cinemas {
-	-webkit-column-count: 2;
-	-moz-column-count: 2;
-	column-count: 2;
-	list-style: none;
-	padding:0;
-	margin:0;
-}
+		li {
+			cursor: pointer;
+			
+			&:hover, &.include {
+				font-weight: bold;
+			}
+		}
+	}
+	.switches {
+		margin-top: 1em;
+	}
 
-#settings ul.cinemas li {
-	cursor: pointer;
-}
-#settings ul.cinemas li.include {
-	font-weight: bold;
-}
-
-#settings .switches {
-	margin-top: 1em;
-}
-
-#settings .switches .fa-on + span {
-	font-weight: bold;
+	.switches .fa-on + span {
+		font-weight: bold;
+	}
 }
 
 /* Mobile Support */