diff --git a/css/centered-box.css b/css/centered-box.css
index 68787c1..e0a5897 100644
--- a/css/centered-box.css
+++ b/css/centered-box.css
@@ -19,7 +19,7 @@
     			z-index var(--transition-speed);
 }
 
-#centeredBox.hiddenBox {
+.hiddenBox {
 	opacity: 0 !important;
 	z-index: 0 !important;
 }
\ No newline at end of file
diff --git a/js/centered-box.js b/js/centered-box.js
index 04877db..37797f0 100644
--- a/js/centered-box.js
+++ b/js/centered-box.js
@@ -1,6 +1,27 @@
 var centeredBox = document.getElementById("centeredBox");
 
-const toggleCenteredBox = () => {
-    centeredBox.classList.toggle('hiddenBox');
-    console.log('toggle center box');
+let centeredBoxVisibility = true;
+
+const showCenteredBox = () => {
+	centeredBox.classList.remove('hiddenBox');
+    centeredBoxVisibility = !centeredBoxVisibility;
 }
+
+const hideCenteredBox = () => {
+	centeredBox.classList.add('hiddenBox');
+    centeredBoxVisibility = !centeredBoxVisibility;
+}
+
+const toggleCenteredBox = () => {
+
+    if (centeredBoxVisibility) {
+    	// Hide web menu
+    	hideCenteredBox();  	
+
+    } else {
+    	// Show Web menu
+    	showCenteredBox();
+    }
+   
+	console.log('toggle web menu');
+}
\ No newline at end of file