.PaginatorComponent {

    display: inline-table;

    border-spacing: 5px;
    border-collapse: separate;
    width: 100%;
}

.PaginatorComponent .cell {
    display: table-cell;
    vertical-align: middle;

}

.PaginatorComponent .cell label:after {
    content: ":";
    padding-right: 5px;
}

.PaginatorTopComponent .view_mode {
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.PaginatorTopComponent .view_mode .icon {
    background-repeat: no-repeat;
    width: 1.3em;
    height: 1.3em;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.3em;
    background-size:contain;
}

.PaginatorTopComponent .view_mode .icon.list {
    background-image: url("../images/list_actions/icon_list.png");
}

.PaginatorTopComponent .view_mode .icon.grid {
    background-image: url("../images/list_actions/icon_grid.png");
}

.PaginatorTopComponent .cell + .cell.Caption {
    text-align: center;
}

.PaginatorTopComponent .Caption {
    font-weight: bold;
    text-align: left;

}

.PaginatorTopComponent .page_navigation.short {
    text-align: right;
    white-space: nowrap;
}

.PaginatorTopComponent .page_navigation.short A {
    color: black;

}


.PaginatorComponent .page_info {

    text-align: left;
    white-space: nowrap;
}

.PaginatorComponent .page_navigation.long {

    text-align: center;

}

.PaginatorComponent .page_navigation.long A {
    color: #537689;
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    text-decoration: none;
}

.PaginatorComponent .page_navigation.long A.selected {
    color: black;
    padding-left: 5px;
    padding-right: 5px;
    border: 1px solid #537689;
    font-weight: bold;
}

.PaginatorComponent .results_info {

    text-align: right;
    white-space: nowrap;
}
.PaginatorComponent .pager {
    display: inline-table;
    text-align: center;
}

.PaginatorComponent .sort_fields {

}

.PaginatorComponent .sort_fields .direction {

    display:inline-block;
    box-sizing:border-box;

    min-width:15px;
    min-height:15px;

    width:15px;
    height:20px;


    background-repeat:no-repeat;

    background-position: 50% 50%;
    background-size:contain;
    filter: invert(.5);

    vertical-align: bottom;
}

.PaginatorComponent .sort_fields .direction[direction="ASC"] {
    background-image:url(../images/icon_sort_asc.svg)
}
.PaginatorComponent .sort_fields .direction[direction="DESC"] {
    background-image:url(../images/icon_sort_desc.svg)
}