/*
Theme Name:     Black Magazine
Theme URI:      https://sparklewpthemes.com/wordpress-themes/black-magazine/
Author:         sparklewpthemes
Author URI:     https://sparklewpthemes.com/
Description:    Black Magazine is a ultra fast clean and best  responsive free WordPress magazine, Black Magazine specially designed for magazine, newspaper, news portals and editorial style websites.  It comes with the flat, minimalist, magazine style homepage Design with post banner slider and latest posts, and different custom widget design layout. Awesome design for categories, tags, archive pages with multiple sidebars and Ads, widgets. the theme has 10+ different drag and drop widget and 10+ widget area that allows adding many section as you want with various beautifully designed layouts suitable for websites. spidermag theme is completely built on customizer which allows you to customize most of the theme settings easily with live previews, spidermag supports many 3rd party plugins, compatible with Jetpack, Contact Form 7, WooCommerce, AccessPress Social Share, AccessPress Social Counter and many more. Official Support Forum : https://www.sparklewpthemes.com/support/ Video : https://www.youtube.com/channel/UCNz4pwcVXsZfVichroSRdKg Full Demo: http://demo.sparklewpthemes.com/spidermag/demos/ and Docs: http://docs.sparklewpthemes.com/spidermag/
Version:        1.0.3
Tested up to:   5.9
Requires PHP:   5.6
License:        GNU General Public License v3 or later
License URI:    http://www.gnu.org/licenses/gpl-3.0.html
Template:       spidermag
Text Domain:    black-magazine
Tags:           one-column, two-columns, right-sidebar, left-sidebar, custom-header, custom-background, custom-menu, translation-ready, featured-images, theme-options, custom-logo, e-commerce, footer-widgets

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Black Magazine is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Black Magazine is distributed under the terms of the GNU GPL v3 or later.
*/
/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.sticky {
    display: none;
}

.search-container input{
    background-color: transparent;
}

.toggle-btn-header {
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    background: #e74c3c;
    padding: 5px 20px 5px 20px;
    line-height: 36px;
    text-align: center;
    font-size: 25px;
    margin: 0;
}
.toggle-btn-header a{
	color: white;
}
.right-side-container {
    display: inherit;
}
.right-side-container a:not(:last-child) {
    border-right: 1px dotted;
}
.navbar-toggle .icon-bar{
	background-color: white;
}

.menu-modal .widget-area{
	width: 100%;
}
.menu-modal .widget-area .bordered{
	padding: 0;
}
.menu-modal .widget-area aside {
    margin: 0;
    border-radius: 0 !important;
}
span.toggle.close-nav-toggle {
    display: block;
    text-align: center;
    color: black;
	cursor: pointer;
    padding: 10px;
}
body.sp-blackmode span.toggle.close-nav-toggle{
	background: #222222;
	color: white;
}
@media (min-width: 991px){
	.site-branding.flex {
		justify-content: start;
	}
}

@media (min-width: 768px){
	.navbar-header {
		float: right;
	}
	.navbar-wrapper {
		justify-content: flex-end;
		display: inline-flex;
		float: right;
	}
	.sm-flex{
		display: flex;
		align-items: center;
	}
}
/** css from html */

/* aside{
	margin: 60px 0px;
} */
img{
	width: 100%;
}
.box-header-nav .main-menu .page_item a, .box-header-nav .main-menu>.menu-item>a{
	border-right: unset;
}
.second > li:first-child a{
	border-left: unset;
}
.toggle-search{
	margin-top: 0px;
}
a.spider-home.spider-home-active.ion-home, a.spider-home.spider-home.ion-home {
    padding: 6px 8px 10px 15px !important;
    margin-right: 5px;
}
.header{
	padding: 0px;
}
.sticky-header{
	background-color: #ddd!important;
}
.flex,.author-part .author{
	display: flex;
	align-items: center;
	justify-content: center;
}
.author-part .author{
	justify-content: left;
}
.navbar-wrapper{
	justify-content: space-between;
	
}
.bold-txt{
	font-weight: 600;
}
.container{
	max-width: 1170px;
}
section{
	margin: 50px 0px;
}
.bg-light {
    background-color: #f8f9fa!important;
}
.small-box,.weather-box{
	margin-bottom: 30px;
}
.small-box img {
    height: 180px;
    object-fit: cover;
    border-radius: 10px!important;
}
.small-box h5{
	margin: 12px 0px 5px;
}
.post-list h5 a, .small-box h5 a{
	color: #fff;
}
.author-part{
	justify-content: space-between;
}
.author-part a{
	color: #8e8e8e;
	font-size: 14px;
	display: block;
}
.author-part .author{
	margin-bottom: 12px;
}
.author-part h5 a,.author-part h4 a,.author-part h3 a{
	font-size: 18px;
	color: #343434;
	margin-bottom: 0px;
}
.post-title h4 a{
	font-size: 22px;
}
.author-part h3 a{
	font-size: 30px;
}

.author-part a span{
	margin-right: 5px;
}
.big-box {
    position: relative;
    margin-bottom: 30px;
}
.big-content-part{
	background-color: #fff;
	padding: 50px 30px 45px;
	width: 85%;
	text-align: center;
	margin: 0 auto;
	/*color: #2a2b2b;*/
	border-radius: 10px!important;
	position: absolute;
	z-index: 0;
	bottom: -20px;
	left: 0;
	right: 0;
}
.big-content-part h4 a,.big-content-part h3 a,.post-list h4 a{
	color: #2b2b2b;
}
.big-box img{
	height: 540px;
	object-fit: cover;
	border-radius: 10px!important;
}
.post-title .cat-links{
	display: inline-block;
	line-height: 0;
}
.post-title .cat-links a{
	background-color: unset;
	margin: 0px;
	padding: 0;
	line-height: 1;
	font-size: 16px !important;
    color: #333;
}
.big-content-part .author-part{
	width: 55%;
	margin: 14px auto;
}
.cat-links a:not(:first-child){
	display: none;
}
.bg-color-txt{
	color: #fff;
	/*padding: 6px 24px;*/
	border-radius: 5px!important;
	margin-bottom: 10px;
	display: inline-block;
}
.big-content-part p{
	color: #b4b4b4;
}
.cat-links a, .widget_spidermag_second_block .cat-links a{
	border-radius: 5px!important;
	width: auto;
}
.small-bg-title {
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translate(-50%, 0px);
    margin: 0 auto;
    text-align: center;
}
.weather-box{
	height: 300px;
	width: 100%;
}
.weather-box img{
	height: 100%;
}
.post-list{
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
}
.post-list:last-child{
	border-bottom: none;
}
.post-title{
	font-size: 13px;
	font-weight: 600;
	color: #6610f2;
	margin-top: 10px;
	display: flex;
	align-items: center;
}
.post-title .cat-links a:before{
	content: "";
	height: 6px;
	width: 40px;
	background-color: #333;
	display: inline-block;
	margin-right: 8px;
}
.trending-bg{
	height: 150px;
    width: 150px;
    border-radius: 50%;
    background-color: #e91e63;
    color: #fff;
    margin: 20px 10px;
    text-align: center;
}
.post-list h5{
	margin: 0px 0px 20px;
}
.post-list-bg{
	background-color: #ddd;
	padding: 10px 0px;
}
.post-carousel .post-list h5{
	margin: 12px 0px 5px;
}
.post-carousel{
	position: relative;
}
.post-carousel button.owl-prev,.post-carousel button.owl-next{
	height: 50px;
	width: 50px;
	border-radius: 50%;
}
.post-carousel button.owl-prev span,.post-carousel button.owl-next span{
	font-size: 40px;
	line-height: 40px;
	color: #fff;
}
.post-carousel button.owl-prev{
	background-color: rgba(106, 125, 255, 0.5)!important;
	position: absolute;
	top: 10px;
	right: -40px;
}
.post-carousel button.owl-next{
	background-color:  #6a7dff!important;
	position: absolute;
	top: 70px;
	right: -40px;
}

/*stories section*/
.stories-part.big-box:before {
    content: "";
    background-color: rgba(0,0,0,0.4);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.section-title {
    position: relative;
    margin-bottom: 15px;
    z-index: 1;
}
.section-title h3 {
    background-color: #fff;
    display: inline-block;
    padding-right: 10px;
    font-size: 25px;
	color: #222;
}
.section-title h3:before {
    content: "";
    height: 20px;
    width: 20px;
    background-color: #333;
    border-radius: 50%;
    margin-right: 15px;
    display: inline-block;
}
.section-title h3:after {
    content: "";
    height: 6px;
    width: 95%;
    background-color: #333;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0px, -50%);
    z-index: -1;
}
.stories-part .big-content-part{
	background-color: unset;
	color: #fff;
	text-align: left;
	bottom: 0;
}
.stories-part .big-content-part .author-part{
	width: 75%;
	margin: 0;
}
.stories-part.big-box img {
    height: 343px;
    border-right: 4px solid #4e65ff;
    border-bottom: 4px solid #4e65ff;
}
.img-txt-list{
	margin: 30px 0px;
	justify-content: left;
}
.img-txt-list .img-part img {
    width: 170px;
    height: 150px;
    margin-right: 15px;
    object-fit: cover;
}
.img-txt-list .author-part{
	width: 100%;
}
.img-tag {
    position: relative;
}
.img-tag img{
	height: 250px;
}
.img-tag .bg-color-txt{
	position: absolute;
	top: 12px;
	left: 30px;
	/*padding: 3px 20px;*/
	border-radius: 0px 0px 5px 5px !important;
}
.small-box.txt-part{
	margin-bottom: 0px;
}
.post-box-wrapper {
    border: 5px solid #289ccb;
    padding: 30px 20px 15px;
    border-radius: 15px!important;
    position: relative;
    z-index: 1;
    margin-top: 10px;
}
.post-list h5{
	margin-bottom: 10px;
}
.post-list a{
    /* margin: 0px 0px 20px; */
}
.post-box-wrapper:before, .post-box-wrapper:after {
    content: "";
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background-color: #289bca;
}
.post-box-wrapper:before {
    position: absolute;
    left: 14%;
    top: 0%;
    transform: translate(0px, -60%);
    z-index: 2;
}
.post-box-wrapper:after {
    position: absolute;
    right: 14%;
    top: 0%;
    transform: translate(0px, -60%);
    z-index: 2;
}
.post-box-wrapper .section-title{
	background-color: #161616;
	position: absolute;
	top: -25px;
	left: 15%;
	right: 15%;
}
.post-box-wrapper .section-title h4{
	margin: 10px auto;
	text-align: center;
}
.right-sec .bordered{
	border:none;
}

/*popular-post*/
.popular-post .author-part {
    width: 80%;
	justify-content: unset;
}
.social-links {
    background-color: #ddd;
    padding: 5px 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
}
.link-bg{
	height: 36px;
	width: 36px;
	background-color: #333;
	color: #fff;
	border-radius: 50%;
}
.likes-wrapper{
    display: flex;
    flex-direction: column;
    margin-left: 10px;
}
.normal-padding .col-md-6{
	padding: 10px;
}
.letter-section {
    background: #4e65ff;
    padding: 30px 25px;
    text-align: center;
    color: #fff;
    margin-top: 25px;
    border-radius: 10px;
}
.letter-section h3{
	font-size: 30px;
	font-weight: 700;
}
.letter-section .white-bg{
	background-color: #fff;
	color: #e91e63;
}
.letter-section a {
    background-color: #6a7dff;
    padding: 10px 20px;
    display: block;
    color: #d3d3d3;
    font-weight: 600;
    margin: 15px 0px;
}

/*videos playlist*/
.black-bg{
	background-color: #161b2a;
	padding: 50px 0px;
	color: #fff;
}
.title-wrapper{
	justify-content: space-between;
	width: 50%;
}
.main-video img{
	height: 400px;
	object-fit: cover;
}
.video-content h3 a,.black-bg h5 a,.stories-part h4 a{
	color: #fff;
}
.img-cont-post img{
	height: 180px;
	object-fit: cover;
}
.img-cont-post h5{
	margin-top: 18px;
}
.row.flex,.week-img-wrapper{
	margin-bottom: 30px;
}
.video-content h3{
	margin-top: 10px;
}

/*read-post*/
.read-post-wrapper{
	justify-content: space-between;
    margin-bottom: 30px;
    background: #f2f2f2;
    padding: 10px;
    border-radius: 4px !important;
}
.big-content-part.read-content{
	margin: 0px;
	text-align: left;
	width: 60%;
	background-color: unset;
	padding-left: 80px;
}
.read-content .bg-color-txt{
	margin-bottom: 20px;
}
.read-content .author-part {
    width: 60%;
    margin: 20px 0px;
}
.read-post-img img{
	height: 380px;
	width: 400px;
	object-fit: cover;
	border-radius: 0px 10px 10px 0px;
}
.img-cont-post .post-list a,.week-cont-part .author-part.flex a {
	margin-bottom: 10px;
}
.img-cont-post 

/*weeek post*/
.week-cont-part.post-list {
    margin: 0px 30px 0px;
}
.week-img-part img {
    /* height: 240px; */
    object-fit: cover;
    width: 310px;
}
.week-cont-part .author-part.flex {
    width: 80%;
}
.round-img img{
	height: 90px;
	width: 90px;
	border-radius: 50%!important;
}
.round-img-wrapper .post-list{
	width: 110%;
}
.round-img-wrapper.flex {
    margin-bottom: 5px;
}
.read-post-wrapper .big-content-part{
position: unset;
}
.icons-txt .post-list a{
	margin-bottom: 0px;
}
.col-sm-16.col-md-5.right-sec .col-sm-16 {
    padding: 0;
}
.week-img-part.round-img{
	width: 50%;
}
/* Widget Blogs1 */
.pl-0 {
    padding-left: 0;
}

/*---category-- */
.no-bg-color .cat-links a {
    background-color: transparent;
}
.post-list h5 {
    margin: 10px 0px 20px;
}
.post-box-wrapper .section-title h4 {
    margin: 10px auto;
    text-align: center;
    font-size: 23px;
    font-weight: bold;
}
.post-title .cat-links a:hover{
	color: inherit !important;
}

.post-box-wrapper {
	border: 3px solid #cccacb;
}
.post-box-wrapper .section-title{
	background-color: #212121;
	margin: 0 3px;
}
.post-box-wrapper::before, .post-box-wrapper::after{
	background-color: #cccacb;
}
.widget_spidermag_second_block {
    padding: 15px 12px;
}
.widget-area aside {
    margin-bottom: 15px;
    padding: 0px 10px;
	border-radius: 4px !important;
}
.widget-area aside {
    margin: 20px 0px;
}
.widget_bloack_mag_blog_widget4 .big-content-part.read-content{
	padding-left: 0;
}
.widget-area aside {
    padding: 10px 10px;
}
.single .type-post .sub-info-bordered a{
	text-decoration: none;
}
.cat .cat-links a, 
.sub-info-bordered1 .cat-links a, 
.sec-info .cat-links a, 
.widget_spidermag_second_block .cat-links a, 
.category, 
.widget_spidermag_first_block .cat-links a{
	padding: 0 10px;
}
.no-bg-color .cat .cat-links a, 
.no-bg-color .sub-info-bordered1 .cat-links a, 
.no-bg-color .sec-info .cat-links a, 
.widget_spidermag_second_block .no-bg-color .cat-links a, 
.category, 
.widget_spidermag_first_block.no-bg-color  .cat-links a{
	padding: 0;
}

.big-content-part.read-content .author-part {
    justify-content: unset;
}

/* ----whitemagazine---- */

.sticky-header {
    background-color: #161616 !important;
    box-shadow: 0px 0px 10px;
}
.post-list h5 {
    margin: 10px 20px 10px 0;
}
.post-list h5 a, .small-box h5 a {
    color: #333 !important;
}
.cat-links a:hover, .cat-links a:focus, .widget_spidermag_second_block .cat-links a:hover {
    color: #fff !important;
}
.widget_spidermag_slider_block .right-img-top .box {
    background-size: cover;
}
.spmag-hidden h4 a {
    color: #343434 !important;
}
.post-box-wrapper .section-title {
    background-color: #fff;
}
.post-box-wrapper .section-title h4 {
    margin: 10px 20px;
    color: #333 !important;
    font-size: 20px;
    font-weight: bold;
}
div.sp-location-weather-widget {
    background-color: #333;
    border-radius: 4px !important;
}
div.sp-location-weather-widget .weather-temp {
    color: #f6f7fd;
}

.widget-area .authorleft .author{
	display: block;
}

/* --color-switcher--- */
.color-switcher{
	position: fixed;
	right: -48px;
	top: 50%;
	transform: translateY(-50%) rotate(90deg);
	z-index: 999;
}
.color-switcher ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
}
.color-switcher ul li a {
    position: relative;
    font-size: 20px;
    color: #e74c3c;
    font-weight: 600;
    text-transform: uppercase;
    border: 2px solid #e74c3c;
    padding: 5px 13px;
    display: flex;
    align-items: center;
}
.color-switcher ul li a.active {
    color: #ffffff;
    background-color: #e74c3c;
    border-color: #e74c3c;
}
.color-switcher .light-mode a {
    border-radius: 30px 0 0 30px !important;
}
.color-switcher .dark-mode a {
    border-radius: 0 30px 30px 0 !important;
}
.type-post a.read-more,
.sub-info-bordered a,
.sec-info h3 a{
	text-decoration: none;
}
.toggle-search{
	background-color: transparent !important;
	border: none !important;
}
.toggle-btn-header{
	margin: 0 0 0 10px;
}
@media (max-width:1024px){
.title-wrapper {
    width: 75%;
}
.big-content-part.read-content {
    width: 100%;
    padding-left: 20px;
}
.read-post-img img {
    height: 410px;
    width: 350px;
}
}
@media (max-width:767px){
	.read-post-wrapper.flex,.week-img-wrapper.flex,.img-txt-list.flex{
		display: block;
	}
	.read-post-img img {
	height: 300px;
    width: 100%;
    border-radius: unset;
	}
	.week-cont-part.post-list{
		margin: 0px;
	}
	.big-box img {
    height: 400px;
	
	}
	.small-box.txt-part{
		margin-top: 15px;
	}
	.week-cont-part h4{
		margin-top: 7px;
	}
	.big-content-part{
		padding: 40px 10px;
	}
	.stories-part .big-content-part{
		padding: 0px 0px 45px;
	}
	.img-txt-list .img-part img{
		width: 100%;
		height: 280px;
		}
	.popular-post .author-part,.stories-part .big-content-part .author-part,.big-content-part .author-part {
    width: 100%;
	}
	.stories-part.big-box{
		display: inline-block;
		margin-bottom: 30px;
	}
	.trending-bg.flex{
		margin: 0 auto;
	}
	aside#black_magazine_sidebar_widget-2 {
    margin: 0;
	}

	.site-branding.flex{
		justify-content: center;
	}
	.navbar-wrapper {
		justify-content: end;
		padding: 0 12px;
	}
	.spider-home.spider-home-active.ion-home {
		display: none;
	}
	.color-switcher {
		right: -35px;
	}
	.color-switcher ul li a {
		font-size: 14px;
	}
}