/* Setting up scrolling. Making header and navigation pane stick to their
original place. Only content pane is scrollable. */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--border-color) var(--body-bg);
}

html, body, body > #container {
    overflow: hidden;
}

body > #container > #main {
    overflow: hidden;
    flex: 1 1 auto;
}

body > #container > #main > #content-start {
    overflow: hidden;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
}

body > #container > #main > #content-start > #content {
    overflow: auto;
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    margin: 0;
    padding: 12px 0 0 20px;
    width: auto;
}

body > #container > #main > #content-start > #footer {
    border-top: 1px solid var(--hairline-color);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    padding: 4px 10px;
    font-size: 0.8em;
    background: var(--darkened-bg);
}

body > #container > #main > #content-start > #content br.clear {
    display: none;
}

body > #container > #main > #content-start > #content > h1 {
    margin-bottom: 12px;
    flex: 1 0 100%;
}

body > #container > #main > #content-start > #content > h2 {
    margin-top: 0;
    flex: 1 0 100%;
}

body > #container > #main > #content-start > #content > #content-main {
    flex: 1 1 auto;
    width: auto;
    overflow: auto;
    display: flex;
    flex-direction: column;
    padding-right: 20px;
}
body > #container > #main > #content-start > #content > #content-related {
    margin-right: 20px;
}
body > #container > #main > #content-start > #content > #content-main #changelist-form > .results {
    overflow-x: unset;
}

body > #container > #main > #content-start > #content > #content-main > .object-tools {
    float: unset;
    position: unset;
    margin: 0 0 4px 0;
    align-self: end;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

body > #container > #main > #content-start > #content > #content-main > .object-tools li {
    height: auto;
}

/* Horizontal scrolling in inline views. */
.tabular.inline-related {
    overflow-x: auto;
    overflow-y: hidden;
}