diff --git a/app.js b/app.js
index 7435eaf..d0365a8 100644
--- a/app.js
+++ b/app.js
@@ -1,2 +1,2 @@
-let config={version:"v0.1 dev",build:1,title:"Open Logistic Tycoon",include:{css:["game/resources/dist.min.css"]},modules:{square:!0},plugins:{sample:!1}};class Boot{constructor(e){console.log("Init Boot"),this.app=e,this.renderTitle(),this.includeCSS(),this.loader=new Loader}includeCSS(){var e,t=document.querySelector("head");for(e of config.include.css)t.innerHTML=t.innerHTML+`<style type="text/css" rel="stylesheet" src="${e}">`}renderTitle(){document.querySelector("title").innerHTML=config.title+" "+config.version}}let kernelInit=function(e){return this.boot=new Boot(e),this},app={};document.addEventListener("DOMContentLoaded",e=>{app.kernel=kernelInit()});class Loader{constructor(){console.log("Init Loader")}}
+class Game{constructor(){console.log("Init Game"),this.initMainMenu()}initMainMenu(){app.kernel.boot.renderer.addRenderFunc("Menu",()=>{var e=document.createElement("BUTTON");return e.classList.add("btn"),e.classList.add("btn-secondary"),e.innerHTML="New Game",e.addEventListener("click",e=>{alert("STARTING NEW GAME")}),{btn:e}}),app.kernel.boot.renderer.addRenderFunc("Menu",()=>{var e=document.createElement("BUTTON");return e.classList.add("btn"),e.classList.add("btn-secondary"),e.innerHTML="Load Game",e.addEventListener("click",e=>{alert("Loading GAME")}),{btn:e}}),app.kernel.boot.renderer.addRenderFunc("Menu",()=>{var e=document.createElement("BUTTON");return e.classList.add("btn"),e.classList.add("btn-secondary"),e.innerHTML="Settings",e.addEventListener("click",e=>{alert("OPEN SETTINGS")}),{btn:e}}),app.kernel.boot.renderer.addRenderFunc("Menu",()=>{var e=document.createElement("BUTTON");return e.classList.add("btn"),e.classList.add("btn-secondary"),e.innerHTML="Exit",e.addEventListener("click",e=>{alert("EXIT")}),{btn:e}}),app.kernel.boot.renderer.renderMenu()}}let config={version:"v0.1 dev",build:1,title:"Open Logistic Tycoon",include:{css:["https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css","game/resources/dist.min.css"]},modules:{square:!0},plugins:{sample:!1}};class Boot{constructor(){console.log("Init Boot"),this.renderTitle(),this.includeCSS(),this.loader=new Loader,this.renderer=new Renderer}includeCSS(){var e,n=document.querySelector("head");for(e of config.include.css)n.innerHTML=n.innerHTML+`<link type="text/css" rel="stylesheet" href="${e}">`}renderTitle(){document.querySelector("title").innerHTML=config.title+" "+config.version,document.querySelector("#ui .main-menu .game-title").innerHTML=`${config.title} <span class="version">${config.version}</span>`}}let kernelInit=function(){return this.boot=new Boot,this},app={};document.addEventListener("DOMContentLoaded",e=>{app.kernel=kernelInit(),app.game=app.kernel.boot.loader.loadGame()});class Loader{constructor(e){console.log("Init Loader"),this.app=e}loadGame(){return new Game(this.app)}}class Renderer{constructor(){this.rendererFuncs={UITab:[],Menu:[],GameField:[],Settings:[]}}addRenderFunc(e,n){this.rendererFuncs[e].push(n)}renderMenu(){var e,n=document.querySelector("#ui .main-menu").querySelector(".menu-list ul");n.innerHTML="";for(e of this.rendererFuncs.Menu){var t=e(),r=document.createElement("li");r.classList.add("menu-list-item"),r.appendChild(t.btn),n.appendChild(r)}}render(){}}
 //# sourceMappingURL=app.js.map
diff --git a/app.js.map b/app.js.map
index 321641d..15b0cbc 100644
--- a/app.js.map
+++ b/app.js.map
@@ -1 +1 @@
-{"version":3,"sources":["config.js","kernel/Boot.js","kernel/Loader.js"],"names":["config","version","build","title","include","css","modules","square","plugins","sample","Boot","constructor","app","console","log","this","renderTitle","includeCSS","loader","Loader","cssfile","head","document","querySelector","innerHTML","kernelInit","boot","addEventListener","e","kernel"],"mappings":"AAAA,IAAAA,OAAA,CACAC,QAAA,WACAC,MAAA,EACAC,MAAA,uBACAC,QAAA,CACAC,IAAA,CACA,8BAEA,EACAC,QAAA,CACAC,OAAA,CAAA,CACA,EACAC,QAAA,CACAC,OAAA,CAAA,CACA,CACA,QCfAC,KACAC,YAAAC,GACAC,QAAAC,IAAA,WAAA,EAEAC,KAAAH,IAAAA,EACAG,KAAAC,YAAA,EACAD,KAAAE,WAAA,EACAF,KAAAG,OAAA,IAAAC,MACA,CAEAF,aACA,IACAG,EADAC,EAAAC,SAAAC,cAAA,MAAA,EACA,IAAAH,KAAApB,OAAAI,QAAAC,IACAgB,EAAAG,UAAAH,EAAAG,0DAAAJ,KAEA,CAEAJ,cACAM,SAAAC,cAAA,OAAA,EAAAC,UAAAxB,OAAAG,MAAA,IAAAH,OAAAC,OACA,CACA,CAEA,IAAAwB,WAAA,SAAAb,GAGA,OAFAG,KAAAW,KAAA,IAAAhB,KAAAE,CAAA,EAEAG,IACA,EAEAH,IAAA,GAEAU,SAAAK,iBAAA,mBAAAC,IACAhB,IAAAiB,OAAAJ,WAAA,CACA,CAAA,QChCAN,OACAR,cACAE,QAAAC,IAAA,aAAA,CAGA,CACA","file":"app.js","sourcesContent":["const config = {\n\t\"version\": \"v0.1 dev\",\n\t\"build\": 1,\n\t\"title\": \"Open Logistic Tycoon\",\n\t\"include\": {\n\t\t\"css\": [\n\t\t\t\"game/resources/dist.min.css\"\n\t\t]\n\t},\n\t\"modules\": {\n\t\t\"square\": true\t\n\t},\n\t\"plugins\": {\n\t\t\"sample\": false\n\t}\n}","class Boot {\n\tconstructor(app) {\n\t\tconsole.log(\"Init Boot\");\n\n\t\tthis.app = app;\n\t\tthis.renderTitle();\n\t\tthis.includeCSS();\n\t\tthis.loader = new Loader();\n\t}\n\n\tincludeCSS() {\n\t\tconst head = document.querySelector('head');\n\t\tfor(let cssfile of config.include.css) {\n\t\t\thead.innerHTML = head.innerHTML + `<style type=\"text/css\" rel=\"stylesheet\" src=\"${cssfile}\">`;\n\t\t}\n\t}\n\n\trenderTitle() {\n\t\tdocument.querySelector('title').innerHTML = config.title + \" \" + config.version;\n\t}\n}\n\nconst kernelInit = (function(app){\n\tthis.boot = new Boot(app);\n\n\treturn this;\n});\n\nlet app = {};\n\ndocument.addEventListener(\"DOMContentLoaded\", e => {\n\tapp.kernel = kernelInit();\n});\n","class Loader {\n\tconstructor() {\n\t\tconsole.log(\"Init Loader\");\n\n\t\t\n\t}\n}"]}
\ No newline at end of file
+{"version":3,"sources":["Game.js","config.js","kernel/Boot.js","kernel/Loader.js","kernel/Renderer.js"],"names":["Game","constructor","console","log","this","initMainMenu","app","kernel","boot","renderer","addRenderFunc","btn","document","createElement","classList","add","innerHTML","addEventListener","e","alert","renderMenu","config","version","build","title","include","css","modules","square","plugins","sample","Boot","renderTitle","includeCSS","loader","Loader","Renderer","cssfile","head","querySelector","kernelInit","game","loadGame","rendererFuncs","UITab","Menu","GameField","Settings","type","func","push","item","menuList","renderedItemData","li","appendChild","render"],"mappings":"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","file":"app.js","sourcesContent":["class Game {\n\tconstructor() {\n\t\tconsole.log(\"Init Game\"); \n\t\tthis.initMainMenu();\n\t}\n\n\tinitMainMenu() {\n\t\tapp.kernel.boot.renderer.addRenderFunc(\"Menu\", () => {\n\t\t\tconst btn = document.createElement(\"BUTTON\");\n\t\t\tbtn.classList.add(\"btn\");\n\t\t\tbtn.classList.add(\"btn-secondary\");\n\t\t\tbtn.innerHTML = \"New Game\";\n\t\t\tbtn.addEventListener(\"click\", e => {\n\t\t\t\talert(\"STARTING NEW GAME\");\n\t\t\t});\n\n\t\t\treturn { btn: btn };\n\t\t});\n\n\t\tapp.kernel.boot.renderer.addRenderFunc(\"Menu\", () => {\n\t\t\tconst btn = document.createElement(\"BUTTON\");\n\t\t\tbtn.classList.add(\"btn\");\n\t\t\tbtn.classList.add(\"btn-secondary\");\n\t\t\tbtn.innerHTML = \"Load Game\";\n\t\t\tbtn.addEventListener(\"click\", e => {\n\t\t\t\talert(\"Loading GAME\");\n\t\t\t});\n\n\t\t\treturn { btn: btn };\n\t\t});\n\n\t\tapp.kernel.boot.renderer.addRenderFunc(\"Menu\", () => {\n\t\t\tconst btn = document.createElement(\"BUTTON\");\n\t\t\tbtn.classList.add(\"btn\");\n\t\t\tbtn.classList.add(\"btn-secondary\");\n\t\t\tbtn.innerHTML = \"Settings\";\n\t\t\tbtn.addEventListener(\"click\", e => {\n\t\t\t\talert(\"OPEN SETTINGS\");\n\t\t\t});\n\n\t\t\treturn { btn: btn };\n\t\t});\n\n\t\tapp.kernel.boot.renderer.addRenderFunc(\"Menu\", () => {\n\t\t\tconst btn = document.createElement(\"BUTTON\");\n\t\t\tbtn.classList.add(\"btn\");\n\t\t\tbtn.classList.add(\"btn-secondary\");\n\t\t\tbtn.innerHTML = \"Exit\";\n\t\t\tbtn.addEventListener(\"click\", e => {\n\t\t\t\talert(\"EXIT\");\n\t\t\t});\n\n\t\t\treturn { btn: btn };\n\t\t});\n\n\t\tapp.kernel.boot.renderer.renderMenu();\n\t}\n}","const config = {\n\t\"version\": \"v0.1 dev\",\n\t\"build\": 1,\n\t\"title\": \"Open Logistic Tycoon\",\n\t\"include\": {\n\t\t\"css\": [\n\t\t\t\"https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css\",\n\t\t\t\"game/resources/dist.min.css\"\n\t\t]\n\t},\n\t\"modules\": {\n\t\t\"square\": true\t\n\t},\n\t\"plugins\": {\n\t\t\"sample\": false\n\t}\n}","class Boot {\n\tconstructor() {\n\t\tconsole.log(\"Init Boot\");\n\n\t\tthis.renderTitle();\n\t\tthis.includeCSS();\n\t\tthis.loader = new Loader();\n\t\tthis.renderer = new Renderer();\n\t}\n\n\tincludeCSS() {\n\t\tconst head = document.querySelector('head');\n\t\tfor(let cssfile of config.include.css) {\n\t\t\thead.innerHTML = head.innerHTML + `<link type=\"text/css\" rel=\"stylesheet\" href=\"${cssfile}\">`;\n\t\t}\n\t}\n\n\trenderTitle() {\n\t\tdocument.querySelector('title').innerHTML = config.title + \" \" + config.version;\n\t\tdocument.querySelector(\"#ui .main-menu .game-title\").innerHTML = `${config.title} <span class=\"version\">${config.version}</span>`;\n\t}\n}\n\nconst kernelInit = (function(){\n\tthis.boot = new Boot();\n\n\treturn this;\n});\n\nlet app = {};\n\ndocument.addEventListener(\"DOMContentLoaded\", e => {\n\tapp.kernel = kernelInit();\n\tapp.game = app.kernel.boot.loader.loadGame();\n});\n","class Loader {\n\tconstructor(app) {\n\t\tconsole.log(\"Init Loader\");\n\n\t\tthis.app = app;\n\t}\n\n\tloadGame() {\n\t\treturn new Game(this.app);\n\t}\n}","class Renderer {\n\tconstructor() {\n\t\tthis.rendererFuncs = {\n\t\t\t\"UITab\": [],\n\t\t\t\"Menu\": [],\n\t\t\t\"GameField\": [],\n\t\t\t\"Settings\": []\n\t\t};\n\t}\n\n\taddRenderFunc(type, func) {\n\t\tthis.rendererFuncs[type].push(func);\n\t}\n\n\trenderMenu() {\n\t\tconst menuContainer = document.querySelector(\"#ui .main-menu\");\n\t\tconst menuList = menuContainer.querySelector(\".menu-list ul\");\n\t\tmenuList.innerHTML = \"\";\n\n\t\tfor(let item of this.rendererFuncs.Menu) {\n\t\t\tconst renderedItemData = item();\n\t\t\tlet li = document.createElement(\"li\");\n\t\t\tli.classList.add(\"menu-list-item\");\n\t\t\tli.appendChild(renderedItemData.btn);\n\t\t\tmenuList.appendChild(li);\n\t\t}\n\t}\n\n\trender() {\n\n\t}\n}"]}
\ No newline at end of file
diff --git a/engine/kernel/Boot.js b/engine/kernel/Boot.js
index f1e12ec..636c38a 100644
--- a/engine/kernel/Boot.js
+++ b/engine/kernel/Boot.js
@@ -1,27 +1,28 @@
 class Boot {
-	constructor(app) {
+	constructor() {
 		console.log("Init Boot");
 
-		this.app = app;
 		this.renderTitle();
 		this.includeCSS();
 		this.loader = new Loader();
+		this.renderer = new Renderer();
 	}
 
 	includeCSS() {
 		const head = document.querySelector('head');
 		for(let cssfile of config.include.css) {
-			head.innerHTML = head.innerHTML + `<style type="text/css" rel="stylesheet" src="${cssfile}">`;
+			head.innerHTML = head.innerHTML + `<link type="text/css" rel="stylesheet" href="${cssfile}">`;
 		}
 	}
 
 	renderTitle() {
 		document.querySelector('title').innerHTML = config.title + " " + config.version;
+		document.querySelector("#ui .main-menu .game-title").innerHTML = `${config.title} <span class="version">${config.version}</span>`;
 	}
 }
 
-const kernelInit = (function(app){
-	this.boot = new Boot(app);
+const kernelInit = (function(){
+	this.boot = new Boot();
 
 	return this;
 });
@@ -30,4 +31,5 @@
 
 document.addEventListener("DOMContentLoaded", e => {
 	app.kernel = kernelInit();
+	app.game = app.kernel.boot.loader.loadGame();
 });
diff --git a/engine/kernel/Loader.js b/engine/kernel/Loader.js
index 68f6b8f..e9af39a 100644
--- a/engine/kernel/Loader.js
+++ b/engine/kernel/Loader.js
@@ -1,7 +1,11 @@
 class Loader {
-	constructor() {
+	constructor(app) {
 		console.log("Init Loader");
 
-		
+		this.app = app;
+	}
+
+	loadGame() {
+		return new Game(this.app);
 	}
 }
\ No newline at end of file
diff --git a/engine/kernel/Renderer.js b/engine/kernel/Renderer.js
new file mode 100644
index 0000000..136f71e
--- /dev/null
+++ b/engine/kernel/Renderer.js
@@ -0,0 +1,32 @@
+class Renderer {
+	constructor() {
+		this.rendererFuncs = {
+			"UITab": [],
+			"Menu": [],
+			"GameField": [],
+			"Settings": []
+		};
+	}
+
+	addRenderFunc(type, func) {
+		this.rendererFuncs[type].push(func);
+	}
+
+	renderMenu() {
+		const menuContainer = document.querySelector("#ui .main-menu");
+		const menuList = menuContainer.querySelector(".menu-list ul");
+		menuList.innerHTML = "";
+
+		for(let item of this.rendererFuncs.Menu) {
+			const renderedItemData = item();
+			let li = document.createElement("li");
+			li.classList.add("menu-list-item");
+			li.appendChild(renderedItemData.btn);
+			menuList.appendChild(li);
+		}
+	}
+
+	render() {
+
+	}
+}
\ No newline at end of file
diff --git a/game/Game.js b/game/Game.js
new file mode 100644
index 0000000..1c49753
--- /dev/null
+++ b/game/Game.js
@@ -0,0 +1,58 @@
+class Game {
+	constructor() {
+		console.log("Init Game"); 
+		this.initMainMenu();
+	}
+
+	initMainMenu() {
+		app.kernel.boot.renderer.addRenderFunc("Menu", () => {
+			const btn = document.createElement("BUTTON");
+			btn.classList.add("btn");
+			btn.classList.add("btn-secondary");
+			btn.innerHTML = "New Game";
+			btn.addEventListener("click", e => {
+				alert("STARTING NEW GAME");
+			});
+
+			return { btn: btn };
+		});
+
+		app.kernel.boot.renderer.addRenderFunc("Menu", () => {
+			const btn = document.createElement("BUTTON");
+			btn.classList.add("btn");
+			btn.classList.add("btn-secondary");
+			btn.innerHTML = "Load Game";
+			btn.addEventListener("click", e => {
+				alert("Loading GAME");
+			});
+
+			return { btn: btn };
+		});
+
+		app.kernel.boot.renderer.addRenderFunc("Menu", () => {
+			const btn = document.createElement("BUTTON");
+			btn.classList.add("btn");
+			btn.classList.add("btn-secondary");
+			btn.innerHTML = "Settings";
+			btn.addEventListener("click", e => {
+				alert("OPEN SETTINGS");
+			});
+
+			return { btn: btn };
+		});
+
+		app.kernel.boot.renderer.addRenderFunc("Menu", () => {
+			const btn = document.createElement("BUTTON");
+			btn.classList.add("btn");
+			btn.classList.add("btn-secondary");
+			btn.innerHTML = "Exit";
+			btn.addEventListener("click", e => {
+				alert("EXIT");
+			});
+
+			return { btn: btn };
+		});
+
+		app.kernel.boot.renderer.renderMenu();
+	}
+}
\ No newline at end of file
diff --git a/game/config.js b/game/config.js
index ab2fe19..7a4e3f2 100644
--- a/game/config.js
+++ b/game/config.js
@@ -4,6 +4,7 @@
 	"title": "Open Logistic Tycoon",
 	"include": {
 		"css": [
+			"https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css",
 			"game/resources/dist.min.css"
 		]
 	},
diff --git a/game/resources/dist.min.css b/game/resources/dist.min.css
index 25bbf8f..78de313 100644
--- a/game/resources/dist.min.css
+++ b/game/resources/dist.min.css
@@ -1,2 +1,2 @@
-*{padding:0;margin:0;border:0;outline:0}
+*{padding:0;margin:0;border:0;outline:0}body{background-color:#111;color:#eee}#ui .main-menu{display:flex;flex-direction:column;justify-content:center;height:100vh;align-items:center;gap:80px}#ui .main-menu .game-title .version{font-size:.8em;color:#bbb}#ui .main-menu .menu-list ul{list-style-type:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:10px}#ui .main-menu .menu-list ul li{width:100%}
 /*# sourceMappingURL=dist.min.css.map */
diff --git a/game/resources/dist.min.css.map b/game/resources/dist.min.css.map
index ec6e4a0..d28b683 100644
--- a/game/resources/dist.min.css.map
+++ b/game/resources/dist.min.css.map
@@ -1 +1 @@
-{"version":3,"sources":["base.scss"],"names":[],"mappings":"AAAA,EACC,QAAA,EACA,OAAA,EACA,OAAA,EACA,QAAA","file":"dist.min.css","sourcesContent":["* {\n\tpadding: 0;\n\tmargin: 0;\n\tborder: 0;\n\toutline: none;\n}"]}
\ No newline at end of file
+{"version":3,"sources":["base.scss","vars.scss","main-menu.scss"],"names":[],"mappings":"AAAA,EACC,QAAA,EACA,OAAA,EACA,OAAA,EACA,QAAA,EAGD,KACC,iBCPW,KDQX,MCPkB,KCDlB,eACC,QAAA,KACA,eAAA,OACE,gBAAA,OACA,OAAA,MACA,YAAA,OACA,IAAA,KAGC,oCACC,UAAA,KACA,MDTW,KCcd,6BACC,gBAAA,KACA,QAAA,EACA,QAAA,KACA,eAAA,OACA,YAAA,OACA,IAAA,KAEA,gCACC,MAAA","file":"dist.min.css","sourcesContent":["* {\n\tpadding: 0;\n\tmargin: 0;\n\tborder: 0;\n\toutline: none;\n}\n\nbody {\n\tbackground-color: $bg-global;\n\tcolor: $txt-global-color;\n}","/* COLORS */\n$bg-global: #111;\n$txt-global-color: #eee;\n$txt-blur-color: #bbb;","#ui {\n\t.main-menu {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n    justify-content: center;\n    height: 100vh;\n    align-items: center;\n    gap: 80px;\n\n    .game-title {\n    \t.version {\n    \t\tfont-size: .8em;\n    \t\tcolor: $txt-blur-color;\n    \t}\n    }\n\t\t    \n\t\t.menu-list {\n\t\t\tul {\n\t\t\t\tlist-style-type: none;\n\t\t\t\tpadding: 0;\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 10px;\n\n\t\t\t\tli {\n\t\t\t\t\twidth: 100%;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n}"]}
\ No newline at end of file
diff --git a/game/resources/scss/base.scss b/game/resources/scss/base.scss
index fa7132d..e2eae5b 100644
--- a/game/resources/scss/base.scss
+++ b/game/resources/scss/base.scss
@@ -3,4 +3,9 @@
 	margin: 0;
 	border: 0;
 	outline: none;
+}
+
+body {
+	background-color: $bg-global;
+	color: $txt-global-color;
 }
\ No newline at end of file
diff --git a/game/resources/scss/game.scss b/game/resources/scss/game.scss
index 4873677..69dc049 100644
--- a/game/resources/scss/game.scss
+++ b/game/resources/scss/game.scss
@@ -1 +1,3 @@
-@import "base.scss"; 
\ No newline at end of file
+@import "vars.scss"; 
+@import "base.scss"; 
+@import "main-menu.scss";
\ No newline at end of file
diff --git a/game/resources/scss/main-menu.scss b/game/resources/scss/main-menu.scss
new file mode 100644
index 0000000..9befb87
--- /dev/null
+++ b/game/resources/scss/main-menu.scss
@@ -0,0 +1,33 @@
+#ui {
+	.main-menu {
+		display: flex;
+		flex-direction: column;
+    justify-content: center;
+    height: 100vh;
+    align-items: center;
+    gap: 80px;
+
+    .game-title {
+    	.version {
+    		font-size: .8em;
+    		color: $txt-blur-color;
+    	}
+    }
+		    
+		.menu-list {
+			ul {
+				list-style-type: none;
+				padding: 0;
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				gap: 10px;
+
+				li {
+					width: 100%;
+				}
+			}
+		}
+	}
+
+}
\ No newline at end of file
diff --git a/game/resources/scss/vars.scss b/game/resources/scss/vars.scss
new file mode 100644
index 0000000..f33db7c
--- /dev/null
+++ b/game/resources/scss/vars.scss
@@ -0,0 +1,4 @@
+/* COLORS */
+$bg-global: #111;
+$txt-global-color: #eee;
+$txt-blur-color: #bbb;
\ No newline at end of file
diff --git a/index.html b/index.html
index 969f73f..448a2bb 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,24 @@
 <body>
 	<div id="game">
 		<div id="game-field"></div>
-		<div id="ui"></div>
+		<div id="ui" class="container-fluid">
+			<div class="main-menu">
+				<h1 class="game-title"></h1>
+				<div class="menu-list">
+					<ul>
+						<!-- <li class="menu-list-item">
+							<button id="main-menu-item_name">title</button>
+						</li> -->
+					</ul>
+				</div>
+				<div class="menu-tabs">
+					<!-- <div class="menu-tab" id="menu-tab_sample">
+						<h3 class="tab-title"></h3>
+						<div class="tab-container"></div>
+					</div> -->
+				</div>
+			</div>
+		</div>
 	</div>
 
 	<script src="app.js"></script>