/**
Stacked featured layout
**/

.column-control > .bootstrap-container .col-sm-9 .col-sm-8 {
width: 100% !important;
}

.column-control > .bootstrap-container .col-sm-9 .col-sm-4 {
width: 100% !important;
}

@media (min-width: 992px) {

/* .related--article-rail .related--article-image-section .fixedratio {
padding-top: 50% !important;
}
.featured--article-rail .fixedratio {
padding-top: 40% !important;
}

.related--article-rail .related--article-list {
width: 45%;
}
.related--article-rail .related--article-list:nth-child(4) {
margin-left: 10%;
} */

}




/**
SVP/MVP Top3 same size
**/
@media (max-width: 991px) {

.related--article-rail .related--article-image-section .fixedratio {
padding-top: 45% !important;
}
.featured--article-rail .fixedratio {
padding-top: 45% !important;
}

}



.articlelandingpage .related--article-rail .related--article-title {
display: none;
}




/**
Make rail tags look like other tags
**/
.articlepage .related--article-rail .related--article-image-section .related--article-tag,
.articlelandingpage .related--article-rail .related--article-image-section .related--article-tag {
font-family: 'jaf-bernina-sans',sans-serif;
font-weight: 300 !important;
font-size: 12px !important;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.33;
letter-spacing: 0.5px !important;
color: #000 !important;
position: absolute;
bottom: 0 !important;
left: 0;
margin-bottom: -30px;
text-transform: uppercase !important;
background: transparent !important;
width: auto;
display: block;
justify-content: left !important;
align-items: baseline;
height: auto !important;
opacity: 1;
padding: 0 !important;
}

.related--article-rail .related--article-desc {
margin-top: 36px !important;
}

.featured--article-tag, .articleblock--content--tag {
letter-spacing: 0.5px !important;
color: #000 !important;
text-transform: uppercase !important;
font-weight: 300 !important;
margin-bottom: 5px !important;
}


@media (max-width: 991px) {
    .articleGrid .article--grid-container .article--grid-data .articleblock
{
  display: flex !important;
  max-width: 100% !important;
  align-items: flex-start !important;
  justify-content: initial !important;
  margin-bottom: 60px;
  flex: 100% !important;
}
}

@media (min-width: 768px) and (max-width: 991px) {
    .articleGrid .article--grid-container .article--grid-data.alternate .articleblock--image {
      max-width: 260px;
      max-height: 180px;
      display: block;
      width: 100%;
      height: 100%;
    }
  }

/* Searchbox adjustment for MVP */
@media (min-width: 768px) and (max-width: 992px) {
        .search--article span {
          right: 25px;
        }
}

/**
Make all article titles semibold and black – change to rem?
**/
.articleblock--content--title {
font-weight: 600 !important;
color: #000 !important;
font-size: 1.143rem !important;
max-width: 100% !important;
line-height: 1.5 !important;
}

.related--article-rail .related--article-desc {
font-weight: 600 !important;
color: #000 !important;
font-size: 1.143rem !important;
line-height: 1.5;
}

.featured--article-rail .featured--article-title {
font-weight: 600 !important;
color: #000 !important;
font-size: 30px !important;
}




/**
Hide category filter
**/
.article--grid-container .article--grid-filters {
display: none;
}




/**
Hide duplicative first 3 stories
**/
.article--grid-container .article--grid-data .articleblock:nth-child(-n+3) {
display: none !important;
}




/**
Make category links blue
**/
.article-category-quick-links-container a {
color: #137DB9 !important;
font-size:15px !important;
margin-left:10px;
}




/**
Make search stand out
**/
.search--article input {
padding: 10px 43px 10px 10px !important;
border: 1px solid #959595 !important;
color: #000 !important;
background-color: transparent;
}

.search--article input:hover {
background-color: #f8f8f8;
border: 1px solid #000 !important;
}

.search--article input::placeholder {
color: #000;
font-size: 15px !important;
font-weight: 600 !important;
opacity: 1;
}

/**
Stacked featured layout
**/
@media (min-width: 992px) {
    /* .related--article-rail .related--article-image-section .fixedratio {
        padding-top: 50% !important;
    } */
    .featured--article-rail .fixedratio {
        background-position: center center;
    }
    /* .related--article-rail .related--article-list {
        width: 45%;
    }
    .related--article-rail .related--article-list:nth-child(4) {
        margin-left: 10%;
    } */
}

@media (min-width: 992px) {
    .featured-with-recent-articles .related--article-rail .related--article-list {
        width: 48%;
    }
    .featured-with-recent-articles .related--article-rail .related--article-list:nth-child(4) {
        margin-left: 4%;
    }
    .featured-with-recent-articles .articlelandingpage .related--article-rail .related--article-image-section .related--article-tag {
        height: 30px;
    }
    .featured-with-recent-articles .related--article-rail a.related--article-desc {
        margin-top: 35x !important;
        font-size: 16px !important;
    }
}

/* Article tags */
.article-category-container .c-article-clickable {
    background-color: #007db9;
    color: white;
    padding: 0.5em 1em;
    border-radius: 5px;
    margin-right: 0.5em;
    font-size: 1.143rem;
    transition: all ease-in-out 100ms;
}
.article-category-container .c-article-clickable:hover {
    background-color: #173c5a;
}
.article-category-container .c-article-clickable::after,
.article-category-container .c-article-clickable::before {
    content: '';
    display: none;
}
.article-category-container {
    margin-bottom: -30px;
}
.article-category-container a {
    display: inline-block;
    margin-bottom: 0.5em;
}

.breadcrumb .cmp-breadcrumb {
  border-bottom: 1px solid #ededed;
  padding-bottom: 0.5em !important;
}

/* More articles */
.moreArticles {

}
.moreArticles ul {
    list-style-type: none;
    padding-left: 0;
}
.moreArticles ul li a {
    color: #007db9 !important;
}
.moreArticles a:hover {
    color: #000 !important;
}

/* HR */
.horizontalrule .wrap-horizontal {
    margin-top: -30px;
}
.horizontalrule .wrap-horizontal hr {
    margin: 0;
}

/* Related articles */
@media (min-width: 768px) {
    .category-page .relatedArticles.section {
        padding-left: 1.5em !important;
        padding-right: 0 !important;
    }
}


.newshub-header {
    margin-top: -1.5em !important;
}
.newshub-header .contentcard {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.newshub-header .wrap-content-card .content-card h1 {
    color: #fff !important;
}
.newshub-header .wrap-content-card .content-card p {
    color: #fff !important;
}
@media (max-width: 768px) {
    .newshub-header .col-sm-8 .content-card {
        margin-top: -1.5em;
    }
    .newshub-header .col-sm-8 .content-card p {
        display: none;
    }
}
.newshub-header.column-control:after {
    display: block;
    width: 100.0%;
    height: 10px;
    padding: 0 !important;
    background: linear-gradient(80deg, #001623 0%, #145074 50%, #002C40 100%);
    background-color: #007db7;
    content: '';
}
@media (min-width: 768px) {
    .newshub-header .wrap-content-card .content-card .button {
        float: right !important;
    }
    .newshub-header .wrap-content-card .content-card p {
        text-align: right !important;
    }
    .newshub-header .wrap-content-card .content-card h1 {
        text-align: left !important;
    }
}
@media (min-width: 992px) {
    .newshub-header .wrap-content-card .content-card p {
        margin-top: -2em !important;
    }
}
@media (max-width: 768px) {
    .newshub-header .wrap-content-card .content-card p {
        margin-top: -2em !important;
    }
    .newshub-header .wrap-content-card .content-card h1 {
        margin-bottom: 0 !important;
        margin: 0.75em !important;
    }
    .newshub-header .contentcard {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }
}

.cta-row .wrap-content-card .content-card .button.text-center {
    display: inline;
}
.cta-row .btn {
    padding: 10px 17px !important;
    font-size: 1.143rem;
    font-weight: 400;
}
@media (min-width: 992px) {
    .wrap-content-card .content-card .button .btn {
        min-width: auto;
    }
}
.cta-row-sm
    .wrap-content-card
    .content-card
    .button
    .btn-outline-tertiary--inversed {
    background: #367bb4;
    color: #fff;
    border: 1px solid #367bb4;
}
.cta-row-sm
    .wrap-content-card
    .content-card
    .button
    .btn-outline-tertiary--inversed:hover {
    background: #fff;
    color: #071d2f;
    border: 1px solid #fff;
}

hr {
    margin: 0 !important;
}

/* Landing page features */
.search.search--article:before {
    content: 'Search for a story';
    font-size: 0.95rem;
    font-weight: 600;
    position: relative;
    top: -7px;
    left: -2px;
}
.searchcomp.section {
	margin-top: -1em;
}
.article-form.form-inline {
    padding-left: 0;
}
.article-category-quick-links-container a {
    margin-left: 0;
}
.article-category-quick-links-container:before {
    content: 'Topics';
    font-size: 0.95rem;
    font-weight: 600;
    position: relative;
    line-height: 2.5;
}
@media (max-width: 991px) {
    .search.search--article:before {
        position: absolute;
        top: -20px;
        left: 10px;
    }
    .searchcomp.section {
        margin-top: 0;
    }
}
@media (max-width: 767px) {
    .categories-dropdown--button:before {
        content: 'Topics';
        font-size: 0.95rem;
        font-weight: 600;
        position: relative;
        top: -20px;
    }
    .article-category-quick-links-container:before {
        content: '';
        display: none;
    }
}
@media (max-width: 450px) {
    .search--article span {
        right: 26%;
    }
}
@media (max-width: 310px) {
    .categories-dropdown--button {
        display: none;
    }
}

/* Image captions */
.cq-dd-fragment .image {
    margin-bottom: 1.5em;
    position: relative;
}
.cq-dd-fragment .image .cmp-image__title {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.75);
    color: white;
    padding: 0.25em 0.5em;
    line-height: 1.5;
    font-size: 0.9rem;
    display: block;
    margin-top: -3px;
}