radar complete

server/styles/scss/_radar.scss

@@ -5,14 +5,97 @@
 	background-image: url('../images/BackGround4_1.png');
 
 	.header {
+		height: 83px;
+
 		.title.dual {
 			color: white;
 			font-family: 'Arial', sans-serif;
 			font-weight: bold;
 			font-size: 28pt;
+			left: 155px;
+
+			.top {
+				top: -4px;
+			}
 
 			.bottom {
-				top: 30px;
+				top: 31px;
+			}
+		}
+
+		.right {
+			position: absolute;
+			right: 0px;
+			width: 360px;
+			margin-top: 2px;
+			font-family: 'Star4000';
+			font-size: 18pt;
+			font-weight: bold;
+			@include u.text-shadow();
+			text-align: center;
+
+			.scale>div {
+				display: inline-block;
+			}
+
+			.scale-table {
+				display: table-row;
+				border-collapse: collapse;
+
+				.box {
+					display: table-cell;
+					border: 2px solid black;
+					width: 17px;
+					height: 24px;
+					padding: 0
+				}
+
+				.box-1 {
+					background-color: rgb(49, 210, 22);
+				}
+
+				.box-2 {
+					background-color: rgb(28, 138, 18);
+				}
+
+				.box-3 {
+					background-color: rgb(20, 90, 15);
+				}
+
+				.box-4 {
+					background-color: rgb(10, 40, 10);
+				}
+
+				.box-5 {
+					background-color: rgb(196, 179, 70);
+				}
+
+				.box-6 {
+					background-color: rgb(190, 72, 19);
+				}
+
+				.box-7 {
+					background-color: rgb(171, 14, 14);
+				}
+
+				.box-8 {
+					background-color: rgb(115, 31, 4);
+				}
+			}
+
+			.scale {
+				.text {
+					position: relative;
+					top: -5px;
+				}
+			}
+
+			.time {
+				position: relative;
+				font-weight: normal;
+				top: -14px;
+				font-family: 'Star4000 Small';
+				font-size: 24pt;
 			}
 		}
 	}
@@ -20,10 +103,9 @@
 
 .weather-display .main.radar {
 	overflow: hidden;
-
+	height: 367px;
 
 	.container {
-		margin-top: 21px;
 
 		.scroll-area {
 			position: relative;