Add !default flag to allow Sass variable overrides

This allows a user of the theme to customize the value of a variable
defined in variables.scss by defining it before the `@import` statement:

```scss
---
---

$section-headings-color: #0086b3;

@import "{{ site.theme }}";
```

Also adds a note to the README that should resolve pages-themes#9.

README.md

@@ -65,6 +65,16 @@ If you'd like to change the theme's HTML layout:
 3. Paste the default layout content copied in the first step
 4. Customize the layout as you'd like
 
+### Sass variables
+
+If you'd like to change the theme's [Sass variables](https://github.com/pages-themes/cayman/blob/master/_sass/variables.scss), set new values before the `@import` line in your stylesheet:
+
+```scss
+$section-headings-color: #0086b3;
+
+@import "{{ site.theme }}";
+```
+
 ## Roadmap
 
 See the [open issues](https://github.com/pages-themes/cayman/issues) for a list of proposed features (and known issues).

_sass/variables.scss

@@ -1,23 +1,23 @@
 // Breakpoints
-$large-breakpoint: 64em;
-$medium-breakpoint: 42em;
+$large-breakpoint: 64em !default;
+$medium-breakpoint: 42em !default;
 
 // Headers
-$header-heading-color: #fff;
-$header-bg-color: #159957;
-$header-bg-color-secondary: #155799;
+$header-heading-color: #fff !default;
+$header-bg-color: #159957 !default;
+$header-bg-color-secondary: #155799 !default;
 
 // Text
-$section-headings-color: #159957;
-$body-text-color: #606c71;
-$body-link-color: #1e6bb8;
-$blockquote-text-color: #819198;
+$section-headings-color: #159957 !default;
+$body-text-color: #606c71 !default;
+$body-link-color: #1e6bb8 !default;
+$blockquote-text-color: #819198 !default;
 
 // Code
-$code-bg-color: #f3f6fa;
-$code-text-color: #567482;
+$code-bg-color: #f3f6fa !default;
+$code-text-color: #567482 !default;
 
 // Borders
-$border-color: #dce6f0;
-$table-border-color: #e9ebec;
-$hr-border-color: #eff0f1;
+$border-color: #dce6f0 !default;
+$table-border-color: #e9ebec !default;
+$hr-border-color: #eff0f1 !default;