/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

@import url('https://fonts.googleapis.com/css?family=Open+Sans');

.post__tags a, a {
  -webkit-transition: .4s
}

legend, td, th {
  padding: 0
}

hr, img, legend {
  border: 0
}

a, a:active, a:visited, body {
  color: #222
}

.button, .heading, .separator {
  letter-spacing: 1px
}

.column, .separator, sub, sup {
  position: relative
}

.button, .post-card, .separator, .share-list li {
  text-align: center
}

.box a, .button, .logo a, .navigation a, .pagination a, .post__tags a, .search-results__item__title, .tag-card__image, a.custom, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  text-decoration: none
}

.list-bare, .no-bullets, .share-list, .social-nav {
  list-style: none
}

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}

body {
  margin: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block
}

audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline
}

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

[hidden], template {
  display: none
}

a {
  background-color: transparent;
  transition: .4s
}

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

abbr[title] {
  border-bottom: 1px dotted
}

b, optgroup, strong {
  font-weight: 700
}

dfn {
  font-style: italic
}

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

small {
  font-size: 80%
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline
}

sup {
  top: -.5em
}

sub {
  bottom: -.25em
}

img {
  height: auto;
  max-width: 100%
}

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

figure {
  margin: 1em 40px
}

code, kbd, pre, samp {
  font-family: monospace, monospace;
  font-size: 1em
}

button, input, optgroup, select, textarea {
  color: inherit;
  font: inherit;
  margin: 0
}

body, h1, h2, h3, h4, h5, h6 {
  font-family: Open Sans, Georgia, serif
}

.box__title, .separator, body {
  font-weight: 300
}

.italic, blockquote {
  font-style: italic
}

button {
  overflow: visible
}

button, select {
  text-transform: none
}

.pagination a, .separator {
  text-transform: uppercase
}

button, html input[type=button], input[type=reset], input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer
}

button[disabled], html input[disabled] {
  cursor: default
}

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0
}

input {
  line-height: normal
}

input[type=checkbox], input[type=radio] {
  box-sizing: border-box;
  padding: 0
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
  height: auto
}

input[type=search] {
  -webkit-appearance: textfield;
  box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

fieldset {
  border: 1px solid silver;
  margin: 0 2px;
  padding: .35em .625em .75em
}

textarea {
  overflow: auto
}

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

*, :after, :before {
  box-sizing: border-box
}

.wrapper {
  padding: 25px 0
}

@media only screen and (min-width:64.063em) {
  .wrapper {
    padding: 32px 0;
    margin-left: 250px
  }
}

.off-canvas-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 100vh;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column
}

.off-canvas-container .wrapper {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto
}

@font-face {
  font-family: Born;
  src: url(/assets/fonts/Born/Born.eot);
  src: url(/assets/fonts/Born/Born.woff2) format("woff2"), url(/assets/fonts/Born/Born.woff) format("woff"), url(/assets/fonts/Born/Born.ttf) format("truetype"), url(/assets/fonts/Born/Born.svg#Born) format("svg"), url(/assets/fonts/Born/Born.eot?#iefix) format("embedded-opentype");
  font-weight: 400;
  font-style: normal
}

body {
  background-color: #FFF;
  font-size: 19px;
  line-height: 32px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

@media only screen and (max-width:40em) {
  body {
    font-size: 16px;
    line-height: 25px
  }
}

h1, h2, h3, h4, h5, h6 {
  font-size: 19px;
  font-weight: 300;
  margin: 0 0 25px;
  line-height: initial
}

.post-content h1 {
  font-size: 32px
}

.post-content h2 {
  font-size: 28px
}

.post-content h3 {
  font-size: 26px
}

.post-content h4 {
  font-size: 22px
}

.post-content h5 {
  font-size: 19px
}

.post-content ol, .post-content p, .post-content ul {
  font-size: 19px;
  margin-bottom: 25px
}

.post-content li {
  margin: 0 0 12.5px
}

p {
  margin: 0 0 32px
}

p.font-medium {
  margin: 0 0 25px
}

p.font-small {
  margin: 0 0 22px
}

p.font-tiny {
  margin: 0 0 19px
}

hr, ol, ul {
  margin: 0 0 32px
}

blockquote {
  margin: 0;
  padding: 0 64px
}

hr {
  box-sizing: content-box;
  height: 1px;
  background-color: #ECF0F1
}

ol ol, ol ul, ul ol, ul ul {
  margin: 0
}

@media only screen and (max-width:40em) {
  hr, ol, p, ul {
    margin: 0 0 25px
  }
  blockquote {
    padding: 0 44px
  }
}

.post__tags a, a:hover {
  color: #7E7E7E
}

.box {
  padding-bottom: 25px;
  margin-bottom: 25px;
  overflow: hidden;
  border-bottom: 1px solid #ECF0F1
}

@media only screen and (min-width:64.063em) {
  .box {
    padding-bottom: 32px;
    margin-bottom: 32px
  }
}

.box__icon {
  float: left;
  width: 32px;
  margin-right: 10.67px
}

.box__title {
  margin: 0;
  line-height: 25px
}

@media only screen and (min-width:40.063em) {
  .box__body {
    overflow: hidden
  }
}

.box__text {
  margin-top: 11px;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 22px
}

.box--author, .box--news-letter {
  padding: 25px;
  background-color: #FAFAFA
}

@media only screen and (min-width:64.063em) {
  .box--author, .box--news-letter {
    padding: 32px
  }
}

iframe, img {
  display: block
}

.post-content .fluid-width-video-wrapper, .post-content .twitter-tweet, .post-content iframe, .post-content img {
  margin-bottom: 25px!important
}

@media only screen and (max-width:40em) {
  .post-content .fluid-width-video-wrapper, .post-content .twitter-tweet, .post-content iframe, .post-content img {
    margin-bottom: 22px
  }
}

.post-content p img {
  margin-bottom: 0
}

.post__tags {
  margin-bottom: 28px;
  font-size: 14px
}

.post__tags a {
  padding: 3px 11px;
  margin: 4px 8px 4px 0;
  display: inline-block;
  font-size: 12px;
  line-height: 22px;
  border: 1px solid #ECF0F1;
  transition: .4s
}

.post__tags a:before {
  content: "#";
  padding-right: 2px
}

.post__tags a:hover {
  color: #222;
  border-color: #222
}

.button, .button:visited {
  color: #FFF
}

code, pre {
  font-family: Courier, monospace;
  background-color: #FAFAFA
}

pre {
  overflow: auto;
  margin-top: 0;
  margin-bottom: 32px;
  padding: 32px;
  font-size: 16px;
  white-space: pre-wrap;
  word-wrap: break-word
}

@media only screen and (max-width:40em) {
  pre {
    margin-bottom: 22px;
    padding: 25px
  }
}

p code {
  padding: 3px 6px
}

.row {
  margin: 0 auto;
  padding-left: 13px;
  padding-right: 13px;
  max-width: 1100px
}

.CoverImage, .row--full {
  max-width: 100%
}

.row:after, .row:before {
  display: table;
  clear: both;
  content: " "
}

.row .row {
  padding: 0;
  margin-right: -13px;
  margin-left: -13px
}

@media only screen and (min-width:64.063em) {
  .row .row {
    margin-right: -16px;
    margin-left: -16px
  }
  .row {
    padding-left: 16px;
    padding-right: 16px
  }
}

.column {
  float: left;
  padding-right: 13px;
  padding-left: 13px;
  width: 100%
}

.column--center {
  float: none;
  margin: 0 auto
}

@media only screen {
  .small-1 {
    width: 8.33333%
  }
  .small-2 {
    width: 16.66667%
  }
  .small-3 {
    width: 25%
  }
  .small-4 {
    width: 33.33333%
  }
  .small-5 {
    width: 41.66667%
  }
  .small-6 {
    width: 50%
  }
  .small-7 {
    width: 58.33333%
  }
  .small-8 {
    width: 66.66667%
  }
  .small-9 {
    width: 75%
  }
  .small-10 {
    width: 83.33333%
  }
  .small-11 {
    width: 91.66667%
  }
  .small-12 {
    width: 100%
  }
}

@media only screen and (min-width:40.063em) {
  .medium-1 {
    width: 8.33333%
  }
  .medium-2 {
    width: 16.66667%
  }
  .medium-3 {
    width: 25%
  }
  .medium-4 {
    width: 33.33333%
  }
  .medium-5 {
    width: 41.66667%
  }
  .medium-6 {
    width: 50%
  }
  .medium-7 {
    width: 58.33333%
  }
  .medium-8 {
    width: 66.66667%
  }
  .medium-9 {
    width: 75%
  }
  .medium-10 {
    width: 83.33333%
  }
  .medium-11 {
    width: 91.66667%
  }
  .medium-12 {
    width: 100%
  }
}

@media only screen and (min-width:64.063em) {
  .column {
    padding-right: 16px;
    padding-left: 16px
  }
  .large-1 {
    width: 8.33333%
  }
  .large-2 {
    width: 16.66667%
  }
  .large-3 {
    width: 25%
  }
  .large-4 {
    width: 33.33333%
  }
  .large-5 {
    width: 41.66667%
  }
  .large-6 {
    width: 50%
  }
  .large-7 {
    width: 58.33333%
  }
  .large-8 {
    width: 66.66667%
  }
  .large-9 {
    width: 75%
  }
  .large-10 {
    width: 83.33333%
  }
  .large-11 {
    width: 91.66667%
  }
  .large-12 {
    width: 100%
  }
}

input[type=text], input[type=tel], input[type=number], input[type=email], textarea {
  width: 100%;
  max-width: 100%;
  margin-bottom: 0;
  display: inline-block;
  border: 1px solid #222;
  padding: 8px 16px;
  font-family: Born, Georgia, serif;
  font-size: 14px;
  line-height: 25px;
  letter-spacing: 1px;
  outline: 0;
  background: 0 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
  -webkit-transition: .4s;
  transition: .4s
}

input[type=text]:focus, input[type=tel]:focus, input[type=number]:focus, input[type=email]:focus, textarea:focus {
  border: 1px solid #7E7E7E
}

@media only screen and (min-width:40.063em) {
  .subscribe-form form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
  }
  .subscribe-form .form-group {
    -webkit-box-flex: 8;
    -ms-flex: 8;
    flex: 8
  }
  .subscribe-form .button {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
    position: relative;
    left: -1px
  }
}

.button, .icon {
  display: inline-block
}

.button {
  padding: 8px 16px;
  font-family: Born, Georgia, serif;
  font-size: 12px;
  line-height: 25px;
  border: 0;
  border-radius: 0;
  background-color: #222;
  -webkit-transition: .4s;
  transition: .4s
}

.heading, .post-card, .separator:after {
  border-bottom: 1px solid #ECF0F1
}

.button:active, .button:focus, .button:hover {
  color: #FFF;
  background-color: #7E7E7E
}

.button--expand {
  width: 100%
}

.heading {
  padding-bottom: 13px;
  margin-bottom: 32px;
  font-size: 16px;
  line-height: 22px
}

.separator {
  margin: 32px auto;
  font-size: 14px
}

.separator:after {
  position: absolute;
  right: 0;
  left: 0;
  top: 50%;
  content: ""
}

.separator__title {
  position: relative;
  z-index: 1;
  padding: 0 16px;
  background: #FFF
}

@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

.icon {
  vertical-align: bottom;
  position: relative;
  width: 25px;
  height: 25px;
  overflow: hidden;
  fill: currentColor
}

.icon__cnt {
  width: 100%;
  height: 100%;
  background: inherit;
  fill: inherit;
  pointer-events: none;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -ms-transform: translate(.5px, -.3px)
}

.CoverImage, .tag-card__image {
  background-position: 50%;
  background-repeat: no-repeat
}

.icon--m {
  width: 50px;
  height: 50px
}

.icon--l {
  width: 100px;
  height: 100px
}

.icon--xl {
  width: 150px;
  height: 150px
}

.icon--xxl {
  width: 200px;
  height: 200px
}

.icon__spinner, .tag-card__image:after {
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%
}

.icon__spinner {
  left: 0
}

.icon--ei-spinner .icon__spinner, .icon--ei-spinner-2 .icon__spinner {
  -webkit-animation: spin 1s steps(12) infinite;
  animation: spin 1s steps(12) infinite
}

.icon--ei-spinner-3 .icon__spinner {
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite
}

.icon--ei-sc-facebook {
  fill: #3b5998
}

.icon--ei-sc-github {
  fill: #333
}

.icon--ei-sc-google-plus {
  fill: #dd4b39
}

.icon--ei-sc-instagram {
  fill: #3f729b
}

.icon--ei-sc-linkedin {
  fill: #0976b4
}

.icon--ei-sc-odnoklassniki {
  fill: #ed812b
}

.icon--ei-sc-skype {
  fill: #00aff0
}

.icon--ei-sc-soundcloud {
  fill: #f80
}

.icon--ei-sc-tumblr {
  fill: #35465c
}

.icon--ei-sc-twitter {
  fill: #55acee
}

.icon--ei-sc-vimeo {
  fill: #1ab7ea
}

.icon--ei-sc-vk {
  fill: #45668e
}

.icon--ei-sc-youtube {
  fill: #e52d27
}

.icon--ei-sc-pinterest {
  fill: #bd081c
}

.icon--ei-sc-telegram {
  fill: #08c
}

.post-card {
  margin-bottom: 25px;
  padding-bottom: 25px
}

.post-card__image {
  margin-bottom: 16px;
  -webkit-transition: .4s;
  transition: .4s
}

@media only screen and (max-width:40em) {
  .post-card__image {
    margin-bottom: 13px
  }
}

.post-card__title {
  margin-bottom: 0;
  line-height: 25px
}

.post-card__title a {
  display: block;
  border-bottom: none;
  -webkit-transition: .4s;
  transition: .4s
}

.post-card__title a:hover {
  color: #207CDF
}

.post-card__meta {
  margin-bottom: 8px;
  font-size: 12px;
  line-height: 22px;
  color: #7E7E7E
}

.post-card__meta a {
  color: #7E7E7E;
  text-decoration: none
}

.post-card:hover .post-card__image {
  opacity: .9
}

.post-card:hover .post-card__title a {
  color: #207CDF
}

.post-card--featured__icon {
  position: absolute;
  bottom: 8px;
  left: 8px;
  fill: #FFF
}

@media only screen and (min-width:64.063em) {
  .post-card {
    margin-bottom: 32px;
    padding-bottom: 32px
  }
}

.post-list {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap
}

.post-list .post-card-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex
}

.post-list .post-card {
  width: 100%
}

.tag-card {
  margin-bottom: 32px;
  background-color: #FAFAFA
}

.tag-card__image {
  background-color: #FAFAFA;
  background-size: cover
}

.tag-card__image:after {
  -webkit-transition: .4s;
  transition: .4s;
  content: '';
  background-color: #000;
  opacity: .1
}

.FlexEmbed, .pagination .icon, .pagination span, .tag-card__title {
  position: relative
}

.FlexEmbed:before, .post-navigation:before {
  content: ""
}

.tag-card__title {
  z-index: 1;
  margin: 0;
  padding: 16px;
  font-weight: 700;
  color: #FFF
}

.tag-card:hover .tag-card__image:after {
  opacity: .2
}

.share-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  border: 1px solid #ECF0F1;
  margin-bottom: 32px;
  line-height: 22px
}

.share-list li {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 0;
  border-right: 1px solid #ECF0F1
}

.share-list li:last-child {
  border-right: 0
}

.share-list__link {
  display: block;
  padding: 8px;
  font-size: 14px;
  -webkit-transition: .4s;
  transition: .4s
}

.share-list__link:hover {
  background-color: #FAFAFA
}

.share-list__link:hover .share-list__icon--twitter {
  fill: #55ACEE
}

.share-list__link:hover .share-list__icon--facebook {
  fill: #3B5998
}

.share-list__link:hover .share-list__icon--google {
  fill: #DC4E41
}

.share-list__icon {
  fill: #7E7E7E
}

@media only screen and (max-width:40em) {
  .share-list {
    margin-bottom: 25px
  }
}

.FlexEmbed {
  display: block;
  overflow: hidden
}

.FlexEmbed:before {
  display: block;
  width: 100%
}

.FlexEmbed--3by1:before {
  padding-bottom: 33.33333%
}

.FlexEmbed--2by1:before {
  padding-bottom: 50%
}

.FlexEmbed--16by9:before {
  padding-bottom: 56.25%
}

.FlexEmbed--4by3:before {
  padding-bottom: 75%
}

.CoverImage {
  max-height: 600px;
  background-size: cover
}

@media only screen and (min-width:64.063em) {
  .navigation {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #DADFE1
  }
}

.navigation li {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 25px
}

.navigation li:last-child {
  margin-bottom: 0
}

.navigation li.nav-current a {
  color: #7E7E7E
}

.home-template .navigation li.nav-current a:not(:hover) {
  color: #222
}

.navigation a {
  -webkit-transition: .4s;
  transition: .4s
}

@media only screen and (max-width:64em) {
  .navigation li {
    display: block;
    text-align: center;
    margin-right: 0;
    line-height: 32px
  }
  .navigation a {
    display: block;
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #ECF0F1
  }
  .navigation {
    margin-bottom: 8px
  }
  .social-nav {
    text-align: center
  }
}

.social-nav {
  margin-bottom: 25px;
  padding: 0
}

.social-nav .icon {
  vertical-align: -moz-middle-with-baseline;
  vertical-align: -webkit-baseline-middle;
  fill: #222;
  -webkit-transition: .4s;
  transition: .4s
}

.social-nav .icon:hover {
  fill: #7E7E7E
}

.social-nav li {
  display: inline-block;
  margin-right: 4px
}

.pagination {
  clear: both;
  font-size: 12px;
  line-height: 25px
}

.pagination .newer-posts {
  float: left;
  text-align: left
}

.pagination .newer-posts span {
  left: -16px
}

.pagination .newer-posts .icon {
  left: -8.33px
}

.pagination .older-posts {
  float: right;
  text-align: right
}

.pagination .older-posts span {
  right: -16px
}

.pagination .older-posts .icon {
  right: -8.33px
}

.pagination a {
  letter-spacing: .2em;
  -webkit-transition: .4s;
  transition: .4s
}

.post-navigation {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1
}

.post-navigation:last-child .post-card {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0
}

@media only screen and (min-width:40.063em) {
  .post-navigation .post-card {
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0
  }
}

.post-navigation:before {
  position: absolute;
  z-index: 1;
  top: 16px;
  padding: 0 16px;
  font-size: 14px;
  color: #7E7E7E;
  background-color: rgba(255, 255, 255, .9);
  -webkit-transition: .4s;
  transition: .4s
}

.post-navigation.prev:before {
  left: 32px;
  content: "Previous Story"
}

.post-navigation.next:before {
  right: 32px;
  content: "Next Story"
}

.post-navigation:hover:before {
  background-color: #fff
}

.logo {
  display: block;
  margin-bottom: 8px
}

.logo a {
  -webkit-transition: .4s;
  transition: .4s;
  letter-spacing: 1px
}

.logo a:hover {
  color: #7E7E7E
}

.logo__img {
  max-height: 25px;
  vertical-align: middle
}

.sidebar {
  position: relative;
  padding: 13px 0;
  line-height: 25px
}

@media only screen and (max-width:64em) {
  .logo {
    margin-bottom: 0;
    line-height: 25px
  }
  .sidebar {
    background-color: #FFF;
    border-bottom: 1px solid #ECF0F1
  }
}

@media only screen and (min-width:64.063em) {
  .logo__img {
    display: inline-block
  }
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 250px;
    height: 100%;
    background-color: #FAFAFA;
    padding: 32px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
  }
  .sidebar__bottom {
    position: absolute;
    left: 0;
    bottom: 32px
  }
}

.sidebar__description {
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid #DADFE1
}

.sidebar__bottom {
  width: 100%;
  text-align: center
}

.off-canvas-toggle {
  display: none
}

@media only screen and (max-width:64em) {
  .sidebar__description {
    display: none
  }
  .home-template .sidebar {
    border-bottom: 1px solid #ECF0F1
  }
  .off-canvas-toggle {
    display: block;
    position: absolute;
    top: 50%;
    right: 22px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 14px;
    cursor: pointer
  }
  body, html {
    overflow-x: hidden
  }
  .off-canvas-content {
    position: fixed;
    top: 0;
    right: 0;
    width: 250px;
    height: 100%;
    background-color: #FFF;
    border-left: 1px solid #ECF0F1;
    -webkit-transform: translate3d(0, 0, 0) translateX(250px);
    transform: translate3d(0, 0, 0) translateX(250px);
    -webkit-transition: all .4s cubic-bezier(.16, .63, .45, .98) 0s;
    transition: all .4s cubic-bezier(.16, .63, .45, .98) 0s
  }
  .off-canvas-container {
    -webkit-transform: translate3d(0, 0, 0) translateX(0);
    transform: translate3d(0, 0, 0) translateX(0);
    -webkit-transition: all .4s cubic-bezier(.16, .63, .45, .98) 0s;
    transition: all .4s cubic-bezier(.16, .63, .45, .98) 0s
  }
  .off-canvas-container.is-active {
    -webkit-transform: translate3d(0, 0, 0) translateX(-250px);
    transform: translate3d(0, 0, 0) translateX(-250px)
  }
}

.author-image {
  float: left;
  margin: 0 25px 0 0
}

.author-image .img {
  height: 96px;
  width: 96px;
  background-position: center;
  background-size: cover;
  border-radius: 100%
}

@media only screen and (min-width:64.063em) {
  .author-image {
    margin-right: 32px
  }
}

.author-meta {
  text-indent: -1px
}

.author-meta .icon {
  fill: #222;
  -webkit-transition: .4s;
  transition: .4s
}

.author-meta a .icon:hover {
  fill: #7E7E7E
}

.post {
  position: relative;
  padding: 19px;
  margin: 0 auto;
  max-width: 45em;
  background: #FFF
}

@media only screen and (min-width:40.063em) {
  .post {
    top: -50px;
    padding: 50px
  }
}

@media only screen and (min-width:64.063em) {
  .post {
    top: -64px;
    padding: 64px
  }
}

.post__header {
  margin-bottom: 13px;
  text-align: center
}

.post__title {
  margin-bottom: 13px;
  font-size: 19px;
  line-height: 32px
}

@media only screen and (min-width:40.063em) {
  .post__title {
    font-size: 32px;
    line-height: 50px
  }
}

.post__date {
  font-size: 14px;
  line-height: 22px;
  color: #7E7E7E
}

.post-content {
  margin-top: 25px
}

.search-form-container {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 101;
  white-space: nowrap;
  background: #FFF;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  -webkit-transform: translate(0, -100%) scale(0, 0);
  transform: translate(0, -100%) scale(0, 0)
}

.search-form-container__close {
  position: absolute;
  top: 32px;
  right: 32px;
  cursor: pointer;
  -webkit-transition: .4s;
  transition: .4s;
  fill: #222
}

.search-form-container__close:hover {
  fill: #7E7E7E;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
}

@media only screen and (max-width:40em) {
  .author-image .img {
    height: 64px;
    width: 64px
  }
  .search-form-container__close {
    top: 16px;
    right: 16px
  }
}

.search-form-container.is-active {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0) scale(1, 1);
  transform: translate(0, 0) scale(1, 1)
}

.search-form {
  margin-bottom: 16px
}

.search-form__field {
  padding: 0;
  width: 100%;
  outline: 0;
  font-weight: 400;
  font-size: 38px;
  line-height: 64px;
  border: 0;
  border-bottom: 1px solid #ECF0F1
}

@media only screen and (max-width:40em) {
  .search-form__field {
    font-size: 28px;
    line-height: 44px
  }
}

.search-form__field:focus {
  border: 0;
  border-bottom: 1px solid #ECF0F1
}

.search-form__submit {
  display: none
}

.search-form__fieldset {
  border: 0;
  margin-top: 64px;
  padding: 0
}

.search-results {
  display: none;
  height: 80vh;
  overflow: auto;
  white-space: normal
}

.ell, .hidden {
  overflow: hidden
}

.search-results .heading {
  margin-right: 16px;
  margin-bottom: 16px;
  color: #7E7E7E
}

.search-results__item {
  margin-bottom: 16px;
  margin-right: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #ECF0F1
}

.search-results__item__title {
  display: block;
  font-size: 16px;
  line-height: 25px
}

.search-results__item__date {
  font-size: 12px;
  line-height: 22px;
  color: #7E7E7E
}

.grey-bg {
  background-color: #FAFAFA
}

.bullets-inside {
  list-style: inside
}

.list-bare {
  margin: 0;
  padding: 0
}

.text-left {
  text-align: left
}

.text-right {
  text-align: right
}

.text-center {
  text-align: center
}

.text-justify {
  text-align: justify
}

.inline {
  display: inline
}

.block {
  display: block
}

.inline-block {
  display: inline-block
}

.hide {
  display: none
}

.left {
  float: left
}

.right {
  float: right
}

.hidden {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  padding: 0;
  position: absolute!important;
  width: 1px
}

.clearfix:after, .clearfix:before {
  content: " ";
  display: table
}

.clearfix:after {
  clear: both
}

.light {
  font-weight: 300
}

.regular {
  font-weight: 400
}

.bold {
  font-weight: 700
}

.cap {
  text-transform: capitalize
}

.uppercase {
  text-transform: uppercase
}

.ell {
  white-space: nowrap;
  text-overflow: ellipsis
}

.font-base {
  font-size: 19px
}

.font-medium {
  font-size: 16px;
  line-height: 25px
}

.font-small {
  font-size: 14px;
  line-height: 22px
}

.font-tiny {
  font-size: 12px;
  line-height: 19px
}