diff --git a/content/contents/default.blade.php b/content/contents/default.blade.php
new file mode 100644
index 0000000..bc47a7c
--- /dev/null
+++ b/content/contents/default.blade.php
@@ -0,0 +1,198 @@
+@extends('template.'.config('settings.template').'.content.master')
+@section('content')
+
+
+    <div class="container">
+
+        <div class="row">
+
+
+            <div class="col-12">
+                <h1 class="mb-5">{{$content->title}}</h1>
+
+            </div>
+            <div class="col-9">
+
+
+                @if ($content->image)
+                    <img class="rounded-top img-fluid" src="{{ asset('uploads/' . $content->image) }}" loading="lazy" >
+                @else
+                    <img class="rounded-top img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy" width="100%">
+                @endif
+
+                <br>
+                <br>
+                <br>
+
+
+                <a href="{{ route('author.get', [$content->user->slug]) }}" class="text-decoration-none mt-2">
+                    <img src="{{ $content->user->gravatar() }}" width="20px" title="{{ $content->user->name }}" class="border rounded img-fluid shadow-sm" alt="Logo {{ $content->user->name }} ">
+                    {{ $content->user->name }}
+                </a>
+                <p class="fs-5 mt-5">
+
+                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dicta ea exercitationem explicabo itaque nobis perferendis quibusdam repellendus vero voluptates? Ab autem consectetur consequuntur culpa dicta natus repellat veritatis vero?
+                </p>
+
+               <h2 class="fs-4 mt-5">Features</h2>
+
+                    <p class="fs-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. A aliquam aspernatur consectetur, consequatur debitis, dignissimos eligendi enim facere iste iusto laboriosam natus necessitatibus neque optio quia quis reprehenderit soluta, vitae?
+
+                </p>
+
+            <h2 class="fs-4 mt-5">Screenshots</h2>
+
+                <div class="row">
+                    <div class="col-4 mb-3">
+                        <img class="rounded img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+
+                    </div>
+                    <div class="col-4 mb-3">
+                        <img class="rounded img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+
+                    </div>
+                    <div class="col-4 mb-3">
+                        <img class="rounded img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+
+                    </div>
+
+                    <div class="col-4 mb-3">
+                        <img class="rounded img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+
+                    </div>
+
+                    <div class="col-4 mb-3">
+                        <img class="rounded img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+
+                    </div>
+
+                </div>
+
+
+
+            </div>
+
+            <div class="col-3">
+
+                <div class="bg-ci rounded p-3 border-ci">
+                    Lumino Version: <a href="">3.2</a>
+                    <br>
+                    Lisence: <a href="">2.93</a>
+                    <br>
+                    Latest Version: <a href="">2.93</a>
+                    <br>
+                    Price: <i>free</i>
+                    <a  class="btn btn-primary d-block mt-4" data-bs-toggle="modal" data-bs-target="#exampleModal">Install Theme</a>
+                </div>
+
+
+            </div>
+
+            <div class="col-12">
+                <br>
+                <br>
+                <br>
+                <br>
+                <br>
+                <hr>
+
+                <br>
+                <br>
+                <br>
+                <h2>Other Themes</h2>
+                <br>
+                <br>
+                <br>
+
+
+            </div>
+
+            <div class="row">
+                @foreach($contents as $indexContent => $content)
+                    <div class="col-12 col-md-6 col-lg-4 mb-5">
+                        <a href="{{ route_content($content) }}" class="text-decoration-none text-dark">
+                            <div class="card shadow-lg">
+
+                                @if ($content->image)
+                                    <img class="rounded-top img-fluid" src="{{ asset('uploads/' . $content->image) }}" loading="lazy">
+                                @else
+                                    <img class="rounded-top img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+                                @endif
+
+                                <div class="card-body">
+                                    <h2 class="fs-5">{{$content->title}}</h2>
+                                    <a href="{{ route('author.get', [$content->user->slug]) }}" class="text-decoration-none">
+                                        <img src="{{ $content->user->gravatar() }}" width="20px" title="{{ $content->user->name }}" class="border rounded img-fluid shadow-sm" alt="Logo {{ $content->user->name }} ">
+                                        {{ $content->user->name }}
+                                    </a>
+                                    <p>
+                                        <br>
+                                        Public Showcase of Lumino Themes. You can browse, compare the templates and install them into your own Lumino Installation.</p>
+
+
+                                </div>
+
+                            </div>
+
+                        </a>
+
+
+                    </div>
+
+                @endforeach
+            </div>
+
+
+
+
+        </div>
+    </div>
+
+
+
+
+
+    <!-- Modal -->
+    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+        <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title" id="exampleModalLabel">Install Theme</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+
+                    <br>
+
+
+                    <div class="input-group input-group-lg">
+                        <input type="text" id="inputPassword5" class="form-control border-ci rounded" aria-describedby="passwordHelpBlock" readonly value="git@code.areya.de:Areya/alpakas-theme.git">
+                        <div id="passwordHelpBlock" class="form-text">
+                            <br>
+                            Use this link to install the chosen theme into your own Lumino installation. Make sure the Theme is compatible with your Lumino Version.
+                        </div>
+                    </div>
+
+
+
+
+                    <br>
+                    <br>
+                    <br>
+                    <h5>Instructions</h5>
+
+                    <br>
+
+
+
+
+                </div>
+
+            </div>
+        </div>
+    </div>
+
+@stop
+
+
+
diff --git a/content/includes/css.blade.php b/content/includes/css.blade.php
index e69de29..7566af2 100644
--- a/content/includes/css.blade.php
+++ b/content/includes/css.blade.php
@@ -0,0 +1,70 @@
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+
+<style>
+    body{
+        background-color: rgba(209, 196, 225, 0.65);
+    }
+
+
+    a, a:hover{
+        color: #24052f;
+    }
+
+
+    .card{
+        background-color: #caacd536;
+    }
+
+
+    h1,h2,h3{
+        color: #24052f;
+    }
+
+    section{
+        padding-top: 45px;
+        padding-bottom: 60px;
+        margin-bottom: 90px;
+        padding-left: 1rem;
+        padding-right: 1rem;
+
+    }
+
+    .bg-ci{
+        background-color: #53276236 ;
+
+    }
+
+    .border-ci{
+        border: 1px solid #24052f;
+    }
+
+    footer{
+        background-color: #24052f;
+        padding-top: 35px;
+        padding-bottom: 40px;
+        margin-top: 120px;
+        color: white;
+    }
+
+    .btn-primary{
+        background-color: #24052f;
+        border-color: #1c0625 ;
+    }
+    .btn-primary:hover{
+        background-color: #1c0625;
+    }
+    footer a{
+        color: white;
+    }
+
+    nav{
+        background-color: #24052f;
+        padding-top: 30px;
+        padding-bottom: 30px;
+        color: white;
+        margin-bottom: 80px;
+    }
+    nav a {
+        color: white;
+    }
+</style>
\ No newline at end of file
diff --git a/content/includes/footer.blade.php b/content/includes/footer.blade.php
index 3f33346..e20896b 100644
--- a/content/includes/footer.blade.php
+++ b/content/includes/footer.blade.php
@@ -1,4 +1,4 @@
-<div id="footer">
+<footer>
     <div class="container">
 
 
diff --git a/content/includes/scripts.blade.php b/content/includes/scripts.blade.php
index e69de29..ae76f46 100644
--- a/content/includes/scripts.blade.php
+++ b/content/includes/scripts.blade.php
@@ -0,0 +1 @@
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
diff --git a/content/index.blade.php b/content/index.blade.php
index 1d3efa5..d322126 100644
--- a/content/index.blade.php
+++ b/content/index.blade.php
@@ -1,11 +1,63 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <title></title>
-</head>
-<body>
+@extends('template.'.config('settings.template').'.content.master')
+@section('content')
+
+
+  <div class="container">
+
+    <section class="rounded bg-ci">
+      <div class="row">
+        <div class="col">
+          <h1>Lumio Theme Store</h1>
+
+          <p class="fs-4">
+            A showcase of public Lumino Themes.
+            <br>
+            You can browse, compare the templates and install them into your own Lumino Installation. To develop and list your own Lumino Template <a href="https://www.areya.de/contact" class="text-decoration-none"> get in contact</a>
+          </p>
+
+        </div>
+      </div>
+    </section>
+
+
+
+  <div class="row">
+    @foreach($contents as $indexContent => $content)
+      <div class="col-12 col-md-6 col-4 mb-5">
+        <a href="{{ route_content($content) }}" class="text-decoration-none text-dark">
+          <div class="card shadow-lg">
+
+            @if ($content->image)
+              <img class="rounded-top img-fluid" src="{{ asset('uploads/' . $content->image) }}" loading="lazy">
+            @else
+              <img class="rounded-top img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+            @endif
+
+            <div class="card-body">
+              <h2 class="fs-5">{{$content->title}}</h2>
+              <a href="{{ route('author.get', [$content->user->slug]) }}" class="text-decoration-none">
+                <img src="{{ $content->user->gravatar() }}" width="20px" title="{{ $content->user->name }}" class="border rounded img-fluid shadow-sm" alt="Logo {{ $content->user->name }} ">
+                {{ $content->user->name }}
+              </a>
+              <p>
+                <br>
+                Public Showcase of Lumino Themes. You can browse, compare the templates and install them into your own Lumino Installation.</p>
+
+
+            </div>
+
+          </div>
+
+        </a>
+
+
+      </div>
+
+    @endforeach
+  </div>
+</div>
+
+@stop
+
+
 
-</body>
-</html>
\ No newline at end of file
diff --git a/content/lists/default.blade.php b/content/lists/default.blade.php
new file mode 100644
index 0000000..114ef23
--- /dev/null
+++ b/content/lists/default.blade.php
@@ -0,0 +1,63 @@
+@extends('template.'.config('settings.template').'.content.master')
+@section('content')
+
+
+    <div class="container">
+
+        <section class="rounded">
+            <div class="row">
+                <div class="col">
+                    <h1>Lumio Theme Store</h1>
+
+                    <p class="fs-4">
+                        A showcase of public Lumino Themes.
+                        <br>
+                        You can browse, compare the templates and install them into your own Lumino Installation. To develop and list your own Lumino Template <a href="https://www.areya.de/contact" class="text-decoration-none"> get in contact</a>
+                    </p>
+
+                </div>
+            </div>
+        </section>
+
+
+
+        <div class="row">
+            @foreach($contents as $indexContent => $content)
+                <div class="col-12 col-md-6 col-4 mb-5">
+                    <a href="{{ route_content($content) }}" class="text-decoration-none text-dark">
+                        <div class="card shadow-lg">
+
+                            @if ($content->image)
+                                <img class="rounded-top img-fluid" src="{{ asset('uploads/' . $content->image) }}" loading="lazy">
+                            @else
+                                <img class="rounded-top img-fluid" src="https://picsum.photos/800/400?{{rand(0,100)}}" loading="lazy">
+                            @endif
+
+                            <div class="card-body">
+                                <h2 class="fs-5">{{$content->title}}</h2>
+                                <a href="{{ route('author.get', [$content->user->slug]) }}" class="text-decoration-none">
+                                    <img src="{{ $content->user->gravatar() }}" width="20px" title="{{ $content->user->name }}" class="border rounded img-fluid shadow-sm" alt="Logo {{ $content->user->name }} ">
+                                    {{ $content->user->name }}
+                                </a>
+                                <p>
+                                    <br>
+                                    Public Showcase of Lumino Themes. You can browse, compare the templates and install them into your own Lumino Installation.</p>
+
+
+                            </div>
+
+                        </div>
+
+                    </a>
+
+
+                </div>
+
+            @endforeach
+        </div>
+    </div>
+
+@stop
+
+
+
diff --git a/content/master.blade.php b/content/master.blade.php
index 45249c3..a281b8b 100644
--- a/content/master.blade.php
+++ b/content/master.blade.php
@@ -7,6 +7,12 @@
     @yield('head')
 </head>
 <body>
+
+    <nav>
+        <div class="container">
+           <a href="{{url('/')}}">Lumino Themes</a>
+        </div>
+    </nav>
     @yield('content')
     @include('template.'.config('settings.template').'.content.includes.footer')
     @include('template.'.config('settings.template').'.content.includes.scripts')