/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.12,
* Autoprefixer: v10.4.4
* Browsers: last 4 version
*/

.articles-container {
  width: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  /*  max-width: unset;*/
  max-width: var(--max-width);
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  /*  padding: 1rem var(--x);
  --x: calc((100vw - var(--max-width))/2);*/
  padding: 0 1rem;
  margin: 0 auto;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

.articles-container .swipder-wrapper {
  align-items: stretch;
}

.preview {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: calc(100% / 3 - .5rem);
  margin: 0;
  -webkit-box-shadow: var(--float-close);
  box-shadow: var(--float-close);
  border-radius: .25rem;
  background-color: var(--compare-more);
  gap: 1rem;
}

.adjusted-header {
  margin-left: 3rem;
}

.preview *,
.featured * {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 100%;
}

  .preview .article-info {
    padding: 1.5rem 2rem 2rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .preview .upper {
    gap: 1rem;
    margin-bottom: 2rem;
  }

.article-info .title,
.featured .title {
  font-size: 1.5rem;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  position: relative;
  margin: 0;
  text-transform: capitalize;
  font-weight: 200;
  line-height: 1.2;
  letter-spacing: .2px;
  text-shadow: unset !important;
}



  .article-info .title::before,
  .featured .title::before {
    content: "";
    height: 100%;
    width: 4px;
    left: -1rem;
    position: absolute;
    background-color: var(--color-6);
  }

.article-info .title {
  font-size: 1.25rem;
  height: 3rem;
  font-weight: 300;
}

  .article-info .title::before {
    max-height: 3rem;
  }

.preview .article-info .title {
  height: 3rem;
  align-items: center;
}
  }

.featured .title {
  font-size: 2rem;
  font-weight: 200;
  text-shadow: 0 0 1px rgba(35,35,35, .63);
}

.preview .body {
  max-height: 12rem;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.body * img {
    display: none !important;
  }


.preview p {
  display: block;
  margin: 0 !important;
}

.featured p {
  display: inline-block;
}


@-moz-document url-prefix() {
  .snippet--desc p + p::before,
  .featured p + p::before {
    content: "\2029 \2003";
  }

  .featured p,
  .snippet--desc p{
    display:unset !important;
  }
}
  

.preview .lower,
.preview .to-full-article,
.featured .lower,
.featured .to-full-article {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.preview .image-container,
.featured .image-container {
  background-color: var(--contrast);
  border-radius: var(--circle);
  padding: .25rem;
  margin-left: .5rem;
}

:is(.preview,.featured)
:is(.to-full-article:hover,.to-full-article:focus) {
  color: var(--color-6);
}

:is(.preview,.featured)
:is(.to-full-article:hover,.to-full-article:focus) 
.image-container {
  background-color: var(--color-6);
}

.preview [src*=icon],
.featured [src*=icon] {
  width: 1.5rem;
  -webkit-transform: translateX(-.25rem);
  -ms-transform: translateX(-.25rem);
  transform: translateX(-.25rem);
}

.preview .timestamp,
.featured .timestamp {
  font-size: .85rem;
  font-style: italic;
  font-weight: 300;
  color: var(--contrast-less);
}

.preview.has-image {
  position: relative;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden;
}

  .preview.has-image .article-image {
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
  }

.article-image img {
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.preview.has-image .article-info {
  background-color: rgba(35,35,35, .63);
  z-index: 1;
  color: var(--compare);
}

.preview.has-image .title {
  color: var(--compare);
}

.preview.has-image .timestamp {
  color: var(--compare-less);
}

.preview.has-image .image-container {
  background-color: var(--compare);
}

.preview.has-image [src*=icon] {
  -webkit-filter: invert(76%);
  filter: invert(76%);
}


.road-construction {
  padding: 1rem 3rem;
}

  .road-construction .title {
    font-size: 2em;
    margin-bottom: 0;
    color: var(--contrast);
    font-weight: 500;
  }

    .road-construction .title::before {
      content: "";
      background: var(--color-2);
      height: 0.75rem;
      width: 12.5rem;
      margin-top: 1.5rem;
      margin-bottom: 0.5rem;
    }

  .road-construction .sub-title {
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: .2rem;
    margin: .25rem 0 1rem;
  }

  .road-construction .list-item {
    margin: .25rem 0;
  }

.featured {
  border-radius: .25rem;
  padding: 2rem;
  -webkit-box-shadow: var(--float-close);
  box-shadow: var(--float-close);
  background: var(--compare-more);
  width: calc(200% / 3 - .25rem);
  margin: 0;
}

  .featured .title {
    margin-top: 2rem;
  }

  .featured .body {
    margin: 3rem 0;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 50vh;
  }


  .featured .info {
    margin-left: 2rem;
    margin-right: 2rem;
  }

  .featured .image {
    width: calc(100% / 3 - .5rem);
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
  }

  .featured p + p {
    text-indent: 1rem;
  }
/*
  .preview .body * {
    display: inline-block !important;
  }*/

  .preview .article-info {
    min-height: 24rem;
  }


.preview.has-image .body a {
  text-decoration: underline;
  text-decoration-color: var(--color-6);
  color: white !important;
  font-weight: bold;
  display: inline-block !important;
}

.road-closures-and-feature {
  max-width: var(--max-width);
  margin: .5rem auto;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

  .road-closures-and-feature .preview {
    margin: 0;
    align-self: flex-start;
    padding-bottom: 2rem;
  }


  @media screen and (max-width: 600px) {
    .road-closures-and-feature {
      flex-direction: column;
      margin-left: 1rem;
      margin-right: 1rem;
    }

    .road-closures-and-feature > * {
      width: 100%;
    }

    .road-closures-and-feature .featured {
      margin-top: 2rem;
    }

    .road-closures-and-feature .road-construction {
      padding-bottom: 2rem;
    }

    .articles-container .preview {
      width: calc(100% - 3rem);
    }

    .articles-container > .preview {
      margin-right: 0;
      margin-left: .75rem;
      flex-shrink: 0;

    }

    .articles-container > .preview:first-of-type {
      margin-left: 1.5rem !important;
      margin-right:0;
    }
    .articles-container > .preview:last-of-type {
      margin-right: 1.5rem;
    }

  }

/*
  THIRD Party Fix Start
*/

.extra.slick-slide,
.slick-track,
.slick-list.draggable {
  display: flex !important;
}

.slick-list.draggable {
  overflow: visible !important;
}


.extra {
  align-items: center;
}

.slick-slide {
  height: unset !important;
}
/*
  THIRD Party Fix End
*/

@media screen and (max-width: 480px) {

  .adjusted-header {
    margin: 1rem;
  }

  .articles-container {
    padding: 1rem 0;
  }

  .road-closures-and-feature {
    flex-direction: column;
/*    margin-left: .25rem;
    margin-right: .25rem;*/
    max-width: 100%;
  }

  .featured {
    padding-left: .25rem;
    padding-right: .25rem;
  }

  .road-construction {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .articles-container {
    width: 100vw;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  .block .article-info img,
  .block .article-info {
    max-width: 100%;
    object-fit: contain;
  }

}

.article-info td {
  flex-direction: column;
}

:is(.article-info, .featured) table {
  box-shadow: none;
}

:is(.article-info, .featured) table tr:hover {
  background:var(--compare-more) !important;
}

:is(.article-info, .featured) table tr:hover td {
  color: var(--contrast) !important;
}


.article-info table td p * {
  display: contents !important;
}

:is(.article-info, .featured) table tr td {
  border-bottom: none;
}

:is(.article-info, .featured) img {
  max-width: 100%;
}

.article-info u {
  display: contents;
  font-weight: bold;
}

.article-info li {
  display: block;
}

.article-info li a {
  font-weight: 600;
  color: var(--color-7);
}

.article-info li a:hover {
  color: var(--resident-med);
}

.article-info :is(.revert, .revert *) {
  padding: initial;
  margin: initial;
}


.news-page .block--container {
  align-items: center;
}

.news-page h2 + img {
  max-height: 300px;
  object-fit: cover;
  object-position: center center;
  margin: 2rem 0 1rem;
  border-radius: .5rem;
}

.news-page .article-info {
  max-width: 70ch;
  padding-bottom: 4rem;
  flex-direction: column;
}

.news-article .block--container {
  align-items: center;
}

.news-article h2 + img {
  max-height: 300px;
  object-fit: cover;
  object-position: center center;
  margin: 2rem 0 1rem;
  border-radius: .5rem;
}

.news-article .article-info {
  max-width: 70ch;
  padding-bottom: 4rem;
  flex-direction: column;
}

.news-article .downloads {
  padding: .5rem 1rem;
  border-radius: .25rem;
  margin: .25rem 0;
  background: var(--compare);
  align-items: center;
}

.news-article .downloads .icon {
    max-width: 1.5rem;
    margin-right: 1rem;
    transform: rotate(180deg);
  }

.news-article p + p {
  text-indent: 0rem;
  margin-top: 1rem;
}
