/*
    Document   : olxwgl
    Created on : 24-Jan-2013, 10:33:19
    Author     : Oleg Dolomanov
    Description:
        Purpose of the stylesheet follows.
*/

root {
  display: block;
  height: 95%;
}

.ui-layout-unit{
  border: none;
}

html, body {
  height: 95%;
  margin: 0 auto;
  padding: 0 auto;
}

div.layout, table.layout {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  vertical-align: top;
}

div.layout {
  text-align: right;
}

table.layout {
  height: 95%;
}

table.topList {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  text-align: left;
}

table.dialog, .ui-panelgrid.dialog {
  margin: 0 auto;
  width: 600px;
}

th.padded-right, td.padded-right, .padded-right {
  padding-right: 5px !important;
}
th.padded-left, td.padded-left, .padded-left {
  padding-left: 5px !important;
}

th.padded-right-thick, td.padded-right-thick, .padded-right-thick {
  padding-right: 25px !important;
}
th.padded-left-thick, td.padded-left-thick, .padded-left-thick {
  padding-left: 25px !important;
}

.spaced-left {
  margin-left: 5px;
}
.spaced-left-m {
  margin-left: 10px;
}
.spaced-left-l {
  margin-left: 25px;
}

.spaced-right {
  margin-right: 5px;
}
.spaced-right-m {
  margin-right: 10px;
}
.spaced-right-l {
  margin-right: 25px;
}

.spaced-bottom {
  margin-bottom: 5px;
}
.spaced-bottom-m {
  margin-bottom: 10px;
}
.spaced-bottom-l {
  margin-bottom: 25px;
}

.spaced-top {
  margin-top: 5px;
}
.spaced-top-m {
  margin-top: 10px;
}
.spaced-top-l {
  margin-top: 25px;
}

tr.menu {
  height: 50px;
  vertical-align: top;
}

tr.h100px {
  height: 100px;
  vertical-align: top;
}

tr.content {
  height: 100%;
  vertical-align: top;
}

td.first, td.left, th.left, .ui-datatable thead th.left, .ui-panel-content {
  text-align: left;
}

td.last, td.right, th.right, .ui-datatable thead th.right {
  text-align: right;
}

td.left-right {
  text-align: right;
}
.ui-datatable thead th.left-right {
  text-align: left;
}

.ui-datatable thead th.top {
  vertical-align: top;
}

.ui-datatable input.ui-column-filter {
  margin-left: 0;
  margin-right: 0;
}
.ui-column-title, .ui-sortable-column-icon {
  /*float: right; */
}

td.top, th.top {
  vertical-align: top;
}

td.bottom, th.bottom {
  vertical-align: bottom;
}

th.date, th.price, th.amount {
  width: 90px;
}

th.timestamp {
  width: 130px;
}

th.user-date {
  width: 200px;
}

th.user {
  width: 150px;
}

th.user-affiliated {
  width: 225px;
}

.baseline {
  vertical-align: baseline;
}

.middle {
  text-align: center;
}

.w90 {
  width: 90%;
}

.w85 {
  width: 85%;
}

.w80 {
  width: 80%;
}

.w75 {
  width: 75%;
}

.w65 {
  width: 65%;
}

.w60 {
  width: 60%;
}

.w55 {
  width: 55%;
}

.w50 {
  width: 50%;
}

.w45 {
  width: 45%;
}

.w40 {
  width: 40%;
}

.w375 {
  width: 37.5%;
}

.w35 {
  width: 35%;
}

.w33 {
  width: 33%;
}

.w30 {
  width: 30%;
}

td.dialog, .w25 {
  width: 25%;
}

.w20 {
  width: 20%;
}

.w18 {
  width: 18%;
}

.w16_6 {
  width: 16.67%;
}

.w15 {
  width: 15%;
}

.w10 {
  width: 10%;
}

.w5 {
  width: 5%;
}

.w0 {
  width: 0px;
  display: none;
}

.w30px {
  width: 30px;
}

.w60px {
  width: 60px;
}

.w80px {
  width: 80px;
}

.w105px {
  width: 105px;
}

td.w130px {
  width: 130px;
}

td.w160px {
  width: 160px;
}

td.w200px {
  width: 200px;
}

tr.bold, td.bold, label.bold {
  font-weight: bold;
}

span.title, th.title, th.title-header, td.title, label.title, a.title, .title {
  font-size: 15px;
  font-weight: bold;
}

span.header1 {
  font-size: 17px;
  font-weight: bold;
}
span.header2 {
  font-size: 15px;
  font-weight: bold;
}
span.header3 {
  font-size: 15px;
}

tr.red-bg, td.red-bg, th.red-bg, span.red-bg, div.red-bg {
  background-color: #ffd7c7;
}

div.red, span.red, label.red, li.red, label.red, a.red, .red {
  color: #ff0a5d;
}

div.green, span.green, label.green, li.green, label.green, tr.green, td.green, th.green, a.green {
  color: #107f10;
}

div.blue, span.blue, label.blue, li.blue, label.blue, tr.blue, td.blue, th.blue, a.blue {
  color: blue;
}

div.yellow, span.yellow, label.yellow, li.yellow, label.yellow {
  color: #ffa34a;
}

.role-highlight {
  color: #dfa34a !important;
}

tr.green-bg, td.gree-bg, div.green-bg, span.green-bg {
  background-color: #ccffcc;
}
tr.yellow-bg, td.yellow-bg, div.yellow-bg, span.yellow-bg {
  background-color: yellow;
}
tr.salad-bg {
  background-color: #ccff99;
}

tr.grey {
  /*background-color: grey;*/
}
span.grey {
  color: grey;
}

th.center, td.center {
  text-align: center;
}

div.outer {
  background-color: azure;
  color: #050;
  height: 100%;
}

button.dashboard-actionButton {
  height: 36px;
  width: 200px;
  margin: 0 auto;
}

button.dashboard-titleButton {
  height: 40px;
  width: 100%;
  background: #808080 !important;
  margin: 0 auto;
}

button.ui-button.ui-state-hover.dashboard-titleButton {
  background: #a0a0a0 !important;
  box-shadow: none !important;
}

table, table.ui-panelgrid {
  width: 100%;
  border-collapse: collapse !important;
}
table.topForm {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  text-align: left;
}

table.header, table.footer {
  margin: 0 auto;
  text-align: center;
  width: 100%;
}

table.footer {
  margin-top: 15px;
}

.ui-widget {
  font-size: 75%;
  /*border-color: grey !important; */
}

.ui-widget-header, .ui-paginator, .ui-widget-content, .ui-button {
  border-color: #FFFFFF;
  /*background-color: #F9F9FC !important;*/
}

.ui-widget-header .ui-state-default, .ui-paginator .ui-state-default, .ui-widget-content .ui-state-default,
button.ui-button.ui-state-default
{
  border-color: #F0F0F5;
  /*background-color: #F9F9FC !important;*/
}

tr.ui-widget-content {
  border-color: #F1F1F9;
  /*background-color: #F9F9FC !important;*/
}

.ui-growl {
  top: 0px;
}

.ui-lightbox-content {
  background-color: #ffffff;
  width: 700px;
  height: 600px;
}

.ui-lightbox {
}


/*div.slim > a.ui-menuitem-link,*/
a.ui-menuitem-link.slim {
  height: 24px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


li.ui-menuitem.right {
  float: right !important;
}

ul.ui-menu-child {
    white-space: nowrap;
    width: auto !important;
}

.ui-datatable-tablewrapper {
  overflow: visible; /* chrome displays scrollbars... */
}

.ui-dialog-title {
  width: 100%;
}
.ui-icon {
  /*color: black !important;
  background-color: red; */
}
.ui-button-icon-only {
  /*background-image: linear-gradient(#3c8214, #3c8214); */
}

button.emergencyButton,
button.ui-button.ui-state-active.emergencyButton,
button.ui-button.ui-state-focus.emergencyButton,
button.ui-button.ui-state-default.emergencyButton
{
  background-color: red !important;
  background-image: none !important;
  box-shadow: none !important;
}

button.ui-button.ui-state-hover.emergencyButton {
  background-color: #ff5f5f !important;
  background-image: none !important;
  box-shadow: none !important;
}

button.alertButton,
button.ui-button.ui-state-active.alertButton,
button.ui-button.ui-state-focus.alertButton,
button.ui-button.ui-state-default.alertButton
{
  background-color: #ffa34a !important;
  background-image: none !important;
  box-shadow: none !important;
}

button.ui-button.ui-state-hover.alertButton {
  background-color: #ffcc7b !important;
  background-image: none !important;
  box-shadow: none !important;
}

button.reject-button {
  color: #ffa34a !important;
}

/* used for adjusting p:panel header style ...*/
div.slim > .ui-panel-titlebar {
  height: 28px;
}

div.slim > .ui-panel-content {
  height: 100%;
}

div.audited > .ui-panel-titlebar {
  background-image: none;
  background-color: #B8F197;
}

div.unaudited > .ui-panel-titlebar {
  background-image: none;
  background-color: #F1DF97;
}

/* hides the content part of the fileupload control */
div.slim > .ui-fileupload-content {
  display: none;
}

/* all dialog buttons should have this style
*/
button.dialogButton {
}
/* an alternative to enclosing buttons into a 'footer' table
*/
button.actionButton {
  margin-top: 15px;
}

/* buttons size */
.ui-button{
  height: 28px;
}

.ui-fileupload .ui-button {
  height: 24px;
}

button.toolbarButton {
  height: 28px;
  width: 28px;
}

button.smallButton {
  height: 20px;
  width: 20px;
}

.w1b {
  width: 30px;
}
.w2b {
  width: 60px;
}
.w3b {
  width: 90px;
}
.w4b {
  width: 120px;
}

button.toolbarButton > .fa {
  display: inline-block;
  font-size: 16px;
}

button.toolbarButton > .ui-icon.fa {
  margin-left: -10px;
  margin-top: -7px;
  height: 20px;
  width: 20px;
}

/* tall button to match large icon button in height*/
button.tall, div.tall > .ui-button, span.tall > .ui-button {
  height: 36px;
}

div.tall span.ui-button-text {
  font-size: 16px;
}

button.tall > .ui-icon {
  margin-left: -6px;
  margin-top: -6px ;
}
/* tall button to make them more prominent
*/
button.toolbarButton-l {
  height: 36px;
  width: 36px;
}

.w1b-l {
  width: 38px;
}
.w2b-l {
  width: 80px;
}
.w3b-l {
  width: 120px;
}

.w4b-l {
  width: 160px;
}

button.toolbarButton-l > .fa {
    display: inline-block;
    font: normal normal normal 24px/1 FontAwesome;
    font-size: 22px;
}

button.toolbarButton-l > .ui-icon.fa {
  margin-left: -10px;
  margin-top: -10px;
  height: 22px;
  width: 22px;
}

table {
  margin: 0px auto;
}

.ui-datatable tbody td {
  border: none;
  border-collapse: collapse;
  padding: 1px 0px 1px 0px;
}

.ui-datatable.spaced tbody td {
  padding: 2px 0px 2px 0px;
}

.ui-datatable tbody td > .ui-commandlink {
  font-size: 15px;
}

.ui-datatable thead th {
  border-collapse: collapse;
  padding: 1px 0px 1px 0px;
}

.ui-datatable.h-grid tbody td, .ui-panelgrid.h-grid tbody tr {
  border-bottom: solid 1px black;
}

.h-grid tbody td tr {
  border-bottom: solid 1px black;
}

.ui-panelgrid tbody tr > td.underlined, .ui-datatable-data > tr.underlined > td {
  border-bottom: solid 1px black;
}

.ui-panelgrid tbody tr.ui-widget-content > td.ui-panelgrid-cell {
  padding: 1px 0px 1px 0px;
}

.ui-panel .ui-panel-titlebar, .ui-datatable .ui-datatable-header {
  padding: 1px 1px 1px 1px;
  margin: 0px;
  border: 0px;
}

.ui-panel .ui-panel-content, .ui-datagrid .ui-datagrid-column {
  padding: 1px 0px 1px 0px;
  margin: 0px;
}

/*
.ui-datatable-tablewrapper > table > tbody > tr > td {
  padding-left: 3px;
}
*/

.ui-datalist-data {
  padding-left: 20px;
}

.ui-inputfield:not(.ui-spinner-input):not(.ui-column-filter) {
  width: calc(100% - 12px);
}

.ui-spinner-input {
  /*width: calc(100% - 12px);*/
}

.ui-autocomplete {
  width: 100%;
}

.ui-fileupload {
  width: 100%;
}
.ui-fileupload-buttonbar {
  padding: 0px 0px 0px 0px;
}

.ui-inputtext, .ui-inputtextarea, .hasDatepicker, .ui-password,
.ui-selectcheckboxmenu, .ui-selectmanymenu {
  width: calc(100% - 12px);
}

.ui-selectonemenu {
  width: calc(100% - 26px);
  /*width: 100% !important; */
}
.ui-selectonemenu-label {
  /* width: calc(100% - 26px) !important; */
}
.ui-selectonemenu-panel {
  /*width: 90% !important;*/
}

.ui-filter-column {
  background-color: #F9F9FC !important;
}

.ui-filter-column .ui-column-filter {
  width: calc(100% - 3px);
}

a.ui-spinner-button.ui-spinner-up,
a.ui-spinner-button.ui-spinner-down
{
  height: 12px;
}

button.ui-button > span.ui-button-text {
  text-shadow: none !important;
}

.invisible-tree-selection .ui-state-highlight {
  background-color: white;
  color: black;
}

.ui-tabs-nav > li.ui-state-default {
  background-color: #cdcdcd;
}

.ui-tabs-nav > li.ui-state-active {
  background-color: #BBEFBB;
}

thead {
  border-top: solid    #e5e5e5 2px;
  border-bottom: solid  #e5e5e5 2px;
}

.ui-datagrid .ui-datagrid-header {
  padding-left: 0;
  padding-right: 0;
}

.ui-panelgrid .ui-panelgrid-cell {
  padding-left: 0;
  padding-right: 0;
}

div.ui-selectonemenu-trigger.ui-state-default {
  background-color:   #f5f5f5;
}