h3 {
    font-size: 1.5em;
    font-weight: 500;
}


h3,
.mdl-layout__tab {
    color: white !important;
}

.mdl-layout__tab {
    text-transform: none;
    letter-spacing: 0.2px;
    padding: 0 16px;
}

.mdl-layout__tab.title {
    color: #ededed !important;
    font-weight: 600;
    text-transform: none;
    font-size: 1.25em;
}

.small_screens {
    display: none;
}

@media screen and (max-width: 640px) {
    .small_screens {
        display: block;
    }

    .large_screens {
        display: none;
    }
}

a {
    color: inherit;
}

li {
    margin-bottom: 2em;
}

#downloads_article li {
    margin-bottom: 0;
}

img {
    object-fit: contain;
    max-height: 32rem;
    margin: 1rem 0;
    display: block;
    max-width: 100%;
}

#related a:hover {
    text-decoration: underline;
}

h4 {
    margin-bottom: 1.25rem !important;
}

::selection {
    background: #388e3c5c;
    text-shadow: none;
}

html,
body {
    font-family: 'Roboto', 'Helvetica', sans-serif;
    margin: 0;
    padding: 0;
}

.mdl-layout__header-row {
    padding-left: 40px;
}

.mdl-layout__tab-bar-button {
    display: none;
}

.mdl-layout.is-small-screen .mdl-layout__tab-bar .mdl-button {
    display: none;
}

.mdl-layout:not(.is-small-screen) .mdl-layout__tab-bar,
.mdl-layout:not(.is-small-screen) .mdl-layout__tab-bar-container {
    overflow: visible;
}

.mdl-layout__tab-bar-container {
    height: 64px;
}

.mdl-layout__tab-bar {
    padding: 0;
    padding-left: 16px;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    background-color: #3e9342;
}

.mdl-layout__tab-bar .mdl-layout__tab {
    height: 64px;
    line-height: 64px;
}

.mdl-layout__tab-bar .mdl-layout__tab.is-active::after {
    background-color: #fff !important;
    height: 4px;
}

main>.mdl-layout__tab-panel {
    padding: 8px;
    padding-top: 48px;
}

.mdl-card {
    height: auto;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.mdl-card>* {
    height: auto;
}

.mdl-card .mdl-card__supporting-text {
    margin: 40px;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0;
    color: inherit;
    width: calc(100% - 80px);
}

section.section--center {
    max-width: 860px;
}

.mdl-list__item-secondary-action {
    color: #388e3c;
}

.mdl-layout__content {
    display: flex;
    flex-direction: column;
    padding-top: 3em;
}

.mdl-layout__content>div {
    flex: 1;
}

.mdl-mega-footer--link-list {
    margin: 0;
}

.mdl-mega-footer {
    margin-top: 3em;
}

.dark_image {
    display: none;
}

h5 {
    font-size: 18px;
}

textarea.code {
    background: #f3f3f3;
    padding: 0.75em;
    overflow-x: auto;
    max-width: 100%;
    border: none;
    width: 100%;
    outline: none;
    resize: none;
    white-space: pre;
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
    }

    .light_image {
        display: none;
    }

    .dark_image {
        display: block;
    }

    .mdl-color-text--grey-700 {
        color: rgb(171, 163, 152) !important;
    }

    .mdl-color--grey-100 {
        background-color: rgb(30, 32, 33) !important;
    }

    .mdl-layout__tab-bar .mdl-layout__tab.is-active::after {
        background-color: rgb(255 255 255 / 75%) !important;
    }

    .mdl-card {
        background-color: rgb(24, 26, 27);
    }

    .mdl-list__item {
        color: rgba(232, 230, 227, 0.87);
    }

    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title {
        color: rgba(232, 230, 227, 0.54);
    }

    .mdl-mega-footer {
        background-color: #181a1b;
    }

    .mdl-mega-footer .mdl-logo {
        color: #d5d5d5;
    }

    .mdl-card .mdl-card__supporting-text {
        color: #e5e5e5 !important;
    }

    textarea.code {
        background: #252525;
    }
}