:root {
    --UserLayout_contentHorizontalMargin: 10px;
    --UserLayout_actualContentWidth: calc(min(var(--UserLayout_contentWidth), 100vw - var(--UserLayout_contentHorizontalMargin)));
}

.UserLayout_columnContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.UserLayout_centralColumn {
    box-sizing: border-box;
    width: auto !important;
    max-width: var(--UserLayout_actualContentWidth) !important;
    flex-basis: var(--UserLayout_actualContentWidth) !important;
    flex-shrink: 1;
    flex-grow: 1;
    padding-top: 10px;
    padding-right: var(--UserLayout_contentHorizontalMargin);
    padding-left: var(--UserLayout_contentHorizontalMargin);
    padding-bottom: 20px;
}

.UserLayout_splitter {
    width: 7px;
    cursor: ew-resize;
    min-height: 100vh;
}

.UserLayout_splitter:hover {
    background: 3px lightgray;
}