:host {
    font-family: var(--font-family, Arial, Helvetica, sans-serif);
    font-size: var(--font-size, 16px);
}

.container {
    display:inline-block;
}

.top-controls {
    margin-bottom: var(--gutter, 10px);
    display: flex;
    align-items: center;
}

.control-item {
    margin-left: var(--gutter, 10px);
}

.control-item.right {
    margin-left: auto;
}

.bottom-controls {
    display: flex;
    align-items: center;
    margin-top: var(--gutter, 10px);
}

.showing {
    float: right;
}

table tfoot {
    border-top: 2px solid #cbcbcb;
}

.arrow {
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    opacity: .3;
}

.arrow.active {
    opacity: .7;
}

table thead th {
    cursor: pointer;
}