<style>
    #bottom{
        position: relative;
    }
    @media screen and (max-width: 480px) {
        .material-tagscloud{
            margin: 6em 2em 0;
        }
    }
    .material-tagscloud a{
        text-decoration:none;
        padding: 1px 9px;
        margin: 9px 1px;
        line-height: 40px;
        white-space: nowrap;
        transition: .6s;
        opacity: .85;
    }
    .material-tagscloud a:hover{
        transition: .6s;
        opacity: 1;
        background: #FAFAFA;
        box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
    }
</style>

<div class=" material-tagscloud">
    <div class="material-post mdl-grid">
        <%- tagcloud({
            min_font: 16,
            max_font: 35,
            amount: 9999,
            color: true,
            start_color: '#757575',
            end_color: '#212121',
        }) %>
    </div>
</div>


<script>
    var adjustFooter = function() {
        if( ($('#bottom').offset().top + $('#bottom').outerHeight() ) < $(window).height() ) {
            var footerBottom = $(window).height() - $('#bottom').outerHeight() - $('#bottom').offset().top;
            $('#bottom').css('bottom', '-' + footerBottom + 'px');
        }
    };
    $(document).ready(function() {
        adjustFooter();
    });
</script>