initial commit.

styles/main.scss

@@ -0,0 +1,122 @@
+@import "vars";
+@import "mixins";
+
+.wrapper  {
+  //@include transition( all 0.25s ease-in-out);
+  position: relative;
+  margin: auto;
+  max-width: 1160px;
+  min-height: 100%;
+  height: 100%;
+}
+
+.main {
+  background-color: $light;
+  color: $medium;
+  height: auto;
+  top: 80px !important;
+  bottom: 0;
+  position: absolute;
+
+  > .overflow-y-scroll {
+    background-color: $light;
+    height: 100%;
+  }
+
+  .header {
+    @include clearfix();
+    position: relative;
+    z-index: 500;
+    min-height: 60px;
+    margin: 40px;
+
+    .header-main {
+      height: 60px;
+      @include clearfix();
+    }
+
+    .header-center {
+      text-align: center;
+      pointer-events: none;
+      z-index: 5000;
+      position: absolute;
+      width: 100%;
+      top: 0;
+      * {pointer-events: auto; }
+      ul {
+        margin: auto;
+        display: block;
+        vertical-align: middle;
+        list-style: none;
+        padding-left: 0px;
+      }
+      .profile-avatar {
+        margin: auto;
+        display: block;
+        margin-top: -80px;
+        img {
+          border-radius: 100%;
+        }
+      }
+    }
+
+    .header-center  > ul li span { padding-left: 5px; padding-right: 5px;}
+    .header-left  > ul li span { padding-right: 10px;}
+    .header-right > ul li span { padding-left: 10px;}
+
+    .header-center,
+    .header-right,
+    .header-left {
+      height: 60px;
+      line-height: 60px;
+    }
+
+    .header-right {
+      float: right;
+      @include transition( all 0.25s ease-in-out);
+      @include translateX (0px);
+    }
+
+    .header-left {
+      float: left;
+
+      > h4 {
+        vertical-align: middle;
+        display: inline-block;
+      }
+    }
+  }
+  
+  .content {
+    margin: 40px;
+    //@include transition( all 0.25s ease-in-out);
+    .section {
+      border-bottom: 2px solid rgba(0,0,0,0.04);
+      margin-bottom: 80px;
+      padding-bottom: 80px;
+      @include clearfix();
+      &:last-child {
+        border-bottom: none;
+      }
+
+      form {
+        // border-radius: $radius;
+        //   background-color: white;
+        // display: block;
+        // padding: 40px;
+      }
+    }
+    .img {
+      img {
+        border-radius: $radius;
+      }
+      margin-right: 20px;
+      position: relative;
+      .btn {
+        position: absolute;
+        top: 0px;
+        right: 0px;
+      }
+    }
+  }
+}