/***************************************************************************
**  FOOTER
***************************************************************************/

footer {

    --footer__color            : var(--site__color-light);
    --footer__background-color : transparent;

    --footer__nav-sep          : 0.5rem 0.3rem;
    --footer__nav-sep-height   : 1.2rem;
    --footer__nav-sep-width    : 1px;

    --footer__font-family      : var(--font-family-Barlow-Cond);
    --footer__font-size        : 1rem;

    font                       : 400 var(--footer__font-size)/1.1 var(--footer__font-family);

    position                   : relative; 
    bottom                     : 0;

    color                      : var(--footer__color);
    background-color           : var(--footer__background-color);
/*    box-shadow                 : 0px 8px 8px -8px rgba(0, 0, 0, 0.5) inset; */
    z-index                    : 2;

    width                      : 100%;
    max-width                  : var(--std-width);
    background-repeat          : repeat;

    padding-block              : 1rem;  
    margin                     : 0 auto;

    & .short-terms,
    & nav {
        max-width              : var(--mid-width);
        line-height            : 1.4;
        text-shadow            : 0px 0px 10px #000000FF;
    }

    & div, 
    & nav {
        padding                : 4px 5rem;
        text-align             : center;
        margin                 : 0.5rem auto;
    }

    & a {
        color                  : var(--footer__color); 
        text-decoration        : none;

        &:hover {
            color              : var(--site__color-hilite); 
        }
    }

    & .media a {
        display                : inline-block; 
        padding                : 0 4px;
    }

    & nav a {
        position               : relative;
        color                  : var(--footer__color);
        text-decoration        : none;
        margin-inline          : var(--footer__nav-sep);

        &:hover {
            color              : var(--site__color-hilite); 
        }

        &:not(:last-child)::after {
            position           : absolute;
            top                : 1px;
            content            : "";
            width              : var(--footer__nav-sep-width);
            height             : var(--footer__nav-sep-height);
            background-color   : var(--footer__color); 
            margin-inline      : var(--footer__nav-sep);
            /* transform: rotate(10deg); */
        }
    }

/*    & nav a:not(:last-child)::after {
        content          : "";
        position         : absolute;
        top              : 0.6em;
        height           : calc(var(--footer__font-size) * 1.5);
        width            : 1px;
        background-color : var(--footer__color);
        margin-inline    : calc(var(--footer__nav-sep) * 1.2) var(--footer__nav-sep);
        margin-inline    : 0.6rem 0;
        transform: rotate(10deg);
    }
*/
}
