diff --git a/src/lib/ldb/alert-bar.svelte b/src/lib/ldb/alert-bar.svelte
new file mode 100644
index 0000000..765111e
--- /dev/null
+++ b/src/lib/ldb/alert-bar.svelte
@@ -0,0 +1,112 @@
+<script>
+    import { fly } from "svelte/transition";
+
+    export let alerts = [];
+    $: uniqueAlerts = [...new Set(alerts)];
+
+    let displayAlerts = false;
+
+    async function alertsToggle() {
+        displayAlerts = !displayAlerts
+    }
+
+    function numberAsWord(number) {
+        const words = ['zero', 'one', 'two','three','four','five','six','seven','eight'];
+        let word = words[number];
+        if (word) {
+            return word;
+        }
+        return number;
+    }
+</script>
+
+<div id="block"><!--Prevent content slipping underneath the bar--></div>
+<div id="bar">
+    <img src="/images/navigation/alert.svg" alt="">
+    {#if uniqueAlerts.length == 1}
+      <p id="bartext">There is one active alert</p>
+    {:else if uniqueAlerts.length > 1}
+      <p id="bartext">There are {numberAsWord(uniqueAlerts.length)} active alerts</p>
+    {:else}
+      <p id="bartext">There are no active alerts</p>
+    {/if}
+    <button id="arrow" class:displayAlerts on:click={alertsToggle}>V</button>
+</div>
+{#if displayAlerts}
+    <div id="alerts" in:fly={{ y:-200, duration: 500}} out:fly={{ y: -200, duration: 800 }}>
+        {#each uniqueAlerts as msg}
+          <p class="alert">{@html msg}</p>
+        {/each}
+    </div>
+{/if}
+
+<style>
+    #block {
+        height: 40px;
+    }
+    #bar {
+        width: 100%;
+        height: 40px;
+        background-color: var(--main-alert-color);
+        opacity: 1;
+        position: fixed;
+        width: 100%;
+        top: 50px;
+        left: 0px;
+        z-index: 10;
+    }
+    img {
+        height: 25px;
+        width: 25px;
+        position: absolute;
+        left: 8px;
+        top: 8px;
+        margin: 0;
+        padding: 0;
+    }
+    #bartext {
+        color: white;
+        margin: auto;
+        font-weight: 600;
+        margin-top: 8px;
+        margin-bottom: 0px;
+        padding: 0px;
+    }
+    #arrow{
+        color: white;
+        font-family: Arial, Helvetica, sans-serif;
+        font-weight: 900;
+        position: absolute;
+        right: 15px;
+        top: 10px;
+        border: none;
+        background-color: transparent;
+        transition-duration: 500ms;
+    }
+    #arrow:focus {
+        background-color: transparent;
+    }
+    #alerts {
+        position: fixed;
+        background-color: var(--main-alert-color);
+        opacity: 0.9;
+        width: 100%;
+        max-height: 40%;
+        overflow-y: scroll;
+        left: 0;
+        top: 89px;
+    }
+    .alert {
+        color: white;
+        text-align: center;
+        width: 80%;
+        margin:auto;
+        padding-top: 10px;
+        padding-bottom: 10px;
+        font-weight: 600;
+    }
+    .displayAlerts {
+        transition-duration: 500ms;
+        transform: rotate(180deg);
+    }
+</style>
\ No newline at end of file
diff --git a/src/lib/ldb/public-ldb.svelte b/src/lib/ldb/public-ldb.svelte
index ac16b9b..2f84b39 100644
--- a/src/lib/ldb/public-ldb.svelte
+++ b/src/lib/ldb/public-ldb.svelte
@@ -4,6 +4,7 @@
   import { onMount } from 'svelte'
   import Loading from '$lib/navigation/loading.svelte';
 	import OverlayIsland from '$lib/islands/overlay-island.svelte';
+	import AlertBar from './alert-bar.svelte';
 
   let requestedStation;
   $: requestedStation = station;
@@ -15,6 +16,7 @@
   let dataAge = null;
   let isLoading = true;
   let dataExists = false;
+  let alerts = [];
   let serviceDetail;
 
   $: {
@@ -61,6 +63,7 @@
     } finally {
       isLoading = false; // Clear loading state
     }
+    prepareNrcc()
   }
 
   function parseTime(string){
@@ -123,6 +126,18 @@
     serviceDetail = null;
   }
 
+  async function prepareNrcc() {
+    if (jsonData?.GetStationBoardResult?.nrccMessages?.message) {
+      const nrcc = jsonData.GetStationBoardResult.nrccMessages.message;
+      if (Array.isArray(nrcc)) {
+        alerts = nrcc
+        return;
+      }
+      alerts.push(nrcc);
+      return;
+    }
+  }
+
   onMount(() => {
     if (requestedStation && jsonData === null) {
       fetchData();
@@ -130,6 +145,10 @@
   });
 </script>
 
+{#if alerts.length}
+  <AlertBar {alerts}/>
+{/if}
+
 {#if isLoading}
   <Loading />
 {:else}
diff --git a/src/lib/navigation/header.svelte b/src/lib/navigation/header.svelte
index 96369fa..0abb7d2 100644
--- a/src/lib/navigation/header.svelte
+++ b/src/lib/navigation/header.svelte
@@ -23,6 +23,7 @@
     margin: 0;
     padding: 0;
     height: 50px;
+    z-index: 20;
 }
 
 img {
diff --git a/static/images/navigation/alert.svg b/static/images/navigation/alert.svg
new file mode 100644
index 0000000..68b5777
--- /dev/null
+++ b/static/images/navigation/alert.svg
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg enable-background="new 0 0 448 433" version="1.1" viewBox="0 0 448 433" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://web.resource.org/cc/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+		<radialGradient id="a" cx="216.7" cy="393.79" r="296.7" gradientUnits="userSpaceOnUse">
+			<stop stop-color="#F4D708" offset="0"/>
+			<stop stop-color="#FCB400" offset="1"/>
+		</radialGradient>
+		<path d="m8.551 390.5 184.85-368.8s26.409-31.504 52.815 0c26.41 31.501 180.19 370.65 180.19 370.65s3.105 18.534-27.961 18.534-361.94 0-361.94 0-23.299 0-27.959-20.38z" fill="url(#a)"/>
+		<path d="m8.551 390.5 184.85-368.8s26.409-31.504 52.815 0c26.41 31.501 180.19 370.65 180.19 370.65s3.105 18.534-27.961 18.534-361.94 0-361.94 0-23.299 0-27.959-20.38z" fill="none" stroke="#E2A713" stroke-width="5"/>
+<path d="m212.5 292.63c-13.168-79.969-19.75-123.12-19.75-129.45 0-7.703 2.551-13.926 7.66-18.676 5.105-4.746 10.871-7.121 17.293-7.121 6.949 0 12.82 2.535 17.609 7.598s7.188 11.023 7.188 17.883c0 6.543-6.668 49.801-20 129.77h-10zm27 38.17c0 6.098-2.156 11.301-6.469 15.613-4.313 4.309-9.461 6.465-15.453 6.465-6.098 0-11.301-2.156-15.613-6.465-4.313-4.313-6.465-9.516-6.465-15.613 0-5.992 2.152-11.141 6.465-15.453s9.516-6.469 15.613-6.469c5.992 0 11.141 2.156 15.453 6.469s6.48 9.45 6.48 15.44z"/>
+<metadata><rdf:RDF><cc:Work><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><cc:license rdf:resource="http://creativecommons.org/licenses/publicdomain/"/><dc:publisher><cc:Agent rdf:about="http://openclipart.org/"><dc:title>Openclipart</dc:title></cc:Agent></dc:publisher><dc:title>Warning Notification</dc:title><dc:date>2007-02-08T17:08:47</dc:date><dc:description>Beveled yellow caution sign</dc:description><dc:source>http://openclipart.org/detail/3130/warning-notification-by-eastshores</dc:source><dc:creator><cc:Agent><dc:title>eastshores</dc:title></cc:Agent></dc:creator><dc:subject><rdf:Bag><rdf:li>alert</rdf:li><rdf:li>caution</rdf:li><rdf:li>clip art</rdf:li><rdf:li>clipart</rdf:li><rdf:li>icon</rdf:li><rdf:li>image</rdf:li><rdf:li>media</rdf:li><rdf:li>public domain</rdf:li><rdf:li>svg</rdf:li><rdf:li>warning</rdf:li></rdf:Bag></dc:subject></cc:Work><cc:License rdf:about="http://creativecommons.org/licenses/publicdomain/"><cc:permits rdf:resource="http://creativecommons.org/ns#Reproduction"/><cc:permits rdf:resource="http://creativecommons.org/ns#Distribution"/><cc:permits rdf:resource="http://creativecommons.org/ns#DerivativeWorks"/></cc:License></rdf:RDF></metadata></svg>