/*//// CSS FOR BLOG ARCHIVE ////*/


/*////// HERO SECTION //////*/
section.hero-section {
    padding-top: 12rem;
    background: #09C;
}
section.hero-section div.hero-container {
    /*height: 23.4rem;*/
    height: 41rem;
    background: #09C;
    padding: 15rem 15rem 0 15rem;
}

/*//// FLEX ////*/
div.hero-container div.hero-flex-container {}
div.hero-flex-container div.hero-flex-item {}

/*// FLEX SPECIFICS //*/
#hero-flex-item-1 {}

/*// ELEMENTS //*/
div.hero-flex-item h1 {
    color: #FFF;
    font-family: Montserrat;
    font-size: 5.6rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}
div.hero-flex-item h2 {}
div.hero-flex-item h4 {
    width: 90%;
    font-weight: 500;
    font-weight: 600;
    color: #ffffff;
}


div.hero-flex-item p {}
div.hero-flex-item strong {}





/*////// SEARCH SECTION //////*/
section.search-section { }
section.search-section div.search-container {
    min-height: 12rem;
    padding: 4.5rem 15rem 2rem 15rem;
    background: #F1F1F1;
}

/*//// FLEX ////*/
div.search-container div.search-flex-container {}
div.search-flex-container div.search-flex-item { }

div.search-flex-item h3,
div.search-flex-item label.news-search {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    margin: 0 0;
    color: #069;
    font-family: Montserrat;
    font-size: 3.2859rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1; /* 100% */
}
div.search-flex-item form {
    position: relative;
    display: block;
    margin: 0 0;
    padding: 0 0;
}
div.search-flex-item input[type="text"],
div.search-flex-item input[type="search"] {
    width: 62rem;
    min-height: 4.8rem;
    padding: 1rem 2rem;
    border: 1px solid #09C;
    background: #ffffff;
    color: #819091;
    font-family: Montserrat;
    font-size: clamp( 14px, 2rem, 20px );
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}
div.search-flex-item input[type="submit"],
div.search-flex-item button[type="submit"] {
    min-height: 4.8rem;
    padding: 0 2rem;
    margin-left: 3rem;
    color: #FF5917;
    text-align: center;
    font-family: Montserrat;
    font-size: clamp( 14px, 2rem, 20px );
    font-style: normal;
    font-weight: 600;
    line-height: 1.64; /* 164.293% */
    cursor: pointer;
}

/*// FLEX SPECIFICS //*/
#search-flex-item-1 {}
#search-flex-item-2 {}

/*//// SEARCH AUTOCOMPLETE ////*/
.search-autocomplete {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 100;
    display: none;
}
.search-autocomplete.active {
    display: block;
}
.search-autocomplete-item {
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
    transition: background 0.2s ease;
}
.search-autocomplete-item:last-child {
    border-bottom: none;
}
.search-autocomplete-item:hover,
.search-autocomplete-item.highlighted {
    background: #f5f5f5;
}
.search-autocomplete-item a {
    display: block;
    text-decoration: none;
    color: inherit;
}
.search-autocomplete-title {
    font-size: clamp( 14px, 2rem, 20px );
    font-weight: 600;
    margin-bottom: 4px;
}
.search-autocomplete-meta {
    font-size: 1.8rem;
    color: #666;
}
.search-autocomplete-none {
    padding: 12px 16px;
    color: #666;
    font-style: italic;
}





/*//// CATEGORY FILTER SECTION ////*/
section.category-filter-section {}
section.category-filter-section div.category-filter-container {
    padding: 0 15rem 4.5rem 15rem;
    background: #F1F1F1;
}
div.category-filter-container div.category-filter-flex-container {}
div.category-filter-flex-container div.category-filter-flex-item {}
div.category-filter-flex-item nav.category-filter-nav {}
div.category-filter-flex-item button.category-filter-btn {
    display: inline-block; 
    width: auto; 
    margin: 0 1rem 1rem 0; 
    padding: 1rem 2rem; 
    text-align: center;
    border-radius: 10px; 
    border: 1px solid #09C; 
    font-size: 2rem;
    font-size: 1.8rem;
    line-height: 1.2; 
    cursor: pointer;
    transition: all .3s ease;
}
div.category-filter-flex-item button.category-filter-btn.active {
    background: #09C;
    color: #ffffff;
}




/*////// POSTS SECTION //////*/
section.posts-section {}
section.posts-section div.posts-container {
    padding: 8rem 23.5rem 9rem 15rem;
}

/*//// FLEX ////*/
div.posts-container div.posts-flex-container {}
div.posts-flex-container article.posts-flex-item {
    margin: 0 0 7rem 0;
    padding: 0 0 4rem 0;
    border-bottom: 1px solid #069;
}

/*// POSTS INTRODUCTION //*/
div.posts-flex-container div.posts-flex-item {
    margin: 0 0 7rem 0;
    padding: 0 0 4rem 0;
    border-bottom: 1px solid #069;
}
div.posts-flex-item h4 {
    width: 90%;
    font-weight: 500;
    font-weight: 600;
}
div.posts-flex-item p {
    width: 90%;
    margin: 0 0;
    margin-bottom: 3rem;
    color: #000;
    font-family: Montserrat;
    font-size: 2.0537rem;
    font-size: clamp( 15px, 2.05rem, 20px );
    font-style: normal;
    font-weight: 400;
    line-height: 3.2859rem;
}

/*// POST META //*/
article.posts-flex-item p.posts-meta {
    margin: 0 0 0 0;
    margin-bottom: 3rem;
    margin-bottom: .5rem;
    color: #000;
    font-family: Montserrat;
    font-size: clamp( 14px, 2rem, 20px );
    font-style: normal;
    font-weight: 400;
    line-height: 1.64; /* 164.293% */
}
article.posts-flex-item p.posts-meta span {
    font-style: italic;
}
article.posts-flex-item p.posts-meta a {
    color: #069;
    font-family: Montserrat;
    font-size: clamp( 14px, 2rem, 20px );
    font-style: italic;
    font-weight: 400;
    line-height: 3.2859rem;
}
article.posts-flex-item p.posts-meta a:hover {
    text-decoration: underline;
}
/*// ELEMENTS //*/
article.posts-flex-item h2.posts-title {
    margin: 0 0 0 0;
    margin-bottom: 3rem;
    color: #069;
    font-family: Montserrat;
    font-size: 3.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: .8425; /* 84.253% */
    text-transform: uppercase;
}
article.posts-flex-item h2.posts-title a {
    margin: 0 0;
    color: #069;
    font-family: Montserrat;
    font-size: 3.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: .8425; /* 84.253% */
    font-size: 2.8rem;
}
article.posts-flex-item p.posts-excerpt {
    width: 90%;
    margin: 0 0;
    margin-bottom: 3rem;
    color: #000;
    font-family: Montserrat;
    font-size: 2.0537rem;
    font-size: clamp( 15px, 2.05rem, 20px );
    font-style: normal;
    font-weight: 400;
    line-height: 3.2859rem;
}

/*//// LOAD MORE BUTTON ////*/
#pagination-flex-item-1 {
    text-align: center;
}
button.load-more-btn,
input.load-more-btn {
    display: inline-block;
    width: auto;
    min-height: 4.8rem;
    margin: 0 auto;
    padding: 1rem 2rem;
    border: none;
    background: transparent;
    color: #069;
    text-align: center;
    font-family: Montserrat;
    font-size: 3rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.6; /* 160% */
    font-variant: all-small-caps;
    cursor: pointer;
}

/*//// ANIMATE AJAX LOAD ////*/
.posts-flex-item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.posts-flex-item.visible {
    opacity: 1;
    transform: translateY(0);
}





/*//// GRANULAR RESPONSIVE CSS HERE ////*/
/*// VERY LARGE SCREEN //*/
@media only screen and (max-width: 1920px) { }
/*// LARGE SCREEN //*/
@media only screen and (max-width: 1800px) { }
/*// MEDIUM & LAPTOP //*/
@media only screen and (max-width: 1600px) { }
@media only screen and (max-width: 1440px) { } /*< DESIGN WIDTH */
/*// SMALL & TABLET //*/
@media only screen and (max-width: 1200px) { }
@media only screen and (max-width: 1100px) { }
/*// MOBILE SCREEN //*/
@media only screen and (max-width: 1024px) {

        /*////// HERO SECTION //////*/
        section.hero-section { padding: 0 0; }
        section.hero-section div.hero-container { padding: 8rem 5rem }

        /*////// SEARCH SECTION //////*/
        section.search-section { padding: 0 0; }
        section.search-section div.search-container { padding: 8rem 5rem 2rem 5rem }
        #search-flex-item-1,
        #search-flex-item-2 { width: 100%; }
        div.search-flex-item h3, 
        div.search-flex-item label.news-search { position: relative; top: initial; transform: none; margin-bottom: 1rem; line-height: 1.2; }
        div.search-flex-item input[type="text"], 
        div.search-flex-item input[type="search"] { width: 100%; margin-bottom: 1rem; }
        iv.search-flex-item input[type="submit"], 
        div.search-flex-item button[type="submit"] { margin-left: 0; }

        /*////// CATEGORY FILTER SECTION //////*/
        section.category-filter-section { padding: 0 0; }
        section.category-filter-section div.category-filter-container { padding: 2rem 5rem 8rem 5rem; }

        /*////// POSTS SECTION //////*/
        section.posts-section { padding: 0 0; }
        section.posts-section div.posts-container { padding: 8rem 5rem }

}
/*// SMALL MOBILE //*/
@media only screen and (max-width: 851px) {

        /*////// HERO SECTION //////*/
        section.hero-section { padding: 0 0; }
        section.hero-section div.hero-container { padding: 8rem 4rem }

        /*////// SEARCH SECTION //////*/
        section.search-section { padding: 0 0; }
        section.search-section div.search-container { padding: 8rem 4rem 2rem 4rem }
        #search-flex-item-1 { width: 100%; }
        div.search-flex-item h3, 
        div.search-flex-item label.news-search { position: relative; top: initial; transform: none; margin-bottom: 1rem; line-height: 1.2; }
        div.search-flex-item input[type="text"], 
        div.search-flex-item input[type="search"] { width: 100%; margin-bottom: 1rem; }
        iv.search-flex-item input[type="submit"], 
        div.search-flex-item button[type="submit"] { margin-left: 0; }

        /*////// CATEGORY FILTER SECTION //////*/
        section.category-filter-section { padding: 0 0; }
        section.category-filter-section div.category-filter-container { padding: 2rem 4rem 8rem 4rem; }

        /*////// POSTS SECTION //////*/
        section.posts-section { padding: 0 0; }
        section.posts-section div.posts-container { padding: 8rem 3rem }

} 
@media only screen and (max-width: 480px) {

        /*////// HERO SECTION //////*/
        section.hero-section { padding: 0 0; }
        section.hero-section div.hero-container { padding: 8rem 3rem }

        /*////// SEARCH SECTION //////*/
        section.search-section { padding: 0 0; }
        section.search-section div.search-container { padding: 8rem 3rem 2rem 3rem }
        #search-flex-item-1 { width: 100%; }
        div.search-flex-item h3, 
        div.search-flex-item label.news-search { position: relative; top: initial; transform: none; margin-bottom: 1rem; line-height: 1.2; }
        div.search-flex-item input[type="text"], 
        div.search-flex-item input[type="search"] { width: 100%; margin-bottom: 1rem; }
        iv.search-flex-item input[type="submit"], 
        div.search-flex-item button[type="submit"] { margin-left: 0; }

        /*////// CATEGORY FILTER SECTION //////*/
        section.category-filter-section { padding: 0 0; }
        section.category-filter-section div.category-filter-container { padding: 2rem 3rem 8rem 3rem; }

        /*////// POSTS SECTION //////*/
        section.posts-section { padding: 0 0; }
        section.posts-section div.posts-container { padding: 8rem 3rem }

}
/*// LANDSCAPE ORIENTATION - TABLET & SMALLER //*/
@media screen and (max-width: 1024px) and (orientation: landscape) { }
@media screen and (max-width: 813px) and (orientation: landscape) { }