styling improved

resources/public/styles/main.less

@@ -23,16 +23,16 @@
 
 .central-element {
     @media screen and (min-width: 1024px) {
-width: @width;
+        width: @width;
     }
     @media screen and (max-width: 1023px) {
-width: 90%;
+        width: 90%;
     }
     margin-left: auto;
     margin-right: auto;
 }
 .thin-border {
-border: 1px solid @foreground;
+    border: 1px solid @foreground;
 }
 // end mixins
 
@@ -41,70 +41,65 @@ border: 1px solid @foreground;
     .thin-border;
 }
 
-code, pre {
-    font-family: "Menlo", "Andale Mono", "Consolas", Fixed, monospace;
-    font-size: 0.9em;
-}
 a {
-color: @link_fresh;
-       text-decoration: none;
-       border-bottom: 1px dotted;
+    color: @link_fresh;
+    text-decoration: none;
+    border-bottom: 1px dotted;
 }
 a:hover {
-color: @link_hover;
-  }
+    color: @link_hover;
+}
 a:visited {
-color: @link_visited;
-  }
+    color: @link_visited;
+}
 #draft {
     margin-bottom: 3em;
 }
 .button {
-cursor: pointer;
+    cursor: pointer;
 }
 .ui-elem {
     .helvetica;
     border-radius: 3px;
     .thin-border;
-padding: 0.3em;
-opacity: 0.8;
-         font-size: 1em;
-background: @background;
+    padding: 0.3em;
+    opacity: 0.8;
+    font-size: 1em;
+    background: @background;
 }
 .landing-button, textarea, fieldset {
-border: none;
+    border: none;
 }
 .landing-button {
     box-shadow: 0 2px 5px #aaa;
     text-decoration: none;
     font-size: 1.5em;
-background: #0a2;
-            border-radius: 10px;
-padding: 10px;
-         .helvetica;
+    background: #0a2;
+    border-radius: 10px;
+    padding: 10px;
+    .helvetica;
 }
 .landing-button:hover {
-background: #0b2;
+    background: #0b2;
 }
 #links {
     .helvetica;
-width: 100%;
-       font-size: 0.8em;
-       padding-bottom: 1em;
-       text-align: center;
-       @media screen and (max-width: 767px) {
-           font-size: 0.4em;
-       }
-
+    width: 100%;
+    font-size: 0.8em;
+    padding-bottom: 1em;
+    text-align: center;
+    @media screen and (max-width: 767px) {
+        font-size: 0.4em;
+    }
 }
 #links a {
-border: none;
+    border: none;
 }
 html, body {
-background: @background;
-color: @foreground;
-margin: 0;
-padding: 0;
+    background: @background;
+    color: @foreground;
+    margin: 0;
+    padding: 0;
 }
 #hero {
     padding-top: 5em;
@@ -120,7 +115,7 @@ h1, h2, h3, h4, h5, h6 {
 
 #hero h2 {
     .helvetica;
-margin: 2em;
+    margin: 2em;
 }
 article {
     font-family: @text_font, 'Georgia';
@@ -135,7 +130,7 @@ article p {
 article > h1:first-child {
     text-align: center;
     font-size: 2em;
-margin: 2em;
+    margin: 2em;
 }
 .centered {
     text-align: center;
@@ -143,26 +138,30 @@ margin: 2em;
 .bottom-space {
     margin-bottom: 7em;
 }
+code, pre {
+    font-family: monospace;
+    background: @background_halftone;
+    font-size: @font_size;
+}
 pre {
     border-radius: 3px;
-padding: 0.5em;
-border: 1px dotted @foreground_halftone;
-background: @background_halftone;
+    padding: 0.5em;
+    border: 1px dotted @foreground_halftone;
 }
 *:focus {
-outline: 0px none transparent;
+    outline: 0px none transparent;
 }
 textarea {
     @media screen and (min-width: 1024px) {
-width: @width;
+        width: @width;
     }
     border-radius: 5px;
     font-family: Courier;
     font-size: 1em;
-height: 500px;
+    height: 500px;
 }
 .hidden, #links {
-display: none;
+    display: none;
 }
 #dashed-line {
     border-bottom: 1px dashed @foreground_halftone;
@@ -173,17 +172,17 @@ h1, h2, h3, h4, h5, h6 {
     font-family: @header_font,'Noticia Text','PT Serif','Georgia';
 }
 table {
-width: 100%;
-       border-collapse: collapse;
+    width: 100%;
+    border-collapse: collapse;
 }
 th {
-padding: 0.3em;
-         background-color: @background_halftone;
+    padding: 0.3em;
+    background-color: @background_halftone;
 }
 td {
     border-top: 1px dotted @foreground_halftone;
-padding: 0.3em;
+    padding: 0.3em;
 }
 .middot {
-padding: 0.5em;
+    padding: 0.5em;
 }