/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.8.13.1782369869
Updated: 2026-06-25 06:44:29

*/

/* Navbar css */

/* Header Wrapper */
.custom-header {
    background: #ffffff;
    width: 100%;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    position: fixed;
    z-index: 999;
    top: 0;
}

@media only screen and (min-width: 1800px) {
    .header-inner {
        max-width: 1640px;
    }
}
@media (min-width: 1300px) and (max-width: 1499px) {
     .header-inner {
        max-width: 1240px;
    }
}

/* Inner Container */
.header-inner {
    margin: 0 20px;
    padding: 0px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: "Montserrat", sans-serif;
}


/* Left Logo */

header .custom-logo-link img{
    width: 52%;
        max-width: unset;
}
.logo-left img {
    width: 52%;
    position: relative;
    left: 30px;
}

/* Right Logo */
.logo-right{
    float: right;
    position: relative;
    left: 80px;
    right:80px;
    text-align:center;
}
.logo-right img {
    width: 52%;
}

/* Center Navigation */
.main-nav {
    flex: 1;
    display: flex;
    justify-content: end;
}

.main-nav .menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 28px;
    align-items: center;
}

/* Menu Links */
.main-nav .menu li a {
    text-decoration: none;
    color: #1f4aa8; /* blue like image */
    font-weight: 500;
    font-size: 15px;
    transition: 0.3s ease;
    position: relative;
}

/* Hover effect (optional underline) */
.main-nav .menu li a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 0%;
    height: 2px;
    background: #1f4aa8;
    transition: 0.3s ease;
}

.main-nav .menu li a:hover::after {
    width: 100%;
}

/* RESET MENU */
.main-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav .menu {
    display: flex;
    gap: 25px;
    align-items: center;
}

/* MAIN MENU ITEMS */
.main-nav .menu > li {
    position: relative;
}

.main-nav .menu > li > a {
    text-decoration: none;
    color: #1f4aa8;
    font-weight: 500;
    padding: 10px 5px;
    display: block;
}

/* =========================
   FIRST LEVEL DROPDOWN
========================= */
.main-nav .menu li ul {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
    padding: 10px 0;

    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: 0.3s ease;

    z-index: 999;
}

/* SHOW ON HOVER */
.main-nav .menu li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* DROPDOWN ITEMS */
.main-nav .menu li ul li {
    position: relative;
}

.main-nav .menu li ul li a {
    padding: 10px 15px;
    display: block;
    color: #333;
    font-size: 14px;
    white-space: nowrap;
}

.main-nav .menu li ul li a:hover {
    background: #f4f7ff;
    color: #1f4aa8;
}

/* =========================
   SECOND LEVEL DROPDOWN
========================= */
.main-nav .menu li ul li ul {
    top: 0;
    left: 100%;
}

/* KEEP SUBMENU OPEN ON HOVER CHAIN */
.main-nav .menu li ul li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

/* OPTIONAL ARROW INDICATOR */
.main-nav .menu li ul li:has(ul) > a::after {
    content: "›";
    float: right;
    margin-left: 10px;
    color: #999;
}

/* Hide button on desktop */
.menu-toggle {
    display: none;
    color: #325ca3;
    background: transparent;
    border: none;
    padding: 10px 15px;
    font-size: 24px;
    cursor: pointer;
    border-radius: 4px;
}

@media (max-width:992px){

    .header-inner{
        flex-wrap: wrap;
    }

    /* Show button */
    .menu-toggle{
       display: inline-block;
        position: absolute;
        right: 0;
        top: 28px;
        right: 20px;
        outline: 0;
        padding: 0.25rem 0.75rem;
        font-size: 1.25rem;
        color: #325ca3;
        line-height: 1;
    }

    /* Hide menu initially */
    .main-nav{
        display:none;
        width:100%;
        margin-top:15px;
    }

    /* Show menu after clicking */
    .main-nav.active{
        display:block;
    }

    .main-nav .menu{
        flex-direction:column;
        width:100%;
    }

    .main-nav .menu > li{
        width:100%;
    }

    .main-nav .menu > li > a{
        padding:12px 15px;
        display:block;
    }

}

@media (max-width: 992px) {

    .header-inner {
        flex-direction: column;
        align-items: center;
        padding: 15px;
        gap: 20px;
    }

    .logo-right{
        display: none;
    }

    /* Navigation */
    .main-nav {
        width: 100%;
    }

    .main-nav .menu {
        flex-direction: column;
        width: 100%;
        gap: 0;
    }

    .main-nav .menu > li {
        width: 100%;
        border-bottom: 1px solid #eee;
    }

    .main-nav .menu > li > a {
        display: block;
        padding: 14px 15px;
        text-align: left;
    }

    /* Dropdowns */
    .main-nav .menu li ul {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
        width: 100%;
        box-shadow: none;
        background: #f8f8f8;
        padding: 0;
    }

    /* Show submenu on hover */
    .main-nav .menu li:hover > ul {
        display: block;
    }

    .main-nav .menu li ul li a {
        padding: 12px 30px;
        font-size: 14px;
    }

    .main-nav .menu li ul li ul li a {
        padding-left: 45px;
    }

    /* Disable fly-out submenu */
    .main-nav .menu li ul li ul {
        position: static;
        left: auto;
        top: auto;
    }

}

/* CLEAN MOBILE FIX */
@media (max-width: 992px) {
    .main-nav .menu {
        flex-direction: column;
        align-items: flex-start;
    }

    .main-nav .menu li ul {
        position: relative;
        top: 0;
        left: 0;
        box-shadow: none;
        transform: none;
    }
}

/* Responsive */
@media (max-width: 992px) {
    .header-inner {
        flex-wrap: wrap;
        gap: 10px;
    }

    .main-nav {
        order: 3;
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
    }

    .main-nav .menu {
        gap: 18px;
        white-space: nowrap;
    }
}
/* END Navbar*/

#content{
    margin: 120px 0px;
}


.blog-container {
    max-width: 1200px;
    margin: 100px auto;
    padding: 50px 20px;
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
}

.blog-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    padding: 20px;
    height: 100%;
}

.blog-card img {
    width: 100%;
    height: 220px;
    object-fit: contain;
    border-radius: 6px;
    object-position: top;
}

.blog-card h2,
.blog-card h3 {
    font-size: 24px;
    line-height: 1.3;
    margin: 15px 0;
    word-break: break-word;
}

.blog-card p {
    font-size: 16px;
    line-height: 1.7;
}

/* Tablet */
@media (max-width: 992px) {
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media (max-width: 768px) {
    #content{
        margin: 280px 0px;
    }
    .blog-grid {
        grid-template-columns: 1fr;
    }

    .blog-card h2,
    .blog-card h3 {
        font-size: 20px;
    }

    .blog-container {
        padding: 30px 15px;
    }
}

.blog-pagination{
    margin-top: 20px;
    float: right;
}

 /* Single page css*/
 
 @media (min-width: 922px) {
    .ast-narrow-container .site-content > .ast-container {
        max-width: 1400px;
    }
}

.blog-navigation{
    display:flex;
    justify-content:space-between;
    margin-top:50px;
    padding-top:30px;
    border-top:1px solid #eee;
}

.blog-single-container{
    max-width:1400px;
    margin:140px auto;
    padding:0 20px;
}

.blog-layout{
    display:flex;
    gap:40px;
}

.blog-main{
    width:75%;
}

.blog-sidebar{
    width:25%;
}

.featured-image img{
    width:100%;
    border-radius:10px;
    margin-bottom:25px;
}

.blog-title{
    font-size:40px;
    margin:15px 0 20px;
    line-height:1.3;
    font-weight:700;
}

.blog-meta{
    color:#777;
    margin-bottom:20px;
    font-size:15px;
}

.blog-content{
    font-size:18px;
    line-height:1.9;
    color:#444;
}

.blog-content p{
    margin-bottom:20px;
}

.blog-content img{
    max-width:100%;
    height:auto;
    border-radius:8px;
}

.blog-content h2{
    font-size:30px;
    margin:35px 0 20px;
}

.blog-content h3{
    font-size:24px;
    margin:30px 0 15px;
}

.blog-content ul,
.blog-content ol{
    margin-left:25px;
    margin-bottom:20px;
}

.blog-content blockquote{
    border-left:4px solid #0073aa;
    padding-left:20px;
    margin:30px 0;
    font-style:italic;
    color:#666;
}

/* Sidebar */

.blog-sidebar h3{
    margin-bottom:25px;
    font-size:24px;
}

.sidebar-post{
    margin-bottom:20px;
    border-bottom:1px solid #eee;
    padding-bottom:15px;
}

.sidebar-post:last-child{
    border:none;
}

.sidebar-post a{
    display:flex;
    gap:15px;
    text-decoration:none;
    color:#222;
}

.sidebar-post img{
    width:90px;
    height:70px;
    object-fit:cover;
    border-radius:6px;
}

.sidebar-post h4{
    font-size:16px;
    margin:0 0 6px;
    line-height:1.4;
}

.sidebar-post span{
    color:#777;
    font-size:13px;
}

.sidebar-post a:hover h4{
    color:#0073aa;
}

/* Responsive */

@media(max-width:991px){

    .blog-layout{
        flex-direction:column;
    }

    .blog-main,
    .blog-sidebar{
        width:100%;
    }

}

@media(max-width:767px){

    .blog-title{
        font-size:28px;
    }

    .blog-content{
        font-size:16px;
    }

    .sidebar-post img{
        width:80px;
        height:60px;
    }

}
