diff --git a/html/template/rmo/layout/base.html b/html/template/rmo/layout/base.html
index a20babe3..ef719831 100644
--- a/html/template/rmo/layout/base.html
+++ b/html/template/rmo/layout/base.html
@@ -4,11 +4,8 @@
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<title>{{ template "title" . }} - Report Mosquitoes Online</title>
-		<!-- Bootstrap & Custom CSS -->
-		<link href="/static/css/bootstrap.css" rel="stylesheet" />
-		<!-- Bootstrap Icons -->
-		<link rel="stylesheet" href="/static/vendor/css/bootstrap-icons.min.css" />
 		<link rel="icon" href="/static/ico/favicon-rmo.ico" type="image/x-icon" />
+		<link href="{{ bundlePathCSS }}" rel="stylesheet" />
 		{{ block "extraheader" . }}{{ end }}
 		<script>
 			var tooltipByElementId = {};
@@ -39,6 +36,6 @@
 	<body>
 		{{ template "content" . }}
 		{{ template "rmo/component/footer.html" . }}
-		<script src="/static/vendor/js/bootstrap.bundle.min.js"></script>
+		<script src="{{ bundlePathJS }}" type="module"></script>
 	</body>
 </html>
diff --git a/html/template/rmo/nuisance.html b/html/template/rmo/nuisance.html
index bb7a1012..52401cc4 100644
--- a/html/template/rmo/nuisance.html
+++ b/html/template/rmo/nuisance.html
@@ -267,7 +267,7 @@
 			<!-- Mosquito Activity Section -->
 			<div class="form-section">
 				<div class="section-heading">
-					{{ template "mosquito-color.svg" }}
+					<i class="bi bi-mosquito-color"></i>
 					<h3>Mosquito Activity Information</h3>
 				</div>
 				<p class="mb-4">
diff --git a/html/template/rmo/root.html b/html/template/rmo/root.html
index 5729cde8..67bd995f 100644
--- a/html/template/rmo/root.html
+++ b/html/template/rmo/root.html
@@ -2,6 +2,12 @@
 
 {{ define "title" }}Main{{ end }}
 {{ define "extraheader" }}
+	<style>
+		.bi-large {
+			height: 48px;
+			width: 48px;
+		}
+	</style>
 {{ end }}
 {{ define "content" }}
 	<!-- Main Content -->
@@ -51,7 +57,7 @@
 						<div class="card service-card h-100">
 							<div class="card-body text-center">
 								<div class="mb-3">
-									{{ template "mosquito-color.svg" }}
+									<i class="bi bi-large bi-mosquito-color"></i>
 								</div>
 								<h4 class="card-title">Report Mosquito Nuisance</h4>
 								<p class="card-text">
@@ -68,7 +74,7 @@
 						<div class="card service-card h-100">
 							<div class="card-body text-center">
 								<div class="mb-3">
-									{{ template "pond-color.svg" }}
+									<i class="bi bi-large bi-pond-color"></i>
 								</div>
 								<h4 class="card-title">Report Standing Water</h4>
 								<p class="card-text">
@@ -85,7 +91,7 @@
 						<div class="card service-card h-100">
 							<div class="card-body text-center">
 								<div class="mb-3">
-									{{ template "check-report-color.svg" }}
+									<i class="bi bi-large bi-check-report-color"></i>
 								</div>
 								<h4 class="card-title">Follow-up or Check Status</h4>
 								<p class="card-text">
