/*
Theme Name: Impact Stories
Theme URI: https://impactstories.io
Author: Impact Stories
Author URI: https://impactstories.io
Description: Impact Stories Wordpress Theme
Version: 4.0.4
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html
Tags: 
Text Domain: Impact Stories
*/

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, form input, form textarea, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

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

/* Define Custom Variables Here */
/* Default Variables */
/* main font family */
/* rgba color with opacity */
/* main width of wrapper */
/* height of footer */
/* sets text color for input fields */
/* Default Styles */
html {
  height: 100%;
}

body {
  height: 100%;
  font-family: "Lato", sans-serif;
}

.bodyWrap {
  min-height: 100%;
  position: relative;
  flex-direction: column;
  width: 100%;
}

::selection {
  background: rgba(236, 240, 166, 0.6);
}

.wrap {
  width: 1120px;
  margin: auto;
}

.wrap.small-wrap {
  box-sizing: border-box;
  padding: 0 73px;
}

.clear {
  clear: both;
}

.fullWidth, header#top-nav, footer {
  width: 100%;
  min-width: 1120px;
}

/* Convert px to rem */
/* Float */
.left {
  float: left;
}

.right {
  float: right;
}

/* Text Align */
.textLeft {
  text-align: left;
}

.textCenter {
  text-align: center;
}

.textRight {
  text-align: right;
}

.textJust {
  text-align: justify;
}

/* Position */
.fixed {
  position: fixed;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

/* Display */
.hide, .mobile {
  display: none;
}

.block, .desktop {
  display: block;
}

.inline {
  display: inline;
}

.inlineBlock {
  display: inline-block;
}

/* Font Weight */
.bold, strong {
  font-weight: bold;
}

.regular {
  font-weight: normal;
}

.italic, em {
  font-style: italic;
}

/* Responsive Element -- Good for making perfect squares or circles */
.element {
  position: relative;
}

.element:after {
  content: '';
  display: block;
  padding-top: 100%;
}

/* Responsive Iframe, Object, Embed */
.videoContainer {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.videoContainer iframe, .videoContainer object, .videoContainer embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Full Width Image (requires width and height) */
.fullImg {
  position: relative;
  overflow: hidden;
}

.fullImg img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  margin: auto;
  min-width: 100%;
  min-height: 100%;
}

/* Typography */
a {
  text-decoration: none;
}

.content {
  color: #414141;
}

.content h1 {
  font-size: 42px;
  font-size: 2.625rem;
  line-height: 54px;
  line-height: 3.375rem;
  font-family: "Oswald", sans-serif;
  margin-bottom: 10px;
}

.content h2 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 37px;
  line-height: 2.3125rem;
  font-family: "Oswald", sans-serif;
  margin-bottom: 10px;
}

.content h3 {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 35px;
  line-height: 2.1875rem;
  font-family: "Oswald", sans-serif;
  margin-bottom: 10px;
}

.content h4 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 33px;
  line-height: 2.0625rem;
  font-family: "Oswald", sans-serif;
  margin-bottom: 10px;
}

.content p {
  font-size: 16px;
  font-size: 1rem;
  line-height: 27px;
  line-height: 1.6875rem;
  margin-bottom: 15px;
  color: #414141;
}

.content ul {
  margin-bottom: 15px;
  padding-left: 25px;
  list-style: disc;
}

.content ul li {
  font-size: 16px;
  font-size: 1rem;
  line-height: 27px;
  line-height: 1.6875rem;
}

.content ol {
  margin-bottom: 15px;
  padding-left: 25px;
  list-style: decimal;
}

.content ol li {
  font-size: 16px;
  font-size: 1rem;
  line-height: 27px;
  line-height: 1.6875rem;
}

.content a {
  color: #93979f;
}

.content a:hover {
  text-decoration: underline;
}

.content blockquote.wp-block-quote {
  padding-left: 20px;
  border-left: 4px solid #93979f;
  color: #93979f;
  font-family: "Source Serif Pro", serif;
  font-size: 19px;
  font-size: 1.1875rem;
  line-height: 30px;
  line-height: 1.875rem;
  margin-bottom: 25px;
  margin-top: 25px;
  font-style: italic;
}

.content span.category {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 22px;
  line-height: 1.375rem;
  color: #93979f;
  padding-bottom: 10px;
  display: inline-block;
}

/* Input Styles */
form input {
  height: 50px;
  box-sizing: border-box;
  font-size: 16px;
  font-size: 1rem;
}

form input::-webkit-input-placeholder {
  color: #93979f;
}

form input:-moz-placeholder {
  color: #93979f;
  opacity: 1;
}

form input::-moz-placeholder {
  color: #93979f;
  opacity: 1;
}

form input:-ms-input-placeholder {
  color: #93979f;
}

form input:placeholder-shown {
  color: #93979f;
}

form input[type="text"], form input[type="email"], form textarea {
  border: 1px solid #000;
  padding: 0 15px;
  box-sizing: border-box;
  width: 100%;
}

form textarea {
  padding: 15px;
}

form input[type="submit"] {
  background: #444444;
  color: #fff;
  padding: 0 50px;
  cursor: pointer;
}

form input[type="submit"]:hover {
  opacity: .85;
}

.flex, .bodyWrap, header#top-nav, header#top-nav .wrap, header#top-nav .menu, header#top-nav nav, header#top-nav ul, header#main-nav .center, header#main-nav nav ul, #image-slider .slide, #image-slider .slide .text, .author, .author .text, .author-bio, .author-bio .content, .author-bio .content .links, .tags, .tags .tag.dark, .share, .share .btn a, .subscribe form, .subscribe form input, form .subscribe input, .subscribe form textarea, form .subscribe textarea, article.preview.horizontal, section.sec .side-bar {
  display: flex;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-noWrap {
  flex-wrap: nowrap;
}

header#top-nav {
  height: 70px;
  background: #444444;
}

header#top-nav .wrap, header#top-nav .menu {
  height: 100%;
}

header#top-nav nav {
  height: 100%;
}

header#top-nav nav a {
  font-size: 14px;
  font-size: 0.875rem;
}

header#top-nav nav a:after {
  content: '';
  width: 0%;
  height: 1px;
  background: #fff;
  transition: .4s ease;
  position: absolute;
  bottom: -10px;
  left: 0;
  transition: .4s ease;
}

header#top-nav nav a:hover {
  color: #ECF0A6;
}

header#top-nav nav a:hover:after {
  background: #ECF0A6;
  width: 100%;
  transition: .4s ease;
}

header#top-nav ul {
  align-items: center;
}

header#top-nav ul li {
  margin-right: 30px;
  position: relative;
}

header#top-nav ul li a {
  color: #fff;
}

header#top-nav ul.social {
  margin-left: auto;
}

header#top-nav ul.social li {
  margin-right: 0;
  margin-left: 15px;
}

header#top-nav ul.social li a {
  font-size: 16px;
  font-size: 1rem;
}

header#top-nav ul.social li a:hover {
  transition: .4s ease;
  color: #ECF0A6;
}

header#top-nav ul.home li a .far, header#top-nav ul.home li a .fal, header#top-nav ul.home li a .fas, header#top-nav ul.home li a .fab {
  transition: .4s ease;
}

header#top-nav ul.home li a:hover .far, header#top-nav ul.home li a:hover .fal, header#top-nav ul.home li a:hover .fas, header#top-nav ul.home li a:hover .fab {
  transform: scale(1.2);
  transition: .4s ease;
}

header#top-nav ul.home li a:after {
  display: none;
}

header#main-nav .logo {
  padding: 50px 0 30px 0;
  max-width: 245px;
}

header#main-nav .logo img {
  width: 100%;
  max-width: 100%;
  transition: .4s ease;
}

header#main-nav .logo:hover img {
  transform: scale(1.05);
  transition: .4s ease;
}

header#main-nav .center {
  align-items: center;
  justify-content: center;
}

header#main-nav nav {
  border-top: 3px solid #444444;
  border-bottom: 3px solid #444444;
  background: #fff;
}

header#main-nav nav ul {
  font-size: 20px;
  font-size: 1.25rem;
  font-family: "Oswald", sans-serif;
  justify-content: center;
  padding: 20px 0;
}

header#main-nav nav ul li {
  margin-right: 30px;
}

header#main-nav nav ul li:last-child {
  margin-right: 0;
}

header#main-nav nav ul li a {
  color: #444444;
  transition: .4s ease;
}

header#main-nav nav ul li a:hover {
  opacity: 0.7;
  transition: .4s ease;
}

#image-slider {
  background: grey;
}

#image-slider .slide {
  box-sizing: border-box;
  padding: 60px;
  height: 100%;
}

#image-slider .slide .text {
  margin-top: auto;
  margin-right: auto;
  flex-direction: column;
  max-width: 60%;
}

#image-slider .slide .text span.category {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 30px;
  line-height: 1.875rem;
  background: #ECF0A6;
  color: #444444;
  padding: 0 10px;
  display: inline-block;
  margin-bottom: 10px;
}

#image-slider .slide .text h2 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 50px;
  line-height: 3.125rem;
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  background: #ECF0A6;
  color: #444444;
  padding: 0 10px;
}

.poster-image, #image-slider .slide {
  width: 100%;
  height: 700px;
  background-repeat: no-repeat;
}

.poster-image.paraxify, #image-slider .paraxify.slide {
  background-attachment: fixed;
  background-position: center center;
  background-size: cover;
}

.poster-image a, #image-slider .slide a {
  color: #444444;
}

.poster-image:hover a, #image-slider .slide:hover a {
  color: #ECF0A6;
}

.grid {
  display: grid;
  grid-gap: 40px 20px;
}

.grid.two {
  grid-template-columns: repeat(2, [row] 1fr);
}

.grid.two article.preview .bg-image {
  height: 365px;
}

.grid.three {
  grid-template-columns: repeat(3, [row] 1fr);
}

.grid.three article.preview .bg-image {
  height: 235px;
}

.grid.big-top {
  padding-top: 50px;
}

.grid.large-gap {
  grid-gap:50px;
}

.author {
  align-items: center;
  margin-bottom: 30px;
}

.author .image {
  width: 55px;
  height: 55px;
  border-radius: 55px;
  overflow: hidden;
  transition: .4s ease;
}

.author .image img {
  width: 100%;
}

.author .image:hover {
  transform: scale(1.1);
  transition: .4s ease;
}

.author .text {
  margin-left: 20px;
  font-family: "Source Serif Pro", serif;
  flex-direction: column;
}

.author .text span {
  padding-bottom: 10px;
}

.author .text span:last-child {
  padding-bottom: 0;
}

.author .text a {
  color: #93979f;
  transition: .4s ease;
}

.author .text a:hover {
  opacity: .8;
  transition: .4s ease;
  text-decoration: none;
}

.author-bio {
  border-top: 1px solid #444444;
  margin-top: 50px;
  padding-top: 30px;
  box-sizing: border-box;
  padding-right: 100px;
}

.author-bio .image {
  min-width: 80px;
  max-width: 80px;
  height: 80px;
  border-radius: 100%;
  overflow: hidden;
}

.author-bio .image img {
  max-width: 100%;
}

.author-bio .content {
  padding-left: 30px;
  flex-direction: column;
}

.author-bio .content iframe {
  margin-bottom: 10px;
}

.author-bio .content span.by-line {
  font-size: 25px;
  font-size: 1.5625rem;
  line-height: 35px;
  line-height: 2.1875rem;
  padding-bottom: 10px;
  display: inline-block;
}

.author-bio .content .links a {
  background: #444444;
  color: #fff;
  padding: 6px 10px 8px 10px;
  margin-right: 5px;
  border: 2px solid #444444;
}

.author-bio .content .links a:hover {
  text-decoration: none;
  background: #ECF0A6;
  color: #444444;
}

.more-btn a {
  background: #444444;
  border: 2px solid #444444;
  box-sizing: border-box;
  text-align: center;
  margin: 20px 0;
  color: #fff;
  display: block;
  font-family: "Oswald", sans-serif;
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 24px;
  line-height: 1.5rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: .4s ease;
}

.more-btn a:hover {
  background: #ECF0A6;
  transition: .4s ease;
  color: #444444;
  transition: .4s ease;
}

.tags {
  padding-top: 30px;
  align-items: center;
}

.tags .tag {
  margin-right: 5px;
  font-size: 10px;
  font-size: 0.625rem;
  line-height: 10px;
  line-height: 0.625rem;
  display: inline-block;
}

.tags .tag a {
  color: #414141;
  padding: 5px 8px;
  display: inline-block;
  border-radius: 20px;
  border: 1px solid #93979f;
}

.tags .tag a:hover {
  text-decoration: none;
  background: #414141;
  color: #fff;
  border-color: #414141;
}

.tags .tag .fas, .tags .tag .far, .tags .tag .fal, .tags .tag .fab {
  display: inline-block;
}

.tags .tag.dark {
  height: 22px;
  box-sizing: border-box;
  align-items: center;
  background: #414141;
  color: #fff;
  border-radius: 20px;
  border-color: #414141;
  font-size: 8px;
  font-size: 0.5rem;
  padding: 5px 10px;
}

.share {
  padding-top: 15px;
  align-items: center;
}

.share .btn {
  margin-right: 10px;
  border-radius: 20px;
  transition: .4s ease;
}

.share .btn a {
  padding: 10px 15px 10px 10px;
  color: #fff;
  overflow: hidden;
  font-size: 14px;
  font-size: 0.875rem;
}

.share .btn a:hover {
  text-decoration: none;
}

.share .btn.facebook {
  background: #2d5f9a;
}

.share .btn.facebook:hover {
  background: rgba(45, 95, 154, 0.8);
  transition: .4s ease;
}

.share .btn.twitter {
  background: #53c7ff;
}

.share .btn.twitter:hover {
  background: rgba(83, 199, 255, 0.8);
  transition: .4s ease;
}

.share .btn .fas, .share .btn .far, .share .btn .fal, .share .btn .fab {
  padding-right: 7px;
  padding-left: 5px;
}

.subscribe {
  box-sizing: border-box;
  padding: 60px 0;
  background: rgba(236, 240, 166, 0.4);
}

.subscribe h2 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 37px;
  line-height: 2.3125rem;
  font-family: "Oswald", sans-serif;
  margin-bottom: 10px;
  color: #414141;
}

.subscribe form, .subscribe form input, form .subscribe input, .subscribe form textarea, form .subscribe textarea {
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  margin:auto;
  margin-top: 15px;
  margin-bottom: 15px;
  max-width:600px;
  position: relative;
}

.subscribe form input[type="text"], form .subscribe input input[type="text"], form .subscribe textarea input[type="text"] {
  margin-right: 10px;
}

.subscribe form p {
  display: flex;
}

.subscribe form p span {
  padding-right: 20px;
}

.subscribe .wpcf7-response-output {
  position: absolute;
  bottom: -50px;
}

article.preview span.category {
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 22px;
  line-height: 1.375rem;
}

article.preview .image {
  position: relative;
  margin-bottom: 15px;
  overflow: hidden;
}

article.preview .image img {
  max-width: 100%;
  display: block;
  transition: .4s ease;
}

article.preview .image span.category {
  background: #ECF0A6;
  color: #444444;
  bottom: 30px;
  left: 30px;
  position: absolute;
  z-index: 99;
  transition: .4s ease;
}

article.preview .image span.category a {
  color: #444444;
  display: inline-block;
  padding: 5px 10px;
}

article.preview .image span.category:hover {
  background: #444444;
}

article.preview .image span.category:hover a {
  color: #ECF0A6;
}

article.preview span.by-line {
  font-family: "Source Serif Pro", serif;
  font-size: 16px;
  font-size: 1rem;
  line-height: 29px;
  line-height: 1.8125rem;
}

article.preview span.by-line a {
  font-style: italic;
  color: #93979f;
}

article.preview h2, article.preview h4 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 37px;
  line-height: 2.3125rem;
  font-family: "Oswald", sans-serif;
}

article.preview h2 a, article.preview h4 a {
  color: #444444;
}

article.preview h2 a:hover, article.preview h4 a:hover {
  color: #93979f;
}

article.preview h4 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 33px;
  line-height: 2.0625rem;
}

article.preview a {
  transition: .4s ease;
}

article.preview a:hover {
  transition: .4s ease;
}

article.preview p {
  font-size: 16px;
  font-size: 1rem;
  line-height: 27px;
  line-height: 1.6875rem;
  margin-bottom: 15px;
}

article.preview p p:last-child {
  margin-bottom: 0;
}

article.preview.horizontal {
  margin-bottom: 40px;
}

article.preview.horizontal .image {
  min-width: 395px;
  max-width: 395px;
  margin-bottom: 0;
}

article.preview.horizontal .text {
  padding-left: 30px;
  padding-right: 20px;
}

article.preview:hover .image img {
  transform: scale(1.1);
  transition: .4s ease;
}

section.sec {
  padding: 50px 0;
}

section.sec.small-top {
  padding-top: 20px;
}

section.sec.big-top {
  padding-top: 80px;
}

section.sec header {
  border-bottom: 3px solid #444444;
  margin-bottom: 30px;
}

section.sec header h1, section.sec header h2 {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 30px;
  line-height: 1.875rem;
  margin-bottom: 0;
  font-family: "Oswald", sans-serif;
  padding-bottom: 15px;
  color: #414141;
}

section.sec header.no-bottom {
  margin-bottom: 0;
}

section.sec .side-bar .main {
  width: 70%;
}

section.sec .side-bar .main .answer {
  padding-bottom: 60px;
}

section.sec .side-bar aside {
  width: 30%;
  box-sizing: border-box;
}

section.sec .side-bar aside .author .text {
  flex-direction: column;
}

section.sec .side-bar aside.bar-right {
  padding-left: 50px;
}

section.sec .side-bar aside.bar-right article.preview {
  margin-bottom: 40px;
}

section.sec .side-bar aside.bar-right article.preview .bg-image {
  height: 190px;
}

section.sec .side-bar aside.bar-left {
  padding-right: 50px;
}

section.sec .side-bar aside.bar-left article.preview {
  margin-bottom: 40px;
}

section.sec .side-bar aside.bar-left article.preview .bg-image {
  height: 190px;
}

section.sec .side-bar aside .sticky {
  position: sticky;
  top: 50px;
}

section.sec .side-bar aside ul {
  margin-bottom: 30px;
}

section.sec .side-bar aside ul li {
  font-size: 16px;
  font-size: 1rem;
  line-height: 29px;
  line-height: 1.8125rem;
}

section.sec .side-bar aside ul li a {
  color: #93979f;
}

section.sec .side-bar aside header {
  padding-top: 20px;
}

section.sec .side-bar aside header:first-child {
  padding-top: 0;
}

section.sec .side-bar aside .questions ul li {
  padding: 25px 0;
  border-bottom: 1px solid #93979f;
}

footer {
  background: #444444;
  min-height: 75px;
  margin-top: auto;
  color: #fff;
  display: flex;
  box-sizing: border-box;
  padding:30px 0 35px 0;
}

footer a {
  color: #fff;
}

footer a:hover {
  color: #edf0a8;
}

/* Mobile Styles */
@media screen and (max-width: 1120px) {
  .desktop {
    display: none;
  }
  .mobile {
    display: block;
  }
  /* Turns "Stacked" Text Into One Line */
  .linebreak br {
    content: ' ';
  }
  .linebreak br:after {
    content: ' ';
  }
  .fullWidth, header#top-nav, footer {
    min-width: 100%;
  }
  .wrap {
    width: 95%;
    margin: 0 2.5%;
  }
  .wrap.small-wrap {
    padding: 0 7%;
  }
}

@media screen and (max-width: 960px) {
  .poster-image, #image-slider .slide {
    height: 400px;
  }
  article.preview.horizontal {
    flex-direction: column;
  }
  article.preview.horizontal .image {
    width: 100%;
    margin-bottom: 10px;
    min-width: 100%;
    max-width: 100%;
  }
  article.preview.horizontal .text {
    padding-left: 0;
  }
}

@media screen and (max-width: 768px) {
  header#main-nav .cover.open {
    background: rgba(236, 240, 166, 0.4);
  }
  header#main-nav nav {
    display: none;
    background: rgba(236, 240, 166, 0.4);
  }
  header#main-nav nav ul {
    display: flex;
    flex-direction: column;
    text-align: center;
  }
  header#main-nav nav ul li {
    margin-right: 0;
    margin: 15px 0;
  }
  /* Use the variables below to create a unique hamburger */
  .cover {
    display: block;
    z-index: 999;
    width: 30px;
    height: 24px;
    cursor: pointer;
    margin: auto;
    padding: 20px 25px;
  }
  .cover:hover .line, .cover:hover .line:before, .cover:hover .line:after {
    background: #000;
    -webkit-transition: 0.2s ease;
    transition: 0.2s ease;
  }
  .cover.open .line, .cover.open .line:before, .cover.open .line:after {
    background: #000;
  }
  .line {
    border-radius: 0px;
    width: 30px;
    height: 3px;
    background: #000;
    top: 10px;
    position: relative;
    -webkit-transition: 0.2s ease;
    transition: 0.2s ease;
  }
  .line:before {
    border-radius: 0px;
    width: 30px;
    height: 3px;
    background-color: #000;
    top: -10px;
    content: '';
    left: 0;
    position: absolute;
  }
  .line:after {
    border-radius: 0px;
    width: 30px;
    height: 3px;
    background-color: #000;
    top: 10px;
    content: '';
    left: 0;
    position: absolute;
  }
  .line.animate {
    -webkit-animation: mymove3 0.2s forwards;
    -moz-animation: mymove3 0.2s forwards;
    -o-animation: mymove3 0.2s forwards;
    animation: mymove3 0.2s forwards;
  }
  .line.animate:before {
    -webkit-animation: mymove 0.5s forwards;
    -moz-animation: mymove 0.5s forwards;
    -o-animation: mymove 0.5s forwards;
    animation: mymove 0.5s forwards;
  }
  .line.animate:after {
    -webkit-animation: mymove2 0.5s forwards;
    -moz-animation: mymove2 0.5s forwards;
    -o-animation: mymove2 0.5s forwards;
    animation: mymove2 0.5s forwards;
  }
  .line.reverse {
    -webkit-animation: mymove6 0.2s forwards;
    -moz-animation: mymove6 0.2s forwards;
    -o-animation: mymove6 0.2s forwards;
    animation: mymove6 0.2s forwards;
  }
  .line.reverse:before {
    -webkit-animation: mymove4 0.5s forwards;
    -moz-animation: mymove4 0.5s forwards;
    -o-animation: mymove4 0.5s forwards;
    animation: mymove4 0.5s forwards;
  }
  .line.reverse:after {
    -webkit-animation: mymove5 0.5s forwards;
    -moz-animation: mymove5 0.5s forwards;
    -o-animation: mymove5 0.5s forwards;
    animation: mymove5 0.5s forwards;
  }
  @keyframes mymove {
    0% {
      top: -10px;
    }
    50% {
      top: 0;
    }
    51% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    100% {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      top: 0;
    }
  }
  @keyframes mymove2 {
    0% {
      top: 10px;
    }
    50% {
      top: 0;
    }
    51% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    100% {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      top: 0;
    }
  }
  @keyframes mymove3 {
    99% {
      width: 30px;
    }
    100% {
      width: 0px;
    }
  }
  @keyframes mymove4 {
    0% {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      top: 0;
    }
    50% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    51% {
      top: 0;
    }
    100% {
      top: -10px;
    }
  }
  @keyframes mymove5 {
    0% {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      top: 0;
    }
    50% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    51% {
      top: 0;
    }
    100% {
      top: 10px;
    }
  }
  @keyframes mymove6 {
    0% {
      width: 0px;
    }
    99% {
      width: 0px;
    }
    100% {
      width: 30px;
    }
  }
  @-webkit-keyframes mymove {
    0% {
      top: -10px;
    }
    50% {
      top: 0;
    }
    51% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    100% {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      top: 0;
    }
  }
  @-webkit-keyframes mymove2 {
    0% {
      top: 10px;
    }
    50% {
      top: 0;
    }
    51% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    100% {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      top: 0;
    }
  }
  @-webkit-keyframes mymove3 {
    99% {
      width: 30px;
    }
    100% {
      width: 0px;
    }
  }
  @-webkit-keyframes mymove4 {
    0% {
      transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      top: 0;
    }
    50% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    51% {
      top: 0;
    }
    100% {
      top: -10px;
    }
  }
  @-webkit-keyframes mymove5 {
    0% {
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      top: 0;
    }
    50% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
    }
    51% {
      top: 0;
    }
    100% {
      top: 10px;
    }
  }
  @-webkit-keyframes mymove6 {
    0% {
      width: 0px;
    }
    99% {
      width: 0px;
    }
    100% {
      width: 30px;
    }
  }
  .grid.three {
    grid-template-columns: repeat(2, [row] 1fr);
  }
  .grid.more {
    grid-template-columns: repeat(1, [row] 1fr);
  }
  .grid.more .more-hide {
    display: none;
  }
  .grid.large-gap.two {
    grid-template-columns: repeat(1, [row] 1fr);
  }
  #image-slider .slide {
    padding:30px;
  }
  #image-slider .slide .text {
    max-width: 100%;
  }
  section.sec .side-bar {
    flex-wrap: wrap;
  }
  section.sec .side-bar .main, section.sec .side-bar aside {
    width: 100%;
  }
  section.sec .side-bar aside .sticky {
    position: relative;
    top: 0;
  }
  section.sec .side-bar aside.bar-right {
    padding-left: 0;
  }
  section.sec .side-bar aside.bar-left {
    padding-right: 0;
  }
  .author-bio {
    padding-right: 0;
  }
  .subscribe form, .subscribe form input, form .subscribe input, .subscribe form textarea, form .subscribe textarea {
    flex-direction: column;
    padding: 0 20%;
  }
  .subscribe form input, form .subscribe input input, form .subscribe textarea input {
    padding: 0 15px;
    width: 100%;
  }
  .subscribe form input[type="text"], form .subscribe input input[type="text"], form .subscribe textarea input[type="text"] {
    margin-right: 0;
  }
  .subscribe form p {
    flex-wrap: wrap;
  }
  .subscribe form p span {
    padding-right: 0;
  }
}