footer {
    background: #dc291e;
    text-align: center;
    padding: 20px 0;
    margin-top: 50px;
    position: relative;
    bottom: 0;

    font-size: 10px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
@media only screen and (max-width: 767px) {
    footer {
        margin-top: 50px
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    footer {
        margin-top: 50px
    }
}

footer ul {
    font-size: 1.5rem;
    margin-bottom: 5px
}
@media only screen and (max-width: 767px) {
    footer ul {
        font-size: 1.2rem;
        margin-bottom: 10px
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    footer ul {
        font-size: 1.4rem
    }
}

@media only screen and (min-width: 992px) {
    footer ul {
        font-size: 1.4rem
    }
}
footer ul li {
    display: inline-block;
    color: #fff
}
footer ul li:before {
    content: "|";
    padding-right: 11px;
    padding-left: 9px
}
footer ul li:first-child:before {
    content: " ";
    padding-right: 0;
    padding-left: 0
}
footer ul li a {
    text-decoration: none;
    color: #fff
}
footer ul li a:focus,
footer ul li a:hover {
    text-decoration: underline;
    color: #fff
}
@media only screen and (max-width: 767px) {
    footer ul li.own-line-xs {
        display: block;
    }
    footer ul li.drop-xs:before {
        content: " ";
        padding-right: 0
    }
}

@media only screen and (max-width: 767px) {
    footer .bottom-layer {
        display: none
    }
}
footer .middle-layer {
    position: absolute;
    background: #dc291e;
    background-position: center;
    width: 100%;
}
@media only screen and (max-width: 767px) {
    footer .middle-layer {
        top: 0
    }
}