diff --git a/.gitmodules b/.gitmodules
index 418c091..8c56e3a 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,3 +1,6 @@
 [submodule "gitpage/themes/dimension"]
 	path = gitpage/themes/dimension
 	url = https://gitlab.com/dspechnikov/dimension-hugo
+[submodule "service/themes/dimension"]
+	path = service/themes/dimension
+	url = https://github.com/your-identity/hugo-theme-dimension.git
diff --git a/service/templates/footer.html.tera b/service/templates/footer.html.tera
new file mode 100644
index 0000000..f992486
--- /dev/null
+++ b/service/templates/footer.html.tera
@@ -0,0 +1,5 @@
+<script src="/static/js/jquery.min.js"></script>
+<script src="/static/js/browser.min.js"></script>
+<script src="/static/js/breakpoints.min.js"></script>
+<script src="/static/js/util.js"></script>
+<script src="/static/js/main.js"></script>
\ No newline at end of file
diff --git a/service/templates/header.html.tera b/service/templates/header.html.tera
new file mode 100644
index 0000000..be2cdbe
--- /dev/null
+++ b/service/templates/header.html.tera
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Clippable</title>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
+    <link rel="stylesheet" href="/static/main.css"/>
+    <link rel="icon" href="/static/favicon.png" type="image/png"
+    <noscript><link rel="stylesheet" href="/static/noscript.css"/></noscript>
+    <style>
+        :root{--site-background : url("/static/bg.png")};
+    </style> 
+</head>
\ No newline at end of file
diff --git a/service/templates/index.html.tera b/service/templates/index.html.tera
new file mode 100644
index 0000000..cd51eb7
--- /dev/null
+++ b/service/templates/index.html.tera
@@ -0,0 +1,31 @@
+{% include "header" %}
+<body class="is-preload">
+    <div id="wrapper">
+        <header id="header">
+            <div class="logo">
+                <span class="icon"> <img src="/static/logo.png"> </span>
+            </div>
+            <div class="content">
+                <div class="inner">
+                    <h1>some title</h1>
+                    <p> some description </p>
+                </div>
+            </div>
+            <nav>
+                <ul>
+                    <li> <a href="#about-section">about section</a> </li>
+                </ul>
+            </nav>
+        </header>
+        <div id="main">
+            <article id="about-section">
+                <h2 class="major">about section</h2>
+                <span class="image main"><img src="" alt="" /></span>
+                <p>asdfadf</p>
+
+            </article>
+        </div>
+    </div>
+<div id="bg"></div>
+</body>
+{% include "footer" %}
\ No newline at end of file
diff --git a/service/templates/video.html.tera b/service/templates/video.html.tera
index 0784428..a440aaa 100644
--- a/service/templates/video.html.tera
+++ b/service/templates/video.html.tera
@@ -1,16 +1,14 @@
 <!DOCTYPE html>
-<head lang="en-us">
-    <link rel="stylesheet" href="/static/style.css">
-</head>
+{% include "head" %}
 <body>
-    <div class="content">
-        <h1 class="title">{{ title }}</h1>
+    <div class="container">
         {% if video %}
-            <video controls>
+            <video class="content" controls>
                 <source src="{{ video }}" type="video/{{ kind }}">
             </video>
+            <br><p class="content">{{title}}</p>
         {% else %}
-            <p>Nothing to see here</p>
+            <p class="content">Nothing to see here</p>
         {% endif %}
     </div>
 </body>
\ No newline at end of file
diff --git a/service/themes/dimension b/service/themes/dimension
new file mode 160000
index 0000000..2474081
--- /dev/null
+++ b/service/themes/dimension
@@ -0,0 +1 @@
+Subproject commit 2474081b7846ce0e211c57b86ed84989548a777d
