diff --git a/public/css/NewAdminCSS.css b/public/css/NewAdminCSS.css
new file mode 100644
index 0000000..0dd82f7
--- /dev/null
+++ b/public/css/NewAdminCSS.css
@@ -0,0 +1,144 @@
+body {
+  background-color: #111;
+  min-width: 0px;
+}
+
+h1 {
+  font-size: 32px;
+  font-weight: 800;
+}
+h2 {
+  font-size: 26px;
+  font-weight: 800;
+}
+h3 {
+  font-size: 20px;
+  font-family: 600;
+}
+h4 {
+  font-size: 18px;
+  font-weight: 400;
+}
+h5 {
+  font-size: 16px;
+  font-weight: 400;
+}
+h6 {
+  font-size: 12px;
+  font-weight: 200;
+}
+
+#MasterContainer.AdminPanel.NewPanel {
+  background-color: #111;
+}
+#MasterContainer.NewPanel #BodyWrapper {
+  padding-top: 25px;
+  background-color: #111;
+  color: #fff;
+}
+.AdminPanel {
+  height: 100%;
+}
+#MasterContainer.NewPanel .iphone-sidebar, #MasterContainer.NewPanel .iphone-content, #MasterContainer #AdminWrapper, #MasterContainer #BodyWrapper {
+  display: none;
+}
+#MasterContainer.NewPanel #AdminWrapper, #MasterContainer.NewPanel #BodyWrapper {
+  display: block;
+}
+#AdminWrapper.Navigation {
+  width: 100%;
+  height: 100%;
+}
+.NewPanel .AdminHeader {
+  width: 100%;
+  height: 75px;
+  background-color: #333;
+  z-index: 2;
+  position: relative;
+}
+.NewPanel .AdminSubHeader {
+  width: 100%;
+  height: 25px;
+  background: linear-gradient(180deg, #333, #191919);
+  box-shadow: 0 2px 8px 0 #000;
+  z-index: 1;
+  position: relative;
+}
+.NewPanel .AdminSubHeader ul {
+  padding: 0;
+  margin: auto auto;
+  width: 970px;
+  height: 25px;
+}
+.NewPanel .AdminSubHeader li {
+  width: 33.334%;
+  text-align: center;
+  list-style: none;
+  float: left;
+  padding: 3px 0;
+  color: #fff;
+}
+.NewPanel .AdminSubHeader li a {
+  font-size: 14px;
+  color: #bbb;
+  transition: .1s all linear;
+}
+.NewPanel .AdminSubHeader li a:hover {
+  font-size: 14px;
+  color: #fff;
+  cursor: pointer;
+  box-shadow: 0 2px 0 0 #fff;
+  transition: .1s all linear;
+}
+.NewPanel .AdminHeader .Slogan {
+  font-size: 16px;
+  font-weight: 600;
+  display: block;
+  text-align: center;
+  cursor: default;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+.NewPanel .AdminHeader .SiteBrand {
+  width: 200px;
+  height: 40px;
+  padding: 5px;
+  background-image: url(../img/MORBLOXlogo.png);
+  background-repeat: no-repeat;
+  background-size: contain;
+  background-position: 0;
+  display: block;
+  margin: auto;
+}
+.AdminPanel #Body {
+  background-color: #111;
+}
+.AdminPanel .MainHeader {
+  text-align: center;
+}
+
+@media (max-width:1000px) {
+  .NewPanel .AdminSubHeader ul {
+    width: 750px;
+  }
+}
+@media (max-width:970px) {
+  #Body, #BodyWrapper {
+    width: 100% !important;
+    padding: 0;
+  }
+}
+@media (max-width:750px) {
+  .NewPanel .AdminSubHeader ul {
+    width: 400px;
+  }
+}
+@media (max-width:500px) {
+  .NewPanel .AdminSubHeader ul {
+    width: 300px;
+  }
+}
\ No newline at end of file
diff --git a/public/css/app.css b/public/css/app.css
index c312363..ef1e1d6 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -799,6 +799,31 @@ a,
   margin-left: auto;
 }
 
+#MasterContainer {
+  background: white;
+  overflow: visible;
+  width: 100%;
+}
+div#testingSitePanelWrapper, #BodyWrapper {
+  margin: 0 auto;
+  width: 970px;
+  background: white;
+}
+#Body {
+  _overflow: hidden;
+  min-height: 550px;
+  padding: 5px 5px 25px 5px;
+  background: white;
+  margin: 0 auto;
+  width: 900px;
+}
+
+.hidden {
+  visibility: hidden!important;
+  display: none!important;
+}
+
+/*Legacy*/
 .iphone-sidebar {
   position: fixed;
   color: rgb(255, 255, 255);
diff --git a/resources/views/admin/index.blade.php b/resources/views/admin/index.blade.php
index f85b1ac..6c45448 100644
--- a/resources/views/admin/index.blade.php
+++ b/resources/views/admin/index.blade.php
@@ -3,6 +3,15 @@
     <title>Admin | Dashboard - {{ env('APP_NAME') }}</title>
 @endsection
 
+@section('Body')
+<div id="Body" style="width: 970px;">
+<div class="Container">
+<h2 class="MainHeader">
+    Administration Area
+</h2>
+</div>
+</div>
+@endsection
 @section('content')
     <h1>{{ env('APP_NAME') }}</h1>
         <h5>Administration Area</h5><br>
diff --git a/resources/views/layouts/admin.blade.php b/resources/views/layouts/admin.blade.php
index 40398ad..57bc74c 100644
--- a/resources/views/layouts/admin.blade.php
+++ b/resources/views/layouts/admin.blade.php
@@ -17,13 +17,43 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}">
     <link href="{{ asset('css/app.css?id=e5Az527Gb1') }}" rel="stylesheet">
+    <link href="/css/NewAdminCSS.css" rel="stylesheet">
 </head>
 
 <body>
     @yield('alert')
 
-    <div class="MasterContainer" style="display:none;">
-    --(todo after school. | TersisWilvin 2022)
+    <div id="MasterContainer" class="AdminPanel" style="width: 100%;">
+    <div id="AdminWrapper" class="Navigation">
+        <div class="AdminHeader">
+            <span class="SiteBrand" href="{{ route('home') }}">
+            </span>
+            <a class="Slogan">
+                Admin Panel
+            </a>
+        </div>
+        <div class="AdminSubHeader">
+            <ul>
+            <li>
+                <a class="sub-menu" href="{{ route('admin_users') }}">
+                    User List
+                </a>
+            </li>
+            <li>
+                <a class="sub-menu" href="{{ route('admin_index') }}">
+                    Home
+                </a>
+            </li>
+            <li>
+                <a class="sub-menu" href="{{ route('admin_tree') }}">
+                    Invite Tree
+                </a>
+            </li>
+        </div>
+        </ul>
+    </div>
+    <div id="BodyWrapper">
+        @yield('Body')
     </div>
     <div class="iphone-sidebar">
         <img href="{{ route('admin_index') }}" src="https://archblox.com/img/MORBLOXlogo.png" width="50%">
@@ -41,6 +71,7 @@
     <div class="iphone-content">
         @yield('content')
     </div>
+    </div>
 </body>
 
 </html>