/**
    Proxima Nova Bold
    font-family:  proxima-nova,   sans-serif;
    font-weight:  700;
    font-style:  normal;

    Proxima Nova Bold Italic
    font-family:  proxima-nova,   sans-serif;
    font-weight:  700;
    font-style:  italic;

    Proxima Nova Thin
    font-family:  proxima-nova,   sans-serif;
    font-weight:  100;
    font-style:  normal;

    Proxima Nova Semibold
    font-family:  proxima-nova,   sans-serif;
    font-weight:  600;
    font-style:  normal;

    Proxima Nova Regular
    font-family:  proxima-nova,   sans-serif;
    font-weight:  400;
    font-style:  normal;

    Proxima Nova Italic
    font-family:  proxima-nova,   sans-serif;
    font-weight:  400;
    font-style:  italic;

    Proxima Nova Light
    font-family:  proxima-nova,   sans-serif;
    font-weight:  300;
    font-style:  normal;

    Proxima Nova Medium
    font-family:  proxima-nova,   sans-serif;
    font-weight:  500;
    font-style:  normal;


    @media only screen and (max-width: @tablet) {
    }

    @media only screen and (max-width: @mobile) {
    }

    mobile fonts
    D60px
    font-size: 48px;
    D24px 
    font-size: 21px;
    font-size: 18px;
    font-size: 16px;

**/
.news-listing .intro {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}
.news-listing .intro .title {
  font-size: 60px;
  font-family: 'Roboto Slab', serif;
  color: #1e262c;
  font-weight: 300;
  position: relative;
  text-align: center;
}
.news-listing .intro .title::before {
  content: "";
  display: block;
  background-color: #d31145;
  width: 120%;
  position: relative;
  top: -20px;
  height: 5px;
}
.news-listing .intro .copy {
  text-align: center;
  font-family: 'proxima-nova', sans-serif;
  color: #1e262c;
  font-size: 24px;
}
.news-listing .categories .cta {
  display: inline-block;
  position: relative;
  font-size: 17px;
  padding: 5px 20px;
  font-weight: bold;
  border: 3px solid #d31145;
  color: #d31145;
  transition: all 400ms 0s ease-in-out, all 400ms 0s ease;
  margin-bottom: 10px;
}
.news-listing .categories .cta.all-news {
  font-size: 18px;
  padding: 8px 25px;
}
.news-listing .categories .cta.active {
  background-color: #d31145;
  color: #ffffff;
}
.news-listing .categories .cta:hover {
  background-color: #d31145;
  color: #ffffff;
}
.news-listing #listing {
  max-width: 90%;
  width: 100%;
  margin: 6em auto 0 auto;
}
.news-listing #listing .news-item {
  margin-bottom: 100px;
  display: inline-block;
  flex: 1 1 21%;
  margin: 10px 0 100px 3%;
  width: calc(100% * (1/4) - 10px - 1px);
}
.news-listing #listing .news-item .content {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}
.news-listing #listing .news-item .read-more {
  margin: 10px 0 0 0;
}
.news-listing #listing .news-item .title {
  font-size: calc(32px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
}
.news-listing #listing .pagination .pagination-pages {
  display: flex;
  justify-content: center;
  align-items: center;
}
.news-listing #listing .pagination .pagination-pages .page .page-numbers.current {
  color: #d31145;
}
@media (max-width: 768px) {
  .news-listing .categories > div > ul {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .news-listing .categories > div > ul li {
    margin-bottom: 10px;
  }
  .news-listing #listing .news-item {
    width: 100%;
    flex-basis: 100%;
    margin-bottom: 50px;
  }
}