From e4ce16b517ea7866ee1b55295d73738f079ffbae Mon Sep 17 00:00:00 2001
From: John O'Nolan <john@onolan.org>
Date: Sat, 10 Aug 2013 18:42:21 +0200
Subject: [PATCH] First pass at refactoring styles

---
 assets/css/screen.css |   43 ++
 assets/css/style.css  | 1208 -----------------------------------------
 default.hbs           |    6 +-
 post.hbs              |   29 +-
 4 files changed, 57 insertions(+), 1229 deletions(-)
 create mode 100644 assets/css/screen.css
 delete mode 100644 assets/css/style.css

diff --git a/assets/css/screen.css b/assets/css/screen.css
new file mode 100644
index 0000000..a62fcd7
--- /dev/null
+++ b/assets/css/screen.css
@@ -0,0 +1,43 @@
+/* ==========================================================================
+   Table of Contents
+   ========================================================================== */
+
+/*
+   0.   Includes
+   1.   Something
+   2.   Something else
+ */
+
+/* ==========================================================================
+   0. Includes
+   ========================================================================== */
+
+@import url(normalize.css);
+
+/* ==========================================================================
+   1. General
+   ========================================================================== */
+
+html {font-size: 62.5%;}
+
+body {
+    font-family: 'Open Sans', sans-serif;
+    font-size: 2rem;
+    line-height: 1.6em;
+    color: #50585D;
+}
+
+h1 {
+    font-size: 5rem;
+    line-height: 1.2em;
+    letter-spacing: -1px;
+}
+
+/* ==========================================================================
+   1. General
+   ========================================================================== */
+
+.post {
+    max-width: 700px;
+    margin: 0 auto;
+}
\ No newline at end of file
diff --git a/assets/css/style.css b/assets/css/style.css
deleted file mode 100644
index e8f9499..0000000
--- a/assets/css/style.css
+++ /dev/null
@@ -1,1208 +0,0 @@
-/* ==========================================================================
-   Table of Contents
-   ========================================================================== */
-
-/*
-   1.   Includes
-   2.   Something
-   3.   Something else
- */
-
-/* ==========================================================================
-   1. Includes
-   ========================================================================== */
-
-@import url(normalize.css);
-
-/* ==========================================================================
-   2. Typography
-   ========================================================================== */
-
-body {
-    color: #333;
-    font-style: normal;
-    font-weight: 400;
-    font-family: Georgia;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-    font-family: galette;
-    text-transform: uppercase;
-}
-
-h1, .h1 {
-    font-size: 69px;
-    line-height: 75px;
-    margin-bottom: 0px;
-    font-weight: 500;
-    letter-spacing: -1px;
-}
-
-h2, .h2 {
-    margin-top: 50px;
-    margin-bottom: 25px;
-    font-size: 34px;
-    line-height: 34px;
-    letter-spacing: 0;
-    font-weight: 500;
-}
-
-h3, .h3 {
-    font-size: 20px;
-    line-height: 20px;
-    margin: 1.5em 0 6px 0;
-    font-weight: normal;
-}
-
-h4, .h4 {
-    font-size: 16px;
-    line-height: 26px;
-    margin: 1.5em 0 6px 0;
-    font-weight: normal;
-}
-
-h5, .h5 {
-    font-size: 14px;
-    line-height: 18px;
-    margin: 1.5em 0 6px 0;
-    font-weight: normal;
-}
-
-h6, .h6 {
-    font-size: 14px;
-    line-height: 18px;
-    margin: 1.5em 0 6px 0;
-    font-weight: normal;
-}
-
-h1 a,
-h2 a,
-h3 a,
-h4 a,
-h5 a,
-h6 a {
-    color:#333;
-    text-decoration: none;
-}
-
-h1 a:hover,
-h2 a:hover,
-h3 a:hover,
-h4 a:hover,
-h5 a:hover,
-h6 a:hover {
-    text-decoration: underline;
-}
-
-a {
-    color:#222;
-}
-
-small {
-    font-family: sans-serif;
-    font-size: 11px;
-    color:#aaa;
-}
-
-blockquote {
-    margin:1.5em 0;
-    padding:0 0 0 1.5em;
-    font-size: 20px;
-    font-family: sans-serif;
-    font-style: italic;
-    font-weight: 400;
-    text-align: left;
-    border-left:#eee 8px solid;
-}
-
-pre code {
-    display: block;
-    padding:1em 0;
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    background: #f5f5f5;
-    position: relative;
-}
-
-pre code:before {
-    content: " ";
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    background: #f5f5f5;
-    position: absolute;
-    top: -1px;
-    bottom: -1px;
-    right:100%;
-    width: 9999px;
-}
-
-pre code:after {
-    content: " ";
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    background: #f5f5f5;
-    position: absolute;
-    top: -1px;
-    bottom: -1px;
-    left:100%;
-    width: 9999px;
-}
-
-figure {
-    position: relative;
-}
-
-figcaption {
-    position: absolute;
-    bottom:0;
-    left:0;
-    right:0;
-    padding:8px 10px;
-    font-size: 12px;
-    font-family: sans-serif;
-    background: rgba(0,0,0,0.5);
-    color:#e4e4e4;
-    -webkit-transition: background .5s, color .5s;
-    -moz-transition: background .5s, color .5s;
-    -ms-transition: background .5s, color .5s;
-    transition: background .5s, color .5s;
-}
-
-figcaption a {
-    color:#fff;
-}
-
-figure:hover figcaption {
-    background: rgba(0,0,0,0.7);
-    color:#efefef;
-    -webkit-transition: background .5s, color .5s;
-    -moz-transition: background .5s, color .5s;
-    -ms-transition: background .5s, color .5s;
-    transition: background .5s, color .5s;
-}
-
-input, textarea {
-    -webkit-appearance: none;
-    outline: none;
-}
-
-input[type="text"],
-textarea {
-    height:20px;
-    padding:8px;
-    font-size: 14px;
-    text-shadow:none;
-    background: #fff;
-    border:#dadada 1px solid;
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    -ms-border-radius: 3px;
-    border-radius: 3px;
-}
-
-input[type="text"]:focus,
-textarea:focus {
-    border-color: #aaa;
-}
-
-input[type="submit"] {
-    height:38px;
-    padding: 0;
-    color:#fff;
-    font-size: 14px;
-    text-shadow:none;
-    border:#000 1px solid;
-    -webkit-border-radius: 3px;
-    -moz-border-radius: 3px;
-    -ms-border-radius: 3px;
-    border-radius: 3px;
-    background: #222;
-    background: -moz-linear-gradient(bottom, #000, #333);
-    background: -webkit-gradient(linear, left bottom, left top, from(#000), to(#333));
-}
-
-input[type="submit"]:hover {
-    cursor:pointer;
-    background: #444;
-    background: -moz-linear-gradient(bottom, #111, #444);
-    background: -webkit-gradient(linear, left bottom, left top, from(#111), to(#444));
-}
-
-/* ==========================================================================
-   3. Layout
-   ========================================================================== */
-
-body {
-    background:#ececee url(../img/texture.png) top left repeat;
-}
-
-body > header {
-    width:280px;
-    padding:60px;
-    position: fixed;
-    top: 0;
-    right:0;
-    bottom:0;
-}
-
-section.content {
-    margin-right:400px;
-    background:#fff;
-    overflow: hidden; /*hide the :before :after elements on the entry header and footer*/
-    -webkit-box-shadow: rgba(0,0,0,0.1) 1px 0 10px;
-    -moz-box-shadow: rgba(0,0,0,0.1) 1px 0 10px;
-    -ms-box-shadow: rgba(0,0,0,0.1) 1px 0 10px;
-    box-shadow: rgba(0,0,0,0.1) 1px 0 10px;
-}
-
-/* Generic wrapper to control content width */
-
-.wrap {
-    max-width:640px;
-    padding:0 60px;
-    margin:0 auto;
-}
-
-/* ==========================================================================
-   4. Header/Sidebar
-   ========================================================================== */
-
-body > header {
-    font-family: sans-serif;
-    font-size:14px;
-    color:rgba(0,0,0,0.45);
-}
-
-#logo {
-    display: block;
-    margin-bottom:25px;
-}
-
-#logo img {
-    max-width: 280px;
-    height:auto;
-}
-
-.blog-icon {
-    display: inline;
-    width:12px;
-    height:12px;
-    margin:0 0 0 5px;
-    vertical-align: baseline;
-}
-
-#title {
-    font-family: Galette, sans-serif;
-    font-size: 30px;
-    line-height: 30px;
-    font-style: normal;
-    font-weight: normal;
-    color:#333;
-    text-transform: uppercase;
-    text-decoration: none;
-}
-
-#site-navigation ul {
-    padding: 0;
-    position: relative;
-    z-index: 500;
-}
-
-#site-navigation ul li {
-    border-top:rgba(0,0,0,0.1) 1px solid;
-    margin: 0;
-    line-height: 1.3em;
-}
-
-#site-navigation ul li:first-child {
-    border:none;
-}
-
-#site-navigation ul li a {
-    display: block;
-    padding:10px 0;
-    color:#333;
-    text-decoration: none;
-    background:transparent;
-    -webkit-transition: padding-left .25s, background .25s;
-    -moz-transition: padding-left .25s, background .25s;
-    -ms-transition: padding-left .25s, background .25s;
-    transition: padding-left .25s, background .25s;
-}
-
-#site-navigation ul li a:hover {
-    padding-left: 10px;
-    background: rgba(0,0,0,0.05);
-    -webkit-transition: padding-left .25s, background .25s;
-    -moz-transition: padding-left .25s, background .25s;
-    -ms-transition: padding-left .25s, background .25s;
-    transition: padding-left .25s, background .25s;
-}
-
-#site-navigation ul li.current-menu-item a {
-    padding-left:28px;
-    background: rgba(0,0,0,0.05) url(../img/icon.png) 10px 14px no-repeat;
-    background-size: 10px;
-}
-
-/* ==========================================================================
-   5. Post Content
-   ========================================================================== */
-
-.post-thumb {
-    margin-bottom:-115px; /* Pull the article header+title up over the post image */
-    min-height:115px; /* Make post layout look normal while image is loading */
-}
-
-.post-thumb img {
-    width:100%;
-    height:auto;
-}
-
-.hentry header {
-    margin:35px 0 0 0;
-    padding:25px 0 0 30px;
-    background: #fff;
-    position: relative;
-    left:-30px;
-    z-index: 300;
-}
-
-.hentry header:after {
-    content: " ";
-    background: #fff;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left:100%;
-    width: 9999px;
-}
-
-.entry-title {
-    margin-top:0;
-}
-
-.entry-meta {
-    font-style: italic;
-    font-size: 12px;
-    line-height: 12px;
-    letter-spacing: 1px;
-    color:#666;
-}
-
-.entry-meta time {
-    font-style: normal;
-    text-transform: uppercase;
-}
-
-.hentry header .entry-meta time {
-    display: inline;
-}
-
-.entry-content {
-    padding-bottom: 60px;
-}
-
-.entry-content p {
-    margin-bottom: 0px;
-    text-indent: 16px;
-}
-
-.entry-content blockquote p {
-    text-indent: -4px;
-}
-
-.entry-content p:nth-of-type(1) {
-    text-indent: 0px;
-}
-
-/* Introduction/Kicker */
-.post .entry-content p:nth-of-type(1),
-.kicker {
-    margin-bottom: 25px;
-    line-height: 33px;
-    font-size: 24px;
-    font-style: normal;
-    font-weight: 400;
-    letter-spacing: 0px;
-}
-
-.post .entry-content div p:nth-of-type(1),
-.post .entry-content blockquote p:nth-of-type(1) {
-    margin-bottom: inherit;
-    line-height: inherit;
-    font-size: inherit;
-    font-style: inherit;
-    font-weight: inherit;
-    letter-spacing: inherit;
-}
-
-/* First paragraph after Introduction */
-.entry-content p:nth-of-type(2),
-.introduction {
-    text-indent: 0px;
-}
-
-/* Tombstone */
-.post .entry-content p:last-child:after,
-.tombstone {
-    content: "";
-    display: inline-block;
-    width:11px;
-    height:11px;
-    margin:0 0 0 8px;
-    vertical-align: baseline;
-    background: url(../img/icon.png) bottom right no-repeat;
-    background-size: 11px 11px;
-}
-/* Prevent Tombstone from appearing in nested elements */
-.entry-content * p:after {display: none!important;}
-
-.entry-content figure {
-    margin: 1.5em 0;
-}
-
-.entry-content figure img {
-    width:100%;
-    height:auto;
-}
-
-.hfeed {
-    padding-bottom: 1px;
-}
-
-.hfeed .entry-content ol,
-.hfeed .entry-content ul,
-.hfeed .entry-content dl {
-    margin: 1em 0;
-    padding: 0 0 0 2em;
-}
-
-.hfeed .entry-content li {
-    max-width: none;
-    padding:0;
-    margin:5px 0 0 0;
-}
-
-.entry-footer {
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    position: relative;
-    font-size:11px;
-    line-height:17px;
-    color:#666;
-}
-
-.entry-footer h4 {
-    font-family: Galette, sans-serif;
-    text-transform: uppercase;
-    letter-spacing: 0;
-    font-style: normal;
-    color:#aaa;
-    line-height:16px;
-    margin:0 0 12px 0;
-}
-
-.entry-footer h5 {
-    font-family: Galette, sans-serif;
-    text-transform: uppercase;
-    letter-spacing: 0;
-    font-style: normal;
-    color:#aaa;
-    margin:13px 0 0 0;
-}
-
-.entry-footer h5:first-child {
-    margin:0;
-}
-
-.entry-footer .entry-meta {
-    font-size:11px;
-    line-height:17px;
-}
-
-.entry-footer p {
-    margin:0;
-}
-
-.entry-footer .share {
-    list-style: none;
-    margin: 0;
-    padding: 0;
-    font-style: normal;
-    letter-spacing: 0;
-}
-
-.entry-footer .share li {
-    float:left;
-    padding:0 0 0 3px;
-}
-
-.entry-footer .share li:after {
-    content: " \2022 "; /* Hex reference for &bull; bullet point to divide list items */
-}
-
-.entry-footer .share li:last-child:after {
-    content: none;
-}
-
-.entry-footer .share li:first-child {
-    padding-left:0;
-    border:none;
-}
-
-.entry-footer:before {
-    content: "";
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    position: absolute;
-    top: -1px;
-    bottom: -1px;
-    right:100%;
-    width: 9999px;
-}
-.entry-footer:after {
-    content: "";
-    border-top:#dadada 1px solid;
-    border-bottom: #dadada 1px solid;
-    position: absolute;
-    top: -1px;
-    bottom: -1px;
-    left:100%;
-    width: 9999px;
-}
-
-.entry-footer .entry-meta {
-    width:30%;
-    padding: 4% 5% 4% 0;
-    float:left;
-    -webkit-box-shadow:#dadada 1px 0 0;
-    -moz-box-shadow:#dadada 1px 0 0;
-    -ms-box-shadow:#dadada 1px 0 0;
-    box-shadow:#dadada 1px 0 0;
-}
-
-.entry-footer .comments {
-    width:60%;
-    padding: 4% 0 4% 5%;
-    float:left;
-    -webkit-box-shadow:#dadada 1px 0 0 inset;
-    -moz-box-shadow:#dadada 1px 0 0 inset;
-    -ms-box-shadow:#dadada 1px 0 0 inset;
-    box-shadow:#dadada 1px 0 0 inset;
-}
-
-/* ==========================================================================
-   6. Single Post
-   ========================================================================== */
-
-
-/* ==========================================================================
-   6. Page
-   ========================================================================== */
-
-.error404 section.content {
-    padding:100px 0 140px 0;
-    text-align: center;
-}
-
-
-/* ==========================================================================
-   7. Post Feed
-   ========================================================================== */
-
-.hfeed {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-}
-
-.hfeed li {
-    max-width: 640px;
-    margin-top:0;
-}
-
-.hfeed li.featured {
-    max-width: none;
-    padding:0;
-}
-
-.hfeed .entry-title {
-    margin-bottom:0;
-}
-
-.hfeed .hentry {
-    margin-bottom:40px;
-}
-
-.hfeed .updated {
-    display: block;
-    color:#aaa;
-    font-size: 14px;
-    line-height: 14px;
-}
-
-.hfeed .featured .updated {
-    display: inline;
-    color: inherit;
-    font-size: inherit;
-    line-height: 12px!important;
-}
-
-#pagination {
-    height:32px;
-    padding:40px;
-    border-top:#dadada 1px solid;
-    text-align: center;
-    color: #aaa;
-}
-
-#pagination a {
-    display: inline-block;
-    padding:8px 12px;
-    font-family: sans-serif;
-    font-size: 12px;
-    line-height: 12px;
-    text-decoration: none;
-    color:#fff;
-    border:#000 1px solid;
-    background: #222;
-    position: relative;
-    left: 0;
-    -webkit-border-radius: 5px;
-    -moz-border-radius: 5px;
-    -ms-border-radius: 5px;
-    border-radius: 5px;
-    -webkit-transition: all 0.25s;
-    -moz-transition: all 0.25s;
-    -ms-transition: all 0.25s;
-    transition: all 0.25s;
-}
-
-.previous-page {
-    float:right;
-}
-
-.next-page {
-    float:left;
-}
-
-#pagination .next-page a:hover {
-    left:-40px;
-    padding-left:52px;
-    margin-right:-40px;
-    border-radius: 0 5px 5px 0;
-    -webkit-transition: all 0.25s;
-    -moz-transition: all 0.25s;
-    -ms-transition: all 0.25s;
-    transition: all 0.25s;
-}
-
-#pagination .previous-page a:hover {
-    left:40px;
-    padding-right:52px;
-    margin-left:-40px;
-    border-radius: 5px 0 0 5px;
-    -webkit-transition: all 0.25s;
-    -moz-transition: all 0.25s;
-    -ms-transition: all 0.25s;
-    transition: all 0.25s;
-}
-
-.page-number {
-    display: inline-block;
-    padding:9px 10px;
-    font-family: sans-serif;
-    font-size: 14px;
-    line-height: 14px;
-    text-align: center;
-}
-
-.loading {
-    padding:0 0 0 40px;
-    line-height: 34px;
-    opacity:0.4;
-    background: url(../img/loading.gif) top left no-repeat;
-}
-
-#infscr-loading {
-    text-align: center;
-}
-
-/* ==========================================================================
-   x. Archive
-   ========================================================================== */
-
-.archive section.content,
-.search section.content,
-.paged section.content {
-    padding-top:60px;
-}
-
-.archive .hfeed {
-    margin:0 0 80px 0;
-    padding-bottom: 1px;
-    box-shadow:#dadada 2px 0 0 inset;
-    position: relative;
-}
-
-.archive .hfeed:after {
-    content: " ";
-    background: #dadada;
-    position: absolute;
-    bottom: 0;
-    left:0;
-    width: 9999px;
-    height:2px;
-}
-
-.archive .hfeed li {
-    overflow: hidden; /* Hide the dots assigned to each li on timeline view with :before */
-}
-
-.archive .hfeed .timestamp {
-    max-width: none;
-    padding:0;
-    margin-bottom:40px;
-    list-style: none;
-    display: inline-block;
-    height:60px;
-    font-family: galette, sans-serif;
-    font-size: 50px;
-    line-height: 70px;
-    color:#ccc;
-    background: #fff;
-    position: relative;
-    left:-30px;
-    overflow: visible; /*Show the extra border added to the right of timestamps with :after */
-}
-
-.archive .hfeed .timestamp:after {
-    content: " ";
-    background: #dadada;
-    position: absolute;
-    top: 30px;
-    left:110%;
-    width: 9999px;
-    height:2px;
-}
-
-.archive .hfeed .hentry {
-    padding-left: 30px;
-    position:relative;
-}
-
-.archive .hfeed .hentry:before {
-    content: " ";
-    display: block;
-    width:12px;
-    height:12px;
-    border-radius:15px;
-    background:#dadada;
-    position: absolute;
-    top:23px;
-    left:-5px;
-}
-
-#searchform {
-    position: relative;
-    margin-bottom: 60px;
-    padding-right:128px;
-}
-
-#searchform #s {
-    display:inline-block;
-    width:100%;
-}
-
-#searchform #searchsubmit {
-    width:100px;
-    display: inline-block;
-    position: absolute;
-    top:0;
-    right:0;
-}
-
-/* ==========================================================================
-   x. Media Queries
-   ========================================================================== */
-
-/*
- * Large Screen Devices
- */
-
-@media only screen and (min-width: 1500px) {
-
-    body > header {
-        left:0;
-        padding:100px;
-    }
-
-    section.content {
-        max-width: 1100px;
-        margin: 60px 100px 60px 480px;
-    }
-
-}
-
-/*
- * Tablets
- */
-
-@media only screen and (max-width: 1100px) {
-
-    body > header {
-        width:140px;
-        padding:30px;
-    }
-
-    #logo img {
-        max-width: 140px;
-    }
-
-    #title {
-        font-size: 25px;
-        line-height: 25px;
-        margin:0px 0 0 0;
-    }
-
-    section.content {
-        margin-right:200px;
-    }
-
-    .wrap {
-        padding:0 30px;
-    }
-
-    .archive section.content,
-    .search section.content,
-    .paged section.content {
-        padding-top:30px;
-    }
-
-    .post-thumb {
-        margin-bottom:0;
-    }
-
-    .hentry header {
-        margin:0 0 0 0;
-    }
-
-    .hentry header:after {
-        display:none;
-    }
-
-    .entry-content {
-        padding-bottom: 40px;
-    }
-
-    #pagination {
-        padding:30px;
-    }
-
-    .nav-previous {
-        top:30px;
-        left:30px;
-    }
-
-    .nav-next {
-        top:30px;
-        right:30px;
-    }
-
-    #searchform {
-        margin-bottom:35px;
-    }
-
-    #sidebar #searchform  #s{
-        font-size: 12px;
-    }
-
-    .archive .hfeed .timestamp {
-        left:-15px;
-    }
-
-    .error404 section.content {
-        padding:80px 0 100px 0;
-    }
-
-}
-
-/*
- * Small Tablets
- */
-
-@media only screen and (max-width: 900px) {
-
-    h1, .h1 {
-        font-size: 54px;
-        line-height: 63px;
-    }
-
-    h2, .h2 {
-        font-size: 30px;
-        line-height: 30px;
-    }
-
-    .archive .hfeed .hentry:before {
-        top:19px;
-    }
-
-}
-
-/*
- * Mobile Devices
- */
-
-@media only screen and (max-width: 700px) {
-
-    h1, .h1 {
-        font-size: 40px;
-        line-height: 46px;
-    }
-
-    h2, .h2 {
-        font-size: 25px;
-        line-height: 25px;
-    }
-
-    h3, .h3 {
-        font-size: 18px;
-        line-height: 18px;
-    }
-
-    h4, .h4 {
-        font-size: 16px;
-        line-height: 26px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    h5, .h5 {
-        font-size: 14px;
-        line-height: 18px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    h6, .h6 {
-        font-size: 14px;
-        line-height: 18px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    /* Introduction/Kicker */
-    .post .entry-content p:nth-of-type(1) {
-        margin-bottom: 20px;
-        line-height: 29px;
-        font-size: 20px;
-    }
-
-    body > header {
-        position: relative;
-        width:auto;
-        padding:20px 20px 0 20px;
-    }
-
-    #logo {
-        float:left;
-        margin: 0 20px 0 0;
-    }
-
-    #logo img {
-        max-width:75px;
-    }
-
-    #title {
-        font-size: 20px;
-        line-height: 20px;
-        margin:10px 0 0 0;
-    }
-
-    #description {
-        max-width: 460px;
-        font-size:1em;
-        line-height: 1.2em;
-        margin: 5px 0 0 0;
-    }
-
-    #site-navigation ul {
-        margin: 20px 0 0 0;
-    }
-
-    #site-navigation ul:after {
-        content: " ";
-        display: table;
-        clear:both;
-    }
-
-    #site-navigation ul li {
-        border:none;
-        float:left;
-    }
-
-    #site-navigation ul li a {
-        padding: 8px 10px;
-        color:#333;
-        -webkit-transition: none;
-        -moz-transition: none;
-        -ms-transition: none;
-        transition: none;
-    }
-
-    #site-navigation ul li a:hover {
-        padding: 8px 10px;
-        -webkit-transition: none;
-        -moz-transition: none;
-        -ms-transition: none;
-        transition: none;
-    }
-
-    #site-navigation ul li.current-menu-item a {
-        padding: 8px 10px;
-        background: #fff;
-    }
-
-    #ghost {
-        display: none;
-    }
-
-    section.content {
-        margin:0;
-    }
-
-    .wrap {
-        padding:0 20px;
-    }
-
-    .archive section.content,
-    .search section.content,
-    .paged section.content {
-        padding-top:20px;
-    }
-
-    .entry-content {
-        padding-bottom: 30px;
-    }
-
-    #pagination {
-        padding:20px;
-    }
-
-    .extended {
-        display: none;
-    }
-
-    #searchform {
-        margin-bottom:25px;
-    }
-
-    .archive .hfeed .hentry {
-        padding-left: 20px;
-    }
-
-    .archive .hfeed .hentry:before {
-        top:14px;
-        left:-6px;
-    }
-
-    .archive .hfeed .timestamp {
-        left:-3px;
-        margin-bottom: 30px;
-        font-size: 30px;
-    }
-
-    .error404 section.content {
-        padding:30px 0 50px 0;
-    }
-
-}
-
-/*
- * Very Small Devices
- */
-
-@media only screen and (max-width: 400px) {
-
-    h1, .h1 {
-        font-size: 30px;
-        line-height: 36px;
-    }
-
-    h2, .h2 {
-        font-size: 20px;
-        line-height: 20px;
-    }
-
-    h3, .h3 {
-        font-size: 16px;
-        line-height: 16px;
-    }
-
-    h4, .h4 {
-        font-size: 15px;
-        line-height: 25px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    h5, .h5 {
-        font-size: 13px;
-        line-height: 16px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    h6, .h6 {
-        font-size: 12px;
-        line-height: 16px;
-        margin: 1.5em 0 6px 0;
-    }
-
-    #logo img {
-        max-width: 60px;
-    }
-
-    #description {
-        font-size:0.9em;
-        line-height: 1.1em;
-    }
-
-    #site-navigation {
-        font-size: 13px;
-    }
-
-    .hfeed .hentry {
-        margin-bottom: 30px;
-    }
-
-    .hfeed .updated {
-        font-size: 13px;
-    }
-
-    .archive .hfeed .hentry:before {
-        top:12px;
-        left:-7px;
-    }
-
-    .entry-footer .entry-meta{
-        width:100%;
-        padding:2em 0;
-        box-shadow: none;
-    }
-
-    .entry-footer .comments {
-        width:100%;
-        padding:2em 0;
-        border-top:#dadada 1px dashed;
-        box-shadow: none;
-    }
-
-    .page-number {display:none;}
-
-}
-
-/* ==========================================================================
-   DO NOT ADD ANY CODE BELOW THIS POINT
-   ========================================================================== */
\ No newline at end of file
diff --git a/default.hbs b/default.hbs
index 16116bf..2d104a3 100644
--- a/default.hbs
+++ b/default.hbs
@@ -10,9 +10,9 @@
     <meta name="description" content="{{settings.description}}" />
     
     {{! Styles'n'Scripts }}
-    <link rel="stylesheet" type="text/css" href="assets/css/style.css">
-    <script type="text/javascript" src="/lib/jquery/jquery.min.js"></script>
-    <script type="text/javascript" src="/js/index.js"></script>
+    <link rel="stylesheet" type="text/css" href="assets/css/screen.css">
+    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700,400">
+    <script type="text/javascript" src="assets/js/index.js"></script>
 </head>
 <body>
     
diff --git a/post.hbs b/post.hbs
index b9bb418..cad5c1a 100644
--- a/post.hbs
+++ b/post.hbs
@@ -1,24 +1,17 @@
 {{!< default}}
-<section class="content">
+
+<main class="content" role="main">
     {{#post}}
 
-        <article class="post type-post status-publish format-standard hentry">
-            {{#if image}}
-            <figure class="post-thumb">
-                <img width="550" height="250" src="/content/images/{{image}}" class="attachment-post-thumbnail wp-post-image" alt="ghostpost">
-            </figure>
-            {{/if}}
-            <div class="wrap">
-                <header>
-                    <h2 class="entry-title h1"><a href="/{{slug}}" rel="bookmark">{{title}}</a></h2>
-                    <span class="entry-meta">Published on <time class="updated" datetime="{{dateFormat published_at format='YYYY-MM-DD'}}">{{dateFormat published_at format='DD MMMM YYYY'}}</time></span>
-                </header>
-
-                <section class="entry-content">
-                    {{content}}
-                </section>
-            </div>
+        <article class="post">
+            <header>
+                <span class="entry-meta">Published on <time class="updated" datetime="{{dateFormat published_at format='YYYY-MM-DD'}}">{{dateFormat published_at format='DD MMMM YYYY'}}</time></span>
+                <h1>{{title}}</h1>
+            </header>
+            <section class="entry-content">
+                {{content}}
+            </section>
         </article>
         
     {{/post}}
-</section>
\ No newline at end of file
+</main>
\ No newline at end of file