.grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  grid-auto-rows: 1fr;
}
.grid.auto-rows {
  grid-auto-rows: auto;
}

.grid.simple-list .square-split.full {
  grid-row: span 1;
}
.simple-list .pagination{
  display: flex;
  flex-direction: row;
  width: 100%;
  padding-bottom: 60px;
  padding-top: 30px;
  grid-column: span 12;
}

.simple-list .pagination a{
  font-size: 26px;
  font-weight: 400;
  font-family: "Orpheus";
  text-decoration: none;
}

.simple-list .pagination .next{
  margin-left: auto;
}

.sponsored{
}

.grid .featured-left {
  grid-column: span 7;
  min-height: min(48vw, 690px);
  grid-row: span 3;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  text-align:center;
  justify-content: center;
  background-size:cover;
  padding:0 5vw;
  position:relative;
}
.grid .featured-left .meta {
  width:100%;
  color:white;
  position:relative;
  z-index:1;
}
.grid .featured-left:before {
  content:' ';
  display:block;
  position:absolute;
  height:100%;
  width:100%;
  left:0;
  background:rgba(0,0,0,0.2);
}
.grid .half:before {
  content:' ';
  display:block;
  position:absolute;
  height:100%;
  left:0;
  width:100%;
  background:rgba(0,0,0,0.2);
}

.grid  .half .accent.top, .grid .featured-left .top {
  position:absolute;
  top:18px;
  z-index:1;
  width:100%;
  text-align:center;
  left:0;
}



main .section:nth-child(1){
  padding-top:0px;
}



.grid .featured-left.short {
  min-height: min(34vw, 480px);
  grid-row: span 2;
}

.grid .featured-full {
  grid-column: span 12;
  grid-row: span 2;
  color:white;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  text-align:center;
  justify-content: center;
  background-size:cover;
  position:relative;
}
.grid .featured-full:before {
  content:' ';
  display:block;
  position:absolute;
  height:100%;
  width:100%;
  left:0;
  background:rgba(0,0,0,0.2);
}
.grid .featured-full .meta {
  width:100%;
  position:relative;
  z-index:2;
}



.grid .square-split {
  grid-column: span 5;
  grid-row: span 1;
  display:flex;
  min-height:160px;
}
.grid .square-split .image {
  width:50%;
  background-size:cover;
  height:auto;
}
.grid .square-split .meta {
  width:75%;
  background:#F0F0F0;
  padding:20px;
}
.sponsored.square-split .meta {
  background:#FAF9DE;
}
.grid .square-split .meta .top {
  padding-bottom:20px;
  display:block;
}
.dark .grid .square-split .meta {
  color:black;
}
.grid .square-split.full {
  grid-column: span 12;
  grid-row: span 20;
}
.grid .meta p.excerpt, .grid .meta .excerpt p {
  line-height: 22px;
  font-family: "Caponi";
  margin-top:6px;
}


.grid .half {
  grid-column: span 6;
  grid-row: span 1;
  height: min(25vw, 350px);
  color:white;
  display: flex;
  align-items: center;
  padding:30px;
  background-size:cover;
}
.grid .half .meta {
  text-align:center;
  width:100%;
  position:relative;
  z-index:2;
  height:auto;
}

.meta.featuredtop {
  margin-top: 40px;
  margin-bottom: auto
}

.meta.featuredcenter {
  margin-top: auto;
  margin-bottom: auto;
}

.meta.featuredbottom {
  margin-top: auto;
}

.meta.othertop {
  margin-top: 40px;
  margin-bottom: auto
}

.meta.othercenter {
  margin-top: auto;
  margin-bottom: auto;
}

.meta.otherbottom {
  margin-top: auto;
}


.grid .half .meta .top {
  position:absolute;
  top:20px;
  width:100%;
  text-align:center;
}
.grid .fourth {
  grid-column:span 3;
  min-height:140px;
  background:transparent;
}
.grid .fourth .image {
  width: 100%;
  height: min(14vw, 200px);
  margin-bottom:12px;
  background-size:cover;
}

.grid a {
  display:block;
  position:relative;
  text-decoration:none;
  color:inherit;
}



.grid .meta h2 {
  font-family: 'Orpheus';
  letter-spacing:1px;
}



.section {
  padding-top:60px;
  padding-bottom:60px;
}
.section.intro {
  padding-top:0;
}
.section h1 {
  padding-bottom:4px;
}

.dark {
  background:#222222;
  color:white;
}









.module.images {
  padding:60px 0;
}

.module.images img {
  width:100%;
}

.module.images .image-grid {
  display: grid;
  grid-gap: 15px;
  grid-template-columns: repeat(12, 1fr);
}

.module.images .image-grid.col-one .image {
  grid-column: span 12;
}
.module.images .image-grid.col-two .image {
  grid-column: span 6;
}
.module.images .image-grid.col-three .image {
  grid-column: span 4;
}



.module.images .image-masonry {
  display: grid;
  grid-gap: 15px;
  grid-template-columns: repeat(12, 1fr);
}



.module.images .image-masonry.mason-compact .image.mod_0, .module.images .image-masonry.mason-compact .image.mod_2, .module.images .image-masonry.mason-compact .image.mod_4, .module.images .image-masonry.mason-compact .image.mod_5 {
  grid-column: span 6;
  grid-row: span 1;
}
.module.images .image-masonry.mason-compact .image.mod_1, .module.images .image-masonry.mason-compact .image.mod_3 {
  grid-column: span 6;
  grid-row: span 2;
  padding-bottom: 100%;
}


.module.images .image-masonry.mason-big .image.mod_0 {
  grid-column: span 12;
  grid-row: span 1;
  padding-bottom: 40%;
}

.module.images .image-masonry.mason-big .image.mod_1, .module.images .image-masonry.mason-big .image.mod_3  {
  grid-column: span 6;
  grid-row: span 1;
}
.module.images .image-masonry.mason-big .image.mod_2  {
  grid-column: span 6;
  grid-row: span 2;
  padding-bottom: 100%;
}

.module.images .image-masonry.mason-big .image.mod_4, .module.images .image-masonry.mason-big .image.mod_5  {
  grid-column: span 6;
  grid-row: span 2;
  padding-bottom: 100%;
}


.module.images .swiper-container, .module.images .swiper-wrapper, .module.images .swiper-slide {
  height:40vw;
}
.module.images .swiper-slide {
  display:flex;
  align-items: center;
  justify-content: center;
  width:auto;
}
.module.images .swiper-slide img {
  width:auto;
  height:100%;
}
.module.images .swiper-button-prev:after, .module.images  .swiper-button-next:after {
  color:black;
}

.module.rich-text p {
  margin-bottom:20px;
  font-family:"Caponi";
}
.module.text h5, .module.rich-text h5 {
  text-transform:uppercase;
  font-size:14px;
}

.rich-text blockquote {
  border-left: 4px solid #f0f0f0;
  padding-left: 30px;
  margin-left: 30px;
}


.module.pull-quote {
  padding-top:60px;
  padding-bottom:60px;
  margin-top:20px;
  margin-bottom:20px;
}
.module.pull-quote .container {
  display:flex;
}
.module.pull-quote .the-quote {
  flex:1;
  padding-right:20px;
  width:auto;
  display:flex;
  align-content:center;
  flex-wrap:wrap;
}
.module.pull-quote .the-quote h1 p {
  font-size: 36px;
  font-weight: 400;
  font-family: "Orpheus";
  line-height:45px;
  width:100%;
}
.module.pull-quote .who {
  width:100%;
  font-family:"BS";
}
.module.pull-quote .ads {
  display:flex;
}
.module.pull-quote .ad {

}
.module.pull-quote .ad  img {
  max-height: 530px;
  margin: 0 10px;
  max-width: 150px;
}

.module.rich-text strong sub, .module.rich-text sub strong {
  float: left;
  font-size: 100px;
  font-weight:900;
  line-height:0.5;
  margin-top:20px;
  margin-right:8px;
}

.module.article_list {

}

.module.article_list a {
  display:flex;
  align-items:center;
  margin-bottom:20px;
  text-decoration:none;
  position:relative;
  background:#F0F0F0;
}

.module.article_list .image {
  width: 50%;
  padding-bottom: 40%;
  margin-right: 30px;
}
.module.article_list .top {
  position:absolute;
  top:20px;
}

@media screen and (max-width:850px)  {
  .grid .featured-left {
    grid-column: span 12;
    height:82vw;
    grid-row: span 1;
  }
  .grid .square-split {
    grid-column: span 12;
  }
  .grid .featured-left.short {
    grid-row: span 1;
    height:100%;
  }
  .grid .featured-full {
    grid-row: unset;
  }
  .grid .fourth {
    grid-column: span 6;
  }
  .grid .fourth .image {
    height:20vw;
  }

  .grid .half {
    grid-column: span 12;
    height: auto;
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .module.article_list a {

  }
  .module.article_list .meta {
    width:70%;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .module.article_list .top {
    position:static;
    margin-bottom:12px;
  }
  .module.article_list .image {
    align-self:stretch;
  }

  .module.pull-quote .ads {
    justify-content:space-evenly;
    width:100%;
    margin-top:20px;
  }
  .module.pull-quote .ad {
    width:40%;
  }
  .module.pull-quote .container {
    flex-wrap:wrap;
  }
  .module.pull-quote .ad img {
    height:auto;
    width:100%;
    margin:0;
  }
  .module.pull-quote {
    padding-top:30px;
    padding-bottom:30px;
  }

  .grid .meta h2 {
    font-size:26px;
  }
}