diff --git a/src/assets/css/App.scss b/src/assets/css/App.scss
index a663530..54baf58 100644
--- a/src/assets/css/App.scss
+++ b/src/assets/css/App.scss
@@ -1,12 +1,6 @@
 @import "./generalites/typography.scss";
-@import "./components/CountrySelect.scss";
-@import "./components/Nav.scss";
-@import "./components/LanguageSelect.scss";
-@import "./components/Page-container.scss";
-@import "./components/DropdownSelect.scss";
 @import "./components/Score.scss";
 @import "./components/Timer.scss";
-@import "./components/Logo.scss";
 @import "./components/ExtraControls.scss";
 @import "./components/GameQuestion.scss";
 @import "./components/Titling.scss";
@@ -14,6 +8,14 @@
 @import "./components/Help.scss";
 @import "./components/GameAnswerExplanation.scss";
 @import "./components/Tutorials.scss";
+
+@import "./components/layout/Nav.scss";
+@import "./components/layout/Logo.scss";
+@import "./components/layout/Page-container.scss";
+
+@import "./components/ui/CountrySelect.scss";
+@import "./components/ui/LanguageSelect.scss";
+@import "./components/ui/DropdownSelect.scss";
 @import "./components/ui/Modal.scss";
 @import "./components/ui/Cta.scss";
 @import "./components/ui/AppLogo.scss";
diff --git a/src/assets/css/components/Nav.scss b/src/assets/css/components/Nav.scss
deleted file mode 100644
index 559a158..0000000
--- a/src/assets/css/components/Nav.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-nav.main-menu {
-	@apply bg-red-500 absolute top-0 py-3 w-full flex justify-between;
-	z-index: 2;
-}
diff --git a/src/assets/css/components/Logo.scss b/src/assets/css/components/layout/Logo.scss
similarity index 100%
rename from src/assets/css/components/Logo.scss
rename to src/assets/css/components/layout/Logo.scss
diff --git a/src/assets/css/components/layout/Nav.scss b/src/assets/css/components/layout/Nav.scss
new file mode 100644
index 0000000..ba40651
--- /dev/null
+++ b/src/assets/css/components/layout/Nav.scss
@@ -0,0 +1,4 @@
+nav.main-menu {
+	@apply absolute top-0 py-3 w-full flex justify-end;
+	z-index: 2;
+}
diff --git a/src/assets/css/components/Page-container.scss b/src/assets/css/components/layout/Page-container.scss
similarity index 88%
rename from src/assets/css/components/Page-container.scss
rename to src/assets/css/components/layout/Page-container.scss
index 4b74a48..aa774f2 100644
--- a/src/assets/css/components/Page-container.scss
+++ b/src/assets/css/components/layout/Page-container.scss
@@ -18,7 +18,7 @@
 
 		&__content {
 			@apply text-center pt-12 px-16 w-fit mx-auto h-auto overflow-visible relative;
-			background-image: url("../../img/mask.svg");
+			background-image: url("../../../img/mask.svg");
 			background-position: center;
 			background-size: cover;
 			// padding-bottom: -100px;
diff --git a/src/assets/css/components/CountrySelect.scss b/src/assets/css/components/ui/CountrySelect.scss
similarity index 89%
rename from src/assets/css/components/CountrySelect.scss
rename to src/assets/css/components/ui/CountrySelect.scss
index 5d43209..12f259a 100644
--- a/src/assets/css/components/CountrySelect.scss
+++ b/src/assets/css/components/ui/CountrySelect.scss
@@ -30,7 +30,7 @@
 			@apply block w-4 h-4  absolute right-5
 			bg-center bg-no-repeat bg-contain;
 			content: "";
-			background-image: url("../../img/select_deploy_icon.svg");
+			background-image: url("../../../img/select_deploy_icon.svg");
 		}
 		&:hover {
 			&:after {
diff --git a/src/assets/css/components/DropdownSelect.scss b/src/assets/css/components/ui/DropdownSelect.scss
similarity index 88%
rename from src/assets/css/components/DropdownSelect.scss
rename to src/assets/css/components/ui/DropdownSelect.scss
index 9ec9d0a..3227749 100644
--- a/src/assets/css/components/DropdownSelect.scss
+++ b/src/assets/css/components/ui/DropdownSelect.scss
@@ -20,7 +20,7 @@
 			@apply block w-4 h-4  absolute right-5
 			bg-center bg-no-repeat bg-contain;
 			content: "";
-			background-image: url("../../img/select_deploy_icon.svg");
+			background-image: url("../../../img/select_deploy_icon.svg");
 		}
 		&:hover {
 			&:after {
diff --git a/src/assets/css/components/LanguageSelect.scss b/src/assets/css/components/ui/LanguageSelect.scss
similarity index 87%
rename from src/assets/css/components/LanguageSelect.scss
rename to src/assets/css/components/ui/LanguageSelect.scss
index 2e94092..57b17b5 100644
--- a/src/assets/css/components/LanguageSelect.scss
+++ b/src/assets/css/components/ui/LanguageSelect.scss
@@ -1,7 +1,7 @@
 .language-select {
 	@apply relative flex flex-wrap gap-4;
 	@apply bg-transparent;
-	background-image: url("../../img/shapes-background/language-selector-background.svg");
+	background-image: url("../../../img/shapes-background/language-selector-background.svg");
 	background-size: 100% 100%;
 	background-repeat: no-repeat;
 	box-sizing: border-box;
@@ -47,7 +47,7 @@
 			@apply block w-4 h-4 absolute right-5
 			bg-center bg-no-repeat bg-contain;
 			content: "";
-			background-image: url("../../img/select_deploy_icon.svg");
+			background-image: url("../../../img/select_deploy_icon.svg");
 		}
 		&:hover {
 			&:after {