Adding Queenstown bus ride + map legend

style/spot.scss

@@ -11,17 +11,53 @@
 	bottom:0;
 	width:70%;
 	background:#EEE;
-}
-
-#map .loader {
-	position:absolute;
-	font-size:3em;
-	width:1em;
-	height:1em;
-	top:calc(50% - 0.5em);
-	left:calc(50% - 0.5em);
-	color:#666;
-	@extend .flicker;
+	
+	.loader {
+		position:absolute;
+		font-size:3em;
+		width:1em;
+		height:1em;
+		top:calc(50% - 0.5em);
+		left:calc(50% - 0.5em);
+		color:#666;
+		@extend .flicker;
+	}
+	
+	#legend {
+		background:white;
+		font-family:Arial;
+		margin-top:-3em;
+		margin-left:2em;
+		background: rgba(255, 255, 255, 0.5);
+		font-family: Arial;
+		
+		.line {
+			display: inline-block;
+			border-left: 2em solid;
+			line-height: 2px;
+			padding-left: 0.5em;
+			margin: 1em;
+			font-size: 0.8em;
+			
+			&.green {
+				color:#00ff78;
+				border-color: #00ff78;
+			}
+			
+			&.blue {
+				color:#0000ff;
+				border-color: #0000ff;
+			}
+			&.red {
+				color:#FF7814;
+				border-color:#FF7814;
+			}
+			
+			+ .line {
+				margin-top: 1em;
+			}
+		}
+	}
 }
 
 #feed {