namespace css to get debugger to look right

Gemfile.lock

@@ -7,7 +7,7 @@ GIT
 
 GIT
   remote: https://github.com/ruby-x/rubyx
-  revision: db459fcd3d9c90a882871a0f5b3832d65bdfc3f7
+  revision: 9687d6611f2d03612774bb4539a430ad898161d2
   specs:
     rubyx (0.6.0)
       parser (~> 2.3.0)

app/assets/stylesheets/hacker.sass

@@ -11,31 +11,17 @@ $blockquote-border: $dove-grey !default
 body
   margin: 0
   padding: 0
-  background: $body-background url("bkg.png") 0 0
+  background: $body-background 0 0
   color: $body-foreground
   font-size: 16px
   line-height: 1.4
   font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace
 
 
-/* General & 'Reset' Stuff */
+  //  Header, <header>
-
+  //  header   - container
-
+  //  h1       - project name
-section
+  //  h2       - project description
-  display: block
-  margin: 0 0 20px 0
-
-
-
-li
-  line-height: 1.4
-
-
-
-//  Header, <header>
-//  header   - container
-//  h1       - project name
-//  h2       - project description
 
 
 header
@@ -64,60 +50,73 @@ header
     color: #666
 
 
-#downloads .btn
+/* General & 'Reset' Stuff */
+
+main , header , footer
+
+  section
+    display: block
+    margin: 0 0 20px 0
+
+
+
+  li
+    line-height: 1.4
+
+  #downloads .btn
     display: inline-block
     text-align: center
     margin: 0
 
 
-section img
+  section img
     max-width: 100%
 
 
-h1, h2, h3, h4, h5, h6
+  h1, h2, h3, h4, h5, h6
     font-weight: normal
     font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace
     color: $header
     letter-spacing: -0.03em
     text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(181, 232, 83, 0.1), 0 0 10px rgba(181, 232, 83, 0.1)
 
-h1
+  h1
     font-size: 30px
-h2
+  h2
     font-size: 24px
-h3
+  h3
     font-size: 18px
-h4
+  h4
     font-size: 14px
-h5
+  h5
     font-size: 12px
     text-transform: uppercase
     margin: 0 0 5px 0
-h6
+  h6
     font-size: 12px
     text-transform: uppercase
     color: #999
     margin: 0 0 5px 0
 
 
-dt
+  dt
     font-style: italic
     font-weight: bold
 
-ul li
+  ul li
     list-style: none
     margin-left: -30px
     &:before
       color: #b5e853
       content: ">> "
 
-blockquote
+  blockquote
     color: $blockquote-color
     padding-left: 10px
     border-left: 1px dotted $blockquote-border
 
 
-pre
+  pre
     background: rgba(0, 0, 0, 0.9)
     border: 1px solid rgba(255, 255, 255, 0.15)
     padding: 10px
@@ -129,7 +128,7 @@ pre
     overflow-y: hidden
 
 
-code.highlighter-rouge
+  code.highlighter-rouge
     background: rgba(0,0,0,0.9)
     border: 1px solid rgba(255, 255, 255, 0.15)
     padding: 0px 3px
@@ -138,31 +137,31 @@ code.highlighter-rouge
     border-radius: 2px
 
 
-table
+  table
     width: 100%
     margin: 0 0 20px 0
 
 
-th
+  th
     text-align: left
     border-bottom: 1px dashed #b5e853
     padding: 5px 10px
 
 
-td
+  td
     padding: 5px 10px
 
 
-hr
+  hr
     height: 0
     border: 0
     border-bottom: 1px dashed #b5e853
     color: #b5e853
 
 
-/* Buttons*/
+  /* Buttons*/
 
-.btn
+  .btn
     display: inline-block
     background: -webkit-linear-gradient(top, rgba(40, 40, 40, 0.3), rgba(35, 35, 35, 0.3) 50%, rgba(10, 10, 10, 0.3) 50%, rgba(0, 0, 0, 0.3))
     padding: 8px 18px
@@ -178,11 +177,11 @@ hr
     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75)
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05)
 
-.btn:hover
+  .btn:hover
     background: -webkit-linear-gradient(top, rgba(40, 40, 40, 0.6), rgba(35, 35, 35, 0.6) 50%, rgba(10, 10, 10, 0.8) 50%, rgba(0, 0, 0, 0.8))
 
 
-.btn .icon
+  .btn .icon
     display: inline-block
     width: 16px
     height: 16px
@@ -190,28 +189,28 @@ hr
     float: left
 
 
-.btn-github .icon
+  .btn-github .icon
     opacity: 0.6
     background: url("../images/blacktocat.png") 0 0 no-repeat
 
 
-/* Links a, a:hover, a:visited */
+  /* Links a, a:hover, a:visited */
 
-a
+  a
     color: #63c0f5
     text-shadow: 0 0 5px rgba(104, 182, 255, 0.5)
 
 
-/* Clearfix */
+  /* Clearfix */
 
-.cf:before, .cf:after
+  .cf:before, .cf:after
     content: ""
     display: table
 
 
-.cf:after
+  .cf:after
     clear: both
 
 
-.cf
+  .cf
     zoom: 1

app/assets/stylesheets/rouge.sass

@@ -4,7 +4,8 @@
 //
 @import "colors"
 
-.highlight
+main , header , footer
+  .highlight
     $plaintext: $alto !default
     $string: $chelsea-cucumber !default
     $literal: $chelsea-cucumber !default

app/assets/stylesheets/site.sass

@@ -1,10 +1,6 @@
 @import "susy"
 $susy: ( columns: 12, gutters: 1/4,  gutter-position: inside )
 
-a
-  color: #53a5ff
-  text-decoration: none
-
 .container
   width: 90%
   max-width: 1000px
@@ -25,7 +21,12 @@ a
     @media only screen and (max-width: 880px)
       @include span(12)
 
-ul.nav
+main , header , footer
+  a
+    color: #53a5ff
+    text-decoration: none
+
+  ul.nav
     text-align: center
     li
       display: inline
@@ -42,27 +43,22 @@ ul.nav
           border-bottom: 0px
         small
           color: lightgrey
-.center
+  .center
     text-align: center
 
-.row
+  .row
     clear: both
     width: 100%
 
-.tripple
+  .tripple
     @include span(4)
     @media only screen and (max-width: 880px)
       @include span(12)
 
-.main
+  .full_width
-  width: 78%
-.menu
-  width: 20%
-
-.full_width
     img
       width: 100%
-.debug_pic
+  .debug_pic
     border-color: white
     border-width: 8px
     border-style: solid
@@ -70,18 +66,18 @@ ul.nav
     img
       width: 100%
 
-.blog_nav
+  .blog_nav
     .next_post , .prev_post
       width: 20%
     .next_post
       float: right
     .prev_post
       float: left
-.blog_post
+  .blog_post
     h1
       span
         font-size: 18px
-.blog_index
+  .blog_index
     h1
       font-size: 20px
     h2