/*!
Theme Name: Niche Blog
Theme URI: https://fahimm.com/niche-blog/
Author: fahimmurshed
Author URI: http://fahimm.com/
Description: Niche Blog stands out as a contemporary and minimalist WordPress theme meticulously crafted for your company's business blog or a personal journal website. This fast, fully customizable, and aesthetically pleasing theme is not only suitable for blogs but also serves as an ideal choice for creating a personal portfolio website. Designed for utmost user-friendliness, Niche Blog offers a clean and minimalist layout that enables your readers to immerse themselves in your content effortlessly. Tailored with a focus on daily or hobby bloggers, this theme caters to individuals passionate about sharing diverse topics, spanning lifestyle, fashion, travel, entertainment, beauty, or maintaining a straightforward personal blog. Niche Blog is versatile, making it equally adept at accommodating both single and multi-niche blogging. Its highly SEO-optimized code ensures top rankings on Google search results, while the inclusion of Font Awesome 6, RTL support, and exceptional speed further enhance its appeal. Elevate your online presence with Niche Blog's compelling features and a design that strikes the perfect balance between sophistication and functionality.
Version:  0.0.9
Requires at least: 5.1
Requires PHP: 5.6
Tested up to: 6.4.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: niche-blog
Tags: blog, custom-logo, e-commerce, rtl-language-support, post-formats, grid-layout, one-column, two-columns, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready,  wide-blocks, block-styles, footer-widgets, portfolio, left-sidebar, right-sidebar

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.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/

Niche Blog is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Technology is best when it brings people together. For me, open source is a moral thing. While I personally believe strongly in the philosophy and ideology of the Free Software movement, you can't win people over just on philosophy; you have to have a better product, too.
- Matt Mullenweg

*/



/* 
 3.) Header - Main
----------------------------------------*/



/* 
 3.) Header - Main
----------------------------------------*/

.header-main {
	width: 100%;
	height: 92px;
    background: #fff;
	float: left;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
    box-shadow: 0 7px 10px rgba(0, 0, 0, 0.05);
}

.header-main.noshadow {
	width: 100%;
	height: 92px;
	float: left;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
    box-shadow:none;
}

.header-main .logo {
	height: 92px;
	float: left;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	z-index: 10;
	margin: 0 -500px 0 0;
}

.header-main .logo img {
	max-height: 33px;
}

.header-main .main-menu {
	float: right;
}

.header-main .main-menu .nav-bar {
	float: left;
}

.header-main .main-menu .nav-bar .logo {
	display: none; 
	position: absolute; 
	top: 35px; 
	left: 40px;
}

.header-main .main-menu .nav-inn {
	float: left;
}

.header-main .main-menu .nav-bar nav {
	float: left;
}

.header-main .main-menu .nav-bar nav ul {
	float: left;
	padding: 0;
	margin: 0 -15px;
}

.header-main .main-menu .nav-bar nav ul li {
	float: left;
	padding: 0;
	margin: 0 12px;
}

.header-main .main-menu .nav-bar nav ul li:before {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li a {
	height: 92px;
	float: left;
	font-size: 17px;
	color: #333333;
	line-height: 92px;
	text-decoration: none;
	border-bottom: none;
	transition: none;
	position: relative;
    font-family: "aribau_grotesk_trialmedium", sans-serif;
}

.header-main .main-menu .nav-bar nav ul li a:before {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li a:hover,
.header-main .main-menu .nav-bar nav ul li a:focus,
.header-main .main-menu .nav-bar nav ul li.active a {
	color: #1E4557;
}

.header-main .main-menu .nav-bar nav ul li.child:hover .mega-menu {
	display: block;
}

.header-main .main-menu .nav-bar nav ul li.child {
	position: static;
}

.header-main .main-menu .nav-bar nav ul li.child a {
	padding-right: 15px;
}

.header-main .main-menu .nav-bar nav ul li.child a:after {
	content: "\f078";
	font-family: "Font Awesome 5 Pro";
	font-size: 80%;
	line-height: 1em;
	position: absolute;
	top: 50%;
	right: 0;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
	margin-top: 0px;
    margin-left: 2px;
}

.header-main .main-menu .nav-bar nav ul li.child:hover a {
	color: #1E4557;
}

.header-main .main-menu .nav-bar nav ul li.child:hover a:after {
	content: "\f077";
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu {
	width: 100%;
	display: none;
	background: #fff;
	border-top: 1px solid #fff;
	box-shadow: 0 7px 10px rgba(0, 0, 0, 0.15);
	overflow: hidden;
	position: absolute;
	top: 92px;
	left: 0;
	padding: 0 0 40px 0;
    
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .row-box {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
}



.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list {
	width: 66.66%;
	padding: 10px 40px 0 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .sub-heading {
	width: 100%;
	float: none;
	display: inline-block;
	vertical-align: top;
	font-size: 14px;
    font-family: "aribau_grotesk_trial_rgRg", sans-serif;
	color: #b0aeae;
	line-height: 26px;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding-bottom: 10px;
    
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article {
	width: 50%;
	padding: 0 5px 5px 5px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box {
	width: 100%;
	height: 100%;
	float: left;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center; 
	font-weight: inherit; 
	color: inherit; 
	line-height: inherit;
	text-decoration: none; 
	padding: 1px 10px!important; 
	margin: 0!important;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:after { 
	display: none;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .icon {
	width: 44px;
	position: relative;
	z-index: 2;
	margin-right: -44px;
    
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .icon img {
	max-width: 100%;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside {
	width: 100%;
	padding: 0 0 0 60px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside h4,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside .h4 {
	font-size: 17px;
	line-height: 22px;
	padding:10px 0 0 0;
    margin: 0;
    font-family: "Poppins", sans-serif;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside p { 
    color: #555;
    font-family: "aribau_grotesk_trial_rgRg", sans-serif; 
    font-size: 16px;
    margin: 0;
    padding: 2px 0 7px 0}


.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:hover,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:focus,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:active { 
	background: #EEF0F3;
    border-radius: 6px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article-wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 -15px -30px -15px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals {
	width: 33.33%;
	text-align: center;
    padding: 10px 20px;
    border-radius: 6px;
    background: #fff;
    margin-top: 33px;
    box-shadow: 0 7px 10px rgba(0, 0, 0, 0.15);
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside {
	width: 100%;
	float: none;
	display: inline-block;
	vertical-align: top;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside h3,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside .h3 {
	font-size: 17px;
	line-height: 28px;
	padding: 0 0 5px 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside h3:last-child,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside .h3:last-child {
	padding-bottom: 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside p {
	padding-bottom: 10px;
    font-size: 14px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside .icon {
	width: 100%;
	text-align: center;
	overflow: hidden;
	margin: 0 0 11px 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside .icon img {
	max-width: 100%;
    height: 85px
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more { 
	text-align:  center;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a { 
	float: inherit; 
	height: inherit; 
    font-size: 14px; 
	line-height: 19px; 
	text-decoration: underline;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	padding: inherit; 
	margin: inherit;
    color: #0399DB;
    font-family: "poppins", sans-serif;
    font-weight: 600;
    padding-bottom: 5px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:after {
	content: "\f178";
	font-family: "Font Awesome 5 Pro";
	font-weight: 400;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: absolute;
	top: 50%;
	right: 0;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
	margin: -2px 0 -2px 0;
	opacity: 0;
	visibility: hidden;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:hover,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:focus,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:active {
	color: #0399DB;
	text-decoration: underline;
	padding-right: 24px;
	margin-right: -24px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:hover:after,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:focus:after,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .read-more a:active:after {
	opacity: 1;
	visibility: visible;
}


.header-main .main-menu .nav-bar nav ul li.child .sub-link {
	width: 100%;
	float: left;
	display: none;
	cursor: pointer;
	position: relative;
	padding: 12px 70px 12px 40px;
    font-size: 16px;
    font-family: "aribau_grotesk_trial_rgRg", sans-serif;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link:before {
	content: "\f054";
	font-family: "Font Awesome 5 Pro";
	font-size: 16px;
	line-height: 1em;
	text-align: right;
	position: absolute;
	top: 50%;
	right: 40px;
	-ms-transform: translate(-50%, 0);
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link:hover,
.header-main .main-menu .nav-bar nav ul li.child .sub-link.active {
	background: #D2ECFF;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link:hover,
.header-main .main-menu .nav-bar nav ul li.child .sub-link:hover:before,
.header-main .main-menu .nav-bar nav ul li.child .sub-link.active,
.header-main .main-menu .nav-bar nav ul li.child .sub-link.active:before {
	color: #1E4557;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link.active:before {
	content: "\f078";
}

.header-main .main-menu .nav-bar .btn-out {
	width: auto;
	float: left;
	padding: 23px 0 0 30px;
	margin: 0 -10px;
}

.header-main .main-menu .nav-bar .btn-out .btn {
	float: left;
	margin: 0 5px;
    padding: 10px 24px 10px 24px;
    font-size: 18px;
    letter-spacing: 0.01px;
    font-family: "poppins", sans-serif;
}

.header-main .main-menu .nav-bar .menu-close {
	display: none;
	position: absolute;
	top: 25px;
	right: 44px;
}

.header-main .main-menu .nav-bar .menu-close button {
	font-size: 30px;
	color: #333;
	line-height: 1em;
	text-decoration: none;
	cursor: pointer;
	background: none;
	border: none;
	border-radius: 0;
	padding: 0;
	margin: 0;
}

.header-main .menu-btn {
	width: 33px;
	height: 22px;
	float: left;
	display: none;
	cursor: pointer;
	z-index: 5;
	position: absolute;
	top: 32px;
	right: 42px;
}

.header-main .menu-btn .icon-bar {
	width: 100%;
	float: right;
	text-decoration: none;
	position: relative;
}

.header-main .menu-btn .icon-bar span {
	width: 100%;
	height: 3px;
	float: right;
	background: #333;
	position: relative;
	margin: 10px 0 0 0;
}

.header-main .menu-btn .icon-bar span:before {
	content: "";
	width: 100%;
	height: 3px;
	float: left;
	background: #333;
	position: absolute;
	top: -10px;
	right: 0;
}

@media only screen and (min-width: 1200px) {
.header-main .main-menu .nav-bar {
	display: block !important;
}

.header-main .main-menu .nav-bar nav ul li.child:hover .mega-menu {
	display: block !important;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu {
	display: none !important;
}
}

@media only screen and (max-width: 1199px) {
.hidden-body {
	overflow: hidden;
}

.overlay {
	width: 100%;
	height: 100%;
	float: left;
	background: rgba(0, 0, 0, 0.5);
	-webkit-transition: top .15s ease-out;
	-moz-transition: top .15s ease-out;
	transition: top .15s ease-out;
	overflow: hidden;
	visibility: hidden;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9;
}

.overlay.show {
	visibility: visible;
	opacity: 1;
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
}

.header-main .main-menu {
	margin: 0;
}

.header-main .main-menu .nav-bar {
	width: 100%;
	height: 100%;
	float: left;
	display: none;
	background: #ffffff;
	overflow: auto;
	overflow-x: hidden;
	position: fixed;
	right: 0;
	z-index: 10;
	padding: 0;
	margin: 0;
}

.header-main .logo img {
	max-height: 31px;
}
    
.header-main .main-menu .nav-bar .logo { 
	height: auto;
	display: block; 
    top:28px
}
    
.header-main .main-menu .nav-inn {
	width: 100%;
	height: 100%;
	float: left;
	display: flex;
	flex-direction: column;
}

.header-main .main-menu .nav-bar nav {
	width: 100%;
	flex: 1 0 auto;
	padding: 92px 0 40px 0;
}

.header-main .main-menu .nav-bar nav:last-child {
	padding-bottom: 0;
}

.header-main .main-menu .nav-bar nav ul {
	width: 100%;
	margin: 0;
}

.header-main .main-menu .nav-bar nav ul li {
	width: 100%;
	margin: 0;
}

.header-main .main-menu .nav-bar nav ul li a {
	width: 100%;
	height: auto;
	line-height: 28px;
	padding: 12px 40px;
    
}

.header-main .main-menu .nav-bar nav ul li a:hover,
.header-main .main-menu .nav-bar nav ul li a:focus,
.header-main .main-menu .nav-bar nav ul li a.active {
	background: #D2ECFF;
}

.header-main .main-menu .nav-bar nav ul li.child:hover .mega-menu {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li.child {
	position: relative;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu {
	width: 100%;
	display: none;
	background: none;
	border: none;
	box-shadow: none;
	border-radius: 0;
	position: relative;
	top: 0;
	left: 0;
	transform: none;
	padding: 0;
	margin: 0;
    
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu {
	background: #D2ECFF;
	padding: 0 40px 20px 40px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .container {
	max-width: 100%;
	padding: 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .row-box:before {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list {
	width: 100%;
	padding: 0 !important;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .sub-heading {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article {
	width: 100%;
	border-bottom: 1px solid #1E4557;
	padding: 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article:last-child {
	border-bottom: none;
}
	
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box {
	height: inherit;
	padding: 17px 0!important; 
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .icon {
	width: 26px;
	margin-right: -26px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside {
	padding: 0 0 0 40px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside h4,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside .h4 {
	font-size: 17px;
	line-height: 26px;
    
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box .aside p {
	display: none;
}
	
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:hover,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:focus,
.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article .box:active { 
	color: #0399DB;
	background: none;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .icons-list .article-wrap {
	margin: 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals { 
	display: none;
	width: 100%;
	padding: 20px 0 0 0;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu .plan-detals .aside {
	max-width: 360px;
}

.header-main .main-menu .nav-bar nav ul li.child a:after {
	display: none;
}

.header-main .main-menu .nav-bar nav ul li.child ul li a {
	background: none;
	padding: 0;
	margin: 0;
}

.header-main .main-menu .nav-bar nav ul li.child:hover ul li a {
	color: #333;
    
}

.header-main .main-menu .nav-bar nav ul li.child ul li:hover a,
.header-main .main-menu .nav-bar nav ul li.child ul li.active a {
	color: #0399DB;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link {
	display: block;
}

.header-main .main-menu .nav-bar .btn-out {
	width: 100%;
	flex-shrink: 0;
	padding: 0 40px 40px 40px;
	margin: 0;
}

.header-main .main-menu .nav-bar .btn-out .btn {
	width: 100%;
	margin: 0 0 20px 0;
    padding: 15px 20px;
    font-size: 18px;
    
}

.header-main .main-menu .nav-bar .btn-out .btn:last-child {
	margin-bottom: 0;
}

.header-main .main-menu .nav-bar .btn-out .btn:after {
	display: none;
}

.header-main .main-menu .nav-bar .menu-close {
	display: inline-block;
}

.header-main .menu-btn {
	display: inline-block;
}

.header-main .hide-mbl {
	display: none;
}
}

@media only screen and (max-width: 767px) {
.header-main .container {
	max-width: 100%;
}
    
.header-main .logo img {
	max-height: 31px;
}

.header-main .main-menu .nav-bar .logo { 
	left: 20px;
    top:28px
}

.header-main .main-menu .nav-bar nav ul li a {
	padding: 12px 20px;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link {
	padding: 12px 55px 12px 20px;
}

.header-main .main-menu .nav-bar nav ul li.child .sub-link:before {
	right: 20px;
}

.header-main .main-menu .nav-bar nav ul li.child .mega-menu {
	background: #D2ECFF;
	padding: 0 20px 20px 20px;
    
}

.header-main .main-menu .nav-bar .btn-out {
	width: 100%;
	flex-shrink: 0;
	padding: 0 20px 20px 20px;
	margin: 0;
}

.header-main .main-menu .nav-bar .menu-close {
	right: 20px;
}

.header-main .menu-btn {
	right: 20px;
}
}



