@media(max-width:768px){

.container{
width:95%;
}

.header-wrap{
flex-direction:column;
}

.main-nav ul{
flex-wrap:wrap;
justify-content:center;
}

}

#menu-toggle{

display:block;

background:none;

border:none;

font-size:28px;

color:#fff;

}

.main-nav{

display:none;

width:100%;

}

.main-nav.active{

display:block;

}

.main-nav ul{

flex-direction:column;

}

.mobile-bottom-nav{

position:fixed;

bottom:0;

left:0;

width:100%;

background:#fff;

display:flex;

justify-content:space-around;

padding:10px 0;

box-shadow:
0 -2px 10px rgba(0,0,0,.1);

z-index:999;

}

.mobile-bottom-nav a{

display:flex;

flex-direction:column;

align-items:center;

font-size:12px;

text-decoration:none;

color:#333;

}

@media(min-width:769px){

.mobile-bottom-nav{
display:none;
}

}

@media (max-width:768px){

    .entry-title,
    .single-title,
    .post-title,
    article h1{
        font-size:32px !important;
        line-height:1.25 !important;
        margin-bottom:15px;
    }

}

@media (max-width:768px){

    .site-logo img{
        max-width:220px;
        height:auto;
    }

    .header-search{
        margin-top:10px;
    }

    .mobile-toggle{
        margin:10px auto;
    }

}

@media (max-width:768px){

    .breadcrumb{
        font-size:14px;
        line-height:1.5;
        margin-bottom:15px;
    }

}

@media (max-width:768px){

    .content,
    .single-content,
    .post-content{
        width:100%;
        max-width:100%;
        padding:0 15px;
        box-sizing:border-box;
    }

}

@media (max-width:768px){

    .site-main{
        display:block;
    }

    .content{
        width:100%;
    }

    .sidebar{
        width:100%;
        margin-top:30px;
    }

}

@media(max-width:768px){

    .entry-title{
        font-size:42px !important;
        line-height:1.2 !important;
        word-break:normal !important;
        overflow-wrap:break-word;
        margin-bottom:15px;
    }

    .entry-meta{
        font-size:13px;
        line-height:1.5;
    }

    .featured-image img{
        width:100%;
        height:auto;
        border-radius:8px;
    }

    .entry-content{
        font-size:18px;
        line-height:1.8;
    }

}

@media (max-width:768px){

    h1.entry-title{
        font-size:32px !important;
        line-height:1.25 !important;
        font-weight:700;
        margin-bottom:15px;
    }

}

@media (max-width:768px){

.content-area,
.site-main,
.primary,
.primary-content,
.single-content,
.post-content,
.single-post-content,
article,
.single-post article{
    width:100% !important;
    max-width:100% !important;
    float:none !important;
}

.entry-content{
    width:100% !important;
    max-width:100% !important;
}

.entry-title{
    font-size:34px !important;
    line-height:1.2 !important;
    word-break:normal !important;
}

.entry-content p{
    font-size:18px !important;
    line-height:1.8 !important;
}

.sidebar{
    width:100% !important;
    max-width:100% !important;
    margin-top:30px;
}

}

@media (max-width: 768px){

article.single-post{
    width:100% !important;
    max-width:100% !important;
    display:block !important;
}

article.single-post .entry-content{
    width:100% !important;
    max-width:100% !important;
}

article.single-post .entry-content p{
    display:block !important;
    width:100% !important;
    margin-bottom:20px !important;
}

}

@media (max-width: 900px){

    .site-main{
        display:block !important;
    }

    .content{
        width:100% !important;
        max-width:100% !important;
    }

    article.single-post{
        width:100% !important;
        max-width:100% !important;
        padding:20px !important;
        margin:0 !important;
    }

    .entry-title{
        font-size:32px !important;
        line-height:1.25 !important;
    }

    .entry-content{
        max-width:100% !important;
        width:100% !important;
        font-size:18px !important;
        line-height:1.8 !important;
    }

    .entry-content p{
        margin-bottom:18px !important;
    }

    .sidebar{
        width:100% !important;
        max-width:100% !important;
        margin-top:30px !important;
    }

}

@media screen and (max-width: 900px){

    .container{
        width:100% !important;
        max-width:100% !important;
        padding:0 10px !important;
    }

    .site-main{
        display:block !important;
    }

    main.content{
        width:100% !important;
        max-width:100% !important;
        display:block !important;
    }

    article.single-post{
        width:100% !important;
        max-width:100% !important;
        padding:15px !important;
        margin:0 !important;
    }

    .entry-title{
        font-size:32px !important;
        line-height:1.25 !important;
        width:100% !important;
    }

    .entry-content{
        width:100% !important;
        max-width:100% !important;
    }

    .entry-content p{
        width:100% !important;
        display:block !important;
    }

    .sidebar{
        width:100% !important;
        max-width:100% !important;
        margin-top:30px !important;
    }
}

@media screen and (max-width:768px){

    .entry-title,
    h1.entry-title,
    .single-post .entry-title{

        font-size:25px !important;
        line-height:1.25 !important;
        font-weight:700;
        margin-bottom:15px;

    }

}

@media screen and (max-width:768px){

    .breadcrumb{

        font-size:14px;
        line-height:1.5;
        margin-bottom:12px;

    }

}

@media screen and (max-width:768px){

    .container{
        width:100% !important;
        max-width:100% !important;
        padding:0 10px !important;
    }

    .content{
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:0 !important;
    }

    article.single-post{
        width:100% !important;
        max-width:100% !important;
        margin:0 !important;
        padding:0 10px !important;
        box-sizing:border-box;
    }

    .entry-content,
    .entry-header{
        width:100% !important;
        max-width:100% !important;
    }

    .featured-image img,
    .post-thumbnail img{
        width:100% !important;
        height:auto !important;
    }

}

@media screen and (max-width:768px){

    .container{
        width:100% !important;
        max-width:100% !important;
        padding:0 !important;
        margin:0 !important;
    }

    .content{
        width:100% !important;
        max-width:100% !important;
        padding:0 !important;
        margin:0 !important;
    }

    article.single-post{
        width:100% !important;
        max-width:100% !important;
        padding:0 12px !important;
        margin:0 !important;
        box-sizing:border-box;
    }

    .entry-header,
    .entry-content{
        padding:0 !important;
        margin:0 !important;
        width:100% !important;
        max-width:100% !important;
    }

    .featured-image,
    .featured-image img,
    .post-thumbnail img{
        width:100% !important;
        max-width:100% !important;
        height:auto !important;
    }
}

@media screen and (max-width:768px){

    .single-post{
        padding:15px !important;
    }

}

@media (max-width:768px){

    .header-search{
        display:flex;
        gap:8px;
        padding:0 15px;
    }

    .header-search input{
        flex:1;
        min-width:0;
    }

    .header-search button{
        width:80px;
        flex-shrink:0;
    }

}

@media (max-width:768px){

    .related-grid{
        display:grid !important;
        grid-template-columns:repeat(2, 1fr) !important;
        gap:15px !important;
    }

    .related-item{
        width:100% !important;
        margin:0 !important;
    }

    .related-item img{
        width:100% !important;
        height:auto !important;
        display:block;
    }

    .related-item h4{
        font-size:14px !important;
        line-height:1.4 !important;
        margin:10px;
    }

}

@media (max-width:768px){

    .related-grid{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:15px;
    }

    .related-item{
        display:flex;
        flex-direction:column;
        height:100%;
    }

    .related-item h4{
        flex-grow:1;
    }

}

@media (max-width:768px){

.breaking-news{
    display:block;
    overflow:hidden;
}

.breaking-label{
    width:100%;
    text-align:center;
    padding:12px;
}

.breaking-content{
    display:flex;
    overflow-x:auto;
    gap:10px;
    padding:15px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
}

.breaking-content::-webkit-scrollbar{
    display:none;
}

.breaking-item{
    min-width:280px;
    flex:0 0 auto;
    scroll-snap-align:start;
    background:#d80000;
    color:#fff;
    padding:12px;
    border-radius:8px;
    text-decoration:none;
    line-height:1.5;
}

}

@media (max-width:768px){

    .latest-news .news-grid{
        display:grid !important;
        grid-template-columns:repeat(2,1fr) !important;
        gap:15px !important;
    }

    .latest-news .news-card{
        width:100% !important;
        margin:0 !important;
    }

    .latest-news .news-card img{
        width:100%;
        aspect-ratio:4/3;
        object-fit:cover;
    }

    .latest-news .news-card h3{
        font-size:14px;
        line-height:1.4;
        padding:10px;
    }

}

@media (max-width:768px){

    .latest-news .news-card{
        display:flex;
        flex-direction:column;
        height:100%;
    }

    .latest-news .news-card h3{
        flex-grow:1;
    }

}

@media (max-width:768px){

.widget-latest{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.widget-latest .widget-title{
    grid-column:1 / -1;
}

.sidebar-news-card{
    margin:0;
    border:none;
}

.sidebar-news-card img{
    width:100%;
    height:120px;
    object-fit:cover;
    border-radius:8px;
}

.sidebar-card-content h4{
    font-size:14px;
    line-height:1.4;
    margin:8px 0;
}

.sidebar-date{
    font-size:12px;
}

}

@media (max-width:768px){

.sidebar-news-card{
    display:flex;
    flex-direction:column;
    height:100%;
}

.sidebar-card-content{
    flex-grow:1;
}

}

@media (max-width:768px){

    .editors-choice .choice-grid{
        display:grid !important;
        grid-template-columns:repeat(2,1fr) !important;
        gap:15px !important;
    }

    .editors-choice .choice-card{
        width:100% !important;
        margin:0 !important;
        display:flex;
        flex-direction:column;
    }

    .editors-choice .choice-card img{
        width:100%;
        aspect-ratio:4/3;
        object-fit:cover;
        border-radius:8px;
    }

    .editors-choice .choice-card h3{
        font-size:14px;
        line-height:1.4;
        margin-top:8px;
        font-weight:600;
    }

}

/* ==========================
   STICKY HEADER MOBILE
========================== */

@media (max-width:768px){

    .mobile-sticky-header{
        position:fixed;
        top:0;
        left:0;
        z-index:99999;
        display:flex;
        align-items:center;
        justify-content:space-between;
        width:100%;
        height:58px;
        padding:0 16px;
        box-sizing:border-box;
        background:#1747c9;
        box-shadow:0 2px 10px rgba(0,0,0,.16);
        transform:translateY(-110%);
        transition:transform .25s ease;
    }

    .mobile-sticky-header.is-visible{
        transform:translateY(0);
    }

}
.mobile-sticky-header{

    position:fixed !important;
    top:0;
    left:0;
    width:100%;
    background:red;
    z-index:99999;

}

@media(max-width:768px){

.mobile-sticky-header{

    position:fixed;
    top:0;
    left:0;
    width:100%;

    background:#1544D9;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:12px 15px;

    z-index:99999;

    transform:translateY(-100%);
    transition:.3s;

    box-shadow:0 2px 10px rgba(0,0,0,.15);

}

.mobile-sticky-header.show{
    transform:translateY(0);
}

.sticky-logo{
    color:#fff;
    font-size:18px;
    font-weight:700;
}

.sticky-menu-btn{
    background:none;
    border:none;
    color:#fff;
    font-size:26px;
    cursor:pointer;
}

body.sticky-active{
    padding-top:55px;
}

}

@media (max-width:768px){

    .footer-col{
        text-align:center;
    }

    .footer-col p{
        font-size:15px;
        line-height:1.8;
        padding:0 20px;
        margin-top:15px;
        word-break:normal;
    }

}

@media (max-width:768px){

    .footer-col img{
        display:block;
        max-width:220px;
        height:auto;
        margin:0 auto 15px;
    }

}

@media (max-width:768px){

.container{

    padding-left:15px;

    padding-right:15px;

}

}

@media (max-width:768px){

.site-main,
.home-content,
.main-content{

    padding-left:15px;

    padding-right:15px;

}

}

/* =====================================
   MOBILE STICKY HEADER
===================================== */

.mobile-sticky-header{
    display:flex;
}

@media (max-width:768px){

    .mobile-sticky-header{
        position:fixed;
        top:0;
        left:0;
        z-index:99999;
        display:flex;
        align-items:center;
        justify-content:space-between;
        width:100%;
        height:58px;
        padding:0 16px;
        box-sizing:border-box;
        background:#1747c9;
        box-shadow:0 2px 10px rgba(0,0,0,.16);
        transform:translateY(-110%);
        transition:transform .25s ease;
    }

    .mobile-sticky-header.is-visible{
        transform:translateY(0);
    }

    .sticky-logo{
        display:flex;
        align-items:center;
        max-width:210px;
        color:#fff;
        font-size:17px;
        font-weight:700;
        text-decoration:none;
    }

    .sticky-logo img{
        display:block;
        width:auto;
        max-width:190px;
        max-height:42px;
    }

    .sticky-menu-btn{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        width:42px;
        height:42px;
        padding:0;
        border:0;
        border-radius:5px;
        background:transparent;
        cursor:pointer;
    }

    .sticky-menu-btn span{
        display:block;
        width:23px;
        height:3px;
        margin:3px 0;
        border-radius:2px;
        background:#fff;
    }

    body.mobile-sticky-active{
        padding-top:58px;
    }

}

@media (max-width:768px){

    .mobile-sticky-header{
        overflow:visible;
    }

    .sticky-menu-panel{
        position:absolute;
        top:58px;
        left:0;
        right:0;
        display:none;
        padding:8px 18px 16px;
        box-sizing:border-box;
        background:#163b9f;
        box-shadow:0 8px 16px rgba(0,0,0,.18);
    }

    .mobile-sticky-header.menu-open .sticky-menu-panel{
        display:block;
    }

    .sticky-mobile-menu{
        margin:0;
        padding:0;
        list-style:none;
    }

    .sticky-mobile-menu li{
        margin:0;
        padding:0;
        border-bottom:1px solid rgba(255,255,255,.12);
    }

    .sticky-mobile-menu li:last-child{
        border-bottom:0;
    }

    .sticky-mobile-menu a{
        display:block;
        padding:15px 4px;
        color:#fff;
        font-size:16px;
        font-weight:700;
        text-decoration:none;
    }

    .sticky-mobile-menu a:hover,
    .sticky-mobile-menu a:focus{
        color:#fff;
        opacity:.85;
    }

    .mobile-sticky-header.menu-open .sticky-menu-btn{
        background:rgba(255,255,255,.12);
        border-radius:5px;
    }

}