@font-face {
    font-family:    "DSSegoe";
    src: url( "/static/home/fonts/segoeui.ttf" );
}

@font-face {
    font-family:    "FontAwesome Solid";
    src:            /* url( "/static/home/fonts/fa-solid-900.eot"),  */
                    url( "/static/home/fonts/fa-solid-900.woff2") format("woff2"),
                    url( "/static/home/fonts/fa-solid-900.ttf") format("truetype"),
                    url( "/static/home/fonts/fa-solid-900.svg") format("svg");
}

@font-face {
    font-family:    "FontAwesome Regular";
    src:            /* url( "/static/home/fonts/fa-regular-400.eot"), */
                    url( "/static/home/fonts/fa-regular-400.woff2") format("woff2"),
                    url( "/static/home/fonts/fa-regular-400.ttf") format("truetype"),
                    url( "/static/home/fonts/fa-regular-400.svg") format("svg");
}

@font-face {
    font-family:    "FontAwesome Brands";
    src:            /* url( "/static/home/fonts/fa-brands-400.eot"), */
                    url( "/static/home/fonts/fa-brands-400.woff2") format("woff2"),
                    url( "/static/home/fonts/fa-brands-400.ttf") format("truetype"),
                    url( "/static/home/fonts/fa-brands-400.svg") format("svg");
}

:root {
    /* basics */
    --common-background:        #eeeeee;
    --common-background-elem:   #eeeeee59;
    --common-font:              "Segoe UI", DSSegoe, Helvetica, Verdana, Arial, Times;
    /* --common-font-color:        #c3c3c3;     */
    --common-font-color:        #434343;
    --inverse-font-color:       #535353;

    /* fonts */
    --font-normal:              14pt;
    --font-tiny:                10pt;
    --font-small:               11.5pt;
    --font-large:               18pt;
    --font-huge:                22pt;
    --weight-slim:              300;
    --weight-normal:            400;
    --weight-bold:              550;
    --weight-strong:            650;

    /* spacing */
    --common-space:             12pt;
    --header-height:            calc( 4 * var( --font-normal ) );
    --content-menu-left:        calc( 4 * var( --font-normal ) );
    --content-menu-open:        calc( 17 * var( --font-normal ) );
    --content-width:            calc( 100% - var( --content-menu-left ) );
    --content-width-open:       calc( 100% - var( --content-menu-open ) );
    --page-min-width:           1280px;
    --page-max-width:           1280px;

}

*, ::after, ::before {
    box-sizing: border-box;
}

body {
    font-family:                var( --common-font );
    background-color:           var( --common-background );
    color:                      var( --common-font-color );
    font-size:                  var( --font-normal );
    font-weight:                var( --weight-normal );
    padding:                    0px;
    margin:                     0px;
}

a, a:visited, a:link, a:hover, a:active {
    text-decoration:            none;
    color:                      var( --common-font-color );
    cursor:                     pointer;
}

/*
a::before {
    content:        "\f0a4\00a0";
    font-family:    "FontAwesome";
}
*/

div.content {
    width:                      var( --page-min-width );
    margin:                     0px auto 0px auto;
    text-align:                 justify;
}

i.fas {
    font-family:                "FontAwesome Solid";
}

i.far {
    font-family:                "FontAwesome Regular";
}