.page-id-2891 p.p {
    padding-bottom: 20px;
    padding-top: 18px;
    line-height: 30px;
    font-size: 20px;
}

.page-id-2891 .fs-1 {
    line-height: 50px;
}

.page-id-2891 h2.fs-2.fw-bold.py-3 {
    line-height: 45px;
}

li#menu-item-2866 {
    display: none !important;
}

#blocks .grid-container {
    flex-wrap: wrap;
    display: flex;
    gap: 1em;
    justify-content: center;
}

#blocks .grid-container .grid-item {
    flex-basis: 13%;
}

#game-charger h1 {
    text-transform: uppercase;
}

#block-contents .image-grid-container {
    flex-wrap: wrap;
    display: flex;
    gap: 1em;
    justify-content: center;
}

.entry-content #blocks .grid-container .grid-item h3 {
    padding: 0px;
}

section#block-contents {
    padding-top: 0px;
    padding-bottom: 50px;
}

#block-contents .image-grid-container .image-grid-item {
    flex-basis: 13%;
}

#block-contents .image-grid-container .image-grid-item {
    flex-basis: 49%;
    border: 1px solid rgba(230, 230, 230, 1);
    background: rgba(255, 255, 255, 1);
    padding: 20px;
    border-radius: 10px;
}

.page-id-2037 #blocks .grid-item {
    height: 112px;
    padding: 10px 4px;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 10px;
}

#blocks .grid-item {
    height: auto;
    padding: 10px 4px;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 10px;
}

.entry-content .image-grid-item h2 {
    padding-bottom: 10px;
}

.entry-content .block-content h1 {
    font-size: 25px;
    font-weight: 600;
    line-height: 33.25px;
    letter-spacing: 0.2em;
    color: #DD8028;
    font-family: inherit !important;
}

.technology-new .project-card {
    padding: 20px !important;
    border-radius: 10px !important;
    border-color: #E6E6E6 !important;
}

.entry-content .technology-new .card-body.p-3.projects_list {
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.entry-content p.techno-text {
    padding-top: 18px;
    padding-bottom: 10px;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    color: #7E7E7E !important;
}

.technology-new .card.h-100 {
    padding: 20px;
}

p.techno-heading {
    font-size: 25px;
    font-weight: 600;
    padding-top: 10px;
    line-height: 34px;
    padding-bottom: 0;
}

.entry-content .tech-bg a.btn.btn-secondary.btn-lg.px-lg-5 {
    font-family: inherit !important;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    background-color: #027992 !important;
    border-radius: 5px;
    padding: 10px;
}

.entry-content .feture-proj p {
    font-family: inherit !important;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    color: #7E7E7E;
}

.entry-content .project-wt-bg p {
    font-family: inherit !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    color: #7E7E7E;
}

.project-blue-bg {
    background-color: #027992;
}

.entry-content .project-blue-bg h2 {
    padding: 10px 0 0px 0;
    margin: 0 0 0.5em 0;
    color: #fff !important;
    font-size: 35px;
    line-height: 45px;
}

.entry-content .project-blue-bg p {
    font-family: inherit !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    text-align: left;
    color: #fff !important;
}

section#hellbender-projects {
    padding-bottom: 20px;
}

#hellbender-projects h1.fw-bold.entry-title.pb-0.fs-1 {
    font-size: 40px !important;
    font-weight: 600 !important;
    line-height: 53px !important;
    color: #027992 !important;
    font-family: inherit !important;
}

.entry-content #hellbender-projects select#project-technologies {
    color: #575757;
    font-size: 18px;
    font-weight: 600;
    line-height: 30px;
}

#hellbender-projects p.pb-1.fw-bold.mb-0.text-white {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 30px !important;
    padding-bottom: 10px;
    font-family: inherit !important;
}

#hellbender-projects p.fw-medium.small.mb-0.text-white.opacity-50 {
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    padding-top: 10px;
    font-family: inherit !important;
}

#hellbender-projects label.form-label.opacity-50.small.fw-normal.mb-1 {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    color: #ABABAB;
    padding-bottom: 10px;
    font-family: inherit !important;
}

.tech-conclson {
    background: #DD8028;
}

.entry-content .tech-conclson h2.display-4.fw-bold.pb-3 {
    color: #fff !important;

}

.entry-content .tech-conclson p.p {
    color: #fff !important;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    font-family: inherit !important;
}

#in-dep {
    background: #fff;
    box-shadow: 0px 0px 100px 0px rgba(92, 92, 92, 0.1);
    border-radius: 10px;
}

.row.in-dep-section {
    margin-top: -80px;
    padding: 35px;
}

#in-dep p {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    font-family: inherit !important;
}

#technical-specifications h2 {
    padding-bottom: 25px !important;
    color: #027992;
    font-family: inherit !important;
}

#technical-specifications li {
    list-style: none !important;
    color: #7E7E7E !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    font-family: inherit !important;
}

#technical-specifications li strong {
    color: #212529 !important;
    font-weight: 600 !important;
    font-family: inherit !important;
}

#technical-specifications ul {
    list-style-type: none; /* Remove default bullets */
}

#technical-specifications li {
    position: relative; /* Needed for pseudo-element positioning */
    padding-left: 35px; /* Adjust to make space for the image */
    margin: 5px 0; /* Optional: add some spacing between items */
}

#technical-specifications li::before {
    content: "";
    background-image: url('https://dev.hellbender.com/wp-content/uploads/2024/08/list-con.png');
    background-size: contain; /* Ensure the image scales correctly */
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 20%;
    transform: translateY(-50%); /* Center the image vertically */
    width: 20px; /* Adjust as needed */
    height: 20px; /* Adjust as needed */
}

.specifications-content ul {
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#tech-spec {
    background-color: #F8F9FB;
    padding-top: 90px;
    padding-bottom: 90px;
}

.project-blue-bg {
    background-color: #027992 !important;
    border: none !important;
}

.entry-content #tech-spec p.p {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    color: #7E7E7E !important;
    font-family: inherit !important;
}

.entry-content .realtime p {
    font-size: 17px;
    font-weight: 400;
    line-height: 30px;
    color: #7E7E7E !important;
    font-family: inherit !important;
}

#Proofing {
    padding-bottom: 90px;
    padding-top: 90px;
}

.realtime .image-grid-container {
    flex-wrap: wrap !important;
    display: flex !important;
    gap: 10px !important;
    justify-content: center;
}

.realtime .image-grid-container .image-grid-item {
    flex-basis: 23% !important;
    overflow: hidden;
}

.entry-content .block-tag .tech-bg h2 {
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 53px;
    padding: 0px;
    font-family: inherit !important;
}

.entry-content .block-tag .project-blue-bg h2 {
    padding: 10px 0 0px 0 !important;
    margin: 0 0 0.5em 0 !important;
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 54px;
    color: #fff !important;
}


.future-Proofing .grid-container .grid-item {
    flex-basis: 49% !important;
}

.future-Proofing #blocks .grid-item {
    text-align: left !important;
    padding: 20px !important;
    border-radius: 10px !important;
}

.future-Proofing #blocks .grid-item {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    color: #212529;
    font-family: inherit !important;
}

.future-Proofing #blocks .grid-container .grid-item h3 {
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 53.2px;
    text-align: left !important;
    color: #027992;
}

.last-text p {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 30px !important;
    text-align: left;
    font-family: inherit !important;
}

.future-Proofing {
    padding-bottom: 2rem;
    padding-top: 2rem;
}

.entry-content .block-tag .feture-proj h2 {
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 53.2px;
    text-align: center;
}

.entry-content .tech-conclson h2 {
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 53.2px;
}

.entry-content #in-dep h2 {
    font-family: inherit !important;
    font-size: 40px;
    font-weight: 600;
    line-height: 53.2px;
    text-align: center;
}

.entry-content .realtime h2 {
    font-size: 20px;
    font-weight: 600;
    line-height: 30px;
    margin: 0 0 0.5em 0;
    padding: 10px 0 0px 0;
    font-family: inherit !important;
}

.entry-content .main-content h2 {
    font-size: 50px;
    font-weight: 700;
    line-height: 66.5px;
    font-family: inherit !important;
}


.entry-content #tech-spec .block-tag h2,
.entry-content .block-tag .in-dep-section h2 {
    font-size: 40px;
    font-weight: 600;
    line-height: 53.2px;
    font-family: inherit !important;
}

.entry-content .block-tag .project-wt-bg h2 {
    font-family: inherit !important;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    font-family: inherit !important;
}

div#game-charger {
    background: linear-gradient(180deg, rgba(221, 128, 40, 0.15) 0%, rgba(221, 128, 40, 0) 100%);
    padding-bottom: 50px;
    padding-top: 50px;

}

div#game-charger p {
    line-height: 30px;
    font-size: 19px;
    font-family: inherit !important;
}

.row.reveal.fade-bottom.active.technology-new {
    padding-bottom: 30px;
}

.entry-content #feture-proj {
    padding-top: 90px;
    padding-bottom: 90px;
}

div#technical-specifications {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

.entry-content .realtime .image-grid-container .image-grid-item {
    flex-basis: 23%;
    overflow: hidden;
}

.entry-content #tech-spec .display-4.fw-bold.pb-3 {
    font-size: 40px;
    font-family: inherit !important;
}

#blocks .grid-container .grid-item h3 a {
    display: flex;
    justify-content: center;
    height: auto;
    padding: 10px 20px;
    align-items: center;
    width: 100%;
    font-family: inherit !important;
    font-size: 18px;
    text-decoration: none;
}

.entry-content .tech-bg .btn-secondary:hover {
    color: #fff !important;
    background-color: #000 !important;
    border-color: #000 !important;
}

.future-Proofing p strong {
    color: #027992;
    font-family: inherit !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
}

.responsive-table {
    width: 100%;
    border-collapse: collapse;
}

.responsive-table th, .responsive-table td {
    padding: 12px;
    text-align: left;
}

.responsive-table th {
    background-color: #f2f2f2;
    font-weight: 700;
}

.responsive-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.responsive-table tr:nth-child(odd) {
    background-color: #ffffff;
}

.responsive-table tr:hover {
    background-color: #d1e0e0;
}

@media screen and (max-width: 768px) {
    .responsive-table, .responsive-table thead, .responsive-table tbody, .responsive-table th, .responsive-table td, .responsive-table tr {
        display: block;
    }

    .responsive-table th {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .responsive-table tr {
        border: 1px solid #ccc;
    }

    .responsive-table td {
        border: none;
        position: relative;
        padding-left: 80%;
        text-align: left;
    }

    .responsive-table td:before {
        position: absolute;
        top: 12px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        font-weight: bold; /* Make the pseudo-content bold */
    }

    .responsive-table td:nth-of-type(1):before {
        content: "Line";
    }

    .responsive-table td:nth-of-type(2):before {
        content: "RP2350A Pin";
    }

    .responsive-table td:nth-of-type(3):before {
        content: "Fn";
    }

    .responsive-table td:nth-of-type(4):before {
        content: "PICO SDK Default Fn for that GPIO";
    }

    .responsive-table td:nth-of-type(5):before {
        content: "Hb RP2350 Dev Board Pin";
    }

    .responsive-table td:nth-of-type(6):before {
        content: "Hb Silk Screen";
    }

    .responsive-table td:nth-of-type(7):before {
        content: "Hb Net Name";
    }
}

table.table-responsive-1 {
    margin: 0 auto;
}

.table-responsive-1 {
    width: 100%;
    border-collapse: collapse;
    margin: 20px auto; /* Center the table horizontally */
    font-size: 16px;
    text-align: left;
    max-width: 800px; /* Optional: Set a max width for better appearance */
}

.table-responsive-1 th,
.table-responsive-1 td {
    padding: 12px 15px;
}

.table-responsive-1 th {
    background-color: #f4f4f4;
}

.table-responsive-1 tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

.table-responsive-1 tbody tr:nth-child(odd) {
    background-color: #ffffff;
}

.table-responsive-1 tbody tr:hover {
    background-color: #e0e0e0;
}

.table-responsive-1 td:first-child {
    font-weight: 700;
}

/* Mobile styles */
@media (max-width: 600px) {
    .table-responsive-1 {
        display: block;
        width: 100%;
        overflow-x: auto;
    }

    .table-responsive-1 thead {
        display: none; /* Hide the table header on mobile */
    }

    .table-responsive-1 tbody,
    .table-responsive-1 tr {
        display: block;
        width: 100%;
    }

    .table-responsive-1 tr {
        margin-bottom: 15px;
        border: 1px solid #ddd; /* Add border around rows for better visibility */
    }

    .table-responsive-1 td {
        display: block;
        text-align: left;
        padding: 12px;
        position: relative;
        border-bottom: 1px solid #ddd; /* Add border at the bottom of each cell */
    }

    .table-responsive-1 td::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        width: 50%;
        padding-left: 15px;
        font-weight: bold;
        text-align: left;
        background-color: #f4f4f4;
        box-sizing: border-box;
        border-right: 1px solid #ddd;
        top: 0;
    }
}

#in-dep p {
    color: #7E7E7E;
}


/* General Menu Styles */
#menu-main_menu {
    gap: 2rem;
    list-style: none;
    padding: 0;
    margin: 0 auto;
}

#menu-main_menu > li {
    position: relative;
    display: inline-block;
}

#menu-main_menu > li > a {
    border-bottom: 2px solid transparent;
    text-decoration: none;
    padding: 10px 10px;
    display: block;
    color: white;
}

#menu-main_menu > li:hover > a {
    border-bottom: 2px solid white;
}


/* Submenu Styles */
#menu-main_menu .sub-menu {
    display: none;
    border-radius: 15px;
    position: absolute;
    top: 100%;
    left: 0;
    padding: 0;
    margin: 0;
    z-index: 1000;
    min-width: 250px;
}

#menu-main_menu .sub-menu li {
    display: block;
    position: relative;
}

#menu-main_menu .sub-menu li a {
    padding: 14px 10px;
    display: block;
    color: white;
    text-decoration: none;
}

#menu-main_menu .sub-menu li a:hover {
    background-color: var(--color-dark-blue);
    border-radius: 15px;
}

/* Show Submenu on Hover */
#menu-main_menu li:hover > .sub-menu {
    display: block;
}

/* Second-Level Submenu (Third Level Menu) */
#menu-main_menu .sub-menu .sub-menu {
    left: 100%;
    top: 0;
    display: none;
}

#menu-main_menu .sub-menu li:hover > .sub-menu {
    display: block;
}

/* Add down arrow to first-level and second-level menu items */
.menu-item-has-children > a::after {
    /*content: "\25BC"; !* Unicode for down arrow (▼) *!*/
    margin-left: 5px;
    font-size: 0.8em;
    display: inline-block;
    transition: transform 0.3s ease;
    color: rgb(255 255 255); /* Ensure arrow is white */
}


/* Add right arrow for second-level menu (third-level submenu) */
.menu-item-has-children .sub-menu .menu-item-has-children > a::after {
    content: "\25B6"; /* Unicode for right arrow (►) */
    transform: none; /* Reset any previous rotation */
    color: rgb(255 255 255); /* Ensure arrow is white */
}


/* Submenu Styles */
.sub-menu {
    display: none;
    position: absolute;
    background-color: var(--color-primary-teal);
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 1000;
}

/* Display submenu on hover or focus */
.menu-item-has-children:hover > .sub-menu,
.menu-item-has-children:focus > .sub-menu {
    display: block;
}

.blog .card.border.h-100 img,
.archive .card.border.h-100 img {
    height: 270px;
    object-fit: cover;
    width: 100%;
    object-position: center;
}


/* Optional: Style the submenu when the parent is active */
.current-menu-parent > .sub-menu,
.current-menu-ancestor > .sub-menu {
    display: block; /* Ensure submenu is visible for active parent */
}

/* Responsive Style */
@media (max-width: 768px) {
    .menu-item-has-children > a::after {
        display: none;
    }

    #menu-main_menu .sub-menu {
        position: relative;
        width: 100%;
    }

    #menu-main_menu .sub-menu .sub-menu {
        position: relative;
        left: 0;
    }

    /* Stack menu vertically */
    #menu-main_menu {
        display: block;
        width: 100%;
    }

    /* Make menu items full width */
    #menu-main_menu > li {
        display: block;
        width: 100%;
    }

    /* Style for mobile menu links */
    #menu-main_menu > li > a {
        padding: 15px;
        width: 100%;
        color: white;
    }

    /* Submenu styles for mobile */
    .sub-menu {
        position: relative;
        width: 100%;
    }

    /* Third-level submenus in mobile view */
    .menu-item-has-children .sub-menu .menu-item-has-children > a::after {
        display: none;
    }


    /* Hide submenu by default on mobile */
    .sub-menu {
        display: none;
    }

    /* Show submenu when clicking the parent link on mobile */
    .menu-item-has-children.open > .sub-menu {
        display: block;
    }
}


.post-meta-line {
    display: flex;
    justify-content: center; /* Centers content horizontally */
    align-items: center; /* Centers content vertically */
    gap: 15px; /* Space between title, date, and categories */
    text-align: center; /* Ensures all text elements are centered */
    flex-wrap: wrap; /* Allows wrapping for smaller screens */
    padding-top: 15px;
}

.post-meta-line .post-date,
.post-meta-line .post-categories,
.post-meta-line .post-author {
    font-size: 16px;
    color: #fff;
}

.post-meta-line a {
    text-decoration: none;
    color: inherit;
}

/* Optional: Style for the title link on hover */
.post-categories a:hover {
    color: #dd8028;
    text-decoration: none;
}

.post-meta-line .post-date::after,
.post-meta-line .post-categories::after {
    content: "|"; /* Adds a slash after the title and date */
    margin-left: 10px; /* Space between the element and the slash */
    color: #fff; /* Same color as the date and category */
}

.single-post .entry-content p {
    line-height: 30px;
}