@charset "UTF-8";
/*
 *
Theme Name: Newsvox -  Multi Purpose Blog Html5 Template.
Author: codezionsoftwares
Author URL: https://www.templatemonster.com/vendors/Codezion
Version: 1.0.0
 *
 */
 
 /*--------------------------------------------------
 	[Table of CSS]
	
	1. General css
	2. Space margins and padding
	3. Buttons and Heading
	4. Header css
	5. Navigation css
	6. Article
	7. Pagination
	8. Sidebar
	9. Footer
	10. Single-post
		10.1 comment-list
		10.2 Comment-form
	11. Pricing Page
	12. Blog
	13. Blog-Detail
	14. Cooming-soon
---------------------------------------------------------*/

/**********************
	1. General css
*********************************/

html {
	-webkit-font-smoothing: antialiased;
}
*::-moz-selection {
 background: #fee198 none repeat scroll 0 0;
 color: #000;
}
::-moz-selection {
 background: #fee198;
 color:#000;
 text-shadow: none;
}
::selection {
 background:#fee198;
 color:#000;
 text-shadow: none;
}
body, html {
	height: 100%;
}
body {
	background:#fff;
	color:#565859;
	font-family: 'Istok Web', sans-serif;
	font-size: 15px;
	font-style: normal;
}
a {
	text-decoration: none;
	color:#f00;
	transition:  all 0.3s ease-in-out;
	-webkit-transition:  all 0.3s ease-in-out;
	-moz-transition:  all 0.3s ease-in-out;
	-o-transition:  all 0.3s ease-in-out;
}
a:hover, a:focus {
	text-decoration: none;
	color:#f00;
	outline: 0;
}
strong, b {
	font-weight: 700;
}
h1, h2, h3, h4, h5, h6 {
	color: #191919;
	font-weight: 300;
	margin-bottom: 20px;
	font-family: 'Josefin Sans', sans-serif;
	margin-top: 0;
	text-transform:uppercase;
}
h1 {
	font-size: 46px;
	line-height: 40px;
	margin: 0 0 5px;
}
h2 {
	font-size: 42px;
	font-weight: 300;
	line-height: 54px;
	margin: 0 0 20px;
}
h3 {
	font-size: 28px;
	line-height: 40px;
}
h4 {
	font-size: 20px;
	line-height: 34px;
}
h5 {
	font-size: 18px;
	line-height: 26px;
}
h6 {
	font-size: 16px;
	line-height: 22px;
}
p {
	font-size: 14px;
	font-weight: 400;
	line-height: 28px;
	margin: 0 0 20px;
}
img {
	max-width:100%;
}
em {
	font-style: italic;
	font-weight: 300;
}
.dropcaps {
	color: #fee198;
	display: inline-block;
	float: left;
	font-size: 40px;
	font-weight: 700;
	height: 40px;
	line-height: 45px;
	margin: 5px 8px 0 0;
	position: relative;
	text-align: center;
	width: 40px;
}
blockquote {
	background:#f6f6f6;
	border-left: 5px solid #fee198;
	font-size: 17.5px;
	margin: 30px 0;
	padding: 20px;
}
blockquote.pull-right {
	border-right: 5px solid #fee198;
}
.divider {
	border-bottom:#333 solid 1px;
	float: left;
	height: 0px;
	margin: 20px 0;
	width: 100%;
}
.divider.dashed {
	border-bottom:#333 dashed 1px;
}
.divider.dotted {
	border-bottom:#333 dotted 1px;
}
.divider.double {
	border-bottom:#333 double 4px;
}
.alignleft {
	float: left;
	margin: 10px 20px 20px 0;
}
.alignright {
	float: right;
	margin: 10px 0 20px 20px;
}
.grid-demo {
	background: #d6d5d8 none repeat scroll 0 0;
	color: #333;
	cursor: pointer;
	font-weight: 700;
	margin-bottom: 30px;
	padding: 20px 0;
	text-align: center;
}
.grid-demo:hover {
	background: #c1c1c1 none repeat scroll 0 0;
}
.panel-heading a {
	color:#fff;
	line-height:22px;
	display:block;
	padding: 10px;
}
.panel-default > .panel-heading {
	background-color: #171a1b;
	border-color: #171a1b;
	color: #fff;
}
.panel-title a .fa-plus-square {
	display: none;
}
.panel-title a .fa-minus-square {
	display: block;
}
.panel-title a.collapsed .fa-plus-square {
	display: block;
}
.panel-title a.collapsed .fa-minus-square {
	display: none;
}
.panel-title a .fa {
	float: right;
	font-size: 18px;
	line-height:24px;
}
.panel-group .panel {
	margin-bottom: 20px;
}
 @media (max-width:768px) {
 	.container{width: 720px;}
 }
 @media (max-width:767px) {
h2 {
 font-size: 30px;
 line-height: 40px;
}
h3 {
 font-size: 24px;
 line-height: 34px;
}
}
 @media (max-width:576px) {
 	.container{width: 100%;
       padding-left: 20px;
       padding-right: 20px;
       margin-left: auto;
       margin-right: auto;
 	}
 }
/************************************
	2. Space margins and padding
**************************************/

.padding_none {
	padding:0px;
}
.padding {
	padding:20px 0;
}
.padding_4x4_30 {
	padding:30px;
}
.padding_4x4_40 {
	padding:40px;
}
.space-20 {
	width:100%;
	height: 20px;
}
.space-30 {
	width:100%;
	height: 30px;
}
.space-40 {
	width:100%;
	height: 40px;
}
.space-60 {
	width:100%;
	height: 60px;
}
.space-80 {
	height: 80px;
	width:100%;
}
.margin-btm-20 {
	margin-bottom: 20px;
}
.margin-none {
	margin:0px;
}
/************************************
	3. Buttons and Heading
**************************************/

.btn {
	background: #000 none repeat scroll 0 0;
	border:0px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 23px;
	margin: 0;
	padding: 5px 28px;
	text-align: center;
	position:relative;
	text-transform: uppercase;
	position: relative;
	transition-delay: 0s, 0s;
	-moz-transition-delay: 0s, 0s;
	-o-transition-delay: 0s, 0s;
	-webkit-transition-delay: 0s, 0s;
	-ms-transition-delay: 0s, 0s;
	transition-duration: 0.3s, 0.3s;
	-moz-transition-duration: 0.3s, 0.3s;
	-o-transition-duration: 0.3s, 0.3s;
	-webkit-transition-duration: 0.3s, 0.3s;
	-ms-transition-duration: 0.3s, 0.3s;
	transition-property: border-color, color;
	-moz-transition-property: border-color, color;
	-o-transition-property: border-color, color;
	-webkit-transition-property: border-color, color;
	-ms-transition-property: border-color, color;
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-o-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	-ms-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	z-index: 1;
	vertical-align: middle;
	overflow:hidden;
}
.btn:hover {
	color: #fff;
}
.btn::before {
 border-radius: 0;
 content: "";
 height: 30px;
 margin: -15px 0 0 1px;
 position: absolute;
 right: 100%;
 top: 50%;
 transform: scale3d(1, 2, 1);
 -moz-transform: scale3d(1, 2, 1);
 -o-transform: scale3d(1, 2, 1);
 -webkit-transform: scale3d(1, 2, 1);
 -ms-transform: scale3d(1, 2, 1);
 transition-delay: 0s, 0s;
 -moz-transition-delay: 0s, 0s;
 -o-transition-delay: 0s, 0s;
 -webkit-transition-delay: 0s, 0s;
 -ms-transition-delay: 0s, 0s;
 transition-duration: 0.35s, 0.4s;
 -moz-transition-duration: 0.35s, 0.4s;
 -o-transition-duration: 0.35s, 0.4s;
 -webkit-transition-duration: 0.35s, 0.4s;
 -ms-transition-duration: 0.35s, 0.4s;
 transition-property: transform, opacity;
 -moz-transition-property: transform, opacity;
 -o-transition-property: transform, opacity;
 -webkit-transition-property: transform, opacity;
 -ms-transition-property: transform, opacity;
 transition-timing-function: cubic-bezier(0.7, 0, 0.9, 1);
 -moz-transition-timing-function: cubic-bezier(0.7, 0, 0.9, 1);
 -o-transition-timing-function: cubic-bezier(0.7, 0, 0.9, 1);
 -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.9, 1);
 -ms-transition-timing-function: cubic-bezier(0.7, 0, 0.9, 1);
 width: 100%;
 z-index: -1;
 background:#f00;
}
.btn:hover::before {
 transform: scale3d(11, 9, 1);
}
.active_btn {
	background:#000;
	color:#fff;
}
.active_btn:hover {
	background:#f00;
}
.btn-lg {
	padding: 14px 50px;
}
.btn-lg:hover {
	background:#f4c85e;
}
.white-btn {
	background: #fff none repeat scroll 0 0;
	color: #191919;
}
.black-btn {
	background: #171a1b none repeat scroll 0 0;
	color: #fff;
}
.radius-none {
	border-radius:0px;
}
section {
	padding: 50px 0;
	position: relative;
}
.page_heading {
	text-align:center;
	padding:60px 0;
}
.page_heading p {
	margin:0px;
}
.white_bg {
	background:#fff;
}
/************************************
	4. Header css
**************************************/
.topbar {
	background: #000;
}
.topbar .leftside ul>li>a {
	margin: 10px 10px 10px 0px;
	line-height: 33px;
	border: 2px solid #fff;
	width: 36px;
	height: 36px;
	text-align: center;
	display: block;
	border-radius: 50%;
}
}
ul.custom-flex {
	list-style: none;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
.topbar-button {
	border: 2px solid #fff;
	padding: 10px 20px;
	float: right;
	margin-top: 8px;
	margin-bottom: 8px;
}
.topbar-button a {
	color: #fff;
}
.topbar-button:hover {
	background: #f00;
	border-color: #f00;
transition: .5s;
}
.topbar .leftside li {
	list-style: none;
	display: inline-block;
}
.topbar .leftside ul>li:hover>a {
	background-color: #f00;
	border-color: #f00;
	color: #fff;
}
.topbar .leftside ul {
	padding: 0px;
}
dl, ol, ul {
	margin-top: 0;
	padding: 0px;
	margin-bottom: 0;
}
.header li {
	margin: 0px;
	position: relative;
}
ul.custom {
	list-style: none;
	padding: 0;
}
ul.custom-flex {
	list-style: none;
	display: flex;
}
/*Navigation*/
.header .navigation.sticky {
	animation-name: fadeHeaderInDown;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 22;
	background: #fff;
	animation-duration: 1s;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	animation-fill-mode: both;
}
.navigation .main-navigation {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.navigation .main-navigation .logo {
	margin: 20px 0;
	width: 156px;
	height: 30px;
}
.navigation .main-navigation .main-menu .logo {
	display: none;
}
.navigation .main-navigation .hamburger-menu {
	display: none;
	align-items: center;
	cursor: pointer;
}
.navigation .main-navigation .hamburger-menu .menu-btn span {
	background: #000;
	height: 2px;
	width: 25px;
	margin-bottom: 5px;
	display: block;
	transition: 0.3s;
}
.navigation .main-navigation .hamburger-menu .menu-btn span:last-child {
	margin-bottom: 0;
}
.navigation .main-navigation .hamburger-menu .menu-btn.active {
	position: relative;
	top: -4px;
	transition: 0.3s;
}
.navigation .main-navigation .hamburger-menu .menu-btn.active span:first-child {
	transform: rotate(45deg);
	transition: 0.3s;
	position: relative;
	top: 7.4px;
}
.navigation .main-navigation .hamburger-menu .menu-btn.active span:nth-child(2) {
 display: none;
}
.navigation .main-navigation .hamburger-menu .menu-btn.active span:last-child {
	transform: rotate(-45deg);
	transition: 0.3s;
}
.navigation .main-navigation .main-menu .cta-btn, .navigation .main-navigation .main-menu {
	display: flex;
	align-items: center;
}
.navigation .main-navigation .main-menu .cta-btn {
	margin-left: 15px;
}
.navigation .main-navigation .main-menu>nav>ul>.menu-item.active>a {
	color: #000;
	font-weight: 500;
}
.navigation .main-navigation .main-menu>nav>ul>.menu-item {
	padding: 22px 0;
}
.navigation .main-navigation .main-menu>nav>ul>.menu-item>a {
	color: #000;
	text-transform: uppercase;
	padding: 0px 15px;
	position: relative;
}
.menu-item-has-children>a>.arrow:after, .menu-item-has-megamenu>a>.arrow:after {
	display: inline-block;
	margin-left: .55em;
	content: "\f107";
	font-family: fontawesome;
	font-weight: 900;
}
.menu-item-has-children .sub-menu {
	position: absolute;
	top: 100%;
	left: 50px;
	right: 0;
	width: 170px;
	opacity: 0;
	visibility: hidden;
	background: #000;
	transition: 0.3s all;
	z-index: 2;
}
.menu-item-has-children:hover>.sub-menu {
	opacity: 1;
	visibility: visible;
	left: 0;
}
.menu-item-has-megamenu .megamenu .megamenu-nav ul>.menu-item>a, .menu-item-has-children .sub-menu>.menu-item>a {
	display: block;
	border-top: 1px solid #000;
	white-space: nowrap;
	padding: 12px 20px 12px 18px;
	position: relative;
}
.menu-item-has-megamenu .megamenu .megamenu-nav ul>.menu-item>a, .menu-item-has-children .sub-menu>.menu-item.active>a, .menu-item-has-children .sub-menu>.menu-item:hover>a {
	background: #000;
	color: #f00;
}
.menu-item-has-children .sub-menu .menu-item-has-children>a>.arrow:after {
	position: absolute;
	right: 15px;
	transform: rotate(-90deg);
	top: 15px;
}
.menu-item-has-children .sub-menu .menu-item-has-children>.sub-menu {
	left: 100%;
	top: 0;
}
/*megamenu*/
.menu-item-has-megamenu {
	position: static;
}
.menu-item-has-megamenu .megamenu {
	position: absolute;
	top: 100%;
	left: 50px;
	right: 0;
	width: 97.4%;
	opacity: 0;
	visibility: hidden;
	background: #01b7f2;
	transition: 0.3s all;
	padding-bottom: 10px;
}
.menu-item-has-megamenu:hover>.megamenu {
	opacity: 1;
	left: 15px;
	visibility: visible;
}
.menu-item-has-megamenu .megamenu .megamenu-nav ul>.menu-item {
	margin-bottom: 10px;
}
@media (max-width: 992px) {
 .section-header.style-right {
 text-align: left;
}
 .section-header.style-right .section-heading h3:after {
 margin: 20px 0 0 0;
}
	/*navigation*/
	
	.navigation .main-navigation .main-menu .logo {
 display: block;
 margin: 20px 10px;
}
 .navigation .main-navigation .hamburger-menu {
 display: flex;
}
 .navigation .main-navigation .main-menu .cta-btn {
 margin: 0 10px;
}
 .navigation .main-navigation .main-menu .cta-btn>a {
 width: 100%;
}
 .navigation .main-navigation .main-menu {
 display: block;
 position: fixed;
 left: -320px;
 width: 320px;
 height: 100vh;
 top: 0;
 background: #000;
 transition: 0.5s all;
 overflow: auto;
 z-index: 100;
}
 .navigation .main-navigation .main-menu.active {
 left: 0;
}
 .navigation .main-navigation .main-menu>nav>ul {
 display: block;
}
 .navigation .main-navigation .main-menu>nav>ul>.menu-item {
 padding: 0;
 margin: 10px;
}
 .navigation .main-navigation .main-menu>nav>ul>.menu-item>a {
 padding: 10px 15px;
 display: block;
 background: #fff;
}
 .menu-item-has-children>a>.arrow:after,  .menu-item-has-megamenu>a>.arrow:after {
 position: absolute;
 right: 15px;
}
 .menu-item-has-children .sub-menu .menu-item-has-children>a>.arrow:after {
 transform: rotate(0deg);
}
 .menu-item-has-children .sub-menu .menu-item-has-children>.sub-menu,  .menu-item-has-megamenu:hover>.megamenu,  .menu-item-has-megamenu .megamenu,  .menu-item-has-children .sub-menu {
 opacity: 1;
 visibility: visible;
 left: 0;
 width: 100%;
 position: relative;
 display: none;
 padding: 0;
}
 .menu-item-has-children .sub-menu>.menu-item.open>a,  .menu-item-has-megamenu.open>a {
 background: #fff;
 color: #01b7f2;
 font-weight: 500;
}
 .menu-item-has-children .sub-menu>.menu-item>a {
 color: #fff;
}
}
@media (max-width: 768px) {
.topbar .leftside ul.custom-flex {
display: block;
text-align: center;
}
.topbar-button {
margin-right: 42%;
}
}
@media (max-width: 576px) {
	/*Navigation*/
		.navigation .main-navigation .main-menu {
 left: -260px;
 width: 260px;
}
 .topbar-button {
margin-right: 33%;
}
}
/**********************
	6. Article
*********************************/
.slider-post-item img {
	width: 100%;
	height: 700px;
	object-fit: cover;
	object-position: center;
}
.articles_psot_wrap {
	background:#fff;
}
.standard-post-format {
	background: #fff none repeat scroll 0 0;
	border-bottom: 1px solid #e5e5e5;
	margin: 0 0 50px;
	padding-bottom: 0;
}
.post_title a {
	color:#171a1b;
}
.post_title a:hover {
	text-decoration:underline;
}
.post_featured_image {
	overflow: hidden;
	width: 100%;
}
.link-post-format {
	background-color: #fee198;
	color: #171a1b;
	font-family: "Josefin Sans", sans-serif;
	margin: 0;
	text-align:center;
	padding: 80px;
	position: relative;
}
.link-post-format a {
	color: #171a1b;
	font-size:30px;
	word-wrap: break-word;
}
.post_meta_elements {
	background: #000 none repeat scroll 0 0;
	margin: 0 0 20px;
	overflow: hidden;
	padding: 20px;
}
.post_meta_elements span {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	line-height: inherit;
	margin: 0 20px 0 0;
	color:#fff;
	text-transform: uppercase;
	vertical-align:middle;
}
.post_meta_elements .post_counters_comments {
	display: block;
	float: right;
	font-size: 12px;
	line-height: 20px;
	max-width: 100px;
	text-align: center;
	text-transform: uppercase;
	white-space: nowrap;
}
.post_meta_elements .post_counters_number {
	font-size: 30px;
	margin:0 8px 0 0;
}
.post_categories a {
	border: 2px solid #fff;
	color: #fff;
	padding: 4px 14px;
}
.post_categories a:hover {
	background:#f00;
	border-color: #f00;
}
.post_content.entry-content {
	overflow: hidden;
	position: relative;
}
.post_content.entry-content::after {
 background: #fee198 none repeat scroll 0 0;
 content: "";
 height: 180%;
 left: 0;
 opacity: 0.08;
 position: absolute;
 top: 0;
 transform: rotate(-23deg);
 width: 130%;
 z-index: 0;
}
 @media (max-width:767px) {
.post_meta_elements .post_counters_comments {
 display:none;
}
.post_meta_elements span {
 margin: 0 3px 0px 0;
 font-size: 10px;
}
.post_meta_elements {
 padding: 14px 10px;
}
.link-post-format a {
 font-size: 20px;
 word-wrap: break-word;
}
}
 @media (min-width:768px) and (max-width:990px) {
 .post_meta_elements span {
 margin: 0 5px 0 0;
}
}
 @media (min-width:991px) and (max-width:1200px) {
 .post_meta_elements span {
 margin: 0 5px 0 0;
}
.home_style2 article.standard-post-format {
 margin: 0 auto;
 max-width: 760px;
}
}
/**********************
	7. Pagination
*********************************/

.navigation.pagination {
	display:block;
	width:100%;
	text-align:center;
}
.pagination .page-numbers {
	display:inline-block;
	vertical-align:middle;
	font-size:12px;
	padding:0 18px;
	height:42px;
	min-width:42px;
	margin:0 1px;
	line-height:42px;
	text-align:center;
	border:#eee solid 1px;
	color:#171a1b;
}
.pagination .page-numbers:hover, .pagination .page-numbers:focus, .pagination .page-numbers.current {
	background:#171a1b;
	color:#fff;
}
.map_wp iframe {
	width: 100%;
	height: 600px;
	border: none;
}
/**********************
	8. Sidebar
*********************************/


aside {
	position:relative;
	z-index:1;
	margin-top:15px;
}
.sidebar {
	background: #fff none repeat scroll 0 0;
	margin: 10px;
	position: relative;
}
.widgetbox {
	margin: 0 0 40px;
	padding: 30px 33px;
	position:relative;
	border:#ccc solid 1px;
}
.sidebar_widget::after {
 border: 6px solid #171a1b;
 bottom: 12px;
 content: "";
 height: 100%;
 left: 12px;
 position: absolute;
 width: 100%;
 z-index: -1;
}
.sidebar-title {
	border: 1px solid #171a1b;
	color: #000;
	line-height: 50px;
	position: relative;
	text-align: center;
}
.sidebar-title::after {
 border: 1px solid #171a1b;
 content: "";
 height: 104%;
 left: 5px;
 position: absolute;
 right: 0;
 top: -5px;
 width: 100%;
}
.about_text {
	margin-top:15px;
}
.about_text h5 {
	margin:0 0 4px;
}
.subtitle {
	font-size:12px;
	margin:0 0 15px;
	text-transform:uppercase;
	opacity:0.7;
}
.sidebar_categories {
	margin: 0px;
	padding: 0;
}
.sidebar_categories li {
	border-bottom: 1px solid #ccc;
	list-style: outside none none;
	padding: 0 0 0 35px;
}
.sidebar_categories li a::after {
 border-radius: 0;
 color: #171a1b;
 content: "\f105";
 font-family: fontawesome;
 height: 8px;
 left: -20px;
 position: absolute;
 top: 8px;
 width: 8px;
}
.sidebar_categories li a {
	color:#171a1b;
	display: inline-block;
	line-height: 30px;
	padding: 8px 0;
	position: relative;
}
.populat_posts {
	background: #fff none repeat scroll 0 0;
	border-bottom: 1px solid #e5e5e5;
	margin: 0 0 40px;
	padding-bottom: 10px;
}
.popular-post-title h6 a {
	color:#171a1b;
}
.popular-post-title h6 a:hover {
	text-decoration:underline;
}
#popular_articles .owl-controls {
	bottom: -50px;
	height: auto;
	text-align: center;
	top: inherit;
}
#popular_articles .owl-buttons div {
	float:none;
}
#popular_articles .owl-buttons {
	height:auto;
}
.sidebar_tags {
	text-align:center;
}
.sidebar_tags a {
	background: #171a1b none repeat scroll 0 0;
	border-radius: 0;
	color: #fff;
	display: inline-block;
	font-size: 14px;
	margin: 0 1px 5px;
	padding: 3px 10px;
	vertical-align: middle;
}
.sidebar_tags a:hover {
	background:#F00;
	color:#fff;
}
 @media (min-width:991px) and (max-width:1200px) {
 .widgetbox {
 padding: 30px 15px;
}
#popular_articles .post_meta_elements span {
 margin:0px !important;
}
}
/**********************
	9. Footer
*********************************/

footer {
	background: #000 none repeat scroll 0 0;
	padding: 40px 0;
}
.footer span a {
	color: #fff;
}
.footer span a:hover {
	color: #f00;
}
.post-content a {
	color: #fff;
}
.post-content a:hover {
	color: #f00;
}
.footer ul {
	padding: 0px;
}
.footer .ft-box .ft-blog li, .footer .ft-box .ft-tweets li, .footer .ft-box .ft-about li {
	margin-bottom: 10px;
	position: relative;
	max-width: 200px;
	list-style: none;
}
.footer .ft-box .ft-blog li:last-child, .footer .ft-box .ft-tweets li:last-child, .footer .ft-box .ft-about li:last-child {
	margin-bottom: 0;
}
.ml-8 {
	margin-left: 30px;
}
.footer .ft-box .ft-tweets li i, .footer .ft-box .ft-about li i {
	color: #f00;
	font-size: 22px;
	position: absolute;
	left: 0;
	top: 0px;
}
.ft-newsletter input {
	flex: 1 1 0%;
}
.footer .ft-box .ft-tweets li span, .footer .ft-box .ft-about li span {
	font-size: 16px;
	display: block;
}
.footer .ft-box .ft-tweets {
	overflow: hidden;
	height: 244px;
}
.footer .ft-box .ft-blog li {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 100%;
	margin-bottom: 15px;
}
.footer .ft-box .ft-blog li .post-date {
	border: 1px solid #fff;
	padding: 10px;
	font-size: 14px;
	text-align: center;
	width: 70px;
	height: 70px;
	margin-right: 10px;
}
.footer .ft-box .ft-blog li .post-content {
	width: calc(100% - 70px);
}
.ft-newsletter input {
	background-color: #fff;
	border-color: #2cb7df;
	color: #999;
}
.ft-newsletter input::placeholder {
 color: #999;
}
.ft-newsletter button {
	height: 34px;
	padding: 0 10px;
	background: #f00;
	color: #fff;
	font-size: 21px;
	border: none;
}
.footer .ft-box .ft-social-media li {
	list-style: none;
	display: inline-block;
}
.footer .ft-box .ft-social-media li a {
	margin: 0px 4px 10px 0px;
	line-height: 33px;
	border: 2px solid #fff;
	width: 36px;
	height: 36px;
	text-align: center;
	display: block;
}
.footer .ft-box .ft-social-media li:last-child a {
	margin-right: 0;
}
.footer .ft-box .ft-social-media li:hover a {
	background-color: #f00;
	border-color: #f00;
	color: #fff;
}
.copyright {
	background: #f00;
	padding: 0px 0;
}




/**********************
	10. Single-post
*********************************/

.single-post .post_content.entry-content::after {
 display:none;
}
.standard-post-format.quote-post-format {
	border: 0 none;
	padding: 0;
}
.quote-post-format .post_content.entry-content::after {
 display:none;
}
.quote-post-format blockquote::before {
 content: "\f10d";
 display: block;
 font-family: fontawesome;
 font-size: 23px;
 height: 20px;
 left: 50px;
 line-height: 20px;
 position: absolute;
 text-align: center;
 top: 64px;
 width: 20px;
 z-index: 1;
}
.quote-post-format blockquote {
	background-color: #fee198;
	color: #171a1b;
	font-family: "Josefin Sans", sans-serif;
	margin: 0;
	padding: 80px;
	position:relative;
}
.quote-post-format blockquote p {
	font-size:38px;
	margin:0px;
	line-height:40px;
	font-weight:300;
}
.quote-post-format blockquote .quote_author {
	color: #000;
	display: inline-block;
	font-size: 17px;
	font-weight: 500;
	margin: 40px 0 -10px;
	text-transform: uppercase;
}
.single-post ul, .single-post ol {
	margin:15px 0;
}
.single-post ul li, .single-post ol li {
	line-height:20px;
	margin:0 0 10px;
	font-size:14px;
}
 @media (max-width:767px) {
.quote-post-format blockquote::before {
 left: 20px;
 top: 20px;
}
.quote-post-format blockquote {
 padding: 50px 20px 20px;
}
.quote-post-format blockquote p {
 font-size: 32px;
 line-height: 34px;
}
}
/*----------------------
	10.1 comment-list
--------------------------*/

.all_comments {
	margin: 30px 0 50px;
}
.all_comments ul {
	margin:0px;
	padding:0px;
}
.all_comments ul li {
	border-bottom: 1px solid #dddddd;
	list-style: outside none none;
	margin: 0 0 30px;
	overflow: hidden;
	padding: 10px 0 30px;
}
.comment_author_avatar {
	float: left;
	width: 10%;
	margin:0 3% 0 0;
}
.comment_author_avatar img {
	width:100%;
	border-radius:50%;
}
.comment_content {
	float:left;
	width:80%;
}
.comment_info {
	padding-bottom:15px;
}
.comment_info .comment_author, .comment_date, .comment_time {
	display:inline-block;
	vertical-align:middle;
	margin:0 20px 0 0;
}
.comment_date, .comment_time {
	font-size:12px;
	color:#777;
}
.child_list {
	clear: both;
	overflow: hidden;
	padding: 40px 0 0 120px !important;
}
.all_comments h3 {
	font-weight: 400;
}
 @media (max-width:767px) {
 .child_list {
 padding: 30px 0 !important;
}
}
/*-----------------------
	10.2 Comment-form
-----------------------------*/

.psot_comment {
	margin:0 0 80px;
}
.commentform form {
	margin:40px 0;
}
form input {
	border: 1px solid #eee;
	border-radius: 0;
	font-size: 13px;
	height: 44px;
	padding: 2px 15px;
	width: 100%;
}
.audio-post-format iframe {
	width: 100%;
	height: 450px;
	border: none;
}
.d-none {
	display: none;
}
form textarea {
	border: 1px solid #eee;
	border-radius: 0;
	font-size: 13px;
	min-height: 100px;
	padding: 15px;
	width: 100%;
}
form .form-group {
	margin:0 0 25px;
}
form input[type="submit"] {
	display: inline-block;
	width: auto;
	color:#fff;
}
.single-post .standard-post-format {
	border:0px;
}
.audio-post-format iframe, .video-post-format iframe {
	float:left;
	border:0px;
}
.inner_content {
	margin:0 auto;
	max-width:750px;
}
.inner_content h1 {
	margin-bottom:20px;
}
.about_author {
	position:relative;
	width:100%;
	margin:0 auto 20px;
}
.author_info {
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
	padding:10px;
	color:#fff;
	background:rgba(0, 0, 0, 0.5);
}
.author_info h3 {
	margin:0 0 10px;
	color:#fff;
}
.section_heading {
	margin:-50px 0 50px;
	background:#fdfaf4;
	padding:30px 0;
}
 @media (max-width:767px) {
 .audio-post-format iframe, .video-post-format iframe {
 height: 300px;
}
}
 @media (max-width:480px) {
 .audio-post-format iframe, .video-post-format iframe {
 height: 200px;
}
}
/*====================
	19. Pricing page
=========================*/

.pricing_wrap {
	box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.2);
	text-align:center;
	background:#fff;
	padding:0 0 40px;
	margin-bottom:60px;
}
.pricing_head {
	background:#171a1b;
	color: #ffffff;
	overflow: hidden;
	padding: 20px;
	position: relative;
}
.pricing_head h2 {
	text-align:center;
	font-size:20px;
	color:#fff;
	margin:0px;
}
.pricing_wrap ul {
	padding:0px;
	margin:0 0 40px;
}
.pricing_wrap ul li {
	list-style:none;
	line-height:30px;
	padding:12px 20px;
}
.pricing_wrap ul li:nth-child(odd) {
 background:#f6f6f6;
}
.pricing_amount {
	font-size: 36px;
	font-weight: 700;
	margin: 0px -20px -20px;
	padding: 20px;
}
.pricing_amount span {
	display: block;
	font-size: 16px;
	font-weight: 400;
}
.popular .pricing_head {
	background: #fee198 none repeat scroll 0 0;
	color:#171a1b;
}
.popular .pricing_head h2 {
	color:#171a1b;
}
 @media (min-width:991px) {
.pricing_wrap {
 margin:40px -15px 80px;
}
.popular {
 position:relative;
 z-index:1;
 transform:scale(1.05);
}
}
/*======================
3. Blog
========================*/
/*sub header*/
.subheader {
	background-image: url(../images/breadcrumb-banner.jpg);
	text-align: center;
}
.subheader:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: #2d3e52;
	opacity: 0.5;
}
.subheader h1 {
	line-height: 1;
}
.subheader ul li a:after {
	content: '/';
	color: #fff;
	font-size: 14px;
	margin: 0 5px;
}
.subheader ul li.active {
	color: #7fa720;
}
.section-padding {
	padding: 80px 0;
}
.bx-wrapper {
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	margin: 10px;
}
.text-custom-white {
	color: #fff;
}
.bg-custom-blue {
	background: #f00;
}
.bg-custom-white {
	background-color: #ffffff;
}
.padding-20 {
	padding: 20px;
}
.mb-xl-30 {
	margin-bottom: 20px;
}
.mb-xl-20 {
	margin-bottom: 20px;
}
img {
	width: 100%;
}
#comment-box h4 {
	padding: 10px 0px;
	font-size: 24px;
	font-weight: 600;
}
.comment-box.section-padding-top.p-relative {
	padding: 10px;
}
.comment-meta-header h5 {
	margin-bottom: 14px;
}
.comment-respond h4 {
	font-size: 24px;
	font-weight: 600;
	padding: 15px 0px;
}
.input-group {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-align: stretch;
	align-items: stretch;
	width: 100%;
}
/*sidebar*/
.sidebar_wrap .sidebar .sidebar_widgets {
	padding: 20px;
	background: #fff;
	border: #eee solid 1px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}
.sidebar_wrap .sidebar .sidebar_widgets .widget_title {
	margin: -20px -20px 20px;
	padding: 20px;
}
.sidebar_wrap .sidebar .sidebar_widgets .categories {
	padding: 0px;
}
.sidebar_wrap .sidebar .sidebar_widgets .categories li {
	position: relative;
	margin-bottom: 10px;
	list-style: none;
}
.popular_post {
	padding: 0px;
}
.popular_post li {
	list-style: none;
}
.widget_title h5 {
	line-height: 20px;
	margin-bottom: 0px;
	font-weight: 700;
	color: #fff;
}
.popular_post_title h6 a {
	color: #000;
	font-weight: 600;
	font-size: 14px;
}
.popular_post_title span {
	background: #f00;
	padding: 2px 6px;
	color: #fff;
}
.sidebar_wrap .sidebar .sidebar_widgets .categories li:last-child {
	margin-bottom: 0px;
}
.sidebar_wrap .sidebar .sidebar_widgets .categories li a {
	color: #000;
	font-weight: 500;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.sidebar_wrap .sidebar .sidebar_widgets .categories li a :hover {
	color: #f00;
}
.sidebar_wrap .sidebar .sidebar_widgets .popular_post li .post .post-wrapper {
	width: 100%;
	display: flex;
	align-items: center;
}
.sidebar_wrap .sidebar .sidebar_widgets .popular_post li .post .post-wrapper .popular_post_img {
	flex: 0 0 80px;
	max-width: 80px;
	height: 80px;
}
.sidebar_wrap .sidebar .sidebar_widgets .popular_post li .post .post-wrapper .popular_post_title {
	flex: 0 0 calc(100% - 80px);
	max-width: calc(100% - 80px);
	padding: 5px 15px;
	width: 100%;
}
.sidebar_wrap .sidebar .sidebar_widgets .popular_post li .post .post-wrapper .popular_post_title h6 {
	margin-bottom: 10px;
}
.blog-details .post-details-tags-social .tags a, .sidebar_wrap .sidebar .sidebar_widgets .tags a {
	display: inline-block;
	padding: 5px 15px;
	border: #eee solid 1px;
	margin: 0 5px 10px 0;
	background: #ffffff;
	font-weight: 600;
	border-radius: 50px;
	color: #838383;
}
.blog-details .post-details-tags-social .tags a:hover, .sidebar_wrap .sidebar .sidebar_widgets .tags a:hover {
	border-color: #7fa720;
	color: #7fa720;
}
/*======================
4. Blog Details
========================*/

.blog-details .post .post-wrapper .blog-meta .blog-video iframe {
	height: 450px;
}
.blog-details .post .post-wrapper .blog-meta .post-meta-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.blog-details .post .post-wrapper .blog-meta .post-meta-box .post-meta {
	display: flex;
}
.blog-details .post .post-wrapper .blog-meta .post-meta-box .post-meta .post-date {
	position: absolute;
	right: 0;
	height: 75px;
	margin-top: 0;
	left: 20px;
	top: 20px;
}
.post-heading h2 {
	font-size: 18px;
	line-height: 30px;
	font-weight: 600;
}
.post-meta a {
	color: #171a1b;
}
.post-meta a span i {
	color:#f00;
}
.post-heading h2 a {
	color: #000;
}
.post-heading h2 a:hover {
	color: #f00;
}
.blog-details .post .post-wrapper .blog-meta .post-heading h2:after {
	content: '';
	display: block;
	width: 80px;
	height: 2px;
	background: #7fa720;
	margin-top: 20px;
}
.blog-details .post .post-wrapper .blog-meta .post-author {
	display: flex;
	align-items: center;
	margin-right: 15px;
	flex-wrap: wrap;
	width: auto;
	border: none;
}
.blog-details .post .post-wrapper .blog-meta .post-author .author-img {
	margin-right: 15px;
	flex: 0 0 40px;
	max-width: 40px;
	height: 40px;
	border-radius: 50%;
}
.blog-details .post-details-tags-social .tags-box {
	display: flex;
	align-items: flex-start;
}
.blog-details .post-details-tags-social .tags {
	margin-left: 15px;
}
.blog-details .post-details-tags-social .social-media-box ul {
	justify-content: flex-end;
}
.blog-details .post-details-tags-social .social-media-box ul li {
	display: flex;
	align-items: center;
	margin-left: 15px;
}
.blog-details .post-details-tags-social .social-media-box ul li a {
	width: 35px;
	height: 35px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	z-index: 1;
}
.blog-details .post-details-tags-social .social-media-box ul li .social-number {
	padding: 2px 10px;
	border-radius: 0px 15px 15px 0;
	margin-left: -8px;
	z-index: 0;
	font-size: 14px;
}
.fb {
	background-color: #3b5998;
}
.tw {
	background-color: #1da1f2;
}
.yt {
	background-color: #ff0000;
}
.ldin {
	background-color: #0077b5;
}
.blog-details .post-author {
	display: flex;
	align-items: center;
	width: 100%;
}
.blog-details .post-author .author-img {
	flex: 0 0 150px;
	max-width: 150px;
	height: 150px;
	margin-right: 15px;
	border-radius: 0%;
}
.blog-details .post-author .author-caption {
	flex: 0 0 calc(100% - 165px);
	max-width: calc(100% - 165px);
	width: 100%;
	position: relative;
}
.blog-details .post-author .author-caption h5 {
	margin-bottom: 10px;
}
.blog-details .post-author .author-caption .authorpost {
	top: 0;
	position: absolute;
	right: 0;
}
.pagination-btn nav ul {
	justify-content: space-between;
}
.comment-box .children, .comment-box .comments {
	margin-bottom: 35px;
}
.comment-box .children {
	padding-left: 95px;
}
.comment-box .comments li.comment {
	list-style: outside none none;
	padding-left: 0;
	margin-bottom: 20px;
}
.comment-box .comments li article {
	display: flex;
	width: 100%;
	position: relative;
	margin-bottom: 20px;
}
.comment-box .comments li article .comment-avatar {
	margin-right: 20px;
	float: left;
	overflow: hidden;
	height: 80px;
	border-radius: 50px;
}
.comment-box .comments li article .comment-content {
	float: right;
	width: calc(100% - 50px);
}
.comment-box .comments li article .comment-content .comment-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 15px;
	flex-wrap: wrap;
}
.comment-box .comments li article .comment-content .comment-meta .comment-meta-reply .comment-reply-link {
	font-size: 20px;
	padding: 12 25px;
}
.comment-box .comments li article .comment-content .comment-meta .comment-meta-header .post-date .date {
	display: inline-block;
	padding: 8px 15px;
	position: relative;
	line-height: 10px;
	font-size: 14px;
	position: relative;
	color: #fff;
}
.cooming-soon {
	position: relative;
	width: 100%;
	height: 100%;
	background: radial-gradient(circle, #FBB600, #DA5900);
}
#beerCanvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 100;
}
.coming_content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 70%;
	margin: 0 auto;
	color: white;
	text-align: center;
	z-index: 101;
}
.coming_content h1 {
	font-size: 90px;
	margin: 0;
	letter-spacing: 2px;
	text-align: center;
	color: white;
	font-weight: 600;
}
.coming_content a {
	background: #fff;
	padding: 10px 25px;
}
.coming_content h3 {
 font-family: $font-text;
	letter-spacing: 2px;
	line-height: 2;
	font-size: 16px;
	font-weight: 400;
	color: #fff;
	text-align: center;
	margin: 0;
	padding: 20px;
 a {
 text-decoration: underline;
}
}
}




/* Banner Section CSS Start */
      .featured-banner {
          font-family: 'Arial', sans-serif;
        }

        .banner-item {
          position: relative;
          background-size: cover;
          background-position: center;
          color: #fff;
          overflow: hidden;
        }

        .banner-item.large {
          height: 80vh;
        }

        .banner-item.small {
          height: 40vh;
        }

        .col-lg-8{
            padding-left: 0%;
            padding-right: 0%;
        }

        .col-lg-4{
            padding-left: 0%;
            padding-right: 0%;
        }

        .video-bg {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          object-fit: cover;
          z-index: 0;
        }

        .overlay {
          position: relative;
          z-index: 1;
          width: 100%;
          height: 100%;
          padding: 20px;
          background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent 70%);
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          text-align: center;
        }

        .tag {
          background-color: #ff3c00;
          padding: 5px 12px;
          font-size: 10px;
          font-weight: bold;
          border-radius: 5px;
          text-transform: uppercase;
          margin-bottom: 15px;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          text-align: center;
        }

        .title {
          font-size: 24px;
          font-weight: bold;
          margin-bottom: 10px;
          position: relative;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          text-align: center;
          color: white;
        }

        /* Hover underline effect under the big heading */
        .underline-hover::after {
          content: "";
          position: absolute;
          bottom: 5px;
          left: 0;
          width: 0;
          height: 3px;
          background-color: #fff;
          transition: width 0.4s ease;
        }

        .underline-hover:hover::after {
          width: 100%;
        }

        .meta {
          font-size: 14px;
          color: #ddd;
          display: flex;
          flex-wrap: wrap;
          gap: 15px;
          justify-content: center;
          align-items: center;
        }

        .meta i {
          margin-right: 4px;
        }

        @media (max-width: 768px) {
          .banner-item.large,
          .banner-item.small {
            height: 300px;
          }

          .title {
            font-size: 28px;
          }

          .meta {
            font-size: 12px;
          }
          
          /* Added for better mobile spacing */
          .overlay {
            padding: 15px;
          }
          
          /* Ensure columns stack on mobile */
          .col-lg-8, .col-lg-4 {
            width: 100%;
          }
        }

		
        @media (max-width: 568px) {
          .banner-item.large,
          .banner-item.small {
            height: 300px;
          }

          .title {
            font-size: 20px;
          }

          .meta {
            font-size: 12px;
          }
          
          /* Added for better mobile spacing */
          .overlay {
            padding: 15px;
          }
          
          /* Ensure columns stack on mobile */
          .col-lg-8, .col-lg-4 {
            width: 100%;
          }
        }
        
        /* Added for tablet responsiveness */
        @media (min-width: 769px) and (max-width: 992px) {
          .banner-item.large {
            height: 60vh;
          }
          
          .banner-item.small {
            height: 30vh;
          }
        }
/* Banner Section CSS End */