diff --git a/web/src/App.vue b/web/src/App.vue
index c7c8102..8615caf 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -45,7 +45,7 @@
 				If you are on one of those devices and you still see this message,
 				please contact "ghostwriter{at}resonym.com" with the following information:
 				<br><br>
-				{{ userAgent }}
+				{{ $store.getters.userAgent }}
 			</p>
 		</div>
 	</div>
@@ -76,14 +76,8 @@ export default {
 		gameState() {
 			return this.$store.state.view;
 		},
-		userAgent() {
-			if (navigator == null) {
-				return "Navigator Undefined";
-			};
-			return navigator.userAgent;
-		},
 		isMobile () {
-			return this.userAgent.match(/(Navigator Undefined)|iPhone|iPod|Android/) != null;
+			return this.$store.getters.userAgent.match(/(Navigator Undefined)|iPhone|iPod|Android/) != null;
 		},
 	},
 	methods: {
diff --git a/web/src/store/index.js b/web/src/store/index.js
index 590a946..b40c3c3 100644
--- a/web/src/store/index.js
+++ b/web/src/store/index.js
@@ -51,6 +51,15 @@ export default new Vuex.Store({
 			};
 			return ``;
 		},
+		userAgent() {
+			if (navigator == null) {
+				return "Navigator Undefined";
+			};
+			return navigator.userAgent;
+		},
+		isFirefox(state, getters) {
+			return getters.userAgent.match(/(Navigator Undefined)|Firefox/g) != null;
+		},
 	},
 	mutations: {
 		resetState(state) {
diff --git a/web/src/views/CreateJoin.vue b/web/src/views/CreateJoin.vue
index c60b667..bce6bad 100644
--- a/web/src/views/CreateJoin.vue
+++ b/web/src/views/CreateJoin.vue
@@ -9,6 +9,23 @@
 				>
 			</a>
 		</div>
+		<div
+			v-if="$store.getters.isFirefox"
+		>
+			<div
+				id="firefox-warning"
+				class="error-message"
+			>
+				<p class="centre">
+					<strong>WARNING:</strong>
+					<br>
+					It appears as though you are using the Firefox web browser,
+					please note that Firefox is not recommended for use with
+					this site. Especially while streaming. This is to have the
+					site look as good as possible.
+				</p>
+			</div>
+		</div>
 		<button
 			class="clickable"
 			@click.stop="createGame()"
@@ -174,4 +191,13 @@ button {
 }
 button:hover { background-color: var(--background2-darken); }
 button:focus { background-color: var(--background2-lighten); }
+
+.error-message {
+	border-color: #F00;
+	border-style: solid;
+	border-radius: 5px;
+	border-width: 2px;
+	margin: 0 auto;
+	width: 70%
+}
 </style>
\ No newline at end of file
diff --git a/web/src/views/Lobby.vue b/web/src/views/Lobby.vue
index d5cc05c..78055ce 100644
--- a/web/src/views/Lobby.vue
+++ b/web/src/views/Lobby.vue
@@ -30,6 +30,24 @@
 				@error="$emit(`error`, $event)"
 			/>
 		</div>
+		<div
+			class="flex-row"
+			v-if="$store.getters.isFirefox"
+		>
+			<div
+				id="firefox-warning"
+				class="error-message"
+			>
+				<p class="centre">
+					<strong>WARNING:</strong>
+					<br>
+					It appears as though you are using the Firefox web browser,
+					please note that Firefox is not recommended for use with
+					this site. Especially while streaming. This is to have the
+					site look as good as possible.
+				</p>
+			</div>
+		</div>
 		<div class="flex-row">
 			<button
 				class="clickable"
@@ -174,4 +192,13 @@ div.new-line {
 	width: 100% !important;
 	height: 0px;
 }
+
+.error-message {
+	border-color: #F00;
+	border-style: solid;
+	border-radius: 5px;
+	border-width: 2px;
+	margin-top: 10px;
+	width: 70%
+}
 </style>
\ No newline at end of file