/* Theme Name: Twenty Twenty-One Child Theme URI: https://wordpress.org/themes/twentytwentyone/ Template: twentytwentyone Author: the WordPress team Author URI: https://wordpress.org/ Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog. Tags: one-column,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,blog,portfolio Version: 2.5.1751297173 Updated: 2025-06-30 15:26:13 */
a{
	text-decoration:unset;
}
body, *, h1, h2, h3, h4, h5, h6, p, li, span, a{
	font-family: "Roboto", sans-serif !important;
}
.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
	background: unset !important;
	color: unset !important;
	outline: unset !important;
}
header#masthead:before, header#masthead:after{
	display:none;
}
header#masthead .mobile_only {
	display: none;
}
header#masthead {
	padding: 20px;
	max-width: 100%;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 4px -1px, rgba(0, 0, 0, 0.01) 0px 4px 5px 0px, rgba(0, 0, 0, 0.02) 0px 1px 10px 0px;
	justify-content: space-between;
	position: fixed;
	width: 100%;
	z-index: 9999;
	top: 0;left:0;
	background: #fff;
}
div#content {
	z-index: 2;
	position: relative;
	margin-top: 00px;
}
body{
	margin-top: 70px !important;
}
body.single div#content main#main {
	padding-top: 0;
}
header#masthead .site-logo {
	width: fit-content;
	border: 0;
	padding: 0;
	margin: 0;
}
header#masthead .site-logo img.custom-logo {
	width: 150px;
	height: auto;
	max-width: unset;
}
header#masthead .site-branding {
	margin: 0;
}
header#masthead ul.category-nav {
	display: flex ;
	list-style: none;
	padding:0;
	margin:0;
}
header#masthead ul.category-nav li{
	padding-left:30px;
}
header#masthead ul.category-nav a {
	text-decoration: unset;
	font-weight: 500;
	font-size: 20px;
	color: rgb(54, 42, 67);
}
/* footer */
footer.footer .footer_copyright {
	text-align: center;
	display: block;
	width: 100%;
}
footer.footer {
	margin-top: 20px;
	background: rgb(216 216 216);
	padding: 10px;
	color: #000;
	font-size: 16px;
}
/* blogs */
.homepage-posts{
	display: grid ;
	grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
	width: 100%;
	max-width: 100% !important;
	padding: 1.25rem 2.5rem;
	gap:24px;
	margin:0;
}
.homepage-posts .post-card {
	box-shadow: rgba(0, 0, 0, 0.11) 0px -6px 51px;
	background-color: rgb(255, 255, 255);
	cursor: pointer;
	border-radius: 0.625rem 0.625rem 10px 10px;
	overflow: hidden;
	height:100%;
	text-decoration:unset !important; border:0 !important
}
.homepage-posts .post-card img {
	height: 250px !important;
	width:100%;
	object-fit: cover;
}
.homepage-posts .post-card .post-content {
	padding: 10px 15px;
}
.homepage-posts .post-card .post-content h3 {
	font-size: 1.3125rem;
	font-weight: bold;
	font-style: normal;
	color: rgb(0, 0, 0);
	line-height: 134%;
	text-transform: initial;
	letter-spacing: initial;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	text-decoration: unset;
}
.homepage-posts .post-card .post-content p {
	font-size: 1rem;
	font-weight: 400;
	font-style: normal;
	color: rgb(0, 0, 0);
	line-height: 134%;
	text-transform: initial;
	letter-spacing: initial;
}
.homepage-posts .post-card .post-content .read-more {
	display: flex;
	align-items:center;
	position: relative;
	background-color: transparent;
	cursor: pointer;
	font-size: 0.8125rem;
	line-height: 1.75;
	letter-spacing: 0.02857em;
	text-transform: capitalize;
	color: black;
	font-weight: 400;
	text-decoration: none;
	padding: 4px 5px;
	border-radius: 4px;
	transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1), border-color 250ms cubic-bezier(0.4, 0, 0.2, 1), color 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.homepage-posts .post-card .post-content .read-more svg {
	width: 14px;
	height: 12px;
	margin-left: 3px;
}
.homepage-posts .post-card .post-content span.category {
	font-size: 14px;
	font-weight: 400;
	font-style: normal;
	color: rgb(0, 0, 0);
}
.cate_share {
	margin-bottom:6px;
	display: flex ;
	-webkit-box-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	align-items: center;
}
.cate_share button.postshare_btn {
	background: transparent !important;
	padding: 0;
	margin: 0;
	outline: unset !important;
	box-shadow: unset !important;
	outline-offset: unset;
	border: 0 !important;
}
.cate_share button.postshare_btn svg {
	fill: #757575;
	width: 14px;
	height: 14px;
}
.homepage-posts .post-card .post-content .btn_icon {
	display: flex ;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
}
.homepage-posts .post-card .post-content .btn_icon svg {
	width: auto;
	height: 18px;
}
body.category header.page-header {
	display: none;
}
/* dark_theme */
header#masthead .site-logo img.custom-logo.white_logo {
	display: none;
}
body.darkmode--activated header#masthead .site-logo img.custom-logo.white_logo {
	display: block;
}
body.darkmode--activated header#masthead .site-logo img.custom-logo{
	display: none;
}
.darkmode--activated .post-content-toggle:after{
	box-shadow: unset;
	background: transparent;
}
/* single_post */
.single_post figure.post-thumbnail img {
	max-width: 100% !important;
	width: 100%;
	height: 31.25rem !important;
}
.single_post figure.post-thumbnail {
	max-width: 100% !important;
	width: 100%;
	margin: 0;
}
.single-post .entry-content_post h1.entry-title {
	font-size: 1.875rem;
	font-weight: 700;
	margin: 0px 0 10px;
	padding: 0px;
}
.single-post .entry-content_post {
	max-width: 1200px;
	padding-inline: 24px;
	margin-inline: auto;
}
.single-post div#comments{
	display: none;
}
.single-post .entry-content_post p {
	font-size: 16px;
	color: #555;
}
.single-post .entry-content_post h3{font-size:20px;margin-bottom: 15px;}

.single-post .toggle-content-btn {
	background: rgb(243, 133, 77) !important;
	color: #fff !important;
	padding: 8px 15px;
	border-radius: 50px;
	cursor: pointer;
	height: fit-content;
	display: block;
	margin-inline: auto;
	font-size: 16px;
	font-weight: 400;
	outline: unset !important;
	border: 0 !important;
	position: absolute;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%); z-index:9;
}
.post-content-toggle {
	position: relative;
	opacity: 1;
	display: block;
	font-size: 16px;overflow:hidden;
	line-height: 1.5;
}

.post-content-toggle:after {
	content: "";
	width: 100%;
	height: 30px;
	display: inline-block;
	margin-top: 1.875rem;
	font-size: 24px;
	background-color: rgb(255, 255, 255);
	box-shadow: rgb(255, 255, 255) 1px 2px 50px 47px; position:absolute; bottom:0;
}
.post-content-toggle.active:after{display:none}
header#masthead .mobile_only {
	position: fixed;
	height: 100%;
	top: 0;
	left: 0;
	background: #fff;
	z-index: 9999;
	width: 250px;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 10px -5px, rgba(0, 0, 0, 0.14) 0px 16px 24px 2px, rgba(0, 0, 0, 0.12) 0px 6px 30px 5px;
	transform: translateX(-120%);
	transition: transform 225ms cubic-bezier(0, 0, 0.2, 1);
	display:block;
	padding: 0.5125rem 1.25rem;
}
header#masthead .mobile_only ul.category-nav {
	display: block;
	padding: 5px 0;
}
header#masthead .mobile_only ul.category-nav li {
	padding: 6px 0;
}
.primary-navigation-open header#masthead .mobile_only {
	transform: translateX(0%);
}
header#masthead .mobile_only img.logo_fixed {
	width: 90px;
}
body.category main.site-main .homepage-posts .post-card {
	height: auto;
}
.single-post .entry-content_post img {
	max-width: 100%;
	margin-top: 15px;
}
.loader {
	display: none !important;
	text-align: center;
	padding: 20px;
}
.spinner {
	border: 4px solid rgba(0, 0, 0, 0.1);
	border-left-color: #333;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	animation: spin 1s linear infinite;
	display: inline-block;
}
@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}
.post-navigation-cards a.toggle-content-btn {
	position: unset;
	width: fit-content;
	margin-inline: auto !important;
	transform: unset !important;
	margin-top: 20px;
}
.post-navigation-wrapper figure.post-thumbnail {
	max-width: 100% !important;
	width: 100%;
}
.post-navigation-wrapper figure.post-thumbnail img {
	max-width: 100% !important;
	width: 100% !important;
	height: 31.25rem !important;
}


.single-post .related-posts-wrapper .entry-content_post { margin-top: 30px; }

.pagination {
	display: flex;
	justify-content: center;align-items:center;
	gap: 8px;
	margin-top: 30px;
	flex-wrap: wrap;border:0;
}

.pagination .page-numbers {
	padding: 8px 14px;
	border-radius: 8px;
	background: #f1f1f1 !important;
	text-decoration: none;
	color: #333;font-size:16px;
	font-weight: 500;display:block;
}

.pagination .page-numbers:hover {
	background: #ff8f2c !important;
	color: #fff;
}

.pagination .current {
	background: #ff8f2c !important;
	color: white;
	font-weight: bold;
}

.single-post article.post { margin-bottom: 0; }

.btn_icon .logo_btn { font-size: 14px; font-weight: 700; text-transform: capitalize; padding: 0; display: flex ; align-items: center; gap: 5px;line-height:2;}
.btn_icon .logo_btn img { height: 16px !important; width: auto; }


.news-container { align-items: center; background: #f1f1f1; border-radius: 8px; display: flex ; flex-direction: column; padding: 0 8px;    margin: 15px; }

.articles_main {
	font-size: 20px;
	margin-block: 15px;
	font-weight: 600;
	text-align: center;
}
.news-card { background: #fff; border-radius: 8px; cursor: pointer; display: flex ; height: 100px; margin-bottom: 12px; min-height: 60px; padding: 5px; }
.card-left-side { padding: 0; text-align: center; width: 70%; }
.card-right-side { border-radius: 5px; overflow: hidden; width: 30%; }
.card-left-side p { font-size: 15px; font-weight: 500; text-align: start;line-height:1.4; }
.card-right-side img { height: 100%; width: 100%; }
.news-card-container { width: 65%; }

.pagination .page-numbers svg {position: relative; top: 1px; object-fit: contain; width: 8px; height: 8px;}

footer.footer .footer_copyright {
	font-size: 13px;
}

.cate_share .logo_btn { font-size: 14px; font-weight: 700; text-transform: capitalize; padding: 0; display: flex ; align-items: center; gap: 5px; line-height: 2; }
.cate_share .logo_btn img {
	margin: 0;
	height: 16px !important;
	width: auto;
}

.news-card a {
	width: 100%;
}

.single-post button.toggle-content-btn.showless { position: relative; margin: 20px auto !important; bottom: 0; }
.more-content { z-index: 999; position: relative; }
header#masthead ul.category-nav li.current-category a { border-color: #fa892d;font-weight:700; }
header#masthead ul.category-nav li a { border-bottom: 2px solid transparent; }
button.view-less-btn { background: rgb(243, 133, 77) !important; color: #fff !important; padding: 8px 15px; border-radius: 50px; cursor: pointer; height: fit-content; margin-inline: auto; font-size: 16px; font-weight: 400; margin-block: 20px 10px; position: relative; left: 50%; transform: translateX(-50%); outline:unset; border:0; box-shadow:unset;z-index: 9;}

.p-0{padding:0 !important;}


.toggle-box input[type=checkbox] {
  display: none;
}

/* Toggle track */
.toggle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
  background: #ffcf33; /* sun color */
  border-radius: 28px;
  cursor: pointer;
  transition: background 0.3s ease;
}

/* Circle knob */
.toggle::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 6px rgba(0,0,0,0.2);
  transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

/* ☀️ Sun rays when unchecked (day) */
.toggle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 -12px 0 #fff, 0 12px 0 #fff, 12px 0 0 #fff, -12px 0 0 #fff,
              8px -8px 0 #fff, -8px -8px 0 #fff, 8px 8px 0 #fff, -8px 8px 0 #fff;
  transform: translate(-50%, -50%) scale(0.6);
  transition: opacity 0.3s ease;
  opacity: 1;
}

/* Checked = moon mode */
.toggle-box input[type=checkbox]:checked + .toggle {
  background: #222; /* night track */
}

/* Move knob right */
.toggle-box input[type=checkbox]:checked + .toggle::before {
  transform: translateX(28px);
  background: #eee;
  box-shadow: -6px 0 0 0 #222; /* crescent moon */
}

/* Hide sun rays in night mode */
.toggle-box input[type=checkbox]:checked + .toggle::after {
  opacity: 0;
}

.header_logos .toggle-box label.toggle { margin-bottom: 0; }
.header_logos { display: flex ; align-items: center; }
.toggle-box {display: flex;}
body.custom-background.dark_theme { background-color: #000; }
body.custom-background.dark_theme .homepage-posts .post-card, body.custom-background.dark_theme header#masthead{
    background-color: #1f1f1f;
}
body.custom-background.dark_theme header#masthead button#primary-mobile-menu img { filter: invert(1) brightness(1.2); }
body.custom-background.dark_theme *{color:#fff !important}
body.custom-background.dark_theme label.toggle { border: 2px solid #ffffff78; }

@media(max-width:767px){
	footer.footer .footer_copyright {
		font-size: 10px;
	}
	header#masthead .masthead-before{ background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 6;display:none;}
	.primary-navigation-open header#masthead .masthead-before{display:block;}
	body.lock-scrolling { overflow: hidden; }

	.lock-scrolling .site {
		position: unset !important;}

	.pagination{gap: 4px; max-width: 100% !important;}
	.pagination .page-numbers{font-size: 11px;}
	.pagination .page-numbers.dots { display: none; }
	header#masthead .site-logo{
		position:unset;
		display: block;    margin-inline: 15px;
	}
	header#masthead {
		padding: 10px 10px 0;
		gap:10px;
	}
	header#masthead .site-logo img.custom-logo {
		width: 100px;
	}
	header#masthead ul.category-nav::-webkit-scrollbar {
		width: 0px;
		background: transparent;
	}
	header#masthead ul.category-nav{
		margin: 0;
		width: 100%;
		overflow-x: overlay;
		padding-bottom: 10px;
	}
	header#masthead ul.category-nav li {
		padding-inline: 8px;
		display: flex;
	}
	header#masthead ul.category-nav a{
		font-size: 14px;
	}
	.homepage-posts{
		padding: 10px;
		grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
	}
	body.category main.site-main{
		padding: 00;
	}
	div#content {
		margin-top: 0px;
	}
	body{
		margin-top: 100px;
	}
	.single_post figure.post-thumbnail img, .post-navigation-wrapper figure.post-thumbnail img{
		height: 210px !important;
		margin-top:0;
	}
	.single-post .entry-content_post h1.entry-title {
		font-size: 1.3125rem;
		line-height: 1.3;
		margin-bottom: 5px;
	}
	.single-post .entry-content_post{
		padding-inline: 16px;
	}
	.cate_share span.category{
		font-size: 16px;
		font-weight: 600;
	}
	body.category div#primary {
		padding-top: 30px;
	}
	.homepage-posts .post-card{
		height:auto;
	}
	body.single-post main#main {
		display: inline;
	}
	header button#primary-mobile-menu img {
		width: 25px;
	}
	.header_nav .menu-button-container, .header_nav nav#site-navigation{
		position: unset;
		padding: 0;
	}
	.header_nav {
		display: flex ;
		width: 100%;
		justify-content: space-between;
		align-items: center;
	}
	.header_nav .menu-button-container button#primary-mobile-menu {
		padding: 0;border:0; outline:0;
	}
	.single_post {
		margin-top: 40px !important;
	}

	.news-card-container { width: 100%; }
	.card-left-side { padding: 0 10px; text-align: start; width: 60%; display:flex; align-items:center;}
	.card-right-side { align-items: center; display: flex ; width: 40%; }
	.card-left-side p { font-size: 12px; font-weight: 700; }
	.card-left-side p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }



}
@media(min-width:767px){
	.masthead-before{display:none;}
	div#page.site { max-width: 840px; margin-inline: auto; }
	div .homepage-posts{
		max-width: 100% !important;
		grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));
		margin-inline: auto;
	}
	body.single div#content main#main{
		max-width: 100% !important;
		margin-inline:auto !important;
	}
}