/* 

Theme Name: News It
Description: News It is a WordPress theme designed for online newspapers and digital magazines, featuring a clean and well-structured layout. Its modern design highlights breaking news, popular articles, and trending topics, making it ideal for news websites. Fully customizable, it includes advanced options such as Google Fonts integration and WooCommerce support, allowing you to combine editorial content with e-commerce features seamlessly.
Author: ThemeinProgress.
Author URI: https://www.themeinprogress.com
Version: 1.0.0
Requires PHP: 5.3
Tested up to: 6.8
Template: newsweek
Tags: custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, post-formats, right-sidebar, sticky-post, theme-options, threaded-comments, translation-ready, one-column, two-columns, three-columns, four-columns, grid-layout, blog, e-commerce, news
Text Domain: news-it
Domain Path: /languages
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html

News It WordPress Theme is a child theme of Newsweek, Copyright 2025 ThemeinProgress.
News It is distributed under the terms of the GNU GPLv3.

Newsweek WordPress Theme, Copyright 2025 ThemeinProgress.
Newsweek is distributed under the terms of the GNU GPLv3.

*/

/* ===============================================
   Header
   =============================================== */

#header {
    background:#2D3032
}

#header,
body.home #header {
    padding: 25px;
}

/* ===============================================
   Header cart
   =============================================== */

.header-cart a.cart-contents:hover, 
.header-cart a.cart-contents:active, 
.header-cart a.cart-contents:focus {
    background:none !important;
}

.header-cart-widget .widget_shopping_cart,
.header-cart-widget .widget_shopping_cart a {
	color: #fff !important;
}

/* ===============================================
   Logo
   =============================================== */

#logo a {
    line-height: normal;
}

/* ===============================================
   Menu
   =============================================== */

nav.header-menu li a .sf-sub-indicator i {
    font-size: 10px !important;
    vertical-align: middle;
}

nav.header-menu ul.children ,
nav.header-menu ul.sub-menu,
.header-cart-widget {
    background:#2D3032 !important
}

nav.header-menu ul.children li a ,
nav.header-menu ul.sub-menu li a {
	color: #fff;
}

nav.header-menu ul {
    text-align: center;
}

/* ===============================================
   Header search
   =============================================== */

.header-search .search-form {
	background: rgba(45 ,48, 50, 0.98) none repeat;
}

.header-search .search-form a.close-search-form,
.header-search .search-form #header-searchform input[type=text] {
	color:#fff;
}

.header-search .search-form #header-searchform ::-webkit-input-placeholder {
	color:#fff;
}

.header-search .search-form #header-searchform ::-moz-placeholder {
	color:#fff;
}

.header-search .search-form #header-searchform :-ms-input-placeholder {
	color:#fff;
}

.header-search .search-form #header-searchform :-moz-placeholder {
	color:#fff;
}

/* ===============================================
   Post article
   =============================================== */

body.news_it_archives .post-article-wrap {
    border: 1px solid #ddd;
}

body.news_it_archives #masonry .post-article-wrap {
    border: none;
}

/* ===============================================
   Recent posts
   =============================================== */

.recent-posts-section {
    position: relative;
    margin: 0px 0 30px 0;
    padding: 0;
}

#header_sidebar + .recent-posts-section {
    margin-top:0px;
}

.recent-posts-grid {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 10px;
    padding: 0;
}

.recent-posts-grid h2 {
    margin: 10px 0 !important;
}

.recent-posts-grid h2 a {
	text-decoration: none;
}

.recent-posts-grid .category {
    margin: 20px 0 0 0 !important;
}

.recent-posts-left-column,
.recent-posts-right-column {
    display: grid;
    gap: 20px;
}

.recent-posts-center-column {
    position: relative;
	background-color: #fff;
	border: 1px solid #ddd;
    padding: 10px;
}

.recent-posts-center-column img {
    width: 100%;
    height: auto;
}

.recent-posts-article-content {
    padding: 0;
}

.recent-posts-article-content .category a {
    font-size: 14px;
    font-weight: bold;
	text-decoration: none;
}

.recent-posts-article-content h1 {
    font-size: 24px;
    margin: 10px 0 !important;
}

.recent-posts-article-content .author {
    font-size: 12px;
    color: #555;
}

.recent-posts-article-content .description {
    font-size: 15px;
    margin: 10px 0;
}

.recent-post {
    border: 1px solid #ddd;
    padding: 10px;
    background-color: #fff;
}

.recent-post img {
    width: 100%;
    height: auto;
}

.recent-post .category a {
	text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    margin-top: 10px;
}

.recent-post h2 {
    font-size: 18px;
    margin: 10px 0 !important;
}

.recent-post .description {
    font-size: 14px;
    margin: 10px 0;
}

.recent-post .author {
    font-size: 12px;
    color: #555;
}

.recent-posts-permalink {
	position:relative;
	display:block
}

.recent-posts-permalink:after {
	content: '';
	display: block;
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
	opacity: 0;
	background: linear-gradient(0deg, rgba(0,0,0,0.3) 33%, rgba(255,255,255,0.15) 66%);
	z-index:998;
    -moz-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}

.recent-posts-permalink:hover:after ,
.recent-posts-permalink:focus:after {
	opacity: 0.5;
	-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity= 50);
	filter: alpha(opacity= 50);
}

/* ===============================================
   Related posts
   =============================================== */

.related-posts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 10px;
}

.related-posts a,
.related-posts a:hover,
.related-posts a:active,
.related-posts a:focus {
    text-decoration: none;
}

.related-posts h3 {
	position: relative;
	font-size: 24px;
    font-weight: 600;
	margin:30px 0 !important;
	text-align:center;
}

.related-posts h4 {
	position: relative;
	font-size: 18px;
    font-weight: 600;
	margin:0;
	text-align:left;
}

.related-posts .meta-info {
    margin-top: 10px;
    font-size: 12px;
    text-align: left;
}

.related-posts .wp-post-image {
    height: auto;
}

.related-posts .related-post-permalink {
    position: relative;
    display: block;
}

.related-posts .related-post-permalink:after {
	content: '';
	display: block;
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
	opacity: 0;
	background: linear-gradient(0deg, rgba(0,0,0,0.3) 33%, rgba(255,255,255,0.15) 66%);
	z-index:999;
    -moz-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}

.related-posts .related-post-permalink:hover:after ,
.related-posts .related-post-permalink:focus:after {
	opacity: 0.5;
	-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity= 50);
	filter: alpha(opacity= 50);
}

.related-posts section {
    width: 100%;
    margin: 0;
    display: block;
}

.related-posts section .related_post_details {
    padding: 15px;
    background: #fff;
    border-left: solid 1px #ddd;
    border-right: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}


@media screen and (min-width : 0px) and (max-width : 992px)  {

    #logo,
    #logo a,
    #logo a span {
        text-align: center;
        margin-bottom: 25px;
    }

    .head-site-descriptions {
        text-align: center;
    }

    .recent-posts-grid {
        grid-template-columns: 1fr;
    }

    .recent-post.recent-post-large {
        grid-column: span 1;
    }

    .recent-post img {
        height: 200px;
    }

}

@media screen and (min-width: 993px){

	.featured-posts-secondary-column {
		order:3;
		margin:0
    }

	.featured-posts-side-column {
		order:1;
		margin:0 5px 0 0
    }

    .featured-posts-main-column {
        order:2;
    }

}