/* Fixes the issue of jqm panels altering the page background. */
.ui-panel-content-wrap {
    background: none!important;
}

.libraryPage .header {
    padding-bottom: 0;
}

.libraryPageHeader {
    margin: -5px 0 0;
}

    .libraryPageHeader a {
        margin-right: 20px;
    }

.libraryPage .ui-content {
    padding: 10px;
}

.libraryPage, .itemListContent {
    background: #262626!important;
    background: #494949 url(images/bgflip.png) repeat-x!important;
    background-attachment: fixed!important;
}

    .libraryPage .currentUsername {
        color: #fff;
    }

.listHeader {
    margin-top: 1em;
    margin-bottom: 5px;
    font-weight: normal;
}

.firstListHeader {
    margin-top: .75em;
}

.libraryViewNav {
    text-align: center;
}

    .libraryViewNav .ui-btn-inner {
        padding: .6em 20px;
    }

.ehsContent {
    max-width: 600px;
    margin: 0 auto;
}

.viewSettings {
    text-align: center;
    margin: 1em 0;
}

.libraryItemsGrid th {
    text-align: left;
}

.libraryGridImage {
    width: 50px;
}

.thName, .tdName {
    max-width: 300px;
}

.libraryItemsGrid {
    margin: 0 auto;
    border-spacing: 0;
    border-collapse: collapse;
    max-width: 100%;
}

    .libraryItemsGrid a {
        text-shadow: none;
    }

    .libraryItemsGrid th, .libraryItemsGrid td {
        vertical-align: top;
        text-align: left;
        padding: 10px;
    }

    .libraryItemsGrid th {
        padding-bottom: 1em;
    }

    .libraryItemsGrid td {
        border-top: 1px solid #555;
    }

.tabletColumn, .desktopColumn {
    display: none!important;
}

@media all and (min-width: 650px) {
    .libraryPage .ui-content {
        padding: 15px 30px 100px;
    }
}

@media all and (min-width: 750px) {
    .tabletColumn {
        display: table-cell!important;
    }
}

@media all and (min-width: 1200px) {

    .libraryPage .ui-content {
        padding-top: 0;
    }

    .ehsContent {
        max-width: 850px;
    }

    .desktopColumn {
        display: table-cell!important;
    }
}

@media all and (min-width: 1440px) {
    .ehsContent {
        max-width: 900px;
    }
}

@media all and (min-width: 1920px) {
    .ehsContent {
        max-width: 1000px;
    }
}