:root
{
    --max-page-width: 1600px;
    --header-height: 70px;
    --footer-height: 70px;

    --color-black: #000000;
    --color-grey: #2E2E2E9A;
    --color-grey-dark: #2e2e2e;

    --margin-horizontal: 142px;

    --border-default: solid 1px #7f7f7f;
}

@font-face
{
    font-family: "moderatExtended";
    src: url(/content/font/Moderat-Extended-Regular.woff);
    font-weight: 400;
}

@font-face
{
    font-family: "moderat";
    font-weight: 400;
    src: url(/content/font/Moderat-Regular.woff);
}

@font-face
{
    font-family: "moderat";
    font-weight: 900;
    src: url(/content/font/Moderat-Bold.woff);
}

@font-face
{
    font-family: "Font Awesome 5 Brands";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(/webfonts/fa-brands-400.eot);
    src: url(/webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"), url(/webfonts/fa-brands-400.woff2) format("woff2"), url(/webfonts/fa-brands-400.woff) format("woff"), url(/webfonts/fa-brands-400.ttf) format("truetype"), url(/webfonts/fa-brands-400.svg#fontawesome) format("svg")
}

@font-face
{
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(/webfonts/fa-regular-400.eot);
    src: url(/webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"), url(/webfonts/fa-regular-400.woff2) format("woff2"), url(/webfonts/fa-regular-400.woff) format("woff"), url(/webfonts/fa-regular-400.ttf) format("truetype"), url(/webfonts/fa-regular-400.svg#fontawesome) format("svg")
}

@font-face
{
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url(/webfonts/fa-solid-900.eot);
    src: url(/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"), url(/webfonts/fa-solid-900.woff2) format("woff2"), url(/webfonts/fa-solid-900.woff) format("woff"), url(/webfonts/fa-solid-900.ttf) format("truetype"), url(/webfonts/fa-solid-900.svg#fontawesome) format("svg")
}

@font-face {
    font-family: moderatExtendedRegular;
    src: url(/content/font/Moderat-Extended-Regular.woff);
}
@font-face {
    font-family: moderatRegular;
    src: url(/content/font/Moderat-Regular.woff);
}
@font-face {
    font-family: moderatBold;
    src: url(/content/font/Moderat-Bold.woff);
}

body
{
    overflow-x: hidden;
    width: 100vw;
    /*height: unset;
    overflow-y: hidden;*/

    /*zoom: 110%;*/
}


.model-content-container
{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: var(--max-page-width);
}

.model-view-container
{
    min-height: calc(100vh - var(--header-height) - var(--footer-height));
    padding-top: var(--header-height);
}

.model-view
{
    position: relative;
}

@media only screen and (max-width: 1200px)
{
    :root
    {
        --margin-horizontal: 16px;
    }
}

@media only screen and (max-width: 768px)
{
    :root
    {
        --footer-height: 80px;
    }

    body
    {
        /*zoom: 100%;*/
    }
}