@import url("https://fonts.googleapis.com/css?family=Charm:400,700|Open+Sans+Condensed:300,300i,700&subset=latin-ext");
article {
  margin: 20px 0px; }
  article h2 {
    font-family: 'Charm', cursive;
    font-size: 60px;
    font-weight: bold;
    position: relative;
    margin-bottom: 20px;
    opacity: 0;
    opacity: 0;
    -moz-transform: translateY(30px);
    -webkit-transform: translateY(30px);
    -o-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; }
    article h2:after {
      content: attr(data-after);
      font-size: 150px;
      color: #efefef45;
      bottom: -40px;
      left: 20px;
      position: absolute;
      z-index: -1; }
  article .main-image {
    position: relative;
    -webkit-box-shadow: 5px 5px 10px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 5px 5px 10px 1px rgba(0, 0, 0, 0.2);
    opacity: 0;
    -moz-transform: translateY(30px);
    -webkit-transform: translateY(30px);
    -o-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; }
    article .main-image.left {
      border-radius: 4px; }
    article .main-image.right {
      border-radius: 4px; }
  article .article-content {
    margin: 20px 0px;
    font-family: 'Charm', cursive;
    font-family: 'Open Sans Condensed', sans-serif;
    opacity: 0;
    -moz-transform: translateY(30px);
    -webkit-transform: translateY(30px);
    -o-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; }
    article .article-content h4 {
      margin: 20px 0px; }
  article.slidein h2 {
    opacity: 1;
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    transition-delay: 0.1s; }
  article.slidein .article-content {
    opacity: 1;
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    transition-delay: 0.3s; }
  article.slidein .main-image {
    opacity: 1;
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    transition-delay: 0.2s; }

/*# sourceMappingURL=style.css.map */