3 files changed, 115 insertions, 3 deletions

diff --git a/sass/app.scss b/sass/app.scss
index f72203e..75074bd 100644
--- a/sass/app.scss
+++ b/sass/app.scss
@@ -38,6 +38,13 @@ div.notes {
 	margin-right: auto;
 }
 
+div.journey,
+div.nextstop {
+	max-width: 98%;
+	margin-left: auto;
+	margin-right: auto;
+}
+
 p {
 	text-align: justify;
 }
@@ -143,6 +150,9 @@ div.content {
 		background-color: $powercar-wagon-color;
 	}
 
+	.closed {
+		background-color: $closed-wagon-color;
+	}
 
 	.nondestwagon {
 		border-style: dashed;
@@ -155,13 +165,29 @@ div.content {
 		.type {
 			display: inline-block;
 			width: 5em;
-			color: $fg2;
+			color: $fg;
 		}
 
 		a.type {
 			color: $link-color;
 		}
 
+		.groupno {
+			color: $fg;
+		}
+
+		.grouptype {
+			color: $fg2;
+		}
+
+		.grouptype:before {
+			content: "(";
+		}
+
+		.grouptype:after {
+			content: ")";
+		}
+
 		.uicunknown {
 			color: $fg3;
 		}
@@ -192,7 +218,7 @@ div.content {
 			font-weight: bold;
 		}
 
-		.uic78::before {
+		.uic78:before {
 			content: "-";
 		}
 
@@ -210,7 +236,7 @@ div.content {
 			color: $fg3;
 		}
 
-		.uiccheck::before {
+		.uiccheck:before {
 			content: "-";
 		}
 	}
@@ -265,6 +291,9 @@ div.app {
 
 			&.cancelled {
 				background-color: $cancelled-bg-color;
+				.time {
+					color: $fg !important;
+				}
 			}
 
 			&.past {
@@ -363,6 +392,12 @@ div.app {
 				}
 			}
 
+			.load {
+				color: $fg;
+				font-weight: normal;
+				margin-right: 0.5em;
+			}
+
 			.platform {
 				background-color: transparent;
 				font-size: 3em;
@@ -393,6 +428,16 @@ div.app {
 					background-color: transparent;
 				}
 
+				&.a-bit-delayed {
+					color: $smalldelay-color;
+					background-color: transparent;
+				}
+
+				&.on-time {
+					color: $ontime-color;
+					background-color: transparent;
+				}
+
 				.no-realtime {
 					background-color: transparent;
 					padding-right: 1ex;
@@ -539,6 +584,14 @@ div.app {
 			a {
 				color: $fg;
 			}
+
+			.otherno {
+				color: $fg2;
+			}
+
+			.meta {
+				color: $fg1;
+			}
 		}
 
 		.departure {
@@ -615,6 +668,45 @@ div.app {
 				list-style-type: circle;
 			}
 
+			.time-early {
+				color: $early-stop-color;
+			}
+
+			.time-delayed {
+				color: $delayed-stop-color;
+			}
+
+			.time-sched-only {
+				color: $delayed-stop-color;
+			}
+
+			.time-sched-ontime {
+				color: $early-stop-color;
+			}
+
+
+			.annotation {
+				color: $fg2;
+				list-style-type: none;
+				padding-left: 3em;
+			}
+
+			.-sched:before {
+				content: " ";
+			}
+
+			.time-sched:after {
+				content: " ";
+			}
+
+			.time-sched-only:before {
+				content: "(";
+			}
+
+			.time-sched-only:after {
+				content: ")";
+			}
+
 			i.material-icons {
 				font-size: 14px;
 			}
@@ -913,6 +1005,10 @@ input[type="submit"]:active,
 	box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
 }
 
+.button-active {
+	font-weight: bold;
+}
+
 .button-light {
 	color: $fg1;
 	background-color: $bg;
@@ -928,6 +1024,10 @@ input[type="submit"]:active,
 	border-color: $button-hover-border;
 }
 
+div.backendlink {
+	margin-top: 1ex;
+}
+
 div.notes {
 	margin-top: 2em;
 }
diff --git a/sass/dark.scss b/sass/dark.scss
index 72a6927..78b61b0 100644
--- a/sass/dark.scss
+++ b/sass/dark.scss
@@ -32,18 +32,24 @@ $route-color: #dddddd;
 
 $info-color: #ff7777;
 $delay-color: #ff7777;
+$smalldelay-color: #dd9999;
 $undelay-color: #77ff77;
 $delaynorm-color: #dd9999;
 $undelaynorm-color: #99dd99;
+$ontime-color: #aaeeaa;
 
 $additional-stop-color: #77ff77;
 $cancelled-stop-color: #ff7777;
 
+$early-stop-color: #ccffcc;
+$delayed-stop-color: #ff9999;
+
 $cancelled-bg-color: #512f00;
 $past-bg-color: $bg05;
 
 $firstclass-wagon-color: #333300;
 $powercar-wagon-color: #222222;
+$closed-wagon-color: #222222;
 
 $button-hover: #111111;
 $button-hover-border: #333333;
diff --git a/sass/light.scss b/sass/light.scss
index 809c8ce..60981b1 100644
--- a/sass/light.scss
+++ b/sass/light.scss
@@ -32,18 +32,24 @@ $route-color: #444444;
 
 $info-color: #ff0000;
 $delay-color: #ff0000;
+$smalldelay-color: #bb3333;
 $undelay-color: #006600;
 $delaynorm-color: #bb3333;
 $undelaynorm-color: #338833;
+$ontime-color: #227722;
 
 $additional-stop-color: #009900;
 $cancelled-stop-color: #cc0000;
 
+$early-stop-color: #007700;
+$delayed-stop-color: #990000;
+
 $cancelled-bg-color: #ffe7d0;
 $past-bg-color: $bg05;
 
 $firstclass-wagon-color: #ffff99;
 $powercar-wagon-color: #cccccc;
+$closed-wagon-color: #dddddd;
 
 $button-hover: #e6e6e6;
 $button-hover-border: #adadad;