.col-xs-12 {margin-left: -16px; }


/*
.col-xs-12 .row.c-card .col-sm-8 { margin-top: 0 }
@media(min-width: 48em){
 .col-xs-12 .row.c-card .col-sm-8 {margin-top: -45px } 
}
*/

.page-header__logo img { max-width: 450px;}

.layout__region.layout__region--first {overflow: hidden;}

.page {border-top: 12px solid #255C4E; }
.single {margin-top: 20px;}
.header-cover {max-width: 130px;}
.menu--main a {
  color: #255C4E;
  font-family: freight-sans-pro;
  font-weight: 700;
}
.digital-exclusives .c-card__tag .fas {background-color: transparent ;}
figcaption {font-family: 'freight-sans-pro' !important; font-size: 16px !important; line-height: 18px !important}
.field--name-field-parent-issue {margin-bottom: 20px;}
.block-entity-field\:node\:field-banner-image-caption {font-size: 16px; line-height: 18px;margin-top: 10px }
.page-header__selected-issue-text {display: none}

.issue-features {padding: 0 !important; margin-top: 0;}
@media(min-width: 64em){
	.issue-features {margin-top: -20px;}
}

.issue-features .region-top-content .row.c-card h3  a {font-size: 36px}



.issue-features h1 {margin-top: 0;margin-left: 2.3rem;}
@media(min-width: 64em){
	h1{	font-size: 50px;}
}



 h2.title:not(.popup-header h2.title) {color: black !important;  font-family: freight-sans-pro, "FreightSans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; size: 40px;border-bottom: 1px solid #ddd;  padding-bottom: 4px;}
.s1 {all: unset;}  
.block-entity-field\:node\:field-article-author {font-family: freight-sans-pro, "FreightSans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; }
  
.c-card {border: none !important;}

.c-card, .issue img, .top-drawer {
    -webkit-box-shadow: none !important;
    box-shadow:  none !important;
}

.c-card--small .c-card__content {
    padding: 1.2rem 1.2rem 1.2rem 0;
}

.col-xs-12:nth-child(1) {border-bottom: 1px solid #ddd; margin-bottom: 30px;}

.region-top-content .col-12 {
  border-bottom: 1px solid #ddd;
  display: block;
  overflow: hidden;
}

.col-xs-12 .col-sm-8 a {max-height: 100% !important;}

.region-top-content .col-12 > div:nth-child(1) {
border-right: 2px solid #ddd !important;
  margin-right: 10px;
  padding-right: 6px; 
  display: block;
  overflow: hidden;
}
.js-carousel--digital-exclusives .c-card__content {padding-left: 15px !important;}
.region-top-content .col-12 > div:nth-child(2) {
border-right: 1px solid #ddd !important;
padding-right: 16px;
}
.digital-exclusives {background-color: #e7f2e0;}
.also-in-this-issue .c-card__image-link {
    height: 250px;
}

.carousel__prev-button:hover, .carousel__next-button:hover,.carousel__prev-button:hover, .carousel__previous-button:hover  {
    background-color: #255C4E !important;
}

.carousel__next-button, .carousel__prev-button { color: #255C4E !important;}

.c-card__tag:not(.carousel .c-card__tag ) {font-weight: normal !important; color: black;}

.carousel .c-card--small .c-card__title {
    font-size: 20px;
    line-height: 26px;
}

.c-card__title {
  text-transform: none !important;
}
.c-card p {line-height: 1.2;}
.c-card, .c-card a {
  letter-spacing: 0.5px; 
}

.c-card__image-link:not(.digital-exclusives .c-card__image-link)  {
  min-width: 100% !important; 
  width: 100% !important;
}

.issue-features .c-card__image-link {
    background-color: white !important;
}

.this-issue__details {display: none;}
.this-issue__articles  { min-width: 100% !important;}

.field--name-field-para-image {padding: 15px 0;}
.region-bottom-content {
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-template-rows: auto auto; /* Explicitly define 2 rows for precise placement */
  /* Set row-gap to 0 to eliminate vertical gaps between rows */
  row-gap: 0;
  /* Set column-gap for horizontal spacing between columns (Div 1/2 stack and Div 3) */
  column-gap: 20px; 
  /* Keep other container styles */
  width: 90%;
  max-width: 1200px;
  margin: 40px auto;
  padding: 20px;
  align-items: start; /* Ensures items align to the top of their grid cells */
}

.block-entity-field\:node\:field-cover-image {
  grid-column: 1; /* Div 1: First column */
  grid-row: 1;    /* Div 1: First row */
  padding: 15px;
  /* Optional: If you *do* want a small gap only between Div 1 and Div 2, add margin-bottom here */
  /* margin-bottom: 10px; */
}

.block-entity-field\:node\:title {
  grid-column: 1; /* Div 2: Stays in the first column */
  grid-row: 2;    /* Div 2: Moves to the second row, directly below Div 1 */
  padding: 15px 15px 15px 0;
  margin-top: -110px;
}

#block-tulanian-bootstrap-issuearchiveblock {
	margin-top: -130px;
  margin-left: 15px;
}

.block-entity-field\:node\:title .single__title:not(h1) {
    font-size: 30px !important;
}  



#block-tulanian-bootstrap-callstoaction2 {
  grid-column: 2;         /* Div 3: Second column */
  grid-row: 1 / span 2;   /* Div 3: Spans from row 1 through row 2 (2 rows total) */
  padding: 15px;
}



@media (min-width: 576px) {
#block-tulanian-bootstrap-callstoaction2   .col-sm-6  {
    max-width: 100% !important;
  }
}


.call-to-actions {
    padding-top: 0 !important;
}

.single .blockquote--large {
    line-height: 36px;
}
.blockquote.blockquote--large {font-family: 'freight-sans-pro' !important; color: black;font-weight: normal;}
p.blockquote__credit {margin-top: 30px !important;}
blockquote {border-left: none !important}
.blockquote--large {margin: 20px 0;}
.blockquote--large p:first-of-type {font-size: 34px;}
.blockquote__credit {font-size: 22px;}


#dialog-title {
	background-color: #255c4e;
  color: white;
  padding: 10px 20px;
  font-family: freight-sans-pro;
}
#dialog-title .button--ghost {
color: #255c4e;
  background-color: white;
float: right;
  margin-top: -4px;
}	
.popup-container .popup-header .popup-header h2.title {color: white !important;}
.region-footer .button--ghost:hover {color: #255c4e !important;}


.single__dropcap::first-letter {
  float: left;
  font-size: 6em;
  line-height: 0.5;
  font-weight: bold;
  margin-right: 0.1em;
  font-family: freight-sans-pro;
}
@media (min-width: 992px) {
    .single .blockquote--large {
       /* font-size: 40px !important;
        line-height: 46px; */
}

footer {background-color: #21543f !important;}
.single__dropcap {freight-sans-pro, "FreightSans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !important;}
.image-partialbleed__caption {
    margin-top: 10px;
}

/* collapse image above feature story title and text */
/*
 * By default (on mobile), we want the 8-column div to appear first.
 * The parent .row container needs to be a flex container.
 */
.row.c-card {
  display: flex;
  flex-direction: column;
}

/*
 * Give the 8-column div an 'order' value that makes it appear first.
 * In Flexbox, elements with lower 'order' values come first.
 */
.row.c-card .col-sm-8 {
  order: 1;
}

/*
 * Give the 4-column div an 'order' value that makes it appear second.
 */
.row.c-card .col-sm-4 {
  order: 2;
}

/*
 * Use a media query to reset the Flexbox properties at the 'sm' breakpoint
 * and above, so the default horizontal layout returns.
 * The standard Bootstrap 'sm' breakpoint is 576px.
 */
@media (min-width: 576px) {
  .row.c-card {
    flex-direction: row;
  }

  .row.c-card .col-sm-8,
  .row.c-card .col-sm-4 {
    order: 0; /* Reset the order for desktop layout */
  }
}


	
}