/* ------------------------------------------------------------------------------
* Author: web-zone.org
* @package Airin Blog
* Description: Styles for XL Mega menu
* ------------------------------------------------------------------------------ */


/* 
Common
*/

.xlmega-clear,
.airinblog-css-xlmega-block {
	display: none;
}

.airinblog-css-xlmega-area {
    flex-direction: column;
}

.airinblog-css-mega-menu > ul > li > ul.airinblog-css-xlmega-area {
    background: #ffffff;
	padding: 25px;
}

.airinblog-css-xlmega-area h2 {
	font-weight: 400;
	text-transform: none;
}

@media (max-width: 350px) {
	.airinblog-css-mega-menu > ul > li > ul.airinblog-css-xlmega-area {
		padding: 10px;
	}
}

/* 
Common group
*/

.airinblog-css-xlmega-narrow-string-main,
.airinblog-css-xlmega-narrow-small-main,
.airinblog-css-xlmega-image-mid-main,
.airinblog-css-xlmega-button-mid-main {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.airinblog-css-xlmega-narrow-mid-main {
    grid-template-columns: 1fr 1fr 1fr;
}

.airinblog-css-xlmega-narrow-big-main {
    grid-template-columns: 1fr 1fr;
}

.airinblog-css-xlmega-narrow-string-post-box,
.airinblog-css-xlmega-narrow-small-post-box,
.airinblog-css-xlmega-narrow-mid-post-box,
.airinblog-css-xlmega-narrow-big-post-box,
.airinblog-css-xlmega-image-mid-post-box,
.airinblog-css-xlmega-button-mid-post-box,
.airinblog-css-xlmega-cat-image-post-box {
	display: flex;
	flex-direction: column;
}

.airinblog-css-xlmega-narrow-string-main,
.airinblog-css-xlmega-narrow-small-main,
.airinblog-css-xlmega-narrow-mid-main,
.airinblog-css-xlmega-narrow-big-main,
.airinblog-css-xlmega-image-mid-main,
.airinblog-css-xlmega-button-mid-main,
.airinblog-css-xlmega-narrow-string-post-box,
.airinblog-css-xlmega-narrow-small-post-box,
.airinblog-css-xlmega-narrow-mid-post-box,
.airinblog-css-xlmega-narrow-big-post-box,
.airinblog-css-xlmega-image-mid-post-box,
.airinblog-css-xlmega-button-mid-post-box {
	gap: 20px;
}

.airinblog-css-xlmega-cat-image-post-box {
	gap: 15px;
}

.airinblog-css-xlmega-narrow-string-column-h,
.airinblog-css-xlmega-narrow-small-column-h,
.airinblog-css-xlmega-narrow-mid-column-h,
.airinblog-css-xlmega-narrow-big-column-h,
.airinblog-css-xlmega-image-mid-column-h,
.airinblog-css-xlmega-button-mid-column-h,
.airinblog-css-xlmega-cat-image-column-h {
	margin: 0 0 20px;
	line-height: 1;
}

.airinblog-css-xlmega-narrow-string-column-h,
.airinblog-css-xlmega-narrow-small-column-h,
.airinblog-css-xlmega-image-mid-column-h,
.airinblog-css-xlmega-button-mid-column-h,
.airinblog-css-xlmega-cat-image-column-h {
	font-size: 20px;
}

.airinblog-css-xlmega-narrow-mid-column-h,
.airinblog-css-xlmega-narrow-big-column-h {
	font-size: 24px;
}

.airinblog-css-mega-menu .airinblog-css-xlmega-narrow-string-post a,
.airinblog-css-mega-menu .airinblog-css-xlmega-narrow-small-post a,
.airinblog-css-mega-menu .airinblog-css-xlmega-narrow-mid-post a,
.airinblog-css-mega-menu .airinblog-css-xlmega-cat-image-post a {
	display: flex;
	align-items: center;
	padding: 0;
}

.airinblog-css-xlmega-narrow-string-post-h h2,
.airinblog-css-xlmega-narrow-small-post-h h2,
.airinblog-css-xlmega-narrow-mid-post-h h2,
.airinblog-css-xlmega-image-mid-post-h h2,
.airinblog-css-xlmega-button-mid-post-h h2,
.airinblog-css-xlmega-cat-image-post-h h2 {
    margin: 0;
}

.airinblog-css-xlmega-narrow-string-post-h h2,
.airinblog-css-xlmega-narrow-small-post-h h2,
.airinblog-css-xlmega-cat-image-post-h h2 {
	font-size: 14px;
}


/* 
Narrow string blocks
*/

.airinblog-css-xlmega-narrow-string-post {
	background: #808080;
}

.airinblog-css-xlmega-narrow-string-post:hover {
	background: #505050;
}

.airinblog-css-xlmega-narrow-string-post h2,
.airinblog-css-xlmega-narrow-string-post:hover h2 {
	color: #fffffb;
}

.airinblog-css-xlmega-narrow-string-post-h h2 {
    padding: 10px 18px;
}

.airinblog-css-xlmega-narrow-string-post img {
    width: 90px;
}

@media (max-width: 1100px) {
	.airinblog-css-xlmega-narrow-string-post img {
		width: 60px;
	}
    .airinblog-css-xlmega-narrow-string-column-h {
        font-size: 16px;
    }
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-narrow-string-main,
	.airinblog-css-xlmega-narrow-string-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-narrow-string-post a {
        width: 100%;
    }
}


/* 
Narrow small blocks
*/

.airinblog-css-xlmega-narrow-small-post {
	background: #f1f1f1;
}

.airinblog-css-xlmega-narrow-small-post:hover {
	background: #606060;
}

.airinblog-css-xlmega-narrow-small-post h2 {
	color: #404046;
}
.airinblog-css-xlmega-narrow-small-post:hover h2 {
	color: #fffffb;
}

.airinblog-css-xlmega-narrow-small-post-h h2 {
    padding: 5px 10px;
}

.airinblog-css-xlmega-narrow-small-post img {
    max-width: 32%;
}

@media (max-width: 1100px) {
    .airinblog-css-xlmega-narrow-small-column-h {
        font-size: 16px;
    }
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-narrow-small-main,
	.airinblog-css-xlmega-narrow-small-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-narrow-small-post a {
        width: 100%;
    }
}


/* 
Narrow mid blocks 
*/

.airinblog-css-xlmega-narrow-mid-post {
	background: #f1f1f1;
}

.airinblog-css-xlmega-narrow-mid-post:hover {
	background: #606060;
}

.airinblog-css-xlmega-narrow-mid-post h2 {
	color: #404046;
}

.airinblog-css-xlmega-narrow-mid-post:hover h2 {
	color: #fffffb;
}

.airinblog-css-xlmega-narrow-mid-post-h h2 {
    padding: 10px 15px 10px 5px;
	font-size: 16px;
}

.airinblog-css-xlmega-narrow-mid-post img {
	max-width: 30%;
    margin: 15px;
}

@media (max-width: 1100px) {
    .airinblog-css-xlmega-narrow-mid-column-h {
        font-size: 20px;
    }
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-narrow-mid-main,
	.airinblog-css-xlmega-narrow-mid-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-narrow-mid-post a {
        width: 100%;
    }
}

@media (max-width: 400px) {
    .airinblog-css-xlmega-narrow-mid-post-h h2 {
        padding: 5px;
    }
    .airinblog-css-xlmega-narrow-mid-post img {
		margin: 5px;
    }
}


/* 
Narrow big blocks 
*/

.airinblog-css-xlmega-narrow-big-post {
	background: #f1f1f1;
}

.airinblog-css-xlmega-narrow-big-post:hover {
	background: #606060;
}

.airinblog-css-xlmega-narrow-big-post-right {
    text-transform: none;
    margin: 10px 15px 15px 0;
}

.airinblog-css-mega-menu .airinblog-css-xlmega-narrow-big-post a {
	display: flex;
    align-items: flex-start;
	padding: 0;
}

.airinblog-css-xlmega-narrow-big-post p,
.airinblog-css-xlmega-narrow-big-post h2 {
	color: #404040;
}

.airinblog-css-xlmega-narrow-big-post:hover p,
.airinblog-css-xlmega-narrow-big-post:hover h2 {
	color: #fffffb;
}

.airinblog-css-xlmega-narrow-big-post-h h2 {
    margin: 5px 0;
	font-size: 20px;
}

.airinblog-css-xlmega-narrow-big-post p {
	font-size: 14px;
	font-weight: 400;
    margin: 5px 0;
}

.airinblog-css-xlmega-narrow-big-post img {
	max-width: 45%;
    margin: 22px;
}

@media (max-width: 1100px) {
	.airinblog-css-xlmega-narrow-big-post img {
		max-width: 35%;
	}
    .airinblog-css-xlmega-narrow-big-column-h {
        font-size: 20px;
    }
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-narrow-big-main,
	.airinblog-css-xlmega-narrow-big-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-narrow-big-post a {
        width: 100%;
    }
}

@media (max-width: 450px) {
    .airinblog-css-mega-menu .airinblog-css-xlmega-narrow-big-post a {
        flex-direction: column;
        align-items: center;
		text-align: center;
    }
    .airinblog-css-xlmega-narrow-big-post-right {
        margin-left: 15px;
    }
    .airinblog-css-xlmega-narrow-big-post img {
        margin-bottom: 0;
        max-width: 100%;
    }
}

@media (max-width: 350px) {
    .airinblog-css-xlmega-narrow-big-post img {
		margin: 10px;
    }
}


/* 
Image mid blocks
*/

.airinblog-css-xlmega-image-mid-main {
	justify-items: center;
}

.airinblog-css-xlmega-image-mid-post {
	background: #f1f1f1;
}

.airinblog-css-xlmega-image-mid-post:hover {
	background: #606060;
}

.airinblog-css-mega-menu .airinblog-css-xlmega-image-mid-post a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 15px;
	text-align: center;
}

.airinblog-css-xlmega-image-mid-post h2 {
	color: #404046;
}

.airinblog-css-xlmega-image-mid-post:hover h2 {
	color: #fffffb;
}

.airinblog-css-xlmega-image-mid-post-h h2 {
    padding: 10px 10px 0;
	font-size: 15px;
}

@media (max-width: 1100px) {
    .airinblog-css-xlmega-image-mid-column-h {
        font-size: 16px;
    }
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-image-mid-main,
	.airinblog-css-xlmega-image-mid-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-image-mid-post a {
        width: 100%;
    }
	.airinblog-css-xlmega-image-mid-post-h h2 {
		font-size: 16px;
		max-width: 415px;
	}
}

@media (max-width: 860px) and (min-width: 380px) {
	.airinblog-css-xlmega-image-mid-main,
	.airinblog-css-xlmega-image-mid-post-box {
		justify-items: normal;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-image-mid-post a {
		flex-direction: row;
		justify-content: normal;
		text-align: left;
    }
	.airinblog-css-xlmega-image-mid-post img {
		max-width: 30%;
	}
	.airinblog-css-xlmega-image-mid-post-h h2 {
		padding: 0 0 0 15px;
	}
}


/* 
Button mid blocks
*/

.airinblog-css-xlmega-button-mid-main {
	justify-items: center;
	justify-content: space-evenly;
}

.airinblog-css-xlmega-button-mid-post {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-evenly;
	text-align: center;
	background: #f1f1f1;
}

.airinblog-css-xlmega-button-mid-post:hover {
	background: #606060;
}

.airinblog-css-xlmega-button-mid-post a {
	color: #404040;
	border: solid 1px #404040;
	margin: 0 10px 25px;
}

.airinblog-css-mega-menu .airinblog-css-xlmega-button-mid-post a:hover {
	padding: 8px 30px 6px;
}

.airinblog-css-mega-menu .airinblog-css-xlmega-button-mid-post a {
	padding: 8px 20px 6px;
}

.airinblog-css-xlmega-button-mid-post:hover h2,
.airinblog-css-xlmega-button-mid-post:hover a {
	color: #fffffb;
	border-color: #fffffb;
}

.airinblog-css-xlmega-button-mid-post-h h2 {
	color: #404046;
    padding: 15px;
	font-size: 18px;
}

@media (min-width: 1100px) {
	.airinblog-css-xlmega-button-mid-post {
		max-width: 500px;
	}
}

@media (max-width: 1100px) {
    .airinblog-css-xlmega-button-mid-column-h {
        font-size: 16px;
    }
	.airinblog-css-mega-menu .airinblog-css-xlmega-button-mid-post a {
		font-size: 14px
	}
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-button-mid-main,
	.airinblog-css-xlmega-button-mid-post-box {
		grid-template-columns: none!important;
		justify-items: normal;
		justify-content: normal;
	}
}

@media (max-width: 450px) {
	.airinblog-css-mega-menu .airinblog-css-xlmega-button-mid-post a {
        width: 90%;
    }
}


/*
Menu with image
*/

.airinblog-css-xlmega-cat-image-main {
	grid-auto-flow: column;
	justify-content: start;
	gap: 25px;
}

.airinblog-css-xlmega-cat-image-column-box {
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 25px;
}

.airinblog-css-xlmega-cat-image-post h2 {
	color: #1e73bb;
}

.airinblog-css-xlmega-cat-image-post:hover h2 {
	color: #dd9922;
}

.airinblog-css-xlmega-cat-image-post-h h2 {
    padding: 0;
}

.airinblog-css-xlmega-image-in {
	max-width: 400px;
}

.airinblog-css-xlmega-image-in.airinblog-css-xlmega-image-right {
	padding: 10px 10px 10px 15px;
}

@media (max-width: 1100px) {
    .airinblog-css-xlmega-cat-image-column-h {
        font-size: 16px;
    }
	.airinblog-css-xlmega-image-in {
		max-width: 300px;
	}
}

@media (max-width: 960px) {
	.airinblog-css-xlmega-image-in {
		max-width: 200px;
	}
}

@media (max-width: 860px) {
	.airinblog-css-xlmega-cat-image-column-box,
	.airinblog-css-xlmega-cat-image-post-box {
		grid-template-columns: none!important;
	}
    .airinblog-css-mega-menu .airinblog-css-xlmega-cat-image-post a {
        width: 100%;
    }
	.airinblog-css-xlmega-image-in {
		display: none;
	}
}


/* 
Common mobile group
*/

@media (max-width: 350px) {
	.airinblog-css-xlmega-narrow-string-main,
	.airinblog-css-xlmega-narrow-small-main,
	.airinblog-css-xlmega-narrow-mid-main,
	.airinblog-css-xlmega-narrow-big-main,
	.airinblog-css-xlmega-image-mid-main,
	.airinblog-css-xlmega-button-mid-main,
	.airinblog-css-xlmega-narrow-string-post-box,
	.airinblog-css-xlmega-narrow-small-post-box,
	.airinblog-css-xlmega-narrow-mid-post-box,
	.airinblog-css-xlmega-narrow-big-post-box,
	.airinblog-css-xlmega-image-mid-post-box,
	.airinblog-css-xlmega-button-mid-post-box,
	.airinblog-css-xlmega-cat-image-post-box,
	.airinblog-css-xlmega-cat-image-column-box {
		gap: 10px;
	}
	.airinblog-css-xlmega-narrow-string-column-h,
	.airinblog-css-xlmega-narrow-small-column-h,
	.airinblog-css-xlmega-narrow-mid-column-h,
	.airinblog-css-xlmega-narrow-big-column-h,
	.airinblog-css-xlmega-image-mid-column-h,
	.airinblog-css-xlmega-button-mid-column-h,
	.airinblog-css-xlmega-cat-image-column-h {
		margin-bottom: 10px;
	}
	.airinblog-css-xlmega-narrow-string-post-h h2,
	.airinblog-css-xlmega-narrow-small-post-h h2,
	.airinblog-css-xlmega-narrow-mid-post-h h2,
	.airinblog-css-xlmega-narrow-big-post-h h2,
	.airinblog-css-xlmega-image-mid-post h2,
	.airinblog-css-xlmega-button-mid-post-h h2,
	.airinblog-css-xlmega-button-mid-post a,
	.airinblog-css-xlmega-cat-image-post-h h2 {
		font-size: 14px!important;
	}
	.airinblog-css-xlmega-narrow-big-post-p p {
		font-size: 12px!important;
	}
}