diff --git a/README.md b/README.md
index 6c36b5c..42bdfc1 100644
--- a/README.md
+++ b/README.md
@@ -16,6 +16,7 @@ A lightweight and skeletal WordPress boilerplate theme for HTML5 and beyond. The
* Scss compiling and watching, css minification support
* Rollup.js for js for smallest possible bundles
* Image optimisation using imagemin.
+* Base mobile nav out of the box
## Installation
@@ -65,6 +66,14 @@ Then run:
*to optimise images*
+ gulp styles
+
+*to compile styles*
+
+ gulp scripts
+
+*to compile scripts*
+
gulp build
*to create a build (minification, removes map files and comments)*
@@ -90,7 +99,9 @@ Compatible with WordPress 3.2 and above, but always use the latest version.
## Tips & Tricks
-### SVG Fallbacks
+### SVG Fallbacks
+
+Most likely if you need to support IE8
*CSS*
```
diff --git a/assets/styles/base/_base.scss b/assets/styles/base/_base.scss
index 86487fb..41aceab 100644
--- a/assets/styles/base/_base.scss
+++ b/assets/styles/base/_base.scss
@@ -1,54 +1,51 @@
body {
- color: $base-colour;
- font-family: $base-font-family;
- @include font-size($base-font-size);
- line-height: $base-line-height;
- -webkit-text-size-adjust: none;
+ color: $base-colour;
+ font-family: $base-font-family;
+ line-height: $base-line-height;
+ text-size-adjust: none;
+ @include font-size($base-font-size);
}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-hr,
-ul,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+hr,
+ul,
ol,
dl,
address {
- margin-bottom: $base-spacing-unit;
+ margin-bottom: $base-spacing-unit;
}
-
/**
* Basic styles for links
*/
-
a {
- color: $brand-colour;
- text-decoration: none;
- &:hover {
- color: $base-colour;
- text-decoration: underline;
- }
+ color: $brand-colour;
+ text-decoration: none;
+
+ &:hover {
+ color: $base-colour;
+ text-decoration: underline;
+ }
}
-a[href^="tel"]{
- color: inherit;
- text-decoration: none;
- font-family: inherit;
- font-size: inherit;
- font-style: inherit;
+a[href^="tel"] {
+ font-size: inherit;
+ font-family: inherit;
+ color: inherit;
+ text-decoration: none;
+ font-style: inherit;
}
-
/**
- * Rulers
+ * Rules
*/
-
hr {
- background-color: $base-colour;
- height: 1px;
-}
\ No newline at end of file
+ height: 1px;
+ background-color: $base-colour;
+}
diff --git a/assets/styles/base/_fonts.scss b/assets/styles/base/_fonts.scss
index f5e3b71..52f90a3 100644
--- a/assets/styles/base/_fonts.scss
+++ b/assets/styles/base/_fonts.scss
@@ -1,3 +1,3 @@
/**
* This file contains all @font-face declarations, if any.
- */
\ No newline at end of file
+ */
diff --git a/assets/styles/base/_forms.scss b/assets/styles/base/_forms.scss
index 5f9e5e5..c29184b 100644
--- a/assets/styles/base/_forms.scss
+++ b/assets/styles/base/_forms.scss
@@ -1,122 +1,126 @@
/**
* Blanket input styles for normalisation
*/
-
*:focus {
- outline: 0;
+ outline: 0;
}
-input,
-select,
+input,
+select,
textarea {
- background-color: $base-background-colour;
- border: solid 1px $base-colour;
- border-radius: 0;
- color: $base-colour;
- line-height: ($base-spacing-unit * 1.5);
- height: ($base-spacing-unit * 1.5);
- padding: 0 ($base-spacing-unit / 2);
- width: 100%;
+ background-color: $base-background-colour;
+ border: solid 1px $base-colour;
+ border-radius: 0;
+ color: $base-colour;
+ line-height: ($base-spacing-unit * 1.5);
+ height: ($base-spacing-unit * 1.5);
+ padding: 0 ($base-spacing-unit / 2);
+ width: 100%;
}
-input[type="checkbox"],
+input[type="checkbox"],
input[type="radio"] {
- background: transparent;
- border: 0;
- line-height: normal;
- height: auto;
- width: auto;
+ background: transparent;
+ border: 0;
+ line-height: normal;
+ height: auto;
+ width: auto;
}
input[type="file"] {
- line-height: normal;
- height: auto;
- padding: ($base-spacing-unit / 4) ($base-spacing-unit / 2);
+ line-height: normal;
+ height: auto;
+ padding: ($base-spacing-unit / 4) ($base-spacing-unit / 2);
}
input[type="submit"] {
- -webkit-border-radius: 0;
- border-radius: 0;
+ border-radius: 0;
}
input[disabled] {
- background-color: whitesmoke;
- cursor: not-allowed;
+ background-color: whitesmoke;
+ cursor: not-allowed;
}
select {
- line-height: normal;
- padding: 0;
- padding-left: ($base-spacing-unit / 2);
+ line-height: normal;
+ padding: 0;
+ padding-left: ($base-spacing-unit / 2);
}
textarea {
- min-height: ($base-spacing-unit * 4);
- overflow: auto;
- vertical-align: top;
- resize: vertical;
+ min-height: ($base-spacing-unit * 4);
+ overflow: auto;
+ vertical-align: top;
+ resize: vertical;
}
+
/**
* Form utility classes
*/
-
.form--inline {
- .form__group {
- display: inline-block;
- }
+ .form__group {
+ display: inline-block;
+ }
}
.checkbox,
.radio {
- display: block;
- padding-left: $base-spacing-unit;
- &.inline {
- display: inline-block;
- }
- > input {
- float: left;
- margin-left: -($base-spacing-unit);
- margin-top: 4px;
- }
+ display: block;
+ padding-left: $base-spacing-unit;
+
+ &.inline {
+ display: inline-block;
+ }
+
+ > input {
+ float: left;
+ margin-left: -($base-spacing-unit);
+ margin-top: 4px;
+ }
}
.form__group {
- display: block;
- margin-bottom: $base-spacing-unit;
+ display: block;
+ margin-bottom: $base-spacing-unit;
}
.form__label {
- display: block;
- margin-bottom: ($base-spacing-unit / 2);
+ display: block;
+ margin-bottom: ($base-spacing-unit / 2);
}
+
/**
* Input Group
*
- * Allows for prepend/append of elements
+ * Allows for prepend/append of elements
* (such as icons) on an input.
*/
-
.input-group {
- position: relative;
- > input {
- padding: 0 ($base-spacing-unit * 2);
+ position: relative;
+
+ > input {
+ padding: 0 ($base-spacing-unit * 2);
+ }
+
+ .input-group__addon {
+ line-height: ($base-spacing-unit * 1.5);
+ height: ($base-spacing-unit * 1.5);
+ position: absolute;
+ text-align: center;
+ top: 0;
+ width: ($base-spacing-unit * 1.5);
+
+ &:first-child {
+ left: 0;
}
- .input-group__addon {
- line-height: ($base-spacing-unit * 1.5);
- height: ($base-spacing-unit * 1.5);
- position: absolute;
- text-align: center;
- top: 0;
- width: ($base-spacing-unit * 1.5);
- &:first-child {
- left: 0;
- }
- &:last-child {
- right: 0;
- }
+
+ &:last-child {
+ right: 0;
}
+ }
}
diff --git a/assets/styles/base/_images.scss b/assets/styles/base/_images.scss
index 5b487be..e83ceec 100644
--- a/assets/styles/base/_images.scss
+++ b/assets/styles/base/_images.scss
@@ -1,16 +1,14 @@
img {
- max-width: 100%;
- height: auto;
- vertical-align: top;
+ max-width: 100%;
+ height: auto;
+ vertical-align: top;
}
-
/**
* Responsive images
*/
-
.is-fluid {
- display: block;
- width: 100%;
- height: auto;
+ display: block;
+ width: 100%;
+ height: auto;
}
diff --git a/assets/styles/base/_lists.scss b/assets/styles/base/_lists.scss
index 79d9d8f..a6378fe 100644
--- a/assets/styles/base/_lists.scss
+++ b/assets/styles/base/_lists.scss
@@ -1,16 +1,16 @@
-ul,
+ul,
ol {
- margin-left: $base-spacing-unit;
+ margin-left: $base-spacing-unit;
}
li {
- > ul,
- > ol {
- margin-bottom: 0;
- }
+ > ul,
+ > ol {
+ margin-bottom: 0;
+ }
}
.list--unstyled {
- list-style: none;
- margin-left: 0;
-}
\ No newline at end of file
+ margin-left: 0;
+ list-style: none;
+}
diff --git a/assets/styles/base/_typography.scss b/assets/styles/base/_typography.scss
index a3845e1..1bf5b35 100644
--- a/assets/styles/base/_typography.scss
+++ b/assets/styles/base/_typography.scss
@@ -1,12 +1,12 @@
-h1,
-h2,
-h3,
-h4,
-h5,
+h1,
+h2,
+h3,
+h4,
+h5,
h6 {
font-weight: bold;
}
small {
- font-size: .75em;
-}
\ No newline at end of file
+ font-size: .75em;
+}
diff --git a/assets/styles/components/_alerts.scss b/assets/styles/components/_alerts.scss
index 5974ab1..8648996 100644
--- a/assets/styles/components/_alerts.scss
+++ b/assets/styles/components/_alerts.scss
@@ -1,28 +1,34 @@
.alert {
- padding: $base-spacing-unit;
- margin-bottom: $base-spacing-unit;
- border: 1px solid transparent;
- > p,
- > ul {
- margin-bottom: 0;
- }
- > p + p {
- margin-top: $base-spacing-unit;
- }
- &.alert--success {
- color: $success-colour;
- border-color: $success-colour;
- }
- &.alert--info {
- color: $info-colour;
- border-color: $info-colour;
- }
- &.alert--warning {
- color: $warning-colour;
- border-color: $warning-colour;
- }
- &.alert--danger {
- color: $danger-colour;
- border-color: $danger-colour;
- }
+ padding: $base-spacing-unit;
+ margin-bottom: $base-spacing-unit;
+ border: 1px solid transparent;
+
+ > p,
+ > ul {
+ margin-bottom: 0;
+ }
+
+ > p + p {
+ margin-top: $base-spacing-unit;
+ }
+
+ &.alert--success {
+ color: $success-colour;
+ border-color: $success-colour;
+ }
+
+ &.alert--info {
+ color: $info-colour;
+ border-color: $info-colour;
+ }
+
+ &.alert--warning {
+ color: $warning-colour;
+ border-color: $warning-colour;
+ }
+
+ &.alert--danger {
+ color: $danger-colour;
+ border-color: $danger-colour;
+ }
}
diff --git a/assets/styles/components/_buttons.scss b/assets/styles/components/_buttons.scss
index 00ffc00..31df660 100644
--- a/assets/styles/components/_buttons.scss
+++ b/assets/styles/components/_buttons.scss
@@ -1,54 +1,59 @@
.btn {
- background-color: $brand-colour;
- color: $base-background-colour;
- border: 1px solid transparent;
- display: inline-block;
- padding: ($base-spacing-unit / 4) $base-spacing-unit;
- text-align: center;
- white-space: nowrap;
- vertical-align: middle;
- touch-action: manipulation;
- cursor: pointer;
- user-select: none;
- width: auto;
- transition: all .5s;
- &::-moz-focus-inner {
- border: 0;
- padding: 0;
- }
- &:hover {
- text-decoration: none;
- background-color: $base-background-colour;
- color: $brand-colour;
- border: 1px solid $brand-colour;
- }
- .is-disabled,
- &:disabled {
- pointer-events: none;
- opacity: .65;
- }
-}
+ background-color: $brand-colour;
+ color: $base-background-colour;
+ border: 1px solid transparent;
+ display: inline-block;
+ padding: ($base-spacing-unit / 4) $base-spacing-unit;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: middle;
+ touch-action: manipulation;
+ cursor: pointer;
+ user-select: none;
+ width: auto;
+ transition: all .5s;
-.btn--inverse {
+ &::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+ }
+
+ &:hover {
+ text-decoration: none;
background-color: $base-background-colour;
color: $brand-colour;
border: 1px solid $brand-colour;
- &:hover {
- background-color: $brand-colour;
- color: $base-background-colour;
- border: 1px solid transparent;
- }
+ }
+
+ .is-disabled,
+ &:disabled {
+ pointer-events: none;
+ opacity: .65;
+ }
+}
+
+.btn--inverse {
+ background-color: $base-background-colour;
+ color: $brand-colour;
+ border: 1px solid $brand-colour;
+
+ &:hover {
+ background-color: $brand-colour;
+ color: $base-background-colour;
+ border: 1px solid transparent;
+ }
}
.btn--block {
- display: block;
- width: 100%;
- + .btn--block {
- margin-top: $base-spacing-unit / 4;
- }
+ display: block;
+ width: 100%;
+
+ + .btn--block {
+ margin-top: $base-spacing-unit / 4;
+ }
}
.btn--link {
- background-color: transparent;
- color: $brand-colour;
-}
\ No newline at end of file
+ background-color: transparent;
+ color: $brand-colour;
+}
diff --git a/assets/styles/components/_nav.scss b/assets/styles/components/_nav.scss
index 52e267f..b669571 100755
--- a/assets/styles/components/_nav.scss
+++ b/assets/styles/components/_nav.scss
@@ -1,14 +1,102 @@
-.nav {
- list-style: none;
- margin: 0;
- > li {
- display: inline-block;
- margin-right: $base-spacing-unit;
- &:last-child {
- margin-right: 0;
- }
- > a {
- display: block;
- }
+// hamburger menu
+.nav-burger {
+ position: fixed;
+ top: $base-spacing-unit;
+ right: $base-spacing-unit;
+ z-index: 550;
+ transition: all $animation-speed $animation;
+}
+
+.nav-burger__line {
+ width: 35px;
+ height: 3px;
+ background-color: $brand-colour;
+ display: none;
+ margin: 8px auto;
+ transition: all $animation-speed $animation;
+
+ @include resp-max($breakpoint-md) {
+ display: block;
+ }
+
+ .nav-burger.open & {
+ &:nth-child(2) {
+ opacity: 0;
}
-}
\ No newline at end of file
+
+ &:nth-child(1) {
+ transform: translateY(11px) rotate(45deg);
+ }
+
+ &:nth-child(3) {
+ transform: translateY(-11px) rotate(-45deg);
+ }
+ }
+}
+
+
+// applies to all navs
+.nav {
+ list-style: none;
+ margin: 0;
+
+ > li {
+ display: inline-block;
+ margin-right: $base-spacing-unit;
+
+ &:last-child {
+ margin-right: 0;
+ }
+ > a {
+ display: block;
+ }
+ }
+}
+
+.nav--header {
+ // header nav styling goes here
+
+ // mobile nav
+ @include resp-max($breakpoint-md) {
+ position: fixed;
+ top: 0;
+ left: 0;
+ visibility: hidden;
+ width: 0;
+ height: 100%;
+ margin: 0;
+ transition: opacity 500ms ease;
+ transition: opacity .35s ease, visibility .35s ease, width .35s ease;
+ text-align: center;
+ opacity: 0;
+ background: $base-background-colour;
+ -webkit-overflow-scrolling: touch;
+
+ &.open {
+ z-index: 500;
+ visibility: visible;
+ width: 100%;
+ opacity: 1;
+
+ ul {
+ position: absolute;
+ top: 50%;
+ left: 0;
+ overflow: auto;
+ width: 100%;
+ max-height: 100%;
+ margin: 0;
+ padding: 0;
+ user-select: none;
+ transform: translateY(-50%);
+ -webkit-touch-callout: none;
+ -webkit-overflow-scrolling: touch;
+
+ > li {
+ width: 100%;
+ margin: 0;
+ }
+ }
+ }
+ }
+}
diff --git a/assets/styles/config/_mixins.scss b/assets/styles/config/_mixins.scss
index c410d12..41c8b52 100755
--- a/assets/styles/config/_mixins.scss
+++ b/assets/styles/config/_mixins.scss
@@ -1,60 +1,56 @@
/*
* Media query to respond to a minimum size (mobile first)
*/
-
@mixin resp-min($size) {
- @media screen and (min-width: $size) {
- @content;
- }
+ @media screen and (min-width: $size) {
+ @content;
+ }
}
/*
* Media query to respond to a maximum size
*/
-
@mixin resp-max($size) {
- @media screen and (max-width: $size) {
- @content;
- }
+ @media screen and (max-width: $size) {
+ @content;
+ }
}
/*
* Output font size in px/rem
*/
-
@mixin font-size($px) {
- font-size: $px + px;
- font-size: #{$px / 16}rem;
+ font-size: $px + px;
+ font-size: #{$px / 16}rem;
}
/*
* Placeholder mixin for
*/
-
@mixin placeholder {
- $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
- @each $placeholder in $placeholders {
- &:#{$placeholder}-placeholder {
- @content;
- }
+ $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
+ @each $placeholder in $placeholders {
+ &:#{$placeholder}-placeholder {
+ @content;
}
+ }
}
/**
* Clearfix
*/
-
@mixin clearfix {
- &:before,
- &:after{
- content: " ";
- display: table;
- }
- &:after{
- clear: both;
- }
+ &:before,
+ &:after {
+ content: " ";
+ display: table;
+ }
+
+ &:after {
+ clear: both;
+ }
}
diff --git a/assets/styles/config/_variables.scss b/assets/styles/config/_variables.scss
index de08df6..0800afd 100755
--- a/assets/styles/config/_variables.scss
+++ b/assets/styles/config/_variables.scss
@@ -55,3 +55,9 @@ $grid-gutter: $base-spacing-unit;
*/
$border-radius: 3px;
+
+/**
+ * Animations
+ */
+$animation-speed: 250ms;
+$animation: ease-in-out;
diff --git a/assets/styles/layout/_header.scss b/assets/styles/layout/_header.scss
index e69de29..2bcd20f 100644
--- a/assets/styles/layout/_header.scss
+++ b/assets/styles/layout/_header.scss
@@ -0,0 +1,5 @@
+.logo {
+ width: 200px;
+ height: auto;
+ display: inline-block;
+}
diff --git a/assets/styles/utils/_helpers.scss b/assets/styles/utils/_helpers.scss
index 0961469..3606266 100644
--- a/assets/styles/utils/_helpers.scss
+++ b/assets/styles/utils/_helpers.scss
@@ -1,81 +1,84 @@
/**
- * Clearing and floating
- */
-
+* Clearing and floating
+*/
.alignleft,
.float-left {
- float: left;
- img & {
- margin-right: $base-spacing-unit;
- }
+ float: left;
+
+ img & {
+ margin-right: $base-spacing-unit;
+ }
}
.alignright,
.float-right {
- float: right;
- img & {
- margin-left : $base-spacing-unit;
- }
+ float: right;
+
+ img & {
+ margin-left : $base-spacing-unit;
+ }
}
.aligncenter,
.float-center {
- display: block;
- margin: {
- left: auto;
- right: auto;
- }
- img & {
- margin-bottom: $base-spacing-unit;
- }
+ display: block;
+ margin: {
+ left: auto;
+ right: auto;
+ }
+
+ img & {
+ margin-bottom: $base-spacing-unit;
+ }
}
.clearfix {
- @include clearfix();
+ @include clearfix();
}
/**
- * Text aligments
- */
-
+* Text aligments
+*/
.align-text-left {
- text-align: left;
+ text-align: left;
}
.align-text-right {
- text-align: right;
+ text-align: right;
}
.align-text-center {
- text-align: center;
+ text-align: center;
}
/**
- * Elements visibility
- */
-
+* Elements visibility
+*/
.visible-on-mobile {
- display: none !important;
- @include resp-max($breakpoint-sm) {
- display: block !important;
- }
+ display: none !important;
+
+ @include resp-max($breakpoint-sm) {
+ display: block !important;
+ }
}
.visible-on-tablet {
+ display: none !important;
+
+ @include resp-max($breakpoint-md) {
+ display: block !important;
+ }
+
+ @include resp-max($breakpoint-sm) {
display: none !important;
- @include resp-max($breakpoint-md) {
- display: block !important;
- }
- @include resp-max($breakpoint-sm) {
- display: none !important;
- }
+ }
}
.visible-on-desktop {
- @include resp-max($breakpoint-md) {
- display: none !important;
- }
+ @include resp-max($breakpoint-md) {
+ display: none !important;
+ }
}
diff --git a/assets/styles/utils/_reset.scss b/assets/styles/utils/_reset.scss
index 5714796..4590667 100644
--- a/assets/styles/utils/_reset.scss
+++ b/assets/styles/utils/_reset.scss
@@ -17,12 +17,13 @@ html {
text-rendering: optimizeLegibility;
}
-input,
-select,
+input,
+select,
textarea,
button {
color: inherit;
display: inline-block;
+
&[disabled] {
cursor: not-allowed;
}
@@ -35,8 +36,9 @@ button {
table {
border-collapse: collapse;
border-spacing: 0;
+
th,
td {
text-align: left;
}
-}
\ No newline at end of file
+}
diff --git a/assets/styles/utils/_responsive.scss b/assets/styles/utils/_responsive.scss
index 2e3b870..4e4831a 100644
--- a/assets/styles/utils/_responsive.scss
+++ b/assets/styles/utils/_responsive.scss
@@ -1,18 +1,16 @@
@each $breakpoint in $breakpoints {
+ $key : nth($breakpoint, 1);
+ $value : nth($breakpoint, 2);
- $key : nth($breakpoint, 1);
- $value : nth($breakpoint, 2);
-
- .visible-#{$key} {
- @media only screen and #{$value} {
- display: block !important;
- }
+ .visible-#{$key} {
+ @media only screen and #{$value} {
+ display: block !important;
}
+ }
- .hidden-#{$key} {
- @media only screen and #{$value} {
- display: none !important;
- }
+ .hidden-#{$key} {
+ @media only screen and #{$value} {
+ display: none !important;
}
-
-}
\ No newline at end of file
+ }
+}
diff --git a/css/core.min.css b/css/core.min.css
index d35523f..4e4ae9d 100755
--- a/css/core.min.css
+++ b/css/core.min.css
@@ -1 +1 @@
-.container{max-width:1200px;margin:0 auto;padding:0 24px}.container:before,.container:after{content:" ";display:table}.container:after{clear:both}.row{list-style:none;margin-left:-24px}.row:before,.row:after{content:" ";display:table}.row:after{clear:both}.row.row--gutterless{margin-left:0}.col{float:left;padding-left:24px;-webkit-box-sizing:border-box;box-sizing:border-box}.row--gutterless .col{padding-left:0}@media only screen and (min-width: 1200px){.col--lg-offset-0{margin-left:0%}.col--lg-1{width:8.33333%}.col--lg-offset-1{margin-left:8.33333%}.col--lg-2{width:16.66667%}.col--lg-offset-2{margin-left:16.66667%}.col--lg-3{width:25%}.col--lg-offset-3{margin-left:25%}.col--lg-4{width:33.33333%}.col--lg-offset-4{margin-left:33.33333%}.col--lg-5{width:41.66667%}.col--lg-offset-5{margin-left:41.66667%}.col--lg-6{width:50%}.col--lg-offset-6{margin-left:50%}.col--lg-7{width:58.33333%}.col--lg-offset-7{margin-left:58.33333%}.col--lg-8{width:66.66667%}.col--lg-offset-8{margin-left:66.66667%}.col--lg-9{width:75%}.col--lg-offset-9{margin-left:75%}.col--lg-10{width:83.33333%}.col--lg-offset-10{margin-left:83.33333%}.col--lg-11{width:91.66667%}.col--lg-offset-11{margin-left:91.66667%}.col--lg-12{width:100%}.col--lg-offset-12{margin-left:100%}}@media only screen and (min-width: 768px) and (max-width: 1199px){.col--md-offset-0{margin-left:0%}.col--md-1{width:8.33333%}.col--md-offset-1{margin-left:8.33333%}.col--md-2{width:16.66667%}.col--md-offset-2{margin-left:16.66667%}.col--md-3{width:25%}.col--md-offset-3{margin-left:25%}.col--md-4{width:33.33333%}.col--md-offset-4{margin-left:33.33333%}.col--md-5{width:41.66667%}.col--md-offset-5{margin-left:41.66667%}.col--md-6{width:50%}.col--md-offset-6{margin-left:50%}.col--md-7{width:58.33333%}.col--md-offset-7{margin-left:58.33333%}.col--md-8{width:66.66667%}.col--md-offset-8{margin-left:66.66667%}.col--md-9{width:75%}.col--md-offset-9{margin-left:75%}.col--md-10{width:83.33333%}.col--md-offset-10{margin-left:83.33333%}.col--md-11{width:91.66667%}.col--md-offset-11{margin-left:91.66667%}.col--md-12{width:100%}.col--md-offset-12{margin-left:100%}}@media only screen and (max-width: 767px){.col--sm-offset-0{margin-left:0%}.col--sm-1{width:8.33333%}.col--sm-offset-1{margin-left:8.33333%}.col--sm-2{width:16.66667%}.col--sm-offset-2{margin-left:16.66667%}.col--sm-3{width:25%}.col--sm-offset-3{margin-left:25%}.col--sm-4{width:33.33333%}.col--sm-offset-4{margin-left:33.33333%}.col--sm-5{width:41.66667%}.col--sm-offset-5{margin-left:41.66667%}.col--sm-6{width:50%}.col--sm-offset-6{margin-left:50%}.col--sm-7{width:58.33333%}.col--sm-offset-7{margin-left:58.33333%}.col--sm-8{width:66.66667%}.col--sm-offset-8{margin-left:66.66667%}.col--sm-9{width:75%}.col--sm-offset-9{margin-left:75%}.col--sm-10{width:83.33333%}.col--sm-offset-10{margin-left:83.33333%}.col--sm-11{width:91.66667%}.col--sm-offset-11{margin-left:91.66667%}.col--sm-12{width:100%}.col--sm-offset-12{margin-left:100%}}@media only screen and (max-width: 480px){.col--xs-offset-0{margin-left:0%}.col--xs-1{width:8.33333%}.col--xs-offset-1{margin-left:8.33333%}.col--xs-2{width:16.66667%}.col--xs-offset-2{margin-left:16.66667%}.col--xs-3{width:25%}.col--xs-offset-3{margin-left:25%}.col--xs-4{width:33.33333%}.col--xs-offset-4{margin-left:33.33333%}.col--xs-5{width:41.66667%}.col--xs-offset-5{margin-left:41.66667%}.col--xs-6{width:50%}.col--xs-offset-6{margin-left:50%}.col--xs-7{width:58.33333%}.col--xs-offset-7{margin-left:58.33333%}.col--xs-8{width:66.66667%}.col--xs-offset-8{margin-left:66.66667%}.col--xs-9{width:75%}.col--xs-offset-9{margin-left:75%}.col--xs-10{width:83.33333%}.col--xs-offset-10{margin-left:83.33333%}.col--xs-11{width:91.66667%}.col--xs-offset-11{margin-left:91.66667%}.col--xs-12{width:100%}.col--xs-offset-12{margin-left:100%}}*{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;font:inherit;margin:0;padding:0}html{background-color:white;font-size:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}input,select,textarea,button{color:inherit;display:inline-block}input[disabled],select[disabled],textarea[disabled],button[disabled]{cursor:not-allowed}button{cursor:pointer}table{border-collapse:collapse;border-spacing:0}table th,table td{text-align:left}@media only screen and (min-width: 1200px){.visible-lg{display:block !important}}@media only screen and (min-width: 1200px){.hidden-lg{display:none !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.visible-md{display:block !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (max-width: 767px){.visible-sm{display:block !important}}@media only screen and (max-width: 767px){.hidden-sm{display:none !important}}@media only screen and (max-width: 480px){.visible-xs{display:block !important}}@media only screen and (max-width: 480px){.hidden-xs{display:none !important}}.alignleft,.float-left{float:left}img .alignleft,img .float-left{margin-right:24px}.alignright,.float-right{float:right}img .alignright,img .float-right{margin-left:24px}.aligncenter,.float-center{display:block;margin-left:auto;margin-right:auto}img .aligncenter,img .float-center{margin-bottom:24px}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}.align-text-left{text-align:left}.align-text-right{text-align:right}.align-text-center{text-align:center}.visible-on-mobile{display:none !important}@media screen and (max-width: 480px){.visible-on-mobile{display:block !important}}.visible-on-tablet{display:none !important}@media screen and (max-width: 768px){.visible-on-tablet{display:block !important}}@media screen and (max-width: 480px){.visible-on-tablet{display:none !important}}@media screen and (max-width: 768px){.visible-on-desktop{display:none !important}}body{color:#444;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;font-size:1rem;line-height:1.5;-webkit-text-size-adjust:none}h1,h2,h3,h4,h5,h6,p,hr,ul,ol,dl,address{margin-bottom:24px}a{color:#444;text-decoration:none}a:hover{color:#444;text-decoration:underline}a[href^="tel"]{color:inherit;text-decoration:none;font-family:inherit;font-size:inherit;font-style:inherit}hr{background-color:#444;height:1px}img{max-width:100%;height:auto;vertical-align:top}.is-fluid{display:block;width:100%;height:auto}*:focus{outline:0}input,select,textarea{background-color:#fff;border:solid 1px #444;-webkit-border-radius:0;border-radius:0;color:#444;line-height:36px;height:36px;padding:0 12px;width:100%}input[type="checkbox"],input[type="radio"]{background:transparent;border:0;line-height:normal;height:auto;width:auto}input[type="file"]{line-height:normal;height:auto;padding:6px 12px}input[type="submit"]{-webkit-border-radius:0;border-radius:0}input[disabled]{background-color:whitesmoke;cursor:not-allowed}select{line-height:normal;padding:0;padding-left:12px}textarea{min-height:96px;overflow:auto;vertical-align:top;resize:vertical}.form--inline .form__group{display:inline-block}.checkbox,.radio{display:block;padding-left:24px}.checkbox.inline,.radio.inline{display:inline-block}.checkbox>input,.radio>input{float:left;margin-left:-24px;margin-top:4px}.form__group{display:block;margin-bottom:24px}.form__label{display:block;margin-bottom:12px}.input-group{position:relative}.input-group>input{padding:0 48px}.input-group .input-group__addon{line-height:36px;height:36px;position:absolute;text-align:center;top:0;width:36px}.input-group .input-group__addon:first-child{left:0}.input-group .input-group__addon:last-child{right:0}ul,ol{margin-left:24px}li>ul,li>ol{margin-bottom:0}.list--unstyled{list-style:none;margin-left:0}h1,h2,h3,h4,h5,h6{font-weight:bold}small{font-size:.75em}.logo{width:250px;height:41px}
+.container{max-width:1200px;margin:0 auto;padding:0 24px}.container:before,.container:after{content:" ";display:table}.container:after{clear:both}.row{list-style:none;margin-left:-24px}.row:before,.row:after{content:" ";display:table}.row:after{clear:both}.row.row--gutterless{margin-left:0}.col{float:left;padding-left:24px;-webkit-box-sizing:border-box;box-sizing:border-box}.row--gutterless .col{padding-left:0}@media only screen and (min-width: 1200px){.col--lg-offset-0{margin-left:0%}.col--lg-1{width:8.33333%}.col--lg-offset-1{margin-left:8.33333%}.col--lg-2{width:16.66667%}.col--lg-offset-2{margin-left:16.66667%}.col--lg-3{width:25%}.col--lg-offset-3{margin-left:25%}.col--lg-4{width:33.33333%}.col--lg-offset-4{margin-left:33.33333%}.col--lg-5{width:41.66667%}.col--lg-offset-5{margin-left:41.66667%}.col--lg-6{width:50%}.col--lg-offset-6{margin-left:50%}.col--lg-7{width:58.33333%}.col--lg-offset-7{margin-left:58.33333%}.col--lg-8{width:66.66667%}.col--lg-offset-8{margin-left:66.66667%}.col--lg-9{width:75%}.col--lg-offset-9{margin-left:75%}.col--lg-10{width:83.33333%}.col--lg-offset-10{margin-left:83.33333%}.col--lg-11{width:91.66667%}.col--lg-offset-11{margin-left:91.66667%}.col--lg-12{width:100%}.col--lg-offset-12{margin-left:100%}}@media only screen and (min-width: 768px) and (max-width: 1199px){.col--md-offset-0{margin-left:0%}.col--md-1{width:8.33333%}.col--md-offset-1{margin-left:8.33333%}.col--md-2{width:16.66667%}.col--md-offset-2{margin-left:16.66667%}.col--md-3{width:25%}.col--md-offset-3{margin-left:25%}.col--md-4{width:33.33333%}.col--md-offset-4{margin-left:33.33333%}.col--md-5{width:41.66667%}.col--md-offset-5{margin-left:41.66667%}.col--md-6{width:50%}.col--md-offset-6{margin-left:50%}.col--md-7{width:58.33333%}.col--md-offset-7{margin-left:58.33333%}.col--md-8{width:66.66667%}.col--md-offset-8{margin-left:66.66667%}.col--md-9{width:75%}.col--md-offset-9{margin-left:75%}.col--md-10{width:83.33333%}.col--md-offset-10{margin-left:83.33333%}.col--md-11{width:91.66667%}.col--md-offset-11{margin-left:91.66667%}.col--md-12{width:100%}.col--md-offset-12{margin-left:100%}}@media only screen and (max-width: 767px){.col--sm-offset-0{margin-left:0%}.col--sm-1{width:8.33333%}.col--sm-offset-1{margin-left:8.33333%}.col--sm-2{width:16.66667%}.col--sm-offset-2{margin-left:16.66667%}.col--sm-3{width:25%}.col--sm-offset-3{margin-left:25%}.col--sm-4{width:33.33333%}.col--sm-offset-4{margin-left:33.33333%}.col--sm-5{width:41.66667%}.col--sm-offset-5{margin-left:41.66667%}.col--sm-6{width:50%}.col--sm-offset-6{margin-left:50%}.col--sm-7{width:58.33333%}.col--sm-offset-7{margin-left:58.33333%}.col--sm-8{width:66.66667%}.col--sm-offset-8{margin-left:66.66667%}.col--sm-9{width:75%}.col--sm-offset-9{margin-left:75%}.col--sm-10{width:83.33333%}.col--sm-offset-10{margin-left:83.33333%}.col--sm-11{width:91.66667%}.col--sm-offset-11{margin-left:91.66667%}.col--sm-12{width:100%}.col--sm-offset-12{margin-left:100%}}@media only screen and (max-width: 480px){.col--xs-offset-0{margin-left:0%}.col--xs-1{width:8.33333%}.col--xs-offset-1{margin-left:8.33333%}.col--xs-2{width:16.66667%}.col--xs-offset-2{margin-left:16.66667%}.col--xs-3{width:25%}.col--xs-offset-3{margin-left:25%}.col--xs-4{width:33.33333%}.col--xs-offset-4{margin-left:33.33333%}.col--xs-5{width:41.66667%}.col--xs-offset-5{margin-left:41.66667%}.col--xs-6{width:50%}.col--xs-offset-6{margin-left:50%}.col--xs-7{width:58.33333%}.col--xs-offset-7{margin-left:58.33333%}.col--xs-8{width:66.66667%}.col--xs-offset-8{margin-left:66.66667%}.col--xs-9{width:75%}.col--xs-offset-9{margin-left:75%}.col--xs-10{width:83.33333%}.col--xs-offset-10{margin-left:83.33333%}.col--xs-11{width:91.66667%}.col--xs-offset-11{margin-left:91.66667%}.col--xs-12{width:100%}.col--xs-offset-12{margin-left:100%}}*{background-color:transparent;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;font:inherit;margin:0;padding:0}html{background-color:white;font-size:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}input,select,textarea,button{color:inherit;display:inline-block}input[disabled],select[disabled],textarea[disabled],button[disabled]{cursor:not-allowed}button{cursor:pointer}table{border-collapse:collapse;border-spacing:0}table th,table td{text-align:left}@media only screen and (min-width: 1200px){.visible-lg{display:block !important}}@media only screen and (min-width: 1200px){.hidden-lg{display:none !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.visible-md{display:block !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (max-width: 767px){.visible-sm{display:block !important}}@media only screen and (max-width: 767px){.hidden-sm{display:none !important}}@media only screen and (max-width: 480px){.visible-xs{display:block !important}}@media only screen and (max-width: 480px){.hidden-xs{display:none !important}}.alignleft,.float-left{float:left}img .alignleft,img .float-left{margin-right:24px}.alignright,.float-right{float:right}img .alignright,img .float-right{margin-left:24px}.aligncenter,.float-center{display:block;margin-left:auto;margin-right:auto}img .aligncenter,img .float-center{margin-bottom:24px}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}.align-text-left{text-align:left}.align-text-right{text-align:right}.align-text-center{text-align:center}.visible-on-mobile{display:none !important}@media screen and (max-width: 480px){.visible-on-mobile{display:block !important}}.visible-on-tablet{display:none !important}@media screen and (max-width: 768px){.visible-on-tablet{display:block !important}}@media screen and (max-width: 480px){.visible-on-tablet{display:none !important}}@media screen and (max-width: 768px){.visible-on-desktop{display:none !important}}body{color:#444;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.5;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none;font-size:16px;font-size:1rem}h1,h2,h3,h4,h5,h6,p,hr,ul,ol,dl,address{margin-bottom:24px}a{color:#444;text-decoration:none}a:hover{color:#444;text-decoration:underline}a[href^="tel"]{font-size:inherit;font-family:inherit;color:inherit;text-decoration:none;font-style:inherit}hr{height:1px;background-color:#444}img{max-width:100%;height:auto;vertical-align:top}.is-fluid{display:block;width:100%;height:auto}*:focus{outline:0}input,select,textarea{background-color:#fff;border:solid 1px #444;-webkit-border-radius:0;border-radius:0;color:#444;line-height:36px;height:36px;padding:0 12px;width:100%}input[type="checkbox"],input[type="radio"]{background:transparent;border:0;line-height:normal;height:auto;width:auto}input[type="file"]{line-height:normal;height:auto;padding:6px 12px}input[type="submit"]{-webkit-border-radius:0;border-radius:0}input[disabled]{background-color:whitesmoke;cursor:not-allowed}select{line-height:normal;padding:0;padding-left:12px}textarea{min-height:96px;overflow:auto;vertical-align:top;resize:vertical}.form--inline .form__group{display:inline-block}.checkbox,.radio{display:block;padding-left:24px}.checkbox.inline,.radio.inline{display:inline-block}.checkbox>input,.radio>input{float:left;margin-left:-24px;margin-top:4px}.form__group{display:block;margin-bottom:24px}.form__label{display:block;margin-bottom:12px}.input-group{position:relative}.input-group>input{padding:0 48px}.input-group .input-group__addon{line-height:36px;height:36px;position:absolute;text-align:center;top:0;width:36px}.input-group .input-group__addon:first-child{left:0}.input-group .input-group__addon:last-child{right:0}ul,ol{margin-left:24px}li>ul,li>ol{margin-bottom:0}.list--unstyled{margin-left:0;list-style:none}h1,h2,h3,h4,h5,h6{font-weight:bold}small{font-size:.75em}.logo{width:250px;height:41px}
diff --git a/css/styles.min.css b/css/styles.min.css
index e1792b5..7389cab 100755
--- a/css/styles.min.css
+++ b/css/styles.min.css
@@ -1 +1 @@
-.btn{background-color:#444;color:#fff;border:1px solid transparent;display:inline-block;padding:6px 24px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:auto;-webkit-transition:all .5s;-o-transition:all .5s;transition:all .5s}.btn::-moz-focus-inner{border:0;padding:0}.btn:hover{text-decoration:none;background-color:#fff;color:#444;border:1px solid #444}.btn .is-disabled,.btn:disabled{pointer-events:none;opacity:.65}.btn--inverse{background-color:#fff;color:#444;border:1px solid #444}.btn--inverse:hover{background-color:#444;color:#fff;border:1px solid transparent}.btn--block{display:block;width:100%}.btn--block+.btn--block{margin-top:6px}.btn--link{background-color:transparent;color:#444}.nav{list-style:none;margin:0}.nav>li{display:inline-block;margin-right:24px}.nav>li:last-child{margin-right:0}.nav>li>a{display:block}.alert{padding:24px;margin-bottom:24px;border:1px solid transparent}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:24px}.alert.alert--success{color:#5CB85C;border-color:#5CB85C}.alert.alert--info{color:#444;border-color:#444}.alert.alert--warning{color:#F0AD4E;border-color:#F0AD4E}.alert.alert--danger{color:#D9534F;border-color:#D9534F}
+.logo{width:200px;height:auto;display:inline-block}.btn{background-color:#444;color:#fff;border:1px solid transparent;display:inline-block;padding:6px 24px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:auto;-webkit-transition:all .5s;-o-transition:all .5s;transition:all .5s}.btn::-moz-focus-inner{border:0;padding:0}.btn:hover{text-decoration:none;background-color:#fff;color:#444;border:1px solid #444}.btn .is-disabled,.btn:disabled{pointer-events:none;opacity:.65}.btn--inverse{background-color:#fff;color:#444;border:1px solid #444}.btn--inverse:hover{background-color:#444;color:#fff;border:1px solid transparent}.btn--block{display:block;width:100%}.btn--block+.btn--block{margin-top:6px}.btn--link{background-color:transparent;color:#444}.nav-burger{position:fixed;top:24px;right:24px;z-index:550;-webkit-transition:all 250ms ease-in-out;-o-transition:all 250ms ease-in-out;transition:all 250ms ease-in-out}.nav-burger__line{width:35px;height:3px;background-color:#444;display:none;margin:8px auto;-webkit-transition:all 250ms ease-in-out;-o-transition:all 250ms ease-in-out;transition:all 250ms ease-in-out}@media screen and (max-width: 768px){.nav-burger__line{display:block}}.nav-burger.open .nav-burger__line:nth-child(2){opacity:0}.nav-burger.open .nav-burger__line:nth-child(1){-webkit-transform:translateY(11px) rotate(45deg);-ms-transform:translateY(11px) rotate(45deg);transform:translateY(11px) rotate(45deg)}.nav-burger.open .nav-burger__line:nth-child(3){-webkit-transform:translateY(-11px) rotate(-45deg);-ms-transform:translateY(-11px) rotate(-45deg);transform:translateY(-11px) rotate(-45deg)}.nav{list-style:none;margin:0}.nav>li{display:inline-block;margin-right:24px}.nav>li:last-child{margin-right:0}.nav>li>a{display:block}@media screen and (max-width: 768px){.nav--header{position:fixed;top:0;left:0;visibility:hidden;width:0;height:100%;margin:0;-webkit-transition:opacity 500ms ease;-o-transition:opacity 500ms ease;transition:opacity 500ms ease;-webkit-transition:opacity .35s ease, visibility .35s ease, width .35s ease;-o-transition:opacity .35s ease, visibility .35s ease, width .35s ease;transition:opacity .35s ease, visibility .35s ease, width .35s ease;text-align:center;opacity:0;background:#fff;-webkit-overflow-scrolling:touch}.nav--header.open{z-index:500;visibility:visible;width:100%;opacity:1}.nav--header.open ul{position:absolute;top:50%;left:0;overflow:auto;width:100%;max-height:100%;margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);-webkit-touch-callout:none;-webkit-overflow-scrolling:touch}.nav--header.open ul>li{width:100%;margin:0}}.alert{padding:24px;margin-bottom:24px;border:1px solid transparent}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:24px}.alert.alert--success{color:#5CB85C;border-color:#5CB85C}.alert.alert--info{color:#444;border-color:#444}.alert.alert--warning{color:#F0AD4E;border-color:#F0AD4E}.alert.alert--danger{color:#D9534F;border-color:#D9534F}
diff --git a/header.php b/header.php
index 5510866..3b2e744 100755
--- a/header.php
+++ b/header.php
@@ -14,7 +14,7 @@
*/
echo file_get_contents(sprintf('%s/css/core.min.css', get_stylesheet_directory())); ?>
-
+