diff --git a/design.css b/design.css
index ab36f01..e689ac1 100644
--- a/design.css
+++ b/design.css
@@ -1,36 +1,6 @@
-#h1{
-text-align:center;
-padding-top:50px;
-font-size:250%;
-color:black;
-font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
+ 
+.container-fluid {
+   max-width: 80%;
+   padding-right: 15px;
+  padding-left: 15px;
 }
-#h2{
-text-align:center;
-padding-top:20%;
-}
-
-#h3{
-padding-top:5%;
-text-align:center;
-font-size:100%;
-color:black;
-font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
-}
-
-#tabelle{
-align="center"
-border="10"
-color:white;
-font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
-text-align:center;
-}
-
-a {
-align:center;
-color: black;
-text-decoration: none;
-text-underline: none;
-font-family: Helvetica;
-}
-
diff --git a/index.html b/index.html
index 3328228..dab2441 100644
--- a/index.html
+++ b/index.html
@@ -10,9 +10,7 @@
 <meta http-equiv="refresh" content="20" >
  <div id="h1">
 &nbsp TLC WebView CDS
-<p>
 
-</p>
 </div>
    <div id="tabelle">
         <table width="100%" cellpadding="0" cellspacing="0">
@@ -42,6 +40,8 @@
          </tr>
         </table>
    </div>
+   
+
 <div id="h2">
 <a href="https://services.schuttercloud.com/slider.html">Slider</a>
 <br><br>
diff --git a/index_neu.html b/index_neu.html
index ada8737..5ea613a 100644
--- a/index_neu.html
+++ b/index_neu.html
@@ -23,6 +23,8 @@
 <!-- Custom styles for this template -->
 <link href="half-slider.css" rel="stylesheet">
 
+<link rel="stylesheet" type="text/css" href="design.css">
+
 </head>
 
 <body>
@@ -111,41 +113,27 @@
 		</div>
 	</header>
 
-	<br>
-	<br>
-	
-	</div>
-   <div id="tabelle">
-        <table width="100%" cellpadding="0" cellspacing="0">
-         <tr>
-          <td><div id="h3"><a href="data/TLC01.jpg"><img src="data/TLC01.jpg" alt="TLC01" width="328" height="246" /></a>  </div></td>
-          <td><div id="h3"><a href="data/TLC02.jpg"><img src="data/TLC02.jpg" alt="TLC02" width="328" height="246" /></a> </div></td>
-          <td><div id="h3"><a href=""><img src="data/TLC03.gif" alt="TLC03" width="328" height="246" /></a>  </div></td>
-          <td><div id="h3"><a href="data/TLC04.jpg"><img src="data/TLC04.jpg" alt="TLC04" width="328" height="246" /></a>  </div></td>
-         </tr>
-         <tr>
-          <td><div id="h3"> TLC01 - Salmenkopf, Freistett <p> </p> <button data-clipboard-text="https://services.schuttercloud.com/data/TLC01.jpg">Copy direct link to clipboard</button> </div></td>
-          <td><div id="h3"> TLC02 - Salmenkopf, Freistett <p> </p> <button data-clipboard-text="https://services.schuttercloud.com/data/TLC02.jpg">Copy direct link to clipboard</button> </div></td>
-          <td><div id="h3"> TLC03 - not used yet <p> </p> <button data-clipboard-text="https://services.schuttercloud.com">Copy direct link to clipboard</button>  </div></td>
-          <td><div id="h3"> TLC04 - Demo <p> </p> <button data-clipboard-text="https://services.schuttercloud.com/data/TLC04.jpg">Copy direct link to clipboard</button> </div></td>
-         </tr>
-         <tr>
-          <td><div id="h3"><a href=""><img src="data/TLC05.gif" alt="TLC05" width="328" height="246" /></a>  </div></td>
-          <td><div id="h3"><a href=""><img src="data/TLC06.gif" alt="TLC06" width="328" height="246" /></a>  </div></td>
-          <td><div id="h3"><a href=""><img src="data/TLC07.gif" alt="TLC07" width="328" height="246" /></a>  </div></td>
-          <td><div id="h3"><a href=""><img src="data/TLC08.gif" alt="TLC08" width="328" height="246" /></a>  </div></td>
-         </tr>
-         <tr>
-          <td><div id="h3"> TLC05 - not used yet <p> </p> <button data-clipboard-text="https://services.schuttercloud.com">Copy direct link to clipboard</button> </div></td>
-          <td><div id="h3"> TLC06 - not used yet <p> </p> <button data-clipboard-text="https://services.schuttercloud.com">Copy direct link to clipboard</button> </div></td>
-          <td><div id="h3"> TLC07 - not used yet <p> </p> <button data-clipboard-text="https://services.schuttercloud.com">Copy direct link to clipboard</button> </div></td>
-          <td><div id="h3"> TLC08 - not used yet <p> </p> <button data-clipboard-text="https://services.schuttercloud.com">Copy direct link to clipboard</button> </div></td>
-         </tr>
-        </table>
-   </div>
-	
-<br />
-</div>
+	<div class="container-fluid">
+
+ <div class="row">
+      <div class="col-sm" style="background-color:yellow;">25%</div>
+      <div class="col-sm" style="background-color:orange;">25%</div>
+      <div class="col-sm" style="background-color:yellow;">25%</div>
+      <div class="col-sm" style="background-color:orange;">25%</div>
+    </div>
+    <br>
+        <div class="row">
+      <div class="col-sm" style="background-color:yellow;">25%</div>
+      <div class="col-sm" style="background-color:orange;">25%</div>
+      <div class="col-sm" style="background-color:yellow;">25%</div>
+      <div class="col-sm" style="background-color:orange;">25%</div>
+    </div>
+    <br>
+    
+    
+</div>	
+
+
 <script type="text/javascript">/* jshint browser: true */</script>
 <script src="clipboard.min.js"></script>
 <script src="shim.js"></script>


TLC01 - Salmenkopf, Freistett	TLC02 - Salmenkopf, Freistett	TLC03 - not used yet	TLC04 - Demo

TLC05 - not used yet	TLC06 - not used yet	TLC07 - not used yet	TLC08 - not used yet