#top {
    position: relative;
    background-color: #036fab;
    color: white;
    padding: 5px;
    margin: 0px 0px 10px 0px;
}

#bottom {
    bottom:0;
    position:absolute;
    height:85px;
    padding: 5px;
    margin: 10px 0px 0px 0px;
    width: 100%;
}

#left {
    float: left;
    padding: 5px;
    width: 150px;
}

#right {
    float: right;
    padding: 5px;
    width: 150px;
}

.center_content {
    position: relative;
    padding: 5px;
}

.left_content {
    background-color: #dddddd;
    padding: 5px;
    margin-left: 170px;
}

.right_content {
    background-color: #dddddd;
    padding: 5px;
    margin: 0px 170px 0px 170px;
}

#top a:link, #top a:visited {
    color: white;
    font-weight : bold;
    text-decoration: none;
}

#top a:link:hover, #top a:visited:hover  {
    color: black;
    font-weight : bold;
    text-decoration : underline;
}

.wrap {
    position:relative;
    margin:0 auto;
    /*replace 900px with your width*/
    width:900px;
}

@media screen {
    .header {
        display: none;
    }
    .pagebreak {
        display: none;
    }    
    #footer {
        position:fixed;
        bottom:0;
        z-index:999999;
        height:110px;
        background-color: #c2dfef;
        margin: 10px 0px 0px 0px;
        width: 100% !important;
        padding: 0px 5px 0px 0px;
    }
    #footerspace {
        display: block;
    }
}

@media print {
    .header {
        position:fixed;
        top: 0;
        z-index:999999;
        background-color: #c2dfef;
    }
    .pagebreak {
        display: none;
    }    

    #footer {
        display: none;
    }
    #footerspace {
        display: none;
    }
}

.datatable {
    background-color: #c2dfef;
}

.form {
    background-color: #ffffff;
}

.keyField {
    border-color: greenyellow;
    border-width: 2px;
}

.number {
    background-color: aqua;
}

.formula {
    background-color: yellow;
}

.hidden {
    visibility: hidden;
}

.ui-widget-content.microneering {
    color: red;  
    font-weight: bold;
}

.ui-state-default.microneering {
    color: red;  
    font-weight: bold;
}

.jpFormDialog {
    background-color: #b2d5d6 !important;
    border-color: #b2d5d6 !important;
}

.loggedOnUser {
    font-weight:normal;
    color:#000000;
    border: 8px groove #D6FFC9;
    font-size:9px;
    line-height:1;
}

* { border: 0px !important; 
    border-style: hidden !important;
    font-family: 'veranda';
    }

body {
    font-size: 0.8em;
    height: 100%;
    width: 100%;
}

.bodyHeading1 {
    background-image: url("/jakarta.faces.resource/images/W3bP1n.jpg.xhtml") !important;
    background-repeat: no-repeat !important;
    background-position: right top !important;       
}

.bodyHeading2 {
    background-image: url("/jakarta.faces.resource/images/JPFormBody.jpg.xhtml") !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;       
}

.bodyHeading3 {
    background-image: none !important;
}

.w3bp1n {
    background-image: url("/jakarta.faces.resource/images/logow.jpg.xhtml") !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;       
}

.microneering-icon {
    background-image: url("/jakarta.faces.resource/images/mi.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    padding: 1em !important;
    min-width: 33px !important;
    min-height: 33px !important;
    padding: 0px !important;
    margin: 0px !important;
    vertical-align: middle;
    
}

.ui-button-icon-only {
    
    min-width: 33px !important;
    min-height: 33px !important;
    border-radius: 3px !important;
    padding: 0px !important;
    margin: 0px !important;
    vertical-align: middle;
}

.ui-button {
    
    min-width: 33px !important;
    min-height: 33px !important;
    border-radius: 3px !important;
    padding: 0px !important;
    margin: 0px !important;
    vertical-align: middle;
}

.nav-prior-icon {
    background-image: url("/jakarta.faces.resource/images/larrow.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    height: 33px !important;
    vertical-align: middle;

}

.nav-next-icon {
    background-image: url("/jakarta.faces.resource/images/rarrow.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    width: 33px !important;
    height: 33px !important;
    vertical-align: middle;

} 


.nav-last-icon {
    background-image: url("/jakarta.faces.resource/images/parrow.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    width: 33px !important;
    height: 33px !important;
    vertical-align: middle;

} 


.nav-rev-icon {
    background-image: url("/jakarta.faces.resource/images/rev.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    width: 33px !important;
    height: 33px !important;
    vertical-align: middle;

} 


.nav-find-icon {
    background-image: url("/jakarta.faces.resource/images/find.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    width: 33px !important;
    height: 33px !important;
    vertical-align: middle;

} 

.ban-wio-icon {
    background-image: url("/jakarta.faces.resource/images/wio.gif.xhtml") !important;
    background-color: white !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    width: 48px !important;
    height: 51px !important;
    vertical-align: middle;

} 

html.progress, html.progress * {
    cursor: progress !important;
}



ui-inputfield {
    padding: 0px !important
}

ui-inputnumber {
    padding: 0px !important
}

.userProfileLabel {
    width: 1700px !important;
}

.userprofileinput {
    width: 550px !important;
}

label {
    background-color: rgba(255, 255, 255, 0.03) !important;
}

.ui-panel-content {
    background-color: rgba(255, 255, 255, 0.03) !important;
}

.ui-panelgrid-cell {
    background-color: rgba(255, 255, 255, 0.03) !important;
}

.ui-widget {
    font-size: 1em !important;
}

.ui-widget selectonemenu-label {
    font-size: 1em !important;
}

.ui-widget input {
    font-size: 1em !important;
}

.ui-widget-content.borderless {
    border: 0px;
}
body .ui-selectonelistbox .ui-selectlistbox-listcontainer .ui-selectlistbox-list .ui-selectlistbox-item, 
body .ui-selectmanymenu .ui-selectlistbox-listcontainer .ui-selectlistbox-list .ui-selectlistbox-item {
    padding: 0px;
}

body .ui-datatable .ui-datatable-header {
    text-align: center;
    height: 30px;
    padding: 0;
    display: block;

}
body .ui-datatable thead th {
    padding: 0;
}

body .ui-datatable .ui-datatable-data > tr > td {
    padding: 5px;
}

body .ui-datatable .ui-datatable-data > tr > th {
    padding: 5px;
}

.ui-widget-header .ui-inputfield, .ui-widget-content .ui-inputfield {
    font-weight: normal;
    padding: 5px;
}                 

body .ui-datatable.ui-datatable-gridlines thead > tr > th {
    padding: 5px;
}

body .ui-tabs .ui-tabs-panels .ui-tabs-panel {
    padding: 1rem;
    overflow: auto;
}

body .ui-panelgrid .ui-panelgrid-cell {
    padding: 0.5em !important;
    margin: 0.5em !important;
}

body .ui-inputfield {
    padding: 0px !important;
    font-size: 1em !important;
    border: 1px solid !important;
}

.ui-inputnumber {
    padding: 0px !important
}

.ui-fileupload-files {
    margin: 0px !important;
}

body .ui-fileupload .ui-fileupload-content {
    padding: 0px !important;
}

.ui-inputfield {
    padding: 0px !important
}

.ui-panel .ui-panel-content {
    padding: 0 !important;
}

body .ui-chkbox .ui-chkbox-box {
     border: 1px solid !important;
}
    
    .twenty-percent {
    width: 20%;
    height: 100%;    
}

body .ui-datatable.ui-datatable-gridlines .ui-datatable-data > tr > td {
    border-width: 1px !important;
    border-style: solid !important;
}

body .ui-datatable .ui-datatable-header, .ui-datatable .ui-datatable-footer {
    text-align: center;
    padding: 4px 10px;
}

.ui-inputfield, .ui-widget-content .ui-inputfield, .ui-widget-header .ui-inputfield {
    background: #fff;
    -moz-box-shadow: inset 0 2px 2px #8f8f8f;
    -webkit-box-shadow: inset 0 2px 2px #8f8f8f;
    box-shadow: inset 0 2px 2px #8f8f8f;
    color: #313131;
}

.eighty-percent {
    width: 80%;
    height: 100%;
}

.leftNav {
    width: 10%;
    height: 100%;
}

.mainPanel {
    width: 90%;
    height: 100%;
}
.formproperties {
    width: 200px;
}

.top-alignment {
    vertical-align: top;
}

.right-alignment {
    display: block; text-align: right !important;
}

#top {
    position: relative;
    background-color: #036fab;
    color: white;
    padding: 5px;
    margin: 0px 0px 10px 0px;
}

#bottom {
    bottom:0;
    position:absolute;
    height:85px;
    background-color: #c2dfef;
    padding: 5px;
    margin: 10px 0px 0px 0px;
    width: 100%;
}

#left {
    float: left;
    background-color: #ece3a5;
    padding: 5px;
    width: 150px;
}

#right {
    float: right;
    background-color: #ece3a5;
    padding: 5px;
    width: 150px;
}

.center_content {
    position: relative;
    padding: 5px;
}

.left_content {
    background-color: #dddddd;
    padding: 5px;
    margin-left: 170px;
}

.right_content {
    background-color: #dddddd;
    padding: 5px;
    margin: 0px 170px 0px 170px;
}

#top a:link, #top a:visited {
    color: white;
    font-weight : bold;
    text-decoration: none;
}

#top a:link:hover, #top a:visited:hover  {
    color: black;
    font-weight : bold;
    text-decoration : underline;
}

.wrap {
    position:relative;
    margin:0 auto;
    /*replace 900px with your width*/
    width:900px;
}

@media screen {
    .header {
        display: none;
    }
    .pagebreak {
        display: none;
    }    
    #footer {
        position:fixed;
        bottom:0;
        z-index:999999;
        height:110px;
        background-color: #c2dfef;
        margin: 10px 0px 0px 0px;
        width: 100%;
        padding: 0px 5px 0px 0px;
    }
    #footerspace {
        display: block;
    }
}

@media print {
    .header {
        position:fixed;
        top:0;
        z-index:999999;
        background-color: #c2dfef;
    }
    .pagebreak {
        display: none;
    }    

    #footer {
        display: none;
    }
    #footerspace {
        display: none;
    }
}

.datatable {
    background-color: #c2dfef;
}

.form {
    background-color: #ffffff;
}

.keyField {
    border-color: greenyellow !important;
    border-width: 2px 2px 2px 2px !important;
}

.number {
    background-color: aqua !important;
    text-align: right !important;
}

.formula {
    background-color: yellow !important;
    text-align: right !important;
}

.date {
    text-align: right !important;
}

.hidden {
    visibility: hidden;
}

.ui-widget-content.microneering {
    color: red;  
    font-weight: bold;
}

.ui-state-default.microneering {
    color: red;  
    font-weight: bold;
}

.ui-widget-content.borderless {
    border: 0px;
}

.panelNoBorder {
    border-style: none !important
}

.jpFormDialog {
    background-color: #b2d5d6 !important;
    border-color: #b2d5d6 !important;
}

.loggedOnUser {
    font-weight:normal;
    color:#000000;
    border: 8px groove #D6FFC9;
    font-size:9px;
    line-height:1;
}

ui-inputfield {
    padding: 0px !important
}

ui-inputnumber {
    padding: 0px !important
}

.ui-panel .ui-panel-content {
    padding: 0 !important;
}
#formDisplay_content {
    padding: 0 !important;
}

.invalid {
    border-color: red !important;
    border-width: 4px !important;
    border-style: solid !important;
}

.selected {
    border-width: 2px !important;
    border-color: orange !important;
}

.labelselected {
    border: 2px solid orange !important;
}



.leftBan, .ui-g-12, .ui-md-6 {
    width: 60px !important;
}

.rightBan, .ui-g-12, .ui-md-6 {
    width: fit-content !important;
}

.operEditText {
    overflow: scroll;
}

code {
    font-size: 1.6em !important;
}