.blog-listing-hero .content-area {
  margin-top: 5em;
}

.blog-listing-hero .content-area {
  padding: 8vh 0;
}

@media(min-width:769px){
  .hero .supporting-text {
    font-size: 1.5em;
  }
}

.hero .supporting-text {
  font-weight: 600;
}


/* FEATURED POST  */

/* col 1 */
.post-features .col-1 a{
  display:block;
  background-color:#fff;
  border-radius: 0.4em;
  overflow: hidden;
}

.post-features .col-1 .image {
  height: 18em;
  background-size:cover;
  background-position:center;
}

.post-features .col-1 .item-body {
  padding: 1em 0em 0;
  position:relative;
}

.post-features .col-1 .item-body .author-image {
  width: 4em;
  height: 4em;
  position: absolute;
  right: 1em;
  top: -2em;
  background-color: #fff;
}


/* col 2 */
.post-features .col-2 {
  max-width: 370px;
  margin-left: 3em;
}

.post-features .col-2 h2 {
  font-size: 1.5em;
  margin-bottom: 1em;
  color: #cf225b;
  border-bottom: solid 1px #e4e4e4;
  padding-bottom: .5em;
}

.post-features .popular-post{
  background-color: #fff;
  border-radius: .4em;
  -webkit-transition: all ease-in-out .3s;
  -o-transition: all ease-in-out .3s;
  transition: all ease-in-out .3s;
  top: 0;
  font-size: 0.9em;
}

.post-features .popular-post > h3 {
  margin-bottom: 1em;
  color:#cf225b;
}

.post-features .popular-post a{
  position: relative;
  text-decoration:none;
  color:inherit;
}

.popular-post .post-item-title {
  color: #261942;
}

.post-features .col-2 a:not(:first-of-type) {
  margin-top: 1em;
  border-top: solid 1px #e7ebed;
  padding-top: 1em;
}

.post-features .col-2 a h3 {
  font-size: 1em;
  font-weight: 600;
}

.post-features .col-2 a .post-item-image {
  max-width: 9em;
  min-width: 4em;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 6em;
  margin-right: .75em;
  background-position: center;
  border-radius: .3em;
}


/* blog subscribe  */
.post-listing .simple-sub-form .hs-richtext.hs-main-font-element {
  display: none;
}

.post-listing .simple-sub-form .actions {
  position: relative;
}

.post-listing .simple-sub-form .actions:before {
  content: "";
  position: absolute;
  left: -2px;
  top: 0px;
  width: 50%;
  height: 100%;
  background-color: #fff;
  border-top: solid 1px rgb(0 0 0 / 8%);
  border-bottom: solid 1px rgb(0 0 0 / 8%);
}

/* POST LISTING  */
.related-post .item,
.post-items .item {
  background-color: #fff;
  border: solid 1px #E7EBED;
  border-radius: .4em;
  -webkit-transition: all ease-in-out 0.3s;-o-transition: all ease-in-out 0.3s;transition: all ease-in-out 0.3s;
  top: 0;
  position:relative;
  overflow:hidden;
}

.related-post .item:hover,
.post-items .item:hover{
  top: -0.4em;
  box-shadow: 0px 0px 31px 0px rgba(203,214,226,0.5);
}

.related-post .item .item-image,
.post-items .item .item-image {
  height: 10em;
  background-size: cover;
  background-position: center;
}

.related-post .item .item-body,
.post-items .item .item-body{
  padding:1em;
}


.related-post .item h3,
.post-items .item h3 {
  font-size: 1.2em;
}

.related-post .item .topics,
.post-features .topics,
.post-items .topics {
  margin-bottom: 0.5em;
}

.related-post .topics span,
.post-features .topics,
.post-items .topics span {
  display: inline-block;
  font-size: 11px;
  padding: .1em 1.1em;
  background-color: #eae8e8;
  border-radius: 5px;
  margin: .1em .15em;
}

.related-post .avatar,
.post-features .avatar,
.post-items .avatar {
  font-size: .85em;
  margin-top: 1.5em;
  border-top: solid 1px #e7ebed;
  padding-top: 1em;
  -webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;
}

.related-post .author-image,
.post-features .author-image,
.post-items .author-image {
  display: inline-block;
  background-size: cover;
  border-radius: 100px;
  margin-left: .5em;
  background-size: 67%;
  background-repeat: no-repeat;
  background-position: center;
  border: solid 1px #e7ebed;
}

.related-post .author-image,
.post-items .author-image {
  width: 2.5em;
  height: 2.5em;
}

.post-items .author-image.is-avatar,
.post-features .col-1 .item-body .author-image.is-avatar,
.related-post .author-image.is-avatar {
  background-size: cover;
}

.related-post .author-name,
.post-features .author-name,
.post-items .author-name {
  font-style: normal;
}

.related-post .cite-date,
.post-items .cite-date {
  display: block;
  font-size: 0.85em;
  font-style: italic;
}



.blog-pagination {
  padding-top: 3em;
  max-width: 700px;
  width: 100%;
  margin: 0 auto
}

.blog-pagination a {
  font-size: 1em;
  text-align: center;
  text-decoration: none;
  -webkit-box-flex: 3;
  -ms-flex: 3 0;
  flex: 3 0;
  color: #cf225b !important
}

.blog-pagination a:hover {
  text-decoration: underline
}


@media(max-width:768px){
  .post-features .cols{
    -webkit-box-flex:1;-ms-flex:auto;flex:auto;
    max-width:none;
    min-width:initial;
    margin-left:0;
  }

  .post-features .popular-post {
    margin-top: 3em;
  }
}

@media(max-width:480px){
  .post-features .col-1 .image{
    height:12em;
  }
}


@media(max-width:423px){
  .post-listing .simple-sub-form .actions:before{
    display:none;
  }
}













/* POST PAGE  
* //////////////////*/
section.post-body-wrap {
  overflow: visible;
}

.post-hero-wrap .content-area {
  padding-top: 4em;
  padding-bottom: 9em;
}

.post-hero-wrap .meta-published span {
  color: #fff;
}




/* post body */
.post-body-wrap .cols {
  margin-top: -11em;
}

.post-body-wrap .col-2 {
  max-width: 327px;
  width: 100%;
  margin-left: 3em;
}


.post-body-wrap blockquote {
  padding: 1em;
  background-color: #f7f9fb;
  border: solid 1px #e3ebf6;
  border-radius: .3em;
  margin: 1em 0 2em;
  font-size: 1em;
  font-weight: 200;
  position: relative;
  line-height: 1.7;
  box-shadow: -0.5em 0.5em 0 0 rgb(207 34 91);
  max-width: calc(100% - 1em);
  width:100%;
  margin-left: auto;
}


.post-body-wrap .col-2 .sticky {
  position: sticky;
  top: 6em;
}

.post-body-wrap .subscript-form-wrap {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  background-color: #f2f2f2;
  border: 0;
  padding: 1.5em;
  border-radius: 0;
  font-size: .9em;
  border-radius: 0.2em;
}

.post-body-wrap .subscript-form-wrap .simple-sub-form {
  margin-top: 1em;
}

.post-body-wrap .subscript-form-wrap .simple-sub-form form input[type="email"] {
  box-shadow: none;
  border: solid 1px rgba(0,0,0,0.08) !important;
  background-color: rgba(255,255,255,1) !important;
  color: #2b3f4f;
  padding: 0 1em;
}

.post-body-wrap .subscript-form-wrap .simple-sub-form form input[type="email"], 
.post-body-wrap .subscript-form-wrap .simple-sub-form input[type="submit"] {
  border-radius: .5em !important;
  height: 50px;
}

.post-body-wrap .subscript-form-wrap .hs-richtext.hs-main-font-element {
  display: none;
}


@media(min-width:769px){
  .post-hero-wrap h1 {
    font-size: 3.5em;
  }

  .post-body-wrap blockquote {
    font-size: 1.2em;
  }
}

@media(max-width:950px){
  .post-body-wrap .cols{
    -webkit-box-flex:1;-ms-flex:auto;flex:auto;
    max-width:none;
    min-width:initial;
    margin-left:0;
    margin-top: -8em;
  }

  .post-hero-wrap .content-area {
    padding-bottom: 6em;
  }


  .post-body-wrap .col-2 {
    margin-top: 2em;
  }
}