diff --git a/index.html b/index.html
index 4b38383..6f06e1a 100644
--- a/index.html
+++ b/index.html
@@ -42,20 +42,20 @@
                                                 <li><a href="#">Run Scheduler</a></li>
                                             </ul>
                                         </li>
-                                        <li>
-                                            <a href="#">Rpoerting</a>
-                                            <ul>
-                                                <li><a href="#">Inventory Report</a></li>
-                                                <li><a href="#">Spare Part Moves</a></li>
-                                            </ul>
-                                        </li>
+                                    </ul>
+                                <li>
+                                    <a href="#">Reporting</a>
+                                    <ul>
+                                        <li><a href="#">Inventory Report</a></li>
+                                        <li><a href="#">Spare Part Moves</a></li>
                                     </ul>
                                 </li>
-                            </ul>
                         </li>
                     </ul>
                 </li>
             </ul>
+            </li>
+            </ul>
         </nav>
     </section>
 </body>
diff --git a/style.scss b/style.scss
index 010a44e..7ced90f 100644
--- a/style.scss
+++ b/style.scss
@@ -15,8 +15,11 @@ section.sidebar {
 
 $text-color: #1f1f1f;
 $border-color: #cdcdcd;
-$subnav-indent: 16px;
+$subnav-indent: 10px;
 $icon-width: 50px;
+$level-one-indent: $icon-width;
+$border-img: url("../img/border.png");
+$dot-img: url("../img/dot.png");
 
 nav.main {
     li {
@@ -92,17 +95,24 @@ nav.main {
         }
 
         > li {
+            // default: just border line
+            background-image: $border-img;
+            background-repeat: repeat-y;
+            background-position: $level-one-indent / 2 center;
+
             a {
-                padding-left: $subnav-indent;
+                padding-left: $level-one-indent;
             }
 
             // subnav level 2
             > ul {
-                // padding-left: $subnav-indent;
                 > li {
+                    background-image: $border-img;
+                    background-repeat: repeat-y;
+                    background-position: $subnav-indent * 5 center;
                     a {
                         color: blue;
-                        padding-left: $subnav-indent * 2;
+                        padding-left: $subnav-indent * 7;
                     }
                     &:first-child a {
                         // reset parent properties
@@ -111,16 +121,22 @@ nav.main {
                     // subnav level 3
                     > ul {
                         > li {
+                            background-image: $border-img;
+                            background-repeat: repeat-y;
+                            background-position: $subnav-indent * 7 center;
                             a {
                                 color: red;
-                                padding-left: $subnav-indent * 3;
+                                padding-left: $subnav-indent * 9;
                             }
                             // subnav level 4
                             > ul {
                                 > li {
+                                    background-image: $border-img;
+                                    background-repeat: repeat-y;
+                                    background-position: $subnav-indent * 9 center;
                                     a {
                                         color: green;
-                                        padding-left: $subnav-indent * 4;
+                                        padding-left: $subnav-indent * 11;
                                     }
                                 }
                             }