body {
    background-color: rgba(var(--primary-color-rgb));
}

@media only screen and (max-width: 50.99rem) {
    @media (display-mode: standalone) {
        #g-top-nav {
            display: flex!important;
        }
        #g-mobile-fixed-nav {
            display: flex!important;
        }
        #g-top.modern-alert-padding {
            padding: 2rem 5%!important;
        }
        body {
            background-color: rgba(var(--primary-color-rgb));
        }
        #g-offcanvas {
            height: calc(100% - 120pt); 
            top: 40pt; 
            bottom: 80pt;
        }
        #g-top {
            margin-top: 40pt!important;
        }
        #g-navigation .g-logo {
            display: none;
        }
        #g-top-nav .g-particle:has(.g-logo) {
            width: 100%;
        }
        #g-top-nav .g-logo {
            text-align: center; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            width: 100%; 
            height: 40pt;
        }
        #g-top-nav .g-logo img {
            height: 80%; 
            width: auto;
        }
        #g-page-surround .g-offcanvas-toggle {
            display: none;
        }
        #g-page-surround {
            background: rgba(var(--primary-color-rgb));
        }
        #g-top-nav {
            display: flex; 
            position: fixed; 
            top: 0; 
            left: 0; 
            right: 0; 
            width: 100%; 
            height: 40pt; 
            background: rgba(var(--primary-color-rgb)); 
            z-index: 1000; 
            box-shadow: var(--default-box-shadow);
        }
        .g-offcanvas-toggle {
            position: fixed!important; 
            z-index: 101; 
            top: 0; 
            left: 10pt; 
            height: 40pt; 
            font-size: 23pt; 
            display: flex; 
            justify-content: center; 
            align-items: center; 
            background: none!important; 
            border-radius: unset; 
            box-shadow: unset;
        }
        .g-offcanvas-toggle {
            color: rgba(var(--default-white-rgb));
        } 
        .g-offcanvas-toggle .fa-fw {
            text-shadow: none;
        }
        #g-container-footer {
            padding-bottom: 80pt!important;
        }
        #g-mobile-fixed-nav {
            display: flex; 
            height: 80pt; 
            background: rgba(var(--primary-color-rgb)); 
            color: rgba(var(--default-white-rgb)); 
            backdrop-filter: blur(10px); 
            -webkit-backdrop-filter: blur(10px); 
            z-index: 1000; 
            position: fixed; 
            bottom: 0; 
            left: 0; 
            right: 0; 
            width: 100%; 
            box-shadow: var(--default-box-shadow);
        }
        .mobile-nav-link {
            color: rgba(var(--default-white-rgb)); 
            display: flex; 
            flex-direction: column; 
            justify-content: center; 
            align-items: center; 
            text-align: center; 
            height: 60pt;
        }
        .mobile-nav-link:hover {
            color: rgba(var(--secondary-color-rgb));
        }
        .mobile-fixed-nav {
            width: 100%; 
            height: 60pt;
        }

        .mobile-fixed-nav {
            margin: 0;
            padding: 0;
            display: flex;
            width: 100%;
            align-items: center;
            overflow: hidden;
        }
        .mobile-fixed-nav .g-particle {
            margin: 0;
            padding: 0;
            width: 100%;
        }
        .mobile-fixed-nav .g-particle > div {
            margin: 0;
            padding: 0;
        }
        .mobile-fixed-nav .g-blockcontent {
            margin: 0;
            padding: 0;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent {
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            gap: 1pt;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent-block {
            margin: 0;
            padding: 0;
            flex: 1;
            position: relative;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent-block-content {
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent-title-icon {
            margin: 0;
            padding: 0;
            order: 1;
            color: rgba(var(--default-white-rgb));
            font-size: 5vw;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent-title {
            margin: 0;
            padding: 0;
            order: 2;
        }
        .mobile-fixed-nav .g-blockcontent-subcontent-title-text {
            margin: 0;
            padding: 0;
            color: rgba(var(--default-white-rgb));
            font-size: 4vw;
            font-family: var(--body-font-family);
        }
        .mobile-fixed-nav .g-blockcontent-buttons {
            margin: 0;
            padding: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
        }
        .mobile-fixed-nav .g-blockcontent-buttons a {
            margin: 0;
            padding: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
        }
    }
}