/*
Theme Name:  Salient
Description: Styles for the "Featured Image Left" post style.
*/

.post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap:after {
  border-radius: 0;
  text-align: center;
  color: #fff;
  font: normal normal normal 18px/60px FontAwesome;
  content: "\f03e";
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

.post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap:after {
  font-size: 50px
}
.post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap,
.post-area.featured_img_left .post-featured-img-wrap {
  background-color: rgba(0,0,0,0.25)
}
.post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

body .post-area.featured_img_left .posts-container .article-content-wrap .video-play-button {
  position: absolute;
  bottom: 0;
  right: 30px;
  transform: translateY(50%);
  -webkit-transform: translateY(50%);
  -webkit-transition: all .21s cubic-bezier(.5,.5,.4,.88);
  transition: all .21s cubic-bezier(.5,.5,.4,.88);
  color: #fff;
  font-size: 30px;
  z-index: 1000;
  height: 60px;
  width: 60px;
  line-height: 60px;
  text-align: center;
  border-radius: 100px;
}
body .post-area.featured_img_left .posts-container .article-content-wrap .video-play-button {
  pointer-events: none;
  font-size: inherit;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.post-area.featured_img_left article .grav-wrap img {
  border-radius: 50%;
  width: 38px;
  height: 38px;
  margin-bottom: 0;
  margin-right: 13px;
  vertical-align: middle;
  display: inline-block;
  transition: all 0.4s cubic-bezier(0.2, 1, 0.2, 1);
}

.post-area.featured_img_left article .grav-wrap .text a{
  display:block;
  font-size: 14px;
  line-height: 20px
}

.post-area.featured_img_left article .meta-category a{
  font-size: 14px;
  line-height: 19px;
  position:relative;
  display: inline-block;
  font-weight: 600;
  margin: 0 10px 10px 0;
}

.post-area.featured_img_left .meta-category a:before {
  height: 2px;
  width: 100%;
  position: absolute;
  bottom: -3px;
  left: 0;
  content: '';
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: left;
  transform-origin: left;
  -webkit-transition: transform 0.3s cubic-bezier(0.25, 0, 0.4, 1);
  transition: transform 0.3s cubic-bezier(0.25, 0, 0.4, 1);
}

.post-area.featured_img_left .meta-category a:hover:before,
.post-area.featured_img_left .meta-category a:focus:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.post-area.featured_img_left article .grav-wrap .text span {
  font-size: 13px;
  line-height: 18px;
}

.post-area.featured_img_left article .grav-wrap .text {
  vertical-align: middle;
  display:inline-block;
  line-height: 0
}

.post-area.featured_img_left .grav-wrap a {
  color: inherit;
}

.post-area.featured_img_left .grav-wrap a:hover img,
.post-area.featured_img_left .grav-wrap a img.hovered {
  box-shadow: 0 7px 20px rgba(0,0,0,0.19);
}

.post-area.featured_img_left .video-play-button svg {
  height: 14px;
  width: 14px
}

.post-area.featured_img_left .video-play-button svg {
  margin-right: -2px;
}

.post-area.featured_img_left .post.quote .quote-inner .title,
.post-area.featured_img_left .post.link .link-inner .title {
  color: #fff;
}

.post-area.featured_img_left .post.link .link-inner .title {
  margin-bottom: 0;
}

.post-area.featured_img_left h3 a,
.post-area.featured_img_left h3 a:hover {
  color: inherit!important;
}

.post-area.featured_img_left .post.quote .post-content .quote-inner,
.post-area.featured_img_left .post.link .post-content .link-inner {
  background-color: transparent!important;
}

.post-area.featured_img_left .post.quote .post-content .quote-inner,
.post-area.featured_img_left .post.link .post-content .link-inner {
  text-align: center;
  padding: 10%;
  border-radius: 5px;
  overflow: hidden;
}

.post-area.featured_img_left .post.quote .n-post-bg,
.post-area.featured_img_left .post.link .n-post-bg,
.post-area.featured_img_left .post.quote .post-content .quote-inner:before,
.post-area.featured_img_left .post.link .post-content .link-inner:before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.88;
}

.post-area.featured_img_left .post.quote .n-post-bg,
.post-area.featured_img_left .post.link .n-post-bg {
	background-position: center;
}

.featured_img_left .post.quote .post-content .quote-inner:before,
.featured_img_left .post.link .post-content .link-inner:before {
  z-index: 10;
}


.post-area.featured_img_left .post.quote .post-content,
.post-area.featured_img_left .post.link .post-content {
  display: block;
  backface-visibility: hidden;
  border-radius: 5px;
  overflow: hidden
}

.post-area.featured_img_left .post.quote .quote-wrap:before{
  content: "\201C";
  font-family:sans-serif;
  font-weight:700;
  font-size: 54px;
  color: #fff;
  z-index: 10000;
  height: 32px;
  display: block;
  position: relative;
  padding-top: 33%;
}

.post-area.featured_img_left .post.quote .quote-wrap:before {
  padding-top: 0;
  line-height: 54px;
  padding-bottom: 15px
}

.post-area.featured_img_left .post.quote:not(.has-post-thumbnail):hover .post-content .quote-inner:before,
.post-area.featured_img_left .post.link:not(.has-post-thumbnail):hover .post-content .link-inner:before {
  opacity: 1;
}

.post-area.featured_img_left .post.quote .author {
  margin-top: 10px;
  display: block;
}

.post-area.featured_img_left .post.quote .n-post-bg,
.post-area.featured_img_left .post.link .n-post-bg {
  opacity: 1;
  background-size: cover;
}

.post-area.featured_img_left .post .post-content .quote-inner .icon,
.post-area.featured_img_left .post .post-content .link-inner .icon {
  display: none;
}

.post-area.featured_img_left .format-link .content-inner,
.post-area.featured_img_left .format-quote .content-inner {
  padding-bottom: 0;
  margin-bottom: 0;
}

.post-area.featured_img_left .post .post-content .link-inner .link-wrap {
  z-index: 10;
  position: relative;
}

.post-area.featured_img_left .post-content-wrap .grav-wrap,
.post-area.featured_img_left .post-content-wrap .meta-category {
  z-index: 150;
  position: relative;
}
.post-area.featured_img_left article {
  margin-bottom: 6%;
}
.post-area.featured_img_left .article-content-wrap .post-featured-img-wrap {
  width: 33%;
	position: relative;
  border-radius: 5px;
}
.post-area.featured_img_left .article-content-wrap .post-featured-img-wrap:before {
  transition: opacity .7s cubic-bezier(.2,1,.22,1);
  -webkit-transition: opacity .7s cubic-bezier(.2,1,.22,1);
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: '';
	opacity: 0;
  transform: scale(0.96);
	box-shadow: 0px 30px 60px rgba(0,0,0,0.17);
  border-radius: 5px;
}
.post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap:before {
  transform: none;
}
.post-area.featured_img_left .article-content-wrap .post-featured-img {
  border-radius: 5px;
  overflow: hidden;
}
.post-area.featured_img_left article .article-content-wrap .post-featured-img-wrap {
  transition: transform .7s cubic-bezier(.2,1,.22,1);
  -webkit-transition: transform .7s cubic-bezier(.2,1,.22,1);
}
.post-area.featured_img_left .article-content-wrap .post-featured-img-wrap a,
.post-area.featured_img_left .article-content-wrap .post-featured-img-wrap a span {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.post-area.featured_img_left .article-content-wrap .post-content-wrap {
  width: 66.6%;
	position: relative;
  border-radius: 0 5px 5px 0;
  overflow: hidden;
  padding: 6% 0 6% 6%;
}
.post-area.featured_img_left.span_12 .article-content-wrap .post-content-wrap {
  padding: 7%;
}
.post-area.featured_img_left.span_12 article {
  margin-bottom: 60px;
}
.post-area.featured_img_left .post:hover .post-featured-img-wrap:before {
  opacity: 1;
}
.post-area.featured_img_left article:hover .article-content-wrap .post-featured-img-wrap {
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
}
.post-area.featured_img_left .post-content-wrap .grav-wrap {
  margin-top: 20px
}
.post-area.featured_img_left .article-content-wrap .post-featured-img {
  background-size: cover;
  background-position: center
}
.post-area.featured_img_left #pagination {
  padding-left: 0;
}

@media only screen and (min-width: 1000px) {
	.post-area.featured_img_left .article-content-wrap .post-content-wrap {
		left: 33.3%;
	}
	.post-area.featured_img_left .article-content-wrap .post-featured-img-wrap {
		height: 100%;
	  position: absolute;
		left: 0;
		top: 0;
	}
}
@media only screen and (max-width: 999px) {
	.post-area.featured_img_left .article-content-wrap {
	  display: -webkit-flex;
	  display: -ms-flexbox;
	  display: flex;
	}
}

@media only screen and (max-width: 690px) {
  .post-area.featured_img_left .article-content-wrap {
    display: block;
  }

  .post-area.featured_img_left .article-content-wrap .post-featured-img-wrap,
  .post-area.featured_img_left .article-content-wrap .post-content-wrap {
    width: 100%;
  }

  .post-area.featured_img_left .quote .inner-wrap,
  .post-area.featured_img_left .link .inner-wrap {
    padding-bottom: 55px;
  }

  .post-area.featured_img_left .article-content-wrap .post-content-wrap {
    padding: 35px 0 55px 0;
    overflow: visible;
  }

  .post-area.featured_img_left article:not(.has-post-thumbnail) .article-content-wrap .post-featured-img-wrap {
    display: none;
  }

  .post-area.featured_img_left .article-content-wrap .post-featured-img-wrap {
    height: 200px;
    border-radius: 5px 5px 0;
  }
}
