diff --git a/files/assets/css/main.css b/files/assets/css/main.css
index 73593600c..40647b739 100644
--- a/files/assets/css/main.css
+++ b/files/assets/css/main.css
@@ -7689,7 +7689,7 @@ thead {
 	min-width: 300px
 }
 
-#image-navigation {
+#imgnav {
 	border: 4px solid transparent;
 	color: black;
 	font-size: 35px;
@@ -7700,6 +7700,6 @@ thead {
 	text-decoration: none;
 }
 
-#image-navigation:hover {
+#imgnav:hover {
 	border: 4px solid var(--primary);
 }
diff --git a/files/assets/js/bottom.js b/files/assets/js/bottom.js
index 8c53d855d..f855fa75e 100644
--- a/files/assets/js/bottom.js
+++ b/files/assets/js/bottom.js
@@ -174,7 +174,7 @@ let all_images
 let position
 let num_of_images
 
-const imagenav_btn = document.getElementById('image-navigation')
+const imagenav_btn = document.getElementById('imgnav')
 
 document.addEventListener('keydown', (e) => {
 	if (['ArrowRight', 'd'].includes(e.key)  && imagenav_btn && !imagenav_btn.classList.contains('d-none')) {
@@ -189,7 +189,7 @@ document.addEventListener("click", function (e) {
 
 	if (!element) return
 
-	if (element.id == 'image-navigation') {
+	if (element.id == 'imgnav') {
 		expandImage(element.href)
 		position += 1
 		if (position < num_of_images) {
diff --git a/files/assets/js/core.js b/files/assets/js/core.js
index e8e9a68f6..64516ceda 100644
--- a/files/assets/js/core.js
+++ b/files/assets/js/core.js
@@ -189,7 +189,7 @@ function formkey() {
 const expandImageModal = document.getElementById('expandImageModal')
 
 function expandImage(url) {
-	document.getElementById('image-navigation').classList.add('d-none')
+	document.getElementById('imgnav').classList.add('d-none')
 
 	const e = this.event
 	if (e.ctrlKey || e.metaKey || e.shiftKey || e.altKey)
diff --git a/files/templates/modals/expanded_image.html b/files/templates/modals/expanded_image.html
index cfe9a98e0..6af55b797 100644
--- a/files/templates/modals/expanded_image.html
+++ b/files/templates/modals/expanded_image.html
@@ -4,7 +4,7 @@
 			<a rel="noopener" target="_blank" id="expanded-image-wrap-link">
 				<img loading="lazy" alt="expanded image" class="rounded" id="expanded-image">
 			</a>
-			<a id="image-navigation" class="fas fa-arrow-right px-5 py-4 px-md-4 py-md-5 d-none"></a>
+			<a id="imgnav" class="fas fa-arrow-right px-5 py-4 px-md-4 py-md-5 d-none"></a>
 		</div>
 	</div>
 </div>