.blog--homebanner { background-color: #004d94; color: #FFF; padding: 30px 0; }
.blog--homebanner h1 { color: #FFF; font-size: 2.5rem !important; margin-top: unset; margin-bottom: 10px; }
.blog--homebanner > div { font-size: 1.5rem; }

.blog-body .section {display: flex; flex-wrap: wrap; }

@media screen and (max-width: 599px) {
.blog--homebanner > div { font-size: 1rem; }
}

.post .post-info {
    font-size: 13px;
    color: #000;
}

.post.page { background-color: #fff; padding: 2rem; border-radius: 8px; box-shadow: 0px 8px 24px rgba(0, 0, 0, .12); max-width: 1200px; margin: 0 auto;  }

.post-date { color: #6c7780; font-size: 14px; font-style: normal; line-height: 26px; margin-bottom: 5px; }

h1 a, h2 a {text-decoration: none;}
.post .post-info { font-size: 13px; color: #6c7780; }
.post .post-body a { color: #10344e; font-weight: 600; background-image: none !important; }
.post .post-info a { color: #6c7780; text-decoration: none; font-size: 1rem; font-weight: bold; line-height: 1; }
.post .post-info a:hover { color: #10344e; text-decoration: underline; }

/* --- Blog filter panel (slidefilter style) --- */
.bl-filter-panel { background-color: #fff; height: 100%; border-left: 1px solid #d9d9d9; }
.bl-filter-panel .filter-body.main { padding: 45px 15px 30px 40px; }

.bl-filter-panel .widget { padding: 0; margin-bottom: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
.bl-filter-panel .widget:last-child { border-bottom: none; }

.bl-filter-panel .widget-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 3px 16px 0px; margin: 0; font-weight: 600; font-size: 16px; line-height: 1.2; color: #000; cursor: pointer; user-select: none; }
.bl-filter-panel .widget-header::after { content: ""; display: inline-block; width: 8px; height: 8px; border-left: 1.5px solid #10344e; border-bottom: 1.5px solid #10344e; transform: rotate(-45deg); transition: transform 200ms ease; flex-shrink: 0; margin-left: 0.75rem; }
.bl-filter-panel .widget.open > .widget-header::after { transform: rotate(135deg); }

.bl-filter-panel .widget-content { display: none; flex-direction: column; gap: 4px; padding-bottom: 16px; }
.bl-filter-panel .widget.open > .widget-content { display: flex; }

.bl-filter-panel .widget-content ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0px; }
.bl-filter-panel .widget-content ul li { padding: 4px 0; }
.bl-filter-panel .widget-content ul li a { font-weight: 500; font-size: 1rem; line-height: 1.4; color: #000 !important; opacity: 0.69; transition: opacity 150ms ease; text-decoration: none !important; }
.bl-filter-panel .widget-content ul li a:hover { opacity: 1; }

.sidebar-wrapper ul li a { font-size: 1em !important; }

.banner {text-align: center; padding: 1rem; background-color: #f1f1f1;}
.banner h1 { color: #2E495E; text-align: center; font-family: Philosopher; font-size: 2.4rem;}
.banner p { color: #2E495E; text-align: center; font-family: Poppins; }

.widget {
    padding: 3% 0;
    margin-bottom: 0px;
}

.sidebar-wrapper ul li a{    font-size: 1rem !important;
    color: #004d94 !important;
    text-decoration: none !important;
    font-weight: bold;}

.post-body.text, .post-body.text p, .post-body.text span {font-style: normal;font-size: 1rem !important;color: #000;}
.post-body.text a{text-decoration: underline; }
.post-body.text a.blogbutton{text-decoration: none; }
.post-body.text a.blogbutton:hover{color: #fff !important; }

.post .read-more {font-size: 1.2rem; font-weight: 700 !important;}

a.blogbutton { clear: both; margin: 15px 0 0 0; padding: 0 15px;    text-decoration: none;
    color: #fff !important;
min-height: 55px;
background-color: #10344e;
width: fit-content;
   display: inline-flex; align-items: center;; justify-content: center; 
    border: 0;  text-decoration: none !important; border-radius: 3px; }
a.blogbutton:hover {background-color:#004d94; color: #fff;}

.post .post-body a:hover, .post .post-tags a:hover { color: #666; }

#searchbox {
    display: flex;
}


.widget-content #searchbox input[type=text] {border-radius: 10px; background-color: #fff; border: 1px solid #d7d7d7; padding: 2%; height: 40px; width: 66%; outline: none !important; }
.widget-content #searchbox input[type=submit] { float: right; border: none; padding: 0; height: 40px; width: 33%; background-color: #37aedc; color: #fff; border-radius: 25px !important; border: 1px solid #37aedc; font-weight: 700; cursor: pointer; }
.widget-content #searchbox input[type=submit]:hover { background-color: #fff; color: #37aedc; }

.search-page .search-page-searchbox form input[type=submit] { border: none; padding: 0; height: 40px; width: 150px; background-color: #37aedc; color: #fff; border-radius: 25px !important; border: 1px solid #37aedc; font-weight: 700; cursor: pointer; }
.search-page .searchresult a {color: #37aedc; font-weight: 700; text-decoration: none; font-size: 1.2rem;}
.search-page .searchresult a:hover {color: #004d94;}

.widget ul { list-style: none; padding:  0; margin: 0px; }

.search-page .searchpage ul.paging li.active {background-color: #000;}
.blog-body { background: #f1f1f1; }

/* --- Desktop: full-width content, bottom dropdown nav bar --- */
@media screen and (min-width: 992px) {

    .blog-body .content-wrapper { background-color: #f1f1f1; width: 100% !important; padding-right: 0; }
    .sidebar-wrapper { width: 100% !important; }
    #blognav > .rel { display: flex; align-items: center; gap: 15px; justify-content: center; max-width: 1400px; margin: 0 auto; }
    #blognav .nav-padd { width: 100%; }
}

/* --- Tablet/Mobile: collapsible dropdown nav bar --- */
@media screen and (min-width: 768px) {
    .sidebar-wrapper .hburg { display: none; }
}

@media only screen and (max-width: 991px) {
    .content-wrapper { background-color: #f1f1f1; }
    .sidebar-wrapper { max-height: calc(100vh - 21vw); overflow: auto; background-color: #fff; padding-bottom: 10px; }
    .sidebar-wrapper .rel { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 15px; }
    .sidebar-wrapper .rel .hburg { cursor: pointer; color: #10344e; font-size: 2em; }
    .sidebar-wrapper .rel.shut { max-height: 50px; overflow: hidden; }
    .sidebar-wrapper .rel .fa-times { display: block; }
    .sidebar-wrapper .rel .fa-bars { display: none; }
    .sidebar-wrapper .rel.shut .fa-bars { display: block !important; }
    .sidebar-wrapper .rel.shut .fa-times { display: none !important; }
    .sidebar-wrapper .widgetzone { flex-wrap: wrap; padding: 1rem 0px; gap: .5rem; }
    .sidebar-wrapper .widgetzone > div { flex: 0 0 100%; width: 100%; }
    .sidebar-wrapper .widget { padding: .5rem 0; }
}

/* ===== Tile grid + bottom dropdown nav (ported layout, CrossAccounting theme colours) ===== */

/* Post tile grid — responsive columns: 4 -> 3 -> 2 -> 1 by viewport width */
.posts { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 1rem; margin: 0 auto; }
.posts .post { overflow: hidden; margin-bottom: 0px; position: relative; background-color: #fff; border-radius: 8px; display: flex; flex-direction: column-reverse; box-shadow: 0px 8px 24px rgba(0, 0, 0, .12); }
@media screen and (max-width: 1100px) { .posts { grid-template-columns: repeat(2, 1fr); } }
@media screen and (max-width: 767px)  { .posts { grid-template-columns: repeat(1, 1fr); } }
@media screen and (max-width: 480px)  { .posts { grid-template-columns: repeat(1, 1fr); } }

/* Tile image box — the excerpt text collapses, only the lead image shows */
.posts .post .post-body { font-size: 0em; line-height: 1; padding-top: 51.06%; display: block; max-height: 10px; position: relative; overflow: hidden; margin: 0px; }
.posts .post .post-body.text, .posts .post .post-body.text p, .posts .post .post-body.text span { font-size: 0 !important; margin: 0 !important; }
.posts .post .post-body img, .posts .post .post-body iframe, .posts .post .post-body object, .posts .post .post-body embed { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; width: auto !important; height: auto; margin: 0 !important; }
.posts .post .post-image { margin: 0; }
/* Fallback tile image for posts with no lead image — mirrors the main-site RSS card */
.posts .post .post-image--placeholder { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; margin: 0; background-color: #36abd8; }
.posts .post .post-image--placeholder svg { position: static; width: 35%; max-width: 104px; height: auto; } 
.posts .post .read-more, .posts .post .post-edit-link { display: none; }

/* Tile header (date, title, meta) */
.posts .post .post-header { border-bottom: none; padding: 15px; margin: 0px; }
.posts .post.post-home .post-header { border-bottom: 5px solid #10344e; height: 100%; display: flex; flex-direction: column; }
.posts .post.post-home .post-header h2 {font-size: 1.8rem; line-height: 1.2; margin-bottom: 1rem;}
.posts .post .cattitle { line-height: 1.2; min-height: 60px; margin-top: 0px; }
.posts .post h1 a, .posts .post h2 a { color: #10344e; display: block; font-family: 'Philosopher', serif; }
.posts .post h1 a:hover, .posts .post h2 a:hover { color: #174a70; }
.posts .post .post-info { flex-wrap: wrap; }

/* Bottom dropdown nav bar */
.sidebar-wrapper { background-color: transparent; margin-top: 30px; padding-bottom: 30px; }
.widgetzone { display: flex; flex-wrap: nowrap; max-width: 1400px; width: 100%; margin: 0 auto; }
.widgetzone > div { flex: 1 1 0; min-width: 0; padding: 0 .5rem; }

#blognav .widget { background-color: transparent; padding: 0; margin: 0; }
#blognav .widget-content { display: block; }
#blognav .dummy-drop-box { cursor: pointer; border-radius: 3px; position: relative; color: #4a4a4a; font-size: 1.2em; background-color: #fff; width: 100%; border: 1px solid #757575; }
#blognav .dummy-drop-box .inner { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0px 15px; height: 50px; width: 100%; font-weight: 600; font-size: 1.2em; }
#blognav .dummy-drop-box .inner span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
#blognav .dummy-drop-box .inner i { flex: 0 0 auto; font-size: 1.0em; color: #10344e !important; transition: transform 0.2s ease; }
#blognav .dummy-drop-box.open .inner i { transform: rotate(180deg); }
#blognav .dummy-drop-box .dropdown-container { display: none; position: absolute; left: 0px; top: 100%; z-index: 15; border: 1px solid #d7d7d7; width: 100%; background-color: #fff; max-height: 350px; overflow: auto !important; padding: 10px 0px; }
#blognav .dummy-drop-box.open .dropdown-container { display: block; }
#blognav .dummy-drop-box .dropdown-container ul { list-style: none; padding: 0px; margin: 0px; }
#blognav .dummy-drop-box .dropdown-container li { padding: 0px; }
#blognav .dummy-drop-box .dropdown-container a { padding: 5px 15px; display: block; color: #000 !important; font-size: 1rem !important; font-weight: bold; }
#blognav .dummy-drop-box .dropdown-container a:hover { color: #10344e !important; }

/* month-list year sub-toggle */
#blognav .dummy-drop-box .year { cursor: pointer; }
#blognav .dummy-drop-box .year-title { padding: 5px 15px; font-weight: 600; }
#blognav .dummy-drop-box .year-ul { display: none; padding: 0px; }
#blognav .dummy-drop-box .year-ul.open { display: block; }

/* search widget in the bar */
#blognav .widget.search { margin: 0; }
#blognav .widget.search .widget-content { display: block; }
#blognav .widget.search #searchbox { display: block; }
#blognav .widget.search form { display: block; gap: 0; }
#blognav .widget.search input[type=text] { background-color: #fff; border: 1px solid #757575; border-radius: 0; padding-left: 1rem; height: 50px; width: 75% !important; outline: none !important; font-size: 1.1em; }
#blognav .widget.search input[type=submit] { border-radius: 0px 3px 3px 0px !important; border: none; float: right; width: 25% !important; height: 50px; background-color: #37aedc; color: #fff; font-size: 1em; font-weight: 700; cursor: pointer; }
#blognav .widget.search input[type=submit]:hover { background-color: #fff; color: #37aedc; }

/* home link icon */
#blognav .homelink { color: #37aedc; font-size: 1.5em; text-decoration: none; }