body {
	background-color: white !important;
	background-image: none !important;
}


html {
/*     overflow: scroll; */
/*     overflow-x: auto; */
/*     overflow-y: auto; */
}

::-webkit-scrollbar {
	width: 5px;
    height: 11px;
	background: transparent;  /* Optional: just make scrollbar invisible */
}

/* Optional: show position indicator in red */
::-webkit-scrollbar-thumb {
    background: #CECECE;
}


/* width */
/* ::-webkit-scrollbar {
	width: 0px;
} */

/* Track */
::-webkit-scrollbar-track {
	/* box-shadow: inset 0 0 5px grey; 
	border-radius: 10px; */
}
/* Handle */
::-webkit-scrollbar-thumb {
	/* background: #CECECE; 
	border-radius: 10px; */
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	/* background: #CECECE;  */
}


#content_table {
	/* padding: 0em 0em 0em !important; */
	/* padding: 0px !important; */
}

.toolbar {
	padding: 4px;
	display: inline-block;
	width: 100%;
	background-color: rgb(248, 248, 248);
}

.toolbar-button {
	float: left;
	height: 42px !important;
}

.control-button {
    border: 1px solid #ccc;
    font-weight: normal;
    color: #2b2b2b;
    border-radius: 3px;
	padding: 0px 10px;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	top: -3px;
	height: 40px !important;
}

.control-button:hover {
	background-color: #ededed;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus {
	border: 1px solid #ccc;
	font-weight: normal;
	color: #2b2b2b;
	background-color: #ededed;
}

.separator {
	float: left;
	content: "&nbsp;";
}

#statusbar {
	padding-left: 10px;
	display: inline-block;
	width: 100%;
	height: 17px;
	color: red;
}

.no-select { 
	-webkit-user-select: none; 
	-khtml-user-select: none; 
	-moz-user-select: none; 
	-o-user-select: none; 
	user-select: none; 
} 

.ui-dialog {
	z-index: 2000;
	background-color: rgba(255, 255, 255, 0.7) !important;
}

.ui-dialog-contain {
	margin-left: unset !important;	
	margin-right: unset !important;	
}

.ui-listview-build li:first-child {
	position: fixed;
	/* width: 400px; */
	width: 100%;
	z-index: 2;
}

.ui-header-fixed {
    /* width: 400px !important; */
    width: 100% !important;
    position: relative;
}

.ui-footer-fixed {
    /* width: 400px !important; */
    width: 100% !important;
    height: 53px;
    /* position: absolute; */
}

.ui-label {
	padding: 0px;
	border-style: none;
	border-width: 0px;
}

.builder {
	height: calc(100% - 75px);
	float: left;
}

.builder td {
	vertical-align: top;
}

.log {
	height: calc(100% - 75px);
	float: left;
}

.showlog {
	height: 100%;
	overflow-y: auto;
	overflow-wrap: break-word;
	margin: 0px;
	border-width: thin;
	border-style: ridge;
}

.showjson {
	display: none;
	height: 50%;
	overflow-y: auto;
	overflow-wrap: break-word;
	margin: 0px;
	border-width: thin;
	border-style: ridge;
	font-size: smaller;
}

#page-home {
	/* max-height: 760px; */
	height: 100%;
	position: relative;
	float: left;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

#footer {
	padding-bottom: 1px !important;
}

#content_table {
	/* padding-bottom: 16px !important; */
}

label {
    margin: 0 0 0 0 !important;
}

div.btn-lbl-top img {
	display: block;
}

div.btn-lbl-top span:nth-of-type(1) {
	display: block;
}

div.btn-lbl-top span:nth-of-type(2) {
	display: none;
}

div.btn-lbl-bottom img {
	display: block;
}

div.btn-lbl-bottom span:nth-of-type(1) {
	display: none;
}

div.btn-lbl-bottom span:nth-of-type(2) {
	display: block;
}

div.btn-lbl-left img {
	display: inline;
	vertical-align: middle;
}

div.btn-lbl-left span:nth-of-type(1) {
	display: inline;
}

div.btn-lbl-left span:nth-of-type(2) {
	display: none;
}

div.btn-lbl-right img {
	display: inline;
	vertical-align: middle;
}

div.btn-lbl-right span:nth-of-type(1) {
	display: none;
}

div.btn-lbl-right span:nth-of-type(2) {
	display: inline;
}

.selected {
	-webkit-box-shadow: 0 0 12px #3388cc;
	-moz-box-shadow: 0 0 12px #3388cc;
	box-shadow: 0 0 12px #3388cc;
	outline: auto;
	outline-style: inset;
}

.tabpanel li {
	float: left;
	padding-left: 10px;
	padding-right: 10px;
}

.builderTabs {
	height:100%;
	font-family: 'Roboto Mono', monospace !important;
	font-size: small;
}

#editors-tab {
    overflow: auto;
    height: calc(100% - 23px);
}

.editors {
/*	border-width: 0px thin;
	border-color: darkgray;
	border-style: solid;*/
}

.editors-list {
	max-width: 850px;
	width: 100%;
	border-spacing: 0px;
	-webkit-border-vertical-spacing: 0px;
}

.editors-list thead th,
.editors-list tbody tr:last-child {
    border-bottom: 1px solid #d6d6d6; /* non-RGBA fallback */
    border-bottom: 1px solid rgba(0,0,0,.1);
}

.editors-list tbody th,
.editors-list tbody td:not(:first-child):not(:last-child) {
    border-bottom: 1px solid #e6e6e6; /* non-RGBA fallback  */
    border-bottom: 1px solid rgba(0,0,0,.05);
}

.editors-list tbody tr:last-child th,
.editors-list tbody tr:last-child td {
    border-bottom: 0;
}

.editors-list tbody tr:nth-child(odd) td:not(:first-child):not(:last-child),
.editors-list tbody tr:nth-child(odd) th {
    background-color: #fafafa; /* non-RGBA fallback  */
    background-color: rgba(0,0,0,.02);
}

.editors-list-header {
	
}

.editors-list-collapsible {
	
}

.editors-obligated {
	background-color: orange;
	background-image: linear-gradient(top, #f2c471, #f0c471)  !important;
	background-image: -webkit-linear-gradient(top, #f2c471, #f0c471)  !important;
	background-image: -ms-linear-gradient(top, #f2c471, #f0c471)  !important;
	background-image: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(#f2c471),
        color-stop(#f0c471)
	)  !important;
}

.editors-label-td {
	width: 225px;
	font-family: 'Roboto Mono', monospace;
	font-size: smaller;
/*	white-space: nowrap;*/
}

.editors-input-td {
	min-width: 200px;
}

.editors-input {
	font-family: 'Roboto Mono', monospace !important;
	font-size: small;
	border-radius: 3px;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(169, 169, 169);
	height: 20px;
}

.editors-textarea {
	width: calc(100% - 6px);
	font-family: 'Roboto Mono', monospace !important;
	font-size: small;
	border: 1px solid #c5c5c5;
	border-radius: 3px;
}

.upper {
	text-transform: uppercase !important;
}

.editors-color {
	background: none !important;
	border: none;
}

.clear-icon {
	position: relative;
	background-color: transparent;
	display: none;
	vertical-align: top;
}

.clear-icon:after {
	content: "x";
	display: block;
	position: absolute;
	z-index: 1;
	right: 5px;
	margin: auto;
	padding: 2px;
	text-align: center;
	color: red;
	font-weight: normal;
	font-size: 12px;
	cursor: pointer;
}

/*.editors-input:hover + .clear-icon {
	display: inline-block !important;
}*/

.clear-icon-combobox {
	position: relative;
	background-color: transparent;
	display: none;
	vertical-align: top;
}

.clear-icon-combobox:after {
	content: "x";
	display: block;
	position: absolute;
	z-index: 1;
	right: 25px;
	margin: auto;
	padding: 2px;
	text-align: center;
	color: red;
	font-weight: normal;
	font-size: 12px;
	cursor: pointer;
}

/*.custom-combobox-input:hover + .clear-icon-combobox {
	display: inline-block !important;
}*/

#fields-tab {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 23px);
}

.fields {
/*	border-width: 0px thin;
	border-color: darkgray;
	border-style: solid;*/
}

.fields-list {
	max-width: 850px;
	width: 100%;
	border-spacing: 0px;
	-webkit-border-vertical-spacing: 0px;
}

#screens-tab {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 23px);
}

.screens {
/*	border-width: 0px thin;
	border-color: darkgray;
	border-style: solid;*/
}

.screens-list {
	max-width: 850px;
	width: 100%;
	height: 100%;
	border-spacing: 0px;
	-webkit-border-vertical-spacing: 0px;
}

table.dataTable {
	margin: unset !important;
}

table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected {
    background-color: #e5eff7 !important;
}

table.dataTable.display tbody>tr.odd.selected>.sorting_1, table.dataTable.order-column.stripe tbody>tr.odd.selected>.sorting_1 {
    background-color: #e5eff7 !important;
}

table.dataTable.display tbody>tr.even.selected>.sorting_1, table.dataTable.order-column.stripe tbody>tr.even.selected>.sorting_1 {
    background-color: #e5eff7 !important;
}

.json-span table {
	width: 100%;
}

.json-span table:not(:last-child) {
	border-bottom: lightgrey thin solid;
}

.json-label {
	width: 100px;
	font-size: small;
}

.json-editor td {
	background-color: transparent !important;
    border-bottom: 0px !important;
}

.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 2000; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 500px;
    height: 300px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
}

.dialog_fields {
	width: 100%;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: white;
    text-decoration: none;
    cursor: pointer;
}

.modal-header {
    padding: 2px 16px;
    background-color: #00427C /*{a-bar-background-color}*/;
    border-color: #003e67 /*{a-bar-border}*/;
    color: #ffffff /*{a-bar-color}*/;
    text-shadow: 0 /*{a-bar-shadow-x}*/ 1px /*{a-bar-shadow-y}*/ 1px /*{a-bar-shadow-radius}*/ #444444 /*{a-bar-shadow-color}*/;
    font-weight: bold;
}

.modal-body {
	padding: 2px 16px;
}

.modal-footer {
	position: absolute;
	bottom: 0px;
	/* width: 400px; */
	width: 100%;
    padding: 16px 0px;
    background-color: #fff;
    color: #000;
}

.modal-buttons {
	margin: 0px 10px;
}

.custom-combobox {
	position: relative;
	display: inline-block;
	width: 100%;
}

.custom-combobox-input {
	padding: 2px;
	background-color: white;
	width: calc(100% - 26px);
	font-family: 'Roboto Mono', monospace !important;
	font-size: small;
}

.custom-combobox a {
	height: 20px;
	background-color: white;
	float: right;
}

.ui-autocomplete {
    overflow-y: auto;
    height: 200px;
    overflow-x: auto;
	font-family: 'Roboto Mono', monospace !important;
	font-size: small;
    list-style-type: none;
    -webkit-padding-start: 2px !important;
    z-index: 9000;
}

.ui-autocomplete li {
	white-space: nowrap;
}

.ui-state-disabled {
    pointer-events: all !important;
}

.separator {
	width: 10px;
	display: inline-block;
	opacity: 0;
}

.logo {
	background-image: url(../Logo.png) !important;
	width: 84px;
	height: 40px;
	background-size: 84px 40px;
    background-repeat: no-repeat;
    margin-right: 9px;
	float: left;
}

.title {
	float: left;
	margin-right: 8px;	
	margin-top: 12px;
	color: #5e5e5e;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 18px;
}

.icon_help {
	background-image: url(../resources/help.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_newapp {
	background-image: url(../resources/newapp.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_openapp {
	background-image: url(../resources/openapp.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_saveapp {
	background-image: url(../resources/saveapp.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_saveappas {
	background-image: url(../resources/saveappas.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_deploy {
	background-image: url(../resources/deploy.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_invite {
	background-image: url(../resources/invite.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_newscreen {
	background-image: url(../resources/newscreen.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_copyscreen {
	background-image: url(../resources/copyscreen.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_newfield {
	background-image: url(../resources/newfield.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_newmenubutton {
	background-image: url(../resources/newmenubutton.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_newtoolbutton {
	background-image: url(../resources/newtoolbutton.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_delete {
	background-image: url(../resources/delete.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_closebuilder {
	background-image: url(../resources/closebuilder.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_addav {
	background-image: url(../resources/addav.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_deleteav {
	background-image: url(../resources/deleteav.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_logout {
	background-image: url(../resources/logout.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_startbuilder {
	background-image: url(../resources/startbuilder.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_user {
	background-image: url(../resources/user.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_download {
	background-image: url(../resources/download.png) !important;
	width: 32px;
	height: 32px;
	background-size: 32px 32px;
	margin: 3px;
}

.icon_ok {
	background-image: url(../resources/ok.png) !important;
	background-repeat: no-repeat;
	background-position: center;
	height: 29px;
	width: 70px;
	float: right;
	margin-left: 5px;
}

.icon_cancel {
	background-image: url(../resources/cancel.png) !important;
	background-repeat: no-repeat;
	background-position: center;
	height: 29px;
	width: 70px;
	float: right;
	margin-left: 5px;
}

.icon_add {
	background-image: url(../resources/add.png) !important;
	background-repeat: no-repeat;
	background-position: center;
	height: 29px;
	width: 70px;
/* 	float: right; */
	margin-left: 5px;
}

.icon_deleteimage {
	background-image: url(../resources/delete.png) !important;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px, 20px;
	height: 29px;
	width: 70px;
/* 	float: right; */
	margin-left: 5px;
}

div.DTS div.dataTables_scrollBody {
	background: #f6f6f6 !important;
}

.gutter {
    background-color: #eee;

    background-repeat: no-repeat;
    background-position: 50%;
}

.gutter.gutter-horizontal {
    background-image: url('grips/vertical.png');
    cursor: ew-resize;
    float: left;
}

.gutter.gutter-vertical {
    background-image: url('grips/horizontal.png');
    cursor: ns-resize;
}

#headerinfodiv {
	display: flow-root !important;
}

span[name="headerinfospan"] {
	min-height: 20px;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance:textfield;
}



.fieldsform {
	width: 45% !important;
}

/* .fieldscontainer div { 
	width: fit-content !important;
} 
.fieldscontainer .p-input { 
    width: fit-content !important;
} 
 */

/* .fieldscontainer {
	overflow-x: auto !important;
	overflow-y: hidden !important;	
}
.fieldscontainer label { 
    width: 30% !important; 
    max-width: 200px !important; 
    display: inline-block !important; 
	margin-top: 20px !important;
	float: left !important;
} 
.fieldscontainer div { 
	width: fit-content !important;
} 
.fieldscontainer .p-input { 
    width: fit-content !important;
	float: left !important;
} 
.fieldscontainer .ui-btn { 
    max-width: 200px !important; 
	float: left !important;
} 
.fieldscontainer .ui-controlgroup { 
	padding-top: 20px !important;
	float: left !important;
    max-width: 200px !important; 
} 
.fieldscontainer .ui-controlgroup-controls {
	width: 300px !important;
}
 */

/* .fieldscontainer {
	overflow-x: auto !important;
	overflow-y: hidden !important;	

}
.fieldscontainer label {
	float: left !important;
	width: 180px !important;
	height: 50px !important;
	margin-top: 10px !important;
}
.fieldscontainer p {
	width: auto !important;
	float: left !important;
	height: 20px !important;
	margin: 0px !important;
}
.fieldscontainer div {
	width: auto !important;
	float: left !important;
	height: 20px !important;
	margin: 0px !important;
}
 */
 
 
.jconfirm.jconfirm-brancheview .jconfirm-box {
  max-width: 500px !important;

}
