//
// FOOTER
//
.footer {
    &:extend(.small);
    color: @white;
    text-align: center;

    @media (@screen-sm) {
        text-align: left;
    }

    a { color: @white; }

    .menu {
        &:extend(.list-unstyled all);
    }

    .menu-item {
        display: inline;

        a {
            display: inline-block;
            padding: 3px 15px;
            opacity: .85;

            &:hover,
            &:focus {
                opacity: 1;
            }
        }
    }

    .button {
        margin-bottom: (@spacer / 4);

        &:hover {
            text-decoration: none;
        }
    }
}


//
// Top footer
//
.footer__top {
    &:extend(.subtemplate);
    background: @greyFooter;

    .menu {
        margin-bottom: @spacer;

        @media (@screen-sm) {
            display: flex;
            flex-flow: row wrap;
            width: 70%;
            float: left;
            margin-bottom: 0;
        }
    }

    .menu-item {
        @media (@screen-sm) {
            flex: 0 0 33%;

            a { display: block; }
        }
    }
}


//
// Bottom footer
//
.footer__bottom {
    &:extend(.mini);
    color: @greyText;
    padding: (@spacer / 2) 15px;

    .menu {
        margin-bottom: (@spacer/2);

        @media (@screen-sm) {
            float: left;
            margin-bottom: 0;
            margin-left: (@spacer/2);
        }
    }

    .menu-item a {
        color: @greyText;
    }
}


//
// Contact
//
.footer__contact {
    @media (@screen-sm) {
        width: 25%;
        float: right;

        .button { width: 100%; }
    }
}


//
// Social links
//
.footer__social {
    &:extend(.list-unstyled all);
    margin-top: (@spacer/2);

    @media (@screen-sm) {
        float: right;
        margin-top: 0;
    }

    li { display: inline-block; }
}

.footer__social,
.footer__copyright,
.footer__bottom .menu {
    @media (@screen-sm) {
        margin-top: 10px
    }
}


.footer__bigchaindb {
    width: 180px;
    height: auto;
    margin: 10px auto (@spacer/2) auto;

    @media (@screen-sm) {
        float: left;
        margin: 10px 10px 0 0;
    }
}


.footer__eu {
    width: 150px;
    height: auto;
    margin: 0 auto (@spacer/2) auto;

    @media (@screen-sm) {
        float: left;
        margin: 0 10px 0 0;
    }
}

.footer__copyright {
    margin-bottom: (@spacer/2);

    @media (@screen-sm) {
        margin-bottom: 0;
        float: left;
        padding: 3px 15px;
    }
}