diff --git a/resources/wwwroot/css/settings.css b/resources/wwwroot/css/settings.css
index 0759108..c1dc32c 100644
--- a/resources/wwwroot/css/settings.css
+++ b/resources/wwwroot/css/settings.css
@@ -1,67 +1,2 @@
 html,body{
-  background-image: url('../rsc/login2.jpg');
-  background-size: cover;
-  background-repeat: no-repeat;
-  height: 100%;
-  font-family: 'Numans', sans-serif;
-}
-
-
-.optionsarray{
-  margin-left: 20mm;
-  margin-top: 20mm;
-}
-
-.create-table{
-  background-color: rgba(0,0,0,0.5) !important;
-
-  position: fixed;
-  top: 10%;
-  left: 10%;
-  width: 80%;
-  height: 80%;
-
-  color: #FFFFFF;
-
-}
-
-.create-table-window-toolpane{
-  height: 50px;
-  background-color: rgba(0,0,0,0.5) !important;
-}
-
-.exit-icon{
-  color: #FF0000;
-  float: right;
-  cursor: pointer;
-  vertical-align: middle;
-  height: 100%;
-}
-
-.create-table-title{
-  text-align: center;
-  font-size: 120%;
-height: 100%;
-
-display: flex;
-flex-direction: column;
-justify-content: center;
-}
-
-.create-table-window-bottom{
-  bottom: 0;
-  height: 40px;
-  width: 100%;
-  background-color: rgba(1,0,0,0.3) !important;
-  position: absolute;
-}
-
-.create-table-window-content{
-    height: calc(100% - 90px);
-    overflow: auto;
-}
-
-.create-table-window-settings{
-  margin-left: 7%;
-  margin-top: 1%;
-}
+}
\ No newline at end of file
diff --git a/resources/wwwroot/js/settings.js b/resources/wwwroot/js/settings.js
index 3fd4bf7..684b2a9 100644
--- a/resources/wwwroot/js/settings.js
+++ b/resources/wwwroot/js/settings.js
@@ -55,4 +55,15 @@ $(document).ready(function () {
         }
 
     });
+
+
+    var date_input = $('input[name="date"]'); //our date input has the name "date"
+    var container = $('.bootstrap-iso form').length > 0 ? $('.bootstrap-iso form').parent() : "body";
+    var options = {
+        format: 'mm/dd/yyyy',
+        container: container,
+        todayHighlight: true,
+        autoclose: true,
+    };
+    date_input.datepicker(options);
 });
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/avatar.png b/resources/wwwroot/lib/AdminLTE/dist/img/avatar.png
deleted file mode 100644
index 309f882..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/avatar.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/avatar04.png b/resources/wwwroot/lib/AdminLTE/dist/img/avatar04.png
deleted file mode 100644
index 28e0340..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/avatar04.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/avatar2.png b/resources/wwwroot/lib/AdminLTE/dist/img/avatar2.png
deleted file mode 100644
index 9eaf548..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/avatar2.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/avatar3.png b/resources/wwwroot/lib/AdminLTE/dist/img/avatar3.png
deleted file mode 100644
index 9ca2b3e..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/avatar3.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/avatar5.png b/resources/wwwroot/lib/AdminLTE/dist/img/avatar5.png
deleted file mode 100644
index 49d4b92..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/avatar5.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.jpg
deleted file mode 100644
index e47586a..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.png b/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.png
deleted file mode 100644
index 2f9f1ad..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/boxed-bg.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/american-express.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/american-express.png
deleted file mode 100644
index 01f4741..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/american-express.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/cirrus.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/cirrus.png
deleted file mode 100644
index 9675627..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/cirrus.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/mastercard.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/mastercard.png
deleted file mode 100644
index 5a8beca..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/mastercard.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/mestro.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/mestro.png
deleted file mode 100644
index 8749b84..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/mestro.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal.png
deleted file mode 100644
index a8421ca..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal2.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal2.png
deleted file mode 100644
index 2ccdde9..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/paypal2.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/credit/visa.png b/resources/wwwroot/lib/AdminLTE/dist/img/credit/visa.png
deleted file mode 100644
index af20eff..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/credit/visa.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/default-150x150.png b/resources/wwwroot/lib/AdminLTE/dist/img/default-150x150.png
deleted file mode 100644
index 0f3fa06..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/default-150x150.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/icons.png b/resources/wwwroot/lib/AdminLTE/dist/img/icons.png
deleted file mode 100644
index 048c8d2..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/icons.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/photo1.png b/resources/wwwroot/lib/AdminLTE/dist/img/photo1.png
deleted file mode 100644
index 24bc2ed..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/photo1.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/photo2.png b/resources/wwwroot/lib/AdminLTE/dist/img/photo2.png
deleted file mode 100644
index 3071ee8..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/photo2.png and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/photo3.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/photo3.jpg
deleted file mode 100644
index 63daa81..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/photo3.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/photo4.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/photo4.jpg
deleted file mode 100644
index c700ef3..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/photo4.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/prod-1.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/prod-1.jpg
deleted file mode 100755
index 861c5f3..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/prod-1.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/prod-2.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/prod-2.jpg
deleted file mode 100755
index eae5a6e..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/prod-2.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/prod-3.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/prod-3.jpg
deleted file mode 100755
index f3d2332..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/prod-3.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/prod-4.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/prod-4.jpg
deleted file mode 100755
index 35caa2e..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/prod-4.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/prod-5.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/prod-5.jpg
deleted file mode 100755
index c03d7b6..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/prod-5.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user1-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user1-128x128.jpg
deleted file mode 100644
index b0ae99a..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user1-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user2-160x160.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user2-160x160.jpg
deleted file mode 100644
index aec74cb..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user2-160x160.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user3-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user3-128x128.jpg
deleted file mode 100644
index caf5f96..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user3-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user4-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user4-128x128.jpg
deleted file mode 100644
index eb8e2bb..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user4-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user5-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user5-128x128.jpg
deleted file mode 100644
index b637aad..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user5-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user6-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user6-128x128.jpg
deleted file mode 100644
index 3ac2468..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user6-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user7-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user7-128x128.jpg
deleted file mode 100644
index 97febc2..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user7-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/dist/img/user8-128x128.jpg b/resources/wwwroot/lib/AdminLTE/dist/img/user8-128x128.jpg
deleted file mode 100644
index 6e717b4..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/dist/img/user8-128x128.jpg and /dev/null differ
diff --git a/resources/wwwroot/lib/AdminLTE/plugins/daterangepicker/drp.png b/resources/wwwroot/lib/AdminLTE/plugins/daterangepicker/drp.png
deleted file mode 100644
index a76bdf3..0000000
Binary files a/resources/wwwroot/lib/AdminLTE/plugins/daterangepicker/drp.png and /dev/null differ
diff --git a/resources/wwwroot/myindex.html b/resources/wwwroot/myindex.html
index bb3f842..5fef421 100644
--- a/resources/wwwroot/myindex.html
+++ b/resources/wwwroot/myindex.html
@@ -1,886 +1,321 @@
 <!DOCTYPE html>
 <html>
 <head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>AdminLTE 3 | Dashboard</title>
-  <!-- Tell the browser to be responsive to screen width -->
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <!-- Font Awesome -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/fontawesome-free/css/all.min.css">
-  <!-- Ionicons -->
-  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
-  <!-- Tempusdominus Bbootstrap 4 -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
-  <!-- iCheck -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
-  <!-- JQVMap -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/jqvmap/jqvmap.min.css">
-  <!-- Theme style -->
-  <link rel="stylesheet" href="lib/AdminLTE/dist/css/adminlte.min.css">
-  <!-- overlayScrollbars -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
-  <!-- Daterange picker -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/daterangepicker/daterangepicker.css">
-  <!-- summernote -->
-  <link rel="stylesheet" href="lib/AdminLTE/plugins/summernote/summernote-bs4.css">
-  <!-- Google Font: Source Sans Pro -->
-  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>AdminLTE 3 | Dashboard</title>
+    <!-- Tell the browser to be responsive to screen width -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/fontawesome-free/css/all.min.css">
+    <!-- Ionicons -->
+    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
+    <!-- Tempusdominus Bbootstrap 4 -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
+    <!-- iCheck -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
+    <!-- JQVMap -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/jqvmap/jqvmap.min.css">
+    <!-- Theme style -->
+    <link rel="stylesheet" href="lib/AdminLTE/dist/css/adminlte.min.css">
+    <!-- overlayScrollbars -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
+    <!-- Daterange picker -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/daterangepicker/daterangepicker.css">
+    <!-- summernote -->
+    <link rel="stylesheet" href="lib/AdminLTE/plugins/summernote/summernote-bs4.css">
+    <!-- Google Font: Source Sans Pro -->
+    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
+
+    <!-- Bootstrap Date-Picker Plugin -->
+
+    <link rel="stylesheet"
+          href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
+
+    <link rel="stylesheet" type="text/css" href="css/settings.css">
+    <link rel="stylesheet" type="text/css" href="css/general.css">
 
-  <link rel="stylesheet" type="text/css" href="css/settings.css">
-  <link rel="stylesheet" type="text/css" href="css/general.css">
 
-  <script type="text/javascript" src="js/settings.js"></script>
 </head>
 <body class="hold-transition sidebar-mini layout-fixed">
 <div class="wrapper">
-
-  <!-- Navbar -->
-  <nav class="main-header navbar navbar-expand navbar-white navbar-light">
-    <!-- Left navbar links -->
-    <!-- <ul class="navbar-nav">
-      <li class="nav-item">
-        <a class="nav-link" data-widget="pushmenu" href="#"><i class="fas fa-bars"></i></a>
-      </li>
-      <li class="nav-item d-none d-sm-inline-block">
-        <a href="index3.html" class="nav-link">Home</a>
-      </li>
-      <li class="nav-item d-none d-sm-inline-block">
-        <a href="#" class="nav-link">Contact</a>
-      </li>
-    </ul> -->
-
-    <!-- SEARCH FORM -->
-    <!-- <form class="form-inline ml-3">
-      <div class="input-group input-group-sm">
-        <input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
-        <div class="input-group-append">
-          <button class="btn btn-navbar" type="submit">
-            <i class="fas fa-search"></i>
-          </button>
-        </div>
-      </div>
-    </form> -->
-
-    <!-- Right navbar links -->
-    <ul class="navbar-nav ml-auto">
-      <!-- Notifications Dropdown Menu -->
-      <li class="nav-item dropdown">
-        <a class="nav-link" data-toggle="dropdown" href="#">
-          <i class="far fa-bell"></i>
-          <span class="badge badge-warning navbar-badge">15</span>
+    <!-- Main Sidebar Container -->
+    <aside class="main-sidebar sidebar-dark-primary elevation-4">
+        <!-- Brand Logo -->
+        <a href="myindex.html" class="brand-link">
+            <img src="lib/AdminLTE/dist/img/AdminLTELogo.png" alt="AdminLTE Logo"
+                 class="brand-image img-circle elevation-3"
+                 style="opacity: .8">
+            <span class="brand-text font-weight-light">Waste Control</span>
         </a>
-        <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
-          <span class="dropdown-item dropdown-header">15 Notifications</span>
-          <div class="dropdown-divider"></div>
-          <a href="#" class="dropdown-item">
-            <i class="fas fa-envelope mr-2"></i> 4 new messages
-            <span class="float-right text-muted text-sm">3 mins</span>
-          </a>
-          <div class="dropdown-divider"></div>
-          <a href="#" class="dropdown-item">
-            <i class="fas fa-users mr-2"></i> 8 friend requests
-            <span class="float-right text-muted text-sm">12 hours</span>
-          </a>
-          <div class="dropdown-divider"></div>
-          <a href="#" class="dropdown-item">
-            <i class="fas fa-file mr-2"></i> 3 new reports
-            <span class="float-right text-muted text-sm">2 days</span>
-          </a>
-          <div class="dropdown-divider"></div>
-          <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>
-        </div>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#">
-          <i class="fas fa-th-large"></i>
-        </a>
-      </li>
-    </ul>
-  </nav>
-  <!-- /.navbar -->
 
-  <!-- Main Sidebar Container -->
-  <aside class="main-sidebar sidebar-dark-primary elevation-4">
-    <!-- Brand Logo -->
-    <a href="myindex.html" class="brand-link">
-      <img src="lib/AdminLTE/dist/img/AdminLTELogo.png" alt="AdminLTE Logo" class="brand-image img-circle elevation-3"
-           style="opacity: .8">
-      <span class="brand-text font-weight-light">Waste Control</span>
-    </a>
-
-    <!-- Sidebar -->
-    <div class="sidebar">
-      <!-- Sidebar user panel (optional) -->
-      <div class="user-panel mt-3 pb-3 mb-3 d-flex">
-        <div class="image">
-          <!-- <img src="lib/AdminLTE/dist/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image"> -->
-          <i class="nav-icon fas fa-user img-circle elevation-2" style="color:white"></i>
-        </div>
-        <!-- <i class="nav-icon fas fa-tachometer-alt"></i> -->
-        <div class="info">
-          <a href="#" class="d-block">Username to set!</a>
-        </div>
-      </div>
-
-      <!-- Sidebar Menu -->
-      <nav class="mt-2">
-        <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
-
-          <li class="nav-item">
-            <a href="#todo" class="nav-link">
-              <i class="nav-icon fas fa-cog"></i>
-              <p>
-                Settings
-              </p>
-            </a>
-          </li>
-
-          <li class="nav-item">
-            <a href="#todo" class="nav-link">
-              <i class="nav-icon fas fa-sign-out-alt"></i>
-              <p>
-                Logout
-              </p>
-            </a>
-          </li>
-
-          <li class="nav-item">
-            <a href="#todo" class="nav-link">
-              <i class="nav-icon fas fa-plus-circle"></i>
-              <p>
-                New Entry
-              </p>
-            </a>
-          </li>
-        </ul>
-      </nav>
-      <!-- /.sidebar-menu -->
-    </div>
-    <!-- /.sidebar -->
-  </aside>
-
-  <!-- Content Wrapper. Contains page content -->
-  <div class="content-wrapper">
-    <!-- Content Header (Page header) -->
-    <div class="content-header">
-      <div class="container-fluid">
-        <div class="row mb-2">
-          <div class="col-sm-6">
-            <h1 class="m-0 text-dark">Dashboard</h1>
-          </div><!-- /.col -->
-          <div class="col-sm-6">
-            <ol class="breadcrumb float-sm-right">
-              <li class="breadcrumb-item"><a href="#">Home</a></li>
-              <li class="breadcrumb-item active">Dashboard v1</li>
-            </ol>
-          </div><!-- /.col -->
-        </div><!-- /.row -->
-      </div><!-- /.container-fluid -->
-    </div>
-    <!-- /.content-header -->
-
-    <!-- Main content -->
-    <section class="content">
-      <div class="container-fluid">
-        <!-- Small boxes (Stat box) -->
-        <div class="row">
-          <div class="col-lg-3 col-6">
-            <!-- small box -->
-            <div class="small-box bg-info">
-              <div class="inner">
-                <h3>150</h3>
-
-                <p>Totale Abholungen</p>
-              </div>
-              <div class="icon">
-                <i class="ion ion-bag"></i>
-              </div>
-              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
+        <!-- Sidebar -->
+        <div class="sidebar">
+            <!-- Sidebar user panel (optional) -->
+            <div class="user-panel mt-3 pb-3 mb-3 d-flex">
+                <div class="image">
+                    <!-- <img src="lib/AdminLTE/dist/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image"> -->
+                    <i class="nav-icon fas fa-user img-circle elevation-2" style="color:white"></i>
+                </div>
+                <!-- <i class="nav-icon fas fa-tachometer-alt"></i> -->
+                <div class="info">
+                    <a href="#" class="d-block">Username to set!</a>
+                </div>
             </div>
-          </div>
-          <!-- ./col -->
-          <div class="col-lg-3 col-6">
-            <!-- small box -->
-            <div class="small-box bg-success">
-              <div class="inner">
-                <h3>53<sup style="font-size: 20px">%</sup></h3>
 
-                <p>Verbundene Clients</p>
-              </div>
-              <div class="icon">
-                <i class="ion ion-stats-bars"></i>
-              </div>
-              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
-            </div>
-          </div>
-          <!-- ./col -->
-          <div class="col-lg-3 col-6">
-            <!-- small box -->
-            <div class="small-box bg-warning">
-              <div class="inner">
-                <h3>44</h3>
+            <!-- Sidebar Menu -->
+            <nav class="mt-2">
+                <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
+                    data-accordion="false">
 
-                <p>Geplante Abholungen</p>
-              </div>
-              <div class="icon">
-                <i class="ion ion-person-add"></i>
-              </div>
-              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
-            </div>
-          </div>
-          <!-- ./col -->
-          <div class="col-lg-3 col-6">
-            <!-- small box -->
-            <div class="small-box bg-danger">
-              <div class="inner">
-                <h3>65</h3>
-
-                <p>Abgeschlossene Abholungen</p>
-              </div>
-              <div class="icon">
-                <i class="ion ion-pie-graph"></i>
-              </div>
-              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
-            </div>
-          </div>
-          <!-- ./col -->
-        </div>
-        <!-- /.row -->
-        <!-- Main row -->
-        <div class="row">
-          <!-- Left col -->
-          <section class="col-lg-7 connectedSortable">
-            <!-- Custom tabs (Charts with tabs)-->
-            <div class="card">
-              <div class="card-header">
-                <h3 class="card-title">
-                  <i class="fas fa-chart-pie mr-1"></i>
-                  Sales
-                </h3>
-                <div class="card-tools">
-                  <ul class="nav nav-pills ml-auto">
                     <li class="nav-item">
-                      <a class="nav-link active" href="#revenue-chart" data-toggle="tab">Area</a>
+                        <a href="#todo" class="nav-link">
+                            <i class="nav-icon fas fa-cog"></i>
+                            <p>
+                                Settings
+                            </p>
+                        </a>
                     </li>
+
                     <li class="nav-item">
-                      <a class="nav-link" href="#sales-chart" data-toggle="tab">Donut</a>
+                        <a href="#todo" class="nav-link">
+                            <i class="nav-icon fas fa-sign-out-alt"></i>
+                            <p>
+                                Logout
+                            </p>
+                        </a>
                     </li>
-                  </ul>
-                </div>
-              </div><!-- /.card-header -->
-              <div class="card-body">
-                <div class="tab-content p-0">
-                  <!-- Morris chart - Sales -->
-                  <div class="chart tab-pane active" id="revenue-chart"
-                       style="position: relative; height: 300px;">
-                      <canvas id="revenue-chart-canvas" height="300" style="height: 300px;"></canvas>
-                   </div>
-                  <div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;">
-                    <canvas id="sales-chart-canvas" height="300" style="height: 300px;"></canvas>
-                  </div>
-                </div>
-              </div><!-- /.card-body -->
-            </div>
-            <!-- /.card -->
 
-
-
-
-
-
-
-
-              <!-- Custom tabs (Charts with tabs)-->
-              <div class="card">
-                <div class="card-header">
-                  <h3 class="card-title">
-                    <i class="fas fa-chart-pie mr-1"></i>
-                    Create new Date
-                  </h3>
-                </div><!-- /.card-header -->
-                <div class="card-body">
-                  <form>
-                    <h4>General options:</h4>
-                    <div class="custom-control custom-switch">
-                        <input type="checkbox" class="custom-control-input" id="customSwitch1">
-                        <label class="custom-control-label" for="customSwitch1">Notify Led-Board</label>
-                    </div>
-                    <div class="form-group" style="margin-top: 15px; width: 30%;">
-                      <label for="exampleInputEmail1">Table Name</label>
-                      <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter Table Name">
-                      <small id="emailHelp" class="form-text text-muted">Please try to use no special characters</small>
-                    </div>
-                    <div class="form-group" style="width: 30%;">
-                      <label for="exampleInputEmail1">City/Village name</label>
-                      <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter City name here">
-                      <small id="emailHelp" class="form-text text-muted">Please try to use no special characters</small>
-                    </div>
-
-                    <h4>Add Data:</h4>
-                    <div class="input-group mt-3 mb-3" style="width: 50%;">
-                     <div class="input-group-prepend">
-                       <button id="dropdown-wastetype"  type="button" class="btn btn-outline-light dropdown-toggle" data-toggle="dropdown">
-                         Select waste type
-                       </button>
-                       <div class="dropdown-menu">
-                         <a class="dropdown-item" href="#">Plastic</a>
-                         <a class="dropdown-item" href="#">Metal</a>
-                         <a class="dropdown-item" href="#">residual waste</a>
-                         <a class="dropdown-item" href="#">biowaste</a>
-                       </div>
-                     </div>
-
-                     <input id="input-wastetime" style="width: 50px;" class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/>
-
-                       <script>
-                          $(document).ready(function(){
-                            var date_input=$('input[name="date"]'); //our date input has the name "date"
-                            var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
-                            var options={
-                              format: 'mm/dd/yyyy',
-                              container: container,
-                              todayHighlight: true,
-                              autoclose: true,
-                            };
-                            date_input.datepicker(options);
-                          })
-                      </script>
-
-                     <input id="input-wasteregion" type="text" class="form-control" placeholder="Region">
-                     <input id="input-wastezone" type="text" class="form-control" placeholder="Zone">
-                     <button type="button" class="btn-addtolist btn btn-success" style="float:right;">Add to list</button>
-                    </div>
-
-                    <h4>Your Data:</h4>
-                    <table class="table table-dark table-hover" style="width: 50%;">
-                      <thead>
-                        <tr>
-                          <th>Waste type</th>
-                          <th>Date</th>
-                          <th>Region</th>
-                          <th>Zone</th>
-                        </tr>
-                      </thead>
-                      <tbody id="addtable-body">
-                      </tbody>
-                    </table>
-                  </form>
-                  <div class="create-table-window-bottom">
-                      <button id="btn-savelist" type="button" class="btn btn-success" style="float:right;">Save</button>
-                  </div>
-                </div><!-- /.card-body -->
-              </div>
-
-
-
-
-
-
-
-
-
-
-            <!-- DIRECT CHAT -->
-            <div class="card direct-chat direct-chat-primary">
-              <div class="card-header">
-                <h3 class="card-title">Direct Chat</h3>
-
-                <div class="card-tools">
-                  <span data-toggle="tooltip" title="3 New Messages" class="badge badge-primary">3</span>
-                  <button type="button" class="btn btn-tool" data-card-widget="collapse">
-                    <i class="fas fa-minus"></i>
-                  </button>
-                  <button type="button" class="btn btn-tool" data-toggle="tooltip" title="Contacts"
-                          data-widget="chat-pane-toggle">
-                    <i class="fas fa-comments"></i>
-                  </button>
-                  <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-times"></i>
-                  </button>
-                </div>
-              </div>
-              <!-- /.card-header -->
-              <div class="card-body">
-                <!-- Conversations are loaded here -->
-                <div class="direct-chat-messages">
-                  <!-- Message. Default to the left -->
-                  <div class="direct-chat-msg">
-                    <div class="direct-chat-infos clearfix">
-                      <span class="direct-chat-name float-left">Alexander Pierce</span>
-                      <span class="direct-chat-timestamp float-right">23 Jan 2:00 pm</span>
-                    </div>
-                    <!-- /.direct-chat-infos -->
-                    <img class="direct-chat-img" src="lib/AdminLTE/dist/img/user1-128x128.jpg" alt="message user image">
-                    <!-- /.direct-chat-img -->
-                    <div class="direct-chat-text">
-                      Is this template really for free? That's unbelievable!
-                    </div>
-                    <!-- /.direct-chat-text -->
-                  </div>
-                  <!-- /.direct-chat-msg -->
-
-                  <!-- Message to the right -->
-                  <div class="direct-chat-msg right">
-                    <div class="direct-chat-infos clearfix">
-                      <span class="direct-chat-name float-right">Sarah Bullock</span>
-                      <span class="direct-chat-timestamp float-left">23 Jan 2:05 pm</span>
-                    </div>
-                    <!-- /.direct-chat-infos -->
-                    <img class="direct-chat-img" src="lib/AdminLTE/dist/img/user3-128x128.jpg" alt="message user image">
-                    <!-- /.direct-chat-img -->
-                    <div class="direct-chat-text">
-                      You better believe it!
-                    </div>
-                    <!-- /.direct-chat-text -->
-                  </div>
-                  <!-- /.direct-chat-msg -->
-
-                  <!-- Message. Default to the left -->
-                  <div class="direct-chat-msg">
-                    <div class="direct-chat-infos clearfix">
-                      <span class="direct-chat-name float-left">Alexander Pierce</span>
-                      <span class="direct-chat-timestamp float-right">23 Jan 5:37 pm</span>
-                    </div>
-                    <!-- /.direct-chat-infos -->
-                    <img class="direct-chat-img" src="lib/AdminLTE/dist/img/user1-128x128.jpg" alt="message user image">
-                    <!-- /.direct-chat-img -->
-                    <div class="direct-chat-text">
-                      Working with AdminLTE on a great new app! Wanna join?
-                    </div>
-                    <!-- /.direct-chat-text -->
-                  </div>
-                  <!-- /.direct-chat-msg -->
-
-                  <!-- Message to the right -->
-                  <div class="direct-chat-msg right">
-                    <div class="direct-chat-infos clearfix">
-                      <span class="direct-chat-name float-right">Sarah Bullock</span>
-                      <span class="direct-chat-timestamp float-left">23 Jan 6:10 pm</span>
-                    </div>
-                    <!-- /.direct-chat-infos -->
-                    <img class="direct-chat-img" src="lib/AdminLTE/dist/img/user3-128x128.jpg" alt="message user image">
-                    <!-- /.direct-chat-img -->
-                    <div class="direct-chat-text">
-                      I would love to.
-                    </div>
-                    <!-- /.direct-chat-text -->
-                  </div>
-                  <!-- /.direct-chat-msg -->
-
-                </div>
-                <!--/.direct-chat-messages-->
-
-                <!-- Contacts are loaded here -->
-                <div class="direct-chat-contacts">
-                  <ul class="contacts-list">
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user1-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            Count Dracula
-                            <small class="contacts-list-date float-right">2/28/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">How have you been? I was...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
+                    <li class="nav-item">
+                        <a href="#todo" class="nav-link">
+                            <i class="nav-icon fas fa-plus-circle"></i>
+                            <p>
+                                New Entry
+                            </p>
+                        </a>
                     </li>
-                    <!-- End Contact Item -->
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user7-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            Sarah Doe
-                            <small class="contacts-list-date float-right">2/23/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">I will be waiting for...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
-                    </li>
-                    <!-- End Contact Item -->
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user3-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            Nadia Jolie
-                            <small class="contacts-list-date float-right">2/20/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">I'll call you back at...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
-                    </li>
-                    <!-- End Contact Item -->
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user5-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            Nora S. Vans
-                            <small class="contacts-list-date float-right">2/10/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">Where is your new...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
-                    </li>
-                    <!-- End Contact Item -->
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user6-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            John K.
-                            <small class="contacts-list-date float-right">1/27/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">Can I take a look at...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
-                    </li>
-                    <!-- End Contact Item -->
-                    <li>
-                      <a href="#">
-                        <img class="contacts-list-img" src="lib/AdminLTE/dist/img/user8-128x128.jpg">
-
-                        <div class="contacts-list-info">
-                          <span class="contacts-list-name">
-                            Kenneth M.
-                            <small class="contacts-list-date float-right">1/4/2015</small>
-                          </span>
-                          <span class="contacts-list-msg">Never mind I found...</span>
-                        </div>
-                        <!-- /.contacts-list-info -->
-                      </a>
-                    </li>
-                    <!-- End Contact Item -->
-                  </ul>
-                  <!-- /.contacts-list -->
-                </div>
-                <!-- /.direct-chat-pane -->
-              </div>
-              <!-- /.card-body -->
-              <div class="card-footer">
-                <form action="#" method="post">
-                  <div class="input-group">
-                    <input type="text" name="message" placeholder="Type Message ..." class="form-control">
-                    <span class="input-group-append">
-                      <button type="button" class="btn btn-primary">Send</button>
-                    </span>
-                  </div>
-                </form>
-              </div>
-              <!-- /.card-footer-->
-            </div>
-            <!--/.direct-chat -->
-
-            <!-- TO DO List -->
-            <div class="card">
-              <div class="card-header">
-                <h3 class="card-title">
-                  <i class="ion ion-clipboard mr-1"></i>
-                  To Do List
-                </h3>
-
-                <div class="card-tools">
-                  <ul class="pagination pagination-sm">
-                    <li class="page-item"><a href="#" class="page-link">&laquo;</a></li>
-                    <li class="page-item"><a href="#" class="page-link">1</a></li>
-                    <li class="page-item"><a href="#" class="page-link">2</a></li>
-                    <li class="page-item"><a href="#" class="page-link">3</a></li>
-                    <li class="page-item"><a href="#" class="page-link">&raquo;</a></li>
-                  </ul>
-                </div>
-              </div>
-              <!-- /.card-header -->
-              <div class="card-body">
-                <ul class="todo-list" data-widget="todo-list">
-                  <li>
-                    <!-- drag handle -->
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <!-- checkbox -->
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo1" id="todoCheck1">
-                      <label for="todoCheck1"></label>
-                    </div>
-                    <!-- todo text -->
-                    <span class="text">Design a nice theme</span>
-                    <!-- Emphasis label -->
-                    <small class="badge badge-danger"><i class="far fa-clock"></i> 2 mins</small>
-                    <!-- General tools such as edit or delete-->
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
-                  <li>
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo2" id="todoCheck2" checked>
-                      <label for="todoCheck2"></label>
-                    </div>
-                    <span class="text">Make the theme responsive</span>
-                    <small class="badge badge-info"><i class="far fa-clock"></i> 4 hours</small>
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
-                  <li>
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo3" id="todoCheck3">
-                      <label for="todoCheck3"></label>
-                    </div>
-                    <span class="text">Let theme shine like a star</span>
-                    <small class="badge badge-warning"><i class="far fa-clock"></i> 1 day</small>
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
-                  <li>
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo4" id="todoCheck4">
-                      <label for="todoCheck4"></label>
-                    </div>
-                    <span class="text">Let theme shine like a star</span>
-                    <small class="badge badge-success"><i class="far fa-clock"></i> 3 days</small>
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
-                  <li>
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo5" id="todoCheck5">
-                      <label for="todoCheck5"></label>
-                    </div>
-                    <span class="text">Check your messages and notifications</span>
-                    <small class="badge badge-primary"><i class="far fa-clock"></i> 1 week</small>
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
-                  <li>
-                    <span class="handle">
-                      <i class="fas fa-ellipsis-v"></i>
-                      <i class="fas fa-ellipsis-v"></i>
-                    </span>
-                    <div  class="icheck-primary d-inline ml-2">
-                      <input type="checkbox" value="" name="todo6" id="todoCheck6">
-                      <label for="todoCheck6"></label>
-                    </div>
-                    <span class="text">Let theme shine like a star</span>
-                    <small class="badge badge-secondary"><i class="far fa-clock"></i> 1 month</small>
-                    <div class="tools">
-                      <i class="fas fa-edit"></i>
-                      <i class="fas fa-trash-o"></i>
-                    </div>
-                  </li>
                 </ul>
-              </div>
-              <!-- /.card-body -->
-              <div class="card-footer clearfix">
-                <button type="button" class="btn btn-info float-right"><i class="fas fa-plus"></i> Add item</button>
-              </div>
-            </div>
-            <!-- /.card -->
-          </section>
-          <!-- /.Left col -->
-          <!-- right col (We are only adding the ID to make the widgets sortable)-->
-          <section class="col-lg-5 connectedSortable">
-
-            <!-- Map card -->
-            <div class="card bg-gradient-primary">
-              <div class="card-header border-0">
-                <h3 class="card-title">
-                  <i class="fas fa-map-marker-alt mr-1"></i>
-                  Visitors
-                </h3>
-                <!-- card tools -->
-                <div class="card-tools">
-                  <button type="button"
-                          class="btn btn-primary btn-sm daterange"
-                          data-toggle="tooltip"
-                          title="Date range">
-                    <i class="far fa-calendar-alt"></i>
-                  </button>
-                  <button type="button"
-                          class="btn btn-primary btn-sm"
-                          data-card-widget="collapse"
-                          data-toggle="tooltip"
-                          title="Collapse">
-                    <i class="fas fa-minus"></i>
-                  </button>
-                </div>
-                <!-- /.card-tools -->
-              </div>
-              <div class="card-body">
-                <div id="world-map" style="height: 250px; width: 100%;"></div>
-              </div>
-              <!-- /.card-body-->
-              <div class="card-footer bg-transparent">
-                <div class="row">
-                  <div class="col-4 text-center">
-                    <div id="sparkline-1"></div>
-                    <div class="text-white">Visitors</div>
-                  </div>
-                  <!-- ./col -->
-                  <div class="col-4 text-center">
-                    <div id="sparkline-2"></div>
-                    <div class="text-white">Online</div>
-                  </div>
-                  <!-- ./col -->
-                  <div class="col-4 text-center">
-                    <div id="sparkline-3"></div>
-                    <div class="text-white">Sales</div>
-                  </div>
-                  <!-- ./col -->
-                </div>
-                <!-- /.row -->
-              </div>
-            </div>
-            <!-- /.card -->
-
-            <!-- solid sales graph -->
-            <div class="card bg-gradient-info">
-              <div class="card-header border-0">
-                <h3 class="card-title">
-                  <i class="fas fa-th mr-1"></i>
-                  Sales Graph
-                </h3>
-
-                <div class="card-tools">
-                  <button type="button" class="btn bg-info btn-sm" data-card-widget="collapse">
-                    <i class="fas fa-minus"></i>
-                  </button>
-                  <button type="button" class="btn bg-info btn-sm" data-card-widget="remove">
-                    <i class="fas fa-times"></i>
-                  </button>
-                </div>
-              </div>
-              <div class="card-body">
-                <canvas class="chart" id="line-chart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%;"></canvas>
-              </div>
-              <!-- /.card-body -->
-              <div class="card-footer bg-transparent">
-                <div class="row">
-                  <div class="col-4 text-center">
-                    <input type="text" class="knob" data-readonly="true" value="20" data-width="60" data-height="60"
-                           data-fgColor="#39CCCC">
-
-                    <div class="text-white">Mail-Orders</div>
-                  </div>
-                  <!-- ./col -->
-                  <div class="col-4 text-center">
-                    <input type="text" class="knob" data-readonly="true" value="50" data-width="60" data-height="60"
-                           data-fgColor="#39CCCC">
-
-                    <div class="text-white">Online</div>
-                  </div>
-                  <!-- ./col -->
-                  <div class="col-4 text-center">
-                    <input type="text" class="knob" data-readonly="true" value="30" data-width="60" data-height="60"
-                           data-fgColor="#39CCCC">
-
-                    <div class="text-white">In-Store</div>
-                  </div>
-                  <!-- ./col -->
-                </div>
-                <!-- /.row -->
-              </div>
-              <!-- /.card-footer -->
-            </div>
-            <!-- /.card -->
-
-            <!-- Calendar -->
-            <div class="card bg-gradient-success">
-              <div class="card-header border-0">
-
-                <h3 class="card-title">
-                  <i class="far fa-calendar-alt"></i>
-                  Calendar
-                </h3>
-                <!-- tools card -->
-                <div class="card-tools">
-                  <!-- button with a dropdown -->
-                  <div class="btn-group">
-                    <button type="button" class="btn btn-success btn-sm dropdown-toggle" data-toggle="dropdown">
-                      <i class="fas fa-bars"></i></button>
-                    <div class="dropdown-menu float-right" role="menu">
-                      <a href="#" class="dropdown-item">Add new event</a>
-                      <a href="#" class="dropdown-item">Clear events</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item">View calendar</a>
-                    </div>
-                  </div>
-                  <button type="button" class="btn btn-success btn-sm" data-card-widget="collapse">
-                    <i class="fas fa-minus"></i>
-                  </button>
-                  <button type="button" class="btn btn-success btn-sm" data-card-widget="remove">
-                    <i class="fas fa-times"></i>
-                  </button>
-                </div>
-                <!-- /. tools -->
-              </div>
-              <!-- /.card-header -->
-              <div class="card-body pt-0">
-                <!--The calendar -->
-                <div id="calendar" style="width: 100%"></div>
-              </div>
-              <!-- /.card-body -->
-            </div>
-            <!-- /.card -->
-          </section>
-          <!-- right col -->
+            </nav>
+            <!-- /.sidebar-menu -->
         </div>
-        <!-- /.row (main row) -->
-      </div><!-- /.container-fluid -->
-    </section>
-    <!-- /.content -->
-  </div>
-  <!-- /.content-wrapper -->
-  <footer class="main-footer">
-    <strong>Copyright &copy; 2014-2019 <a href="http://adminlte.io">AdminLTE.io</a>.</strong>
-    All rights reserved.
-    <div class="float-right d-none d-sm-inline-block">
-      <b>Version</b> 3.0.0
-    </div>
-  </footer>
+        <!-- /.sidebar -->
+    </aside>
 
-  <!-- Control Sidebar -->
-  <aside class="control-sidebar control-sidebar-dark">
-    <!-- Control sidebar content goes here -->
-  </aside>
-  <!-- /.control-sidebar -->
+    <!-- Content Wrapper. Contains page content -->
+    <div class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        <div class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1 class="m-0 text-dark">Dashboard</h1>
+                    </div><!-- /.col -->
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item"><a href="#">Home</a></li>
+                            <li class="breadcrumb-item active">Dashboard v1</li>
+                        </ol>
+                    </div><!-- /.col -->
+                </div><!-- /.row -->
+            </div><!-- /.container-fluid -->
+        </div>
+        <!-- /.content-header -->
+
+        <!-- Main content -->
+        <section class="content">
+            <div class="container-fluid">
+                <!-- Small boxes (Stat box) -->
+                <div class="row">
+                    <div class="col-lg-3 col-6">
+                        <!-- small box -->
+                        <div class="small-box bg-info">
+                            <div class="inner">
+                                <h3>150</h3>
+
+                                <p>Totale Abholungen</p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-bag"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small box -->
+                        <div class="small-box bg-success">
+                            <div class="inner">
+                                <h3>53<sup style="font-size: 20px">%</sup></h3>
+
+                                <p>Verbundene Clients</p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-stats-bars"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small box -->
+                        <div class="small-box bg-warning">
+                            <div class="inner">
+                                <h3>44</h3>
+
+                                <p>Geplante Abholungen</p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-person-add"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                    <div class="col-lg-3 col-6">
+                        <!-- small box -->
+                        <div class="small-box bg-danger">
+                            <div class="inner">
+                                <h3>65</h3>
+
+                                <p>Abgeschlossene Abholungen</p>
+                            </div>
+                            <div class="icon">
+                                <i class="ion ion-pie-graph"></i>
+                            </div>
+                            <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
+                        </div>
+                    </div>
+                    <!-- ./col -->
+                </div>
+                <!-- /.row -->
+                <!-- Main row -->
+                <div class="row">
+                    <!-- Left col -->
+                    <section class="col-lg-7 connectedSortable">
+                        <!-- Custom tabs (Charts with tabs)-->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-chart-pie mr-1"></i>
+                                    Alle abholdaten
+                                </h3>
+                            </div><!-- /.card-header -->
+                            <div class="card-body">
+
+                            </div><!-- /.card-body -->
+                        </div>
+                        <!-- /.card -->
+
+
+                        <!-- Custom tabs (Charts with tabs)-->
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">
+                                    <i class="fas fa-chart-pie mr-1"></i>
+                                    Create new Date
+                                </h3>
+                                <button id="btn-savelist" type="button" class="btn btn-success"
+                                        style="float:right;">Save
+                                </button>
+                            </div><!-- /.card-header -->
+                            <div class="card-body">
+                                <form>
+                                    <h4>General options:</h4>
+                                    <div class="custom-control custom-switch">
+                                        <input type="checkbox" class="custom-control-input" id="customSwitch1">
+                                        <label class="custom-control-label" for="customSwitch1">Notify Led-Board</label>
+                                    </div>
+                                    <div class="form-group" style="margin-top: 15px; width: 30%;">
+                                        <label for="exampleInputEmail1">Table Name</label>
+                                        <input type="email" class="form-control" id="exampleInputEmail1"
+                                               aria-describedby="emailHelp" placeholder="Enter Table Name">
+                                        <small id="emailHelp" class="form-text text-muted">Please try to use no special
+                                            characters</small>
+                                    </div>
+                                    <div class="form-group" style="width: 30%;">
+                                        <label for="exampleInputEmail1">City/Village name</label>
+                                        <input type="email" class="form-control" id="exampleInputEmail1i"
+                                               aria-describedby="emailHelp" placeholder="Enter City name here">
+                                        <small id="emailHelpi" class="form-text text-muted">Please try to use no special
+                                            characters</small>
+                                    </div>
+
+                                    <h4>Add Data:</h4>
+                                    <div class="input-group mt-3 mb-3" style="width: 100%;">
+                                        <div class="input-group-prepend">
+                                            <button id="dropdown-wastetype" type="button"
+                                                    class="btn btn-outline-light dropdown-toggle"
+                                                    data-toggle="dropdown">
+                                                Select waste type
+                                            </button>
+                                            <div class="dropdown-menu">
+                                                <a class="dropdown-item" href="#">Plastic</a>
+                                                <a class="dropdown-item" href="#">Metal</a>
+                                                <a class="dropdown-item" href="#">residual waste</a>
+                                                <a class="dropdown-item" href="#">biowaste</a>
+                                            </div>
+                                        </div>
+
+                                        <input id="input-wastetime" style="width: 50px;" class="form-control" id="date"
+                                               name="date" placeholder="MM/DD/YYY" type="text"/>
+
+                                        <input id="input-wasteregion" type="text" class="form-control"
+                                               placeholder="Region">
+                                        <input id="input-wastezone" type="text" class="form-control" placeholder="Zone">
+                                        <button type="button" class="btn-addtolist btn btn-success"
+                                                style="float:right;">Add to list
+                                        </button>
+                                    </div>
+
+                                    <h4>Your Data:</h4>
+                                    <table class="table table-dark table-hover" style="width: 50%;">
+                                        <thead>
+                                        <tr>
+                                            <th>Waste type</th>
+                                            <th>Date</th>
+                                            <th>Region</th>
+                                            <th>Zone</th>
+                                        </tr>
+                                        </thead>
+                                        <tbody id="addtable-body">
+                                        </tbody>
+                                    </table>
+                                </form>
+                            </div><!-- /.card-body -->
+                        </div>
+                    </section>
+
+
+                    <!-- /.Left col -->
+                    <!-- right col (We are only adding the ID to make the widgets sortable)-->
+                    <section class="col-lg-5 connectedSortable">
+
+
+                        <!-- /.card -->
+                    </section>
+                    <!-- right col -->
+                </div>
+                <!-- /.row (main row) -->
+            </div><!-- /.container-fluid -->
+        </section>
+        <!-- /.content -->
+    </div>
+    <!-- /.content-wrapper -->
+    <footer class="main-footer">
+        <strong>By Gregor Dutzler & Lukas Heiligenbrunner & Emil Meindl</strong>
+        <div class="float-right d-none d-sm-inline-block">
+            <b>Version</b> 3.0.0
+            <b>Build</b> 2019-8-8 9:30
+        </div>
+
+
+    </footer>
+
+    <!-- Control Sidebar -->
+    <aside class="control-sidebar control-sidebar-dark">
+        <!-- Control sidebar content goes here -->
+    </aside>
+    <!-- /.control-sidebar -->
 </div>
 <!-- ./wrapper -->
 
@@ -890,7 +325,7 @@
 <script src="lib/AdminLTE/plugins/jquery-ui/jquery-ui.min.js"></script>
 <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
 <script>
-  $.widget.bridge('uibutton', $.ui.button)
+    $.widget.bridge('uibutton', $.ui.button)
 </script>
 <!-- Bootstrap 4 -->
 <script src="lib/AdminLTE/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
@@ -918,5 +353,10 @@
 <script src="lib/AdminLTE/dist/js/pages/dashboard.js"></script>
 <!-- AdminLTE for demo purposes -->
 <script src="lib/AdminLTE/dist/js/demo.js"></script>
+
+<script type="text/javascript"
+        src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
+
+<script type="text/javascript" src="js/settings.js"></script>
 </body>
 </html>