:root {
    --admin-interface-title-color: #DDDDDD;
    --admin-interface-logo-color: #CCCCCC;
    --admin-interface-env-color: #E74C3C;
    --admin-interface-header-background-color: #2C3840;
    --admin-interface-header-text-color: #f1f5f8;
    --admin-interface-header-link-color: #FFFFFF;
    --admin-interface-header-link-hover-color: #DDDDDD;
    --admin-interface-module-background-color: #074E68;
    --admin-interface-module-background-selected-color: #FFFFCC;
    --admin-interface-module-text-color: #FFFFFF;
    --admin-interface-module-link-color: #FFFFFF;
    --admin-interface-module-link-selected-color: #FFFFFF;
    --admin-interface-module-link-hover-color: #DDDDDD;
    --admin-interface-generic-link-color: #000000;
    --admin-interface-generic-link-hover-color: #074E68;
    --admin-interface-generic-link-active-color: #0A6E92;
    --admin-interface-save-button-background-color: #0A6E92;
    --admin-interface-save-button-background-hover-color: #074E68;
    --admin-interface-save-button-text-color: #FFFFFF;
    --admin-interface-delete-button-background-color: #CC4B37;
    --admin-interface-delete-button-background-hover-color: #BF4634;
    --admin-interface-delete-button-text-color: #FFFFFF;
    --admin-interface-related-modal-background-color: #000000;
    --admin-interface-related-modal-background-opacity: 0.2;
    --admin-interface-main-border-top: 10px solid var(--admin-interface-module-background-color);
    --admin-interface-logo-max-width: min(400px, 100%);
    --admin-interface-logo-max-height: 100px;
    --admin-interface-related-modal-border-radius: 4px;
    --admin-interface-module-border-radius: 4px;
    --admin-interface-jsoneditor-border-radius: var(--admin-interface-module-border-radius);
    --admin-interface-jsoneditor-overflow: hidden;
    --admin-interface-related-modal-close-button-display: unset;
}

#header {
    height: auto;
    min-height: 55px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--admin-interface-header-background-color);
    color: var(--admin-interface-header-text-color);
}

#branding h1 {
    padding: 0;
    margin: 0;
    margin-inline-end: 20px;
    font-weight: 300;
    font-size: 1.5rem;
    color: var(--admin-interface-title-color);
}

#branding h1 a, #branding h1 a:visited {
    color: inherit;
}

div.breadcrumbs {
    background: var(--admin-interface-module-background-color);
    color: var(--admin-interface-module-text-color);
}

.wrapper{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -70px;
}

.footer, .push {
    height: 70px; /* .push must be the same height as .footer */
}

#footer{
    background: var(--admin-interface-header-background-color)!important;
    color: var(--admin-interface-header-text-color)!important;
}

#footer-middle{
    background: var(--admin-interface-header-background-color);
    color: var(--admin-interface-header-text-color);
}

.centered-img{
    margin-right: auto;
    margin-left: auto;
}


.focal-card{
    height: 440px;
}

.focal-card > .desc{
    height: 25%;
}

.focal-card > .img{
    height: 75%;
}