@media (max-width: 767px) { 	
	

.pos {
	direction: ltr;
	padding: 0;
	margin: 0;
	background-color: #f0eeee;
	font-family: "Museo", Arial, sans-serif; 
	font-family: 'Charcoal','Geneva','Helvetica Neue','Helvetica',Arial,sans-serif ;
	color: #555555;
	/*font-size: 20px;*/
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	user-select: none;
	text-shadow: none;
	overflow: hidden;
}

.screen .main-content {
    display: flex;
    flex-grow: 1;
    flex-wrap: wrap;
    overflow-y: auto;
}

button {
    -webkit-appearance: button;
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: -internal-light-dark-color(buttontext, rgb(170, 170, 170));
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    align-items: flex-start;
    cursor: default;
    background-color: -internal-light-dark-color(rgb(239, 239, 239), rgb(74, 74, 74));
    box-sizing: border-box;
    margin: 0em;
    font: 400 13.3333px Arial;
    padding: 1px 6px;
    border-width: 2px;
    border-style: outset;
    border-color: -internal-light-dark-color(rgb(118, 118, 118), rgb(195, 195, 195));
    border-image: initial;
}
	
.pos .scrollable-y {
    overflow: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}
.pos button {
    box-shadow: none;
    outline: none;
    border: none;
    font-family: 'Lato';
}	
.pos button, .pos a.button {
    display: inline-block;
    cursor: pointer;
    padding: 4px 10px;
    font-size: 11px;
    border: 1px solid #cacaca;
    background: #e2e2e2;
    border-radius: 3px;
}
	
.pos *::-webkit-scrollbar {
	width: 4px;
	height: 4px;
}
.pos *::-webkit-scrollbar-thumb {
	background: rgb(168,168,168);
	background: #393939;
	min-height: 30px;
}
.pos *::-webkit-scrollbar-track {
	background: rgb(224,224,224);
	border-left: solid 1px rgb(200,200,200);
}
.pos .pos-topheader{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0;
	color: gray;
	background: #393939;
	display: flex;
}
				/*
.pos .pos-branding {
				    position: absolute;
				    display: table-cell;
				    left: 0;
				    top: 0;
				    width: 439px;
				    height: 100%;
				    margin: 0;
				    padding: 0;
				    border-right: 1px solid #373737;
				    text-align: left;
				    line-height: 100%;
				    vertical-align: middle;
} */
.pos .pos-branding {
	width: 100%;
    /*min-width: 350px;
    max-width: 350px;*/
    flex-grow: 1;
    height: 100%;
    margin: 0;
    padding: 0;
    text-align: left;
    line-height: 100%;
    vertical-align: middle;
    display: flex;
    justify-content: space-between;
}

.pos .ticket-button {
	    display: flex;}
.ticket-button {
	    display: flex;
	    align-items: center;
	    padding: 0 15px;
	    font-size: medium;
	    color: white;
}
.ticket-button .with-badge {
	    margin-right: 0.7em;
	    font-size: larger;
}
	
.pos .pos-rightheader {
	/*flex-grow: 1;			
	position: absolute;
	left: 350px;
	right: 0;
	top: 0;
	height: 100%;
	display: -webkit-flex;
	display: flex;
	overflow: hidden;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;*/
	flex-grow: 1;
    height: 100%;
    display: flex;
    overflow: hidden;
    overflow-x: auto;
}

.pos .order-button.floor-button {
	    background: #6EC89B;
	    font-weight: bold;
	    font-size: 16px;
	    min-width: 128px;
	    padding-right: 16px;
	    padding-left: 16px;
}
.pos .order-button:first-child {
	    margin-right: 0px;
}
.pos .order-button {
	    color: #f0f0f0;
	    display: inline-block;
	    box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    height: 46px;
	    padding: 4px 8px;
	    margin: 3px;
	    margin-bottom: 0px;
	    margin-left: 2px;
	    padding-top: 0px;
	    background: #8b8b8b;
	    border-top-right-radius: 3px;
	    border-top-left-radius: 3px;
	    vertical-align: top;
	    line-height: 42px;
	    text-align: center;
	    box-shadow: 0px -5px 10px -6px rgb(82,82,82) inset;
	    cursor: pointer;
	    min-width: 45px;
}
.pos .pos-rightheader > * {
	    border-left: 1px solid #875A7B;
}
.search-bar-portal {
	    display: flex;
	    min-width: 250px;	    
}
.search-bar-portal .search-box {
	    font-size: medium;
	    position: relative;
	    display: flex;
	    align-items: center;
	    margin: 0 15px;
}
.search-bar-portal .search-box input {
	    font-size: medium;
	    height: 30px;
	    border: none;
	    color: #63717f;
	    padding-right: 38px;
	    padding-left: 38px;
	    border-radius: 5px;
}

.pos .pos-rightheader > * {
				    border-right: 1px solid #292929;
				}
.pos .oe_status {
				    float: right;
				    color: rgba(255,255,255,0.4);
				    padding: 14px;
				    line-height: 20px;
				    font-size: 20px;
				    vertical-align: middle;
				    font-style: italic;
				    cursor: pointer;
}
.pos .pos-rightheader > * {
				    border-right: 1px solid #292929;
}
.pos .pos-rightheader .header-button:last-child {
				    border-left: 1px solid #3a3a3a;
}
.pos .pos-rightheader .header-button {
				    float: right;
				    height: 48px;
				    padding-left: 16px;
				    padding-right: 16px;
				    border-right: 1px solid #292929;
				    border-left: 1px solid #292929;
				    color: #DDD;
				    line-height: 48px;
				    text-align: center;
				    cursor: pointer;
				    -webkit-transition-property: background;
				    -webkit-transition-duration: 0.2s;
				    -webkit-transition-timing-function: ease-out;
}
.pos .oe_status {
				    float: right;
				    color: rgba(255,255,255,0.4);
				    padding: 14px;
				    line-height: 20px;
				    font-size: 20px;
				    vertical-align: middle;
				    font-style: italic;
				    cursor: pointer;
}
.pos .order-selector {
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex: 1;
				    flex: 1;
}
.pos .pos-content {
				    width: 100%;
				    position: absolute;
				    top: 48px;
				    bottom: 0;
				    background: #F0EEEE;
				}
.pos .page-header {
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 48px;
					margin: 0;
					padding: 0;
					color: gray;
					background: #393939;
				}
.top-content .button {
				    position: absolute;
				    /*display: flex;*/
				    flex-wrap: wrap;
				    top: 0px;
				    line-height: 32px;
				    padding: 3px 13px;
				    font-size: 20px;
				    background: rgb(230, 230, 230);
				    margin: 12px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				    transition: all 150ms linear;
}
.pos .pos-content {
	width: 100%;
	position: absolute;
	top: 48px;
	bottom: 0;
	background: #F0EEEE;
}
.pos .window {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: table;
	border: none;
	overflow: hidden;
}
.pos .window .subwindow {
	display: table-row;
	width: 100%;
	height: 100%;
}
/*===================shineer nemsen order container=========================*/
.pos .order-container {  
    top: 0px;
    width: 100%;
    height: 100%;
    flex-grow: 1;
    background: white;
    overflow: hidden auto;
}
.pos .order {
    padding-bottom: 8px;
    padding-top: 8px;
    font-size: 0.9em;
    text-align: left;
    max-width: 350px;
    transform: translate3d(0px, 0px, 0px);
    background: white;
}
/*.pos .order .orderline.dirty {
    color: rgb(110, 200, 155);
    padding-left: 9px;
    border-left: 6px solid rgb(110, 200, 155);
}
.pos ul, .pos ol {
    padding: 0px;
    margin: 0px;
}
.pos .order .summary {
    width: 100%;
    text-align: right;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
}
.pos .order .summary .line {
    float: right;
    margin-right: 15px;
    margin-left: 15px;
    padding-top: 5px;
    border-top: 2px solid rgb(119, 119, 119);
    border-color: rgb(119, 119, 119);
}
.pos .order .summary .total {
    font-size: 22px;
}
.pos .order .summary .line .subentry {
    font-size: 16px;
    font-weight: normal;
    text-align: center;
}*/
/*===================end shineer nemsen order container=========================*/
.pos .subwindow .subwindow-container {
	display: table-cell;
	position: relative;
}
.pos .window .subwindow-container .collapsed {
	height: 0px;
}			
	.pos .subwindow .subwindow-container-fix {
					height: 100%;
					position: relative;
				}
.pos .screen {
				    position: absolute;
				    text-align: center;
				    top: 0px;
				    bottom: 0px;
				    width: 100%;
				    /*overflow: auto;*/
				    -webkit-overflow-scrolling: touch;
}
	@media screen and (min-width: 1024px)
					.screen .screen-content {
				    border-left: dashed 1px rgb(215,215,215);
				    border-right: dashed 1px rgb(215,215,215);
				}

	.screen .screen-full-width {
				    height: 100%;
				    width: 100%;
				    display: flex;
				    flex-wrap: wrap;
				    flex-direction: column;
				}

	

	/*.pos .order {
					width: 100%;
				    background: white;
				    padding-bottom: 8px;
				    padding-top: 8px;
				    font-size: 13px;
				    text-align: left;
				    max-width: 350px;
				    -webkit-transform: translate3d(0,0,0);
				}*/

	.pos ul, .pos ol {
				    padding: 0;
				    margin: 0;
				}
	.pos ul, .pos li {
				    margin: 0;
				    padding: 0;
				    list-style-type: none;
				}

	ul {
				    display: block;
				    list-style-type: disc;
				    margin-block-start: 1em;
				    margin-block-end: 1em;
				    margin-inline-start: 0px;
				    margin-inline-end: 0px;
				    padding-inline-start: 40px;
				}
	.pos .order-scroller {
				    width: 100%;
				    height: 100%;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				}			
	.pos .order .orderline {
					display: flex;
				    width: 100%;
				    margin: 0px;
				    padding-top: 1px;
				    padding-bottom: 1px;
				    padding-left: 2px;
				    padding-right: 2px;
				    cursor: pointer;
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    -webkit-transition: background 250ms ease-in-out;
				    -moz-transition: background 250ms ease-in-out;
				    transition: background 250ms ease-in-out;
				    border-bottom: solid 3px #2c3e50;
				}
	.pos li {
				    list-style-type: none;
				}
	.pos ul, .pos li {
					position: relative;
				    margin: 0;
				    padding: 0;
				    list-style-type: none;
				}

	li {
				    display: list-item;
				    text-align: -webkit-match-parent;
				    
		}
	.pos .order .orderline .product-sequences {
					font-size: 30px;
					padding: 0px;
					position: inherit;
					left: 0;					

					text-align: center;
					vertical-align: middle;
					color: white;

					padding: 0;
					float: left;
					font-weight: bold;
					/*width: 30px;*/
					background: #393939;
					margin-right: 1px;
				}

	.pos .order .orderline .product-name {
					display: inline-block;
				    padding: 0;
				    display: inline-block;
				    font-weight: bold;
				    width: 50%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				}
	.pos .order .orderline .price {
					/*width: 10%
				    padding: 0;
				    font-weight: bold;
				    float: none;*/
				    /*display: inline-block;*/

				    text-align: center;
				    padding: 23px 0 0 0;
				    display: inline-block;
				    font-weight: bold;
				    width: 40%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				}
	.pos .order .orderline .info-list {
				    color: #888;
				    margin-left: 15px;
				}
	.pos .order .orderline .remove {
					width: 20px;
					padding: 0px;
					right: 0;
					bottom: 0px;
					float: right;					
					color: white;
					font-weight: bold;
					text-align: center;
					vertical-align: middle;
					border: 5px solid #ff0000e2;					
					background: #F3565D;
					border-color: #F3565D;
	}
	.pos ul, .pos ol {
				    padding: 0;
				    margin: 0;
				}

	.pos .order .orderline.selected {
				    background: rgba(140,143,183,0.2);
				    -webkit-transition: background 250ms ease-in-out;
				    -moz-transition: background 250ms ease-in-out;
				    transition: background 250ms ease-in-out;
				    cursor: default;
				}
	.pos .order .summary {
				    width: 100%;
				    text-align: right;
				    font-weight: bold;
				    margin-top: 20px;
				    margin-bottom: 10px;
				}
	.pos .order .summary .line {
				    float: right;
				    margin-right: 15px;
				    margin-left: 15px;
				    padding-top: 5px;
				    border-top: solid 2px;
				    border-color: #777;
				}
	.pos .order .summary .total {
				    font-size: 15px;
				}
	.pos .order .summary .line .subentry {
				    font-size: 16px;
				    font-weight: normal;
				    text-align: center;
				}


.screen .screen-content {
		    position: relative;
		    margin: 0px auto;
		    /*max-width: 1024px;*/
		    text-align: left;
		    height: 100%;
		    display: flex;
		    flex-direction: column;
		    
		    overflow: hidden;		



		/*	margin: 0px auto;
			max-width: 1024px;
			text-align: left;
			height: 100%;
			overflow: hidden;
			position: relative;*/
}
	/*.pos .order-container {
				    position: absolute;
				    top: 0px;
				    width: 100%;
				    height: 100%;
				    background: white;
				}*/
	.screen .top-content {
				    /*position: absolute;*/
				    display: flex;
				    left: 0px;
				    top: 0px;
				    right: 0px;
				    height: 0px;
				    border-bottom: dashed 1px rgb(215,215,215);
				    text-align: center;
				}
	.screen .top-content .top-content-center {
    	flex-grow: 1;
	}
	.screen .top-content .button.back {
				    display: flex;
				    flex-wrap: wrap;
				    /*left: 0px;*/
				    margin-left: 16px;
				}
	.screen .top-content .button {
				    position: absolute;
				    top: 0px;
				    line-height: 32px;
				    padding: 3px 13px;
				    font-size: 20px;
				    background: rgb(230, 230, 230);
				    margin: 12px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				    transition: all 150ms linear;
				}
	.pos .oe_hidden {
				    display: none !important;
				}
				
	.oe_hidden {
				    display: none !important;
				}
	.pos .leftpane {
		
		border-right: solid 3px #787878;
		background: #e2e2e2;
		height: 100%;
		display: flex;
		flex-direction: column;
		flex-grow: 1;
		max-width: 350px;
		/*box-sizing: border-box;
		position: absolute;
		left: 0;
		width: 440px;
		top: 0;
		bottom: 0;
		border-right: solid 3px #787878;
		background: #fff;*/
	}	
.pos .leftpane .pads {
	    border-top: solid 3px rgb(110, 200, 155);
	}
.pos .control-buttons {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    padding: 8px 16px 0px 11px;
    margin-bottom: 0px;
}
.pos .control-button {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    background: #e2e2e2;
    border: solid 1px #bfbfbf;
    display: inline-block;
    line-height: 38px;
    min-width: 80px;
    text-align: center;
    border-radius: 3px;
    padding: 0px 10px;
    font-size: 18px;
    margin-left: 6px;
    margin-bottom: 6px;
    cursor: pointer;
    overflow: hidden;
    transition: all linear 150ms;
}
.pos .leftpane .pads .subpads {
    display: flex;
    flex-direction: row;
}
.pos .actionpad {
    padding: 0;
    margin: 16px;
    margin-top: 8px;
    margin-right: 0;
    text-align: center;
    vertical-align: top;
    border: none;
    border-radius: 0;
    border-top: 1px solid;
    border-left: 1px solid;
    border-color: #bfbfbf;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    flex-grow: 1;
}
.pos .actionpad .button.set-customer {
    padding-left: 40px;
    padding-right: 40px;
}
.pos .actionpad .button:first-child {
    border-top-left-radius: 4px;
}
.pos .actionpad .button.pay {
    height: 162px;
}
.pos .actionpad .button:last-child {
    border-bottom-left-radius: 4px;
}
.pos .actionpad .button.pay .pay-circle {
    display: block;
    font-size: 32px;
    line-height: 54px;
    padding-top: 6px;
    background: rgb(86, 86, 86);
    color: white;
    width: 60px;
    margin: auto;
    border-radius: 30px;
    margin-bottom: 10px;
}
.pos .numpad {
    text-align: center;
    width: 216px;
    margin: 16px;
    margin-top: 8px;
    margin-left: 0px;
    border: none;
    border-radius: 0;
    border-top: 1px solid;
    border-color: #bfbfbf;
    border-top-right-radius: 4px;
    min-width: 216px;
}
.pos .numpad button {
    float: left;
    height: 54px;
    width: 54px;
    font-weight: bold;
    vertical-align: middle;
    color: #555555;
    border-radius: 0;
    border: none;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: #bfbfbf;
    transition: all 150ms linear;
}

	.pos .switchpane {
	    height: 100px;
	    flex-shrink: 0;
	    display: flex;
	}

	/*.pos .leftpane .pads {
				    border-top: solid 3px rgb(110, 200, 155);
				}*/
	/*.pos .control-buttons {
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex-flow: row wrap;
				    flex-flow: row wrap;
				    padding: 8px 16px 0px 11px;
				    margin-bottom: -6px;
				}*/
	/*.pos .actionpad {
				    display: inline-block;
				    float: left;
				    padding: 0;
				    margin: 16px;
				    margin-top: 8px;
				    margin-right: 0;
				    text-align: center;
				    vertical-align: top;
				    width: 186px;
				    border: none;
				    border-radius: 0;
				    border-top: 1px solid;
				    border-left: 1px solid;
				    border-color: #bfbfbf;
				    border-top-left-radius: 4px;
				    border-bottom-left-radius: 4px;
				}
*/
/*	.pos .actionpad .button.set-customer {
				    padding-left: 0;
				    padding-right: 0;
				}*/

	/*.pos .actionpad .button:first-child {
				    border-top-left-radius: 4px;
				}*/
	
	/*.pos .actionpad .button {
				    position: relative;
				    display: block;
				    height: 54px;
				    width: 100%;
				    font-weight: bold;
				    vertical-align: middle;
				    color: #555555;
				    font-size: 14px;
				    border-radius: 0;
				    border: none;
				    border-right: 1px solid;
				    border-bottom: 1px solid;
				    border-color: #bfbfbf;
				    transition: all 150ms linear;
				}	*/
	/*.pos .actionpad .button .fa-user {
				    position: absolute;
				    left: 13px;
				    top: 13px;
				    margin-right: 8px;
				    font-size: 18px;
				    background: rgba(255, 255, 255, 0.5);
				    line-height: 30px;
				    width: 30px;
				    border-radius: 100%;
				}*/	
/*	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}	*/
	/*.pos .actionpad .button.pay {
				    height: 162px;
				}*/
/*	.pos .actionpad .button:last-child {
				    border-bottom-left-radius: 4px;
				}*/
/*	.pos .actionpad .button.pay .pay-circle {
				    display: block;
				    font-size: 32px;
				    line-height: 54px;
				    padding-top: 6px;
				    background: rgb(86, 86, 86);
				    color: white;
				    width: 60px;
				    margin: auto;
				    border-radius: 30px;
				    margin-bottom: 10px;
				}*/
/*	.pos .actionpad .button.pay .pay-circle .fa {
				    position: relative;
				    top: -1px;
				    left: 3px;
				}*/
/*	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}*/
/*	.pos .numpad {
				    display: inline-block;
				    float: right;
				    text-align: center;
				    width: 216px;
				    margin: 16px;
				    margin-top: 8px;
				    margin-left: 0px;
				    border: none;
				    border-radius: 0;
				    border-top: 1px solid;
				    border-color: #bfbfbf;
				    border-top-right-radius: 4px;
				}*/
/*	.pos .numpad button {
				    float: left;
				    height: 54px;
				    width: 54px;
				    font-weight: bold;
				    vertical-align: middle;
				    color: #555555;
				    border-radius: 0;
				    border: none;
				    border-right: 1px solid;
				    border-bottom: 1px solid;
				    border-color: #bfbfbf;
				    transition: all 150ms linear;
				}*/
/*	.pos .input-button {
				    font-size: 24px;
				}*/


	.pos .rightpane {
	    height: 100%;
	    display: flex;
	    flex-direction: column;
	    flex-basis: 25%;
	    flex-grow: 1;
	}
	.pos .rightpane_product_detail {
	    height: 100%;
	    display: flex;
	    flex-direction: column;
	    flex-basis: 25%;
	    flex-grow: 1;
	}
	.pos .products-widget {
	    display: flex;
	    flex-direction: column;
	    flex-grow: 1;
	    overflow: hidden;
	}
	.pos .product-list-container {
	    overflow: hidden;
	    overflow-y: auto;
	    flex-grow: 1;
	}
	.pos .switchpane {
	    height: 100px;
	    flex-shrink: 0;
	    display: flex;
	}
	.pos .switchpane .btn-switchpane {
	    background-color: #6ec89b;
	    border-radius: 0px;
	    color: #FFFFFF;
	    font-size: 15px;
	    font-weight: bold;
	    flex-grow: 1;
	    flex-basis: 50%;
	    padding-bottom: 20px;
	}
	.pos .switchpane .btn-switchpane.secondary {
	    background-color: #FFFFFF;
	    color: #6ec89b;
	}

	.pos .switchpane .btn-switchpane {
	    background-color: #6ec89b;
	    border-radius: 0px;
	    color: #FFFFFF;
	    font-size: 15px;
	    font-weight: bold;
	    flex-grow: 1;
	    flex-basis: 50%;
	    padding-bottom: 20px;
	}

	.pos .screen .layout-table {
				   /* border: none;
				    width: 100%;
				    height: 100%;*/
				    display: flex;
				    flex-direction: column;
				    flex-grow: 1;
				    overflow: hidden;
				}
	.pos tbody{
			display: contents;
			flex-direction: column;
			flex-grow: 1;
			overflow: hidden;
	}			
	
	.pos .screen .header-row {
			display: block;
				   /* border: none;
				    width: 100%;
				    height: 0px;
				    display: inline-table;*/
				}	
	.pos .screen .header-cell {
				    border: none;
				    width: 100%;
				    height: 0px;
				}
	td {
				    padding: 0px;
				}
				
	td {
				    display: table-cell;
				    vertical-align: inherit;
				}
	.pos .rightpane-header {
				    padding: 0;
				    height: 48px;
				    border-bottom: 1px solid #c7c7c7;
				    background: #d3d3d3;
				    text-align: center;
				}
	.pos .breadcrumbs {
				    display: inline-block;
				    text-align: left;
				    float: left;
				}
	.pos .searchbox {
				    position: absolute;
				    right: 2px;
				}
	.pos .breadcrumb:last-child {
				    padding-right: 3px;
				    border-right: 1px solid #c5c5c5;
				}
	.pos .breadcrumbss {
				    float: left;
				    display: inline-block;
				    line-height: 48px;
				    height: 48px;
				    min-width: 48px;
				}
	.pos .breadcrumbss-button.breadcrumb-home {
				    line-height: 50px;
				    padding: 0;
				    width: 50px;
				    font-size: 25px;
				    text-align: center;
				}
	.pos .breadcrumbss-button {
				    display: inline-block;
				    padding: 0 9px;
				    vertical-align: top;
				    color: #808080;
				    font-size: 14px;
				    cursor: pointer;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.search-clear.left {
				    left: 11px;
				    color: #808080;
				}
	.pos .search-clear {
				    position: absolute;
				    top: 9px;
				    width: 30px;
				    height: 30px;
				    display: flex;
				    align-items: center;
				    justify-content: center;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.search-clear.right {
				    left: 270px;
				    color: #808080;
				    cursor: pointer;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.pos .categories {
				    position: relative;
				    border-bottom: solid 3px rgb(110, 200, 155);
				}
	.pos .category-list-scroller {
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    width: 100%;
				    height: 100%;
				    max-height: 20vh;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .category-list.simple {
				    padding: 0px;
				    background: #cecece;
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex-flow: row wrap;
				    flex-flow: row wrap;
				    border-bottom: none;
				}
	.pos .category-list {
				    text-align: left;
				    padding: 10px;
				    background: rgb(229, 229, 229);
				    border-bottom: 1px solid #cecece;
				}
	.pos .category-simple-button {
				    position: relative;
				    display: inline-block;
				    font-size: 14px;
				    margin-right: 1px;
				    margin-bottom: 1px;
				    padding: 5px 12px;
				    line-height: 32px;
				    flex-grow: 1;
				    -webkit-flex-grow: 1;
				    cursor: pointer;
				    background: #e2e2e2;
				    text-align: center;
				}
	.pos .category-simple-button .active{
					background-color: #666;
  					color: white;
	}
	.pos .category-simple-button:hover {
					background-color: #ddd;
	}
	.pos .screen .content-row {
				   /* width: 100%;
				    height: 100%;*/
				    overflow: hidden;
				    overflow-y: auto;
				    flex-grow: 1;
				}
	
	.pos .screen .content-cell {
				    height: 100%;
				}
	.pos .screen .content-cell {
				    width: 100%;
				}
	td {
				    padding: 0px;
				}

	td {
				    display: table-cell;
				    vertical-align: inherit;
				}
	.pos .screen .content-cell .content-container {
				    height: 100%;
				    position: relative;
				}
	/*.pos .product-list-container {
				    position: absolute;
				    top: 0px;
				    bottom: 0px;
				    left: 0px;
				    right: 0px;
				}*/
	.pos .product-list-scroller {
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    width: 100%;
				    height: 100%;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .product-list {
				    padding: 10px;
				    text-align: left;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .product {
				    position: relative;
				    vertical-align: top;
				    display: inline-block;
				    line-height: 100px;
				    font-size: 11px;
				    margin: 8px !important;
				    width: 122px;
				    height: 115px;
				    background: #fff;
				    border: 1px solid #e2e2e2;
				    border-radius: 3px;
				    border-bottom-width: 3px;
				    overflow: hidden;
				    cursor: pointer;
				}
	.pos .product .product-img {
				    position: relative;
				    width: 120px;
				    height: 100px;
				    background: white;
				    text-align: center;
				}
	.pos .product .price-tag {
				    position: absolute;
				    top: 2px;
				    right: 2px;
				    vertical-align: top;
				    color: white;
				    line-height: 13px;
				    background: #7f82ac;
				    padding: 2px 5px;
				    border-radius: 2px;
				}
	.pos .product .product-img img {
				    max-height: 100px;
				    max-width: 120px;
				    vertical-align: middle;
				}
	.pos .product .product-name {
				    position: absolute;
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    bottom: 0;
				    top: auto;
				    line-height: 14px;
				    width: 100%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				    background: -webkit-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    background: -moz-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    background: -ms-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    padding: 3px;
				    padding-top: 15px;
				}


	.pos .clientlist-screen .searchbox {
				    right: auto;
				    margin-left: -90px;
				    margin-top: 8px;
				    left: 30%;
				}
	.pos .clientlist-screen .searchbox input {
				    width: 300px;
				}
	.pos .searchbox input {
				    width: 300px;
				    border: 1px solid #cecbcb;
				    padding: 10px 20px;
				    padding-left: 38px;
				    padding-right: 33px;
				    margin: 6px;
				    background-color: white;
				    border-radius: 20px;
				    font-family: "Lato","Lucida Grande", Helvetica, Verdana, Arial;
				    font-size: 13px;
				}

	.pos .clientlist-screen .button.new-customer {
				    left: 30%;
				    margin-left: 250px;
				}
	.screen .top-content .button.next {
				    right: 0px;
				    margin-right: 16px;
				}
	.screen .top-content .button.highlight {
				    background: rgb(110,200,155);
				    color: white;
				    border: solid 1px rgb(110,200,155);
				}
	.screen .full-content {
				    position: absolute;
				    right: 0%;
				    top: 65px;
				    bottom: 0px;
				    left: 0%;
				}
	.pos .clientlist-screen .window, .pos .clientlist-screen .full-content .subwindow {
				    display: block;
				}
	.pos .clientlist-screen .full-content .subwindow.collapsed, .pos .clientlist-screen .full-content .subwindow-container.collapsed {
				    height: auto;
				}
	.pos .clientlist-screen .window, .pos .clientlist-screen .full-content .subwindow {
				    display: block;
				}
	.pos .clientlist-screen .full-content .subwindow.collapsed, .pos .clientlist-screen .full-content .subwindow-container.collapsed {
				    height: auto;
				}
	.pos .clientlist-screen .full-content .subwindow-container {
				    display: block;
				    height: 100%;
				}
	.pos .clientlist-screen .client-details {
				    padding: 16px;
				    border-bottom: solid 5px rgb(110,200,155);
				}
	.pos .clientlist-screen .client-picture {
				    height: 64px;
				    width: 64px;
				    border-radius: 32px;
				    overflow: hidden;
				    text-align: center;
				    float: left;
				    margin-right: 16px;
				    background: white;
				    position: relative;
				}
	.pos .clientlist-screen .client-name {
				    font-size: 32px;
				    line-height: 64px;
				    margin-bottom: 16px;
				}
	.pos .clientlist-screen .edit-buttons {
				    position: absolute;
				    right: 16px;
				    top: 10px;
				}
	.pos .clientlist-screen .edit-buttons .button {
				    display: inline-block;
				    margin-left: 16px;
				    color: rgb(128,128,128);
				    cursor: pointer;
				    font-size: 36px;
				}
	.pos .clientlist-screen .client-details-box {
				    position: relative;
				    font-size: 16px;
				}
	.pos .clientlist-screen .client-details-left {
				    width: 50%;
				    float: left;
				}
	.pos .clientlist-screen .client-detail {
				    line-height: 24px;

				    width: 100%
				}
	.pos .clientlist-screen .client-detail > .label {
				    font-weight: bold;
				    display: inline-block;
				    width: 140px;
				    text-align: left;
				    margin-right: 8px;
				    color: blue;
				    font-size: 15px;

				}
	.pos .clientlist-screen .client-details-right {
				    width: 50%;
				    float: right;
				}
	.pos .clientlist-screen .full-content .subwindow-container {
				    display: block;
				    height: 100%;
				}
	.pos .clientlist-screen .client-list {
				    font-size: 16px;
				    width: 100%;
				    line-height: 40px;
				}
	.pos .clientlist-screen .client-list tr.highlight {
				    transition: all 150ms linear;
				    background: rgb(110,200,155) !important;
				    color: white;
				}
	.pos .clientlist-screen .client-list tr.lowlight {
				    transition: all 150ms linear;
				    background: rgb(216, 238, 227);
				}
	.pos .clientlist-screen .client-list thead > tr, .pos .clientlist-screen .client-list tr:nth-child(even) {
				    background: rgb(247,247,247);
				}
	.pos .clientlist-screen .client-list tr {
				    transition: all 150ms linear;
				    background: rgb(230,230,230);
				}
	.pos .clientlist-screen .client-list th, .pos .clientlist-screen .client-list td {
				    padding: 0px 8px;
				}
	input {
				    -webkit-writing-mode: horizontal-tb !important;
				    text-rendering: auto;
				    color: -internal-light-dark-color(black, white);
				    letter-spacing: normal;
				    word-spacing: normal;
				    text-transform: none;
				    text-indent: 0px;
				    text-shadow: none;
				    display: inline-block;
				    text-align: start;
				    -webkit-appearance: textfield;
				    background-color: -internal-light-dark-color(rgb(255, 255, 255), rgb(59, 59, 59));
				    -webkit-rtl-ordering: logical;
				    cursor: text;
				    margin: 0em;
				    font: 400 13.3333px Arial;
				    padding: 1px 2px;
				    border-width: 2px;
				    border-style: inset;
				    border-color: -internal-light-dark-color(rgb(118, 118, 118), rgb(195, 195, 195));
				    border-image: initial;
				}


	/*.screen .left-content.pc40 {
				    right: 66%;
				}*/
.screen .left-content {
				    /*position: absolute;
				    left: 0px;
				    top: 64px;
				    bottom: 0px;
				    right: 50%;
				    overflow-x: hidden;
				    overflow-y: auto;
				    border-right: dashed 1px rgb(215,215,215);*/
				    position: relative;
				    top: 64px;
				    overflow-x: hidden;
				    overflow-y: auto;
				    border-right: dashed 1px rgb(215,215,215);
				    flex-grow: 1;
				    min-width: 200px;
}
.screen .right-content {
	position: relative;
	top:15px;
				    /*position: absolute;
				    right: 0px;
				    top: 64px;
				    bottom: 0px;
				    left: 50%;
				    overflow-x: hidden;
				    overflow-y: auto;*/
	overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-grow: 1;    
    flex-direction: column;
}
	.paymentmethods {
				    margin: 16px;
				    display: flex; /*suuld nemsen*/
				    flex-basis: 25%;
				    flex-wrap: wrap; /*suuld nemsen*/
				    justify-content: space-between; /*suuld nemsen*/

				}
	.paymentmethods .button:first-child {
				    border-top-width: 1px;
				    border-top-left-radius: 3px;
				    border-top-right-radius: 3px;
				}
	.paymentmethods .button {
				    background: #e2e2e2;
				    line-height: 74px;
				    font-size: 16px;
				    border: solid 1px rgb(202, 202, 202);
				    border-top-width: 0px;
				    cursor: pointer;
				    text-align: center;
				    padding: 0 15px;
				}
	.paymentmethods .button:last-child {
				    border-bottom-left-radius: 3px;
				    border-bottom-right-radius: 3px;
				}

	/*.screen .right-content.pc60 {
				    left: 34%;
				}*/
	colgroup {
				    display: table-column-group;
				}
	thead {
				    display: table-header-group;
				    vertical-align: middle;
				    border-color: inherit;
				}
	tr {
				    display: table-row;
				    vertical-align: inherit;
				    border-color: inherit;
				}
	.pos .paymentlines-container {
				    /*padding: 16px;
				    padding-top: 0;
				    border-bottom: dashed 1px gainsboro;
				    min-height: 154px;*/
				    padding: 16px;
				    padding-top: 0;
				    border-bottom: dashed 1px gainsboro;
				    min-height: 154px;
				}
	.pos .paymentlines {
				    width: 100%;
				    border-spacing: 0px 10px;
				    border-collapse: inherit;
				}
	.pos .paymentline {
				    font-size: 22px;
				}
	.pos .paymentline.selected {
				    font-size: 22px;
				    background: #6EC89B;
				    color: white;
				    display: flex;
				    flex-wrap: wrap;
				    
				}
	.pos .paymentline .col-due, .pos .paymentline .col-tendered, .pos .paymentline .col-change {
				    min-width: 90px;
				}
	.pos .paymentline > * {
				    padding: 8px 12px;
				}
	.pos .paymentline.selected .edit {
				    background: white;
				    color: #6EC89B;
				    outline: 3px blue;
				    box-shadow: 0px 0px 0px 3px #6EC89B;
				    position: relative;
				    border-radius: 3px;
				}
	.pos .paymentline .col-due, .pos .paymentline .col-tendered, .pos .paymentline .col-change {
				    min-width: 90px;
				}
	.pos .paymentline .col-name {
				    font-size: 16px;
				}
	.pos .paymentline .delete-button {
				    cursor: pointer;
				    text-align: center;
				}
	.payment-screen .paymentlines-empty .total {
				    text-align: center;
				    padding: 0px 0px 0px;
				    font-size: 32px;
				    color: #43996E;
				    text-shadow: 0px 2px white, 0px 2px 2px rgba(0, 0, 0, 0.27);
				}
	.payment-screen .paymentlines-empty .message {
				    text-align: center;
				}
	.pos .payment-buttons {
				    display: inline-block;
				    width: 50%;
				    box-sizing: border-box;
				    padding: 16px;
				    padding-left: 0;
				    float: right;
				}
	.payment-screen .payment-buttons .button:first-child {
				    border-top-left-radius: 3px;
				    border-top-right-radius: 3px;
				    border-top-width: 1px;
				}
	.payment-screen .payment-buttons .button {
				    background: #e2e2e2;
				    line-height: 73px;
				    font-size: 16px;
				    padding: 0px 8px;
				    border: solid 1px rgb(200,200,200);
				    border-top-width: 0;
				    cursor: pointer;
				    text-align: center;
				    position: relative;
				    transition: background-color, border-color, color 150ms linear;
				}
	.pos .payment-numpad {
				    display: inline-block;
				    width: 50%;
				    box-sizing: border-box;
				    padding: 16px;
				    text-align: center;
				    float: left;
				}
	.pos .payment-numpad .numpad {
				    float: none;
				    border-radius: 4px;
				    border-top: 1px solid;
				    border-left: 1px solid;
				    border-color: #cacaca;
				    width: 297px;
				    overflow: hidden;
				    margin: 0;
				}
	
	.pos .payment-numpad .numpad button:first-child {
				    border-top-left-radius: 150px;
				}
	.pos .payment-numpad .numpad button {
				    width: 74px;
				    height: 74px;
				}
	.screen .top-content .button.highlight {
				    background: rgb(110,200,155);
				    color: white;
				    border: solid 1px rgb(110,200,155);
				}
	.pos .control-button.highlight, .pos .button.highlight {
				    background: #6EC89B !important;
				    border: solid 1px #64AF8A !important;
				    color: white !important;
				}
	.pos .control-button.highlight, .pos .button.warning {
				    background: #ff1000 !important;
				    border: solid 1px #64AF8A !important;
				    color: white !important;
				}
	.screen .centered-content {
				    position: absolute;
				    right: 1%;
				    top: 64px;
				    bottom: 0px;
				    left: 1%;
				    border-right: dashed 1px rgb(215,215,215);
				    border-left: dashed 1px rgb(215,215,215);
				    overflow-x: hidden;
				    overflow-y: auto;
				}
	.pos .receipt-screen .centered-content .button {
				    line-height: 40px;
				    padding: 3px 13px;
				    font-size: 20px;
				    text-align: center;
				    background: rgb(230, 230, 230);
				    margin: 16px;
				    margin-bottom: 0px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				}
	.pos .pos-receipt-container {
				    font-size: 0.75em;
				    text-align: center;
				    direction: ltr;
				}
	.pos .pos-receipt-container > div {
				    text-align: left;
				    width: 300px;
				    background-color: white;
				    margin: 20px;
				    padding: 15px;
				    font-size: 16px;
				    padding-bottom: 30px;
				    display: inline-block;
				    border: solid 1px rgb(220,220,220);
				    border-radius: 3px;
				    overflow: hidden;
				}
	.pos-receipt .pos-receipt-contact {
				    text-align: center;
				    font-size: 75%;
				}
	.pos .pos-receipt-container > div {
				    text-align: left;
				    width: 300px;
				    background-color: white;
				    margin: 20px;
				    padding: 15px;
				    font-size: 16px;
				    padding-bottom: 30px;
				    display: inline-block;
				    border: solid 1px rgb(220,220,220);
				    border-radius: 3px;
				    overflow: hidden;
				}
	.pos-receipt .pos-receipt-amount {
				    font-size: 125%;
				    padding-left: 6em;
				}
	.pos-receipt .pos-receipt-right-align {
				    float: right;
				}
	.pos-receipt .pos-receipt-order-data {
				    text-align: center;
				    font-size: 75%;
				}



	.pos label.category-simple-button {
					position: relative;
					display: inline-block;
					font-size: 14px;
					font-color: #fff;
					font-weight: bold;
					margin-right: 2px;
					margin-bottom: 1px;
					padding: 5px 12px;
					line-height: 32px;
					-webkit-flex-grow: 1;
					cursor: pointer;
					background: #e2e2e2;


					background-color: #fff;
  					color: #333; 
				}
				
	.pos label.category-simple-button:not(.btn-flat) {
					position: relative;
					display: inline-block;
					font-size: 14px;
					font-color: #fff;
					font-weight: bold;
					margin-right: 2px;
					margin-bottom: 1px;
					padding: 5px 12px;
					line-height: 32px;
					-webkit-flex-grow: 1;
					cursor: pointer;
					background: #e2e2e2;

					background-color: rgb(110, 200, 155);
  					color: #fff;
				}




















}


/* desktop ddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
ddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd*/




@media (min-width: 768px) {
		
.pos {
	direction: ltr;
	padding: 0;
	margin: 0;
	background-color: #f0eeee;
	font-family: "Museo", Arial, sans-serif; 
	font-family: 'Charcoal','Geneva','Helvetica Neue','Helvetica',Arial,sans-serif ;
	color: #555555;
	font-size: 20px;
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	user-select: none;
	text-shadow: none;
	overflow: hidden;
}

.screen .main-content {
    display: flex;
    flex-grow: 1;
    flex-wrap: wrap;
    overflow-y: auto;
}

.screen .screen-full-width {
	height: 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

	button {
				    -webkit-appearance: button;
				    -webkit-writing-mode: horizontal-tb !important;
				    text-rendering: auto;
				    color: -internal-light-dark-color(buttontext, rgb(170, 170, 170));
				    letter-spacing: normal;
				    word-spacing: normal;
				    text-transform: none;
				    text-indent: 0px;
				    text-shadow: none;
				    display: inline-block;
				    text-align: center;
				    align-items: flex-start;
				    cursor: default;
				    background-color: -internal-light-dark-color(rgb(239, 239, 239), rgb(74, 74, 74));
				    box-sizing: border-box;
				    margin: 0em;
				    font: 400 13.3333px Arial;
				    padding: 1px 6px;
				    border-width: 2px;
				    border-style: outset;
				    border-color: -internal-light-dark-color(rgb(118, 118, 118), rgb(195, 195, 195));
				    border-image: initial;
			}
	
	.pos .scrollable-y {
				    overflow: hidden !important;
				    overflow-y: auto !important;
				    -webkit-overflow-scrolling: touch !important;
				}
	.pos button {
				    box-shadow: none;
				    outline: none;
				    border: none;
				    font-family: 'Lato';
				}	
	.pos button, .pos a.button {
				    display: inline-block;
				    cursor: pointer;
				    padding: 4px 10px;
				    font-size: 11px;
				    border: 1px solid #cacaca;
				    background: #e2e2e2;
				    border-radius: 3px;
				}
	
	.pos *::-webkit-scrollbar {
					width: 4px;
					height: 4px;
	}
	.pos *::-webkit-scrollbar-thumb {
					background: rgb(168,168,168);
					background: #393939;
					min-height: 30px;
	}
	.pos *::-webkit-scrollbar-track {
					background: rgb(224,224,224);
					border-left: solid 1px rgb(200,200,200);
	}
	.pos .pos-topheader {
				    position: absolute;
				    left: 0;
				    top: 0;
				    width: 100%;
				    height: 48px;
				    margin: 0;
				    padding: 0;
				    color: gray;
				    background: #393939;
				    display: flex;
				}
				/*
	.pos .pos-branding {
				    position: absolute;
				    display: table-cell;
				    left: 0;
				    top: 0;
				    width: 439px;
				    height: 100%;
				    margin: 0;
				    padding: 0;
				    border-right: 1px solid #373737;
				    text-align: left;
				    line-height: 100%;
				    vertical-align: middle;
				} */
.pos .pos-branding {
    min-width: 500px;
    max-width: 500px;
    flex-grow: 1;
    height: 100%;
    margin: 0;
    padding: 0;
    text-align: left;
    line-height: 100%;
    vertical-align: middle;
    display: flex;
    justify-content: space-between;}

    .pos .ticket-button {
	    display: flex;
	}
	.ticket-button {
	    display: flex;
	    align-items: center;
	    padding: 0 15px;
	    font-size: medium;
	    color: white;
	}
	.ticket-button .with-badge {
	    margin-right: 0.7em;
	    font-size: larger;
	}
	
.pos .pos-rightheader {
	flex-grow: 1;
    height: 100%;
    display: flex;
    overflow: hidden;
    overflow-x: auto;
	/*flex-grow: 1;
	position: absolute;
	left: 350px;
	right: 0;
	top: 0;
	height: 100%;
	display: -webkit-flex;
	display: flex;
	overflow: hidden;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;*/
}

	.pos .order-button.floor-button {
	    background: #6EC89B;
	    font-weight: bold;
	    font-size: 16px;
	    min-width: 128px;
	    padding-right: 16px;
	    padding-left: 16px;
	}
	.pos .order-button:first-child {
	    margin-right: 0px;
	}
	.pos .order-button {
	    color: #f0f0f0;
	    display: inline-block;
	    box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    height: 46px;
	    padding: 4px 8px;
	    margin: 3px;
	    margin-bottom: 0px;
	    margin-left: 2px;
	    padding-top: 0px;
	    background: #8b8b8b;
	    border-top-right-radius: 3px;
	    border-top-left-radius: 3px;
	    vertical-align: top;
	    line-height: 42px;
	    text-align: center;
	    box-shadow: 0px -5px 10px -6px rgb(82,82,82) inset;
	    cursor: pointer;
	    min-width: 45px;
	}
	.pos .pos-rightheader > * {
	    border-left: 1px solid #875A7B;
	}
	.search-bar-portal {
	    display: flex;
	    min-width: 250px;
	}
	.search-bar-portal .search-box {
	    font-size: medium;
	    position: relative;
	    display: flex;
	    align-items: center;
	    margin: 0 0px;
	}
	.search-bar-portal .search-box input {
	    font-size: medium;
	    height: 30px;
	    border: none;
	    color: #63717f;
	    padding-right: 38px;
	    padding-left: 38px;
	    border-radius: 5px;
	}

	.pos .pos-rightheader > * {
				    border-right: 1px solid #292929;
				}
	.pos .oe_status {
				    float: right;
				    color: rgba(255,255,255,0.4);
				    padding: 14px;
				    line-height: 20px;
				    font-size: 20px;
				    vertical-align: middle;
				    font-style: italic;
				    cursor: pointer;
				}
	.pos .pos-rightheader > * {
				    border-right: 1px solid #292929;
				}
	.pos .pos-rightheader .header-button:last-child {
				    border-left: 1px solid #3a3a3a;
				}
	.pos .pos-rightheader .header-button {
				    float: right;
				    height: 48px;
				    padding-left: 16px;
				    padding-right: 16px;
				    border-right: 1px solid #292929;
				    border-left: 1px solid #292929;
				    color: #DDD;
				    line-height: 48px;
				    text-align: center;
				    cursor: pointer;
				    -webkit-transition-property: background;
				    -webkit-transition-duration: 0.2s;
				    -webkit-transition-timing-function: ease-out;
				}
	.pos .oe_status {
				    float: right;
				    color: rgba(255,255,255,0.4);
				    padding: 14px;
				    line-height: 20px;
				    font-size: 20px;
				    vertical-align: middle;
				    font-style: italic;
				    cursor: pointer;
				}
	.pos .order-selector {
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex: 1;
				    flex: 1;
				}
	.pos .pos-content {
				    width: 100%;
				    position: absolute;
				    top: 48px;
				    bottom: 0;
				    background: #F0EEEE;
				}
	.pos .page-header {
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 48px;
					margin: 0;
					padding: 0;
					color: gray;
					background: #393939;
				}
	.top-content .button {
				    position: absolute;
				    top: 0px;
				    line-height: 32px;
				    padding: 3px 13px;
				    font-size: 20px;
				    background: rgb(230, 230, 230);
				    margin: 12px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				    transition: all 150ms linear;
				}
	.pos .pos-content {
					width: 100%;
					position: absolute;
					top: 48px;
					bottom: 0;
					background: #F0EEEE;
				}
	.pos .window {
					position: absolute;
					top: 0px;
					left: 0px;
					width: 100%;
					height: 100%;
					display: table;
					border: none;
					overflow: hidden;
	}
	.pos .window .subwindow {
					display: table-row;
					width: 100%;
					height: 100%;
				}
	.pos .subwindow .subwindow-container {
					
					display: table-cell;
					position: relative;
				}
	.pos .window .subwindow-container .collapsed {
				    height: 0px;
				}			
	.pos .subwindow .subwindow-container-fix {
					height: 100%;
					position: relative;
				}
	.pos .screen {
				    position: absolute;
				    text-align: center;
				    top: 0px;
				    bottom: 0px;
				    width: 100%;
				    /*overflow: auto;*/
				    -webkit-overflow-scrolling: touch;
				}

	@media screen and (min-width: 1024px)
					.screen .screen-content {
				    border-left: dashed 1px rgb(215,215,215);
				    border-right: dashed 1px rgb(215,215,215);
				}

	

	



	/*.pos .order {
					width: 100%;
				    background: white;
				    padding-bottom: 8px;
				    padding-top: 8px;
				    font-size: 13px;
				    text-align: left;
				    max-width: 500px;
				    -webkit-transform: translate3d(0,0,0);
				}*/

	.pos ul, .pos ol {
				    padding: 0;
				    margin: 0;
				}
	.pos ul, .pos li {
				    margin: 0;
				    padding: 0;
				    list-style-type: none;
				}

	ul {
				    display: block;
				    list-style-type: disc;
				    margin-block-start: 1em;
				    margin-block-end: 1em;
				    margin-inline-start: 0px;
				    margin-inline-end: 0px;
				    padding-inline-start: 40px;
				}
	.pos .order-scroller {
				    width: 100%;
				    height: 100%;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				}			
	.pos .order .orderline {
					display: flex;
				    width: 100%;
				    margin: 0px;
				    padding-top: 1px;
				    padding-bottom: 1px;
				    padding-left: 2px;
				    padding-right: 2px;
				    cursor: pointer;
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    -webkit-transition: background 250ms ease-in-out;
				    -moz-transition: background 250ms ease-in-out;
				    transition: background 250ms ease-in-out;
				    border-bottom: solid 3px #2c3e50;
				}
	.pos li {
				    list-style-type: none;
				}
	.pos ul, .pos li {
					position: relative;
				    margin: 0;
				    padding: 0;
				    list-style-type: none;
				}

	li {
				    display: list-item;
				    text-align: -webkit-match-parent;
				    
		}
	
	.pos .order .orderline .product-sequences {
					font-size: 30px;
					padding: 0px;
					position: inherit;
					left: 0;					

					text-align: center;
					vertical-align: middle;
					color: white;

					padding: 0;
					float: left;
					font-weight: bold;
					/*width: 30px;*/
					background: #393939;
					margin-right: 1px;
				}

	.pos .order .orderline .product-name {
					display: inline-block;
				    padding: 0;
				    display: inline-block;
				    font-weight: bold;
				    width: 50%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				}
	.pos .order .orderline .price {
					/*width: 10%
				    padding: 0;
				    font-weight: bold;
				    float: none;*/
				    /*display: inline-block;*/

				    text-align: center;
				    padding: 23px 0 0 0;
				    display: inline-block;
				    font-weight: bold;
				    width: 40%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				}
	.pos .order .orderline .info-list {
				    color: #888;
				    margin-left: 15px;
				}
	.pos .order .orderline .remove {
					width: 20px;
					padding: 0px;
					right: 0;
					bottom: 0px;
					float: right;					
					color: white;
					font-weight: bold;
					text-align: center;
					vertical-align: middle;
					border: 5px solid #ff0000e2;					
					background: #F3565D;
					border-color: #F3565D;
	}	





	.pos ul, .pos ol {
				    padding: 0;
				    margin: 0;
				}

	.pos .order .orderline.selected {
				    background: rgba(140,143,183,0.2);
				    -webkit-transition: background 250ms ease-in-out;
				    -moz-transition: background 250ms ease-in-out;
				    transition: background 250ms ease-in-out;
				    cursor: default;
				}
	.pos .order .summary {
				    width: 100%;
				    text-align: right;
				    font-weight: bold;
				    margin-top: 20px;
				    margin-bottom: 10px;
				}
	.pos .order .summary .line {
				    float: right;
				    margin-right: 15px;
				    margin-left: 15px;
				    padding-top: 5px;
				    border-top: solid 2px;
				    border-color: #777;
				}
	.pos .order .summary .total {
				    font-size: 15px;
				}
	.pos .order .summary .line .subentry {
				    font-size: 16px;
				    font-weight: normal;
				    text-align: center;
				}


	.screen .screen-content {
				    margin: 0px auto;
				    max-width: 1024px;
				    text-align: left;
				    height: 100%;
				    overflow: hidden;
				    position: relative;
				    overflow-y: auto;
				}
/*	.pos .order-container {
				    position: absolute;
				    top: 0px;
				    width: 100%;
				    height: 100%;
				    background: white;
				}*/
	.screen .top-content {
				    /*position: absolute;*/
				    display: flex;
				    left: 0px;
				    top: 0px;
				    right: 0px;
				    height: 64px;
				    border-bottom: dashed 1px rgb(215,215,215);
				    text-align: center;
				}
.screen .top-content .top-content-center {
    flex-grow: 1;
}			
	.screen .top-content .button.back {
					display: flex;
					flex-wrap: wrap;
				    /*left: 0px;*/
				    margin-left: 16px;
				}
	.screen .top-content .button {
				    position: absolute;
				    top: 0px;
				    line-height: 32px;
				    padding: 3px 13px;
				    font-size: 20px;
				    background: rgb(230, 230, 230);
				    margin: 12px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				    transition: all 150ms linear;
				}
	.pos .oe_hidden {
				    display: none !important;
				}
	.oe_hidden {
				    display: none !important;
				}
.pos .leftpane {
	border-right: solid 3px #787878;
	background: #e2e2e2;
	height: 100%;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	max-width: 500px;

	/*box-sizing: border-box;
	position: absolute;
	left: 0;
	width: 440px;
	top: 0;
	bottom: 0;
	border-right: solid 3px #787878;
	background: #fff;*/
}
/*.pos .order-container {
				    position: absolute;
				    top: 0px;
				    width: 100%;
				    height: 100%;
				    background: white;
	}*/
/*.pos .order-container {
    top: 0px;
    width: 100%;
    height: 100%;
    background: white;
    flex-grow: 1;
    overflow: hidden;
    overflow-y: auto;

}*/
.pos .order-container {   
    top: 0px;
    width: 100%;
    height: 100%;
    flex-grow: 1;
    background: white;
    overflow: hidden auto;
}
.pos .order {
    padding-bottom: 8px;
    padding-top: 8px;
    font-size: 0.9em;
    text-align: left;
    max-width: 500px;
    transform: translate3d(0px, 0px, 0px);
    background: white;
}
.pos .leftpane .pads {
	    border-top: solid 3px rgb(110, 200, 155);
	}
.pos .control-buttons {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    padding: 8px 16px 0px 11px;
    margin-bottom: 0px;
}
.pos .control-button {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    background: #e2e2e2;
    border: solid 1px #bfbfbf;
    display: inline-block;
    line-height: 38px;
    min-width: 80px;
    text-align: center;
    border-radius: 3px;
    padding: 0px 10px;
    font-size: 18px;
    margin-left: 6px;
    margin-bottom: 6px;
    cursor: pointer;
    overflow: hidden;
    transition: all linear 150ms;
}
.pos .leftpane .pads .subpads {
    display: flex;
    flex-direction: row;
}
.pos .actionpad {
    padding: 0;
    margin: 16px;
    margin-top: 8px;
    margin-right: 0;
    text-align: center;
    vertical-align: top;
    border: none;
    border-radius: 0;
    border-top: 1px solid;
    border-left: 1px solid;
    border-color: #bfbfbf;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    flex-grow: 1;
}
.pos .actionpad .button.set-customer {
    padding-left: 40px;
    padding-right: 40px;
}
.pos .actionpad .button:first-child {
    border-top-left-radius: 4px;
}
.pos .actionpad .button.pay {
    height: 162px;
}
.pos .actionpad .button:last-child {
    border-bottom-left-radius: 4px;
}
.pos .actionpad .button.pay .pay-circle {
    display: block;
    font-size: 32px;
    line-height: 54px;
    padding-top: 6px;
    background: rgb(86, 86, 86);
    color: white;
    width: 60px;
    margin: auto;
    border-radius: 30px;
    margin-bottom: 10px;
}
.pos .numpad {
    text-align: center;
    width: 216px;
    margin: 16px;
    margin-top: 8px;
    margin-left: 0px;
    border: none;
    border-radius: 0;
    border-top: 1px solid;
    border-color: #bfbfbf;
    border-top-right-radius: 4px;
    min-width: 216px;
}
.pos .numpad button {
    float: left;
    height: 54px;
    width: 54px;
    font-weight: bold;
    vertical-align: middle;
    color: #555555;
    border-radius: 0;
    border: none;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: #bfbfbf;
    transition: all 150ms linear;
}

	
	.pos .switchpane {
	    height: 100px;
	    flex-shrink: 0;
	    display: flex;
	}

	/*			
	.pos .leftpane .pads {
				    border-top: solid 3px rgb(110, 200, 155);
				}
	.pos .control-buttons {
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex-flow: row wrap;
				    flex-flow: row wrap;
				    padding: 8px 16px 0px 11px;
				    margin-bottom: -6px;
				}
	.pos .actionpad {
				    display: inline-block;
				    float: left;
				    padding: 0;
				    margin: 16px;
				    margin-top: 8px;
				    margin-right: 0;
				    text-align: center;
				    vertical-align: top;
				    width: 186px;
				    border: none;
				    border-radius: 0;
				    border-top: 1px solid;
				    border-left: 1px solid;
				    border-color: #bfbfbf;
				    border-top-left-radius: 4px;
				    border-bottom-left-radius: 4px;
				}

	.pos .actionpad .button.set-customer {
				    padding-left: 0;
				    padding-right: 0;
				}

	.pos .actionpad .button:first-child {
				    border-top-left-radius: 4px;
				}
	
	.pos .actionpad .button {
				    position: relative;
				    display: block;
				    height: 54px;
				    width: 100%;
				    font-weight: bold;
				    vertical-align: middle;
				    color: #555555;
				    font-size: 14px;
				    border-radius: 0;
				    border: none;
				    border-right: 1px solid;
				    border-bottom: 1px solid;
				    border-color: #bfbfbf;
				    transition: all 150ms linear;
				}	
	.pos .actionpad .button .fa-user {
				    position: absolute;
				    left: 13px;
				    top: 13px;
				    margin-right: 8px;
				    font-size: 18px;
				    background: rgba(255, 255, 255, 0.5);
				    line-height: 30px;
				    width: 30px;
				    border-radius: 100%;
				}	
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}	
	.pos .actionpad .button.pay {
				    height: 162px;
				}
	.pos .actionpad .button:last-child {
				    border-bottom-left-radius: 4px;
				}
	.pos .actionpad .button.pay .pay-circle {
				    display: block;
				    font-size: 32px;
				    line-height: 54px;
				    padding-top: 6px;
				    background: rgb(86, 86, 86);
				    color: white;
				    width: 60px;
				    margin: auto;
				    border-radius: 30px;
				    margin-bottom: 10px;
				}
	.pos .actionpad .button.pay .pay-circle .fa {
				    position: relative;
				    top: -1px;
				    left: 3px;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.pos .numpad {
				    display: inline-block;
				    float: right;
				    text-align: center;
				    width: 216px;
				    margin: 16px;
				    margin-top: 8px;
				    margin-left: 0px;
				    border: none;
				    border-radius: 0;
				    border-top: 1px solid;
				    border-color: #bfbfbf;
				    border-top-right-radius: 4px;
				}
	.pos .numpad button {
				    float: left;
				    height: 54px;
				    width: 54px;
				    font-weight: bold;
				    vertical-align: middle;
				    color: #555555;
				    border-radius: 0;
				    border: none;
				    border-right: 1px solid;
				    border-bottom: 1px solid;
				    border-color: #bfbfbf;
				    transition: all 150ms linear;
				}
	.pos .input-button {
				    font-size: 24px;
				}
	*/
.pos .rightpane {
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-basis: 25%;
    flex-grow: 1;
}
.pos .products-widget {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
}
.pos .layout-table {
	display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
}
/*	.pos .rightpane {
	    overflow:scroll;	   
				    position: absolute;
					top: 0;
					bottom: 0;
					left: 440px;
					right: 0;
					vertical-align: top;
	}
	.pos .rightpane_product_detail {
	    overflow:scroll;	   
		position: absolute;
		top: 0;
		bottom: 0;
		width: 100%;
		right: 0;
		vertical-align: top;
	}
	.pos .products-widget {
		
	    display: flex;
	    flex-direction: column;
	    flex-grow: 1;
	    overflow: hidden;

	}
	.pos .product-list-container {
	    overflow: hidden;
	    overflow-y: auto;
	    flex-grow: 1;
	}*/
	/*.pos .rightpane {		
	   
				    overflow:scroll;	   
				    position: absolute;
					top: 0;
					bottom: 0;
					left: 440px;
					right: 0;
					vertical-align: top;
	}*/
	.pos .rightpane_product_detail {
		/*display: flex;
	    flex-direction: column;
	    flex-grow: 1;
	    overflow: hidden;

		overflow:scroll;	*/   
		/*position: absolute;*/
		/*top: 0;
		bottom: 0;
		width: 100%;
		right: 0;
		vertical-align: top;*/
		position: relative;
		height: 100%;
		display: flex;
	    flex-direction: column;
	    flex-grow: 1;
	    overflow: hidden;
	    overflow-y: auto;
	}
	.pos .switchpane {
	    height: 100px;
	    flex-shrink: 0;
	    display: none;
	}
	.pos .switchpane .btn-switchpane {
	    background-color: #6ec89b;
	    border-radius: 0px;
	    color: #FFFFFF;
	    font-size: 15px;
	    font-weight: bold;
	    flex-grow: 1;
	    flex-basis: 50%;
	    padding-bottom: 20px;
	}
	.pos .switchpane .btn-switchpane.secondary {
	    background-color: #FFFFFF;
	    color: #6ec89b;
	}

	.pos .switchpane .btn-switchpane {
	    background-color: #6ec89b;
	    border-radius: 0px;
	    color: #FFFFFF;
	    font-size: 15px;
	    font-weight: bold;
	    flex-grow: 1;
	    flex-basis: 50%;
	    padding-bottom: 20px;
	}
	/*.pos .screen .layout-table {
				    border: none;
				    width: 100%;
				    height: 100%;
				    display: flex;
				    flex-direction: column;
				    flex-grow: 1;
				    overflow: hidden;
				}*/
	
	.pos tbody{
			display: contents;
			flex-direction: column;
			flex-grow: 1;
			overflow: hidden;
	}		
	/*.pos .screen .layout-table {
				    border: none;
				    width: 100%;
				    height: 100%;
				}*/
	table {
				    border-spacing: 0px;
				    border-collapse: collapse;
				}
				
	table {
				    display: table;
				    border-collapse: separate;
				    box-sizing: border-box;
				    border-spacing: 2px;
				    border-color: grey;
				    text-decoration: none;
				}
	tbody {
				    display: table-row-group;
				    vertical-align: middle;
				    border-color: inherit;
				}		
	.pos .header-row {
				    display: block;
				}	
	.pos .screen .header-cell {
				    border: none;
				    width: 100%;
				    height: 0px;
				}
	td {
				    padding: 0px;
				}
				
	td {
				    display: table-cell;
				    vertical-align: inherit;
				}
	.pos .rightpane-header {
				    padding: 0;
				    height: 48px;
				    border-bottom: 1px solid #c7c7c7;
				    background: #d3d3d3;
				    text-align: center;
				}
	.pos .breadcrumbs {
				    display: inline-block;
				    text-align: left;
				    float: left;
				}
	.pos .searchbox {
				    position: absolute;
				    right: 2px;
				}
	.pos .breadcrumb:last-child {
				    padding-right: 3px;
				    border-right: 1px solid #c5c5c5;
				}
	.pos .breadcrumbss {
				    float: left;
				    display: inline-block;
				    line-height: 48px;
				    height: 48px;
				    min-width: 48px;
				}
	.pos .breadcrumbss-button.breadcrumb-home {
				    line-height: 50px;
				    padding: 0;
				    width: 50px;
				    font-size: 25px;
				    text-align: center;
				}
	.pos .breadcrumbss-button {
				    display: inline-block;
				    padding: 0 9px;
				    vertical-align: top;
				    color: #808080;
				    font-size: 14px;
				    cursor: pointer;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.search-clear.left {
				    left: 11px;
				    color: #808080;
				}
	.pos .search-clear {
				    position: absolute;
				    top: 9px;
				    width: 30px;
				    height: 30px;
				    display: flex;
				    align-items: center;
				    justify-content: center;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.search-clear.right {
				    left: 270px;
				    color: #808080;
				    cursor: pointer;
				}
	.fa {
				    display: inline-block;
				    font: normal normal normal 14px/1 FontAwesome;
				    font-size: inherit;
				    text-rendering: auto;
				    -webkit-font-smoothing: antialiased;
				    -moz-osx-font-smoothing: grayscale;
				}
	.pos .categories {
				    position: relative;
				    border-bottom: solid 3px rgb(110, 200, 155);
				}
	.pos .category-list-scroller {
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    width: 100%;
				    height: 100%;
				    max-height: 20vh;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .category-list.simple {
				    padding: 0px;
				    background: #cecece;
				    display: -webkit-flex;
				    display: flex;
				    -webkit-flex-flow: row wrap;
				    flex-flow: row wrap;
				    border-bottom: none;
				}
	.pos .category-list {
				    text-align: left;
				    padding: 10px;
				    background: rgb(229, 229, 229);
				    border-bottom: 1px solid #cecece;
				}
	.pos .category-simple-button {
				    position: relative;
				    display: inline-block;
				    font-size: 14px;
				    margin-right: 1px;
				    margin-bottom: 1px;
				    padding: 5px 12px;
				    line-height: 32px;
				    flex-grow: 1;
				    -webkit-flex-grow: 1;
				    cursor: pointer;
				    background: #e2e2e2;
				    text-align: center;
				}
	.pos .category-simple-button .active{
					background-color: #666;
  					color: white;
	}
	.pos .category-simple-button:hover {
					background-color: #ddd;
	}
.pos .screen .content-row {
				    /*width: 100%;
				    height: 100%;*/
				    overflow: hidden;
				    overflow-y: auto;
				    flex-grow: 1;
}
	.pos .screen .content-cell {
				    height: 100%;
				}
	.pos .screen .content-cell {
				    width: 100%;
				}
	td {
				    padding: 0px;
				}

	td {
				    display: table-cell;
				    vertical-align: inherit;
				}
	.pos .screen .content-cell .content-container {
				    height: 100%;
				    position: relative;
				}
	/*.pos .product-list-container {
				    position: absolute;
				    top: 0px;
				    bottom: 0px;
				    left: 0px;
				    right: 0px;
				}*/
.pos .product-list-container{
	padding: 10px;
    text-align: left;
    -webkit-transform: translate3d(0,0,0);
    display: flex;
    flex-wrap: wrap;
}				
	.pos .product-list-scroller {
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    width: 100%;
				    height: 100%;
				    overflow: hidden;
				    overflow-y: auto;
				    -webkit-overflow-scrolling: touch;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .product-list {
				    padding: 10px;
				    text-align: left;
				    -webkit-transform: translate3d(0,0,0);
				}
	.pos .product {
				    position: relative;
				    vertical-align: top;
				    display: inline-block;
				    line-height: 100px;
				    font-size: 11px;
				    margin: 8px !important;
				    width: 122px;
				    height: 115px;
				    background: #fff;
				    border: 1px solid #e2e2e2;
				    border-radius: 3px;
				    border-bottom-width: 3px;
				    overflow: hidden;
				    cursor: pointer;
				}
	.pos .product .product-img {
				    position: relative;
				    width: 120px;
				    height: 100px;
				    background: white;
				    text-align: center;
				}
	.pos .product .price-tag {
				    position: absolute;
				    top: 2px;
				    right: 2px;
				    vertical-align: top;
				    color: white;
				    line-height: 13px;
				    background: #7f82ac;
				    padding: 2px 5px;
				    border-radius: 2px;
				}
	.pos .product .product-img img {
				    max-height: 100px;
				    max-width: 120px;
				    vertical-align: middle;
				}
	.pos .product .product-name {
				    position: absolute;
				    -webkit-box-sizing: border-box;
				    -moz-box-sizing: border-box;
				    -ms-box-sizing: border-box;
				    box-sizing: border-box;
				    bottom: 0;
				    top: auto;
				    line-height: 14px;
				    width: 100%;
				    overflow: hidden;
				    text-overflow: ellipsis;
				    background: -webkit-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    background: -moz-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    background: -ms-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
				    padding: 3px;
				    padding-top: 15px;
				}


	.pos .clientlist-screen .searchbox {
				    right: auto;
				    margin-left: -90px;
				    margin-top: 8px;
				    left: 30%;
				}
	.pos .clientlist-screen .searchbox input {
				    width: 300px;
				}
	.pos .searchbox input {
				    width: 300px;
				    border: 1px solid #cecbcb;
				    padding: 10px 20px;
				    padding-left: 38px;
				    padding-right: 33px;
				    margin: 6px;
				    background-color: white;
				    border-radius: 20px;
				    font-family: "Lato","Lucida Grande", Helvetica, Verdana, Arial;
				    font-size: 13px;
				}

	.pos .clientlist-screen .button.new-customer {
				    left: 30%;
				    margin-left: 250px;
				}
	.screen .top-content .button.next {
				    right: 0px;
				    margin-right: 16px;
				}
	.screen .top-content .button.highlight {
				    background: rgb(110,200,155);
				    color: white;
				    border: solid 1px rgb(110,200,155);
				}
	.screen .full-content {
				    position: absolute;
				    right: 0%;
				    top: 65px;
				    bottom: 0px;
				    left: 0%;
				}
	.pos .clientlist-screen .window, .pos .clientlist-screen .full-content .subwindow {
				    display: block;
				}
	.pos .clientlist-screen .full-content .subwindow.collapsed, .pos .clientlist-screen .full-content .subwindow-container.collapsed {
				    height: auto;
				}
	.pos .clientlist-screen .window, .pos .clientlist-screen .full-content .subwindow {
				    display: block;
				}
	.pos .clientlist-screen .full-content .subwindow.collapsed, .pos .clientlist-screen .full-content .subwindow-container.collapsed {
				    height: auto;
				}
	.pos .clientlist-screen .full-content .subwindow-container {
				    display: block;
				    height: 100%;
				}
	.pos .clientlist-screen .client-details {
				    padding: 16px;
				    border-bottom: solid 5px rgb(110,200,155);
				}
	.pos .clientlist-screen .client-picture {
				    height: 64px;
				    width: 64px;
				    border-radius: 32px;
				    overflow: hidden;
				    text-align: center;
				    float: left;
				    margin-right: 16px;
				    background: white;
				    position: relative;
				}
	.pos .clientlist-screen .client-name {
				    font-size: 32px;
				    line-height: 64px;
				    margin-bottom: 16px;
				}
	.pos .clientlist-screen .edit-buttons {
				    position: absolute;
				    right: 16px;
				    top: 10px;
				}
	.pos .clientlist-screen .edit-buttons .button {
				    display: inline-block;
				    margin-left: 16px;
				    color: rgb(128,128,128);
				    cursor: pointer;
				    font-size: 36px;
				}
	.pos .clientlist-screen .client-details-box {
				    position: relative;
				    font-size: 16px;
				}
	.pos .clientlist-screen .client-details-left {
				    width: 50%;
				    float: left;
				}
	.pos .clientlist-screen .client-detail {
				    line-height: 24px;

				    width: 100%
				}
	.pos .clientlist-screen .client-detail > .label {
				    font-weight: bold;
				    display: inline-block;
				    width: 140px;
				    text-align: left;
				    margin-right: 8px;
				    color: blue;
				    font-size: 15px;

				}
	.pos .clientlist-screen .client-details-right {
				    width: 50%;
				    float: right;
				}
	.pos .clientlist-screen .full-content .subwindow-container {
				    display: block;
				    height: 100%;
				}
	.pos .clientlist-screen .client-list {
				    font-size: 16px;
				    width: 100%;
				    line-height: 40px;
				}
	.pos .clientlist-screen .client-list tr.highlight {
				    transition: all 150ms linear;
				    background: rgb(110,200,155) !important;
				    color: white;
				}
	.pos .clientlist-screen .client-list tr.lowlight {
				    transition: all 150ms linear;
				    background: rgb(216, 238, 227);
				}
	.pos .clientlist-screen .client-list thead > tr, .pos .clientlist-screen .client-list tr:nth-child(even) {
				    background: rgb(247,247,247);
				}
	.pos .clientlist-screen .client-list tr {
				    transition: all 150ms linear;
				    background: rgb(230,230,230);
				}
	.pos .clientlist-screen .client-list th, .pos .clientlist-screen .client-list td {
				    padding: 0px 8px;
				}
	input {
				    -webkit-writing-mode: horizontal-tb !important;
				    text-rendering: auto;
				    color: -internal-light-dark-color(black, white);
				    letter-spacing: normal;
				    word-spacing: normal;
				    text-transform: none;
				    text-indent: 0px;
				    text-shadow: none;
				    display: inline-block;
				    text-align: start;
				    -webkit-appearance: textfield;
				    background-color: -internal-light-dark-color(rgb(255, 255, 255), rgb(59, 59, 59));
				    -webkit-rtl-ordering: logical;
				    cursor: text;
				    margin: 0em;
				    font: 400 13.3333px Arial;
				    padding: 1px 2px;
				    border-width: 2px;
				    border-style: inset;
				    border-color: -internal-light-dark-color(rgb(118, 118, 118), rgb(195, 195, 195));
				    border-image: initial;
				}


	/*.screen .left-content.pc40 {
				    right: 66%;
				}*/
.screen .left-content {
				    /*position: absolute;
				    left: 0px;
				    top: 64px;
				    bottom: 0px;
				    right: 50%;
				    overflow-x: hidden;
				    overflow-y: auto;
				    border-right: dashed 1px rgb(215,215,215);*/
	overflow-x: hidden;
    overflow-y: auto;
    border-right: dashed 1px rgb(215,215,215);
    flex-grow: 1;
    min-width: 200px;
}
.screen .right-content {
	position: relative;
	top:15px;
				   /* position: absolute;
				    right: 0px;
				    top: 64px;
				    bottom: 0px;
				    left: 50%;
				    overflow-x: hidden;
				    overflow-y: auto;*/			    
	overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-grow: 1;    
    flex-direction: column;
}
	.paymentmethods {
				    margin: 16px;
				    display: flex; /*suuld nemsen*/
				    flex-basis: 25%;
				    flex-wrap: wrap; /*suuld nemsen*/
				    justify-content: space-between; /*suuld nemsen*/
				}
	.paymentmethods .button:first-child {
				    border-top-width: 1px;
				    border-top-left-radius: 3px;
				    border-top-right-radius: 3px;
				}
	.paymentmethods .button {
				    background: #e2e2e2;
				    line-height: 74px;
				    font-size: 16px;
				    border: solid 1px rgb(202, 202, 202);
				    border-top-width: 0px;
				    cursor: pointer;
				    text-align: center;
				    padding: 0 30px;
				}
	.paymentmethods .button:last-child {
				    border-bottom-left-radius: 3px;
				    border-bottom-right-radius: 3px;
				}

	/*.screen .right-content.pc60 {
				    left: 34%;
				}*/
	colgroup {
				    display: table-column-group;
				}
	thead {
				    display: table-header-group;
				    vertical-align: middle;
				    border-color: inherit;
				}
	tr {
				    display: table-row;
				    vertical-align: inherit;
				    border-color: inherit;
				}
	.pos .paymentlines-container {
				    padding: 16px;
				    padding-top: 0;
				    border-bottom: dashed 1px gainsboro;
				    min-height: 154px;
				}
	.pos .paymentlines {
				    width: 100%;
				    border-spacing: 0px 10px;
				    border-collapse: inherit;
				}
	.pos .paymentline {
				    font-size: 22px;
				}
	.pos .paymentline.selected {
				    font-size: 22px;
				    background: #6EC89B;
				    color: white;
				}
	.pos .paymentline .col-due, .pos .paymentline .col-tendered, .pos .paymentline .col-change {
				    min-width: 90px;
				}
	.pos .paymentline > * {
				    padding: 8px 12px;
				}
	.pos .paymentline.selected .edit {
				    background: white;
				    color: #6EC89B;
				    outline: 3px blue;
				    box-shadow: 0px 0px 0px 3px #6EC89B;
				    position: relative;
				    border-radius: 3px;
				}
	.pos .paymentline .col-due, .pos .paymentline .col-tendered, .pos .paymentline .col-change {
				    min-width: 90px;
				}
	.pos .paymentline .col-name {
				    font-size: 16px;
				}
	.pos .paymentline .delete-button {
				    cursor: pointer;
				    text-align: center;
				}
	.payment-screen .paymentlines-empty .total {
				    text-align: center;
				    padding: 0px 0px 0px;
				    font-size: 40px;
				    color: #43996E;
				    text-shadow: 0px 2px white, 0px 2px 2px rgba(0, 0, 0, 0.27);
				}
	.payment-screen .paymentlines-empty .message {
				    text-align: center;
				}
	.pos .payment-buttons {
				    display: inline-block;
				    width: 50%;
				    box-sizing: border-box;
				    padding: 16px;
				    padding-left: 0;
				    float: right;
				}
	.payment-screen .payment-buttons .button:first-child {
				    border-top-left-radius: 3px;
				    border-top-right-radius: 3px;
				    border-top-width: 1px;
				}
	.payment-screen .payment-buttons .button {
				    background: #e2e2e2;
				    line-height: 73px;
				    font-size: 16px;
				    padding: 0px 8px;
				    border: solid 1px rgb(200,200,200);
				    border-top-width: 0;
				    cursor: pointer;
				    text-align: center;
				    position: relative;
				    transition: background-color, border-color, color 150ms linear;
				}
	.pos .payment-numpad {
				    display: inline-block;
				    width: 50%;
				    box-sizing: border-box;
				    padding: 16px;
				    text-align: center;
				    float: left;
				}
	.pos .payment-numpad .numpad {
				    float: none;
				    border-radius: 4px;
				    border-top: 1px solid;
				    border-left: 1px solid;
				    border-color: #cacaca;
				    width: 297px;
				    overflow: hidden;
				    margin: 0;
				}
	
	.pos .payment-numpad .numpad button:first-child {
				    border-top-left-radius: 150px;
				}
	.pos .payment-numpad .numpad button {
				    width: 74px;
				    height: 74px;
				}
	.screen .top-content .button.highlight {
				    background: rgb(110,200,155);
				    color: white;
				    border: solid 1px rgb(110,200,155);
				}
	.pos .control-button.highlight, .pos .button.highlight {
				    background: #6EC89B !important;
				    border: solid 1px #64AF8A !important;
				    color: white !important;
				}
	.pos .control-button.highlight, .pos .button.warning {
				    background: #ff1000 !important;
				    border: solid 1px #64AF8A !important;
				    color: white !important;
				}
	.screen .centered-content {
				    position: absolute;
				    right: 25%;
				    top: 64px;
				    bottom: 0px;
				    left: 25%;
				    border-right: dashed 1px rgb(215,215,215);
				    border-left: dashed 1px rgb(215,215,215);
				    overflow-x: hidden;
				    overflow-y: auto;
				}
	.pos .receipt-screen .centered-content .button {
				    line-height: 40px;
				    padding: 3px 13px;
				    font-size: 20px;
				    text-align: center;
				    background: rgb(230, 230, 230);
				    margin: 16px;
				    margin-bottom: 0px;
				    border-radius: 3px;
				    border: solid 1px rgb(209, 209, 209);
				    cursor: pointer;
				}
	.pos .pos-receipt-container {
				    font-size: 0.75em;
				    text-align: center;
				    direction: ltr;
				}
	.pos .pos-receipt-container > div {
				    text-align: left;
				    width: 300px;
				    background-color: white;
				    margin: 20px;
				    padding: 15px;
				    font-size: 16px;
				    padding-bottom: 30px;
				    display: inline-block;
				    border: solid 1px rgb(220,220,220);
				    border-radius: 3px;
				    overflow: hidden;
				}
	.pos-receipt .pos-receipt-contact {
				    text-align: center;
				    font-size: 75%;
				}
	.pos .pos-receipt-container > div {
				    text-align: left;
				    width: 300px;
				    background-color: white;
				    margin: 20px;
				    padding: 15px;
				    font-size: 16px;
				    padding-bottom: 30px;
				    display: inline-block;
				    border: solid 1px rgb(220,220,220);
				    border-radius: 3px;
				    overflow: hidden;
				}
	.pos-receipt .pos-receipt-amount {
				    font-size: 125%;
				    padding-left: 6em;
				}
	.pos-receipt .pos-receipt-right-align {
				    float: right;
				}
	.pos-receipt .pos-receipt-order-data {
				    text-align: center;
				    font-size: 75%;
				}



	.pos label.category-simple-button {
					position: relative;
					display: inline-block;
					font-size: 14px;
					font-color: #fff;
					font-weight: bold;
					margin-right: 2px;
					margin-bottom: 1px;
					padding: 5px 12px;
					line-height: 32px;
					-webkit-flex-grow: 1;
					cursor: pointer;
					background: #e2e2e2;


					background-color: #fff;
  					color: #333; 
				}
				
	.pos label.category-simple-button:not(.btn-flat) {
					position: relative;
					display: inline-block;
					font-size: 14px;
					font-color: #fff;
					font-weight: bold;
					margin-right: 2px;
					margin-bottom: 1px;
					padding: 5px 12px;
					line-height: 32px;
					-webkit-flex-grow: 1;
					cursor: pointer;
					background: #e2e2e2;

					background-color: rgb(110, 200, 155);
  					color: #fff;
				}











	}