/**
 * Article Lists and Pages
 */

/******************************************************************************************************************************//*
* General styling
********************************************************************************************************************************/

.node .field--name-body {
  line-height: 140%;
  font-family: "Crimson Text", "Merriweather", Georgia, "Times New Roman", Times, serif;
}

.is-article .reviewed-works,
.is-article .field--name-body {
  clear: both;
}

.media--view-mode-default img {
  width: 100%;
}

 /* Drop cap */ 
.show-dropcap .node > .field--name-body > p:first-child::first-letter {
  float: left;
  font-size: 4em;
  margin: 0 .1em 0 0;
  line-height: 95%;
}

/* This is the pullout quote styling */
.cc-content-insert--pullout-quote {
  background: #f3efe8;
  padding: 1.5rem 8%;
  margin: 1.5rem -5.5%;
  border-left: 4px solid #009166;
  font-size: 1.5rem;
  font-style: italic;
  font-weight: 600;
  line-height: 120%;
}

.truncated-article-body .cc-content-insert--pullout-quote {
  display: none;
}

@media all and (min-width: 480px) {
  .cc-content-insert--pullout-quote {
    padding: 1.75rem 5%;
    font-size: 1.8rem;
  }
}

@media all and (min-width: 640px) {
  .is-article .field--name-body,
  .is-article.section-review.featured-image-none .field--name-body {
    clear: right;
  }
  .is-article.featured-image-none .field--name-body {
    clear: both;
  }
  .cc-content-insert--pullout-quote {
    padding: 2rem 5%;
    font-size: 2rem;
  }
}

@media all and (min-width: 1000px) {
  .cc-content-insert--pullout-quote {
    margin-right: 0;
    font-size: 2.25rem;
  }
} /* <---- @media (min-width: 1000px) */

@media all and (min-width: 1250px) {
  /* Drop cap */ 
  .show-dropcap .node > .field--name-body > p:first-child::first-letter {
    font-size: 5em;
  }
  .cc-content-insert--pullout-quote {
    margin: 1.75rem 0 1.75rem -4.5%;
    padding: 2.25rem 4.2%;
  }
}

/******************************************************************************************************************************//*
* Paywall
********************************************************************************************************************************/

.cc-paywall {
  background: #007478;
  padding: 1.5rem 5.7%;
  margin: 1.5rem -5.7% 0;
  width: 111.4%;
  box-sizing: border-box;
  font-size: 1.4rem;
  clear: both;
}
.cc-paywall p {
  color: #FFF;
  text-align: left;
}
.cc-paywall a {
  color: #e6aa49;
}
.cc-paywall input.form-submit {
  background: #e6aa49;
  color: #fff;
}

@media all and (min-width: 800px) {
  .cc-paywall {
    padding: 1.5rem 3.3%;
    margin: 1rem -3.2% 0;
    font-size: 1.5rem;
    line-height: 130%;
    width: 106.4%;
  }
}/*<----@media all and (min-width: 800px) */

@media all and (min-width: 1000px) {
  .cc-paywall {
    padding: 1.5rem 4%;
    margin: 1rem auto 0;
    max-width: 750px;
    width: 100%;
    font-size: 1.5rem;
    line-height: 130%;
  }
}

/******************************************************************************************************************************//*
* Social share
********************************************************************************************************************************/

.is-article .social-share {
  margin: 0.5rem 0 1.5rem 0;
  clear: left;
  float: left;
}

.featured-image-none.is-article .social-share,
.featured-image-vertical.is-article .social-share {
  margin-bottom: 1.75rem;
}

.is-article .share-label {
  text-transform: uppercase;
  font-weight: 300;
  font-size: 0.9rem;
  color: #555;
}

.is-article .share-button {
  text-indent: -10000px;
  display: inline-block;
  width: 20px;
  height: 26px;
  margin-left: 8px;
  background-size: 75%;
  background-position: center center;
  background-repeat: no-repeat;
  transition-property: opacity;
  transition-duration: 0.25s;
}

.is-article .share-button:hover {
  opacity: 0.7;
}

.is-article .share-button.email {
  background-image: url(../../images/icon-email.svg);
}

.is-article .share-button.facebook {
  background-image: url(../../images/icon-facebook.svg);
}

.is-article .share-button.twitter {
  background-image: url(../../images/icon-x.svg);
}

.is-article .share-button.print {
  background-image: url(../../images/icon-print.svg);
}

@media all and (min-width: 640px) {
  .is-article .social-share {
    float: right;
    clear: none;
  }
}

/******************************************************************************************************************************//*
* Lead image & caption area.
********************************************************************************************************************************/

.cc-featured-image {
  clear: both;
  margin: 0 0 1rem 0;
}

.cc-featured-image > .field--name-field-media-image img {
  width: 100%;
}

.cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
  border-bottom: 1px dashed #ccc;
  color: #828282;
  font-size: .8rem;
  font-style: italic;
  font-family: sans-serif;
  line-height: 1.1rem;
  padding: .5rem 0 1rem;
}

/**
 * Narrow/vertical image.
 */
@media all and (min-width: 640px) {
  .featured-image-vertical .cc-featured-image {
    float: left;
    width: 45%;
    max-width: 400px;
    margin: 0 4% 1.5rem 0;
  }
}

/**
 * Extra-wide image display.
 */
.featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image {
  width: 111.2%;
  margin-left: -5.7%;
}
.featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
  padding-left: 5%;
  padding-right: 5%;
}

@media all and (min-width: 800px) {
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image {
    margin-left: -3.2%;
    width: 106.4%;
  }
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
    padding-left: 3%;
    padding-right: 3%;
  }
}

@media all and (min-width: 1000px) {
  .featured-image-wide .cc-featured-image {
    width: 147%
  }
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image {
    width: 106.6%;
    margin-left: -3.4%;
  }
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
    padding-left: 3.3%;
    padding-right: 3.3%;
  }
}

@media all and (min-width: 1250px) {
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image {
    width: 104.2%;
    margin-left: -2.2%;
  }
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
    padding-left: 2.4%;
    padding-right: 2.4%;
  }
}

@media all and (min-width: 1440px) {
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image {
    width: 108%;
    margin-left: -4%;
  }
  .featured-image-wide-mobile .cc-featured-image > .field--name-field-media-image .field--name-field-image-caption {
    padding-left: 0;
    padding-right: 0;
  }
}

/******************************************************************************************************************************//*
* Related works/reviews
********************************************************************************************************************************/

.reviewed-works {
  margin: 0 0 1.25rem;
  font-size: 1rem;
}

.reviewed-works .node {
  padding-bottom: 1.25rem;
}

.reviewed-works.one-column-layout {
  max-width: 350px;
}

.reviews-title {
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 0.75rem;
}

.list-title.reviewed-work-title {
  margin: 0.5rem 0 0 0;
  font-size: 1.1rem;
  font-style: italic;
}

.field--name-isbn2node-subtitle {
  font-size: 1.1rem;
  font-style: italic;
}

.reviewed-works .field {
  display: block;
  margin-bottom: 0.75rem;
}

.reviewed-works .field p {
  margin-bottom: 0;
}

.reviewed-works .field--name-field-review-media-image {
  margin-bottom: 0;
}

.reviewed-works .field--name-field-review-media-image img {
  width: 100%;
}

@media all and (min-width: 480px) {
  .reviewed-works.one-column-layout {
    max-width: 320px;
  }
  .reviewed-works.two-column-layout > .field__items {
    max-width: 700px;
  }
  .reviewed-works.two-column-layout > .field__items,
  .reviewed-works.three-column-layout > .field__items {
    display: grid;
    grid-template-columns: 48% 48%;
    grid-column-gap: 4%;
  }
}

@media all and (min-width: 640px) {
  .reviewed-works {
    margin: 0 0 1.5rem 0;
  }
  .reviewed-works.one-column-layout {
    float: left;
    margin: 0 4% 1rem 0;
    width: 50%;
  }
  .reviewed-works.three-column-layout > .field__items {
    grid-template-columns: 31% 31% 31%;
    grid-column-gap: 3.5%;
  }
}

/******************************************************************************************************************************//*
* House and banner ads
********************************************************************************************************************************/

.house-ad.in-content {
  max-width: 150px;
  width: 45%;
  margin: 0 0 1rem 1rem;
  float: right;
}

.house-ad.in-content .button.overlay {
  position: absolute;
  bottom: 0;
  width: 90%;
  box-sizing: border-box;
  margin: 0 5% 14px;
  text-align: center;
  border-radius: 0;
  padding: 0.6rem;
}

.house-ad.in-content p {
  font-size: 0.8rem;
  font-family: "Libre Franklin", Helvetica, Arial, sans-serif;
  line-height: 140%;
  font-weight: 500;
}

.banner-ad.in-content {
  margin: 1.5rem 0;
  padding: 1.5rem;
  text-align: center;
}

@media all and (min-width: 1000px) {
  .house-ad.in-content {
    margin: 0 -4% 1.5rem 1.5rem;
  }
}

/******************************************************************************************************************************//*
* Floating sidebar
********************************************************************************************************************************/

/**
 * Make regions that interact with the sidebar have a higher Z-index.
 */
.has-floating-sidebar .cc-featured-image,
.has-floating-sidebar .region-main-bottom,
.has-floating-sidebar #prefooter,
.has-floating-sidebar #footer {
  position: relative;
  z-index: 1;
}

.has-floating-sidebar .cc-featured-image,
.has-floating-sidebar .region-main-bottom {
  background-color: #fff;
}

.hide-sidebar .sidebar .block {
  display: none;
}

/**
 * "Most Recent" block
 */
.most-recent .views-row {
  padding: 0 0 1rem 0;
}
.most-recent .views-field-title h3 {
  margin: 0;
}
.most-recent .views-field-title h3:after {
  all: unset;
}
.most-recent .views-field-field-byline,
.most-recent .views-field-field-byline p {
  padding-top: 0;
}
.most-recent .views-field-changed {
  margin-bottom: 1rem;
  padding: 0;
}

/**
 * Floating-sidebar style.
 */
@media all and (min-width: 1000px) {
  .region-sidebar-floating {
    margin-top: 400px;
  }
  .has-floating-sidebar .region-sidebar-floating {
    margin-top: 0;
    position: relative;
  }
  .has-floating-sidebar .region-sidebar-floating .block {
    display: none;
    position: fixed;
    top: 40px;
  }
  .has-floating-sidebar .region-sidebar-floating .block.sticky {
    display: block;
  }
}

@media all and (min-width: 1250px) {
  .has-floating-sidebar .region-sidebar-floating .block {
    top: 60px;
  }
}

/******************************************************************************************************************************//*
* Author bios below content
********************************************************************************************************************************/

.node-type-article .view-author-block {
  margin-top: 2.5rem;
}

.node-type-article .view-author-block .views-row {
  padding-top: 1.25rem;
}

.node-type-article .view-author-block .author-name {
  margin-top: 0;
}

.node-type-article .view-author-block .author-image {
  float: left;
  width: 25%;
  max-width: 175px;
  margin-right: 3%;
}

.author-image.red-border-top {
  border-top: 5px solid #d05d3c;
}

.node-type-article .view-author-block .author-bio a {
  font-size: 1rem;
}

@media all and (min-width: 800px) {
  .node-type-article .view-author-block .views-row {
    padding-top: 2rem;
  }
}

@media all and (min-width: 1250px) {
  .node-type-article .view-author-block .views-row {
    padding-top: 2.5rem;
  }
}