:root {
	--cd-primary: #D80000;
	--cd-primary-dark: #A80000;
	--cd-dark: #19232D;
	--cd-accent: #8B1010;
	--cd-secondary: #01284F;
	--cd-menu-bg: var(--cd-primary);
	--cd-menu-text: #FFFFFF;
	--cd-header-bg: #FFFFFF;
	--cd-header-text: #333333;
	--cd-footer-bg: #000000;
	--cd-footer-text: #FFFFFF;
	--cd-body-bg: #FFFFFF;
	--cd-text: #000000;
	--cd-link-hover: #014F06;
	--cd-font: SolaimanLipiNormal;
	--cd-font-size: 18px;
}


.codedokan_header {
	background: #FFFFFF;
	color: #000000;
	padding: 5px 0;
	border-bottom: 1px solid #eee;
}

.header2 {
	padding: 15px 0;
	background: #FFFFFF;
	color: #000000;
}

#scroll5-left {
	position: relative;
	width: auto;
	height: 40px;
	padding-top: 8px;
	padding-left: 10px;
	margin: 0;
	padding-right: 10px;
	padding: 9px 20px 9px 10px;
	font-size: 18px;
	color: #fff;
	background-color: var(--cd-dark);
	font-weight: 400;


}

#scroll5-left::before {
	position: absolute;
	right: -20px;
	bottom: 0;
	content: "";
	width: 0;
	height: 0;
	border-left: 20px solid var(--cd-dark);
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
}

.scroll5-right {
	position: relative;
	height: 40px;
	width: 100%;
	background: #F1FCFF;
	color: #000000;	
	line-height: 40px;
}

.scroll5-right a {
	font-size: 18px;
	color: #000000;	
	font-weight: 400;
	margin-right: 12px;
	display: inline-block;
}

.scroolbar5 {
	position: absolute;
	right: 0;
	top: 0px;
	height: 100%;
	float: right;
	width: 59px;
	height: 40px;
	background: var(--cd-dark);
	color: #fff;
	cursor: pointer;

}

.footer-area {
	background: var(--cd-footer-bg);
	color: var(--cd-footer-text);
	padding: 40px 0 20px;
	margin-top: 10px;
}
.footer-area ‍a{
	color: #ffffff;
}

.footer-menu ul > li > a {
	display: inline-block;
	color: #ffffff !important;
	border: 1px solid #333;
	padding: 6px 15px;
	transition: .8s all;
}


.photoCaption a {
	color: #ffffff;
	font-size: 20px;
	padding: 10px;
	display: inline-block;
	font-style: italic;
}

#recentPopular-tab .nav-link.active {
	color: #000000;
	font-size: 20px;
	background: #FFFFFF !important;
	border-top: 3px solid #860707;
}

#recentPopular-tab .nav-link {
	background: var(--cd-dark) !important;
	color: #ffffff;
	font-size: 20px;
	padding: 10px 10px;
	margin: 0;
	text-align: center;
	border-top: 3px solid var(--cd-dark);
	text-decoration: none;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
	display: block;

}

.tab_hadding a{
	color: #000000 !important;
	font-size: 18px !important;
    font-weight:400;
	display: inherit;
    text-decoration:none;
    -webkit-transition:.8s all;
    -o-transition:.8s all;
    transition:.8s all;
}

.sec-one-title a {
	color: #ffffff;
	font-size: 24px;	
	display: inline-block;
	transition: .5s all;
}

.secOne-title2 a {
	color: #000000;
	font-size: 20px;	
	display:inline-block

}

.secOne_smallTitle a {
	color: #000000;
	font-size: 20px;	
	display: inline-block;
	transition: .5s all;
}

.section-two {
	background: #212121;
	margin: 10px 0 0;
	padding: 28px 0 32px;
}

.sec-two-title a {
	color: #ffffff;
	font-size: 20px;
	display: inline-block;
	text-decoration: none;
    transition: .5s all;
}

.secThree-title a {
	color: #000000;
	font-size: 20px;
	display: inline-block;
	transition: .5s all;
}

.secThree-title2 a {
	color: #000000;
	font-size: 18px;
	display: inline-block;
}

.secFour-title a {
	color: #ffffff;
	font-size: 20px;
	display: inline-block;
	transition: .5s all;
}

.secFive-title a {
	color: #000000;
	font-size: 20px;
	display: inline-block;
	transition: .5s all;
}

.secFive_title2 a {
	color: #000000;
	font-size: 18px;
	display: inline-block;
}

.secSeven-title a {
	font-size: 22px;
	color: #ffffff;
	display: inline-block;
	transition: .5s all;
}

.secSeven-details a{
	color: #ffffff;
}

.secSecven-color {
	color: #ffffff;
}

.secSeven-title2 a {
	color: #ffffff;
	font-size: 20px;
	display: inline-block;
	transition: .5s all;
}

.secEight-title a {
	color: #000000;
	font-size: 19px;	
	display: inline-block;
	transition: .5s all;
}
  









body {
    font-size: var(--cd-font-size) !important;
	color: var(--cd-text) !important;
	font-family: var(--cd-font) !important;
	background: var(--cd-body-bg) !important;



}

a:hover {
    color: var(--cd-link-hover);
}


.sticky {
	
		position: fixed !important;
	
	width: 100%;

	top: 0;

	left: 0;

	z-index: 9;

	-webkit-transition: .8s all;

	-o-transition: .8s all;

	transition: .8s all;

	z-index: 9999;

}

.menu_section {
	background: #F0F0ED;
	box-shadow: 0 5px 5px -5px #000;
	margin-bottom: 20px;
}


.stellarnav { position: relative; width: 100%; z-index: 9900; line-height: normal; font-weight: normal; font-size: 18px;}

.stellarnav.dark .active {
	background: var(--cd-secondary);
}

.stellarnav.dark .current-menu-item {
	background: var(--cd-secondary);
}

.stellarnav.dark .current-menu-item a {
	color : #fff;
}

.stellarnav.dark ul ul {
	background: #F0F0ED;
}

.stellarnav.dark li a {
	color : #fff;
}
.stellarnav.dark li a:hover {
	background: var(--cd-secondary);
}
.stellarnav.dark a {
	color : #fff;
}

.stellarnav > ul > li > a {
	font-weight: normal;
	border-bottom: none;
}

.stellarnav li a {
	padding : 15px 10px 15px 10px;
	display: block;
	text-decoration: none;
	color: #000;
	font-weight: 600;
	/* text-transform: uppercase; */
	box-sizing: border-box;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	transition: all .3s ease-out;
}


.footer-scrool {
	position: fixed;
	background: #F0F8FF;
	color: #000000;
	z-index: 99;
	overflow: hidden;
	bottom: 0;
	left: 0;
	right: 0;
	border-top: 1px solid var(--cd-secondary);
	border-bottom: 1px solid var(--cd-secondary);
}

.footer-scrool-1 {
	float: left;
	width: auto;
	background: #540A0A;
	height: 100%;
	font-size: 18px;
	color: #ffffff;
	position: absolute;
	z-index: 99;
	line-height: 41px;
	padding: 0 20px 0 11px;
}

.footer-scrool-2 {
    height: 40px;
    font-size: 18px;
    line-height: 43px;
}


.footer-scrool-2 a {
	color: #000000;
    text-decoration: none;
}


 
 .single-page-subTitle {
	font-size: 24px;
	color: #00315e;
	margin-top: 19px;
	line-height : auto;
}

.single-page-title {
	font-size: 28px;
	margin-bottom: 17px;
	font-weight: 600;
	color: #000000;
	margin-top: 11px;
	line-height : auto;
}
 
 
 .related-title a {
	font-size: 20px;
	color: #000000;
	text-decoration: none;
    transition: .5s all;
}
 

#singlePopular-tab .nav-link.active {
	color:  #000000 !important;
	background: #FFFFFF !important;
	font-size: 20px !important;
	border-top: 3px solid var(--cd-secondary);
}

#singlePopular-tab .nav-link {
	display: block;
	color: var(--cd-secondary) !important;
	padding: 10px 10px;
	text-decoration: none;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
	text-align: center;
	background: #DDDDDD !important;
	border-top: 3px solid var(--cd-accent);
	font-size: 20px !important;
	margin: 0;

}

.singleTab_hadding a{
    font-size:18px !important;
    font-weight:400;
    line-height:auto;
    color:#000000 !important;
    text-decoration:none;
    -webkit-transition:.8s all;
    -o-transition:.8s all;
    transition:.8s all;
}


#archivePopular-tab .nav-link.active {
	font-size:20px !important;
	color: #000000 !important;
	background: #FFFFFF !important;
	border-top: 3px solid var(--cd-secondary);
}


#archivePopular-tab .nav-link {
	display: block;
	color: var(--cd-secondary) !important;
	padding: 10px 10px;
	text-decoration: none;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
	text-align: center;
	background: #DDDDDD !important;
	border-top: 3px solid var(--cd-accent);
	font-size:20px !important;
	margin: 0;

}

.archiveTab_hadding a {
	font-size:18px !important;
	font-weight: 400;
	line-height: auto;
	color: #000000 !important;
	text-decoration: none;
	-webkit-transition: .8s all;
	-o-transition: .8s all;
	transition: .8s all;
}

.archive1-title a {
	display : inline-block;
	font-size: 23px !important;
	color: #000000 !important;
	text-decoration: none;
	transition: .8s all;
}

.archive1-title2 a {
	font-size: 20px !important;
	color: #000000 !important;
	text-decoration: none;
	display : inline-block;
	font-weight: 400;
	
}

.archive-p-title a {
	font-size: 23px !important;
	text-decoration: none;
	color: #000000 !important;
	font-weight: 500;
    transition: .5s all;
}


.photo-page-title a {
	font-size: 20px !important;
	color: #000000 !important;
	transition: .5s all;
}


.photo-latest-title a {
	font-size: 18px;
	color: #000000;
	transition: .5s all;
	font-weight: normal;
}



.scrollToTop {
	width: 50px;
	height: 60px;
	background: #B3D7EC;
	position: fixed;
	right: 25px;
	bottom: 70px;
	z-index: 9999;
	border-radius: 50px 50px 0px 0px;
}

.scrollToTop i {
	font-size: 28px;
	color: #ffffff;
	font-weight: 600;
	top: 4px;
	display: block;
	position: absolute;
	right: 4px;
	background: var(--cd-dark);
	width: 42px;
	height: 52px;
	border-radius: 50px 50px 0px 0px;
	line-height: 55px;
	text-align: center;
}





.codedokan_cat01 {
	background: #EFF3F6;
	color: #000000;
	font-size: 20px;
	padding: 10px 8px;
	margin-bottom: 10px;
	border-left: 4px solid var(--cd-secondary);
}
.codedokan_cat01 a {
	color: #000000;
	transition: .5 all;
}
.codedokan_cat01 > span {
	float: right;
}
.codedokan_cat01 > span > a {
	background: transparent;
	font-size: 90%;
}
.codedokan_cat01 a:hover {
	opacity: .9;
}

.codedokan_cat02 {
	background: #EFF3F6;
	color: #000000;
	font-size: 20px;
	padding: 10px 8px;
	margin-bottom: 10px;
	border-left: 4px solid var(--cd-secondary);
}
.codedokan_cat02 a {
	color: #000000;
	transition: .5 all;
}




.codedokan_cat03 {
	display: block;
	margin-bottom: 7px;
	background-color: #E7F0F7;
	font-size: 20px;
}
.codedokan_cat03 a {
	background: var(--cd-secondary);
	color: #ffffff;
	padding: 10px 8px;
	position: relative;
	display: inline-block;
	transition: .5s all;
}
.codedokan_cat03 > a::after {
	left: 100%;
	height: 0;
	width: 7px;
	position: absolute;
	top: 0;
	content: "";
	pointer-events: none;
	margin-left: 0;
	margin-top: 0;
	border-top: 44px solid var(--cd-secondary);
	border-right: 8px solid transparent;
}
.codedokan_cat03 > span {
	float: right;
	margin-top: 3px;
}
.codedokan_cat03 > span > a {
	background: transparent;
	font-size: 90%;
	color: var(--cd-secondary);
}




.codedokan_cat04 {
	display: block;
	margin-bottom: 7px;
	background-color: #E7F0F7;
	font-size: 20px;
}
.codedokan_cat04 a {
	background: var(--cd-secondary);
	color: #ffffff;
	padding: 10px 8px;
	position: relative;
	display: inline-block;
	transition: .5s all;
}
.codedokan_cat04 > a::after {
	left: 100%;
	height: 0;
	width: 7px;
	position: absolute;
	top: 0;
	content: "";
	pointer-events: none;
	margin-left: 0;
	margin-top: 0;
	border-top: 44px solid var(--cd-secondary);
	border-right: 8px solid transparent;
}





.codedokan_cat05 {
	position: relative;
	overflow: hidden;
	color: #000000;
	font-size: 20px;
}

.codedokan_cat05 a {
	color: #000000;
	padding: 0 10px 0 0;
	margin: 12px 0;
	display: inline-block;
	transition: .5s all;	

}
.codedokan_cat05 .catBar::before {
	position: absolute;
	content: '';
	width: 100%;
	border-top: 5px solid #DADADA;
	top: 19px;
	display: inline-block;
	vertical-align: bottom;
}

.codedokan_cat05 .catBar::after {
	position: absolute;
	content: '';
	width: 100%;
	border-top: 5px solid #DADADA;
	top: 26px;
	display: inline-block;
	vertical-align: bottom;
}




.codedokan_cat06 {
	background: #052D51;
	color: #ffffff;
	font-size: 20px;
	text-align : left;
	padding: 10px 6px;	
	border-radius: 5px 5px 0 0;
}

.codedokan_cat06 a{
	color: #ffffff;
	display: inline-block;
	width: 100%;
	transition: .5s all;
}


.codedokan_cat07 {
	color: #ffffff;
	font-size: 20px;
	margin-bottom: 15px;
	background-color: #FBF8F8;
	border-bottom: 2px solid var(--cd-secondary);
	border-top: 1px solid #EDE9E9;
}

.codedokan_cat07 a {
	background: var(--cd-secondary);
	color: #ffffff;
	padding: 10px 8px;
	position: relative;
	display: inline-block;
	transition: .5s all;

}

.codedokan_cat07 > a::after {
	left: 100%;
	height: 0;
	width: 7px;
	position: absolute;
	top: 0;
	content: "";
	pointer-events: none;
	margin-left: 0;
	margin-top: 0;
	border-bottom: 47px solid var(--cd-secondary);
	border-right: 30px solid transparent;
}





.codedokan_cat08 {
	color: #ffffff;
	font-size: 20px;
	margin-bottom: 15px;
	background-color: #FBF8F8;
	border-bottom: 2px solid var(--cd-secondary);
	border-top: 1px solid #EDE9E9;
}

.codedokan_cat08 a {
	background: var(--cd-secondary);
	color: #ffffff;
	padding: 10px 8px;
	position: relative;
	display: inline-block;
	transition: .5s all;

}

.codedokan_cat08 > a::after {
	left: 100%;
	height: 0;
	width: 7px;
	position: absolute;
	top: 0;
	content: "";
	pointer-events: none;
	margin-left: 0;
	margin-top: 0;
	border-bottom: 47px solid var(--cd-secondary);
	border-right: 30px solid transparent;
}
.codedokan_cat08 > span {
	float: right;
}

.codedokan_cat08 > span > a {
	background: transparent;
	font-size: 90%;
	color: var(--cd-secondary);
}




.codedokan_cat09 {
	color: #000000;
	font-size: 20px;
	padding:  10px 8px;
	border-bottom: 5px solid #c9c3c3;
	margin-top: 10px;
	margin-bottom: 8px;
	background: #EFF3F6;
}

.codedokan_cat09 a {
	color: #000000;
}

.codedokan_cat09 span {
	border-bottom: 5px solid #e80212;
	padding: 10px 8px;
	margin-left: -8px;
}





.codedokan_cat10 {
	display: block;
	font-size: 20px;
	color: #ffffff;
	margin-bottom: 15px;
	background: #F3F6F9;
	border-bottom: 3px solid var(--cd-secondary);
}

.codedokan_cat10 > a {
	background: var(--cd-secondary);
	color: #ffffff;
	padding: 10px 8px;
	display: inline-block;

}

.codedokan_cat10 > span > a {
	background: transparent;
	font-size: 90%;
	color: var(--cd-secondary);
}

.codedokan_cat10 > span {
	float: right;
	margin-top: 12px;
	padding-right: 7px;
}




.codedokan_widget h3 {
	background: #EFF3F6;
	color: #000000;
	font-size: 20px;
	text-align : left;
	padding: 10px 8px;
	margin-bottom: 10px;
	border-left: 4px solid var(--cd-secondary);
}
	
	





/* =========================================
   Header Design Three (New)
========================================= */
.codedokan_header3 {
	background: var(--cd-header-bg);
}

.codedokan_header3 .header3-ad {
	padding: 15px 0 5px;
}

.codedokan_header3 .header3-ad-inner {
	text-align: center;
}

.codedokan_header3 .header3-ad-inner img {
	max-width: 100%;
	height: auto;
	display: inline-block;
}

.codedokan_header3 .header3-middle {
	padding: 18px 0 22px;
}

.codedokan_header3 .header3-middle .row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.codedokan_header3 .header3-date {
	line-height: 1.5;
	font-size: 17px;
	color: var(--cd-header-text);
}

.codedokan_header3 .header3-date span {
	display: block;
}

.codedokan_header3 .header3-logo {
	text-align: center;
}

.codedokan_header3 .header3-logo img {
	max-width: 100%;
	max-height: 90px;
	height: auto;
}

.codedokan_header3 .header3-social ul {
	margin: 0;
	padding: 0;
	text-align: right;
}

.codedokan_header3 .header3-social ul li {
	display: inline-block;
	margin-left: 6px;
}

.codedokan_header3 .header3-social ul li a {
	display: inline-block;
	width: 34px;
	height: 34px;
	line-height: 34px;
	text-align: center;
	border-radius: 50%;
	background: #f1f1f1;
	color: #444;
	font-size: 17px;
	transition: all .3s ease;
}

.codedokan_header3 .header3-social ul li a:hover {
	background: var(--cd-primary);
	color: #fff;
}

/* Centered red menu (Design Three) */
.menu_section.menu_section_three {
	background: var(--cd-menu-bg) !important;
	margin-bottom: 20px;
}

.menu_section_three .stellarnav > ul {
	text-align: center;
}

.menu_section_three .stellarnav > ul > li {
	display: inline-block;
	float: none;
}

.menu_section_three .stellarnav li a,
.menu_section_three .stellarnav.dark li a,
.menu_section_three .stellarnav.dark a {
	color: var(--cd-menu-text) !important;
}

.menu_section_three .stellarnav li a:hover,
.menu_section_three .stellarnav.dark li a:hover,
.menu_section_three .stellarnav .active,
.menu_section_three .stellarnav.dark .active,
.menu_section_three .stellarnav .current-menu-item,
.menu_section_three .stellarnav.dark .current-menu-item {
	background: var(--cd-primary-dark) !important;
}

.menu_section_three .stellarnav.dark ul ul {
	background: var(--cd-menu-bg);
	text-align: left;
}

.menu_section_three .stellarnav li.menu-home-icon a {
	font-size: 19px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.menu_section_three .stellarnav .menu-toggle,
.menu_section_three .stellarnav .menu-toggle span.bars span {
	color: var(--cd-menu-text);
	background-color: transparent;
}

@media (max-width: 767px) {
	.codedokan_header3 .header3-date,
	.codedokan_header3 .header3-logo,
	.codedokan_header3 .header3-social ul {
		text-align: center;
	}
	.codedokan_header3 .header3-date {
		margin-bottom: 10px;
	}
	.codedokan_header3 .header3-social {
		margin-top: 10px;
	}
	.menu_section_three .stellarnav > ul {
		text-align: left;
	}

	/* Design Three mobile: compact red menu bar with the hamburger inside it */
	.menu_section.menu_section_three {
		padding: 0 !important;
		margin-bottom: 12px !important;
		min-height: 0;
	}
	.menu_section_three .stellarnav.mobile {
		position: relative !important;
		margin: 0 !important;
		text-align: right !important;
	}
	.menu_section_three .stellarnav a.menu-toggle {
		display: inline-block !important;
		width: auto !important;
		padding: 12px 16px !important;
		font-size: 0 !important; /* hide the "Menu" text, keep only the bars */
		line-height: 0;
		position: relative !important;
	}
	.menu_section_three .stellarnav .menu-toggle span.bars {
		position: static !important;
		display: inline-block;
		top: auto !important;
		right: auto !important;
		vertical-align: middle;
	}
	.menu_section_three .stellarnav .menu-toggle span.bars span {
		background: #fff !important;
		width: 26px !important;
		height: 3px !important;
		margin: 0 0 5px !important;
		display: block;
	}
	.menu_section_three .stellarnav.mobile > ul {
		position: static !important;
		margin: 0 !important;
		text-align: left !important;
		width: 100%;
	}
	.menu_section_three .stellarnav.mobile.dark ul {
		margin-top: 0 !important;
		background: rgba(20, 20, 20, 0.96) !important;
	}
	.codedokan_header3 .header3-ad {
		padding-top: 10px;
	}
	.codedokan_header3 .header3-middle {
		padding: 12px 0 14px;
	}
	.codedokan_header3 .header3-logo img {
		max-height: 75px;
	}
}

/* =========================================
   Home Page Video Gallery Box (redesigned)
========================================= */
.video-gallery-box {
	background: #ffffff;
	padding: 25px 0 30px;
	margin-bottom: 25px;
}

.video-gallery-box .vgb-header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	border-bottom: 2px solid #eee;
	margin-bottom: 22px;
	padding-bottom: 10px;
}

.video-gallery-box .vgb-title {
	font-size: 26px;
	font-weight: 700;
	margin: 0 25px 0 0;
	padding: 0;
	line-height: 1;
}

.video-gallery-box .vgb-title a {
	color: #111;
}

.video-gallery-box .vgb-title a i {
	color: var(--cd-primary);
}

.video-gallery-box .vgb-cats {
	margin: 0;
	padding: 0;
	list-style: none;
}

.video-gallery-box .vgb-cats li {
	display: inline-block;
	margin-right: 20px;
}

.video-gallery-box .vgb-cats li a {
	color: #333;
	font-size: 18px;
}

.video-gallery-box .vgb-cats li a:hover {
	color: var(--cd-primary);
}

.video-gallery-box .vgb-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 4px;
}

.video-gallery-box .vgb-thumb img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform .4s ease;
}

.video-gallery-box .vgb-thumb:hover img {
	transform: scale(1.04);
}

.video-gallery-box .vgb-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 46px;
	height: 46px;
	line-height: 46px;
	text-align: center;
	border-radius: 50%;
	background: var(--cd-primary);
	color: #fff;
	font-size: 20px;
	opacity: .92;
	transition: all .3s ease;
}

.video-gallery-box .vgb-play i {
	margin-left: 3px;
}

.video-gallery-box .vgb-thumb:hover .vgb-play {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1.1);
}

.video-gallery-box .vgb-play-lg {
	width: 64px;
	height: 64px;
	line-height: 64px;
	font-size: 28px;
}

.video-gallery-box .vgb-featured-title {
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
	margin: 15px 0 0;
}

.video-gallery-box .vgb-featured-title a {
	color: #111;
}

.video-gallery-box .vgb-featured-title a:hover {
	color: var(--cd-primary);
}

.video-gallery-box .vgb-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px 20px;
}

.video-gallery-box .vgb-item-title {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.45;
	margin: 10px 0 0;
}

.video-gallery-box .vgb-item-title a {
	color: #222;
}

.video-gallery-box .vgb-item-title a:hover {
	color: var(--cd-primary);
}

/* old markup fallback inside new grid (demo videos) */
.video-gallery-box .vgb-grid .secFive-smallItem {
	width: 100%;
	margin: 0;
	float: none;
}

@media (max-width: 991px) {
	.video-gallery-box .vgb-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.video-gallery-box .vgb-featured-title {
		font-size: 20px;
	}
}

@media (max-width: 575px) {
	.video-gallery-box .vgb-grid {
		grid-template-columns: 1fr;
	}
	.video-gallery-box .vgb-featured {
		margin-bottom: 22px;
	}
	.video-gallery-box .vgb-title {
		margin-bottom: 8px;
	}
}



/* =========================================
   Section Three (redesigned) - Card Grid Box
   & shared section header style (cgb-*)
========================================= */
.cardgrid-box,
.opinion-box {
	background: #ffffff;
	padding: 28px 0 32px;
	margin-bottom: 10px;
}

.cgb-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	border-bottom: 1px solid #222;
	margin-bottom: 24px;
	padding-bottom: 12px;
}

.cgb-title {
	font-size: 26px;
	font-weight: 700;
	margin: 0;
	padding: 0;
	line-height: 1;
}

.cgb-title a {
	color: #111;
}

.cgb-title a:hover {
	color: var(--cd-primary);
}

.cgb-title a i {
	color: var(--cd-primary);
}

.cgb-more a {
	color: #666;
	font-size: 16px;
}

.cgb-more a:hover {
	color: var(--cd-primary);
}

.cgb-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 26px 24px;
}

.cgb-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 6px;
}

.cgb-thumb img {
	width: 100% !important;
	height: 190px !important;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
	border-radius: 6px;
}

.cgb-item:hover .cgb-thumb img {
	transform: scale(1.05);
}

.cgb-video-icon {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	text-align: center;
	border-radius: 4px;
	background: rgba(0,0,0,.55);
	color: #fff;
	font-size: 16px;
}

.cgb-item-title {
	font-size: 19px;
	font-weight: 600;
	line-height: 1.5;
	margin: 12px 0 0;
}

.cgb-item-title a {
	color: #1a1a1a;
}

.cgb-item-title a:hover {
	color: var(--cd-primary);
}

.cgb-map {
	margin-top: 35px;
}

@media (max-width: 991px) {
	.cgb-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 575px) {
	.cgb-grid {
		grid-template-columns: 1fr;
	}
	.cgb-title {
		font-size: 22px;
	}
	.cgb-thumb img {
		height: 210px !important;
	}
}

/* =========================================
   Section Six (redesigned) - Opinion Box (মতামত)
========================================= */
.opinion-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px 40px;
}

.opinion-item {
	display: flex;
	align-items: center;
	gap: 18px;
}

.opinion-photo {
	flex: 0 0 110px;
	width: 110px;
	height: 110px;
	border-radius: 50%;
	overflow: hidden;
	display: block;
	border: 1px solid #e5e5e5;
	background: #f7f7f7;
}

.opinion-photo img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	border-radius: 50%;
	transition: transform .4s ease;
}

.opinion-item:hover .opinion-photo img {
	transform: scale(1.06);
}

.opinion-photo-fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 44px;
	color: #bbb;
}

.opinion-content {
	flex: 1;
	min-width: 0;
}

.opinion-title {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 6px;
}

.opinion-title a {
	color: #111;
}

.opinion-title a:hover {
	color: var(--cd-primary);
}

.opinion-author a {
	color: var(--cd-primary);
	font-size: 17px;
}

@media (max-width: 991px) {
	.opinion-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 575px) {
	.opinion-grid {
		grid-template-columns: 1fr;
	}
	.opinion-photo {
		flex: 0 0 90px;
		width: 90px;
		height: 90px;
	}
}

/* =========================================
   Premium Polish - crisp white + red accent
========================================= */
.main_website {
	background: #ffffff;
}

/* Softer, cleaner cards instead of blue-tinted boxes */
.secThree-bg,
.secThree-wrpp,
.bg2,
.division,
.white-bg {
	background: #ffffff !important;
	border: 1px solid #eee;
	box-shadow: 0 1px 4px rgba(0,0,0,.05) !important;
	border-radius: 6px;
	overflow: hidden;
}

/* Rounded, smooth images across news boxes */
.sec-one-image img,
.sec-theee-image img,
.sec-theee-image2 img,
.secFive-image img,
.secFive-smallImg img,
.secFour-image img,
.secSeven-image img,
.secEight-image img,
.smallImg img {
	border-radius: 6px;
	transition: transform .4s ease, opacity .3s ease;
}

.sec-one-image,
.sec-theee-image,
.sec-theee-image2,
.secFive-image,
.secFour-image,
.secSeven-image,
.secEight-image {
	overflow: hidden;
	border-radius: 6px;
}

.sec-one-image:hover img,
.sec-theee-image:hover img,
.sec-theee-image2:hover img,
.secFive-image:hover img,
.secFour-image:hover img,
.secSeven-image:hover img,
.secEight-image:hover img {
	transform: scale(1.04);
}

/* Old dark-red hovers -> theme red accent */
.secThree-title a:hover,
.secThree-title2 a:hover,
.secFive-title a:hover,
.secFive_title2 a:hover,
.secFour-title a:hover,
.secSeven-title a:hover,
.secSeven-title2 a:hover,
.secEight-title a:hover,
.secOne_smallTitle a:hover,
.sec-two-title a:hover {
	color: var(--cd-primary) !important;
}

/* Section spacing rhythm */
.section-one,
.section-two,
.section-three,
.section-four,
.section-five,
.section-six {
	padding-top: 25px;
	padding-bottom: 25px;
}




/* =========================================
   News Box (nwb) - Section Three & Nine
   [ small items | big featured | small items ]
========================================= */
.newsbox-sec {
	background: #ffffff;
	padding: 28px 0 32px;
}

.nwb-small-item {
	margin-bottom: 24px;
}

.nwb-small-item:last-child {
	margin-bottom: 0;
}

.nwb-small-thumb,
.nwb-featured-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.nwb-small-thumb img,
.nwb-featured-thumb img {
	width: 100% !important;
	display: block;
	object-fit: cover;
	border-radius: 6px;
	transition: transform .4s ease;
}

.nwb-small-thumb img {
	height: 150px !important;
}

.nwb-featured-thumb img {
	height: 340px !important;
}

.nwb-small-item:hover .nwb-small-thumb img,
.nwb-featured:hover .nwb-featured-thumb img {
	transform: scale(1.04);
}

.nwb-small-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	margin: 10px 0 0;
}

.nwb-small-title a {
	color: #1a1a1a;
}

.nwb-small-title a:hover {
	color: var(--cd-primary);
}

.nwb-featured-title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.45;
	margin: 14px 0 10px;
}

.nwb-featured-title a {
	color: #111;
}

.nwb-featured-title a:hover {
	color: var(--cd-primary);
}

.nwb-excerpt {
	font-size: 17px;
	line-height: 1.7;
	color: #555;
}

.nwb-excerpt a {
	color: var(--cd-primary);
	font-weight: 600;
}

.nwb-map-header {
	margin-bottom: 14px;
}

@media (max-width: 991px) {
	.nwb-featured-title {
		font-size: 22px;
	}
	.nwb-featured-thumb img {
		height: 260px !important;
	}
}

@media (max-width: 767px) {
	.newsbox-sec .col-md-3,
	.newsbox-sec .col-md-6 {
		max-width: 100%;
	}
	/* Featured item first on mobile */
	.newsbox-sec .col-md-6 {
		order: -1;
	}
	.nwb-featured {
		margin-bottom: 24px;
	}
	.nwb-small-item {
		margin-bottom: 20px;
	}
	.nwb-small-thumb img {
		height: 200px !important;
	}
}




/* =========================================
   Section Nine - Special Report Box (spr)
   2x2 grid: image left, title + excerpt right
========================================= */
.special-report-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.spr-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 34px 60px;
}

.spr-item {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.spr-thumb {
	position: relative;
	flex: 0 0 44%;
	max-width: 44%;
	overflow: hidden;
	border-radius: 6px;
}

.spr-thumb img {
	width: 100% !important;
	height: 195px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.spr-item:hover .spr-thumb img {
	transform: scale(1.04);
}

.spr-content {
	flex: 1;
	min-width: 0;
}

.spr-title {
	font-size: 21px;
	font-weight: 700;
	line-height: 1.45;
	margin: 0 0 8px;
}

.spr-title a {
	color: #111;
}

.spr-title a:hover {
	color: var(--cd-primary);
}

.spr-excerpt {
	font-size: 16px;
	line-height: 1.7;
	color: #555;
}

@media (max-width: 991px) {
	.spr-grid {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

@media (max-width: 575px) {
	.spr-item {
		flex-direction: column;
		gap: 12px;
	}
	.spr-thumb {
		flex: 0 0 100%;
		max-width: 100%;
		width: 100%;
	}
	.spr-thumb img {
		height: 210px !important;
	}
}




/* =========================================
   Map form fix - three selects in one line
========================================= */
.map-area form {
	display: flex !important;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 5px 8px !important;
}

.map-area form > div {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	flex: 1 1 0;
	min-width: 0;
}

.map-area form > div.codedokan-1 {
	flex: 1 1 100%;
	margin-top: 4px !important;
}

.map-area form select.form-control {
	width: 100% !important;
	padding: 8px 4px !important;
	font-size: 15px !important;
	border: 1px solid #ddd;
	border-radius: 4px;
	color: #333;
	background-color: #fff;
}

/* =========================================
   Section Eleven (s11) - headline box
========================================= */
.s11-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.s11-featured {
	display: flex;
	gap: 24px;
	align-items: flex-start;
}

.s11-featured-thumb {
	position: relative;
	flex: 0 0 48%;
	max-width: 48%;
	overflow: hidden;
	border-radius: 6px;
}

.s11-featured-thumb img {
	width: 100% !important;
	height: 265px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s11-featured:hover .s11-featured-thumb img {
	transform: scale(1.04);
}

.s11-featured-content {
	flex: 1;
	min-width: 0;
}

.s11-featured-title {
	font-size: 30px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 12px;
}

.s11-featured-title a {
	color: #111;
}

.s11-featured-title a:hover {
	color: var(--cd-primary);
}

.s11-excerpt {
	font-size: 17px;
	line-height: 1.7;
	color: #555;
}

.s11-excerpt a {
	color: var(--cd-primary);
	font-weight: 600;
}

.s11-side {
	border-left: 1px solid #e5e5e5;
	padding-left: 22px;
	height: 100%;
}

.s11-side-item {
	display: flex;
	gap: 15px;
	align-items: flex-start;
	padding-bottom: 18px;
	margin-bottom: 18px;
	border-bottom: 1px solid #e5e5e5;
}

.s11-side-item:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.s11-side-title {
	flex: 1;
	min-width: 0;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0;
}

.s11-side-title a {
	color: #111;
}

.s11-side-title a:hover {
	color: var(--cd-primary);
}

.s11-side-thumb {
	flex: 0 0 110px;
	max-width: 110px;
	overflow: hidden;
	border-radius: 6px;
}

.s11-side-thumb img {
	width: 100% !important;
	height: 80px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s11-side-item:hover .s11-side-thumb img {
	transform: scale(1.05);
}

.s11-grid {
	border-top: 1px solid #e5e5e5;
	margin-top: 28px;
	padding-top: 28px;
}

@media (max-width: 991px) {
	.s11-featured {
		flex-direction: column;
		gap: 14px;
	}
	.s11-featured-thumb {
		flex: 0 0 100%;
		max-width: 100%;
		width: 100%;
	}
	.s11-featured-title {
		font-size: 23px;
	}
}

@media (max-width: 767px) {
	.s11-side {
		border-left: none;
		padding-left: 0;
		margin-top: 24px;
		border-top: 1px solid #e5e5e5;
		padding-top: 20px;
	}
}




/* =========================================
   Section Eight (s8) - খেলাধুলা style box
========================================= */
.s8-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.s8-header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 24px;
}

.s8-title {
	font-size: 28px;
	font-weight: 700;
	margin: 0 22px 0 0;
	padding: 0;
	line-height: 1;
}

.s8-title a {
	color: #111;
}

.s8-title a:hover {
	color: var(--cd-primary);
}

.s8-subcats {
	margin: 0;
	padding: 0;
	list-style: none;
	flex: 1;
}

.s8-subcats li {
	display: inline-block;
	margin-right: 18px;
}

.s8-subcats li a {
	color: #333;
	font-size: 18px;
}

.s8-subcats li a:hover {
	color: var(--cd-primary);
}

.s8-featured-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.s8-featured-thumb img {
	width: 100% !important;
	height: 400px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s8-featured:hover .s8-featured-thumb img {
	transform: scale(1.03);
}

.s8-tag {
	display: inline-block;
	margin-top: 16px;
}

.s8-tag a {
	color: var(--cd-primary);
	font-size: 17px;
	font-weight: 700;
}

.s8-featured-title {
	font-size: 30px;
	font-weight: 700;
	line-height: 1.4;
	margin: 8px 0 12px;
}

.s8-featured-title a {
	color: #111;
}

.s8-featured-title a:hover {
	color: var(--cd-primary);
}

.s8-excerpt {
	font-size: 17px;
	line-height: 1.7;
	color: #555;
}

.s8-excerpt a {
	color: var(--cd-primary);
	font-weight: 600;
}

.s8-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px 24px;
}

.s8-item-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.s8-item-thumb img {
	width: 100% !important;
	height: 165px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s8-item:hover .s8-item-thumb img {
	transform: scale(1.05);
}

.s8-item-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	margin: 10px 0 0;
}

.s8-item-title a {
	color: #1a1a1a;
}

.s8-item-title a:hover {
	color: var(--cd-primary);
}

@media (max-width: 991px) {
	.s8-featured-thumb img {
		height: 300px !important;
	}
	.s8-featured-title {
		font-size: 23px;
	}
}

@media (max-width: 767px) {
	.s8-featured {
		margin-bottom: 26px;
	}
	.s8-featured-thumb img {
		height: 230px !important;
	}
	.s8-title {
		font-size: 23px;
		margin-right: 15px;
	}
}

@media (max-width: 480px) {
	.s8-grid {
		grid-template-columns: 1fr;
	}
	.s8-item-thumb img {
		height: 200px !important;
	}
}




/* =========================================
   Top Section 1 - full width 4 bordered cards
========================================= */
.top1-box {
	background: #ffffff;
	padding: 22px 0 10px;
}

.top1-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.top1-item {
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 6px;
	padding: 12px 12px 16px;
	box-shadow: 0 1px 3px rgba(0,0,0,.04);
	transition: box-shadow .3s ease;
}

.top1-item:hover {
	box-shadow: 0 3px 10px rgba(0,0,0,.09);
}

.top1-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 5px;
}

.top1-thumb img {
	width: 100% !important;
	height: 170px !important;
	object-fit: cover;
	display: block;
	border-radius: 5px;
	transition: transform .4s ease;
}

.top1-item:hover .top1-thumb img {
	transform: scale(1.05);
}

.top1-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	margin: 12px 0 0;
}

.top1-title a {
	color: #1a1a1a;
}

.top1-title a:hover {
	color: var(--cd-primary);
}

/* =========================================
   Top Section 2 - news box left, 2 ads right
========================================= */
.top2-box {
	background: #ffffff;
	padding: 15px 0 25px;
}

.top2-featured-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.top2-featured-thumb img {
	width: 100% !important;
	height: 250px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.top2-featured:hover .top2-featured-thumb img {
	transform: scale(1.03);
}

.top2-featured-title {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.4;
	margin: 14px 0 10px;
}

.top2-featured-title a {
	color: #111;
}

.top2-featured-title a:hover {
	color: var(--cd-primary);
}

.top2-excerpt {
	font-size: 16px;
	line-height: 1.7;
	color: #555;
}

.top2-excerpt a {
	color: var(--cd-primary);
	font-weight: 600;
}

.top2-side {
	border-left: 1px solid #e5e5e5;
	padding-left: 20px;
	height: 100%;
}

.top2-side .s11-side-item {
	padding-bottom: 14px;
	margin-bottom: 14px;
}

.top2-side .s11-side-thumb img {
	height: 72px !important;
}

.top2-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px 20px;
	border-top: 1px solid #e5e5e5;
	margin-top: 26px;
	padding-top: 26px;
}

.top2-item-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.top2-item-thumb img {
	width: 100% !important;
	height: 135px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.top2-item:hover .top2-item-thumb img {
	transform: scale(1.05);
}

.top2-item-title {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.5;
	margin: 10px 0 0;
}

.top2-item-title a {
	color: #1a1a1a;
}

.top2-item-title a:hover {
	color: var(--cd-primary);
}

.top2-ads .top2-ad {
	margin-bottom: 20px;
	text-align: center;
}

.top2-ads .top2-ad:last-child {
	margin-bottom: 0;
}

.top2-ads .top2-ad img {
	max-width: 100%;
	height: auto;
	display: inline-block;
	border-radius: 6px;
}

@media (max-width: 991px) {
	.top1-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.top2-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.top2-featured-title {
		font-size: 21px;
	}
}

@media (max-width: 767px) {
	.top2-side {
		border-left: none;
		padding-left: 0;
		margin-top: 22px;
		border-top: 1px solid #e5e5e5;
		padding-top: 20px;
	}
	.top2-ads {
		margin-top: 26px;
	}
}

@media (max-width: 575px) {
	.top1-grid {
		grid-template-columns: 1fr;
	}
	.top2-grid {
		grid-template-columns: 1fr;
	}
	.top1-thumb img {
		height: 200px !important;
	}
}




/* =========================================
   Modern News Headline Ticker
========================================= */
.ticker-modern .scroll-section5 {
	margin: 4px 0 18px;
}

.ticker-modern .alert {
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	background: transparent !important;
}

.ticker-bar {
	display: flex !important;
	align-items: center;
	background: #ffffff;
	border: 1px solid #ececec;
	border-radius: 50px;
	box-shadow: 0 2px 10px rgba(0,0,0,.06);
	height: 50px;
	overflow: hidden;
	padding: 0 !important;
}

/* Label pill */
.ticker-label {
	display: flex;
	align-items: center;
	gap: 9px;
	flex: 0 0 auto;
	margin-left: 7px;
	padding: 0 20px;
	height: 36px;
	border-radius: 50px;
	background: linear-gradient(135deg, var(--cd-primary), var(--cd-primary-dark));
	color: #ffffff;
	font-size: 17px;
	font-weight: 700;
	white-space: nowrap;
	letter-spacing: .2px;
}

/* Pulsing live dot */
.ticker-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffffff;
	position: relative;
	flex: 0 0 auto;
	animation: tickerPulse 1.6s ease-out infinite;
}

@keyframes tickerPulse {
	0%   { box-shadow: 0 0 0 0 rgba(255,255,255,.65); }
	70%  { box-shadow: 0 0 0 7px rgba(255,255,255,0); }
	100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

/* Scrolling track */
.ticker-bar .scroll5-right {
	flex: 1;
	min-width: 0;
	height: 50px !important;
	line-height: 50px !important;
	background: transparent !important;
	padding: 0 14px;
}

.ticker-bar .scroll5-right a {
	color: #222 !important;
	font-weight: 500;
	margin-right: 0 !important;
	transition: color .25s ease;
}

.ticker-bar .scroll5-right a:hover {
	color: var(--cd-primary) !important;
}

/* Red dot separator between headlines */
.ticker-bar .scroll5-right a::after {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--cd-primary);
	margin: 0 22px;
	vertical-align: middle;
	opacity: .85;
}

.ticker-bar .scroll5-right img {
	vertical-align: middle;
	border-radius: 3px;
}

/* Close button */
.ticker-close {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	margin-right: 9px;
	border: none;
	border-radius: 50%;
	background: #f1f1f1;
	color: #555;
	font-size: 20px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all .25s ease;
	padding: 0 0 3px;
}

.ticker-close:hover {
	background: var(--cd-primary);
	color: #ffffff;
	transform: rotate(90deg);
}

@media (max-width: 767px) {
	.ticker-bar {
		height: 44px;
	}
	.ticker-label {
		padding: 0 14px;
		height: 32px;
		font-size: 15px;
	}
	.ticker-bar .scroll5-right {
		height: 44px !important;
		line-height: 44px !important;
		padding: 0 8px;
	}
	.ticker-bar .scroll5-right a::after {
		margin: 0 14px;
	}
	.ticker-close {
		width: 28px;
		height: 28px;
		font-size: 17px;
	}
}

@media (max-width: 420px) {
	.ticker-label-text {
		display: none;
	}
	.ticker-label {
		padding: 0 12px;
	}
}




/* =========================================
   Slanted category title (Section Five, Seven, Twelve)
========================================= */
.cat-slant {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #fdf3f3;
	border-radius: 3px;
	overflow: hidden;
	margin: 0 0 18px;
	padding: 0;
	height: 44px;
}

.cat-slant .cat-slant-name {
	position: relative;
	display: inline-block;
	background: var(--cd-primary);
	color: #fff !important;
	font-size: 20px;
	font-weight: 700;
	line-height: 44px;
	padding: 0 42px 0 20px;
	margin: 0;
	clip-path: polygon(0 0, 100% 0, calc(100% - 26px) 100%, 0 100%);
	transition: filter .3s ease;
}

.cat-slant .cat-slant-name:hover {
	filter: brightness(1.1);
	color: #fff !important;
}

.cat-slant .cat-slant-name i {
	margin-right: 6px;
	font-size: 19px;
	vertical-align: -1px;
}

.cat-slant .cat-slant-more {
	padding-right: 16px;
	font-size: 16px;
	white-space: nowrap;
}

.cat-slant .cat-slant-more a {
	color: #444;
}

.cat-slant .cat-slant-more a:hover {
	color: var(--cd-primary);
}

@media (max-width: 575px) {
	.cat-slant {
		height: 40px;
	}
	.cat-slant .cat-slant-name {
		font-size: 18px;
		line-height: 40px;
		padding: 0 36px 0 15px;
	}
	.cat-slant .cat-slant-more {
		font-size: 15px;
	}
}

/* =========================================
   Section Four (s4) - বিনোদন style box
========================================= */
.s4-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.s4-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	margin: 0 0 22px;
	padding: 0;
}

.s4-title > a {
	color: #111;
}

.s4-title > a:hover {
	color: var(--cd-primary);
}

.s4-side-item {
	padding-bottom: 18px;
	margin-bottom: 18px;
	border-bottom: 1px solid #e5e5e5;
}

.s4-side-item:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.s4-side-thumb,
.s4-featured-thumb,
.s4-item-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.s4-side-thumb img {
	width: 100% !important;
	height: 145px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s4-side-item:hover .s4-side-thumb img {
	transform: scale(1.05);
}

.s4-side-title {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.5;
	margin: 10px 0 0;
}

.s4-side-title a {
	color: #1a1a1a;
}

.s4-side-title a:hover {
	color: var(--cd-primary);
}

.s4-featured-thumb img {
	width: 100% !important;
	height: 400px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s4-featured:hover .s4-featured-thumb img {
	transform: scale(1.03);
}

.s4-featured-title {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	margin: 16px 0 12px;
}

.s4-featured-title a {
	color: #111;
}

.s4-featured-title a:hover {
	color: var(--cd-primary);
}

.s4-excerpt {
	font-size: 16px;
	line-height: 1.75;
	color: #555;
}

.s4-excerpt a {
	color: var(--cd-primary);
	font-weight: 600;
}

.s4-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	border-top: 1px solid #e5e5e5;
	margin-top: 26px;
	padding-top: 26px;
}

.s4-item {
	padding: 0 20px;
	border-right: 1px solid #e5e5e5;
}

.s4-item:first-child {
	padding-left: 0;
}

.s4-item:last-child {
	padding-right: 0;
	border-right: none;
}

.s4-item-thumb img {
	width: 100% !important;
	height: 175px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.s4-item:hover .s4-item-thumb img {
	transform: scale(1.05);
}

.s4-item-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	margin: 12px 0 0;
}

.s4-item-title a {
	color: #1a1a1a;
}

.s4-item-title a:hover {
	color: var(--cd-primary);
}

@media (max-width: 991px) {
	.s4-featured-thumb img {
		height: 300px !important;
	}
	.s4-featured-title {
		font-size: 22px;
	}
	.s4-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px 0;
	}
	.s4-item:nth-child(2n) {
		border-right: none;
		padding-right: 0;
	}
	.s4-item:nth-child(2n+1) {
		padding-left: 0;
	}
}

@media (max-width: 767px) {
	.s4-featured {
		margin-bottom: 24px;
	}
	.s4-side-left {
		margin-bottom: 24px;
	}
	.s4-side-right {
		margin-top: 24px;
	}
	.s4-featured-thumb img {
		height: 240px !important;
	}
	.s4-title {
		font-size: 22px;
	}
}

@media (max-width: 575px) {
	.s4-grid {
		grid-template-columns: 1fr;
	}
	.s4-item {
		padding: 0 !important;
		border-right: none;
	}
	.s4-side-thumb img,
	.s4-item-thumb img {
		height: 200px !important;
	}
}




/* =========================================
   Latest / Most Read tab box (news-tabs)
========================================= */
.news-tabs {
	margin-top: 20px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 4px;
	overflow: hidden;
}

.news-tabs-nav {
	display: flex;
}

.news-tabs-nav .news-tab-btn {
	flex: 1;
	border: none;
	outline: none;
	cursor: pointer;
	background: #ededed;
	color: #333;
	font-family: inherit;
	font-size: 18px;
	font-weight: 700;
	padding: 12px 6px;
	line-height: 1.4;
	transition: background .25s ease, color .25s ease;
}

.news-tabs-nav .news-tab-btn.active {
	background: var(--cd-primary);
	color: #ffffff;
}

.news-tab-panel {
	display: none;
	max-height: 430px;
	overflow-y: auto;
}

.news-tab-panel.active {
	display: block;
}

.news-tab-panel::-webkit-scrollbar {
	width: 6px;
}

.news-tab-panel::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 3px;
}

.news-tab-item {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 12px 12px;
	border-bottom: 1px solid #eee;
}

.news-tab-item:last-child {
	border-bottom: none;
}

.news-tab-thumb {
	flex: 0 0 90px;
	max-width: 90px;
	overflow: hidden;
	border-radius: 4px;
}

.news-tab-thumb img {
	width: 100% !important;
	height: 62px !important;
	object-fit: cover;
	display: block;
	border-radius: 4px;
	transition: transform .4s ease;
}

.news-tab-item:hover .news-tab-thumb img {
	transform: scale(1.06);
}

.news-tab-title {
	flex: 1;
	min-width: 0;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.5;
	margin: 0;
}

.news-tab-title a {
	color: #1a1a1a;
}

.news-tab-title a:hover {
	color: var(--cd-primary);
}

.news-tabs-btn {
	display: block;
	text-align: center;
	background: var(--cd-primary);
	color: #ffffff !important;
	font-size: 18px;
	font-weight: 700;
	padding: 11px 8px;
	transition: filter .25s ease;
}

.news-tabs-btn:hover {
	filter: brightness(1.1);
	color: #ffffff !important;
}

@media (max-width: 767px) {
	.news-tab-panel {
		max-height: 360px;
	}
}




/* =========================================
   Top Section 3 - ad, video strip, news box, ad
========================================= */
.top3-box {
	background: #ffffff;
	padding: 10px 0 20px;
}

.top3-box .top3-ad {
	text-align: center;
	margin: 18px 0;
}

.top3-box .top3-ad img {
	max-width: 100%;
	height: auto;
	display: inline-block;
	border-radius: 6px;
}

/* ---------- Video box ---------- */
.t3-video {
	border: 1px solid #e8e8e8;
	border-radius: 8px;
	padding: 16px 18px 20px;
	margin-bottom: 24px;
}

.t3-video-head,
.t3-news-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.t3-video-title,
.t3-news-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	padding: 0;
}

.t3-video-title a,
.t3-news-title a {
	color: #111;
}

.t3-video-title a:hover,
.t3-news-title a:hover {
	color: var(--cd-primary);
}

.t3-video-icon,
.t3-news-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 7px;
	background: var(--cd-primary);
	color: #fff;
	font-size: 17px;
}

.t3-more {
	color: #444;
	font-size: 17px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.t3-more:hover {
	color: var(--cd-primary);
}

.t3-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid #333;
	color: #222;
	font-size: 18px;
	transition: all .3s ease;
}

.t3-arrow:hover {
	background: var(--cd-primary);
	border-color: var(--cd-primary);
	color: #fff;
}

.t3-video-strip {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	padding-bottom: 6px;
	scroll-snap-type: x proximity;
}

.t3-video-strip::-webkit-scrollbar {
	height: 6px;
}

.t3-video-strip::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 3px;
}

.t3-video-item {
	flex: 0 0 250px;
	max-width: 250px;
	scroll-snap-align: start;
}

.t3-video-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 6px;
}

.t3-video-thumb img {
	width: 100% !important;
	height: 145px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.t3-video-item:hover .t3-video-thumb img {
	transform: scale(1.05);
}

.t3-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 48px;
	height: 48px;
	line-height: 48px;
	text-align: center;
	border-radius: 50%;
	background: rgba(255,255,255,.92);
	color: #111;
	font-size: 20px;
	box-shadow: 0 2px 8px rgba(0,0,0,.25);
	transition: all .3s ease;
}

.t3-play i {
	margin-left: 3px;
}

.t3-video-thumb:hover .t3-play {
	background: var(--cd-primary);
	color: #fff;
	transform: translate(-50%, -50%) scale(1.08);
}

.t3-video-name {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.5;
	margin: 11px 0 6px;
}

.t3-video-name a {
	color: #1a1a1a;
}

.t3-video-name a:hover {
	color: var(--cd-primary);
}

.t3-video-date {
	font-size: 14px;
	color: #888;
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

/* ---------- News box ---------- */
.t3-news {
	margin-bottom: 24px;
}

.t3-news-head {
	border-bottom: 2px solid #111;
	padding-bottom: 12px;
	margin-bottom: 20px;
}

.t3-news-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.t3-news-item {
	border: 1px solid #e8e8e8;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	transition: box-shadow .3s ease;
	display: flex;
	flex-direction: column;
}

.t3-news-item:hover {
	box-shadow: 0 3px 12px rgba(0,0,0,.09);
}

.t3-news-thumb {
	position: relative;
	overflow: hidden;
}

.t3-news-thumb img {
	width: 100% !important;
	height: 175px !important;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
}

.t3-news-item:hover .t3-news-thumb img {
	transform: scale(1.05);
}

.t3-news-content {
	padding: 14px 16px 18px;
	flex: 1;
}

.t3-news-name {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 10px;
}

.t3-news-name a {
	color: #111;
}

.t3-news-name a:hover {
	color: var(--cd-primary);
}

.t3-news-excerpt {
	font-size: 15px;
	line-height: 1.7;
	color: #666;
}

@media (max-width: 991px) {
	.t3-news-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.t3-video-title,
	.t3-news-title {
		font-size: 21px;
	}
}

@media (max-width: 575px) {
	.t3-news-grid {
		grid-template-columns: 1fr;
	}
	.t3-video-item {
		flex: 0 0 210px;
		max-width: 210px;
	}
	.t3-video {
		padding: 14px 12px 16px;
	}
}




/* =========================================
   Top Section 3 - fixes: inside left column,
   centered play icon, responsive video slider
========================================= */
.top3-box {
	padding: 0 0 6px;
}

.top3-box .top3-inner {
	width: 100%;
}

.top3-box .top3-ad {
	margin: 22px 0;
}

/* newsimage() prints its own <a>, so the thumb wrapper must position it */
.t3-video-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 6px;
	line-height: 0;
}

.t3-video-thumb a {
	display: block;
	line-height: 0;
}

.t3-video-thumb img {
	width: 100% !important;
	height: 145px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

/* Play icon: always dead-centre on the thumbnail */
.t3-video-thumb .t3-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	line-height: 1;
	border-radius: 50%;
	background: rgba(255,255,255,.92);
	color: #111 !important;
	font-size: 20px;
	box-shadow: 0 2px 8px rgba(0,0,0,.25);
	z-index: 3;
	transition: background .3s ease, color .3s ease, transform .3s ease;
}

.t3-video-item:hover .t3-play {
	background: var(--cd-primary);
	color: #fff !important;
	transform: translate(-50%, -50%) scale(1.08);
}

/* Slider with side arrows */
.t3-video-slider {
	position: relative;
}

.t3-video-slider .t3-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	width: 38px;
	height: 38px;
	border: none;
	border-radius: 50%;
	background: #ffffff;
	color: #222;
	font-size: 18px;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0,0,0,.22);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .3s ease, color .3s ease;
}

.t3-video-slider .t3-nav:hover {
	background: var(--cd-primary);
	color: #fff;
}

.t3-video-slider .t3-prev {
	left: -6px;
}

.t3-video-slider .t3-next {
	right: -6px;
}

.t3-video-strip {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	scroll-behavior: smooth;
	padding-bottom: 6px;
	scrollbar-width: none;
}

.t3-video-strip::-webkit-scrollbar {
	display: none;
}

/* Responsive item widths */
.t3-video-item {
	flex: 0 0 calc((100% - 36px) / 3);
	max-width: none;
}

@media (max-width: 991px) {
	.t3-video-item {
		flex: 0 0 calc((100% - 18px) / 2);
	}
	.t3-video-thumb img {
		height: 160px !important;
	}
}

@media (max-width: 575px) {
	.t3-video-item {
		flex: 0 0 78%;
	}
	.t3-video-thumb img {
		height: 175px !important;
	}
	.t3-video-slider .t3-nav {
		width: 32px;
		height: 32px;
		font-size: 15px;
	}
	.t3-video-slider .t3-prev { left: -4px; }
	.t3-video-slider .t3-next { right: -4px; }
	.top3-box .top3-ad {
		margin: 16px 0;
	}
}

/* News box inside the narrower column */
@media (min-width: 992px) {
	.t3-news-grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 18px;
	}
	.t3-news-thumb img {
		height: 150px !important;
	}
	.t3-news-name {
		font-size: 17px;
	}
	.t3-news-excerpt {
		font-size: 14px;
	}
}




/* =========================================
   Home right free widget area (below tabs)
========================================= */
.hrbt-area {
	margin-top: 20px;
}

.hrbt-area .hrbt-widget {
	margin-bottom: 20px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 4px;
	overflow: hidden;
}

.hrbt-area .hrbt-widget:last-child {
	margin-bottom: 0;
}

.hrbt-area .hrbt-title {
	background: var(--cd-primary);
	color: #ffffff;
	font-size: 19px;
	font-weight: 700;
	margin: 0;
	padding: 11px 15px;
	line-height: 1.4;
}

.hrbt-area .hrbt-title a {
	color: #ffffff;
}

.hrbt-area .hrbt-widget > *:not(.hrbt-title) {
	padding-left: 15px;
	padding-right: 15px;
}

.hrbt-area .hrbt-widget > ul,
.hrbt-area .hrbt-widget > ol {
	margin: 0;
	padding: 8px 15px 12px;
	list-style: none;
}

.hrbt-area .hrbt-widget li {
	padding: 8px 0;
	border-bottom: 1px solid #eee;
	font-size: 16px;
	line-height: 1.6;
}

.hrbt-area .hrbt-widget li:last-child {
	border-bottom: none;
}

.hrbt-area .hrbt-widget li a {
	color: #222;
}

.hrbt-area .hrbt-widget li a:hover {
	color: var(--cd-primary);
}

.hrbt-area .hrbt-widget img,
.hrbt-area .hrbt-widget iframe {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Ad / raw HTML widgets: no inner padding, image fills the box */
.hrbt-area .widget_media_image,
.hrbt-area .widget_custom_html {
	border: none;
	background: transparent;
}

.hrbt-area .widget_media_image > *:not(.hrbt-title),
.hrbt-area .widget_custom_html > *:not(.hrbt-title) {
	padding-left: 0;
	padding-right: 0;
}

.hrbt-area .widget_media_image img {
	border-radius: 6px;
	width: 100%;
}




/* =========================================
   PWA install banner
========================================= */
.codedokan-pwa-banner {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: 12px;
	z-index: 9999;
	display: flex;
	align-items: center;
	gap: 12px;
	background: #ffffff;
	border: 1px solid #e3e3e3;
	border-radius: 10px;
	box-shadow: 0 6px 22px rgba(0,0,0,.18);
	padding: 12px 14px;
	animation: cpbUp .35s ease;
}

.codedokan-pwa-banner[hidden] {
	display: none;
}

@keyframes cpbUp {
	from { transform: translateY(24px); opacity: 0; }
	to   { transform: translateY(0); opacity: 1; }
}

.codedokan-pwa-banner .cpb-text {
	flex: 1;
	font-size: 17px;
	font-weight: 600;
	color: #222;
	line-height: 1.4;
}

.codedokan-pwa-banner .cpb-install {
	background: var(--cd-primary);
	color: #fff;
	border: none;
	border-radius: 6px;
	padding: 9px 20px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	transition: filter .25s ease;
}

.codedokan-pwa-banner .cpb-install:hover {
	filter: brightness(1.1);
}

.codedokan-pwa-banner .cpb-close {
	background: transparent;
	border: none;
	color: #999;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
}

.codedokan-pwa-banner .cpb-close:hover {
	color: #333;
}

@media (min-width: 768px) {
	.codedokan-pwa-banner {
		left: auto;
		right: 20px;
		bottom: 20px;
		max-width: 400px;
	}
}




/* =========================================
   Header 3 - Hijri date + translate buttons
========================================= */
.codedokan_header3 .header3-date-line3 {
	color: #666;
	font-size: 16px;
}

.codedokan_header3 .header3-translate {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 10px;
}

.header3-translate .ct-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #f1f1f1;
	color: #444;
	border: 1px solid #e2e2e2;
	border-radius: 20px;
	padding: 5px 14px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
	cursor: pointer;
	transition: background .25s ease, color .25s ease, border-color .25s ease;
}

.header3-translate .ct-btn i {
	font-size: 17px;
}

.header3-translate .ct-btn:hover {
	background: #e6e6e6;
}

.header3-translate .ct-btn.active {
	background: var(--cd-primary);
	border-color: var(--cd-primary);
	color: #ffffff;
}

/* Hide Google's own widget UI and top banner */
#google_translate_element,
.goog-te-banner-frame,
.goog-te-gadget,
.skiptranslate iframe {
	display: none !important;
}

body {
	top: 0 !important;
}

.goog-text-highlight {
	background: none !important;
	box-shadow: none !important;
}

@media (max-width: 767px) {
	.codedokan_header3 .header3-translate {
		justify-content: center;
		margin-top: 12px;
	}
}




/* =========================================
   Header 3 - menu bar tools (search + archive)
========================================= */
.menu_section_three {
	position: relative;
}

.h3-tools {
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	gap: 4px;
	z-index: 20;
}

.h3-tools .h3-tool-btn {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	border-radius: 50%;
	color: #ffffff;
	font-size: 21px;
	cursor: pointer;
	padding: 0;
	transition: background .25s ease;
}

.h3-tools .h3-tool-btn:hover,
.h3-tools .h3-tool-btn.active {
	background: rgba(0, 0, 0, .22);
}

/* Sliding panels below the menu bar */
.h3-panel {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 60;
	background: #ffffff;
	border-bottom: 3px solid var(--cd-primary);
	box-shadow: 0 8px 20px rgba(0,0,0,.14);
	padding: 14px 0;
	animation: h3PanelDown .22s ease;
}

.h3-panel[hidden] {
	display: none;
}

@keyframes h3PanelDown {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: translateY(0); }
}

.h3-search-form,
.h3-archive-inner {
	display: flex;
	align-items: center;
	gap: 10px;
}

.h3-search-form input[type="search"] {
	flex: 1;
	min-width: 0;
	height: 46px;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 0 15px;
	font-family: inherit;
	font-size: 17px;
	color: #222;
	outline: none;
}

.h3-search-form input[type="search"]:focus {
	border-color: var(--cd-primary);
}

.h3-search-form button[type="submit"],
.h3-archive-form button,
.h3-today-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	height: 46px;
	padding: 0 22px;
	background: var(--cd-primary);
	color: #ffffff !important;
	border: none;
	border-radius: 6px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: filter .25s ease;
}

.h3-search-form button[type="submit"]:hover,
.h3-archive-form button:hover,
.h3-today-btn:hover {
	filter: brightness(1.1);
}

.h3-today-btn {
	background: #333;
}

.h3-panel-close {
	width: 42px;
	height: 42px;
	flex: 0 0 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f1f1f1;
	border: none;
	border-radius: 50%;
	color: #555;
	font-size: 20px;
	cursor: pointer;
	transition: background .25s ease, color .25s ease;
}

.h3-panel-close:hover {
	background: #e2e2e2;
	color: #111;
}

.h3-archive-label {
	font-size: 17px;
	font-weight: 600;
	color: #222;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
}

.h3-archive-label i {
	color: var(--cd-primary);
	font-size: 20px;
}

.h3-archive-form {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1;
}

.h3-archive-form input[type="date"] {
	height: 46px;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 0 12px;
	font-family: inherit;
	font-size: 16px;
	color: #222;
	outline: none;
	background: #fff;
	min-width: 170px;
}

.h3-archive-form input[type="date"]:focus {
	border-color: var(--cd-primary);
}

/* Keep the hamburger clear of the tool icons on mobile */
@media (max-width: 767px) {
	.h3-tools {
		right: 62px;
		gap: 0;
	}

	.h3-tools .h3-tool-btn {
		width: 42px;
		height: 42px;
		font-size: 20px;
	}

	.h3-panel {
		padding: 12px 0;
	}

	.h3-search-form input[type="search"] {
		height: 44px;
		font-size: 16px;
	}

	.h3-search-form button[type="submit"] {
		padding: 0 16px;
	}

	.h3-search-form button[type="submit"] span {
		display: none;
	}

	/* Archive panel stacks on small screens */
	.h3-archive-inner {
		flex-wrap: wrap;
		position: relative;
		padding-right: 46px;
	}

	.h3-archive-label {
		flex: 1 1 100%;
		font-size: 16px;
		margin-bottom: 2px;
	}

	.h3-archive-form {
		flex: 1 1 100%;
	}

	.h3-archive-form input[type="date"] {
		flex: 1;
		min-width: 0;
		height: 44px;
	}

	.h3-archive-form button {
		height: 44px;
		padding: 0 18px;
	}

	.h3-today-btn {
		flex: 1 1 100%;
		height: 42px;
		margin-top: 2px;
	}

	.h3-archive-inner .h3-panel-close {
		position: absolute;
		top: 0;
		right: 0;
		width: 38px;
		height: 38px;
		flex: 0 0 38px;
	}
}

@media (max-width: 400px) {
	.h3-tools {
		right: 56px;
	}
	.h3-tools .h3-tool-btn {
		width: 38px;
		height: 38px;
		font-size: 19px;
	}
}




/* =========================================
   Header 3 tools - click/tap fixes (mobile)
   StellarNav's mobile toggle spans the whole bar and was
   swallowing taps meant for the search / archive icons.
========================================= */
.menu_section_three .h3-tools {
	z-index: 10001;
	pointer-events: auto;
}

.menu_section_three .h3-panel {
	z-index: 10002;
}

@media (max-width: 767px) {
	/* The nav container itself must not catch taps - only its own links do. */
	.menu_section_three .stellarnav.mobile {
		pointer-events: none;
	}

	.menu_section_three .stellarnav.mobile > ul,
	.menu_section_three .stellarnav.mobile > ul *,
	.menu_section_three .stellarnav.mobile a,
	.menu_section_three .stellarnav.mobile button,
	.menu_section_three .stellarnav.mobile .menu-toggle {
		pointer-events: auto;
	}

	/* Hamburger stays a small button on the right, never full width. */
	.menu_section_three .stellarnav a.menu-toggle,
	.menu_section_three .stellarnav a.menu-toggle.full {
		width: auto !important;
		max-width: 60px;
		float: right;
		display: inline-block !important;
		padding: 12px 15px !important;
	}

	/* Move the tool icons further left, clear of the hamburger. */
	.menu_section_three .h3-tools {
		right: 78px;
		gap: 2px;
	}

	.menu_section_three .h3-tools .h3-tool-btn {
		width: 40px;
		height: 40px;
		font-size: 20px;
	}
}

@media (max-width: 400px) {
	.menu_section_three .h3-tools {
		right: 70px;
	}

	.menu_section_three .h3-tools .h3-tool-btn {
		width: 38px;
		height: 38px;
		font-size: 19px;
	}
}




/* =========================================
   Header 3 mobile menu - X close button and
   tool icons pinned to the top bar row
========================================= */
@media (max-width: 767px) {

	/* Keep the search / archive icons in the top bar even when the
	   menu is expanded (the bar grows tall, so 50% would drop them
	   into the middle of the menu list). */
	.menu_section_three .h3-tools {
		top: 4px;
		transform: none;
		height: 40px;
		align-items: center;
	}

	/* Hamburger turns into an X while the menu is open. */
	.menu_section_three .stellarnav .menu-toggle span.bars {
		position: relative !important;
		width: 26px;
		height: 21px;
		display: inline-block !important;
	}

	.menu_section_three .stellarnav .menu-toggle span.bars span {
		position: absolute;
		left: 0;
		width: 26px !important;
		height: 3px !important;
		margin: 0 !important;
		background: #fff !important;
		border-radius: 3px;
		transition: transform .28s ease, opacity .2s ease, top .28s ease;
	}

	.menu_section_three .stellarnav .menu-toggle span.bars span:nth-child(1) { top: 0; }
	.menu_section_three .stellarnav .menu-toggle span.bars span:nth-child(2) { top: 9px; }
	.menu_section_three .stellarnav .menu-toggle span.bars span:nth-child(3) { top: 18px; }

	.menu_section_three .stellarnav.active .menu-toggle span.bars span:nth-child(1) {
		top: 9px;
		transform: rotate(45deg);
	}

	.menu_section_three .stellarnav.active .menu-toggle span.bars span:nth-child(2) {
		opacity: 0;
	}

	.menu_section_three .stellarnav.active .menu-toggle span.bars span:nth-child(3) {
		top: 9px;
		transform: rotate(-45deg);
	}

	/* Tap anywhere on the dimmed area below the open menu to close it. */
	.menu_section_three .stellarnav.active .menu-toggle {
		background: rgba(0, 0, 0, .22);
		border-radius: 6px;
	}
}




/* =========================================
   Header 3 mobile menu - final fixes
   1) The open menu list used to slide up over the toggle,
      stealing the tap. It now starts below the bar row and
      the toggle sits above everything.
   2) The X is forced white so it stays visible on the dark menu.
========================================= */
@media (max-width: 767px) {

	.menu_section_three .stellarnav.mobile {
		position: relative !important;
		min-height: 48px;
	}

	/* Toggle pinned to the top-right of the bar, always on top */
	.menu_section_three .stellarnav a.menu-toggle,
	.menu_section_three .stellarnav a.menu-toggle.full {
		position: absolute !important;
		top: 0 !important;
		right: 4px !important;
		float: none !important;
		width: 52px !important;
		height: 48px !important;
		max-width: none;
		padding: 13px 13px !important;
		margin: 0 !important;
		z-index: 10005 !important;
		display: flex !important;
		align-items: center;
		justify-content: center;
	}

	/* The list must start below the bar row, not slide up over it */
	.menu_section_three .stellarnav.mobile ul,
	.menu_section_three .stellarnav.mobile.dark ul,
	.menu_section_three .stellarnav.mobile > ul {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}

	/* Bars / X always white so they show on both the red bar and the dark menu */
	html body .menu_section_three .stellarnav .menu-toggle span.bars span,
	html body .menu_section_three .stellarnav.dark .menu-toggle span.bars span,
	html body .menu_section_three .stellarnav.mobile .menu-toggle span.bars span,
	html body .menu_section_three .stellarnav.mobile.dark .menu-toggle span.bars span,
	html body .menu_section_three .stellarnav.active .menu-toggle span.bars span,
	html body .menu_section_three .stellarnav.mobile.dark.active .menu-toggle span.bars span {
		background: #ffffff !important;
	}

	/* Keep the first menu row clear of the toggle */
	.menu_section_three .stellarnav.mobile > ul > li:first-child > a {
		padding-right: 60px;
	}

	/* Tool icons align with the toggle row */
	.menu_section_three .h3-tools {
		top: 4px;
		height: 40px;
		transform: none;
		z-index: 10004;
	}
}




/* =========================================
   Footer - cleaned up
   The old theme drew two lines under every title (a long grey
   border plus a short grey bar) and another floating line above
   the copyright. Those are replaced by one deliberate red mark
   per title and a single divider.
========================================= */
.footer-info {
	padding-top: 6px;
}

.footer-col {
	position: relative;
}

/* Subtle divider between the three columns */
@media (min-width: 768px) {
	.footer-col + .footer-col {
		border-left: 1px solid rgba(255,255,255,.08);
	}

	.footer-col {
		padding-left: 28px;
		padding-right: 28px;
	}

	.footer-col:first-child {
		padding-left: 15px;
	}

	.footer-col:last-child {
		padding-right: 15px;
	}
}

/* Title: no long line, just one short red mark */
.footerColor .footer-title {
	font-size: 20px;
	font-weight: 700;
	color: #ffffff;
	border-bottom: none !important;
	padding-bottom: 12px;
	margin: 0 0 16px;
	position: relative;
	line-height: 1.4;
}

.footerColor .footer-title::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 40px;
	height: 3px;
	border-radius: 2px;
	background: var(--cd-primary) !important;
}

/* Readable body text on the dark background */
.footerColor .footer-content {
	color: #c5c5c5;
	font-size: 16px;
	line-height: 1.9;
}

.footerColor .footer-content p {
	margin: 0 0 10px;
}

.footerColor .footer-content p:last-child {
	margin-bottom: 0;
}

.footerColor .footer-content a {
	color: #e0e0e0;
}

.footerColor .footer-content a:hover {
	color: var(--cd-primary);
}

.footerColor .footer-content i {
	color: var(--cd-primary);
	margin-right: 8px;
}

/* One clean divider above the copyright row */
.copy_right_section {
	border-top: 1px solid rgba(255,255,255,.12) !important;
	margin-top: 34px !important;
	padding-top: 22px !important;
	margin-bottom: 26px !important;
	color: #bdbdbd;
	font-size: 15px;
}

.copy_right_section a {
	color: #ffffff;
}

.copy_right_section a:hover {
	color: var(--cd-primary);
}

/* Footer menu divider matches the new tone */
.footer-menu {
	border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

@media (max-width: 767px) {
	.footer-col {
		margin-bottom: 26px;
		padding-bottom: 22px;
		border-bottom: 1px solid rgba(255,255,255,.10);
	}

	.footer-col:last-child {
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}

	.footerColor .footer-title {
		font-size: 19px;
	}

	.copy_right_section .col-md-6 {
		text-align: center;
	}

	.copy_right_section .design-developed {
		text-align: center !important;
		margin-top: 8px;
	}
}




/* =========================================
   English News section (above photo gallery)
========================================= */
.english-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.english-box .eng-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	border-bottom: 2px solid #111;
	padding-bottom: 12px;
	margin-bottom: 22px;
}

.english-box .eng-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	padding: 0;
}

.english-box .eng-title a {
	color: #111;
}

.english-box .eng-title a:hover {
	color: var(--cd-primary);
}

.english-box .eng-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 7px;
	background: var(--cd-primary);
	color: #fff;
	font-size: 18px;
}

.english-box .eng-more {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 16px;
	color: #555;
}

.english-box .eng-more:hover {
	color: var(--cd-primary);
}

.english-box .eng-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 26px 22px;
}

.english-box .eng-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 6px;
}

.english-box .eng-thumb img {
	width: 100% !important;
	height: 180px !important;
	object-fit: cover;
	display: block;
	border-radius: 6px;
	transition: transform .4s ease;
}

.english-box .eng-item:hover .eng-thumb img {
	transform: scale(1.05);
}

.english-box .eng-item-title {
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.45;
	margin: 12px 0 0;
}

.english-box .eng-item-title a {
	color: #1a1a1a;
}

.english-box .eng-item-title a:hover {
	color: var(--cd-primary);
}

@media (max-width: 991px) {
	.english-box .eng-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.english-box .eng-title {
		font-size: 22px;
	}
	.english-box .eng-item-title {
		font-size: 18px;
	}
}

@media (max-width: 575px) {
	.english-box .eng-grid {
		grid-template-columns: 1fr;
	}
	.english-box .eng-thumb img {
		height: 210px !important;
	}
}




/* =========================================
   Section Nine - card layout
   Top: wide featured card + one small card
   Bottom: four cards
========================================= */
.s9-box {
	background: #ffffff;
	padding: 28px 0 32px;
}

.s9-top {
	display: grid;
	grid-template-columns: 3fr 1fr;
	gap: 22px;
	margin-bottom: 22px;
}

.s9-featured {
	display: flex;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 6px;
	overflow: hidden;
	transition: box-shadow .3s ease;
}

.s9-featured:hover,
.s9-card:hover {
	box-shadow: 0 3px 12px rgba(0,0,0,.09);
}

.s9-featured-thumb {
	position: relative;
	flex: 0 0 50%;
	max-width: 50%;
	overflow: hidden;
}

.s9-featured-thumb img {
	width: 100% !important;
	height: 100% !important;
	min-height: 320px;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
}

.s9-featured:hover .s9-featured-thumb img {
	transform: scale(1.04);
}

.s9-featured-body {
	flex: 1;
	min-width: 0;
	padding: 26px 26px 26px 24px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.s9-featured-title {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.45;
	margin: 0 0 14px;
}

.s9-featured-title a {
	color: #111;
}

.s9-featured-title a:hover {
	color: var(--cd-primary);
}

.s9-excerpt {
	font-size: 16px;
	line-height: 1.8;
	color: #666;
}

/* Shared card style */
.s9-card {
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 6px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .3s ease;
}

.s9-card-thumb {
	position: relative;
	overflow: hidden;
}

.s9-card-thumb img {
	width: 100% !important;
	height: 175px !important;
	object-fit: cover;
	display: block;
	transition: transform .4s ease;
}

.s9-card:hover .s9-card-thumb img {
	transform: scale(1.05);
}

.s9-card-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
	margin: 0;
	padding: 14px 16px 18px;
	flex: 1;
}

.s9-card-title a {
	color: #1a1a1a;
}

.s9-card-title a:hover {
	color: var(--cd-primary);
}

.s9-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
}

@media (max-width: 991px) {
	.s9-top {
		grid-template-columns: 1fr;
	}
	.s9-featured-thumb img {
		min-height: 240px;
	}
	.s9-featured-title {
		font-size: 21px;
	}
	.s9-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 575px) {
	.s9-featured {
		flex-direction: column;
	}
	.s9-featured-thumb {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.s9-featured-thumb img {
		min-height: 0;
		height: 210px !important;
	}
	.s9-featured-body {
		padding: 16px;
	}
	.s9-grid {
		grid-template-columns: 1fr;
	}
	.s9-card-thumb img {
		height: 200px !important;
	}
}