@charset "UTF-8";

/* Posts */
.posts {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 0 2em -6em;
  width: calc(100% + 6em); }
  .posts article {
    -moz-flex-grow: 0;
    -webkit-flex-grow: 0;
    -ms-flex-grow: 0;
    flex-grow: 0;
    -moz-flex-shrink: 1;
    -webkit-flex-shrink: 1;
    -ms-flex-shrink: 1;
    flex-shrink: 1;
    margin: 0 0 6em 6em;
    position: relative;
    width: calc(33.33333% - 6em); }
    .posts article:before {
      background: rgba(210, 215, 217, 0.75);
      content: '';
      display: block;
      height: calc(100% + 6em);
      left: -3em;
      position: absolute;
      top: 0;
      width: 1px; }
    .posts article:after {
      background: rgba(210, 215, 217, 0.75);
      bottom: -3em;
      content: '';
      display: block;
      height: 1px;
      position: absolute;
      right: 0;
      width: calc(100% + 6em); }
    .posts article > :last-child {
      margin-bottom: 0; }
    .posts article .image {
      display: block;
      margin: 0 0 2em 0; }
      .posts article .image img {
        display: block;
        width: 100%; }
  @media screen and (min-width: 1681px) {
    .posts article:nth-child(3n + 1):before {
      display: none; }
    .posts article:nth-child(3n + 1):after {
      width: 100%; }
    .posts article:nth-last-child(1), .posts article:nth-last-child(2), .posts article:nth-last-child(3) {
      margin-bottom: 0; }
      .posts article:nth-last-child(1):before, .posts article:nth-last-child(2):before, .posts article:nth-last-child(3):before {
        height: 100%; }
      .posts article:nth-last-child(1):after, .posts article:nth-last-child(2):after, .posts article:nth-last-child(3):after {
        display: none; } }
  @media screen and (max-width: 1680px) {
    .posts article {
      width: calc(50% - 6em); }
      .posts article:nth-last-child(3) {
        margin-bottom: 6em; } }
  @media screen and (min-width: 481px) and (max-width: 1680px) {
    .posts article:nth-child(2n + 1):before {
      display: none; }
    .posts article:nth-child(2n + 1):after {
      width: 100%; }
    .posts article:nth-last-child(1), .posts article:nth-last-child(2) {
      margin-bottom: 0; }
      .posts article:nth-last-child(1):before, .posts article:nth-last-child(2):before {
        height: 100%; }
      .posts article:nth-last-child(1):after, .posts article:nth-last-child(2):after {
        display: none; } }
  @media screen and (max-width: 736px) {
    .posts {
      margin: 0 0 2em -4.5em;
      width: calc(100% + 4.5em); }
      .posts article {
        margin: 0 0 4.5em 4.5em;
        width: calc(50% - 4.5em); }
        .posts article:before {
          height: calc(100% + 4.5em);
          left: -2.25em; }
        .posts article:after {
          bottom: -2.25em;
          width: calc(100% + 4.5em); }
        .posts article:nth-last-child(3) {
          margin-bottom: 4.5em; } }
  @media screen and (max-width: 480px) {
    .posts {
      margin: 0 0 2em 0;
      width: 100%; }
      .posts article {
        margin: 0 0 4.5em 0;
        width: 100%; }
        .posts article:before {
          display: none; }
        .posts article:after {
          width: 100%; }
        .posts article:last-child {
          margin-bottom: 0; }
          .posts article:last-child:after {
            display: none; } }