html, body 
{
    height: 100%;
    width: 100%;
    margin: 0;   
    -moz-user-select:none;
    -webkit-user-select:none;     
}   
body {
 background-color: black !important;
} 
.ui-content{
    padding:0;
    overflow-y:hidden;
}
.activationTitle
{
    font-size:1.5em;
    margin-top:35px;
    margin-bottom:5px;
    padding:0px 5px 0px 5px;
    border-bottom: gray 1px solid;
}
.PageLoader {
 position:absolute;
 left: 0px;
 top: 0px;
 width: 100%;
 height: 100%;
 z-index: 9999;
 background: url('images/page-loader.gif') 50% 50% no-repeat rgb(0, 0, 0);
 background-size: 200px 200px;
 display:none;
}
.tiles{
    float:left;
    width:100px;
    height:100px;
    text-shadow:0 0 0;
    color:white;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    border-radius: 10px 10px 10px 10px; 
    word-break: break-word; /* doesn't work in firefox */
    word-wrap: break-word;
    white-space: normal;
    cursor: pointer;
}
.tiles:active{
    color:darkgray;
}
#previewBillTable{
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#previewBillTable tr{   
    height:50px;
}
#previewBillTable th{    
    border-bottom: white 2px solid;
}
#previewBillTable td{    
    border-bottom: white 1px solid;
}
#previewBillTable td div{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    overflow:hidden;
}
#billsPreviewTable {
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}

#billsPreviewTable tr{   
    height:50px;
}
#billsPreviewTable th{    
    border-bottom: white 2px solid;
}
#billsPreviewTable td{    
    border-bottom: white 1px solid;
}
#billsPreviewTable td div{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    overflow:hidden;
}
#previewBillMain th{    
    border-bottom: white 2px solid;
}
#previewBillMain td{    
    border-bottom: white 1px solid;
}
#paymentTypeTable {
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#paymentTypeTable th{    
    border-bottom: white 2px solid;
    height:44px;
}
#paymentTypeTable td{    
    border-bottom: white 1px solid;
    height:44px;
}
#paymentTypeTable td div{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    overflow:hidden;   
}

#addToTouchTable
{
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#addToTouchTable td{    
    border-bottom: white 1px solid;
    height:44px;
}
#addToTouchTable td div{
    width:100%;
    height:100%;
    padding:15px;
    align-items:center;
    text-align:left;
    overflow:hidden;   
}

#paymentTypeTableA
{
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#paymentTypeTableA td{    
    border-bottom: white 1px solid;
    height:44px;
}
#paymentTypeTableA td div{
    width:100%;
    height:100%;
    padding:15px;
    align-items:center;
    text-align:left;
    overflow:hidden;   
}

#placeListTable {
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#placeListTable th{    
    border-bottom: white 2px solid;
    height:44px;
}
#placeListTable td{    
    border-bottom: white 1px solid;
    height:44px;
}
#placeListTable td div{
    width:100%;
    height:100%;
    display:flex;
    padding:15px;
    justify-content:flex-start;
    align-items:center;
    text-align:left;
    overflow:hidden;   
}
#codeListTable {
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#codeListTable th{    
    border-bottom: white 2px solid;
    height:44px;
}
#codeListTable td{    
    border-bottom: white 1px solid;
    height:44px;
}
#codeListTable td div{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    overflow:hidden;   
}
#importTable {
    color:white;
    text-shadow:0 0 0;
    width:100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top:5px;
}
#importTable th{    
    border-bottom: white 2px solid;
    height:44px;
}
#importTable td{    
    border-bottom: white 1px solid;
    height:44px;
}
#importTable td div{
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    overflow:hidden;   
}
#QtyLeft{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:33.3333333333333333%; 
    height:100%; 
    float:left;
    color:white;
    text-shadow:0 0 0;
}
#QtyRight{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:33.3333333333333333%; 
    height:100%;
    background:dimgray;
    float:left;
    color:white;
    text-shadow:0 0 0;
    border-left: black 1px solid;
    border-right: black 1px solid;
}
#QtyR{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:calc(33.3333333333333334% - 2px);  
    height:100%;
    background:dimgray;
    float:left;
    color:white;
    text-shadow:0 0 0;
}
#previewBillLeft{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:50%;
    height:100%;
    float:left;
    color:white;
    text-shadow:0 0 0;
}
#previewBillRight{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:50%; 
    background:dimgray;
    height:100%;
    float:right;
    color:white;
    text-shadow:0 0 0;
}

.qtyCashier{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    word-break: break-word; /* doesn't work in firefox */
    word-wrap: break-word;
    white-space: normal;
    float:left;
    width:50px;
    height:100%;
    font-size:20px;
}
.itemPriceCashier{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    white-space: nowrap;
    overflow:hidden;
    float:right;
    height:100%;
    font-size:20px;
    width:20%;    
}
.itemCashier{
    float:left;
    height:100%;
    width: calc(80% - 55px);
}
#totalPriceCashier{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    word-break: break-word; /* doesn't work in firefox */
    word-wrap: break-word;
    white-space: normal;
    height:100%;
    font-size:20px !important;
}
#printCashier{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    word-break: break-word; /* doesn't work in firefox */
    word-wrap: break-word;
    white-space: normal;
    height:100%;
    font-size:20px !important;
}
.footerCashierText{
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    word-break: break-word; /* doesn't work in firefox */
    word-wrap: break-word;
    white-space: normal;
    height:100%;
}
.header {
    height:44px;
    border-bottom: white 1px solid;
}
.footer{
    height:44px;
    border-top: white 1px solid;
}

block {
    display: inline-block;
    width: 70px;
    height: 70px;
    margin: 5px;
    background: cornflowerblue;
    float: left;
    text-shadow:0 0 0;
    color:white;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    border-radius: 10px 10px 10px 10px; 
}
input {
 outline:none;
}