From 5fd812f763d335db6736775cf4868207f7b6346e Mon Sep 17 00:00:00 2001
From: Benedikt D Valdez <benediktvaldez@gmail.com>
Date: Wed, 18 May 2016 00:58:40 +0000
Subject: [PATCH] Several responsive style tweaks

Relates to #5
---
 src/styles/_config.scss                      |  2 ++
 src/styles/components/header/_index.scss     |  4 ++--
 src/styles/components/html/_index.scss       | 10 +++++++++-
 src/styles/components/main/_index.scss       |  6 +++++-
 src/styles/components/typography/_index.scss | 10 +++++++---
 5 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/styles/_config.scss b/src/styles/_config.scss
index 8189f96..3f080e8 100644
--- a/src/styles/_config.scss
+++ b/src/styles/_config.scss
@@ -1,6 +1,8 @@
 
 // Font
 $font-size: 18px;
+$font-size-small: 16px;
+$font-size-large: 22px;
 
 // SVEF colors
 $color-svef: #E7792B;
diff --git a/src/styles/components/header/_index.scss b/src/styles/components/header/_index.scss
index e7d29a6..c058f2a 100644
--- a/src/styles/components/header/_index.scss
+++ b/src/styles/components/header/_index.scss
@@ -43,7 +43,7 @@ header {
     z-index: 3;
 
     margin: auto;
-    width: 110px;
+    width: 120px;
 
     animation-duration: 1.25s;
     animation-iteration-count: 1;
@@ -74,7 +74,7 @@ header {
     bottom: 0;
     z-index: 2;
 
-    padding-right: 110px;
+    padding-right: 120px;
 
     opacity: 1;
     transition: opacity 500ms ease 500ms;
diff --git a/src/styles/components/html/_index.scss b/src/styles/components/html/_index.scss
index 16af047..121211e 100644
--- a/src/styles/components/html/_index.scss
+++ b/src/styles/components/html/_index.scss
@@ -15,10 +15,18 @@ html {
 
 body {
   margin: 0;
-  padding: 0;
+  padding: $spacing/2 0 0;
 
   width: 100%;
   height: 100%;
+
+  @include respond-to(small) {
+    padding: $spacing/2 $spacing/2 0;
+  }
+
+  @include respond-to(medium) {
+    padding: $spacing $spacing 0;
+  }
 }
 
 // Default box-sizing to border-box, except for images and hr
diff --git a/src/styles/components/main/_index.scss b/src/styles/components/main/_index.scss
index f56dcb5..590951b 100644
--- a/src/styles/components/main/_index.scss
+++ b/src/styles/components/main/_index.scss
@@ -6,7 +6,7 @@ main {
   z-index: 1;
 
   margin: 0 auto;
-  padding: 0 0 ($footer-height + $spacing);
+  padding: 0 0 $spacing;
 
   max-width: $page-max-width;
   min-width: $page-min-width;
@@ -14,6 +14,10 @@ main {
 
   color: $color-gray;
 
+  @include respond-to(medium) {
+    padding-bottom: $footer-height + $spacing;
+  }
+
   > .inner{
     position: relative;
     z-index: 1;
diff --git a/src/styles/components/typography/_index.scss b/src/styles/components/typography/_index.scss
index 3d77ec5..97f924c 100644
--- a/src/styles/components/typography/_index.scss
+++ b/src/styles/components/typography/_index.scss
@@ -83,16 +83,20 @@ hgroup {
 p {
   margin: 0 auto $spacing;
   font-size: $font-size;
-  font-weight: 300;
+  font-weight: 400;
   line-height: 1.875;
 }
 
+b, strong {
+  font-weight: 700;
+}
+
 a {
   color: inherit;
 }
 
-.text-small { font-size: $font-size * 0.75; }
-.text-large { font-size: $font-size * 1.125; }
+.text-small { font-size: $font-size-small; }
+.text-large { font-size: $font-size-large; }
 
 .text-center { text-align: center; }
 .text-left { text-align: left; }