Menu responsiveness and layout

website/public/css/nhgooi.css

@@ -8,53 +8,87 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	color: #1F3977;
 }
 
-
 @media screen and (max-width:767px) {
+/*
+	.menu_container.sticky.move,
+	.boxed .menu_container.sticky.move
+	{
+		position: fixed;
+		top: 0pt;
+		left: 0px;
+		box-shadow: none;
+		-moz-box-shadow: none;
+		-webkit-box-shadow: none;
+	}
+
+	.sticky.move .mobile-menu-switch {
+		margin-left: 0px;
+	}
+
+	.sticky.move .mobile-menu {
+		background-color: #F0F0F0;
+	}
+*/
+
 	.row .column {
 		width: 100%;
 	}
 
-	.header .placeholder .controls li a {
+	.header .now-playing-header {
+		width: 100% !important;
+		margin-top: 30px !important;
+	}
+
+	.header .now-playing-header .controls li a {
 		width: 30px;
 	}
 
-		.header .placeholder .controls li a label {
+		.header .now-playing-header .controls li a label {
 			display: none;
 		}
 }
 
-.header .placeholder {
+.header .now-playing-header {
+	float: right;
+	font-size: 16pt;
+	font-family: 'Roboto Condensed';
+	font-weight: 300;
+	background: #F6F6F6;
+	width: 728px;
+	color: #787878;
+	text-align: center;
+
 	display: block;
 	position: relative;
 	margin: 0;
 	padding-top: 10px;
-	padding-bottom: 10px;
-	height: 90px;
+	padding-bottom: 30px;
 }
 
-	.header .placeholder .title,
-	.header .placeholder .artist {
-		overflow: hidden;
-		text-overflow: ellipsis;
-		white-space: nowrap;
+	.header .now-playing-header .title,
+	.header .now-playing-header .artist {
+	
+		padding: 3px;
 	}
 
-	.header .placeholder .title {
+	.header .now-playing-header .title {
 		font-weight: bold;
+		font-size: 120%;
 	}
 
-	.header .placeholder .controls {
+	.header .now-playing-header .controls {
 		font-size: 75%;
 		bottom: 0;
 		position: absolute;
+		padding: 3px;
 		width: 100%;
 	}
 
-	.header .placeholder .controls li {
+	.header .now-playing-header .controls li {
 		display: inline-block;
 	}
 
-		.header .placeholder .controls li a {
+		.header .now-playing-header .controls li a {
 			line-height: 120%;
 			font-size: 80%;
 			color: #ABABAB;
@@ -64,7 +98,7 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 			margin-right: 5px;
 		}
 
-			.header .placeholder .controls li a:hover {
+			.header .now-playing-header .controls li a:hover {
 				background-color: #E0E0E0;
 				transition: 500ms;
 			}
@@ -81,6 +115,21 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	margin-top: -2em;
 }
 
+.scroll_top_floater {
+	position: fixed;
+	right: 5px;
+	bottom: 30px;
+	display: block;
+	height: 30px;
+	width: 30px;
+	background: url("/images/icons/navigation/go_top_arrow.png") no-repeat 50% 50%;
+    background-color: #ABABAB;
+}
+
+.scroll_top_floater:hover {
+	background-color: #898989;
+}
+
 .tabs_navigation li a:hover,
 .tabs_navigation li a.selected,
 .tabs_navigation li.ui-tabs-active a {