img 
{
	border: 0px;
	padding: 0px;
}

canvas
{
	background-color:white;
}

body 
{
		padding:0px; 
		margin:0px; 
		color:black;
		border:0px;
		font-family:verdana, Sans-serif;
		font-size:12px;
		background-color:white;
		height:100%;
		width:100%;
		background-color:#CAE9F4;
		/*background-color:#738CA6;*/
		background-color:#C8D4DB;	
}

input, select
{
	color: black;
	font-family: Verdana,Arial,Tahoma,sans-serif;
	font-size: 12px;
	font-weight: normal;
	margin: 1px 1px 0 0;
	padding: 1px 1px;
	text-transform: none;
	vertical-align: middle;
	border: 1px solid #bbb;
	box-shadow: inset 0 1px 1px 1px #eee;
	line-height: 1;
	cursor: auto !important;
}

div.listbox 
{
	overflow:auto;
	border:1px solid black;
	border-bottom-color:#aaa;
	border-right-color:#aaa;
	background-color:white;

}

div.Panel
{
	background-color:#EFEFEF;
/*	background-color:#FFFFB2;
	background-color:#7FB490;
*/
	border: 1px solid black;
	/*
	box-shadow: 1px 1px 1px #111;
	-webkit-box-shadow: 1px 1px 1px #111;
	/*
	box-shadow: 3px 3px 7px #111;
	-webkit-box-shadow: 3px 3px 7px #111;
	*/ 
	border-radius: 0px;
	-webkit-border-radius: 0px;
}

div.NavBarWrapper
{
	position:fixed;
	top:0px;
	width:100%;
	z-index:1;
	background-color:black;
	background-color:#338BA9;
	background-color:#2B4C6F;
	height:30px;
	color:white;
	font-size:14px;
	font-weight:bold;
	white-space:nowrap;
	padding:0px;
	-webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;          /* Likely future */      
	
}

div#NavBarToolBar
{
	position:absolute;
	top:0px;
	left:0px;
	width:25%;
	text-align:left;
	top:50%;
	margin-top:-8px;
}

span#NavBarToolBar
{
	padding-left:35px;
	cursor:pointer;
}

div#NavBarTitle
{
	position:absolute;
	top:0px;
	left:25%;
	width:50%;
	text-align:center;
	top:50%;
	margin-top:-8px;
}

div#NavBarHelp
{
	position:absolute;
	top:0px;
	left:97%;
	width:3%;
	text-align:right;
	top:50%;
	margin-top:-8px;
}

span#NavBarHelp
{
	cursor:pointer;
	padding-right:35px;
}

div#NavBarUser
{
	position:absolute;
	top:0px;
	left:72%;
	width:25%;
	text-align:right;
	top:50%;
	margin-top:-8px;
}

span#NavBarUser
{
	cursor:pointer;
	padding-right:35px;
}

div#NavBarUserMenu
{
	position:fixed;
	width:220px;
	height:30px;
	top:35px;
	z-index:1;
	background-color:black;
	color:white;
	/*
	opacity:0.7;
	filter:alpha(opacity=70); *//* For IE8 and earlier */
}

span#NavParUserMenuItemLogout
{
	position:absolute;
	left:10px;
	font-size:16px;
	font-weight:bold;
	white-space:nowrap;
	top:50%;
	margin-top:-8px;
}

ul#mnuMainSwitch
{
	position:fixed;
	width:220px;
	top:35px;
	left:35px;
	box-shadow:1px 1px 2px #111;
	-webkit-box-shadow:1px 1px 2px #111;

}

ul#mnuUser
{
	position:fixed;
	width:150px;
	top:35px;
	left:100%;
	margin-left:-185px;
		box-shadow:1px 1px 2px #111;
	-webkit-box-shadow:1px 1px 2px #111;
}

div.ui-widget-header
{
	border:1px solid black;
	background:black;
	/*opacity:0.7;
	filter:alpha(opacity=70);*/ /* For IE8 and earlier */
}

div#dlgGridLock
{
	display:none;
}

div#dlgSUDetails
{
	display:none;
}

select#cboCostingType
{
	position:absolute;
	top:10px;
	left:10px;
	width:120px;
}

input#btnMarkUp
{
	position:absolute;
	top:10px;
	left:100%;
	width:120px;
	margin-left:-130px;
	height:26px;
}

div#divMarkupDialog
{
	display:none;
}

input#txtMarkUp
{
	
	width:120px;
	
}


div#lstCosting
{
	position:absolute;
	width:305px;
	height:275px;
	left:10px;
	top:40px;
}

div#divCosting
{
	position:absolute;
	width:330px;
	top:380px;
	left:0px;
	height:335px;
}


.ui-tabs /*.ui-tabs-panel*/
{
	padding:0px;
}

.ui-tabs .ui-tabs-panel
{
	padding:0px;
}

.ui-corner-all
{
	border-radius:0px;
	-webkit-border-radius:0px;
}

.ui-corner-bottom
{
	border-radius:0px;
	-webkit-border-radius:0px;
}

.ui-tabs-nav 
{
    background-color: #222; /*// !important; To overwrite jquery-ui.css*/
    height: 30px;                        /*To stop nav block scaling of tab size*/
	font-size:12px;
}

.ui-widget-header 
{
		background:white;
		border:1px solid black;
}


div#divContainer
{
		position:absolute;
		top:0px;
		left:670px;
		width:340px;
		float:right;
		/*border:1px solid blue;
		background-color:blue;*/
}

div#divContainer1
{
	width:340px;
	background-color:red;
}

@media screen and (min-height: 800px) 
{
	div#divContainer1
	{
		position:fixed;
	}
}

div#divPicture
{
	position:absolute;
	width:330px;
	top:45px;
	left:0px;
	height:330px;
}

div#divHeader
{
	position:absolute;
	width:330px;
	top:0px;
	left:0px;
	height:40px;
	text-align:right;
}

input.btnHeader
{
	position:relative;
	top:5px;
	right:5px;
	width:70px;
	height:30px;
}

canvas.myCanvas
{
	position:absolute;
	border:1px solid black;
	top:10px;
	left:10px;
	width:310px;
	height:310px;
}

/* 03/27/2025, set important to respect labels */
canvas.myCanvasShort {
	position :absolute;
	border :1px solid black;
	top :10px;
	left :10px;
	width :310px;
	height :290px !important;
}

div#divLabel1
{
	position:absolute;
	top:100%;
	margin-top:-28px;
	font-size:12px;
	font-weight:bold;
	left:10px;
	width:155px;
	height:18px;
}

div#divLabel2
{
	position:absolute;
	top:100%;
	margin-top:-28px;
	font-size:12px;
	font-weight:bold;
	left:165px;
	width:155px;
	height:18px;
	text-align:right;
}

.ui-widget-content
{
	/*background:transparent;*/
	background:white;
	border:1px solid black;
	color:black;
}


div#dlgPictureSelector
{
	display:none;
}

div#lstPictureSelector
{
	position:absolute;
	top:10px;
	left:50%;
	width:570px;
	margin-left:-285px;
	height:420px;
}

td.tdPictureSelector
{
	position:relative;
	width:100px;
	height:100px;
	border:1px solid black;
}

img.imgPictureSelector
{
	position:absolute;
	width:70px;
	height:70px;
	left:50%;
	margin-left:-35px;
	top:5px;
}

div#divNewItemDialog
{
	display:none;
}

div#lstNewItem
{
	position:absolute;
	top:5px;
	left:5px;
	width:240px;
	height:320px;
}

span#lblNewItemQuantity
{
	position:absolute;
	top:332px;
	left:57px;
}

input#txtNewItemQuantity
{
	position:absolute;
	top:330px;
	left:120px;
	width:70px;
}

td.tdNewItem
{
	height:30px;
	border-bottom:1px solid grey;
	cursor:pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

span.lblNewItem
{
	font-size:14px;
	height:14px;
	top:50%;
	margin-top:-7px;
	left:10px;
	font-weight:bold;
	white-space:nowrap;
	position:absolute;

}

div#divGlassSelectorDialog 
{
	display:none;
}

select.cboGlassSelector
{
	position:absolute;
	left:130px;
	width:200px;
}

select.cboGlassSelector2
{
	position:absolute;
	left:130px;
	width:240px;
}

input.txtGlassSelector
{
	position:absolute;
	left:130px;
	width:200px;
}

input.txtGlassSelector2
{
	position:absolute;
	left:130px;
	width:200px;
}

span.spnGlassSelector
{
	position:absolute;
	left:10px;
	font-size:12px;
	font-weight:bold;
}

input.txtPaneGlassSelector
{
	position:absolute;
	left:70px;
	width:150px;
}

select.txtPaneGlassSelector
{
	position:absolute;
	left:70px;
	width:155px;
}

input.txtThkGlassSelector
{
	position:absolute;
	left:280px;
	width:40px;
}

select.cboThkGlassSelector
{
	position:absolute;
	left:270px;
	width:99px;
}

div#dlgHardwareSelector
{
	display:none;
}

div#lstHardwareSelector
{
	position:absolute;
	top:10px;
	left:10px;
	width:620px;
	height:500px;
}

td.tdHardwareSelectorItem 
{
	position:relative;
	border:1px solid black;
	width:150px;
	height:175px;
}

img.imgHardwareSelectorItem {
	position:absolute;
	border:1px solid black;
	width:130px;
	height:100px;
	top:5px;
	left:10px;
}

span.lblHardwareSelectorItem {
	position:absolute;
	left:0px;
	width:100%;
	text-align:center;
	top:110px;
}

input.chkHardwareSelectorItem {
	position:absolute;
	left:50%;
	margin-left:-5px;
	top:100%;
	margin-top:-15px;
}

td.tdGENHTMLLabel {
	padding-right:5px;height:24px;font-size:12px;font-weight:bold;vertical-align:middle;padding-top:2px;white-space:nowrap;
}

td.tdGENHTMLValue {
	width:100%;height:24px;font-size:12px;font-weight:bold;vertical-align:middle;padding-right:5px;white-space:nowrap;
}

select.cboGENHTML {
	width:100%;
}

input.txtGENHTML {
	width:100%;
}

input#btnSetDealerDefaults {
	position:absolute;
	height:25px;
	top:100%;
	margin-top:-35px;
	left:10px;
	width:150px;
}

input#btnSetCustomerDefaults {
	position:absolute;
	height:25px;
	top:100%;
	margin-top:-35px;
	left:100%;
	margin-left:-160px;
	width:150px;
}

div#dlgConfirmSave { display : none; }

select#cboGoTo { width : 80%; display:none; }

div#lstGoTo {
	position:absolute;
	top:20px;
	left:360px;
	width:270px;
	height:270px;
}

span#spnGoTo {
	position:absolute;
	top:23px;
	left:310px;
}

td.tdGoTo {
	height:24px;
	font-size:12px;
	vertical-align: middle;
	padding-left:5px;
	border-bottom:1px solid grey;
	cursor:pointer;
}

div#divEstimateDetailSummary {
	position:absolute;
	top:20px;
	left:10px;
	width:270px;
	height:270px;
}

div#dlgChangePassword { display: none; }

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
   .modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 0, 0, 0, .8 ) 
                url('/gui/images/ajax-loader.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading .modal {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}


/*2022-02-15*/


header {
	position:fixed;
	top:0px;
	left:0px;
	background-color: rgb(252, 252, 252);
	border-bottom:2px solid gray;
	height:40px;
	width:100%;
	display:flex;
	flex-direction:row;
	z-index:1000;
}

div#divHeaderLabels {
	margin-top:4px;
	margin-left:15px;
	font-weight:bold;
	display:flex;
	flex-direction:column;
	font-size:14px;
}

button#btnHeaderMenu {
	display:none;
	margin-left:10px;
	margin-top:4px;
	width:28px;
	height:28px;
	font-weight:bold;
	font-size:24px;
	background-color:transparent;
	padding:0px;
}

nav {
	display:block;
	position:fixed;
	top:0px;
	height:100%;
	margin-top:42px;
	left:0px;
	width:200px;
	background-color: white;
	border-right:2px solid gray;
	overflow:auto;
	z-index:1000;
}

nav.hidden {
	display:none;
}

main {
	top:0px;
	left:0px;
	margin-top:50px;
	margin-left:202px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}


@media only screen and (min-width: 720px) {
	nav.hidden {
		display:block;
	}
}

@media only screen and (max-width: 720px) {

	main {
		margin-left:0px;
	}

	button#btnHeaderMenu {
		display:block;
	}
}

@media only screen and (max-width: 415px) {


}

@media only screen and (max-width: 375px) {


}

nav#navnav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 200px;
	background-color: #f1f1f1;
	cursor:pointer;
  }
  
nav#navnav  li a {
	display: block;
	color: #000;
	padding: 8px 16px;
	text-decoration: none;
  }
  
nav#navnav li a.active {
	background-color: #04AA6D;
	color: white;
	background-color: #f2de44;
	background-color: #f28744;
	color:black;
  }
  
nav#navnav li a:hover:not(.active) {
	background-color: #555;
	color: white;
}

nav#navnav li.liNav_indent { padding-left:20px; }

/* 2024-05-23 Change selection size */
.select2-selection__rendered {
	font-weight: normal !important;
	color: inherit !important;	
	line-height: 17px !important;
	padding-left: 5px !important;
	font-size: 12px !important;
}
.select2-selection--multiple {
	height: 30px !important;
	min-height: auto !important;
}
.select2-container .select2-selection--single {
	height: 19px !important;
}
.select2-selection__arrow {
	height: 18px !important;
}
.select2-container--default .select2-selection--single {
	border-radius: inherit !important;
}

/* JQuery - Autocomplete */
.ui-helper-hidden-accessible { display:none; }
.ui-autocomplete 
{
	max-width: 300px;
  max-height: 200px;
  overflow: auto;
}

/* JQuery - tooltip */
.ui-tooltip {
	font-size: 16px;
	padding: 5px;
	border: 1px;
	white-space: pre-line;
}

.sticky-header table {
  text-align: left;
  position: relative;
  border-collapse: collapse; 
}

.sticky-header th {
  position: sticky;
  top: 0;
	border-bottom: 1px solid grey;
	background-color: #eee;
	white-space: nowrap;
}

/************************************
	TineMCE
************************************/
/* Hide "UPDATE" Button */
.tox-promotion {
	display: none;
}


input[data-no-arrow] {
	-moz-appearance: textfield;
}

input[data-no-arrow]::-webkit-outer-spin-button,
input[data-no-arrow]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}