:root {
    --zlht-header-height: 72px;
    --zlht-topbar-height: 0px;
    --zlht-admin-offset: 0px;
}

body.admin-bar {
    --zlht-admin-offset: 32px;
}

.top-bar {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

#masthead {
    position: fixed;
    top: var(--zlht-admin-offset);
    right: 0;
    left: 0;
    z-index: 9999;
}

body:not(.home) {
    padding-top: calc(var(--zlht-header-height) + var(--zlht-topbar-height));
}

body.home {
    padding-top: 0;
}

@media (max-width: 782px) {
    body.admin-bar {
        --zlht-admin-offset: 46px;
    }
}

@media (max-width: 768px) {
    :root {
        --zlht-topbar-height: 32px;
    }

    .top-bar {
        position: fixed;
        top: var(--zlht-admin-offset);
        right: 0;
        left: 0;
        z-index: 10000;
        display: block !important;
        height: var(--zlht-topbar-height) !important;
        min-height: var(--zlht-topbar-height) !important;
        overflow: hidden !important;
    }

    #masthead {
        top: calc(var(--zlht-admin-offset) + var(--zlht-topbar-height));
    }
}