diff --git a/yadc/static/default.scss b/yadc/static/default.scss
index 8e43ac3..b22daff 100644
--- a/yadc/static/default.scss
+++ b/yadc/static/default.scss
@@ -7,29 +7,31 @@ $breakpoints: (tablet: 560px, desktop: 900px);
 
 $bg-color: #222; //#20141f;
 $text-color: #fff;
-$a-color: #fff;
+$a-color: #bbb;
 $ahover-color: #909090;
 
-$header-bg-color: #111;
-$nav-bg-color: #222d;//#20141fd0;
+$header-bg-color: #222;
+$nav-bg-color: #111d;//#20141fd0;
 $nav-bg-color_hover: #333;//#20141fa0;
 
-$desktop-width: 560px;
+// $desktop-width: 560px;
+
+// @mixin mobile {
+//     @media only screen and (max-width: #{$desktop-width - 1px}) {
+//         @content;
+//     }
+// }
+// @mixin desktop {
+//     @media only screen and (min-width: #{$desktop-width}) {
+//         @content;
+//     }
+// }
 
-@mixin mobile {
-    @media only screen and (max-width: #{$desktop-width - 1px}) {
-        @content;
-    }
-}
-@mixin desktop {
-    @media only screen and (min-width: #{$desktop-width}) {
-        @content;
-    }
-}
 
 body {
     margin: 0;
     font-family: Verdana, Geneva, Tahoma, sans-serif;
+    // font-family: monospace; font-size: 1.1em;
     //font-size: 14px;
 
     background-color: $bg-color;
@@ -205,50 +207,63 @@ header {
 
 
 .main_wrap {
-    // margin: 0 auto;
-    max-width: 1200px;
+    $bp-desktop: ">=desktop";
+    $bp-tablet: "<desktop";
 
-    display: flex;
+    // margin: 0 auto;
+    // max-width: 1200px;
 
-    padding: 8px;
+    $main-wrap-padding: 8px;
+    padding: $main-wrap-padding;
+    padding-top: 0;
+    padding-bottom: 0;
 
-    h4 {
+    h3 {
         margin: 0;
         margin-bottom: 10px;
 
-        font-size: 1.4em;
+        font-size: 1.3em;
     }
 
-    @include media("<desktop") {
-        flex-flow: column nowrap;
+    .important_subwrap {
 
-        // section {
-        //     margin: 0 10px;
-        // }
-    }
-    @include media(">=desktop") {
-        flex-flow: row nowrap;
-        
+        display: flex;
+        @include media($bp-tablet) {
+            flex-flow: column nowrap;
+        }
+        @include media($bp-desktop) {
+            flex-flow: row nowrap;
+        }
+        overflow: visible; // for negative margin of .post_single
     }
 
-    > section.tag_panel {
+    $side-panel-width: 14rem;
+    section.side_panel {
         flex-shrink: 0;
 
+        @include media($bp-desktop) {
+            // width: 14em;
+            width: $side-panel-width;
 
-        article.tags {
-            // @include media(">=desktop") {
-            //     margin-left: 10px;
-            //     margin-top: 10px;
-            // }
+            height: 0; // for overflow
+        }
+
+        padding: 10px;
 
-            padding: 10px;
+        article {
+            &:not(:last-child) {
+                margin-bottom: 10px;
+            }
+        }
 
+        article.tags {
             .tag_container {
                 display: flex;
 
                 > a {
                     margin: 2px 2px;
-                    padding: 6px 12px;
+                    // padding: .4em .75em;
+                    padding: .35em .6em;
 
                     //text-align: center;
                     border-radius: 4px;
@@ -268,38 +283,49 @@ header {
                     // }
                 }
             }
-            @include media("<desktop") {
+            @include media($bp-tablet) {
                 .tag_container {
                     flex-flow: row wrap;
 
                 }
 
             }
-            @include media(">=desktop") {
+            @include media($bp-desktop) {
                 .tag_container {
                     flex-flow: column nowrap;
                     align-items: start;
                 }
             }
         }
+
+        article.post_desc {
+            display: flex;
+            flex-flow: column nowrap;
+            font-size: .9em;
+            
+            > img {
+                display: block;
+                max-width: 128px;
+            }
+        }
     }
 
-    overflow: hidden;
-    > section.post_list {
+    section.post_list {
+        overflow: hidden;
+        @include media("<tablet") {
+            margin-left: -#{$main-wrap-padding};
+            margin-right: -#{$main-wrap-padding};
+        }
         .posts {
             display: flex;
             flex-flow: row wrap;
-            // margin-left: -4px;
-            // margin-right: -4px;
-            // margin-left: 0;
-            // margin-right: 0;
-            // margin: 0;
-            // padding: 8px;
-            // margin: 0 8px;
-            // @include media(">=desktop") {
-            //     margin-right: 8px;
-            //     margin-top: 8px;
-            // }
+
+            $figure-margin: 8px;
+
+            @include media($bp-tablet) {
+                margin-left: -#{$figure-margin};
+                margin-right: -#{$figure-margin};
+            }
 
             &::after {
                 content: "";
@@ -308,26 +334,26 @@ header {
 
             > figure {
                 position: relative;
-                margin: 8px;
+                margin: $figure-margin;
 
 
                 img {
                     display: block;
                     width: 100%;
                     height: 100%;
-                    border-radius: 4px;
+                    // border-radius: 4px;
 
                     transition: .2s ease;
                 }
                 &:hover img {
                     opacity: .7;
                 }
-                
             }
         }
 
         .pagin {
-            margin: 10px auto;
+            margin: 10px 0;
+            margin-right: calc(#{$side-panel-width}/2);
 
             display: flex;
             flex-flow: row nowrap;
@@ -345,12 +371,47 @@ header {
         }
     }
 
+    section.post_single {
+        @include media($bp-desktop) {
+            padding: 8px;
+        }
+        @include media($bp-tablet) {
+            order: -1;
+            margin-bottom: $main-wrap-padding;
+        }
+        @include media("<tablet") {
+            // margin-top: -$main-wrap-padding;
+            margin-left: -#{$main-wrap-padding};
+            margin-right: -#{$main-wrap-padding};
+        }
+
+        img {
+            display: block;
+            max-width: 100%;
+        }
+    }
+
+    section.comments {
+        padding: 10px;
+        @include media($bp-desktop) {
+            margin-left: $side-panel-width;
+        }
+
+        article { overflow: hidden; }
+        h4 {
+            margin-top: .5em;
+            margin-bottom: .5em;
+        }
+        p {
+            margin-top: .5em;
+        }
+    }
 }
 
-footer {
+footer { // DUE TO OVERFLOW OF THE SIDE PANEL, TRY TO KEEP IT ON THE RIGHT
     padding: 10px;
 
     // background-color: $header-bg-color;
 
     text-align: center;
-}
\ No newline at end of file
+}
diff --git a/yadc/templates/index.html b/yadc/templates/index.html
index 0969e8f..7d4439c 100644
--- a/yadc/templates/index.html
+++ b/yadc/templates/index.html
@@ -35,187 +35,189 @@
         <span id="nav-menu" class="fa fa-bars"></span>
     </header>
     <div class="main_wrap">
-        <section class="tag_panel">
-            <article class="tags">
-                <h4>Tags</h4>
-                <div class="tag_container">
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name" href="#">neko</span>
-                        <span class="count">10</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">works</span>
-                        <span class="count">2</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">anime</span>
-                        <span class="count">4</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">manga</span>
-                        <span class="count">7</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">original</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">azur lane</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">figure</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">touhou</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">photoshop</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">close</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">cropped</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">waifu2x</span>
-                        <span class="count">5</span>
-                    </a>
+        <div class="important_subwrap">
+            <section class="side_panel">
+                <article class="tags">
+                    <h3>Tags</h3>
+                    <div class="tag_container">
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name" href="#">neko</span>
+                            <span class="count">10</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">works</span>
+                            <span class="count">2</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">anime</span>
+                            <span class="count">4</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">manga</span>
+                            <span class="count">7</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">original</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">azur lane</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">figure</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">touhou</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">photoshop</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">close</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">cropped</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">waifu2x</span>
+                            <span class="count">5</span>
+                        </a>
 
+                    </div>
+                </article>
+            </section>
+            <section class="post_list">
+                <div class="posts">
+                    <figure style="flex: 307.87 1 307.87px;">
+                        <a href="#">
+                            <img src="static/ryuzu/916993.png" alt="">
+                        </a>
+                        <!--<div class="thumb-info">
+                            <span>RyuZU²</span>
+                            <span>1920x1080</span>
+                            <span>1.5M</span>
+                        </div>-->
+                    </figure>
+                    <figure style="flex: 309.68 1 309.68px;">
+                        <img src="static/ryuzu/916500.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 157.98 1 157.98px;">
+                        <img src="static/pixiv/illust_76819896_20191017_131929.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 391.11 1 391.11px;">
+                        <img src="static/ryuzu/916132.png" alt="">
+                    </figure>
+                    <figure style="flex: 220.00 1 220.00px;">
+                        <img src="static/pixiv/illust_75885180_20191105_174853.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 334.97 1 334.97px;">
+                        <img src="static/ryuzu/916486.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.53 1 155.53px;">
+                        <img src="static/pixiv/illust_71840908_20191117_162206.png" alt="">
+                    </figure>
+                    <figure style="flex: 391.11 1 391.11px;">
+                        <img src="static/ryuzu/916269.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 131.98 1 131.98px;">
+                        <img src="static/pixiv/illust_72206228_20191026_131238.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 391.11 1 391.11px;">
+                        <img src="static/ryuzu/916234.png" alt="">
+                    </figure>
+                    <figure style="flex: 157.75 1 157.75px;">
+                        <img src="static/pixiv/illust_66441619_20191117_162011.png" alt="">
+                    </figure>
+                    <figure style="flex: 340.92 1 340.92px;">
+                        <img src="static/ryuzu/917345.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.28 1 155.28px;">
+                        <img src="static/pixiv/illust_71851314_20191017_131351.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 356.46 1 356.46px;">
+                        <img src="static/ryuzu/917364.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.55 1 155.55px;">
+                        <img src="static/pixiv/illust_74700365_20191026_131807.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 391.11 1 391.11px;">
+                        <img src="static/ryuzu/916232.png" alt="">
+                    </figure>
+                    <figure style="flex: 229.12 1 229.12px;">
+                        <img src="static/pixiv/illust_73298123_20191017_131918.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 318.79 1 318.79px;">
+                        <img src="static/ryuzu/917571.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.56 1 155.56px;">
+                        <img src="static/pixiv/illust_72068885_20191017_131812.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 361.95 1 361.95px;">
+                        <img src="static/ryuzu/917362.png" alt="">
+                    </figure>
+                    <figure style="flex: 329.28 1 329.28px;">
+                        <img src="static/pixiv/illust_74981463_20191010_180604.png" alt="">
+                    </figure>
+                    <figure style="flex: 201.44 1 201.44px;">
+                        <img src="static/pixiv/illust_73112550_20191017_132201.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 134.56 1 134.56px;">
+                        <img src="static/pixiv/illust_58205189_20191117_161917.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 170.19 1 170.19px;">
+                        <img src="static/pixiv/illust_75746945_20191026_131754.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.54 1 155.54px;">
+                        <img src="static/pixiv/illust_77361639_20191026_131342.png" alt="">
+                    </figure>
+                    <figure style="flex: 220.00 1 220.00px;">
+                        <img src="static/pixiv/illust_76970188_20191105_175035.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 134.89 1 134.89px;">
+                        <img src="static/pixiv/illust_77544221_20191117_162451.png" alt="">
+                    </figure>
+                    <figure style="flex: 171.16 1 171.16px;">
+                        <img src="static/pixiv/illust_76606724_20191027_110006.png" alt="">
+                    </figure>
+                    <figure style="flex: 107.11 1 107.11px;">
+                        <img src="static/pixiv/illust_71850098_20191017_131539.jpg" alt="">
+                    </figure>
+                    <figure style="flex: 220.99 1 220.99px;">
+                        <img src="static/pixiv/illust_76418587_20191027_110252.png" alt="">
+                    </figure>
+                    <figure style="flex: 155.78 1 155.78px;">
+                        <img src="static/pixiv/illust_76629400_20191026_131307.jpg" alt="">
+                    </figure>
                 </div>
-            </article>
-        </section>
-        <section class="post_list">
-            <div class="posts">
-                <figure style="flex: 307.87 1 307.87px;">
-                    <a href="#">
-                        <img src="static/ryuzu/916993.png" alt="">
-                    </a>
-                    <!--<div class="thumb-info">
-                        <span>RyuZU²</span>
-                        <span>1920x1080</span>
-                        <span>1.5M</span>
-                    </div>-->
-                </figure>
-                <figure style="flex: 309.68 1 309.68px;">
-                    <img src="static/ryuzu/916500.jpg" alt="">
-                </figure>
-                <figure style="flex: 157.98 1 157.98px;">
-                    <img src="static/pixiv/illust_76819896_20191017_131929.jpg" alt="">
-                </figure>
-                <figure style="flex: 391.11 1 391.11px;">
-                    <img src="static/ryuzu/916132.png" alt="">
-                </figure>
-                <figure style="flex: 220.00 1 220.00px;">
-                    <img src="static/pixiv/illust_75885180_20191105_174853.jpg" alt="">
-                </figure>
-                <figure style="flex: 334.97 1 334.97px;">
-                    <img src="static/ryuzu/916486.png" alt="">
-                </figure>
-                <figure style="flex: 155.53 1 155.53px;">
-                    <img src="static/pixiv/illust_71840908_20191117_162206.png" alt="">
-                </figure>
-                <figure style="flex: 391.11 1 391.11px;">
-                    <img src="static/ryuzu/916269.jpg" alt="">
-                </figure>
-                <figure style="flex: 131.98 1 131.98px;">
-                    <img src="static/pixiv/illust_72206228_20191026_131238.jpg" alt="">
-                </figure>
-                <figure style="flex: 391.11 1 391.11px;">
-                    <img src="static/ryuzu/916234.png" alt="">
-                </figure>
-                <figure style="flex: 157.75 1 157.75px;">
-                    <img src="static/pixiv/illust_66441619_20191117_162011.png" alt="">
-                </figure>
-                <figure style="flex: 340.92 1 340.92px;">
-                    <img src="static/ryuzu/917345.png" alt="">
-                </figure>
-                <figure style="flex: 155.28 1 155.28px;">
-                    <img src="static/pixiv/illust_71851314_20191017_131351.jpg" alt="">
-                </figure>
-                <figure style="flex: 356.46 1 356.46px;">
-                    <img src="static/ryuzu/917364.png" alt="">
-                </figure>
-                <figure style="flex: 155.55 1 155.55px;">
-                    <img src="static/pixiv/illust_74700365_20191026_131807.jpg" alt="">
-                </figure>
-                <figure style="flex: 391.11 1 391.11px;">
-                    <img src="static/ryuzu/916232.png" alt="">
-                </figure>
-                <figure style="flex: 229.12 1 229.12px;">
-                    <img src="static/pixiv/illust_73298123_20191017_131918.jpg" alt="">
-                </figure>
-                <figure style="flex: 318.79 1 318.79px;">
-                    <img src="static/ryuzu/917571.png" alt="">
-                </figure>
-                <figure style="flex: 155.56 1 155.56px;">
-                    <img src="static/pixiv/illust_72068885_20191017_131812.jpg" alt="">
-                </figure>
-                <figure style="flex: 361.95 1 361.95px;">
-                    <img src="static/ryuzu/917362.png" alt="">
-                </figure>
-                <figure style="flex: 329.28 1 329.28px;">
-                    <img src="static/pixiv/illust_74981463_20191010_180604.png" alt="">
-                </figure>
-                <figure style="flex: 201.44 1 201.44px;">
-                    <img src="static/pixiv/illust_73112550_20191017_132201.jpg" alt="">
-                </figure>
-                <figure style="flex: 134.56 1 134.56px;">
-                    <img src="static/pixiv/illust_58205189_20191117_161917.jpg" alt="">
-                </figure>
-                <figure style="flex: 170.19 1 170.19px;">
-                    <img src="static/pixiv/illust_75746945_20191026_131754.png" alt="">
-                </figure>
-                <figure style="flex: 155.54 1 155.54px;">
-                    <img src="static/pixiv/illust_77361639_20191026_131342.png" alt="">
-                </figure>
-                <figure style="flex: 220.00 1 220.00px;">
-                    <img src="static/pixiv/illust_76970188_20191105_175035.jpg" alt="">
-                </figure>
-                <figure style="flex: 134.89 1 134.89px;">
-                    <img src="static/pixiv/illust_77544221_20191117_162451.png" alt="">
-                </figure>
-                <figure style="flex: 171.16 1 171.16px;">
-                    <img src="static/pixiv/illust_76606724_20191027_110006.png" alt="">
-                </figure>
-                <figure style="flex: 107.11 1 107.11px;">
-                    <img src="static/pixiv/illust_71850098_20191017_131539.jpg" alt="">
-                </figure>
-                <figure style="flex: 220.99 1 220.99px;">
-                    <img src="static/pixiv/illust_76418587_20191027_110252.png" alt="">
-                </figure>
-                <figure style="flex: 155.78 1 155.78px;">
-                    <img src="static/pixiv/illust_76629400_20191026_131307.jpg" alt="">
-                </figure>
-            </div>
-            <div class="pagin">
-                <a href="#"><span class="fa fa-chevron-left"></span></a>
-                <a href="#">1</a>
-                <a href="#">2</a>
-                <a href="#">3</a>
-                <a href="#">4</a>
-                <a href="#">5</a>
-                <a href="#"><span class="fa fa-chevron-right"></span></a>
-            </div>
-        </section>
+                <div class="pagin">
+                    <a href="#"><span class="fa fa-chevron-left"></span></a>
+                    <a href="#">1</a>
+                    <a href="#">2</a>
+                    <a href="#">3</a>
+                    <a href="#">4</a>
+                    <a href="#">5</a>
+                    <a href="#"><span class="fa fa-chevron-right"></span></a>
+                </div>
+            </section>
+        </div>
     </div>
 
     <footer>
diff --git a/yadc/templates/post.html b/yadc/templates/post.html
index 295c42f..e73f9a3 100644
--- a/yadc/templates/post.html
+++ b/yadc/templates/post.html
@@ -35,76 +35,99 @@
         <span id="nav-menu" class="fa fa-bars"></span>
     </header>
     <div class="main_wrap">
-        <section class="tag_panel">
-            <article class="tags">
-                <h4>Tags</h4>
-                <div class="tag_container">
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">neko</span>
-                        <span class="count">10</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">works</span>
-                        <span class="count">2</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">anime</span>
-                        <span class="count">4</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">manga</span>
-                        <span class="count">7</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">original</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">azur lane</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">figure</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">touhou</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">photoshop</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">close</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">cropped</span>
-                        <span class="count">5</span>
-                    </a>
-                    <a href="#">
-                        <span class="fa fa-tag"></span>
-                        <span class="name">waifu2x</span>
-                        <span class="count">5</span>
-                    </a>
-
+        <div class="important_subwrap">
+            <section class="side_panel">
+                <article class="post_desc">
+                    <!-- <h4>Description</h4> -->
+                    <!-- <img src="/static/profile.jpg" alt=""> -->
+                    <div class="id">Id: 51432</div>
+                    <div class="author">Author: Kuxa</div>
+                    <div class="time">Posted: 10 hours ago</div>
+                    <div class="source">Source: <a href="https://www.pixiv.net/en/artworks/78136345">https://www.pixiv.net/en/artworks/78136345</a></div>
+                    
+                </article>
+                <article class="tags">
+                    <h3>Tags</h3>
+                    <div class="tag_container">
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">neko</span>
+                            <span class="count">10</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">works</span>
+                            <span class="count">2</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">anime</span>
+                            <span class="count">4</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">manga</span>
+                            <span class="count">7</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">original</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">azur lane</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">figure</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">touhou</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">photoshop</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">close</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">cropped</span>
+                            <span class="count">5</span>
+                        </a>
+                        <a href="#">
+                            <span class="fa fa-tag"></span>
+                            <span class="name">waifu2x</span>
+                            <span class="count">5</span>
+                        </a>
+                    </div>
+                </article>
+            </section>
+            <section class="post_single">
+                <div class="image">
+                    <!-- <img src="/static/pixiv/illust_72206228_20191026_131238.jpg" alt=""> -->
+                    <img src="/static/ryuzu/916500.jpg" alt="">
                 </div>
+            </section>
+        </div>
+        <section class="comments">
+            <article>
+                <h4>Kuxa</h4>
+                <p>what the fuck actually happened here?</p>
+            </article>
+            <article>
+                <h4>Glum</h4>
+                <p>no tea 4 ya</p>
             </article>
-        </section>
-        <section class="content">
-
         </section>
     </div>