style.css

@charset "UTF-8";
/*!
Theme Name: The Leader
Theme URI: https://injectthemes.com/theleader
Author: Inject Themes
Author URI: http://injectthemes.com/
Description: This is most hackable blog theme you've ever seen.
Version: 1.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: the-leader

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Grid
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
# Media Queries
##########################################
--------------------------------------------------------------*/
/* SOCIAL */
/* raleway-200 - latin */
/* droid-sans-regular - latin */
@font-face {
  font-family: 'Droid Sans';
  font-style: normal;
  font-weight: 400;
  src: url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Droid Sans"), local("DroidSans"), url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.woff2") format("woff2"), url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.woff") format("woff"), url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.ttf") format("truetype"), url("./assets/fonts/droidsans/droid-sans-v6-latin-regular.svg#DroidSans") format("svg");
  /* Legacy iOS */ }
/* droid-sans-700 - latin */
@font-face {
  font-family: 'Droid Sans';
  font-style: normal;
  font-weight: 700;
  src: url("./assets/fonts/droidsans/droid-sans-v6-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Droid Sans Bold"), local("DroidSans-Bold"), url("./assets/fonts/droidsans/droid-sans-v6-latin-700.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/droidsans/droid-sans-v6-latin-700.woff2") format("woff2"), url("./assets/fonts/droidsans/droid-sans-v6-latin-700.woff") format("woff"), url("./assets/fonts/droidsans/droid-sans-v6-latin-700.ttf") format("truetype"), url("./assets/fonts/droidsans/droid-sans-v6-latin-700.svg#DroidSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-300 - latin */
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 300;
  src: url("./assets/fonts/openSans/open-sans-v13-latin-300.eot");
  /* IE9 Compat Modes */
  src: local("OpenSans Light"), local("OpenSans-Light"), url("./assets/fonts/openSans/open-sans-v13-latin-300.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/openSans/open-sans-v13-latin-300.woff2") format("woff2"), url("./assets/fonts/openSans/open-sans-v13-latin-300.woff") format("woff"), url("./assets/fonts/openSans/open-sans-v13-latin-300.ttf") format("truetype"), url("./assets/fonts/openSans/open-sans-v13-latin-300.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-regular - latin */
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 400;
  src: url("./assets/fonts/openSans/open-sans-v13-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("OpenSans"), local("OpenSans"), url("./assets/fonts/openSans/open-sans-v13-latin-regular.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/openSans/open-sans-v13-latin-regular.woff2") format("woff2"), url("./assets/fonts/openSans/open-sans-v13-latin-regular.woff") format("woff"), url("./assets/fonts/openSans/open-sans-v13-latin-regular.ttf") format("truetype"), url("./assets/fonts/openSans/open-sans-v13-latin-regular.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-600 - latin */
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 600;
  src: url("./assets/fonts/openSans/open-sans-v13-latin-600.eot");
  /* IE9 Compat Modes */
  src: local("OpenSans Semibold"), local("OpenSans-Semibold"), url("./assets/fonts/openSans/open-sans-v13-latin-600.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/openSans/open-sans-v13-latin-600.woff2") format("woff2"), url("./assets/fonts/openSans/open-sans-v13-latin-600.woff") format("woff"), url("./assets/fonts/openSans/open-sans-v13-latin-600.ttf") format("truetype"), url("./assets/fonts/openSans/open-sans-v13-latin-600.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/* open-sans-700 - latin */
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 700;
  src: url("./assets/fonts/openSans/open-sans-v13-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("OpenSans Bold"), local("OpenSans-Bold"), url("./assets/fonts/openSans/open-sans-v13-latin-700.eot?#iefix") format("embedded-opentype"), url("./assets/fonts/openSans/open-sans-v13-latin-700.woff2") format("woff2"), url("./assets/fonts/openSans/open-sans-v13-latin-700.woff") format("woff"), url("./assets/fonts/openSans/open-sans-v13-latin-700.ttf") format("truetype"), url("./assets/fonts/openSans/open-sans-v13-latin-700.svg#OpenSans") format("svg");
  /* Legacy iOS */ }
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0; }

/**
 * Add the correct display in IE 9-.
 */
article,
aside,
footer,
header,
nav,
section {
  display: block; }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
figcaption,
figure,
main {
  /* 1 */
  display: block; }

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px; }

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */ }

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit; }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic; }

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000; }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio,
video {
  display: inline-block; }

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none; }

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden; }

/* Forms
========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible; }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none; }

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */ }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto; }

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details,
menu {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/* Scripting
========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
  display: inline-block; }

/**
 * Add the correct display in IE.
 */
template {
  display: none; }

/* Hidden
========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
  display: none; }

/*!  ENDING normalize.css v7.0.0 */
* {
  line-height: 26px;
  line-height: 1.625rem; }

@media screen and (min-width: 40em) {
  p {
    line-height: 31px;
    line-height: 1.722222222222222rem;
    margin-bottom: 10px;
    margin-bottom: 2.63rem;
    margin-left: auto;
    margin-right: auto;
    max-width: 684px;
    max-width: 38rem; } }
/* Defaults
========================================================================== */
@media screen and (min-width: 40em) {
  body,
  html {
    margin: 0;
    width: 100%;
    max-width: none; }

  html {
    font-size: 18px;
    font-size: 1.125rem; } }
body {
  box-sizing: border-box;
  color: #333;
  font-family: "Droid Sans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  font-size: 1.14rem;
  line-height: 1.455rem;
  min-height: 100%;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

form {
  padding: 2.4rem 0; }

pre,
code,
samp,
kbd {
  background-color: #333;
  font-size: 0.80211rem;
  font-family: "Consolas", "Monaco", "Courier New", monospace;
  line-height: 1;
  color: #fff; }

code,
samp,
kbd {
  border-radius: 2px;
  overflow-y: hidden;
  overflow-x: auto;
  padding: .4rem .4rem .2rem; }

samp {
  background-color: #616161;
  color: white; }

pre {
  border-radius: 2px;
  tab-size: 4;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  -webkit-tab-size: 4;
  line-height: 1.455rem;
  overflow-y: hidden;
  overflow-x: auto;
  padding: 1.2rem 1rem;
  margin: 0 0 2.4rem;
  font-size: .95rem; }
  pre code,
  pre samp,
  pre kbd {
    font-size: inherit;
    margin: 0 !important;
    background-color: transparent;
    border: none;
    border-radius: 0;
    padding: 0 !important; }

img,
video {
  max-width: 100%;
  display: table; }

hr {
  height: 4.8rem;
  margin-bottom: 2.4rem;
  position: relative; }
  hr:before {
    background-color: #cdcdce;
    content: '';
    height: 2px;
    position: absolute;
    top: 50%;
    width: 100%; }

ol,
ul {
  margin-left: 2rem;
  padding: 0 0 2.4rem; }

ol {
  list-style-type: decimal; }

ol ol {
  padding-bottom: 0; }

ul {
  list-style-type: disc; }

ul ul {
  padding-bottom: 0; }

dl dt {
  font-weight: bold; }

dd {
  margin-left: -14px;
  text-indent: 2rem;
  margin-bottom: 6px; }

figure {
  margin: 0 auto;
  padding-bottom: 2.4rem; }
  figure img {
    display: table;
    margin: 0 auto; }

small,
sub,
sup {
  font-size: 0.80211rem;
  line-height: 1; }

caption,
figcaption {
  font-size: 0.80211rem;
  font-style: italic;
  text-align: center; }

em,
i {
  font-style: italic; }

strong,
var,
b {
  font-weight: bold; }

q:before {
  content: "'"; }
q:after {
  content: "'"; }
q > q {
  font-style: italic; }

dfn,
abbr {
  border-bottom: 0.1rem dotted #676b72;
  cursor: default; }

label {
  color: #676b72; }

input,
label,
select,
button,
textarea {
  display: block;
  resize: none;
  -webkit-appearance: none;
  -moz-appearance: none; }

/* remove yellow from chrome auto-fill background */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  color: #333;
  -webkit-text-fill-color: #333;
  -webkit-box-shadow: 0 0 0px 1000px white inset !important; }

body {
  margin: 0; }

footer {
  display: block; }

body > footer {
  margin: 0 auto; }

aside {
  display: block; }

header {
  display: block; }

main {
  display: block; }

section {
  display: block; }

/* Links
========================================================================== */
a {
  background: transparent;
  color: #60aaff;
  transition: all .3s; }

a:active, a:hover {
  outline: 0; }

a:hover {
  color: #1481ff; }

a:active {
  color: #1481ff; }

article {
  display: block;
  margin: 0 auto;
  width: 80%; }

@media screen and (min-width: 40em) {
  article {
    max-width: 945px;
    max-width: 52.5rem; } }
audio {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

canvas {
  display: inline-block;
  vertical-align: baseline; }

pre {
  overflow: auto; }

@media screen and (min-width: 40em) {
  code {
    padding: 31px;
    padding: 1.722222222222222rem; } }
code {
  margin: 0 4px;
  display: inline-block;
  padding: .3rem .8rem;
  vertical-align: middle; }

details {
  display: block; }

summary {
  display: block; }

figcaption {
  line-height: 26px;
  line-height: 1.625rem;
  color: #222;
  display: block;
  font-size: .8125rem;
  font-style: italic;
  margin-bottom: 0;
  text-align: center; }

@media screen and (min-width: 40em) {
  figcaption {
    line-height: 31px;
    line-height: 1.722222222222222rem;
    margin-bottom: 0; } }
figure {
  display: block; }

@media screen and (min-width: 40em) {
  figure.f-left,
  figure.f-right {
    max-width: 315px;
    max-width: 17.5rem;
    padding: 0px 31px;
    padding: 0rem 1.722222222222222rem; } }
@media screen and (min-width: 40em) {
  figure.f-left blockquote,
  figure.f-right blockquote {
    padding: 0px;
    padding: 0rem;
    text-align: left; } }
@media screen and (min-width: 40em) {
  figure.f-left blockquote p,
  figure.f-right blockquote p {
    font-size: 19.2px;
    font-size: 1.2rem;
    line-height: 31px;
    line-height: 1.722222222222222rem; } }
hgroup {
  display: block; }

hr {
  margin-top: 52px;
  margin-top: 3.25rem;
  margin-bottom: 52px;
  margin-bottom: 3.25rem;
  box-sizing: content-box;
  border: 0;
  display: block;
  height: 26px;
  height: 1.625rem;
  margin-right: auto;
  margin-left: auto;
  background-size: 100% 26px;
  background-size: 100% 1.625rem;
  width: 100px; }

@media screen and (min-width: 40em) {
  hr {
    margin-top: 62px;
    margin-top: 3.444444444444445rem;
    margin-bottom: 62px;
    margin-bottom: 3.444444444444445rem;
    height: 31px;
    height: 1.722222222222222rem; } }
@media screen and (min-width: 40em) {
  hr {
    background-size: 100% 31px;
    background-size: 100% 1.722222222222222rem; } }
img {
  border: 0;
  max-width: 100%;
  display: block;
  height: auto;
  margin: inherit auto; }

svg:not(:root) {
  overflow: hidden; }

ul li,
ol li {
  margin-bottom: 0; }

nav {
  display: block; }

progress {
  display: inline-block;
  vertical-align: baseline; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

[hidden],
template {
  display: none; }

br {
  margin-bottom: 0; }

abbr {
  letter-spacing: 0.1em; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

em,
i {
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

mark {
  background: #ff0;
  color: #333; }

small {
  line-height: 13px;
  line-height: 0.8125rem;
  font-size: 80%;
  display: block;
  padding: 8px 6px; }

@media screen and (min-width: 40em) {
  small {
    line-height: 15.5px;
    line-height: 0.861111111111111rem; } }
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

video {
  display: inline-block;
  vertical-align: baseline; }

p + h2,
p + h3,
p + h4,
p + h5,
p + h6,
ul + h2,
ul + h3,
ul + h4,
ul + h5,
ul + h6,
ol + h2,
ol + h3,
ol + h4,
ol + h5,
ol + h6,
dl + h2,
dl + h3,
dl + h4,
dl + h5,
dl + h6,
blockquote + h2,
blockquote + h3,
blockquote + h4,
blockquote + h5,
blockquote + h6,
hr + h2,
hr + h3,
hr + h4,
hr + h5,
hr + h6,
pre + h2,
pre + h3,
pre + h4,
pre + h5,
pre + h6,
table + h2,
table + h3,
table + h4,
table + h5,
table + h6,
form + h2,
form + h3,
form + h4,
form + h5,
form + h6,
figure + h2,
figure + h3,
figure + h4,
figure + h5,
figure + h6 {
  margin-top: 24px; }

table {
  border-collapse: collapse;
  border-spacing: 0;
  max-width: 100%;
  width: 100%;
  empty-cells: show;
  font-size: 15px;
  line-height: 24px; }

table caption {
  text-align: left;
  font-size: 14px;
  font-weight: 500;
  color: #676b72; }

th {
  text-align: left;
  font-weight: 700;
  vertical-align: bottom; }

th,
td {
  padding: 1rem 1rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05); }

td {
  vertical-align: top; }

tr.align-middle td,
td.align-middle {
  vertical-align: middle; }

th:first-child,
td:first-child {
  padding-left: 0; }

th:last-child,
td:last-child {
  padding-right: 0; }

tfoot th,
tfoot td {
  color: rgba(49, 52, 57, 0.5); }

table.bordered td,
table.bordered th {
  border: 1px solid rgba(0, 0, 0, 0.05); }

table.striped tr:nth-child(odd) td {
  background: #f8f8f8; }

table.bordered td:first-child,
table.bordered th:first-child,
table.striped td:first-child,
table.striped th:first-child {
  padding-left: 1rem; }

table.bordered td:last-child,
table.bordered th:last-child,
table.striped td:last-child,
table.striped th:last-child {
  padding-right: 1rem; }

table.unstyled td,
table.unstyled th {
  border: none;
  padding: 0; }

@media screen and (max-width: 600px) {
  table {
    width: 100%; }

  thead {
    display: none; }

  tr:nth-of-type(2n) {
    background-color: inherit; }

  tbody td, tfoot td {
    display: block;
    text-align: center; }

  tbody td:before, tfoot td:before {
    content: attr(data-th);
    display: block;
    text-align: center;
    padding: 1rem 1rem .0rem;
    position: relative;
    top: -17px;
    font-weight: 700;
    font-size: 1.1rem; } }
ul,
ul ul,
ul ol,
ol,
ol ul,
ol ol {
  margin: 0 0 0 24px;
  font-size: 1rem; }

ol ol li {
  list-style-type: lower-alpha; }

ol ol ol li {
  list-style-type: lower-roman; }

nav ul,
nav ol {
  margin: 0;
  list-style: none; }

nav ul ul,
nav ul ol,
nav ol ul,
nav ol ol {
  margin-left: 24px; }

ul ul, ol ul {
  list-style-type: circle; }

ol ol ul, ol ul ul, ul ol ul, ul ul ul {
  list-style-type: square; }

ul.unstyled, .widget ul {
  margin-left: 0; }

ul.unstyled, .widget ul,
ul.unstyled ul,
.widget ul ul {
  list-style: none; }

a .icon {
  position: relative;
  top: 1px;
  margin-left: 8px; }

@font-face {
  font-family: 'themify';
  src: url("./assets/fonts/icons/themify.eot?-fvbane");
  src: url("./assets/fonts/icons/themify.eot?#iefix-fvbane") format("embedded-opentype"), url("./assets/fonts/icons/themify.woff?-fvbane") format("woff"), url("./assets/fonts/icons/themify.ttf?-fvbane") format("truetype"), url("./assets/fonts/icons/themify.svg?-fvbane#themify") format("svg");
  font-weight: normal;
  font-style: normal; }
[class^="ti-"], [class*=" ti-"] {
  font-family: 'themify';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.ti-wand:before {
  content: "\e600"; }

.ti-volume:before {
  content: "\e601"; }

.ti-user:before {
  content: "\e602"; }

.ti-unlock:before {
  content: "\e603"; }

.ti-unlink:before {
  content: "\e604"; }

.ti-trash:before {
  content: "\e605"; }

.ti-thought:before {
  content: "\e606"; }

.ti-target:before {
  content: "\e607"; }

.ti-tag:before {
  content: "\e608"; }

.ti-tablet:before {
  content: "\e609"; }

.ti-star:before {
  content: "\e60a"; }

.ti-spray:before {
  content: "\e60b"; }

.ti-signal:before {
  content: "\e60c"; }

.ti-shopping-cart:before {
  content: "\e60d"; }

.ti-shopping-cart-full:before {
  content: "\e60e"; }

.ti-settings:before {
  content: "\e60f"; }

.ti-search:before {
  content: "\e610"; }

.ti-zoom-in:before {
  content: "\e611"; }

.ti-zoom-out:before {
  content: "\e612"; }

.ti-cut:before {
  content: "\e613"; }

.ti-ruler:before {
  content: "\e614"; }

.ti-ruler-pencil:before {
  content: "\e615"; }

.ti-ruler-alt:before {
  content: "\e616"; }

.ti-bookmark:before {
  content: "\e617"; }

.ti-bookmark-alt:before {
  content: "\e618"; }

.ti-reload:before {
  content: "\e619"; }

.ti-plus:before {
  content: "\e61a"; }

.ti-pin:before {
  content: "\e61b"; }

.ti-pencil:before {
  content: "\e61c"; }

.ti-pencil-alt:before {
  content: "\e61d"; }

.ti-paint-roller:before {
  content: "\e61e"; }

.ti-paint-bucket:before {
  content: "\e61f"; }

.ti-na:before {
  content: "\e620"; }

.ti-mobile:before {
  content: "\e621"; }

.ti-minus:before {
  content: "\e622"; }

.ti-medall:before {
  content: "\e623"; }

.ti-medall-alt:before {
  content: "\e624"; }

.ti-marker:before {
  content: "\e625"; }

.ti-marker-alt:before {
  content: "\e626"; }

.ti-arrow-up:before {
  content: "\e627"; }

.ti-arrow-right:before {
  content: "\e628"; }

.ti-arrow-left:before {
  content: "\e629"; }

.ti-arrow-down:before {
  content: "\e62a"; }

.ti-lock:before {
  content: "\e62b"; }

.ti-location-arrow:before {
  content: "\e62c"; }

.ti-link:before {
  content: "\e62d"; }

.ti-layout:before {
  content: "\e62e"; }

.ti-layers:before {
  content: "\e62f"; }

.ti-layers-alt:before {
  content: "\e630"; }

.ti-key:before {
  content: "\e631"; }

.ti-import:before {
  content: "\e632"; }

.ti-image:before {
  content: "\e633"; }

.ti-heart:before {
  content: "\e634"; }

.ti-heart-broken:before {
  content: "\e635"; }

.ti-hand-stop:before {
  content: "\e636"; }

.ti-hand-open:before {
  content: "\e637"; }

.ti-hand-drag:before {
  content: "\e638"; }

.ti-folder:before {
  content: "\e639"; }

.ti-flag:before {
  content: "\e63a"; }

.ti-flag-alt:before {
  content: "\e63b"; }

.ti-flag-alt-2:before {
  content: "\e63c"; }

.ti-eye:before {
  content: "\e63d"; }

.ti-export:before {
  content: "\e63e"; }

.ti-exchange-vertical:before {
  content: "\e63f"; }

.ti-desktop:before {
  content: "\e640"; }

.ti-cup:before {
  content: "\e641"; }

.ti-crown:before {
  content: "\e642"; }

.ti-comments:before {
  content: "\e643"; }

.ti-comment:before {
  content: "\e644"; }

.ti-comment-alt:before {
  content: "\e645"; }

.close:before, .ti-close:before {
  content: "\e646"; }

.ti-clip:before {
  content: "\e647"; }

.ti-angle-up:before {
  content: "\e648"; }

.ti-angle-right:before {
  content: "\e649"; }

.ti-angle-left:before {
  content: "\e64a"; }

.ti-angle-down:before {
  content: "\e64b"; }

.ti-check:before {
  content: "\e64c"; }

.ti-check-box:before {
  content: "\e64d"; }

.ti-camera:before {
  content: "\e64e"; }

.ti-announcement:before {
  content: "\e64f"; }

.ti-brush:before {
  content: "\e650"; }

.ti-briefcase:before {
  content: "\e651"; }

.ti-bolt:before {
  content: "\e652"; }

.ti-bolt-alt:before {
  content: "\e653"; }

.ti-blackboard:before {
  content: "\e654"; }

.ti-bag:before {
  content: "\e655"; }

.ti-move:before {
  content: "\e656"; }

.ti-arrows-vertical:before {
  content: "\e657"; }

.ti-arrows-horizontal:before {
  content: "\e658"; }

.ti-fullscreen:before {
  content: "\e659"; }

.ti-arrow-top-right:before {
  content: "\e65a"; }

.ti-arrow-top-left:before {
  content: "\e65b"; }

.ti-arrow-circle-up:before {
  content: "\e65c"; }

.ti-arrow-circle-right:before {
  content: "\e65d"; }

.ti-arrow-circle-left:before {
  content: "\e65e"; }

.ti-arrow-circle-down:before {
  content: "\e65f"; }

.ti-angle-double-up:before {
  content: "\e660"; }

.ti-angle-double-right:before {
  content: "\e661"; }

.ti-angle-double-left:before {
  content: "\e662"; }

.ti-angle-double-down:before {
  content: "\e663"; }

.ti-zip:before {
  content: "\e664"; }

.ti-world:before {
  content: "\e665"; }

.ti-wheelchair:before {
  content: "\e666"; }

.ti-view-list:before {
  content: "\e667"; }

.ti-view-list-alt:before {
  content: "\e668"; }

.ti-view-grid:before {
  content: "\e669"; }

.ti-uppercase:before {
  content: "\e66a"; }

.ti-upload:before {
  content: "\e66b"; }

.ti-underline:before {
  content: "\e66c"; }

.ti-truck:before {
  content: "\e66d"; }

.ti-timer:before {
  content: "\e66e"; }

.ti-ticket:before {
  content: "\e66f"; }

.ti-thumb-up:before {
  content: "\e670"; }

.ti-thumb-down:before {
  content: "\e671"; }

.ti-text:before {
  content: "\e672"; }

.ti-stats-up:before {
  content: "\e673"; }

.ti-stats-down:before {
  content: "\e674"; }

.ti-split-v:before {
  content: "\e675"; }

.ti-split-h:before {
  content: "\e676"; }

.ti-smallcap:before {
  content: "\e677"; }

.ti-shine:before {
  content: "\e678"; }

.ti-shift-right:before {
  content: "\e679"; }

.ti-shift-left:before {
  content: "\e67a"; }

.ti-shield:before {
  content: "\e67b"; }

.ti-notepad:before {
  content: "\e67c"; }

.ti-server:before {
  content: "\e67d"; }

.ti-quote-right:before {
  content: "\e67e"; }

.ti-quote-left:before {
  content: "\e67f"; }

.ti-pulse:before {
  content: "\e680"; }

.ti-printer:before {
  content: "\e681"; }

.ti-power-off:before {
  content: "\e682"; }

.ti-plug:before {
  content: "\e683"; }

.ti-pie-chart:before {
  content: "\e684"; }

.ti-paragraph:before {
  content: "\e685"; }

.ti-panel:before {
  content: "\e686"; }

.ti-package:before {
  content: "\e687"; }

.ti-music:before {
  content: "\e688"; }

.ti-music-alt:before {
  content: "\e689"; }

.ti-mouse:before {
  content: "\e68a"; }

.ti-mouse-alt:before {
  content: "\e68b"; }

.ti-money:before {
  content: "\e68c"; }

.ti-microphone:before {
  content: "\e68d"; }

.ti-menu:before {
  content: "\e68e"; }

.ti-menu-alt:before {
  content: "\e68f"; }

.ti-map:before {
  content: "\e690"; }

.ti-map-alt:before {
  content: "\e691"; }

.ti-loop:before {
  content: "\e692"; }

.ti-location-pin:before {
  content: "\e693"; }

.ti-list:before {
  content: "\e694"; }

.ti-light-bulb:before {
  content: "\e695"; }

.ti-Italic:before {
  content: "\e696"; }

.ti-info:before {
  content: "\e697"; }

.ti-infinite:before {
  content: "\e698"; }

.ti-id-badge:before {
  content: "\e699"; }

.ti-hummer:before {
  content: "\e69a"; }

.ti-home:before {
  content: "\e69b"; }

.ti-help:before {
  content: "\e69c"; }

.ti-headphone:before {
  content: "\e69d"; }

.ti-harddrives:before {
  content: "\e69e"; }

.ti-harddrive:before {
  content: "\e69f"; }

.ti-gift:before {
  content: "\e6a0"; }

.ti-game:before {
  content: "\e6a1"; }

.ti-filter:before {
  content: "\e6a2"; }

.ti-files:before {
  content: "\e6a3"; }

.ti-file:before {
  content: "\e6a4"; }

.ti-eraser:before {
  content: "\e6a5"; }

.ti-envelope:before {
  content: "\e6a6"; }

.ti-download:before {
  content: "\e6a7"; }

.ti-direction:before {
  content: "\e6a8"; }

.ti-direction-alt:before {
  content: "\e6a9"; }

.ti-dashboard:before {
  content: "\e6aa"; }

.ti-control-stop:before {
  content: "\e6ab"; }

.ti-control-shuffle:before {
  content: "\e6ac"; }

.ti-control-play:before {
  content: "\e6ad"; }

.ti-control-pause:before {
  content: "\e6ae"; }

.ti-control-forward:before {
  content: "\e6af"; }

.ti-control-backward:before {
  content: "\e6b0"; }

.ti-cloud:before {
  content: "\e6b1"; }

.ti-cloud-up:before {
  content: "\e6b2"; }

.ti-cloud-down:before {
  content: "\e6b3"; }

.ti-clipboard:before {
  content: "\e6b4"; }

.ti-car:before {
  content: "\e6b5"; }

.ti-calendar:before {
  content: "\e6b6"; }

.ti-book:before {
  content: "\e6b7"; }

.ti-bell:before {
  content: "\e6b8"; }

.ti-basketball:before {
  content: "\e6b9"; }

.ti-bar-chart:before {
  content: "\e6ba"; }

.ti-bar-chart-alt:before {
  content: "\e6bb"; }

.ti-back-right:before {
  content: "\e6bc"; }

.ti-back-left:before {
  content: "\e6bd"; }

.ti-arrows-corner:before {
  content: "\e6be"; }

.ti-archive:before {
  content: "\e6bf"; }

.ti-anchor:before {
  content: "\e6c0"; }

.ti-align-right:before {
  content: "\e6c1"; }

.ti-align-left:before {
  content: "\e6c2"; }

.ti-align-justify:before {
  content: "\e6c3"; }

.ti-align-center:before {
  content: "\e6c4"; }

.ti-alert:before {
  content: "\e6c5"; }

.ti-alarm-clock:before {
  content: "\e6c6"; }

.ti-agenda:before {
  content: "\e6c7"; }

.ti-write:before {
  content: "\e6c8"; }

.ti-window:before {
  content: "\e6c9"; }

.ti-widgetized:before {
  content: "\e6ca"; }

.ti-widget:before {
  content: "\e6cb"; }

.ti-widget-alt:before {
  content: "\e6cc"; }

.ti-wallet:before {
  content: "\e6cd"; }

.ti-video-clapper:before {
  content: "\e6ce"; }

.ti-video-camera:before {
  content: "\e6cf"; }

.ti-vector:before {
  content: "\e6d0"; }

.ti-themify-logo:before {
  content: "\e6d1"; }

.ti-themify-favicon:before {
  content: "\e6d2"; }

.ti-themify-favicon-alt:before {
  content: "\e6d3"; }

.ti-support:before {
  content: "\e6d4"; }

.ti-stamp:before {
  content: "\e6d5"; }

.ti-split-v-alt:before {
  content: "\e6d6"; }

.ti-slice:before {
  content: "\e6d7"; }

.ti-shortcode:before {
  content: "\e6d8"; }

.ti-shift-right-alt:before {
  content: "\e6d9"; }

.ti-shift-left-alt:before {
  content: "\e6da"; }

.ti-ruler-alt-2:before {
  content: "\e6db"; }

.ti-receipt:before {
  content: "\e6dc"; }

.ti-pin2:before {
  content: "\e6dd"; }

.ti-pin-alt:before {
  content: "\e6de"; }

.ti-pencil-alt2:before {
  content: "\e6df"; }

.ti-palette:before {
  content: "\e6e0"; }

.ti-more:before {
  content: "\e6e1"; }

.ti-more-alt:before {
  content: "\e6e2"; }

.ti-microphone-alt:before {
  content: "\e6e3"; }

.ti-magnet:before {
  content: "\e6e4"; }

.ti-line-double:before {
  content: "\e6e5"; }

.ti-line-dotted:before {
  content: "\e6e6"; }

.ti-line-dashed:before {
  content: "\e6e7"; }

.ti-layout-width-full:before {
  content: "\e6e8"; }

.ti-layout-width-default:before {
  content: "\e6e9"; }

.ti-layout-width-default-alt:before {
  content: "\e6ea"; }

.ti-layout-tab:before {
  content: "\e6eb"; }

.ti-layout-tab-window:before {
  content: "\e6ec"; }

.ti-layout-tab-v:before {
  content: "\e6ed"; }

.ti-layout-tab-min:before {
  content: "\e6ee"; }

.ti-layout-slider:before {
  content: "\e6ef"; }

.ti-layout-slider-alt:before {
  content: "\e6f0"; }

.ti-layout-sidebar-right:before {
  content: "\e6f1"; }

.ti-layout-sidebar-none:before {
  content: "\e6f2"; }

.ti-layout-sidebar-left:before {
  content: "\e6f3"; }

.ti-layout-placeholder:before {
  content: "\e6f4"; }

.ti-layout-menu:before {
  content: "\e6f5"; }

.ti-layout-menu-v:before {
  content: "\e6f6"; }

.ti-layout-menu-separated:before {
  content: "\e6f7"; }

.ti-layout-menu-full:before {
  content: "\e6f8"; }

.ti-layout-media-right-alt:before {
  content: "\e6f9"; }

.ti-layout-media-right:before {
  content: "\e6fa"; }

.ti-layout-media-overlay:before {
  content: "\e6fb"; }

.ti-layout-media-overlay-alt:before {
  content: "\e6fc"; }

.ti-layout-media-overlay-alt-2:before {
  content: "\e6fd"; }

.ti-layout-media-left-alt:before {
  content: "\e6fe"; }

.ti-layout-media-left:before {
  content: "\e6ff"; }

.ti-layout-media-center-alt:before {
  content: "\e700"; }

.ti-layout-media-center:before {
  content: "\e701"; }

.ti-layout-list-thumb:before {
  content: "\e702"; }

.ti-layout-list-thumb-alt:before {
  content: "\e703"; }

.ti-layout-list-post:before {
  content: "\e704"; }

.ti-layout-list-large-image:before {
  content: "\e705"; }

.ti-layout-line-solid:before {
  content: "\e706"; }

.ti-layout-grid4:before {
  content: "\e707"; }

.ti-layout-grid3:before {
  content: "\e708"; }

.ti-layout-grid2:before {
  content: "\e709"; }

.ti-layout-grid2-thumb:before {
  content: "\e70a"; }

.ti-layout-cta-right:before {
  content: "\e70b"; }

.ti-layout-cta-left:before {
  content: "\e70c"; }

.ti-layout-cta-center:before {
  content: "\e70d"; }

.ti-layout-cta-btn-right:before {
  content: "\e70e"; }

.ti-layout-cta-btn-left:before {
  content: "\e70f"; }

.ti-layout-column4:before {
  content: "\e710"; }

.ti-layout-column3:before {
  content: "\e711"; }

.ti-layout-column2:before {
  content: "\e712"; }

.ti-layout-accordion-separated:before {
  content: "\e713"; }

.ti-layout-accordion-merged:before {
  content: "\e714"; }

.ti-layout-accordion-list:before {
  content: "\e715"; }

.ti-ink-pen:before {
  content: "\e716"; }

.ti-info-alt:before {
  content: "\e717"; }

.ti-help-alt:before {
  content: "\e718"; }

.ti-headphone-alt:before {
  content: "\e719"; }

.ti-hand-point-up:before {
  content: "\e71a"; }

.ti-hand-point-right:before {
  content: "\e71b"; }

.ti-hand-point-left:before {
  content: "\e71c"; }

.ti-hand-point-down:before {
  content: "\e71d"; }

.ti-gallery:before {
  content: "\e71e"; }

.ti-face-smile:before {
  content: "\e71f"; }

.ti-face-sad:before {
  content: "\e720"; }

.ti-credit-card:before {
  content: "\e721"; }

.ti-control-skip-forward:before {
  content: "\e722"; }

.ti-control-skip-backward:before {
  content: "\e723"; }

.ti-control-record:before {
  content: "\e724"; }

.ti-control-eject:before {
  content: "\e725"; }

.ti-comments-smiley:before {
  content: "\e726"; }

.ti-brush-alt:before {
  content: "\e727"; }

.ti-youtube:before {
  content: "\e728"; }

.ti-vimeo:before {
  content: "\e729"; }

.ti-twitter:before {
  content: "\e72a"; }

.ti-time:before {
  content: "\e72b"; }

.ti-tumblr:before {
  content: "\e72c"; }

.ti-skype:before {
  content: "\e72d"; }

.ti-share:before {
  content: "\e72e"; }

.ti-share-alt:before {
  content: "\e72f"; }

.ti-rocket:before {
  content: "\e730"; }

.ti-pinterest:before {
  content: "\e731"; }

.ti-new-window:before {
  content: "\e732"; }

.ti-microsoft:before {
  content: "\e733"; }

.ti-list-ol:before {
  content: "\e734"; }

.ti-linkedin:before {
  content: "\e735"; }

.ti-layout-sidebar-2:before {
  content: "\e736"; }

.ti-layout-grid4-alt:before {
  content: "\e737"; }

.ti-layout-grid3-alt:before {
  content: "\e738"; }

.ti-layout-grid2-alt:before {
  content: "\e739"; }

.ti-layout-column4-alt:before {
  content: "\e73a"; }

.ti-layout-column3-alt:before {
  content: "\e73b"; }

.ti-layout-column2-alt:before {
  content: "\e73c"; }

.ti-instagram:before {
  content: "\e73d"; }

.ti-google:before {
  content: "\e73e"; }

.ti-github:before {
  content: "\e73f"; }

.ti-flickr:before {
  content: "\e740"; }

.ti-facebook:before {
  content: "\e741"; }

.ti-dropbox:before {
  content: "\e742"; }

.ti-dribbble:before {
  content: "\e743"; }

.ti-apple:before {
  content: "\e744"; }

.ti-android:before {
  content: "\e745"; }

.ti-save:before {
  content: "\e746"; }

.ti-save-alt:before {
  content: "\e747"; }

.ti-yahoo:before {
  content: "\e748"; }

.ti-wordpress:before {
  content: "\e749"; }

.ti-vimeo-alt:before {
  content: "\e74a"; }

.ti-twitter-alt:before {
  content: "\e74b"; }

.ti-tumblr-alt:before {
  content: "\e74c"; }

.ti-trello:before {
  content: "\e74d"; }

.ti-stack-overflow:before {
  content: "\e74e"; }

.ti-soundcloud:before {
  content: "\e74f"; }

.ti-sharethis:before {
  content: "\e750"; }

.ti-sharethis-alt:before {
  content: "\e751"; }

.ti-reddit:before {
  content: "\e752"; }

.ti-pinterest-alt:before {
  content: "\e753"; }

.ti-microsoft-alt:before {
  content: "\e754"; }

.ti-linux:before {
  content: "\e755"; }

.ti-jsfiddle:before {
  content: "\e756"; }

.ti-joomla:before {
  content: "\e757"; }

.ti-html5:before {
  content: "\e758"; }

.ti-flickr-alt:before {
  content: "\e759"; }

.ti-email:before {
  content: "\e75a"; }

.ti-drupal:before {
  content: "\e75b"; }

.ti-dropbox-alt:before {
  content: "\e75c"; }

.ti-css3:before {
  content: "\e75d"; }

.ti-rss:before {
  content: "\e75e"; }

.ti-rss-alt:before {
  content: "\e75f"; }

/* Grid
ΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇôΓÇô */
/*
Variables
$fg-columns:    The number of columns you wnat your grid to be, defaults to 12
$fg-gutter:     The gutter width used for each column, defaults to 0.5rem
$fg-breakpoints:  The Flex Grid breakpoint object, binds grid namespaces to media queries. Read more about namespaces in the next section. Defaults to ((xs),(sm,768),(md,992px),(lg,1200px))
$fg-class-row:   The class to use for rows, defaults to 'row'
$fg-class-col:    The class to use for columns, defaults to 'col'
$fg-class-off:    The class to use for offsets, defaults to 'off'
Class Reference
.($fg-class-row):     Flex box container, use this to wrap columns.
.($fg-class-col)-(namespace):     This creates a column that will grow/shrink depending on available space in the defined namespace.
.($fg-class-col)-(namespace)-(number):    This creates a column that span the specific number of columns in the defined namespace. Valid numbers are 1-12.
.($fg-class-off)-(namespace)-(number):    This will offset a column by a specific number of columns in the defined namespace. Valid numbers are 1-11.
See docs about the row, col and offset class name variables, default is 'row', 'col', 'off'.

Default valid namespaces are xs, sm, md, lg. The xs namespace is default and uses no media queries. 

*/
/**
 * Grid setup
 *
 * The grid will calculate dimensions based on these two variables:
 * $fg-columns will inform the grid loops how many columns there should be.
 * $fg-gutter will inform the grid loops how big eac column's gutters should be.
 *
 * The grid will name columns, rows, offsets based on these three variables:
 * $fg-class-row string used for the row class
 * $fg-class-col string used for the column class
 * $fg-class-off string used for the offset class
 */
.container-fluid {
  padding-right: 2rem;
  padding-left: 2rem; }

.container, .container-fluid {
  margin-right: auto;
  margin-left: auto; }

.wrap {
  box-sizing: border-box;
  margin: 0 auto; }

/**
 * Break point namespace object
 *
 * Set the default namespace object with these defaults with the
 * understanding that you can pass in whatever you might require for your site.
 *
 * $fg-breakpoints is a Sass list with nested lists inside. Each sub list defines two things.
 * 1. The namespace for that breakpoint. (Required) (i.e. xs, sm, md, lg)
 * 2. The min-width measurement for the breakpoint for that namespace. (i.e. 48em, 62em, 75em)
 *
 * Note: These should be in the proper order (at least till libsass handles map keys properly).
 *
 * Note: If the measurement is left out then it will be skipped when generating
 * the grid and applied to global styles.
 *
 */
/**
 * Class Name Defaults
 *
 * Define class names for columns, rows and offsets in case compatibility with other
 * libraries is necessary.
/**
 * Calculate column size percentage
 */
/**
 * Spacing mixin to create uniform margin/padding
 */
/**
 * Row wrapper class, flex box parent.
 */
.row {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap; }
  .row.reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }

.row.with-gutter {
  margin-left: -0.6rem;
  margin-right: -0.6rem; }

.row.with-gutter > .col-xs, .row.with-gutter > .col-sm, .row.with-gutter > .col-md, .row.with-gutter > .col-lg, .row.with-gutter > .col-hg, .row.with-gutter > .col-xs-1, .row.with-gutter > .col-xs-2, .row.with-gutter > .col-xs-3, .row.with-gutter > .col-xs-4, .row.with-gutter > .col-xs-5, .row.with-gutter > .col-xs-6, .row.with-gutter > .col-xs-7, .row.with-gutter > .col-xs-8, .row.with-gutter > .col-xs-9, .row.with-gutter > .col-xs-10, .row.with-gutter > .col-xs-11, .row.with-gutter > .col-xs-12, .row.with-gutter > .col-sm-1, .row.with-gutter > .col-sm-2, .row.with-gutter > .col-sm-3, .row.with-gutter > .col-sm-4, .row.with-gutter > .col-sm-5, .row.with-gutter > .col-sm-6, .row.with-gutter > .col-sm-7, .row.with-gutter > .col-sm-8, .row.with-gutter > .col-sm-9, .row.with-gutter > .col-sm-10, .row.with-gutter > .col-sm-11, .row.with-gutter > .col-sm-12, .row.with-gutter > .col-md-1, .row.with-gutter > .col-md-2, .row.with-gutter > .col-md-3, .row.with-gutter > .col-md-4, .row.with-gutter > .col-md-5, .row.with-gutter > .col-md-6, .row.with-gutter > .col-md-7, .row.with-gutter > .col-md-8, .row.with-gutter > .col-md-9, .row.with-gutter > .col-md-10, .row.with-gutter > .col-md-11, .row.with-gutter > .col-md-12, .row.with-gutter > .col-lg-1, .row.with-gutter > .col-lg-2, .row.with-gutter > .col-lg-3, .row.with-gutter > .col-lg-4, .row.with-gutter > .col-lg-5, .row.with-gutter > .col-lg-6, .row.with-gutter > .col-lg-7, .row.with-gutter > .col-lg-8, .row.with-gutter > .col-lg-9, .row.with-gutter > .col-lg-10, .row.with-gutter > .col-lg-11, .row.with-gutter > .col-lg-12, .row.with-gutter > .col-hg-1, .row.with-gutter > .col-hg-2, .row.with-gutter > .col-hg-3, .row.with-gutter > .col-hg-4, .row.with-gutter > .col-hg-5, .row.with-gutter > .col-hg-6, .row.with-gutter > .col-hg-7, .row.with-gutter > .col-hg-8, .row.with-gutter > .col-hg-9, .row.with-gutter > .col-hg-10, .row.with-gutter > .col-hg-11, .row.with-gutter > .col-hg-12 {
  padding-left: 0.6rem;
  padding-right: 0.6rem; }

.col-xs, .col-sm, .col-md, .col-lg, .col-hg, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-hg-1, .col-hg-2, .col-hg-3, .col-hg-4, .col-hg-5, .col-hg-6, .col-hg-7, .col-hg-8, .col-hg-9, .col-hg-10, .col-hg-11, .col-hg-12 {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  flex-shrink: 0;
  min-height: 1px; }

.col-xs, .col-sm, .col-md, .col-lg, .col-hg {
  flex-grow: 1;
  flex-basis: 0;
  max-width: 100%; }

/**
 * Generate a set of grid column classes using a namespace
 *
 * .col-[namespace] for intelligent column division
 * .col-[namespace]-[number] for a column that covers a specific number of columns (e.g. 1-12 by default)
 * .off-[namespace]-[number] for pushing a col a specific number of columns (e.g. 1-11 by default)
 * .off-[namespace]-reset for resetting a col's offset for that and larger namespaces
 */
/**
 * Build the grid in two steps, to help minimize file size
 * Step 1, for each namespace, create the grid-base
 * Step 2, for each namespace, wrap the col width/offset measurements in their breakpoint media query
 */
.col-xs-1 {
  flex-basis: 8.33333%;
  max-width: 8.33333%; }

.col-xs-2 {
  flex-basis: 16.66667%;
  max-width: 16.66667%; }

.col-xs-3 {
  flex-basis: 25%;
  max-width: 25%; }

.col-xs-4 {
  flex-basis: 33.33333%;
  max-width: 33.33333%; }

.col-xs-5 {
  flex-basis: 41.66667%;
  max-width: 41.66667%; }

.col-xs-6 {
  flex-basis: 50%;
  max-width: 50%; }

.col-xs-7 {
  flex-basis: 58.33333%;
  max-width: 58.33333%; }

.col-xs-8 {
  flex-basis: 66.66667%;
  max-width: 66.66667%; }

.col-xs-9 {
  flex-basis: 75%;
  max-width: 75%; }

.col-xs-10 {
  flex-basis: 83.33333%;
  max-width: 83.33333%; }

.col-xs-11 {
  flex-basis: 91.66667%;
  max-width: 91.66667%; }

.col-xs-12 {
  flex-basis: 100%;
  max-width: 100%; }

.off-xs-1 {
  margin-left: 8.33333%; }

.off-xs-2 {
  margin-left: 16.66667%; }

.off-xs-3 {
  margin-left: 25%; }

.off-xs-4 {
  margin-left: 33.33333%; }

.off-xs-5 {
  margin-left: 41.66667%; }

.off-xs-6 {
  margin-left: 50%; }

.off-xs-7 {
  margin-left: 58.33333%; }

.off-xs-8 {
  margin-left: 66.66667%; }

.off-xs-9 {
  margin-left: 75%; }

.off-xs-10 {
  margin-left: 83.33333%; }

.off-xs-11 {
  margin-left: 91.66667%; }

.off-xs-reset {
  margin-left: 0; }

.start-xs {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start; }

.center-xs {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.end-xs {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end; }

.top-xs {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start; }

.middle-xs {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }

.bottom-xs {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end; }

.around-xs {
  -ms-flex-pack: distribute;
  justify-content: space-around; }

.between-xs {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }

.first-xs {
  -webkit-box-ordinal-group: 0;
  -ms-flex-order: -1;
  order: -1; }

.last-xs {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1; }

.align-l-xs {
  text-align: left; }

.align-r-xs {
  text-align: right; }

.align-c-xs {
  text-align: center; }

@media only screen and (min-width: 550px) {
  .col-sm-1 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .col-sm-2 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .col-sm-3 {
    flex-basis: 25%;
    max-width: 25%; }

  .col-sm-4 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .col-sm-5 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .col-sm-6 {
    flex-basis: 50%;
    max-width: 50%; }

  .col-sm-7 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .col-sm-8 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .col-sm-9 {
    flex-basis: 75%;
    max-width: 75%; }

  .col-sm-10 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .col-sm-11 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .col-sm-12 {
    flex-basis: 100%;
    max-width: 100%; }

  .off-sm-1 {
    margin-left: 8.33333%; }

  .off-sm-2 {
    margin-left: 16.66667%; }

  .off-sm-3 {
    margin-left: 25%; }

  .off-sm-4 {
    margin-left: 33.33333%; }

  .off-sm-5 {
    margin-left: 41.66667%; }

  .off-sm-6 {
    margin-left: 50%; }

  .off-sm-7 {
    margin-left: 58.33333%; }

  .off-sm-8 {
    margin-left: 66.66667%; }

  .off-sm-9 {
    margin-left: 75%; }

  .off-sm-10 {
    margin-left: 83.33333%; }

  .off-sm-11 {
    margin-left: 91.66667%; }

  .off-sm-reset {
    margin-left: 0; }

  .start-sm {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start; }

  .center-sm {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }

  .end-sm {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }

  .top-sm {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }

  .middle-sm {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }

  .bottom-sm {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }

  .around-sm {
    -ms-flex-pack: distribute;
    justify-content: space-around; }

  .between-sm {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }

  .first-sm {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }

  .last-sm {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }

  .align-l-sm {
    text-align: left; }

  .align-r-sm {
    text-align: right; }

  .align-c-sm {
    text-align: center; } }
@media only screen and (min-width: 800px) {
  .col-md-1 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .col-md-2 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .col-md-3 {
    flex-basis: 25%;
    max-width: 25%; }

  .col-md-4 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .col-md-5 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .col-md-6 {
    flex-basis: 50%;
    max-width: 50%; }

  .col-md-7 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .col-md-8 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .col-md-9 {
    flex-basis: 75%;
    max-width: 75%; }

  .col-md-10 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .col-md-11 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .col-md-12 {
    flex-basis: 100%;
    max-width: 100%; }

  .off-md-1 {
    margin-left: 8.33333%; }

  .off-md-2 {
    margin-left: 16.66667%; }

  .off-md-3 {
    margin-left: 25%; }

  .off-md-4 {
    margin-left: 33.33333%; }

  .off-md-5 {
    margin-left: 41.66667%; }

  .off-md-6 {
    margin-left: 50%; }

  .off-md-7 {
    margin-left: 58.33333%; }

  .off-md-8 {
    margin-left: 66.66667%; }

  .off-md-9 {
    margin-left: 75%; }

  .off-md-10 {
    margin-left: 83.33333%; }

  .off-md-11 {
    margin-left: 91.66667%; }

  .off-md-reset {
    margin-left: 0; }

  .start-md {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start; }

  .center-md {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }

  .end-md {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }

  .top-md {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }

  .middle-md {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }

  .bottom-md {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }

  .around-md {
    -ms-flex-pack: distribute;
    justify-content: space-around; }

  .between-md {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }

  .first-md {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }

  .last-md {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }

  .align-l-md {
    text-align: left; }

  .align-r-md {
    text-align: right; }

  .align-c-md {
    text-align: center; } }
@media only screen and (min-width: 1000px) {
  .col-lg-1 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .col-lg-2 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .col-lg-3 {
    flex-basis: 25%;
    max-width: 25%; }

  .col-lg-4 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .col-lg-5 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .col-lg-6 {
    flex-basis: 50%;
    max-width: 50%; }

  .col-lg-7 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .col-lg-8 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .col-lg-9 {
    flex-basis: 75%;
    max-width: 75%; }

  .col-lg-10 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .col-lg-11 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .col-lg-12 {
    flex-basis: 100%;
    max-width: 100%; }

  .off-lg-1 {
    margin-left: 8.33333%; }

  .off-lg-2 {
    margin-left: 16.66667%; }

  .off-lg-3 {
    margin-left: 25%; }

  .off-lg-4 {
    margin-left: 33.33333%; }

  .off-lg-5 {
    margin-left: 41.66667%; }

  .off-lg-6 {
    margin-left: 50%; }

  .off-lg-7 {
    margin-left: 58.33333%; }

  .off-lg-8 {
    margin-left: 66.66667%; }

  .off-lg-9 {
    margin-left: 75%; }

  .off-lg-10 {
    margin-left: 83.33333%; }

  .off-lg-11 {
    margin-left: 91.66667%; }

  .off-lg-reset {
    margin-left: 0; }

  .start-lg {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start; }

  .center-lg {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }

  .end-lg {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }

  .top-lg {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }

  .middle-lg {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }

  .bottom-lg {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }

  .around-lg {
    -ms-flex-pack: distribute;
    justify-content: space-around; }

  .between-lg {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }

  .first-lg {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }

  .last-lg {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }

  .align-l-lg {
    text-align: left; }

  .align-r-lg {
    text-align: right; }

  .align-c-lg {
    text-align: center; } }
@media only screen and (min-width: 1300px) {
  .col-hg-1 {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }

  .col-hg-2 {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }

  .col-hg-3 {
    flex-basis: 25%;
    max-width: 25%; }

  .col-hg-4 {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }

  .col-hg-5 {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }

  .col-hg-6 {
    flex-basis: 50%;
    max-width: 50%; }

  .col-hg-7 {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }

  .col-hg-8 {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }

  .col-hg-9 {
    flex-basis: 75%;
    max-width: 75%; }

  .col-hg-10 {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }

  .col-hg-11 {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }

  .col-hg-12 {
    flex-basis: 100%;
    max-width: 100%; }

  .off-hg-1 {
    margin-left: 8.33333%; }

  .off-hg-2 {
    margin-left: 16.66667%; }

  .off-hg-3 {
    margin-left: 25%; }

  .off-hg-4 {
    margin-left: 33.33333%; }

  .off-hg-5 {
    margin-left: 41.66667%; }

  .off-hg-6 {
    margin-left: 50%; }

  .off-hg-7 {
    margin-left: 58.33333%; }

  .off-hg-8 {
    margin-left: 66.66667%; }

  .off-hg-9 {
    margin-left: 75%; }

  .off-hg-10 {
    margin-left: 83.33333%; }

  .off-hg-11 {
    margin-left: 91.66667%; }

  .off-hg-reset {
    margin-left: 0; }

  .start-hg {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start; }

  .center-hg {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }

  .end-hg {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }

  .top-hg {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }

  .middle-hg {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }

  .bottom-hg {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end; }

  .around-hg {
    -ms-flex-pack: distribute;
    justify-content: space-around; }

  .between-hg {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }

  .first-hg {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1; }

  .last-hg {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1; }

  .align-l-hg {
    text-align: left; }

  .align-r-hg {
    text-align: right; }

  .align-c-hg {
    text-align: center; } }
/* Headings
========================================================================== */
h1, h2, h3, h4, h5, h6 {
  font-family: "OpenSans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  font-weight: 500; }

h1, h2, h3 {
  padding: .6rem 0 .8rem; }

h4, h5, h6 {
  padding: .4rem 0; }

h1 {
  font-size: 48px;
  font-size: 2.5rem;
  line-height: 52px;
  line-height: 3.25rem;
  margin-top: 6.5rem;
  margin-bottom: 1.625rem; }

h2 {
  font-size: 27px;
  font-size: 2.3875rem;
  line-height: 39px;
  line-height: 2.4375rem;
  margin-top: 4.0625rem;
  margin-bottom: 0.8125rem; }

h3 {
  font-size: 22px;
  font-size: 2.175rem;
  line-height: 26px;
  line-height: 1.625rem;
  margin-top: 3.25rem;
  margin-bottom: 0.8125rem; }

h4 {
  font-size: 19.2px;
  font-size: 1.7rem;
  line-height: 26px;
  line-height: 1.625rem;
  margin-top: 2.4375rem;
  margin-bottom: 0.8125rem; }

h5 {
  font-size: 16px;
  font-size: 1.4rem;
  line-height: 26px;
  line-height: 1.625rem;
  margin-top: 4.0625rem;
  margin-bottom: 0.8125rem; }

h6 {
  font-size: 16px;
  font-size: 1.3rem;
  line-height: 26px;
  line-height: 1.625rem;
  margin-top: 2.4375rem;
  margin-bottom: 0.8125rem; }

h1 + h2 {
  margin-top: 1.625rem; }

h2 + h3,
h3 + h4,
h4 + h5 {
  margin-top: 0.8125rem; }

h5 + h6 {
  margin-top: -0.8125rem; }

h6 {
  font-weight: 400; }

@media screen and (min-width: 37em) {
  h1 {
    font-size: 56px;
    font-size: 2.65rem;
    line-height: 80px;
    line-height: 4rem;
    letter-spacing: -.025em;
    margin-top: 6.4rem;
    margin-bottom: 1.6rem; }

  h2 {
    font-size: 27px;
    font-size: 2.475rem;
    line-height: 48px;
    line-height: 3.900000000000001rem;
    margin-top: 4rem;
    margin-bottom: 0.8rem; }

  h3 {
    font-size: 22px;
    font-size: 2.2075rem;
    line-height: 32px;
    line-height: 3.6rem;
    margin-top: 3.2rem;
    margin-bottom: 0.8rem; }

  h4 {
    font-size: 19.2px;
    font-size: 1.98rem;
    line-height: 32px;
    line-height: 3.2rem;
    margin-top: 2.400000000000001rem;
    margin-bottom: 0.8rem; }

  h5 {
    font-size: 16px;
    font-size: 1.8rem;
    line-height: 32px;
    line-height: 2.2rem;
    margin-top: 4rem;
    margin-bottom: 0.8rem; }

  h6 {
    font-size: 16px;
    font-size: 1.4rem;
    line-height: 32px;
    line-height: 1.6rem;
    margin-top: 2.400000000000001rem;
    margin-bottom: 0.8rem; }

  h1 + h2 {
    margin-top: 1.6rem; }

  h2 + h3,
  h3 + h4,
  h4 + h5 {
    margin-top: 0.8rem; }

  h5 + h6 {
    margin-top: -0.8rem; } }
p {
  padding-bottom: 2.4rem; }

blockquote {
  margin: 0 0 2.4rem 1.2rem;
  border-left: 0.3rem solid #676b72;
  padding: 1.8rem  1.4375rem;
  font-style: italic;
  color: #676b72;
  background-color: #f9f9f9;
  font-size: 1.175rem; }
  blockquote p {
    max-width: 100%;
    padding: 0;
    margin: 0; }
  blockquote p:last-child {
    padding-bottom: 0; }

cite {
  display: block;
  font-size: 74.5%;
  font-style: normal;
  margin-top: 20px; }

figure blockquote {
  padding: 26px 0px;
  padding: 1.625rem 0rem; }

@media screen and (min-width: 40em) {
  figure blockquote {
    padding: 62px 0px 31px;
    padding: 3.444444444444445rem 0rem 1.722222222222222rem;
    text-align: center; } }
figure blockquote p {
  font-size: 27px;
  font-size: 1.6875rem;
  line-height: 39px;
  line-height: 2.4375rem; }

@media screen and (min-width: 40em) {
  figure blockquote p {
    font-size: 27px;
    font-size: 1.6875rem;
    line-height: 46.5px;
    line-height: 2.583333333333334rem; } }
/*

Buttons

Buttons and their variations

Markup:
<button class="button {{modifier_class}}">Button</a>
<a href="#" class="button {{modifier_class}}">Button</a>

.button       - A link that's sized like a button

*/
.button, [type=button],
[type=submit],
button {
  background-color: #B64036;
  border-radius: .13rem;
  font-family: "Droid Sans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 1rem;
  line-height: 2.3rem;
  max-width: 100%;
  height: auto;
  transition-property: all;
  transition-duration: 200ms;
  margin: 0 auto;
  padding: 0 1.8rem;
  text-align: center;
  user-select: none;
  width: auto;
  text-decoration: none;
  min-height: 40px;
  border: 1px solid transparent;
  vertical-align: middle;
  -webkit-appearance: none; }
  .button i, [type=button] i,
  [type=submit] i,
  button i, .button .icon, [type=button] .icon,
  [type=submit] .icon,
  button .icon {
    position: relative;
    top: 1px;
    margin: 0 6px; }
  .button:link, [type=button]:link,
  [type=submit]:link,
  button:link, .button:visited, [type=button]:visited,
  [type=submit]:visited,
  button:visited {
    color: #fff;
    text-decoration: none; }
  .button:focus, [type=button]:focus,
  [type=submit]:focus,
  button:focus, .button:hover, [type=button]:hover,
  [type=submit]:hover,
  button:hover {
    background-color: #ca554b;
    color: #fff; }
  .button:focus, [type=button]:focus,
  [type=submit]:focus,
  button:focus {
    outline: 0.1rem dotted #676b72; }
  .button:active, [type=button]:active,
  [type=submit]:active,
  button:active {
    background-color: #B64036; }
  .button.small, .small[type=button],
  .small[type=submit],
  button.small, .button.large, .large[type=button],
  .large[type=submit],
  button.large, .button.huge, .huge[type=button],
  .huge[type=submit],
  button.huge {
    line-height: 220%; }
  .button.medium-btn, .medium-btn[type=button],
  .medium-btn[type=submit],
  button.medium-btn {
    padding: 0.3rem 1.8rem; }
  .button.large-btn, .large-btn[type=button],
  .large-btn[type=submit],
  button.large-btn {
    padding: 0.7rem 1.8rem; }
  .button.uppercase, .uppercase[type=button],
  .uppercase[type=submit],
  button.uppercase {
    font-size: .95rem; }

.button.outline, .outline[type=button],
.outline[type=submit],
button.outline {
  background: transparent;
  border-width: 2px;
  border-color: #97352d;
  color: #97352d; }
  .button.outline:hover, .outline[type=button]:hover,
  .outline[type=submit]:hover,
  button.outline:hover {
    background: transparent;
    color: #ca554b;
    border-color: #ca554b; }
  .button.outline:active, .outline[type=button]:active,
  .outline[type=submit]:active,
  button.outline:active {
    color: #6f2721;
    border-color: #6f2721; }

.button.round, .round[type=button],
.round[type=submit],
button.round {
  border-radius: 56px; }

.button.raised, .raised[type=button],
.raised[type=submit],
button.raised {
  box-shadow: 1px 11px 20px 1px rgba(0, 0, 0, 0.4); }

.button.block, .block[type=button],
.block[type=submit],
button.block {
  display: block;
  width: 100%;
  padding-top: .2rem;
  padding-bottom: .2rem; }

.button.secondary, .secondary[type=button],
.secondary[type=submit],
button.secondary {
  color: #fff;
  background-color: #242526; }
  .button.secondary:hover, .secondary[type=button]:hover,
  .secondary[type=submit]:hover,
  button.secondary:hover, .button.secondary:focus, .secondary[type=button]:focus,
  .secondary[type=submit]:focus,
  button.secondary:focus {
    background-color: #242526;
    color: #fff;
    opacity: .7; }
  .button.secondary:active, .secondary[type=button]:active,
  .secondary[type=submit]:active,
  button.secondary:active {
    background-color: #0b0c0c;
    color: #fff; }
  .button.secondary.outline, .secondary.outline[type=button],
  .secondary.outline[type=submit],
  button.secondary.outline {
    background: transparent;
    color: #242526;
    border-color: #242526; }
    .button.secondary.outline:focus, .secondary.outline[type=button]:focus,
    .secondary.outline[type=submit]:focus,
    button.secondary.outline:focus, .button.secondary.outline:hover, .secondary.outline[type=button]:hover,
    .secondary.outline[type=submit]:hover,
    button.secondary.outline:hover {
      border-color: #242526;
      background-color: transparent;
      color: #242526;
      opacity: .7; }
    .button.secondary.outline:active, .secondary.outline[type=button]:active,
    .secondary.outline[type=submit]:active,
    button.secondary.outline:active {
      border-color: #242526;
      background-color: transparent;
      color: #0b0c0c; }

.button.inverted, .inverted[type=button],
.inverted[type=submit],
button.inverted {
  color: #333;
  background-color: #fff; }
  .button.inverted:hover, .inverted[type=button]:hover,
  .inverted[type=submit]:hover,
  button.inverted:hover, .button.inverted:focus, .inverted[type=button]:focus,
  .inverted[type=submit]:focus,
  button.inverted:focus {
    background-color: #fff;
    color: #333;
    opacity: .7; }
  .button.inverted:active, .inverted[type=button]:active,
  .inverted[type=submit]:active,
  button.inverted:active {
    background-color: #e6e6e6;
    color: #333; }
  .button.inverted.outline, .inverted.outline[type=button],
  .inverted.outline[type=submit],
  button.inverted.outline {
    background: transparent;
    color: #fff;
    border-color: #fff; }
    .button.inverted.outline:focus, .inverted.outline[type=button]:focus,
    .inverted.outline[type=submit]:focus,
    button.inverted.outline:focus, .button.inverted.outline:hover, .inverted.outline[type=button]:hover,
    .inverted.outline[type=submit]:hover,
    button.inverted.outline:hover {
      border-color: white;
      background-color: transparent;
      color: #fff;
      opacity: .7; }
    .button.inverted.outline:active, .inverted.outline[type=button]:active,
    .inverted.outline[type=submit]:active,
    button.inverted.outline:active {
      border-color: #fff;
      background-color: transparent;
      color: #e6e6e6; }

.label {
  display: inline-block;
  font-size: .8rem;
  background: #e0e1e1;
  padding: 0 10px;
  font-weight: 500;
  color: #333;
  border: 1px solid transparent;
  vertical-align: middle;
  text-decoration: none;
  border-radius: 4px; }
  .label.uppercase {
    font-size: .75rem; }
  .label a, .label a:hover {
    color: inherit;
    text-decoration: none; }

.label.outline {
  background: none;
  border-color: #bdbdbd; }

.badge {
  text-align: center;
  border-radius: 64px;
  padding: 0 6px;
  line-height: 18px; }
  .badge.huge {
    padding: 0 16px; }
  .badge.medium {
    line-height: 30px;
    padding: 0px 9px; }
  .badge.large {
    padding: 0 16px; }

.label.tag {
  padding: 0;
  background: none;
  border: none;
  text-transform: uppercase;
  font-size: 12px; }

.label.success {
  background: #4dbd6f;
  color: #fff; }
  .label.success.tag, .label.success.outline {
    background: none;
    border-color: #4dbd6f;
    color: #4dbd6f; }

.label.error {
  background: #e00e0e;
  color: #fff; }
  .label.error.tag, .label.error.outline {
    background: none;
    border-color: #e00e0e;
    color: #e00e0e; }

.label.warning {
  background: #f7ba45;
  color: #333; }
  .label.warning.tag, .label.warning.outline {
    background: none;
    border-color: #f7ba45;
    color: #f7ba45; }

.label.focus {
  background: #1c86f2;
  color: #fff; }
  .label.focus.tag, .label.focus.outline {
    background: none;
    border-color: #1c86f2;
    color: #1c86f2; }

.label.black {
  background: #333;
  color: #fff; }
  .label.black.tag, .label.black.outline {
    background: none;
    border-color: #333;
    color: #333; }

.label.inverted {
  background: #fff;
  color: #333; }
  .label.inverted.tag, .label.inverted.outline {
    background: none;
    border-color: #fff;
    color: #fff; }

.info-note {
  font-family: "Consolas", "Monaco", "Courier New", monospace;
  font-size: .95rem;
  background: #e0e1e1;
  color: #333;
  padding: 1rem;
  padding-right: 2.5em;
  padding-bottom: .75rem;
  margin-bottom: 1.5rem;
  position: relative; }
  .info-note a {
    color: inherit; }
  .info-note h2, .info-note h3, .info-note h4, .info-note h5, .info-note h6 {
    margin-bottom: 0; }
  .info-note .close {
    position: absolute;
    right: 1rem;
    top: 1.1rem; }

.info-note.error {
  background: #e00e0e;
  color: #fff; }

.info-note.success {
  background: #4dbd6f;
  color: #fff; }

.info-note.warning {
  background: #f7ba45; }

.info-note.focus {
  background: #1c86f2;
  color: #fff; }

.info-note.black {
  background: #333;
  color: #fff; }

.info-note.inverted {
  background: #fff; }

/*

Forms
Markup:
<form method="post" action="" class="form" autocomplete="off">
	<div class="form-item">
		<label>Email</label>
		<input type="email" name="email">
	</div>
	<div class="form-item">
		<label>Country</label>
		<select >
			<option value="">---</option>
		</select>
	</div>

	<div class="form-item multiple-radios">
		<label class="radio">
			<input name="example" type="radio"> 
			<span class="radio__label">I Lied</span>
		</label>
		<label class="radio">
			<input name="example" type="radio"> 
			<span class="radio__label">No, I didn't Lie</span>
		</label>

	</div>


	<div class="form-item">
		<textarea rows="6"></textarea>
	</div>

	<div class="form-item">
		<label class="checkbox">
			<input type="checkbox" />
			<span class="checkbox__label">Remember me</span>
		</label>
	</div>
	<div class="form-item form-buttons">
		<button>Log in</button>
		<button class="button secondary outline">Cancel</button>
	</div>
</form>

*/
fieldset {
  font-family: "Droid Sans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  border: 1px solid rgba(0, 0, 0, 0.1);
  padding: 2rem;
  margin-bottom: 2rem;
  margin-top: 2rem; }
  @media (max-width: 37em) {
    fieldset {
      padding: 2rem 0.3rem; } }

legend {
  font-weight: bold;
  font-size: 12px;
  text-transform: uppercase;
  padding: 0 1rem;
  margin-left: -1rem;
  top: 2px;
  position: relative;
  line-height: 0; }
  @media (max-width: 37em) {
    legend {
      text-align: center; } }

input,
textarea,
select {
  display: block;
  width: 100%;
  font-family: "Droid Sans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  box-sizing: border-box;
  font-size: 15px;
  height: 40px;
  outline: none;
  vertical-align: middle;
  background-color: #fff;
  border: 1px solid #d4d4d4;
  border-radius: 3px;
  box-shadow: none;
  padding: 0 12px; }

input.small-input,
textarea.small-input,
select.small-input {
  height: 30px;
  padding: 0 12px;
  border-radius: 3px; }

input.large-input,
textarea.large-input,
select.large-input {
  height: 65px;
  padding: 0 16px;
  border-radius: 3px; }

input:focus,
textarea:focus,
select:focus {
  outline: none;
  background-color: #fff;
  border-color: #1c86f2;
  box-shadow: 0 0 1px #1c86f2 inset; }

input.error,
textarea.error,
select.error {
  background-color: rgba(240, 60, 105, 0.1);
  border: 1px solid #e00e0e; }
  input.error.error:focus, input.error.error:focus, input.error.error:focus,
  textarea.error.error:focus,
  textarea.error.error:focus,
  textarea.error.error:focus,
  select.error.error:focus,
  select.error.error:focus,
  select.error.error:focus {
    border-color: #e00e0e;
    box-shadow: 0 0 1px #e00e0e inset; }

input.success,
textarea.success,
select.success {
  background-color: rgba(53, 190, 101, 0.1);
  border: 1px solid #4dbd6f; }
  input.success.success:focus, input.success.success:focus, input.success.success:focus,
  textarea.success.success:focus,
  textarea.success.success:focus,
  textarea.success.success:focus,
  select.success.success:focus,
  select.success.success:focus,
  select.success.success:focus {
    border-color: #4dbd6f;
    box-shadow: 0 0 1px #4dbd6f inset; }

input:disabled, input.disabled, .radio input[disabled],
.checkbox input[disabled],
.select input[disabled],
.textfield input[disabled], .radio [disabled] + input,
.checkbox [disabled] + input,
.select [disabled] + input,
.textfield [disabled] + input, input[type=button][disabled],
input[type=submit][disabled],
textarea:disabled,
textarea.disabled,
.radio textarea[disabled],
.checkbox textarea[disabled],
.select textarea[disabled],
.textfield textarea[disabled],
.radio [disabled] + textarea,
.checkbox [disabled] + textarea,
.select [disabled] + textarea,
.textfield [disabled] + textarea,
textarea[type=button][disabled],
textarea[type=submit][disabled],
select:disabled,
select.disabled,
.radio select[disabled],
.checkbox select[disabled],
.select select[disabled],
.textfield select[disabled],
.radio [disabled] + select,
.checkbox [disabled] + select,
.select [disabled] + select,
.textfield [disabled] + select,
select[type=button][disabled],
select[type=submit][disabled] {
  resize: none;
  opacity: 0.6;
  cursor: default;
  font-style: italic;
  color: rgba(0, 0, 0, 0.5); }

/*

Radio
Markup:

<label class="radio {{modifier_class}}">
  <input type="radio" />
  <span class="radio__label">Radio</span>
</label>


Checkbox
Markup:

<label class="checkbox {{modifier_class}}">
  <input type="checkbox" />
  <span class="checkbox__label">Checkbox</span>
</label>


*/
.checkbox input[type=checkbox], .radio input[type=radio] {
  opacity: 0;
  position: absolute;
  z-index: -1; }

.radio, .checkbox {
  margin-bottom: 0.4rem;
  padding: 0 1rem 0 2rem;
  position: relative; }

.radio:before, .checkbox:before {
  background-color: #fff;
  border: 1px solid #7d7d7e;
  content: '';
  height: 16px;
  left: 0;
  margin-top: -10px;
  position: absolute;
  top: 50%;
  width: 16px; }

.radio__label, .checkbox__label {
  color: #7d7d7e;
  font-size: 1rem;
  line-height: 1; }

.checkbox:before,
.checkbox__label:after {
  border-radius: 2px; }

.checkbox input[type=checkbox]:checked + .checkbox__label:after {
  color: #97352d;
  content: '\2714';
  font-size: 14px;
  line-height: 18px;
  text-align: center; }

.radio input[type=radio]:checked + .radio__label:before {
  background-color: #97352d;
  border-radius: 20px;
  content: '';
  height: 10px;
  left: 4px;
  margin-top: -6px;
  position: absolute;
  top: 50%;
  width: 10px; }

.radio:before, .radio__label:after {
  border-radius: 20px; }

.radio__label:after, .checkbox__label:after {
  border: 1px solid transparent;
  content: '';
  height: 18px;
  left: -1px;
  margin-top: -10px;
  position: absolute;
  top: 50%;
  width: 18px; }

.radio input[type=radio]:focus + .radio__label:after, .checkbox input[type=checkbox]:focus + .checkbox__label:after {
  border-color: #97352d;
  box-shadow: 0 1px 7px 1px #cccccc inset;
  margin-top: -11px; }

/*

Input and text areas

Markup:
<label class="textfield {{modifier_class}}">
  <input type="text" />
  <span class="textfield__label">Input</span>
</label>
<label class="textfield {{modifier_class}}">
  <textarea></textarea>
  <span class="textfield__label">Textarea</span>
</label>


*/
input[type="file"] {
  width: auto;
  border: none;
  padding: 0;
  height: auto;
  background: none;
  box-shadow: none;
  display: inline-block; }

input[type="search"],
input.search {
  background-repeat: no-repeat;
  background-position: 8px 53%;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="#000" fill-opacity="0.4" d="M14.891,14.39l-0.5.5a0.355,0.355,0,0,1-.5,0L9.526,10.529a5.3,5.3,0,1,1,2.106-4.212,5.268,5.268,0,0,1-1.1,3.21l4.362,4.362A0.354,0.354,0,0,1,14.891,14.39ZM6.316,2.418a3.9,3.9,0,1,0,3.9,3.9A3.9,3.9,0,0,0,6.316,2.418Z"/></svg>');
  padding-left: 32px; }

input[type="radio"],
input[type="checkbox"] {
  display: inline-block;
  width: auto;
  height: auto;
  padding: 0; }

textarea {
  height: auto;
  padding: 8px 12px;
  line-height: 24px;
  vertical-align: top; }

label {
  display: block;
  font-size: 1rem; }
  label.checkbox,
  label .desc,
  label .success,
  label .error {
    text-transform: none;
    font-weight: normal; }
  label.checkbox, label.radio {
    line-height: 24px;
    cursor: pointer;
    color: inherit; }
    label.checkbox.checkbox input, label.radio.checkbox input {
      margin-top: 0; }

/*

Select

Markup:
<label class="select {{modifier_class}}">
  <select>
    <option disabled="disabled" selected="selected">Select</option>
    <option>Option 1</option>
    <option>Option 2</option>
    <option>Option 3</option>
  </select>
  <span class="select__label">Select Label</span>
</label>

Styleguide 3.4

*/
select {
  -webkit-appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9" height="12" viewBox="0 0 9 12"><path fill="#5e6c75" d="M0.722,4.823L-0.01,4.1,4.134-.01,4.866,0.716Zm7.555,0L9.01,4.1,4.866-.01l-0.732.726ZM0.722,7.177L-0.01,7.9,4.134,12.01l0.732-.726Zm7.555,0L9.01,7.9,4.866,12.01l-0.732-.726Z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 1rem center; }

select[multiple] {
  background-image: none;
  height: auto;
  padding: .5rem .75rem; }

.multiple-checkboxes label.checkbox, .multiple-radios label.radio {
  display: inline-block;
  margin-right: 16px; }

.req {
  position: relative;
  top: -6px;
  font-weight: bold;
  color: #f03c69;
  font-size: 12px;
  padding-left: 2px; }

.desc {
  color: rgba(31, 31, 31, 0.5);
  font-size: 12px;
  line-height: 20px; }

span.desc {
  margin-left: 4px; }

div.desc {
  margin-top: 4px;
  margin-bottom: -8px; }

.form-buttons button,
.form-buttons .button,
.form-buttons [type=button],
.form-buttons [type=submit],
.form-buttons button {
  margin-right: 8px; }

form,
.form-item {
  position: relative;
  padding: 1rem 0;
  margin-bottom: 1rem; }

.form > .form-item:last-child {
  margin-bottom: 0; }

.form .row:last-child .form-item {
  margin-bottom: 0; }

.form span.success,
.form span.error {
  font-size: 12px;
  line-height: 20px;
  margin-left: 4px; }

.form-inline input,
.form-inline textarea,
.form-inline select {
  display: inline-block;
  width: auto; }

.append,
.prepend {
  display: flex; }
  .append input,
  .prepend input {
    flex: 1; }
  .append .button, .append [type=button],
  .append [type=submit],
  .append button,
  .append span,
  .prepend .button,
  .prepend [type=button],
  .prepend [type=submit],
  .prepend button,
  .prepend span {
    flex-shrink: 0; }
  .append span,
  .prepend span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-weight: normal;
    border: 1px solid #d4d4d4;
    background-color: #f8f8f8;
    padding: 0 .875rem;
    color: rgba(0, 0, 0, 0.5);
    font-size: 12px;
    white-space: nowrap; }

.prepend input {
  border-radius: 0 3px 3px 0; }

.prepend .button, .prepend [type=button],
.prepend [type=submit],
.prepend button {
  margin-right: -1px;
  border-radius: 3px 0 0 3px !important; }

.prepend span {
  border-right: none;
  border-radius: 3px 0 0 3px; }

.append input {
  border-radius: 3px 0 0 3px; }

.append .button, .append [type=button],
.append [type=submit],
.append button {
  margin-left: -1px;
  border-radius: 0 3px 3px 0 !important; }

.append span {
  border-left: none;
  border-radius: 0 3px 3px 0; }

/* Removes the clear button from date inputs */
input[type="date"]::-webkit-clear-button {
  display: none; }

/* Removes the spin button */
input[type="date"]::-webkit-inner-spin-button {
  display: none; }

/* Always display the drop down caret */
input[type="date"]::-webkit-calendar-picker-indicator {
  color: #2c3e50; }

/* A few custom styles for date inputs */
input[type="date"] {
  appearance: none;
  -webkit-appearance: none;
  color: #95a5a6;
  font-family: "Helvetica", arial, sans-serif;
  font-size: 18px;
  border: 1px solid #ecf0f1;
  background: #ecf0f1;
  padding: 5px;
  display: inline-block !important;
  visibility: visible !important; }

input[type="date"], focus {
  color: #95a5a6;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none; }

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #a8b2ba; }

::-moz-placeholder {
  /* Firefox 19+ */
  color: #a8b2ba; }

:-ms-input-placeholder {
  /* IE 10+ */
  color: #a8b2ba; }

:-moz-placeholder {
  /* Firefox 18- */
  color: #a8b2ba; }

.breadcrumbs {
  font-size: .95rem;
  margin-bottom: 1.5rem; }
  @media (max-width: 520px) {
    .breadcrumbs {
      display: none; } }
  .breadcrumbs ul {
    display: flex;
    align-items: center; }
  .breadcrumbs.push-center ul {
    justify-content: center; }
  .breadcrumbs span, .breadcrumbs a {
    font-style: normal;
    padding: 0 10px;
    display: inline-block;
    white-space: nowrap; }
  .breadcrumbs li {
    margin-left: 0px; }
    .breadcrumbs li:after {
      display: inline-block;
      content: '/';
      color: rgba(0, 0, 0, 0.3); }
    .breadcrumbs li:last-child:after {
      display: none; }
    .breadcrumbs li:first-child span, .breadcrumbs li:first-child a {
      padding-left: 0; }
    .breadcrumbs li.active a {
      color: #333;
      text-decoration: none;
      cursor: text; }

.pagination {
  margin: 24px 0;
  font-size: 0.80211rem; }
  .pagination ul {
    display: flex;
    margin: 0;
    list-style: none; }
  .pagination.pager-center ul {
    justify-content: center; }
  .pagination span, .pagination a {
    border-radius: 3px;
    display: inline-block;
    padding: 8px 12px;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid transparent; }
  .pagination a {
    text-decoration: none;
    color: #333; }
    .pagination a:hover {
      color: rgba(0, 0, 0, 0.5);
      border-color: #e0e1e1; }
  .pagination span, .pagination li.active a {
    color: rgba(0, 0, 0, 0.5);
    border-color: #e0e1e1;
    cursor: text; }
  .pagination.uppercase {
    font-size: 0.69rem; }
    .pagination.uppercase ul {
      font-size: .78rem; }

.pager span, .pager a {
  padding-left: 16px;
  padding-right: 16px;
  border-radius: 64px;
  border-color: rgba(0, 0, 0, 0.1); }
.pager li {
  flex-basis: 50%; }
.pager li.next {
  text-align: right; }
.pager.pager-center li {
  flex-basis: auto;
  margin-left: 4px;
  margin-right: 4px; }
.pager.flat span, .pager.flat a {
  border: none;
  display: block;
  padding: 0; }
.pager.flat a {
  font-weight: 500; }
  .pager.flat a:hover {
    background: none;
    text-decoration: underline; }

@media (max-width: 768px) {
  .pager.flat ul {
    flex-direction: column; }
  .pager.flat li {
    flex-basis: 100%;
    margin-bottom: 8px;
    text-align: left; } }
.dropdown {
  display: none;
  position: absolute;
  background-color: #fff;
  box-shadow: -1px 4px 25px 2px rgba(0, 0, 0, 0.15);
  z-index: 300;
  border-radius: 4px; }

.dropdown-content {
  display: inline-block;
  padding: 15px 40px;
  width: 160px; }
  .dropdown-content.edge:after {
    right: 20px;
    left: initial; }
  .dropdown-content:after {
    position: absolute;
    content: "";
    background-color: #fff;
    width: 20px;
    height: 20px;
    top: -10px;
    left: 20px;
    transform: rotate(45deg);
    box-shadow: -3px -5px 7px 0px rgba(218, 218, 218, 0.42); }
  .dropdown-content ul {
    list-style: none;
    padding: 0;
    margin: 0; }
  .dropdown-content hr {
    margin: .3rem auto;
    width: 100%;
    height: 0.8rem; }
    .dropdown-content hr:before {
      background-color: #dededf;
      height: 1px; }
  .dropdown-content p {
    font-size: 1rem;
    padding-bottom: 0;
    margin-top: 0px; }
    .dropdown-content p:only-child {
      margin-bottom: 0; }
    .dropdown-content p:last-child {
      margin-bottom: 0; }
  .dropdown-content li {
    color: #333;
    padding: 10px 20px;
    margin: 0 -40px; }
    .dropdown-content li:hover {
      color: #000;
      background-color: #efeff0; }
  .dropdown-content.menu-style li {
    padding: 0;
    margin: 0; }
    .dropdown-content.menu-style li:hover {
      background-color: transparent; }
    .dropdown-content.menu-style li a {
      text-decoration: none;
      display: block;
      color: #333;
      padding: 10px 20px;
      margin: 0 -40px;
      cursor: pointer; }
      .dropdown-content.menu-style li a:hover {
        color: #000;
        background-color: #efeff0; }
      .dropdown-content.menu-style li a:focus, .dropdown-content.menu-style li a:active {
        color: #000;
        background-color: #dededf; }

.modal-box {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow-x: hidden;
  overflow-y: auto;
  font-size: 1rem;
  z-index: 800; }

.modal-wrapper {
  display: table;
  width: 100%;
  height: 100%; }
  .modal-wrapper > div {
    display: table-cell;
    vertical-align: middle; }

.modal {
  position: relative;
  margin: 2% auto;
  padding: 0;
  background: #fff;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  border-radius: 8px; }
  .modal p {
    padding-bottom: 0; }
    .modal p:only-child {
      margin-bottom: 0; }
    .modal p:last-child {
      margin-bottom: 0;
      padding-bottom: 0; }
  @media (max-width: 768) {
    .modal input, .modal textarea {
      font-size: 16px; } }
  .modal .close {
    position: absolute;
    top: 18px;
    right: 16px;
    opacity: .5;
    padding: 4px; }
    .modal .close:hover {
      opacity: 1; }

.modal-header {
  padding: 24px 32px;
  font-size: 1.08rem;
  font-family: "OpenSans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
  font-weight: bold;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05); }
  .modal-header:empty {
    display: none; }

.modal-body {
  padding: 0 2rem 2rem; }

.overlay {
  position: fixed;
  z-index: 200;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.95); }

@media (max-width: 768) {
  .modal-header,
  .modal-body {
    padding: 24px; } }
#tooltip_container {
  color: #fff;
  position: absolute;
  padding: 12px 16px;
  max-width: 200px;
  background: rgba(3, 3, 3, 0.85);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  display: none;
  font-size: 1rem; }

.tabs {
  position: relative; }
  .tabs a.tab-name {
    padding: 15px 20px;
    margin: 0 -3px;
    background-color: #fff;
    border: 1px solid #d4d4d4;
    text-decoration: none;
    font-size: 1rem;
    color: #676b72; }
    .tabs a.tab-name:hover {
      color: #333;
      background-color: #f9f9f9; }
    .tabs a.tab-name.active {
      color: #333;
      background-color: #f9f9f9;
      border-bottom-color: transparent;
      position: relative;
      z-index: 6;
      font-weight: 600; }
  .tabs .tab-text {
    border: 1px solid #d4d4d4;
    position: relative;
    margin: 0 -3px;
    z-index: 5;
    padding: 12px 10px;
    background: #f9f9f9;
    margin-top: 11px;
    font-size: 1rem; }
    .tabs .tab-text p {
      font-size: 1rem;
      margin-bottom: 0;
      margin-top: 0px;
      padding-bottom: 1.8rem; }
      .tabs .tab-text p:only-child {
        padding-bottom: 0; }
      .tabs .tab-text p:last-child {
        padding-bottom: 0; }

@media screen and (max-width: 40em) {
  .tabs a.tab-name {
    display: block; }
  .tabs .tab-text {
    margin-top: 0px; } }
/**
 * Pilpil 
 */
.graf-figure, .progressiveMedia-canvas {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; }

.aspectRatioPlaceholder-fill, figure {
  display: block; }

figure {
  margin: 0; }

.graf-figure {
  position: relative;
  clear: both;
  outline: 0;
  box-sizing: border-box; }

.aspectRatioPlaceholder {
  position: relative;
  width: 100%;
  margin: 0 auto;
  display: block; }

.progressiveMedia {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.05); }

.progressiveMedia-thumbnail {
  display: none; }

.progressiveMedia-canvas, .progressiveMedia-image {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: auto; }

.progressiveMedia-canvas {
  box-sizing: border-box;
  vertical-align: baseline; }

.progressiveMedia-image {
  z-index: 100;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.progressiveMedia .progressiveMedia-canvas {
  visibility: hidden;
  opacity: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

.progressiveMedia.is-canvasLoaded .progressiveMedia-canvas {
  visibility: visible;
  opacity: 1;
  -webkit-transition: visibility 0s linear 0s,opacity .4s 0s;
  transition: visibility 0s linear 0s,opacity .4s 0s; }

.progressiveMedia .progressiveMedia-image {
  visibility: hidden;
  opacity: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

.progressiveMedia.is-imageLoaded .progressiveMedia-image {
  visibility: visible;
  opacity: 1;
  -webkit-transition: visibility 0s linear 0s,opacity 1s 0s;
  transition: visibility 0s linear 0s,opacity 1s 0s; }

.postlist {
  background-color: #f0fafc; }
  .postlist .row {
    max-width: 1380px;
    margin: 0 auto;
    padding: 3.5rem 0; }
  .postlist article .post-data {
    padding: 0rem 2rem 2rem; }
    @media (max-width: 520px) {
      .postlist article .post-data {
        padding: 0rem .8rem .8rem; } }
    @media (max-width: 400px) {
      .postlist article .post-data {
        padding: 0rem .5rem .5rem; } }
  .postlist article .post-link {
    background-color: #fff;
    margin: 20px 10px 20px;
    text-decoration: none;
    color: #676b72;
    border-radius: 6px 6px 0px 0px; }
    .postlist article .post-link:hover {
      box-shadow: 0px 10px 100px 0px rgba(68, 78, 127, 0.15); }
      .postlist article .post-link:hover .post-title {
        color: #B64036; }
  .postlist article .post-title {
    color: #333;
    margin: 1.5rem 0rem .5rem;
    padding: 0;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 600; }
  .postlist article .post-time {
    color: #a8b2ba;
    font-size: .72rem; }
  .postlist article .excerpt-text {
    font-size: 0.8211rem;
    line-height: 180%; }
    .postlist article .excerpt-text p {
      font-size: 0.80211rem;
      line-height: 180%;
      margin: 0;
      padding: 0; }
  .postlist article .post-image {
    background-size: cover;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    max-width: 100%; }

header.blog-info {
  padding: 30px 30px 0px;
  position: absolute;
  width: 100%;
  z-index: 50;
  top: 0px; }
  header.blog-info .title {
    float: left;
    width: 100px;
    margin-top: -15px; }
    header.blog-info .title a {
      text-decoration: none;
      display: block;
      color: #B64036;
      padding: 6px; }
      header.blog-info .title a:hover {
        color: #fff; }
    header.blog-info .title h2 {
      font-size: 1.6rem;
      font-weight: 600;
      margin: 0;
      padding: 0; }

nav.main {
  float: right; }
  nav.main div {
    float: left;
    margin-top: 2px; }
  nav.main ul {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none; }
    nav.main ul li {
      float: left;
      position: relative;
      display: inline-block;
      margin: 0 10px; }
    nav.main ul a {
      font-size: .88rem;
      text-decoration: none;
      display: inline-block;
      padding: 3px 12px 15px;
      cursor: pointer;
      text-transform: uppercase;
      color: #bdbdbd;
      font-weight: 500; }
    nav.main ul.primary_nav a {
      padding: 2px 14px;
      border: 1px solid #bdbdbd;
      border-radius: 34px;
      font-size: .72rem; }
      nav.main ul.primary_nav a:hover {
        border: 1px solid #fff;
        color: #fff; }
      nav.main ul.primary_nav a span.icon {
        font-size: 10px;
        margin-left: 6px;
        vertical-align: 1px;
        display: inline-block; }
    nav.main ul.primary_nav li:last-child a:after {
      content: '|';
      font-family: arial;
      color: #bdbdbd;
      font-size: 16px;
      vertical-align: 0;
      position: relative;
      right: -40px; }
  nav.main .secondary-nav span.icon {
    font-size: 14px;
    vertical-align: -2px; }
  nav.main .secondary-nav .showsearch {
    margin-top: 2px; }
  nav.main .secondary-nav li.option:first-child:before {
    font-family: arial;
    color: #bdbdbd;
    font-size: 16px;
    content: '|';
    position: relative;
    right: -63px;
    top: 2px;
    vertical-align: 0; }

header.single-page-header {
  padding: 30px 10px 0px;
  position: relative; }
  header.single-page-header nav.main ul.primary_nav a {
    color: #676b72;
    border: 1px solid #bdbdbd; }
    header.single-page-header nav.main ul.primary_nav a:hover {
      border: 1px solid #333;
      color: #333; }
  header.single-page-header nav.main ul.secondary-nav span.icon {
    color: #676b72; }
    header.single-page-header nav.main ul.secondary-nav span.icon:hover {
      color: #333; }

section.blog-cover, section.archive-cover {
  position: relative;
  display: table;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background: #101010; }
  section.blog-cover .background, section.archive-cover .background {
    position: absolute;
    overflow: hidden;
    width: 100%;
    height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: .3;
    max-width: 100%;
    background-size: cover; }
  section.blog-cover .introduction, section.archive-cover .introduction {
    position: relative;
    z-index: 4;
    color: white;
    display: table-cell;
    text-align: center;
    vertical-align: middle; }
    section.blog-cover .introduction h1, section.blog-cover .introduction h2, section.blog-cover .introduction h3, section.blog-cover .introduction h4, section.archive-cover .introduction h1, section.archive-cover .introduction h2, section.archive-cover .introduction h3, section.archive-cover .introduction h4 {
      margin: 0 auto; }
    section.blog-cover .introduction h1, section.blog-cover .introduction h2, section.blog-cover .introduction h3, section.blog-cover .introduction h4, section.blog-cover .introduction p, section.archive-cover .introduction h1, section.archive-cover .introduction h2, section.archive-cover .introduction h3, section.archive-cover .introduction h4, section.archive-cover .introduction p {
      text-shadow: 1px 0px 10px #000000; }

section.single.post-cover {
  margin: 5em 0em 2rem; }
  section.single.post-cover .edit-link {
    margin: 0 0 1em; }
    section.single.post-cover .edit-link .post-edit-link {
      text-decoration: none;
      color: #fff; }
  section.single.post-cover .post-category {
    color: #a8b2ba;
    font-size: .8rem; }
    section.single.post-cover .post-category .cat-icon {
      font-size: 1.8rem; }
    section.single.post-cover .post-category a {
      text-transform: uppercase;
      padding: 0px 8px;
      text-decoration: none;
      font-size: 0.70211rem;
      line-height: 180%; }
      section.single.post-cover .post-category a:hover {
        font-weight: 600;
        color: #1481ff; }
  section.single.post-cover .post-title {
    margin-top: 1rem;
    margin-bottom: 0rem; }
  section.single.post-cover .post-time {
    font-size: .8rem;
    color: #a8b2ba; }
  section.single.post-cover .post-thumbnail {
    margin: 2rem 0; }
  section.single.post-cover .cover-image {
    background-size: cover;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    max-width: 100%;
    background-position: 50%;
    width: 100%;
    height: 100%; }

section.archive-cover {
  height: 65vh;
  min-height: 450px; }
  section.archive-cover .background {
    opacity: .2; }
  section.archive-cover .introduction .category-title {
    padding: 0.6rem 1.4rem;
    font-size: 1.349rem;
    border-radius: 4px;
    color: #fff;
    text-shadow: none; }
  section.archive-cover .introduction .tag-title {
    padding: 0.9rem 2.4rem;
    border-bottom: 1px solid #fff; }
    section.archive-cover .introduction .tag-title:before {
      content: "#";
      color: #a8b2ba; }
  section.archive-cover .introduction .archive-title {
    padding: 0.6rem 1.4rem;
    border-radius: 4px;
    background-color: #1c86f2; }

.drawer-overlay.show {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.58);
  z-index: 1000;
  max-width: 100%;
  cursor: pointer; }

.main_drawer {
  z-index: 3000;
  top: 0;
  right: 0;
  overflow-y: auto;
  width: 400px;
  height: 100%;
  padding: 0 35px;
  -webkit-transition: -webkit-transform .5s ease-in-out;
  transition: -webkit-transform .5s ease-in-out;
  transition: transform .5s ease-in-out;
  transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  border-left: 1px solid #eaeaea;
  background: #fff;
  -webkit-overflow-scrolling: touch; }
  .main_drawer.show {
    -webkit-transform: translateX(0);
    transform: translateX(0); }
  .main_drawer .icon.closedrawer {
    top: 22px;
    right: 34px;
    padding: 1rem !important;
    border-radius: 50%;
    background-color: #e0e1e1; }

#searchbar {
  z-index: 100;
  top: 0;
  transition: transform 325ms ease-out;
  transform: translateY(-200px);
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.08);
  border-bottom: 1px solid #dadada;
  background-color: #333; }
  #searchbar.display_search {
    transform: translateY(0px); }
  #searchbar button {
    padding: 1rem 2.4rem;
    margin: 0;
    margin-left: 3rem; }
    @media screen and (max-width: 992px) {
      #searchbar button {
        margin-left: 0; } }
  #searchbar form {
    padding: 0;
    margin: 0;
    box-shadow: 0px 9px 20px 0px rgba(87, 87, 87, 0.46); }
  #searchbar label.textfield {
    padding: 1rem 1rem 3rem;
    margin: 0; }
  #searchbar .search_input {
    padding: 1rem;
    color: #fff;
    background-color: #333;
    background-image: none;
    height: 84px;
    font-size: 1.4rem;
    margin: 0 auto; }
  #searchbar .close_search {
    position: absolute;
    bottom: -26px;
    left: 46.5%;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0px 9px 20px 0px rgba(87, 87, 87, 0.46); }
    #searchbar .close_search .icon {
      border-radius: 50%;
      font-size: 1.019rem !important;
      padding: 1.2rem !important; }

article.single-post-article footer .cat-links, article.single-post-article footer .tags-links {
  margin: 1rem 0;
  font-size: .9rem; }
  article.single-post-article footer .cat-links a, article.single-post-article footer .tags-links a {
    padding: 4px 2px 4px 12px;
    text-decoration: none;
    display: inline-block; }
  article.single-post-article footer .cat-links .heading, article.single-post-article footer .tags-links .heading {
    margin-bottom: 12px;
    font-weight: bold; }
article.single-post-article footer .cat-links a {
  padding: .6rem 1.2rem;
  background-color: #efeff0;
  border-radius: 4px;
  margin: 4px auto; }
  article.single-post-article footer .cat-links a:hover {
    background-color: #dededf; }
article.single-post-article footer .tags-links .heading {
  margin-bottom: 1px; }
article.single-post-article footer .tags-links a:before {
  content: "#";
  color: #a8b2ba; }

.socialdark, nav.social .socialdark {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 70px;
  background: #f2f2f2;
  color: #636c77;
  text-align: center;
  font-size: 16px;
  line-height: 40px;
  padding: 0;
  -webkit-transition: background 0.15s ease-in;
  -moz-transition: background 0.15s ease-in;
  -ms-transition: background 0.15s ease-in;
  -o-transition: background 0.15s ease-in;
  transition: background 0.15s ease-in; }
  .socialdark.twitter, nav.social .socialdark.twitter {
    background: #55acee;
    color: #fff; }
    .socialdark.twitter:hover, nav.social .socialdark.twitter:hover {
      background: #1689e0; }
  .socialdark.facebook, nav.social .socialdark.facebook {
    background: #3b5998;
    color: #fff; }
    .socialdark.facebook:hover, nav.social .socialdark.facebook:hover {
      background: #263961; }
  .socialdark.github, nav.social .socialdark.github {
    background: #333;
    color: #fff; }
    .socialdark.github:hover, nav.social .socialdark.github:hover {
      background: #0d0d0d; }
  .socialdark.youtube, nav.social .socialdark.youtube {
    background: #c4302b;
    color: #fff; }
    .socialdark.youtube:hover, nav.social .socialdark.youtube:hover {
      background: #85211d; }
  .socialdark.dribbble, nav.social .socialdark.dribbble {
    background: #ea4c89;
    color: #fff; }
    .socialdark.dribbble:hover, nav.social .socialdark.dribbble:hover {
      background: #d11960; }
  .socialdark.google, nav.social .socialdark.google {
    background: #dd4b39;
    color: #fff; }
    .socialdark.google:hover, nav.social .socialdark.google:hover {
      background: #ac2d1e; }
  .socialdark.instagram, nav.social .socialdark.instagram {
    background: #3f729b;
    color: #fff; }
    .socialdark.instagram:hover, nav.social .socialdark.instagram:hover {
      background: #294a65; }
  .socialdark.linkedin, nav.social .socialdark.linkedin {
    background: #0e76a8;
    color: #fff; }
    .socialdark.linkedin:hover, nav.social .socialdark.linkedin:hover {
      background: #084461; }
  .socialdark.pinterest, nav.social .socialdark.pinterest {
    background: #c8232c;
    color: #fff; }
    .socialdark.pinterest:hover, nav.social .socialdark.pinterest:hover {
      background: #87181e; }
  .socialdark.skype, nav.social .socialdark.skype {
    background: #00aff0;
    color: #fff; }
    .socialdark.skype:hover, nav.social .socialdark.skype:hover {
      background: #0077a4; }
  .socialdark.tumblr, nav.social .socialdark.tumblr {
    background: #35465c;
    color: #fff; }
    .socialdark.tumblr:hover, nav.social .socialdark.tumblr:hover {
      background: #19212b; }
  .socialdark.flickr, nav.social .socialdark.flickr {
    background: #ff0084;
    color: #fff; }
    .socialdark.flickr:hover, nav.social .socialdark.flickr:hover {
      background: #b3005c; }
  .socialdark.reddit, nav.social .socialdark.reddit {
    background: #5f99cf;
    color: #fff; }
    .socialdark.reddit:hover, nav.social .socialdark.reddit:hover {
      background: #3473ad; }
  .socialdark.stackoverflow, nav.social .socialdark.stackoverflow {
    background: #fe7a15;
    color: #fff; }
    .socialdark.stackoverflow:hover, nav.social .socialdark.stackoverflow:hover {
      background: #c65601; }
  .socialdark.twitch, nav.social .socialdark.twitch {
    background: #6441a5;
    color: #fff; }
    .socialdark.twitch:hover, nav.social .socialdark.twitch:hover {
      background: #432b6e; }
  .socialdark.vine, nav.social .socialdark.vine {
    background: #00b488;
    color: #fff; }
    .socialdark.vine:hover, nav.social .socialdark.vine:hover {
      background: #00684e; }
  .socialdark.vk, nav.social .socialdark.vk {
    background: #45668e;
    color: #fff; }
    .socialdark.vk:hover, nav.social .socialdark.vk:hover {
      background: #2c415b; }
  .socialdark.vimeo, nav.social .socialdark.vimeo {
    background: #1ab7ea;
    color: #fff; }
    .socialdark.vimeo:hover, nav.social .socialdark.vimeo:hover {
      background: #0f83a8; }
  .socialdark.weibo, nav.social .socialdark.weibo {
    background: #d72928;
    color: #fff; }
    .socialdark.weibo:hover, nav.social .socialdark.weibo:hover {
      background: #971d1c; }
  .socialdark.email, nav.social .socialdark.email {
    background: #76b852;
    color: #fff; }
    .socialdark.email:hover, nav.social .socialdark.email:hover {
      background: #538637; }
  .socialdark.soundcloud, nav.social .socialdark.soundcloud {
    background: #ff8800;
    color: #fff; }
    .socialdark.soundcloud:hover, nav.social .socialdark.soundcloud:hover {
      background: #b35f00; }
  .socialdark.slideshare, nav.social .socialdark.slideshare {
    background: #0077b5;
    color: #fff; }
    .socialdark.slideshare:hover, nav.social .socialdark.slideshare:hover {
      background: #004569; }

.sharebutton {
  display: block;
  margin-top: 20px;
  padding: 13px 0;
  width: 47%;
  border-radius: 90px;
  background: #242424;
  color: #fff;
  text-align: center;
  font: 400 12px 'Montserrat', 'Arial', Sans-Serif;
  -webkit-transition: background 0.20s ease-in-out;
  -moz-transition: background 0.20s ease-in-out;
  -ms-transition: background 0.20s ease-in-out;
  -o-transition: background 0.20s ease-in-out;
  transition: background 0.20s ease-in-out; }
  .sharebutton:nth-child(1), .sharebutton:nth-child(2) {
    margin-top: 0; }
  .sharebutton i {
    margin-right: 10px; }
  .sharebutton.left {
    float: left; }
  .sharebutton.right {
    float: right; }
  .sharebutton.twitter {
    background: #55acee; }
    .sharebutton.twitter:hover {
      background: #147bc9; }
  .sharebutton.facebook {
    background: #3b5998; }
    .sharebutton.facebook:hover {
      background: #1e2e4f; }
  .sharebutton.google {
    background: #dd4b39; }
    .sharebutton.google:hover {
      background: #96271a; }
  .sharebutton.reddit {
    background: #5f99cf; }
    .sharebutton.reddit:hover {
      background: #2e669a; }
  .sharebutton.pinterest {
    background: #c8232c; }
    .sharebutton.pinterest:hover {
      background: #711419; }
  .sharebutton.linkedin {
    background: #0e76a8; }
    .sharebutton.linkedin:hover {
      background: #06344a; }
  .sharebutton.email {
    background: #76b852; }
    .sharebutton.email:hover {
      background: #487430; }

.widget {
  padding: 35px 0 0; }
  .widget hr {
    width: 20%;
    height: 2px;
    margin: 10px auto 10px 0;
    border: 0;
    background: #d6d6d6; }
  .widget p {
    font-size: 1.05rem;
    line-height: 33px;
    color: #7a7e81; }
  .widget > :last-child {
    margin-bottom: 0;
    padding-bottom: 0; }
  .widget:after {
    display: block;
    clear: both;
    width: 20%;
    height: 1px;
    margin-top: 35px;
    content: '';
    background: #ececec; }
  .widget.blog_info h3 {
    margin-top: 1rem; }
  .widget .widget-title {
    font-weight: 600;
    line-height: normal;
    margin-bottom: 25px;
    text-transform: uppercase;
    color: #333; }
  .widget a {
    font-size: 0.85rem;
    font-family: 'OpenSans';
    text-decoration: none;
    font-weight: 500;
    display: inline-block;
    padding: 5px 0;
    color: #333;
    outline: 0; }
    .widget a:hover {
      color: #8b8b8b; }
  .widget li {
    margin: 0;
    padding: 0; }
  .widget.navigation a {
    font-size: 0.85rem;
    font-weight: 600;
    line-height: normal;
    padding: 6px 0 6px;
    text-transform: uppercase; }
  .widget.navigation ul {
    margin: 0;
    padding: 0;
    list-style: none; }
  .widget.navigation li .icon {
    font-size: 0.85rem;
    margin-left: 8px;
    vertical-align: top; }
    .widget.navigation li .icon:hover {
      color: #4e4e4e; }
  .widget.navigation .sub-menu {
    display: none;
    margin: 6px 0px 18px; }
    .widget.navigation .sub-menu li a {
      font-size: 0.85rem;
      padding: 6px 0 6px 18px;
      color: #8b8b8b; }
      .widget.navigation .sub-menu li a:hover {
        color: #333; }
  .widget.socialshare .options {
    overflow: hidden;
    padding-bottom: 0; }
  .widget.socialshare a {
    color: #fff;
    outline: 0; }
    .widget.socialshare a:hover {
      color: #fff; }
  .widget.socialshare a:nth-child(odd) {
    float: left; }
  .widget.socialshare a:nth-child(even) {
    float: right; }
  .widget.twitter .tweet {
    clear: both;
    overflow: hidden;
    margin-bottom: 35px; }
  .widget.twitter .text {
    margin-top: 0;
    padding: 0;
    margin-bottom: 25px;
    color: #888e92; }
  .widget.twitter .author {
    font: 300 14px Montserrat,Arial,Sans-Serif;
    display: inline-block;
    float: left; }
  .widget.twitter .icon {
    font-size: 16px;
    margin-right: 5px;
    color: #55acee; }
  .widget.twitter .date {
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    display: inline-block;
    float: right;
    margin-top: 2px;
    text-transform: uppercase;
    color: #cfcfcf; }
  .widget.social ul {
    overflow: hidden;
    margin: 0;
    padding: 0;
    list-style: none; }
    .widget.social ul li {
      float: left;
      margin-right: 9px;
      margin-bottom: 10px; }
  .widget.social:after {
    margin-top: 25px; }
  .widget.latestposts {
    overflow: hidden; }
    .widget.latestposts .post {
      overflow: hidden;
      width: 100%;
      margin-bottom: 40px; }
      .widget.latestposts .post:last-child {
        margin: 0; }
    .widget.latestposts .info {
      margin-top: -4px; }
    .widget.latestposts .category {
      display: inline-block;
      padding: 6px 10px;
      border-radius: 3px;
      background: #3f9bd5;
      color: #ffffff;
      text-transform: uppercase;
      white-space: nowrap;
      font-size: .65rem;
      font-family: "OpenSans", "Helvetica Neue", "Segoe UI", "Verdana", sans-serif;
      line-height: normal; }
      .widget.latestposts .category:hover {
        color: #e1e1e1; }
    .widget.latestposts .thumbnail {
      position: relative;
      display: block;
      float: left;
      overflow: hidden;
      max-width: 65px;
      width: 25%;
      height: 65px;
      border-radius: 3px;
      transform: translateZ(0); }
      .widget.latestposts .thumbnail span {
        display: block;
        width: 100%;
        height: 100%;
        background-size: cover;
        transition: opacity 0.25s ease-in-out; }
      .widget.latestposts .thumbnail .ti-link {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 600;
        color: #000;
        font-size: 24px;
        opacity: 0;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        transition: opacity 0.25s ease-in-out; }
      .widget.latestposts .thumbnail:hover span {
        opacity: 0.4; }
      .widget.latestposts .thumbnail:hover .ti-link {
        opacity: 1; }
    .widget.latestposts .excerpt {
      display: none; }
    .widget.latestposts .info {
      float: left;
      margin-left: 7.5%;
      max-width: 67.5%; }
    .widget.latestposts h4 {
      margin: 0;
      padding: 0;
      font-size: 1.05rem;
      color: #62646c;
      letter-spacing: -1px;
      letter-spacing: -0.5px;
      font-weight: 400;
      line-height: 25px; }
      .widget.latestposts h4 a {
        font-size: inherit;
        color: #62646c; }
      .widget.latestposts h4 a:hover {
        color: #62646c; }
    .widget.latestposts .meta {
      display: none; }
  .widget.copyright p {
    margin: 0;
    padding: 0; }
  .widget.copyright .mhc-tag {
    display: block;
    margin-bottom: 10px; }
  .widget.copyright .main {
    font-size: 13px;
    line-height: normal;
    margin: 0 0 10px;
    letter-spacing: -.5px;
    color: #505357; }
  .widget.copyright a.alt {
    font-size: 12px;
    line-height: normal;
    margin: 0;
    letter-spacing: -.5px;
    color: #a9b1b9; }

.widget .widget-title, .widget > :first-child {
  margin-top: 0;
  padding-top: 0; }

.content-area.archive .posts-count-divider {
  margin-top: 1rem; }
.content-area.archive .row {
  padding-top: 0; }

header.page-header {
  padding: 3.5rem 0.2rem 0rem; }
  header.page-header .category.page-title {
    margin: 0; }
    header.page-header .category.page-title .label {
      margin-top: -8px; }

.comments-area .comments-title > .badge {
  margin-top: -5px; }

.comment-respond .comment-reply-title {
  padding-bottom: 0;
  margin-bottom: 0; }
.comment-respond .comment-notes {
  margin-top: 0;
  margin-bottom: 1rem;
  padding: 4px 12px; }

#colophon {
  padding: 1.5rem 1rem; }
  #colophon .site-info a {
    text-decoration: none; }
  #colophon .site-socials .widget {
    padding: 0; }
  #colophon .site-socials .widget.social:after {
    color: blue;
    margin: 0;
    background: #242526;
    position: absolute; }
  @media (max-width: 800px) {
    #colophon .site-socials section.widget, #colophon .site-socials li, #colophon .site-socials ul {
      float: none;
      display: inline-block;
      text-align: center; } }

/*

Utilities

These utility classes have one or two CSS properties that are meant to save you from creating several identical classes to do the same thing, like just centering some text.

Markup:
<div class="{{modifier_class}}" >
	Example Text
</div>

.disabled                	- Disable an Element
.smooth                 	- Smoothed font rendering

.f-none                   	- float: none;
.f-left                		- float: left;
.f-center                	- margin-left: auto;  margin-right: auto;
.f-right                 		- float: right;
.clearfix                		- Clear floats to keep the parent container in shape

.med-width                	- max-width  980px
.large-width                	- max-width  1180px
.full-width                	- width & max width 100%  
.max-full-width           	-  max width 100%

.display-block             	- block
.display-inlineBlock       - inline-block   
.display-inline               	- inline
.display-none              	- none

.extra-letter-spacing	- .1rem letterspacing
.uppercase             	- text transform uppercase

.align-left                 	- text-align: left;
.align-center               	- text-align: center;
.align-right                	- text-align: right;

.hide-mobile		- hidden after 64em
.hide-desktop 		- hidden before 64em

Styleguide 4.0

*/
.disabled, .radio [disabled],
.checkbox [disabled],
.select [disabled],
.textfield [disabled], .radio [disabled] + *,
.checkbox [disabled] + *,
.select [disabled] + *,
.textfield [disabled] + *, [type=button][disabled],
[type=submit][disabled],
button[disabled] {
  cursor: default;
  opacity: .5;
  pointer-events: none; }

.smooth {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

.push-center {
  margin-left: auto;
  margin-right: auto; }

.f-none {
  float: none; }

.f-left {
  float: left; }

.f-center {
  margin-left: auto;
  margin-right: auto; }

.f-right {
  float: right; }

.clearfix {
  clear: both;
  overflow: hidden; }
  .clearfix:after {
    clear: both;
    content: '';
    display: table; }

.med-width {
  box-sizing: border-box;
  max-width: 980px;
  width: 100%; }

.large-width {
  box-sizing: border-box;
  max-width: 1180px;
  width: 100%; }

.full-width {
  box-sizing: border-box;
  max-width: 100%;
  width: 100%; }

.max-full-width {
  box-sizing: border-box;
  max-width: 100%; }

.italic {
  font-style: italic; }

.display-block, .show, .shown {
  display: block; }

.display-inlineBlock {
  display: inline-block; }

.display-inline {
  display: inline; }

.display-none, .hidden {
  display: none; }

.extra-letter-spacing {
  letter-spacing: .1em; }

.uppercase {
  text-transform: uppercase; }

.lowercase {
  text-transform: lowercase; }

.align-left {
  text-align: left; }

.align-center {
  text-align: center; }

.align-right {
  text-align: right; }

.align-justify {
  text-align: justify; }

.align-center-justify {
  text-align: justify;
  -moz-text-align-last: center;
  text-align-last: center; }

.position-fix {
  position: fixed; }

.position-abs {
  position: absolute; }

.position-rel {
  position: relative; }

.position-normal, .position-static {
  position: static; }

.hide-mobile, .hide-mobile-flex {
  display: none; }

@media screen and (min-width: 768px) {
  .hide-desktop {
    display: none; }

  .hide-mobile {
    display: block; }

  .hide-mobile-flex {
    display: flex; } }
/*

Type Utilities

These are specific typography related utilities

Markup:
<div class="type {{modifier_class}}">
	The quick brown fox jumps over the lazy dog.
</div>

.huge            			- Max Larger than the default font size
.large            			- Larger than the default font size
.medium or .base            - Exactly the default font size
.small            			- Smaller than the default font size
.tiny            			- Much smaller than the default font size

.lightest            - Changes the type to be 100 weight
.light            - Changes the type to be 300 weight
.normal           - Changes the type to be 400 weight
.semibold         - Changes the type to be 600 weight
.bold             - Changes the type to be 700 weight


.muted  	 		- Add muted color to text

.black 			- Adds black color to text - more than #333
.end 				- Remove margin bottom

.highlight 			- Adds highlighting color to text

.nowrap 			- No-wraps a 
.white-wrap		- white spaces shown


*/
.huge {
  font-size: 1.48rem;
  line-height: 170%; }

.large {
  font-size: 1.349rem;
  line-height: 180%; }

.base, .medium {
  font-size: 1.14rem; }

.small {
  font-size: 0.80211rem;
  line-height: 180%; }

.tiny {
  font-size: 0.69rem;
  line-height: 180%;
  letter-spacing: 0.5px; }

.lightest {
  font-weight: 100; }

.light {
  font-weight: 300; }

.normal {
  font-weight: 400; }

.semibold {
  font-weight: 500; }

.bold {
  font-weight: 800; }

.muted {
  opacity: .55; }

a.muted {
  color: #0d0d0e; }

a.muted:hover {
  opacity: 1; }

.black {
  color: #0d0d0e; }

.end {
  margin-bottom: 0 !important; }

.highlight {
  background-color: #e8f1fd; }

.nowrap,
.nowrap td {
  white-space: nowrap; }

.white-wrap {
  white-space: pre; }
  @media screen and (max-width: 640px) {
    .white-wrap {
      white-space: normal; } }

/* 

.close				- makes a simple X button 
.video-container 		- can be used for responsive videos

*/
.close, .main_drawer .icon.closedrawer, #searchbar .close_search .icon {
  font-family: 'themify';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
  min-height: 16px;
  min-width: 16px;
  line-height: 16px;
  vertical-align: middle;
  text-align: center;
  font-size: 12px;
  padding: 2px;
  opacity: .6; }
  .close:hover, .main_drawer .icon.closedrawer:hover, #searchbar .close_search .icon:hover {
    opacity: 1;
    cursor: pointer;
    background-color: rgba(51, 51, 51, 0.1); }
  .close.small, .main_drawer .small.icon.closedrawer, #searchbar .close_search .small.icon {
    font-size: 8px; }
  .close.big, .main_drawer .big.icon.closedrawer, #searchbar .close_search .big.icon {
    font-size: 18px; }
  .close.white, .main_drawer .white.icon.closedrawer, #searchbar .close_search .white.icon {
    color: #fff; }

.video-container {
  height: 0;
  padding-bottom: 56.25%;
  position: relative;
  margin-bottom: 16px; }

.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important; }

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear; }

.fade.in {
  opacity: 1; }

.fade.out {
  opacity: 0; }

.color-primary {
  color: #B64036; }

.color-secondary {
  color: #242526; }

.bg-primary {
  background-color: #B64036; }

.bg-secondary {
  background-color: #242526; }

.color-text {
  color: #333; }

.color-white {
  color: #fff; }