.background {
    position:fixed;
    background-image: url("../Images/bg-blueyellow.jpg");
    background-size:cover;
    height:100vh;
    width:100vw;                   

    top:0;
    left:0;
    z-index:-1;
    margin:0 auto;  
}

.pink {
    background-image: url("../Images/bg-pinkyellow.jpg");
}

table {
    border-collapse:collapse;
}

#content .pbHeader, #content .pbHeader table {
    border: none;
    display: none;
}

div#prodList .pbBody {
    margin:0px !important;
}

#container {
    width:100vw;
    display:flex;
    flex-wrap: wrap-reverse;
    flex-direction: row;
    justify-content: space-around;

}

#content {
    flex: 1;
    max-width:100%;
}

#content .bPageBlock .detailList tr td {
    height:1em;
}

.tableStyle {
    width: 100%;
}

.tableHeaderStyle {
    color: #fff;
    font: 1em arial, sans-serif;
}

.gangnamStyle {
    /* oppa */
}

.tableRowStyle:hover .tableCell {
    /*background-color: rgba(179,179,179,0.85);
    background-color: rgba(255, 255, 255, 0.9);*/
    cursor:pointer;
}

.tableCell {
    height:100%;
    /*
    margin-left:0.8em;
    margin-right:0.8em;
    */
    border-top: 0.05em solid   rgba(34,34,34,0.85);/*rgba(179,179,179,0.85);*/

    padding:1em 1em 1em 1.2em ;
    
    /*background-color: rgba(179,179,179,0.85);*/
    background-color: rgba(255, 255, 255, 0.9);
    font-weight:normal;
    line-height: 2.5em;
    font: 1em arial, sans-serif;   
}

#content .headerCell:hover {
    color: #1A80B2;
    cursor:pointer;
}

.headerCell, .pbSubheader .brandTertiaryBgr .first .tertiaryPalette {
    height: 3.5em;
    padding: 1.5em 1em 1.8em 1.2em;
    /*background-color: rgba(179,179,179,0.85);*/

    background-color: rgba(34,34,34,0.85);
}

#content .headerCell, .pbSubheader .brandTertiaryBgr .first .tertiaryPalette {
    /*
    margin-left: 0.8em;
    margin-right: 0.8em;
    */
}

.bPageBlock {
    background-color:transparent !important;
    border:none !important;
}

.headerCell span.title, .pbSubheader .brandTertiaryBgr .first .tertiaryPalette h3 {
    font-size: 1.6em;
    margin:unset;
}

.headerCell span.sort {
    float:right;
    font:1.6em webdings, marlett;
    width:1em;
}


/* Search Panel */

#searchbar {
    width: 250px;
    margin-top:7px;
    padding-top: 5px;
}

#searchbar .headerCell {
/*    width:301px;
    margin-left:12px;
    margin-right:12px;*/
}

#searchbar #searchFieldPanel {
    background-color: rgba(255, 255, 255, 0.9);
    /*background-color: rgba(179,179,179,0.85);*/
}

#searchbar .detailList {
    width:100%;
    padding:1em 0.2em 1em 1.2em ;
}

#searchbar .detailList tr {
    line-height: 1.5em;
}

#searchbar .detailList tr th {
    font-weight:normal;
    font: 1em OpenSans-arial, sans-serif;
    color: #000;
}

#searchbar .detailList tr td,
#searchbar .detailList tr th {
    border:none;
}

#searchbar .pbBody {
    margin-top:0px;
}

#searchbar input {

}

#searchbar input[type=text],
#searchbar textarea,
#searchbar select,
#searchbar select option,
#categoryPanel select,
#categoryPanel select option {
    font-size:1em;
    height:2.1em;
    width:95%;
    border: none;
    background: #888;
    color: #fff;
    padding-left:5px;
}
#searchbar textarea {
    height:3.5em;
}

#searchbar td.data2Col {
    padding-bottom: 0px !important;
}

.searchfield .fieldLabel p {
    margin:0px;
    padding:0px;
}

#searchbar .spacer {
    height:3px;
}

#searchbar .pbBottomButtons,
#searchbar .pbBottomButtons>table, 
#searchbar .pbBody,
#searchbar .bPageBlock .pbBottomButtons>table>tbody>tr>td {
    border:none;
    margin-top:0px;
    margin-bottom:0px;
    padding-top:0px !important;
}

#searchbar .pbHeader,
#searchbar .pbBottomButtons .pbTitle {

    display:none;
}

.commandButtonGroup {
    display:flex;
    justify-content:space-between;
    flex-direction: column;
    align-items:center;
    width:100%;
    background-color: rgba(255, 255, 255, 0.9);
/*    background-color: rgba(179,179,179,0.85);*/
    padding-top:1em;
    padding-bottom:1em;
}

input#submitBtn,
input#resetBtn,
input.btn {
    color: #fff;
    font: 1em arial, sans-serif;
    margin-left: 0.8em;
    margin-right: 0.8em;
    width:90%;
    height: 2em;
    font-size:1.5em;
    background:none;
    border:none;
    background-color: rgba(34,34,34,0.85);
}
input#resetBtn {
    margin-top:1em !important;
}

input.btn:hover {
    color: #1A80B2;
}

/* Navigation Panel */

#navigationPanel, #categoryPanel, #inProductionList {
    display:flex;
    flex-direction: row;
    align-items: center;
    margin-left:3%;
    width:100%;
    background-color: rgba(255, 255, 255, 0.9);
/*    background-color: rgba(179,179,179,0.85);*/
}

#navigationPanel #pageCount {
    justify-content: 
    line-height:2.35em;
}

#navigationPanel .btnfiller {
    width: ;
}

#navigationPanel input#firstbtn,
#navigationPanel input#prevbtn,
#navigationPanel input#nextbtn,
#navigationPanel input#lastbtn,
#navigationPanel input.btn {
    width:1.6em !important;
    margin:0em !important;
    height:1.6em !important;
}

.btnDisabled {
    opacity: 0.650;
    cursor: not-allowed;
}
.btnDisabled:hover {
    color: #fff !important;
}

#navigationPanel p {
    line-height:2.5em;
    margin:0px;
}


#navigationPanel div.pbSubsection table.detailList tbody tr td {
    width:auto;
}

/***    Mobile   ***/

@media screen and (max-width: 800px) {
    #container {
        width:100vw;
        display:flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: center;

    }

    #searchbar {
        flex: 1;
        width:88%;
        padding-left:10px;
    }
}

/***    In Production List  ***/

.productionItems {
    display: block;
    list-style-type: none;
}

.productionItems p, .listItem {
    margin:0px;
}

#inProductionList div .pbSubsection  table.detailList tbody tr td.data2Col{
    border: none !important;
}
