/* 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;}

 @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;
    }
}