/**
 * Top news
 */

.widget.widget_top_news {padding: 0;}
.widget.widget_top_news > .row {
    margin-left: 0;
    margin-right: 0;
}

.sidebar-before-header .widget,
.sidebar-after-header .widget {
    padding: 0;
}
.widget_top_news .row {
    overflow: hidden;
}
.widget_top_news .row > div {
    padding: 0;
}
.top-news-item-content > img {
    width: 100%;
}
.top-news-item .top-news-item-content {
    margin-right: 1px;
}
.top-news-item:last-child .top-news-item-content {
    margin-right: 0;
}
.top-news-item-content {
    margin-top: 1px;
}
.top-news-item-content:first-child {
    margin-top: 0;
}
.top-news-high {
    height: 427px;
}
.top-news-low {
    height: 213px;
}

.top-news-item-content--table {
    text-align: center;
    display: table;
    height: 100%;
    width: 100%;
}
.top-news-item-content--cell {
    position: relative;
    display: table-cell;
    width: 100%;
    vertical-align: bottom;
    line-height: 0; /* need to remove unnecessary spaces inline-block's */
}
.top-news-link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.top-news-item-meta {
    position: relative;
}
@media screen and (max-width: 767px) {
    .top-news-item {
        margin-bottom: 1px;
    }
    .top-news-item-content.top-news-high {
        margin-top: 1px;
        margin-bottom: 1px;
    }
}
.top-news-item-content .overlay {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.top-news-item-content .overlay {background: rgba(41, 42, 46, 0.3); /* #292a2e */ }
.top-news-item-content:hover .overlay {background: rgba(41, 42, 46, 0.5);}
.top-news-item-content .overlay:before,
.top-news-item-content .overlay:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.top-news-item-content .overlay:before {}
.top-news-item-content .overlay:after {}

/* Top news -- Category */
.top-news-category {
    display: inline-block;
    margin-bottom: 10px;
}
.top-news-category a {
    display: inline-block;
    font-size: 10px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 0.99;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin: 0 5px 5px 0;
    color: #ffffff;
}

.top-news-category a,
.top-news-category a:focus,
.top-news-category a:active {
    color: #ffffff;
}
.top-news-category a:hover,
.top-news-high .top-news-category a:hover,
.top-news-item:nth-child(1) .top-news-item-content:nth-child(2) .top-news-category a:hover,
.top-news-item:nth-child(3) .top-news-item-content:nth-child(1) .top-news-category a:hover,
.top-news-item:nth-child(3) .top-news-item-content:nth-child(2) .top-news-category a:hover {
    opacity: 0.5;
}

/* Top news -- Title */
.entry-content h2.top-news-title:not(.page-title),
.top-news-title {
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    margin: 0;
    padding: 0 1.25em 1.25em 1.25em;
    color: #ffffff;
}
.entry-content .top-news-high h2.top-news-title:not(.page-title),
.top-news-high .top-news-title {
    font-size: 24px;
    font-size: 2.4rem;
    padding: 0 0.5833em 1.25em 0.5833em;
}
.entry-content .top-news-high h2.top-news-title:not(.page-title).with-post--meta,
.top-news-high .top-news-title.with-post--meta {
    padding: 0 0.5833em 0.5833em 0.5833em;
}
@media screen and (min-width: 68.75em) {
    .entry-content .top-news-high h2.top-news-title:not(.page-title),
    .top-news-high .top-news-title {
        font-size: 36px;
        font-size: 3.6rem;
        padding: 0 0.3889em 0.8334em 0.3889em;
    }
    .top-news-high .top-news-title.with-post--meta {
        padding: 0 0.3889em 0.3889em 0.3889em;
    }
}

.entry-content h2.top-news-title:not(.page-title) a,
.top-news-title a {
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}
.entry-content h2.top-news-title:not(.page-title) a,
.entry-content h2.top-news-title:not(.page-title) a:focus,
.entry-content h2.top-news-title:not(.page-title) a:active,
.top-news-title a,
.top-news-title a:focus,
.top-news-title a:active {
    color: #ffffff;
}
.entry-content h2.top-news-title:not(.page-title) a:hover,
.top-news-title a:hover {
    color: #999999;
}

/* Top news -- Post meta */
.widget_top_news .post--views,
.widget_top_news .post--count,
.widget_top_news .post--likes {
    font-size: 10px;
    font-size: 1rem;
    font-weight: 400;
    display: inline-block;
    line-height: 1;
    padding: 0 0.5834em 2em 0.5834em;
}
.widget_top_news .post--views,
.widget_top_news .post--count,
.widget_top_news .post--likes,
.widget_top_news .post--count,
.widget_top_news .post--count a {
    color: #ffffff;
}
.widget_top_news .post--views .fa,
.widget_top_news .post--count .fa,
.widget_top_news .post--likes .fa {
    margin-right: 5px;
}

/* Font family */

/* Animate/Transition */
.top-news-item-content,
.top-news-item-content:hover,
.top-news-item-content .overlay,
.top-news-item-content:hover .overlay {
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

/**
 * Responsive and widget placements
 */

/* Secondary / left/right site sidebar */
.secondary .top-news-item {width: 100% !important;}
.secondary .top-news-item .top-news-item-content {margin: 0}
.secondary .top-news-item + .top-news-item .top-news-item-content {margin: 1px 0 0 0;}
.secondary .top-news-item .top-news-item-content + .top-news-item-content {margin: 1px 0 0 0;}
.secondary .high-position-3 .top-news-low {margin-right: 0;}
.secondary .high-position-3 .top-news-high {
    margin-top: 1px;
    margin-right: 0;
    margin-bottom: 1px;
}