/* ***

TODO: add a hidden section for social links on x-small screen sizes

*** */

/* animation keyframe declarations */
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* media-specific adjustments */
@media (min-width: 1080px) {
    #footer-bar {
        padding: .4em .75em;
        line-height: 2em;
    }
    #footer-site-copyright {
        font-size: .9em;
    }
    #footer-language-switcher {
        font-size: 2em;
        line-height: .8em;
    }
    #footer-language-switcher ul {
        margin-bottom: 1.5rem;
    }
    #footer-outbound-links {
        padding: 0 .75em .4em .75em;
        line-height: 1.5em;
    }
    #footer-outbound-links a {
        font-size: 1.5em;
        padding-left: .5em;
    }
    .footer-submenu {
        bottom: 1em;
    }
    #footer-login {
        font-size: 1.5em;
    }
    #footer-login .footer-submenu svg {
        font-size: 2em;
        position: absolute;
        margin-top: .25em;
        margin-left: -1.75em;
    }
    #footer-login .footer-submenu li:not(.menu-separator) {
        padding-left: 2em;
    }
    #footer-login > a > svg {
        margin-top: .1em;
    }

}
@media (max-width: 1079px) {
    #footer-bar {
        padding: .25em .75em;
        line-height: 1.75em;
    }
    #footer-site-copyright {
        font-size: .8em;
    }
    #footer-language-switcher {
        font-size: 1.75em;
        line-height: .8em;
    }
    #footer-language-switcher ul {
        margin-bottom: 1.25rem;
    }
    #footer-outbound-links {
        padding: .4em .6em;
        line-height: 1em;
    }
    #footer-outbound-links a {
        font-size: 1.25em;
        padding-left: .5em;
    }
    .footer-submenu {
        bottom: 1em;
    }
    #footer-login {
        font-size: 1.25em;
    }
    #footer-login .footer-submenu svg {
        font-size: 2em;
        position: absolute;
        margin-top: .25em;
        margin-left: -1.5em;
    }
    #footer-login .footer-submenu li:not(.menu-separator) {
        padding-left: 2em;
    }

}
@media (max-width: 800px) {
    #footer-bar {
        padding: .15em .75em .15em .5em;
        line-height: 1.25em;
    }
    #footer-site-copyright {
        font-size: .75em;
    }
    #footer-language-switcher {
        font-size: 1.2em;
        line-height: .8em;
    }
    #footer-language-switcher ul {
        margin-bottom: .8rem;
    }
    #footer-outbound-links {
        padding: .5em .5em .2em .25em;
        line-height: 1em;
    }
    #footer-outbound-links a {
        font-size: 1em;
        padding-left: .5em;
    }
    #footer-login {
        font-size: 1em;
    }
    #footer-login .footer-submenu svg {
        font-size: 2em;
        position: absolute;
        margin-top: .25em;
        margin-left: -1.75em;
    }
    #footer-login .footer-submenu li:not(.menu-separator) {
        padding-left: 2em;
    }
    .footer-submenu {
        bottom: .5em;
    }
}

/* standard style rules */
#footer-bar {
    position: fixed;
    display: flex;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #343434;
    z-index: 100;
    /*box-shadow: 0 -3px 7px rgba(0, 0, 0, 0.25), 0 -2px 5px rgba(0, 0, 0, 0.22);*/
}
#footer-site-copyright {
    color: whitesmoke;
}
#footer-language-switcher {
    opacity: 0;
    animation: fade-in 2s forwards;
    animation-timing-function: ease-out;
    animation-delay: .5s;
    color: #e1e1e1;
    transition: color .5s, opacity .5s;
    margin-left: auto;
}
#footer-language-switcher:hover,
#footer-login:hover {
    color: dodgerblue;
}
#footer-language-switcher svg,
#footer-login svg {
    padding: 0 .5em 0 .5em;
}
#footer-language-switcher .language-selected {
    color: dodgerblue !important;
}
#footer-language-switcher .language-selected svg {
    display: inline-block;
    padding-top: .25em;
    font-size: 1.5em;
    color: dodgerblue;
}
#footer-language-switcher .language-selected:hover svg {
    color: whitesmoke;
}
ul#footer-outbound-links {
    display: flex;
    list-style-type: none;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 0;
    flex-direction: row;
    align-content: flex-end;
    position: absolute;
    bottom: 0;
    right: 0;
}
#footer-outbound-links a {
    display: inline-block;
    color: #e1e1e1;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    transition: color .5s;
}
#footer-outbound-links li {
    opacity: 0;
    animation: fade-in 1.25s forwards;
    animation-timing-function: ease-out;
}
#footer-outbound-links a:hover {
    color: dodgerblue;
}
/*.fa-bitcoin {
    color: darkgoldenrod;
    transition: color .5s;
}
.fa-bitcoin:hover {
    color: goldenrod;
}*/

/* custom animation timings */
#footer-outbound-links li:nth-child(1) {
    animation-delay: .25s;
}
#footer-outbound-links li:nth-child(2) {
    animation-delay: .5s;
}
#footer-outbound-links li:nth-child(3) {
    animation-delay: .75s;
}
#footer-outbound-links li:nth-child(4) {
    animation-delay: 1s;
}
#footer-outbound-links li:nth-child(5) {
    animation-delay: 1.25s;
}
#footer-outbound-links li:nth-child(6) {
    animation-delay: 1.5s;
}
#footer-outbound-links li:nth-child(7) {
    animation-delay: 1.75s;
}

#footer-login > a > svg {
    margin-left: .5em;
    color: transparent;
}
#footer-login:hover > a > svg {
    color: dodgerblue;
}
/* static dropup menu styling */
.footer-submenu {
    position: absolute;
    list-style: none;
    background-color: #343434;
    box-shadow: 0 3px 7px rgba(0,0,0,0.25), 0 2px 5px rgba(0,0,0,0.22);
    transition: left .5s, right .5s;
}
.footer-submenu li.menu-separator {
    padding-top: .1em;
    padding-bottom: .1em;
    padding-right: .5em;
}
.footer-submenu li.menu-separator hr {
    margin-top: .25em;
    margin-bottom: .25em;
    border-color: #636b6f;
}
#footer-login .footer-submenu {
    left: -300px;
}
#footer-language-switcher .footer-submenu {
    right: -300px;
}
#footer-language-switcher ul.footer-submenu,
#footer-login ul.footer-submenu {
    list-style: none;
    padding-left: 0;
}
#footer-login:hover ul.footer-submenu,
#footer-login ul.footer-submenu:hover {
    opacity: 1;
    left: 0;
}
#footer-language-switcher:hover ul.footer-submenu,
#footer-language-switcher ul.footer-submenu:hover {
    opacity: 1;
    right: 0;
}
.footer-submenu li {
    padding: .15em 1.5em .25em .5em;
    cursor: pointer;
}
.footer-submenu li a {
    color: #636b6f;
    font-size: .5em;
    letter-spacing: .1rem;
    text-decoration: none;
    text-transform: uppercase;
    display: inline;
    -webkit-transition: height .25s, opacity .1s, padding-top .25s, padding-bottom .25s;
    -moz-transition: height .25s, opacity .1s, padding-top .25s, padding-bottom .25s;
    -ms-transition: height .25s, opacity .1s, padding-top .25s, padding-bottom .25s;
    -o-transition: height .25s, opacity .1s, padding-top .25s, padding-bottom .25s;
    transition: height .25s, opacity .1s, padding-top .25s, padding-bottom .25s;
    position: relative;
}
.footer-submenu li:not(.menu-separator):hover {
    background-color: dodgerblue;
}
#footer-login .footer-submenu li a {
    left: -300px
}
#footer-language-switcher .footer-submenu li a {
    right: -300px
}

#footer-login:hover .footer-submenu li a,
#footer-login .footer-submenu:hover li a,
#footer-login .footer-submenu:hover li:hover a,
#footer-login .footer-submenu li a:hover {
    left: unset;
}
#footer-language-switcher:hover .footer-submenu li a,
#footer-language-switcher .footer-submenu:hover li a,
#footer-language-switcher .footer-submenu:hover li:hover a,
#footer-language-switcher .footer-submenu li a:hover {
    right: unset;
}
.footer-submenu li:hover a {
    color: whitesmoke;
}
.flex-force-right .footer-submenu {
    right: 0;
}
#footer-language-switcher .footer-submenu svg,
#footer-language-switcher .footer-submenu path {
    transition: none;
    color: inherit;
    position: absolute;
}
.footer-submenu svg {
    width: 1em !important;
}
#footer-language-switcher li a,
#footer-login li a {
    font-weight: 600;
}
/*#footer-language-switcher li:lang(ja-jp) a {
    font-family: "Mplus 1p", "Yu Gothic", "MS Gothic", Serif;
    font-weight: 400;
}*/