/*==========================================================================
  News row
  ========================================================================== */

$gap: 80px;

.c-posts-row {
  padding: $gap 0;
  background: $blue url('/img/circles_and_triangles.png') repeat;
  background-image: url('/img/circles_and_triangles.png'), linear-gradient(0deg, $blue-300 0%, $blue 100%);
}

.c-posts-row__neutral {
  background: $neutral-400;
}

.c-posts-row__grid {
  @include flex(flex-start, flex-start);
  flex-wrap: wrap;
  margin: #{$gap / -2};
}

.c-posts-row__item {
  margin: #{$gap / 2};
  width: calc((100% - #{$gap / 2 * 6})  / 3);
}

.c-posts-row__paginator {
  margin-top: #{$gap / 2};
  margin-bottom: #{$gap / -2};
}

$gap: 40px;

@include respond-to-width(1200) {
  .c-posts-row {
    padding: $gap 0;
  }

  .c-posts-row__grid {
    margin: #{$gap / -2};
  }

  .c-posts-row__item {
    margin: #{$gap / 2};
    width: calc((100% - #{$gap / 2 * 6})  / 3);
  }
}

@include respond-to-width(960) {
  .c-posts-row__item {
    width: calc((100% - #{$gap / 2 * 2})  / 2);
  }
}

@include respond-to-width(625) {
  .c-posts-row__grid{
    display: block;
  }

  .c-posts-row__item {
    width: 100%;
    margin: 0;
  }

  .c-posts-row__item + .c-posts-row__item {
    margin-top: $gap;
  }
}