html {
    font-size: 1rem;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    display: grid;
    grid-template-columns: 20rem auto;
}

header, footer {
    background-color: whitesmoke;
    grid-column-start: span 2;
}

header {
    height: 60px;
}

footer {
    height: 40px;
}

header {
    display: grid;
    grid-template-columns: auto auto;
}

.navigation {
    min-height: calc(100vh - 100px);
    padding: 20px;
    background-color: #272727;
    color: white;
}

    .navigation ul {
        padding-left: 0;
    }

    .navigation li {
        list-style: none;
    }

        .navigation li a {
            color: white;
            text-decoration: none;
        }

            .navigation li a:hover {
                color: lightgray;
            }

header a {
    color: black;
    text-decoration: none;
}

    header a:hover {
        color: slategray;
    }

/* styles for area companies */
#portal-container .d-grid:nth-child(even) {
    background-color: whitesmoke;
}

#portal-container .d-grid {
    grid-template-columns: 10rem auto 100px;
    padding: 2px 4px 4px 4px;
}

    #portal-container .d-grid .company-id {
        text-align: left;
    }

    #portal-container .d-grid .company-name {
        text-align: left;
    }

    #portal-container .d-grid .company-actions {
        text-align: right;
        font-size: small;
    }

#portal-container #portal-logo {
    border: 1px solid lightgray;
}

#portal-container .text-emphasized {
    font-size: large;
}

/* styles for area blacklist */
#blacklist-container .d-grid:nth-child(even) {
    background-color: whitesmoke;
}

#blacklist-container .d-grid {
    grid-template-columns: 10rem auto 100px 90px;
    padding: 2px 4px 4px 4px;
}

    #blacklist-container .d-grid .installation-field {
        text-align: left;
    }

    #blacklist-container .d-grid .installation-actions {
        text-align: right;
    }

/* styles for area resource library */
#resourcelib-container .d-grid:nth-child(even) {
    background-color: whitesmoke;
}

#resourcelib-container .d-grid {
    grid-template-columns: 15% 50% 25% 10%;
    padding: 2px 4px 4px 4px;
}

    #resourcelib-container .d-grid.head {
        background-color: darkslategray;
        color: white;
    }