:root{
    --navigation-space-number: 200;
    --navigation-width-number: 180;
    --navigation-space-factor: calc(var(--navigation-space-number) / 55);
    --navigation-width-factor: calc(var(--navigation-width-number) / 55);
    --navigation-space: calc(var(--text-size-number) * var(--navigation-space-factor) * 1px);
    --navigation-space: max(110px, calc(var(--text-size-number) * var(--navigation-space-factor) * 1px));
    --navigation-width: calc(var(--text-size-number) * var(--navigation-width-factor) * 1px);
    --navigation-width: max(90px, calc(var(--text-size-number) * var(--navigation-width-factor) * 1px));
    --short-report-wrapper-width: calc(var(--wrapper-width) + var(--navigation-space));
}

.short-report-wrapper{
    width: var(--short-report-wrapper-width);
    max-width: 100%;
    margin:auto;
    padding-top: calc(var(--navigation-space) / 2);
}

.short-report-wrapper .flexible-content{
    display: inline-block;
    width: calc(var(--wrapper-width) + var(--navigation-space));
    max-width: 100%;
    padding-left: var(--navigation-space);
    vertical-align: top;
}

@media only screen and (max-width: 579.99991px){
    :root{
        --navigation-space: 0;
        --navigation-width-number: 250;
        --navigation-width-factor: calc(var(--navigation-width-number) / var(--text-size-number));
    }
    
}

/* @media only screen and (max-width: 1600px){
    :root{
        --navigation-space: 150px;
        --navigation-width: 130px;
    }
} */