.news {
  display: flex;
  flex-flow: column;
  display: grid;
  grid-gap: 2em 4em; }
  .news .sidebar {
    flex: 4 4;
    margin: 0 8px; }
  .news .contact {
    flex: 0 0 100%; }
  .news .press-photos {
    flex: 8 8 60%; }
    .news .press-photos .help {
      font-size: .9em;
      font-weight: 300; }
    .news .press-photos ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-flow: row wrap;
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      grid-gap: 2em; }
      .news .press-photos ul li {
        flex: 1 1 20%; }
        .news .press-photos ul li figure {
          margin: 0; }
          .news .press-photos ul li figure figcaption {
            margin-top: .5em;
            font-size: .9em;
            color: rgba(255, 255, 255, 0.8); }
        .news .press-photos ul li a {
          text-decoration: none;
          color: inherit; }
  .news .news-article-list {
    flex: 4 4 30%;
    margin-left: 4em; }
    @supports (display: grid) {
      .news .news-article-list {
        margin-left: 0; } }
    .news .news-article-list article {
      position: relative;
      margin-bottom: 1em; }
      .news .news-article-list article a {
        display: block;
        color: inherit;
        text-decoration: none;
        height: 100%; }
        .news .news-article-list article a time {
          flex-flow: row; }
          .news .news-article-list article a time .day, .news .news-article-list article a time .month {
            font-size: inherit; }
          .news .news-article-list article a time .day {
            margin-right: .5em; }
        .news .news-article-list article a h3 {
          font-weight: 400;
          margin: 0; }
  @media (min-width: 700px) {
    .news {
      flex-flow: row wrap; } }
  @media (min-width: 900px) {
    .news {
      grid-template-columns: 3fr 1fr;
      grid-template-rows: auto auto 1fr; }
      .news .contact {
        grid-column: -1 / -2; }
      .news .news-article-list {
        grid-column: -1 / -2; }
      .news .press-photos {
        grid-column: 1;
        grid-row: 1 / -1; }
      .news .facebook-feed {
        grid-column: -1 / -2; } }
  @media (min-width: 1600px) {
    .news {
      grid-template-columns: 3fr 1.5fr 1fr; }
      .news .news-article-list {
        grid-column: 2;
        grid-row: 1 / -1; } }
  .news .pager {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    grid-column: 1 / -1; }
    .news .pager li a {
      color: inherit;
      text-decoration: none;
      display: block;
      padding: .25em .5em;
      background: #005574;
      margin: 0 .25em;
      transition: background-color ease-in-out .2s; }
      .news .pager li a:hover {
        background: #007aa7; }
    .news .pager li.active a {
      background: none;
      cursor: default; }
    .news .pager li.disabled a {
      background: none;
      opacity: .5;
      cursor: default; }

.news-item .header {
  width: 40%;
  float: left;
  display: flex;
  flex-flow: column;
  padding: 0 2em 0 0; }
  .news-item .header h1 {
    font-size: 2em; }
  .news-item .header time {
    font-size: 1.2em;
    align-self: flex-start;
    opacity: .8; }

.news-item img {
  float: left;
  width: 60%; }

.news-item .intro {
  float: left;
  width: 40%;
  font-weight: 300;
  font-size: 1.4em; }

.news-item .content {
  float: left;
  width: 100%;
  -moz-column-width: 400px;
  column-width: 400px;
  padding-top: 2em; }

@media (max-width: 1200px) {
  .news-item time {
    flex-flow: row; }
    .news-item time .day, .news-item time .month {
      font-size: inherit; }
    .news-item time .day {
      margin-right: .3em; } }

@media (min-width: 800px) {
  .news-item .header h1 {
    font-size: 3em; }
  .news-item .header time {
    font-size: 1.5em; } }

@supports (display: grid) {
  .news-item {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "header header" "mainphoto mainphoto" "intro intro" "content content";
    grid-gap: .5em;
    /*@media (min-width: 800px) {
            grid-template-columns: repeat(2, 1fr);
            grid-template-areas: "mainphoto mainphoto" "header header" "intro intro" "content content";
        }*/ }
    .news-item .header {
      grid-area: header;
      width: auto;
      padding: 0; }
      .news-item .header h1 {
        margin: 0; }
    .news-item .intro {
      grid-area: intro;
      width: auto; }
      .news-item .intro p {
        margin: 0; }
    .news-item img {
      grid-area: mainphoto;
      width: 100%;
      -o-object-fit: cover;
      object-fit: cover; }
    .news-item .content {
      grid-area: content;
      width: auto;
      padding: 0; }
    @media (min-width: 1200px) {
      .news-item {
        grid-gap: 2em;
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: min-content auto auto;
        grid-template-areas: "header header mainphoto mainphoto mainphoto" "intro intro mainphoto mainphoto mainphoto" "content content content content content"; }
        .news-item img {
          height: 100%; } } }

.news-item.no-crop {
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: unset;
  grid-template-areas: "header header" "intro intro" "mainphoto mainphoto" "content content"; }
  .news-item.no-crop img {
    width: auto;
    height: auto; }
