/* listing css */
.k-widget *:not(.k-icon) {
    font-family: "FuturaPT", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Arial", "sans-serif", ;
}
.k-grid {
    width: 100%;
}
.k-grid .k-grid-header th.k-header {
    padding: 12px 20px;
}
.k-grid .k-grid-header th.k-header>.k-link {
    font-weight: 500;
    font-size: 28px;
    letter-spacing: 1px;
    color: #000;
}
.k-grid .k-grid-header th.k-header .k-grid-filter {
    padding: 16px 30px 0 0;
    color: #40a4c6;
}
.k-grid .k-grid-header th.k-header .k-grid-filter .k-icon {
    opacity: 1;
}

.k-grid table tr td {
    font-size: 22px;
    font-weight: 400;
    padding: 20px;
}



.k-grid table tr td .grid-button a {
    padding: 10px 20px;
    background-color: #009fc3;
    text-align: center;
    color: #fff;
    cursor: pointer;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 15px;
    letter-spacing: 1px;
}
.k-grid table tr td .grid-button a:hover {
    background-color: #715faa;
    text-decoration: none;
}

.k-grid-pager .k-icon {
    font-size: 25px;
}
.k-pager-sizes, 
.k-pager-wrap .k-link, 
.k-pager-wrap .k-pager-numbers .k-state-selected {
    font-size: 20px;
}

@media only screen and (max-width: 1024px) {
    .k-grid .k-grid-header th.k-header {
        padding: 10px;
    }
    .k-grid .k-grid-header th.k-header>.k-link {
        font-size: 16px;
    }
    .k-grid .k-grid-header th.k-header .k-grid-filter {
        padding: 13px 10px 0 0;
    }
    .k-grid table tr td {
        font-size: 15px;
        padding: 10px;
    }
    .k-pager-sizes, .k-pager-wrap .k-link, .k-pager-wrap .k-pager-numbers .k-state-selected {
        font-size: 14px;
    }
    .k-webkit .k-grid .k-pager-wrap .k-pager-numbers .k-current-page .k-link {
        padding: 10px 20px;
        width: auto;
        margin-top: -5px;
    }
    .k-webkit .k-grid .k-pager-wrap .k-pager-numbers, 
    .k-webkit .k-pager-wrap .k-pager-numbers {
        left: 105px;
    }
    .k-webkit .k-grid .k-pager-wrap .k-pager-nav {
        margin-top: 3px;
    }
}

@media (min-width: 468px) and (max-width: 767px) {
    .k-grid table .k-grid-header {
        display: none;
    }
    .k-grid table tbody,
    .k-grid table tbody tr,
    .k-grid table tbody tr td {
        display: block;
        width: 100%;
    }
    .k-grid table tbody tr {
        display: flex;
        flex-wrap: wrap;
    }
    .k-grid table tbody tr td {
        padding: 20px 20px 0;
        box-sizing: border-box;
        width: 50%;
    }
    .k-grid table tbody tr td:last-child {
        padding-bottom: 20px;
    }
    .k-grid table tbody tr td:before {
        content: "Position";
        display: block;
        font-size: 16px;
        padding: 0 0 5px;
        text-transform: uppercase;
        color: #000;
        letter-spacing: 1px;
        font-weight: 500;
    }
    .k-grid table tbody tr td:nth-child(2):before {
        content: "Category";
    }
    .k-grid table tbody tr td:nth-child(3):before {
        content: "Type";
    }
    .k-grid table tbody tr td:nth-child(4):before {
        content: "Location";
    }
    .k-grid table tbody tr td:last-of-type:before {
        display: none;
    }
}