diff --git a/src/App.vue b/src/App.vue
index 1a76c3e..31277eb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -46,13 +46,13 @@ import packageInfo from '.././package.json';
 
 import { defineComponent } from 'vue';
 
-import InputsSection from './components/InputsSection.vue';
+import InputsSection from './components/sections/InputsSection.vue';
 
 import { useStore } from './store';
-import TrainImageSection from './components/TrainImageSection.vue';
-import LogoSection from './components/LogoSection.vue';
+import TrainImageSection from './components/sections/TrainImageSection.vue';
+import LogoSection from './components/sections/LogoSection.vue';
 import RealStockCard from './components/cards/RealStockCard.vue';
-import StockSection from './components/StockSection.vue';
+import StockSection from './components/sections/StockSection.vue';
 
 export default defineComponent({
   components: {
diff --git a/src/components/InputsSection.vue b/src/components/sections/InputsSection.vue
similarity index 95%
rename from src/components/InputsSection.vue
rename to src/components/sections/InputsSection.vue
index d1cda42..613c45a 100644
--- a/src/components/InputsSection.vue
+++ b/src/components/sections/InputsSection.vue
@@ -107,12 +107,12 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 
-import { IStock } from '../types';
-import imageMixin from '../mixins/imageMixin';
-import { useStore } from '../store';
-import { isLocomotive } from '../utils/vehicleUtils';
-import stockPreviewMixin from '../mixins/stockPreviewMixin';
-import stockMixin from '../mixins/stockMixin';
+import { IStock } from '../../types';
+import imageMixin from '../../mixins/imageMixin';
+import { useStore } from '../../store';
+import { isLocomotive } from '../../utils/vehicleUtils';
+import stockPreviewMixin from '../../mixins/stockPreviewMixin';
+import stockMixin from '../../mixins/stockMixin';
 
 interface ILocoType {
   id: string;
@@ -219,7 +219,7 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
-@import '../styles/global';
+@import '../../styles/global';
 
 .inputs-section {
   display: flex;
diff --git a/src/components/LogoSection.vue b/src/components/sections/LogoSection.vue
similarity index 100%
rename from src/components/LogoSection.vue
rename to src/components/sections/LogoSection.vue
diff --git a/src/components/StockSection.vue b/src/components/sections/StockSection.vue
similarity index 83%
rename from src/components/StockSection.vue
rename to src/components/sections/StockSection.vue
index 2fbb103..e192dce 100644
--- a/src/components/StockSection.vue
+++ b/src/components/sections/StockSection.vue
@@ -10,10 +10,10 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../store';
-import StockListTab from './StockListTab.vue';
-import StockGeneratorTab from './StockGeneratorTab.vue';
-import NumberGeneratorTab from './NumberGeneratorTab.vue';
+import { useStore } from '../../store';
+import StockListTab from '../tabs/StockListTab.vue';
+import StockGeneratorTab from '../tabs/StockGeneratorTab.vue';
+import NumberGeneratorTab from '../tabs/NumberGeneratorTab.vue';
 
 export default defineComponent({
   setup() {
diff --git a/src/components/TrainImageSection.vue b/src/components/sections/TrainImageSection.vue
similarity index 95%
rename from src/components/TrainImageSection.vue
rename to src/components/sections/TrainImageSection.vue
index 2384c20..9b3b118 100644
--- a/src/components/TrainImageSection.vue
+++ b/src/components/sections/TrainImageSection.vue
@@ -54,9 +54,9 @@
 
 <script lang="ts">
 import { computed, defineComponent } from 'vue';
-import { useStore } from '../store';
-import { isLocomotive } from '../utils/vehicleUtils';
-import { ILocomotive, Vehicle } from '../types';
+import { useStore } from '../../store';
+import { isLocomotive } from '../../utils/vehicleUtils';
+import { ILocomotive, Vehicle } from '../../types';
 
 export default defineComponent({
   setup() {
@@ -110,7 +110,7 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
-@import '../styles/global.scss';
+@import '../../styles/global.scss';
 
 .train-image-section {
   grid-row: 3;
diff --git a/src/components/NumberGeneratorTab.vue b/src/components/tabs/NumberGeneratorTab.vue
similarity index 95%
rename from src/components/NumberGeneratorTab.vue
rename to src/components/tabs/NumberGeneratorTab.vue
index 04200ed..e5ae362 100644
--- a/src/components/NumberGeneratorTab.vue
+++ b/src/components/tabs/NumberGeneratorTab.vue
@@ -36,9 +36,9 @@
 
 <script setup lang="ts">
 import { Ref, computed, ref } from 'vue';
-import { useStore } from '../store';
+import { useStore } from '../../store';
 
-import genData from '../constants/numberGeneratorData.json';
+import genData from '../../constants/numberGeneratorData.json';
 
 type RegionName = keyof typeof genData.regionNumbers;
 
@@ -89,8 +89,8 @@ const randomizeTrainNumber = () => {
 </script>
 
 <style lang="scss" scoped>
-@import '../styles/tab.scss';
-@import '../styles/global.scss';
+@import '../../styles/tab.scss';
+@import '../../styles/global.scss';
 
 .options {
   display: flex;
diff --git a/src/components/StockGeneratorTab.vue b/src/components/tabs/StockGeneratorTab.vue
similarity index 97%
rename from src/components/StockGeneratorTab.vue
rename to src/components/tabs/StockGeneratorTab.vue
index 98b46ba..bc37434 100644
--- a/src/components/StockGeneratorTab.vue
+++ b/src/components/tabs/StockGeneratorTab.vue
@@ -89,10 +89,10 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../store';
+import { useStore } from '../../store';
 
-import stockMixin from '../mixins/stockMixin';
-import { ICargo, ICarWagon } from '../types';
+import stockMixin from '../../mixins/stockMixin';
+import { ICargo, ICarWagon } from '../../types';
 
 export default defineComponent({
   name: 'stock-generator',
@@ -226,8 +226,8 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
-@import '../styles/global.scss';
-@import '../styles/tab.scss';
+@import '../../styles/global.scss';
+@import '../../styles/tab.scss';
 
 
 
diff --git a/src/components/StockListTab.vue b/src/components/tabs/StockListTab.vue
similarity index 97%
rename from src/components/StockListTab.vue
rename to src/components/tabs/StockListTab.vue
index 856dc56..7b7533f 100644
--- a/src/components/StockListTab.vue
+++ b/src/components/tabs/StockListTab.vue
@@ -159,15 +159,15 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import TrainImage from './TrainImageSection.vue';
+import TrainImage from '../sections/TrainImageSection.vue';
 
-import { useStore } from '../store';
-import warningsMixin from '../mixins/warningsMixin';
-import imageMixin from '../mixins/imageMixin';
-import stockPreviewMixin from '../mixins/stockPreviewMixin';
-import { IStock } from '../types';
-import StockThumbnails from './StockThumbnails.vue';
-import stockMixin from '../mixins/stockMixin';
+import { useStore } from '../../store';
+import warningsMixin from '../../mixins/warningsMixin';
+import imageMixin from '../../mixins/imageMixin';
+import stockPreviewMixin from '../../mixins/stockPreviewMixin';
+import { IStock } from '../../types';
+import StockThumbnails from '../utils/StockThumbnails.vue';
+import stockMixin from '../../mixins/stockMixin';
 
 export default defineComponent({
   name: 'stock-list',
@@ -407,7 +407,7 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
-@import '../styles/global';
+@import '../../styles/global';
 
 .warning {
   padding: 0.25em;
diff --git a/src/components/StockThumbnails.vue b/src/components/utils/StockThumbnails.vue
similarity index 97%
rename from src/components/StockThumbnails.vue
rename to src/components/utils/StockThumbnails.vue
index 1b6f411..2324a86 100644
--- a/src/components/StockThumbnails.vue
+++ b/src/components/utils/StockThumbnails.vue
@@ -29,8 +29,8 @@
 
 <script setup lang="ts">
 import { Ref, computed, nextTick, ref, watch } from 'vue';
-import { useStore } from '../store';
-import { IStock } from '../types';
+import { useStore } from '../../store';
+import { IStock } from '../../types';
 
 const store = useStore();
 const emit = defineEmits(['listItemClick', 'stockImageError']);