/*** GENERAL SETTINGS ***/
html,body
{
margin:0;
padding:0;
height:100%;
background:none repeat scroll 0% 0% rgb(233, 238, 240);
font-family: 'Open Sans', sans-serif;
font-size: 100%;
}

hr{
height: 1px;
border-width: 0;
color: #bfbfbf;
background-color: #b9b9b9;
}
/* main div around everything*/
#wrapper { 
background-color:#ececec;
margin:0px; min-height: 100%; height: auto; position: relative; 
} 
body{ font-size:14px; color:black; font-weight:300; }

/* the blink_me and keyframes makes a span/div blink*/
.blink_me {
animation: blinker 2s linear infinite;
}
@keyframes blinker {  
50% { opacity: 0; }
}
/**************************/
.voting-button{
background-color: #E5EBEE;
border: none;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
margin: 4px 2px;
cursor: pointer;
border-radius: 16px;
}
.voting-novote{color: #474747;}
.voting-voted{color:red;}

a.imgglow { box-shadow: 1px 1px 3px red; }
.icon_glow { box-shadow: 0px 0px 4px red; }

.bg_yellow{ background:Yellow;}
.bg_red{ background-color:Red;}
.bg_mild_red{background-color:#e8596b;}
.bg_green{ background-color:Green;}
.bg_lightgrey{ background-color:#CDCDCD;}
.bg_orange{ background-color:#e67817;}
.bg_peach{ background-color:#fce19d;}
.bg_pink{ background-color:#fc9de0;}
.bg_lightblue{ background-color:#c1dbfa;}
.bg_blue{ background-color:#3D3DF2;}
.bg_white{ background-color:#FFF;}
.bg_whitesmoke{ background-color:Whitesmoke;}
.bg_none{ background:none;}

/* ID for table containing the login info */
div.uitooltip{max-width:800px;}

.pdm_callback{font-weight:bold; background-color:#fbac66; width:500px;}
#mysaved_container{ 
width:600px;
position:relative;
}
.mysaved_items{
width:280px;
margin-bottom:12px;
display: block;
position: absolute;
}

#reg_sms_alert{
/*
TKS 281480 moved sms alert to icon in header
 z-index:50; 
 width:100%; 
 height:0px; 
 background-color:Yellow; 
 color:#000; 
 font-weight:bold;
 text-align:center; 
 position:relative; 
 top:-30px;
*/
}

@media print {
	.printhide {display:none;}
	/*force a page break when printing*/
	.br-after {	break-after: page; }
}
@media screen{ .printonly { display:block; } }

/*font info*/
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans Light'), local('OpenSans-Light'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/DXI1ORHCpsQm3Vp6mXoaTRa1RVmPjeKy21_GQJaLlJI.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 300;
src: local('Open Sans Light Italic'), local('OpenSansLight-Italic'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/PRmiXeptR36kaC0GEAetxrsuoFAk0leveMLeqYtnfAY.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/u-WUoqrET9fUeobQW7jkRT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 400;
src: local('Open Sans Italic'), local('OpenSans-Italic'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/xjAJXh38I15wypJXxuGMBtIh4imgI8P11RFo6YPCPC0.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/MTP_ySUJH_bn48VBG8sNSha1RVmPjeKy21_GQJaLlJI.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 600;
src: local('Open Sans Semibold Italic'), local('OpenSans-SemiboldItalic'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/PRmiXeptR36kaC0GEAetxmWeb5PoA5ztb49yLyUzH1A.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/k3k702ZOKiLJc3WVjuplzBa1RVmPjeKy21_GQJaLlJI.woff) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: 700;
src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url(https://themes.googleusercontent.com/static/fonts/opensans/v6/PRmiXeptR36kaC0GEAetxoUt79146ZFaIJxILcpzmhI.woff) format('woff');
}
/*end fonts*/

/* Add New Unit class.  I wanted some padding in the rows to seperate out things some.  One full row in between was too mush therefore the need for row padding. Eric*/
.addunit { padding-bottom:10px; }

/*classes for colored rounded borders on tables and around datacells*/
.borderall-blue { padding:5px; border:solid thin #79B7E7; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-darkblue, .borderall-jobs { padding:5px; border:solid thin #336699; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-yellow { padding:5px; border:solid thin #f1e705; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-red { padding:5px; border:solid thin red; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-grey { padding:5px; border:solid thin #CCC; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-green, .borderall-parts { padding:5px; border:solid thin #4f8d46; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall-orange { padding:5px; border:solid thin #E29E0B; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall2 { background-color:#EAEAEA; padding:5px; border:solid thin #DBE3E8; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderallbox{ background-color: #E9F2FC; border: 1px solid #CCC; } 

.lbl { font-size:11px; color:maroon; }
.lblwhite { font-size:11px; color:white; font-weight:600; }
.page_tbl a { text-decoration:none; font-size:0.8em; }
.submit { margin-top:10px; margin-left:500px; }

/*
this is for the smaller forms that don't need to be 800px wide
*/
.smallform_tbl { width:400px; padding:4px; }
.smallform_tbl a { text-decoration:none; font-size:0.8em; color: #0066CC; }
.emailsel_frm { background-color: #A5E1E1; }
.frm_border { border:solid thin #000; padding:10px; }

#medium { font-size:93%; font-weight: bold; }
#medium a { text-decoration:none; }
#medium a div { display:block; padding-top:5px; color:black; background:url("../1/images/medium_btn_off.gif") no-repeat; height:23px; width:125px; }
#medium a:hover div { display:block; padding-top:5px; color:#FFF; background:url("../1/images/medium_btn_on.gif") no-repeat; height:23px; width:125px; }

/*
Links in the note color change window
*/
a.colorchange{ color: #000000; font-size:0.8em; text-decoration:none; }
a:hover.colorchange { color: #FFFFFF; font-size:0.8em; text-decoration:none; }

/*
in Firefox it adds a 1 px dotted border to divs when you click 
and add focus to them, the line below removes this behavior
*/
:active, :focus { outline-style: none; -moz-outline-style:none; }

/*this is our required field style for the labels*/
.required_lbl { font-size: 11px; color: Maroon; }

.button { cursor: pointer; display: inline-block; margin-right: 0.1em; overflow: visible; padding: 0; position: relative; text-align: center; text-decoration: none; font-size:10px; font-weight: bold; border-radius: 5px 5px 5px 5px; background: url("../../jQuery/plugins/jquery-ui/css/redmond/images/ui-bg_glass_75_d0e5f5_1x400.png") repeat-x scroll 50% 50% #DFEFFC; border: 1px solid #79B7E7; color: #1D5987; padding: .4em 1em; }
.button:hover { background: url("../../jQuery/plugins/jquery-ui/css/redmond/images/ui-bg_glass_75_d0e5f5_1x400.png") repeat-x scroll 50% 50% #DFEFFC; border: 1px solid #e67817; color: #1D5987; font-weight: bold; padding: .4em 1em; }
/***********************************************************************************/
/***************** login.php **********************************/

/* overall div container of login code */
.box { border-right: #DCDCDC solid; border-top: #DCDCDC solid; border-left: #DCDCDC solid; border-bottom: #DCDCDC solid; background-color: #AFD7D6; text-align: center; width:450px; margin-top:50px; }

/* div containing 'System Login:' */
.boxheading { font-size: 1em;	color: #ffffff; background-color: #336666; border-right: #336666 thin solid; border-top: #336666 10px solid; border-left: #336666 thin solid; border-bottom: #336666 thin solid; height: 20px; position: static; top: 2px; vertical-align: middle; padding-top: 0px; text-align: center; }

span .data a { font-size: 1em; }
/*****************************/

.txt_currency { font-size:13px; color:black; font-weight:300; background: Whitesmoke; text-align: right; }

.txt_edit { font-size:13px; color:black; font-weight:300; background: whitesmoke; }

.txt_view { font-size: 0.8em; color: Black; background: whitesmoke; border:0; }

.status_thought_bubble { background-image: url("../1/images/status-thought-bubble.png"); background-repeat: no-repeat; width:700px; height:58px; padding-left:10px; padding-top:8px; }
/******************************/
/*class for our errors we display*/
/*
/*TKS 6-24-10 style for training video*/
.lblerror{ position:absolute; background-image: url('../1/images/video_bg.png'); background-repeat:repeat; left: 0px; top: 0px; margin-top:0px; color:#FFF; z-index: 2000; overflow:auto; }

.lblerror_tbl{ 
background-color:#FFF; 
margin-top:5%; 
z-index: 2010; 
color:#000; 
padding-bottom:15px; 
border: solid #CEDAE6; 
}
/*class for our errors we display*/
.errortxt{ }
.lblsuccess { 
margin:1em; 
-moz-border-radius: 10px; 
-webkit-border-radius: 20px; 
border-radius: 10px; 
min-height:25px; 
position:absolute; 
left:350px; 
z-index:2000; 
background: #DFFDE5; 
background-position: left top; 
background-image: url("../1/images/bg_confirm.gif"); 
background-repeat: no-repeat; 
color: green; 
font-weight:bold; 
font-size: 11px; 
padding-top: 10px; 
padding-bottom: 10px; 
padding-left: 40px; 
border: 1px solid green; 
width:400px; 
}


.instructions { font-size: 0.8em; padding:5px; }

.heading { font-size: 0.9em; font-weight: bold; color: Black; border:0px; padding: 0px 0px 0px 0px; margin: 3px 3px 3px 3px; height: 20px; }

.menu_login { font-size: 0.8em; font-weight: normal; color:#FFFFFF; background-color:#003399; }
.menu_login a:link { color: #FFFFFF; text-decoration:none; }
.menu_login a:visited { color: #FFFFFF; text-decoration:none; }
.menu_login a:hover { color: yellow; text-decoration:none; }
.menu_login a:active { color: #FFFFFF; text-decoration:none; }
#mnu_login { padding-top:5px; padding-right:10px; }

.wc_box { width:800px; }
.wc_table { width:796px; border: #000 thin solid; margin-left:2px; margin-right:2px; padding-bottom:10px; }

.addnote_link { position:absolute; top:0px; left:25px; }
.ui-button .ui-icon.addnote_link { background-image: url("../1/images/note-pencil.png"); width: 16px; height: 16px; }

.notelegend_link { position:absolute; top:0px; left:160px; }
.ui-button .ui-icon.notelegend_link { background-image: url("../1/images/note_legend.png"); width: 16px; height: 16px; }

.ticket_internal_link { position:absolute; top:0px; left:300px; }
.ui-button .ui-icon.ticket_internal_link { background-image: url("../1/images/note_arrow.png"); width: 16px; height: 16px; }

.multitest_link { position:absolute; top:0px; left:500px; }
.ui-button .ui-icon.multitest_link { background-image: url("../1/images/flask-plus.png"); width: 16px; height: 16px; }

.ticket_calls_link { position:absolute; top:0px; left:660px; }
.ui-button .ui-icon.ticket_calls_link { background-image: url("../1/images/phone_icon.png"); width: 16px; height: 16px; }
/*****************************************************/
/*****************************************************/
/*completed personal note to do list*/
.ListItemComplete{
color:#666;
text-decoration: line-through;
}
/* drag handle for to do list*/
.todo_sort, .unitprep_sort{
list-style-type: none;
}
label.todo, label.unitprep{
cursor:move;
}

/* Personal Note Tags*/
.tag_holder{
font-size: 12px;
margin-left: 14px;
overflow: auto;
width:800px;
}
.tag_single{
height:20px;
width:auto;
display:inline-block;
padding:5px;
}
.tag_row_locate:hover{
cursor:pointer;
}
/**************************** NOTES *************************/
#notes {	position:relative; padding-top: 50px;	height: auto; }
		


/*this handles our child Customer Input (answer notes)*/
.noteCI { margin-left:30px; padding-top:10px; padding-bottom:10px; background-color:#c9d5e7; }

/*this handles all other update notes and other notes. They are set as master notes*/
.other 		{ padding-top: 10px; padding-bottom: 10px; background-color: #FFFF99;}

/*these handle the positioning and spacing of the date, names and note types for each note */
u.date 		{ margin-left: 50px; padding-left: 10px; padding-right: 10px;}
u.addedby 	{ padding-left: 20px; padding-right: 20px;}
/*
###################### GRIDS
*/
.assignedlist_icons { background-color:#e7eaeb; }

/*grid table class*/
.grid { border: thin solid #bed6f6; border-spacing: 0px; }
/*For grids inside of grids*/
.grid .grid { border-style: groove; border-spacing: 0px; }
.gridTitle td { font-size: 0.9em; font-weight: bold; color: Black; border-style:1px groove; padding: 0; margin: 3px 3px 3px 3px; height: 20px; }
/*grid within a grid header*/
.grid .grid .gridHeader_blue { background-color:#003399; color:#FFFFFF; font-size:0.9em; }
.gridHeader_blue { background-color:#003399; color:#FFFFFF; font-size:0.9em; }
.gridHeaderBlue td{ font-size: 0.8em; font-style: italic; font-weight: bold; color: #324560; border: Solid 1px #79B7E7; background-size: contain; background-image: url('../../jQuery/plugins/jquery-ui/css/redmond/images/ui-bg_glass_75_d0e5f5_1x400.png'); background-position: top; background-repeat: repeat-x; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 25px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
.gridHeaderDarkBlue td{ font-size: 0.8em; font-style: italic; font-weight: bold; color: #000; border: Solid 1px #336699; background-size: contain; background-image: url('../1/images/gridHeaderBG_DarkBlue.gif'); background-position: top; background-repeat: repeat-x; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 25px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; } 
.gridHeaderOrange td{ font-size: 0.8em; font-style: italic; font-weight: bold; color: #324560; border: Solid 1px #e29e0b; background-size: contain; background-image: url('../1/images/gridHeaderBG_Orange.gif'); background-position: top; background-repeat: repeat-x; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 25px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
.gridHeaderGreen td{ font-size: 0.8em; font-style: italic; font-weight: bold; color: #324560; border: Solid 1px #4f8d46; background-size: contain; background-image: url('../1/images/gridHeaderBG_Green.gif'); background-position: top; background-repeat: repeat-x; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 25px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
.gridHeaderYellow td{ font-size: 0.8em; font-style: italic; font-weight: bold; color: #324560; border: Solid 1px #f1e705; background-size: contain; background-image: url('../1/images/gridHeaderBG_Yellow.gif'); background-position: top; background-repeat: repeat-x; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 25px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
.gridHeader td a { color:#004181; font-size: 1em; }
.gridHeader td a:hover { color:#FFFFFF; } 
.grid .grid .gridHeader td a, .grid th a { color:Yellow; }
.grid .grid .gridHeader td a:hover, .grid th a:hover { color:#004181; }

.ViewInvoiceHeader { 
color: #000; 
border: Solid 1px #eee; 
background-color:#fafafa;
/*
background-size: contain; 
background-image: url('../1/images/gridHeaderBG_Grey.gif'); 
background-position: top; background-repeat: repeat-x; 
*/
padding: 5px 5px 5px 5px; 
margin: 3px 3px 3px 3px; 
border-spacing: 0px; 
white-space:nowrap; 
}
.WholesaleInvoiceHeader { color: #324560; border: Solid 1px #666; background-size: contain; background-color:#f7f77f; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
/**********************************************/
/*8-2-10 TKS #1450 added for unit on deal turn row red*/ 
table td span span table td table .onDeal, 
table td span span table td table .onDeal { background-color:red; }
.fixed_table{}/* just so we have a class we can target inside elements*/

.fixed_table>thead, .fixed_table>tbody, .fixed_table>tr, 
.fixed_table>td, .fixed_table>th 
{ display: block; }

.fixed_table>tr {
content: ' ';
display: block;
visibility: hidden;
clear: both;
}

.fixed_table>tr>td { padding: 5px; } 

.fixed_table>thead>th {
height: 80px;
}

.fixed_table>tbody {
height: 650px;
overflow-y: auto;
}

.fixed_table>thead {
/* fallback */
}

.fixed_table>tbody>td, .fixed_table>thead>th {
float: left;
}
/**********************************************/
/*
jss - 4/8/2009 - added these 2 classes cuz the payment grid in the payment form uses tables inside of tables,
and the traditional GridItem and GridAltItem classes were putting borders around every cell, making it look stupid.
*/
.PaymentFormGridItem td, .PaymentFormGridAltItem td { color: Black; padding: 3px 3px 3px 3px; margin: 3px 3px 3px 3px; height: 20px; }
.PaymentFormGridItem, .PaymentFormGridItem { background-color: #DCDCDC; }
.PaymentFormGridAltItem, .PaymentFormGridAltItem { background-color: #BEDEFD; }


/*TKS invoice type buttons */
.invoicetypes_container{ width: 700px; }
.invoicetype_btn{ width:200px; display:inline; float:left; text-align:center; padding-bottom:15px; }
.viewcontact_btn{ width:90px; display:inline; float:left; text-align:center; }
/**************************/

/*Invoice grids table class*/
.Invoicegrid { border: 1px solid #336699; border-spacing: 0px; background-color:#cedae6; }

/*
on internal invoice when setting a rental to unavailable, the control loads in this popup
*/
.rental_internal_popup { position: absolute; margin-top:20px; z-index: 10; }
.rental_internal_info { background: #DFEDF7; width:400px; border: #666666 solid thin; padding:2px; }
.rental_internal_info td { white-space: normal; }
/**************************************/
/*
our item locate popup layer that gives us additional info
*/
.invoice_locateitem_span { position: absolute; margin-top:20px; z-index:50; }
.invoice_item_info { background: #DFEDF7; width:400px; border: #666666 solid thin; padding:2px; z-index:50; }
.invoice_item_info td { white-space: normal; }
/**************************************/
/*
our f&i protection item popup layer that lets you change labor/parts pricing on an f&i deal
*/
.invoice_fiprotection_span { position: absolute; margin-top:0px; z-index: 10; }
.invoice_fiprotection { background: #DFEDF7; width:200px; border: #666666 solid thin; padding:2px; }
.invoice_fiprotection td { white-space: normal; }
.invoice_fiprotection td .lbl { font-size: 11px; color: Maroon; }
/**************************************/
.deposits_changepaymethod_span { position: absolute; margin-top:0px; z-index: 10; }
.deposits_changepaymethod { background: #DFEDF7; width:200px; border: #666666 solid thin; padding:2px; }
.deposits_changepaymethod td { white-space: normal; }
.deposits_changepaymethod td .lbl { font-size: 1em; color: Maroon; }
/*
our f&i doc fees item popup layer that lets you change doc & official fees on an f&i deal
*/
.invoice_fidoc_span { position: absolute; margin-top:0px; z-index: 10; }
.invoice_fidoc { background: #DFEDF7; width:300px; border: #666666 solid thin; padding:2px; }
.invoice_fidoc td { white-space: normal; }
.invoice_fidoc td .lbl { font-size: 11px; color: Maroon; }
/*
our f&i deferred down payment popup layer that lets you change payment schedule on an f&i deal
*/
.invoice_fidfrd_span { position: absolute; margin-top:-300px; z-index: 10; }
.invoice_fidfrd { background: #DFEDF7; width:300px; border: #666666 solid thin; padding:2px; }
.invoice_fidfrd td { white-space: normal; }
.invoice_fidfrd td .lbl { font-size: 11px; color: Maroon; }
/*
model locate popup
*/
.unit_model_popup { position: absolute; margin-top:20px; z-index: 10; }
.invoice_unitmodel { background: #DFEDF7; width:300px; border: #666666 solid thin; padding:2px; }

.invoice_unitmodel td { white-space: normal; }

/*popup span on paymnet screen for credit card info*/
.invoice_paymentcard_span { position: absolute; margin-top:20px; z-index: 10; }

.invoice_paymentcard { background: #DFEDF7; width:400px; border: #666666 solid thin; padding:2px; }

.invoice_paymentcard td { white-space: normal; }

/*
TKS 4-26-10 working on unit history and loading the view invoice inside
of a grid. As usual it is adding borders on everything so I am creating the work around here
*/
.grid .GridItem span table td #reg_invoice table td,
.grid .GridAltItem span table td #reg_invoice table td { border:none; }

/*
our item/unit locate popup layer on PO screen 
*/
.po_locateitem_unit_span { position: absolute; margin-top:20px; z-index: 10; }

.po_item_unit { background: #DFEDF7; width:500px; border: #666666 solid thin; padding:2px; }

.po_item_unit td { white-space: normal; }

/*PO item history popup*/
.po_item_history_span { position: absolute; margin-top:5px; z-index: 10; }

.po_item_history { background: #DFEDF7; width:800px; border: #666666 solid thin; padding:2px; }
/************************/

/*This is to highlight a row for a pulled shipping item*/
.PulledRow { background:#FFFFFF; }
/*###########################################################*/

.GridItemB td, .GridAltItemB td { color: Black; }

/* 
Handles the BG color of field elements in a
alt row coloring grid (in view mode)
*/
.GridItemB { background-color: #FFFFFF; }

.GridAltItemB { background-color: #e0e4f3; }

.GridItemB input[type=text]:focus { background:#a7c8903d; }

.GridAltItemB input[type=text]:focus { background: #a7c8903d; }

/*###########################################################*/
.btn_NotesView { visibility: visible; color:black;	font-weight:bold; }
.btn_NotesHide { visibility: hidden; }
/*###########################################################*/
/*###########################################################*/
/*###########################################################*/


.mnu_head { color:white;	font-size:0.8em; background: url( "../1/images/gradient_blue.gif") repeat-x;
}


.zipcode { width: 450px; background:white; z-index:10; }

.zipcode_locate { display:none; position: absolute; width:300px; min-height:25px; z-index: 10; height:240px; }
/* TKS 8-12-11 zipcode control. I made a separate rounded box class for a temp resolve
as the 2em margin was making the popup too low. Later I just need to remove
these other rounded corner clases and just use one without margins and if I need
to add margins to specific controls add them separately*/
.RoundedBox_ZipCode { padding: 10px; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; border: thin solid #CCC; min-height:25px; background: #d8dde0; background:url("../1/images/adv_dash_bg.jpg"); }
/*###########################################################*/
/*###########################################################*/
/*###########################################################*/
/*Gantt*/
/*
over all table that contains the gantt
*/
.gantt_table { border: #666666 thin solid; background:#E8EDF3; }

/*
the left column that holds the task title
*/
.gantt_left_column { background:#DCDCDC; border-bottom: #666666 thin solid; padding-left:2px; }

/*
This places a bottom border under the row that shows the date across the top
*/
#gantt_top_row td { border-bottom: #666666 thin solid; }

/*
this places a left border to separate each date across the top
as well as formats the cells
*/
#gantt_top_row .gantt_days_top { width:100px; padding-top:2px; border-left: #666666 thin solid; }

.gantt_data_row td { padding-top:8px; padding-bottom:8px; }

/*
our gantt popup layer that gives us additional info
*/
.gantt_info_span { position: absolute; z-index: 10; }

.gantt_info { background: #DFEDF7; width:400px; border: #666666 solid thin; padding:2px; }

.gantt_info td { white-space: normal; }
/*###########################################################*/
/*###########################################################*/
/*Color picker*/
#The_colorPicker{ position:absolute; width:224px; padding-bottom:1px; background-color:#FFF; border:1px solid #317082; }

.sectionheader { height:20px; background: url( "../1/images/gradient_blue.gif") repeat-x; /*background-color:#00CC99;*/ padding-left:4px; color: white; }
.sectionheader a:link { color: #FFFFFF; text-decoration:none; }
.sectionheader a:visited { color: #FFFFFF; text-decoration:none; }
.sectionheader a:hover { color: yellow; text-decoration:none; }

.shippingcontainer { -moz-border-radius: 10px; border-radius: 10px; -moz-box-shadow: 5px 5px 5px #000; -webkit-box-shadow: 5px 5px 5px #000; box-shadow: 5px 5px 5px #000; }

/************************************/
/*links in the bulletin board */
a.bulletin_link { color: Green; font-size: 0.8em; }
a.bulletin_link:hover { color: Red; font-size: 0.8em; }


/*
 for bill of lading form
*/
.lading_tbl { border-top: solid thin #000; border-left: solid thin #000 }
.lading_tbl td { border-bottom: solid thin #000; border-right: solid thin #000 }
.lading_sm { color: #000000; font-size: 0.8em; }
.lading_sm_color { color: RED; font-size: 0.8em; }
.lading_med { color: #000000; font-size: 0.8em; }
.lading_med_color { color: RED; font-size: 0.8em; }
.lading_lg { font-weight: bold; color: #000000; font-size: 0.8em; }
.lading_lg_color { font-weight:bold; color: RED; font-size: 0.8em; }

/*upload styles*/
#f1_upload_process, #f2_upload_process { z-index:100; position:absolute; visibility:hidden; text-align:center; width:300px; margin:0px; padding:0px; background-color:#fff; border:1px solid #ccc; }

.messagealert { margin:1em; padding: 10px; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; border: thin solid #CCC; background-color: #e8596b; color: #FFF; font-size: 1em; font-weight: bold; text-align:center; width:100px; position:fixed; visibility:hidden; cursor:pointer; bottom:0px; left:0px; z-index:550; }
.messagealert a { color: blue; text-decoration: none; font-size: 0.9em; font-style: bold; }
.messagealert a:hover { color: green; text-decoration: none; font-size: 0.9em; font-style: bold; }

/******** Report styles **********/
.ReportName a { font-size: .9em; }
.ReportName { font-size: 0.9em; font-weight:bold; text-align:center; }
/*report for is the next line under the heading telling you the parameters like
this report is for the project TBA for date range etc*/
.ReportFor a { font-size: .9em; }
.ReportFor { font-size: 0.8em; font-weight:normal; text-align:left; }
/*****************************/
/* Style for account checks*/
.newcheck { padding-top:20px; padding-left:25px; padding-right:25px; width:750px; height:250px; background:url("../1/images/checkbg.jpg") no-repeat; }
/*
TKS 6-25-10 added this when loading a check within an alt grid 
it was adding borders throughout
*/
.grid .GridItem td .newcheck td, 
.grid .GridAltItem td .newcheck td { border:none; border-spacing: 0; }
/*
TKS 6-25-10 added this when loading a check within an alt grid 
it was adding borders throughout
*/
.grid .GridItem td .check_details td, 
.grid .GridAltItem td .check_details td { border:none; border-spacing: 0; }

.checksmall { padding-top:10px; padding-left:15px; padding-right:15px; width:500px; height:167px; background:url("../1/images/checkbg_sm.jpg") no-repeat; }

/* Style for deposits*/
.newdeposit { padding-top:20px; padding-left:25px; padding-right:25px; width:750px; height:250px; background:url("../1/images/depositbg.jpg") no-repeat; }
.depositsmall { padding-top:10px; padding-left:15px; padding-right:15px; width:500px; height:167px; background:url("../1/images/depositbg_sm.jpg") no-repeat; }

/*Payroll grids table class*/
.Payrollgrid { border: 1px solid #336699; border-spacing: 0px; background-color:#cedae6; }
.PayrollgridTitle td { background-color: #336699; font-size: 0.9em; font-weight: bold; color: #FFF; border:none; padding: 5px; }
.PayrollgridHeader td { font-size: 0.8em; font-style: italic; font-weight: bold; color: #000; border-bottom: thin solid #000; border-collapse: collapse; padding: 5px 5px 5px 5px; height: 20px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
.PayrollGridItem td { background-color:#cedae6; font-size: 0.8em; color: Black; padding: 5px 5px 5px 5px; height: 20px; }
.SOPayrollGridItem td { background-color: #F0EA35; font-size: 0.8em; color: Black; padding: 5px 5px 5px 5px; height: 20px; }
.PayrollCellBg{ background-color:#336699;}
.PayrollLastItem td { background-color:#cedae6; font-size: 0.8em; font-weight: bold; color: Black; padding: 5px 5px 5px 5px; height: 20px; border-top:thin solid #000; }
.PayrollCellBg a { font-weight:bold; }
.PayrollCellBg a:hover { font-weight:bold; }
.Payroll_reason_mod { position: absolute; margin-top:20px; z-index: 10; }
.Payroll_reason_info { background: #DFEDF7; width:350px; border: #666666 solid thin; padding:2px; }
.Payroll_reason_info td { white-space: normal; }
/*cmk adding a scroll for the payroll employee checkbox list*/
.scroll_payrollchkboxes { height: 200px; width: 200px; padding: 5px; overflow: auto; border: 1px sold #ccc }
/*highlighting for showing the checkbox checked in payroll generation*/
.payroll_chkbox_chk { background: #E2F0FF; background-image: url("../1/images/gridFooter.gif"); background-position: center top; background-repeat: repeat-x; }

/* Classes to change style on time sheet if  on a holiday
you can set different styles here for if just a holiday
or if they worked on that holiday*/
.holiday_worked { font-size: 0.8em; color: Black; }
.holiday_nowork { font-size: 0.8em; color: Black; }

/*
master vendors locate popup layer in contact wizard
*/
.mastervendors_span { position: absolute; margin-top:20px; z-index: 10; }
.mastervendors_info { background: #DFEDF7; width:400px; border: #666666 solid thin; padding:2px; }
.mastervendors_info td { white-space: normal; }
/*style for the row that contains the import contact uploader in the contact wizard*/
.contact_import { background-color: #E9F2FC; }

/*class for 'make primary' links*/
a.make_primary { font-size: 0.6em; }

a:hover.make_primary { font-size: 0.6em; }

.coa_expand{ background-image: url('../1/images/thread-closed-mouseout.png'); background-repeat:no-repeat; width:20px; }
.coa_collapse{ background-image: url('../1/images/thread-open-mouseout.png'); background-repeat:no-repeat; width:20px; }

.expand{ background-image: url('../1/images/expand.gif'); background-repeat:no-repeat; width:20px; height:20px; cursor:pointer; }
.collapse{ background-image: url('../1/images/collapse.gif'); background-repeat:no-repeat; width:20px; height:20px; cursor:pointer; }

/*TKS 4-1-11 fixed font sizes in CRM->view email corresp. when in a grid*/
.crm_read_normal{font-size 0.8em;}

.crm_read_normal a, 
.crm_read_normal a:hover {
color:#666;
}

.EmailListGridSel { background-color:#E2F0FF;}

#video_overlay{ 
position:absolute; 
background-image: url('../1/images/video_bg.png'); 
background-repeat:repeat; 
left 0px; 
top 0px; 
margin-top:0px; 
color:#FFF; 
z-index: 1500; 
overflow:auto; 
}

#overlay2{ 
position:absolute; 
background-image: url('../1/images/video_bg.png'); 
background-repeat:repeat; 
left 0px; 
top 0px; 
margin-top:0px; 
color:#FFF; 
z-index: 1550; 
overflow:auto; 
}

#overlay3{ 
position:absolute; 
background-image: url('../1/images/video_bg.png'); 
background-repeat:repeat; 
left 0px; 
top 0px; 
margin-top:0px; 
color:#FFF; 
z-index: 1560; 
overflow:auto; 
}
#overlay4{ 
position:absolute; 
background-image: url('../1/images/video_bg.png'); 
background-repeat:repeat; 
left 0px; 
top 0px; 
margin-top:0px; 
color:#FFF; 
z-index: 1570; 
overflow:auto; 
}

/*//TKS 09.16.2024 #276063*/
.ui-tooltip {
    z-index: 10000 !important;
	 }

#reg_partsmart{ position:absolute; z-index:499; width:900px; height:640px; }

#partsmart_iframe{ margin-top:50px; margin-right:50px; margin-bottom:50px; width:870px; height:600px; border:none; }

#lizzy_progress{ position:absolute; background-image: url('../1/images/video_bg.png'); background-repeat:repeat; left 0px; top 0px; margin-top:0px; color:#FFF; z-index: 560; overflow:auto; }

#progress_bar { background-image: url('../1/images/loader.gif'); background-repeat:no-repeat; height:19px; width:220px; }

/*the box that contains the video*/
#for_video{ width:800px; background-color:#FFF; margin-top:5%; z-index: 510; margin-left:25%; color:#fff; }

/*close video footer*/
.video_footer{ padding-top:0px; margin-top:0px; z-index: 510; color:#fff; background-color:#FFF; height:28px; width:770px; }

/* TKS 11-1-10 using the video overlay region for loading various controls
this style is for loading a table inside it. Will
setup a bg color and top margin. Width will be handled on a control by control basis
and set in the table*/
.overlay_tbl{ 
background-color:#FFF; 
margin-top:5%; 
z-index: 510; 
color:#000; 
padding-bottom:15px; 
padding:5px; 
border:solid thin #999; 
-moz-border-radius: 10px; 
-webkit-border-radius: 20px; 
border-radius: 10px; 
}

#icon_collapse_left_menu{
font-size: 18px;
}

/* positioning of the master menu text and images */
.master_menu_text 
{ 
color: #FBFCFF;
position:absolute; 
left:10px; 
top:6px; 
font-weight:500;
}
.master_menu_text>i{
margin-right:8px;
}

.menu ul 
{
background-color: whitesmoke;
margin-bottom: 0;
margin-top: 0;
padding-bottom: 5px;
padding-left: 15px;
width: 165px;
}
.menu ul li 
{ 
list-style: outside none none;
padding: 2px; 
}
.menu ul li a { color:#595959; font-size:13px; font-weight:normal; }
.menu ul li a:hover { color:#DD2000; font-size:13px; font-weight:normal; }
/********************************/

/* image style for the thumbnail for the part on view item screen*/
.partimage { border:thin solid #000; }

.partlocate_qtip_width{
max-width: 400px;
min-width: 400px;
}

/*TKS 8-5-10 Inventory. Popup style for bin locate control*/
.locate_bins { position: absolute; margin-top:10px; z-index: 10; }

.locate_bins_info { background: #DFEDF7; width:300px; border: #666666 solid thin; padding:2px; }

.locate_bins_info td { white-space: normal; }


.Payrollgrid .PayrollGridItem .locate_bins_info td a,
.Payrollgrid .PayrollGridItem .locate_bins_info td a:hover { font-size: 1em; }

.Payrollgrid .PayrollGridItem .locate_bins_info td  table .grid .GridItem a,
.Payrollgrid .PayrollGridItem .locate_bins_info td table .grid .GridAltItem a,
.Payrollgrid .PayrollGridItem .locate_bins_info td table .grid .GridItem a:hover,
.Payrollgrid .PayrollGridItem .locate_bins_info td table .grid .GridAltItem a:hover { /*font-size: 1.25em;*/ font-weight:normal; }
.Payrollgrid .PayrollGridItem .locate_bins_info td  table .GridItem td,
.Payrollgrid .PayrollGridItem .locate_bins_info td table .GridAltItem td,
.Payrollgrid .PayrollGridItem .locate_bins_info td table .gridTitle { border: thin solid #bed6f6; border-spacing: 0px; color: Black; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 20px; font-size: 1.6em; font-weight:normal; }

.Payrollgrid .PayrollGridItem .locate_bins_info td table .GridItem td { background-color: #FFFFFF; }

.Payrollgrid .PayrollGridItem .locate_bins_info td table .GridAltItem td { background-color: #e0e4f3; }
.Payrollgrid .PayrollGridItem .locate_bins_info td table .gridFooter { font-size: 1.5em; }
/********************************/
/* TKS 11-17-10 Service incoming */
.rental_scheduled, .scheduling_scheduled { background-color:#DFEDF7; }
.rental_scheduled_inservice{background-color:#e8596b;}
.rental_curr_contact { background-color:#adff91; }

.incoming_no_unit{
box-shadow: 0px 0px 6px #ee1f1f;
}
/*TKS 10.04.2024 #276149*/
.incoming_cust_in{
box-shadow: 0px 0px 6px Green;
}
/**TKS 11.29.2017 #117166 new styles for incoming*/
/*
sch_container is the main grid but we had to 
create a grid within a grid in order to add a div container around the
mechanic header and a div container around all the time slots. This was needed
so that we can set a containment on the resize slots so you can't drag outside of
the time slot section. So by decalring the slots_main_container as a grid
we then build our blocks inside this main div and everything continues to work as expected
*/
.sch_container, .pud_container{
display:flex;
position:relative;
height: 100%;
width: auto;
min-width:100%;
}

.sch_mech_name, .pud_truck_name{
cursor:move;
border-right: #e0e0e0 1px solid;
border-bottom: 1px solid #e0e0e0;
box-sizing: border-box;
-moz-box-flex: 1 1 0%;
flex: 1 1 0%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:row;
text-align:center;
justify-content: center;
height: 50px;
min-width:191px;
max-width:191px;
color:#666;
font-size: 16px;
font-weight:bold;
white-space:nowrap;
padding:3px;
background-color:#FFF;
}
.sch_daily_header{
width:100%;
height:50px;
display:flex;
position:relative;
}
.sch_time_content_container{
display:flex;
width:100%;
/*height:700px;*/
position:relative;
}
#reg_schdaily{
height:100%;
width:100%;
}
#sch_daily_nav_row, #pud_daily_nav_row{
margin-top:10px;
margin-bottom:10px;
display:block; 
width:50%; 
height:auto; 
flex:none;
color: rgba(0,0,0,0.54);
font-size: 20px;
font-weight: 400;
white-space: nowrap;
line-height: 23px;
}

.serv_scheduled{ 
background: #62a9d6;
}
.serv_scheduled_currcontact{ 
background-color:#adff91;
}
.job_scheduled{ 
background-color:#CD5C5C; 
}
.mech_completed{ 
background-color:#918C8C;
color: #FFF;
}
div.mech_completed a:link,
div.mech_completed a:visited
{color:#ffff00;}

.latejob{ 
background-color:#000000;
color: #D5D5D5;
}
div.latejob a:link,
div.latejob a:visited
{color:#ffff00;}

.cal_scheduled{ 
background-color:#FFFF66; 
}
div.cal_scheduled a:link, 
div.serv_scheduled_currcontact a:link,
div.serv_scheduled_currcontact a:visited,
div.cal_scheduled a:visited{ 
color:#125385;
}
div.serv_scheduled a:link, 
div.serv_scheduled a:visited, 
div.job_scheduled a:link,
div.job_scheduled a:visited{
color:#FFF;
}
.sch_daily_cell{
position:relative;
width:178px;
height:47px;
flex-grow:1;
border-bottom: 1px solid #e0e0e0;
}
.sch_daily_cell_extra{
content: " ";
height: 47px;
width: 12px;
position: absolute;
right: -12px;
border-bottom: 1px solid #e0e0e0;
border-right: #e0e0e0 1px solid;
}


#reg_instorepu_schweekly{
height:100%;
width:100%;
top:50px;
position:relative;
}

/*##############################
 Schedule incoming weekly view
###############################*/
/*main div everything loads in*/
#reg_schweekly, #reg_pud_schweekly{
height:100%;
width:105%;
top:50px;
position:relative;
}
.pud_date_locked{ 
background: #FFEFEF;
}

/*nav arrows, today button and month/year display*/
#sch_nav_row{
margin-top:10px;
display:block; 
width:50%; 
height:40px; 
flex:none;
color: rgba(0,0,0,0.54);
font-size: 20px;
font-weight: 400;
white-space: nowrap;
line-height: 23px;
}

.sch_nav_prev{
border: solid rgba(0,0,0,0.54);
border-width: 0 3px 3px 0;
display: inline-block;
padding: 3px;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
cursor:pointer;
margin-left:10px;
width:5px;
height:5px;
}
.sch_nav_next{
border: solid rgba(0,0,0,0.54);
border-width: 0 3px 3px 0;
display: inline-block;
padding: 3px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
cursor:pointer;
margin-left:10px;
margin-right:30px;
width:5px;
height:5px;
}

/*header container. holds blank cell then 
days of the week horizontally*/
#sch_weekly_header{
width:100%;
height:50px;
display:flex;
position:absolute;
top:50px;
left:0px;
z-index:2;
border-bottom: 1px solid #e0e0e0;
}

/*blank cell before days of weeks just above the time column*/
#sch_weekly_blank, .sch_daily_blank{
width:70px;
height: 50px;
background-color:#FFF;
flex: none;
border-right: #e0e0e0 1px solid;
overflow: hidden;
box-sizing: border-box;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:column;
}

/* each cell holding day of the week horizontally*/
.sch_weekly_day{
border-right: #e0e0e0 1px solid;
overflow: hidden;
box-sizing: border-box;
-moz-box-flex: 1 1 0%;
flex: 1 1 0%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:row;
text-align:center;
justify-content: center;
height: 50px;
max-width:13.7%;
color:#666;
font-size: 18px;
font-weight:bold;
}
.sch_weekly_day_noslot{
border-right: #e0e0e0 1px solid;
overflow: hidden;
box-sizing: border-box;
-moz-box-flex: 1 1 0%;
flex: 1 1 0%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:row;
text-align:center;
justify-content: center;
height: 50px;
/*max-width:13.7%;*/
color:#666;
font-size: 18px;
font-weight:bold;
}

/*container block that holds everything below the header
has an overflow-y and set height so you can scroll within
the div
//TKS 07.08.2020 #157680 removed height for scroll as windows completely
screws this up. The content within this div inherits the 700px even though it
goes beyond that height to force a scroll and it prevents the drag reschedule beyond a certain point
*/
#sch_time_content_container{
display:flex;
width:100%;
height:100%;
/*
height:700px;
position:absolute;
top:102px;
*/
left:0px;
top:60px;
}
/*vertical container for all the times displayed on left*/
#sch_time_container{
position:relative;
width:70px;
flex: none;
border-right: #e0e0e0 1px solid;
}
/* each time cell that holds a displayed time*/
.sch_times{
width:70px;
height:47px;
text-align:center;
background-color:#FFF;
border-bottom: 1px solid #e0e0e0;
flex: none;
flex-direction:column;
}

#sch_content_container, .sch_content_container, #pud_content_container, .pud_content_container{
width:100%;
height:100%;
display:flex;
}
/*columns that hold each column with padding so you have
space to click and add more*/
.sch_column_container_weekly{
position: relative;
padding-right: 12px;
box-sizing: border-box;
-moz-box-flex: 1 1 auto;
flex: 1 1 auto;
max-width:33.7%;
}
.sch_column_container_weekly_noslot{
position: relative;
padding-right: 12px;
box-sizing: border-box;
-moz-box-flex: 1 1 auto;
flex: 1 1 0%;
max-width:33.7%;
}
.sch_column_container_daily{
position: relative;
padding-right: 12px;
box-sizing: border-box;
-moz-box-flex: 1 1 auto;
flex: 1 1 auto;
max-width:191px;
}
/*columns that hold our events*/
.sch_column{
position: relative;
height: 100%;
width: 100%;
}

ul.schAllDaySlots{
margin-left: 20px;
padding: 0;
}
/*the scheduling cells below the days of the week
and across from the times*/
.sch_weekly_cell{
position:relative;
width:100%;
height:47px;
flex-grow:1;
border-bottom: 1px solid #e0e0e0;
border-left: #e0e0e0 1px solid;
}
/*our column containers have right margin of 12px to
ensure we have space to click to add when there's a bunch of events
this causes our weekly cells to fall short in reaching the 
the right side with background color and styling so this 
takes a span and absolutely positions it to the right and fills in the gap
giving the appearance that it is one cell with background color, leaving 
the margin we need to prevent events filling up the clickable space*/
.sch_weekly_cell_extra{
content: " ";
height: 47px;
width: 12px;
position: absolute;
right: -12px;
border-bottom: 1px solid #e0e0e0;
}

/*each event has to have the position, height, width and z-index calculated
on the fly. But these are default settings that are consistent for each event*/
.sch_weekly_event{
border-radius: 5px; 
border:1px solid #FFF; 
position:absolute; 
}

/*when you click on an event this is the popup info control*/
.sch_weekly_details{
width:450px; 
height:350px;
background-color:#FFF;
overflow: hidden;
-moz-box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14),0 9px 46px 8px rgba(0,0,0,0.12),0 11px 15px -7px rgba(0,0,0,0.2);
box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14),0 9px 46px 8px rgba(0,0,0,0.12),0 11px 15px -7px rgba(0,0,0,0.2);
-moz-border-radius: 2px;
border-radius: 2px;
}

.sch_weekly_details_top{
padding-left:5px;
width:100%; 
height:80px;
background: #42464a; /* Old browsers */
background: -moz-linear-gradient(top, #42464a 0%, #202224 56%, #0b0c0c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #42464a 0%,#202224 56%,#0b0c0c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #42464a 0%,#202224 56%,#0b0c0c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42464a', endColorstr='#0b0c0c',GradientType=0 ); /* IE6-9 */
color:#FFF;
overflow:hidden;
}

.sch_weekly_details_title{
height:20px;
width:100%;
overflow:hidden;
position:absolute;
left:5px;
top:25px;
}

.sch_weekly_details_actions{
width:100%;
height:36px;
position:absolute;
left:5px;
top:65px;
}

.sch_weekly_details_icon{
border-radius:50%;
background-color:#FFF;
display:inline-block;
width:32px;
height:32px;
-moz-box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12),0 3px 5px -1px rgba(0,0,0,0.2);
box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12),0 3px 5px -1px rgba(0,0,0,0.2);
cursor: pointer;
}
.sch_weekly_details_icon > a, .sch_weekly_details_icon div > a{
width:32px;
height:32px;
display: table-cell;
vertical-align: middle; 
text-align: center;
padding-top:2px;
}

.sch_weekly_details_icon:hover{
background-color:Yellow;
}

.sch_weekly_details_bottom{
padding-left:5px;
background-color:#FFF;
color:#000;
overflow:hidden;
position:relative;
left:5px;
top:25px;
}

/* these next 3 classes are just for coloring 
cells for when you are closed, viewing today
or everything else ( open )*/
.sch_weekly_day_open{
background-color: #FFF;
}
.sch_weekly_day_today{
background-color: #FFFFCC;
}
.sch_weekly_day_closed{
background-color: Whitesmoke;
}

.canmove_weeklyserv_helper{
padding-left:3px;
padding-right:3px;
font-weight:bold; 
color:#000; 
width:120px; 
height:48px;
z-index:100;
background-color:orange;
border:1px solid #000;
border-radius:3px;
}
/*##############################
END of Schedule incoming weekly view
###############################*/
/************ new tooltip ****************/
.uitooltip {
border: 1px solid #F1D031;
color: #555;
padding: 8px;
position: absolute;
z-index: 400;
-webkit-box-shadow: 0 0 5px #aaa;
box-shadow: 0 0 5px #aaa;
}
.qtip-content{
font-size: 12px;
}

/************ old tooltip ****************/
a.tool_tip{ position:relative; z-index:24; color:#003499; text-decoration: none; }
a.tool_tip span{ display: none; } 
a.tool_tip:hover{ z-index:25; color: #003499; background:; text-decoration: none; }

a.tool_tip:hover span.tooltip{ display:block; position:absolute; top:0px; left:0; padding: 15px 0 0 0; min-width:200px; color: #993300; text-align: left; filter: alpha(opacity:80); KHTMLOpacity: 0.90; MozOpacity: 0.90; opacity: 0.90; }
a.tool_tip:hover span.top{ display: block; /*background: url('images/tooltip.gif') no-repeat top;*/ padding-left:8px; padding-right:8px; padding-top:30px; padding-bottom:0 }
a.tool_tip:hover span.middle{ display: block; /*background: url('images/tooltip_filler.gif') bottom;* padding-left:8px; padding-right:8px; padding-top:0; padding-bottom:0 }
a.tool_tip:hover span.bottom{ display: block; color: #548912; /*background: url('images/tooltip.gif') no-repeat bottom;*/ padding-left:8px; padding-right:8px; padding-top:3px; padding-bottom:10px }


/* if you don't want transparent tooltip, you want it solid
use the tool_tip-solid class below*/
a.tool_tip-solid{ position:relative; color:#003499; text-decoration: none; }
a.tool_tip-solid span{ display: none; } a.tool_tip-solid:hover{ z-index:25; color: #003499; background:; text-decoration: none;} a.tool_tip-solid:hover span.tooltip-solid{ display:block; position:absolute; top:0px; left:0; padding: 15px 0 0 0; width:200px; color: #993300; text-align: left; }
a.tool_tip-solid:hover span.top{ display: block; /*background: url('images/tooltip.gif') no-repeat top;*/ padding-left:8px; padding-right:8px; padding-top:30px; padding-bottom:0 }
a.tool_tip-solid:hover span.middle{ display: block; /*background: url('images/tooltip_filler.gif') bottom;*/ padding-left:8px; padding-right:8px; padding-top:0; padding-bottom:0 }
a.tool_tip-solid:hover span.bottom{ display: block; color: #548912; /*background: url('images/tooltip.gif') no-repeat bottom;*/ padding-left:8px; padding-right:8px; padding-top:3px; padding-bottom:10px }
/***************** End Tooltip bubble*************/
/********************************/

.rental_daily_popup, .lost_sale_info{ position: absolute; margin-top:10px; z-index: 600; }

.rental_daily_info, .lost_sale { background: #DFEDF7; width:360px; border: #666666 solid thin; padding:2px; }

.gridHeaderGreen .rental_daily_info td { font-size: 1.1em; font-weight:normal; font-style:normal; }

.rental_daily_info td, .lost_sale td { background: #DFEDF7; white-space: normal; border:none; }

/*on the unit rental daily calendar screen, this is the schedule icon in a div that shows up only
if there is a model available*/
.rental_schedule_daily{ position:absolute; top:0px; left:0px; height:16px; width:16px; background: url( "../1/images/icon_history.png"); background-repeat: no-repeat; cursor:pointer; }

/* TKS 5-27-11 popup class for special order customers on a PO */
.SO_Customers_span { position: absolute; margin-top:0px; z-index: 10; }

.SO_Customers { background: #DFEDF7; width:275px; border: #666666 solid thin; padding:2px; }

.SO_Customers td { white-space: normal; }
/*************************/
/***** TKS 6-9-11 moved adv dash rounded corner box styles to here so teh rest of Lizzy can benefit**********/
div #RoundedBox { margin: 2em; padding: 10px; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; border: thin solid #CCC; min-height:25px; }

/*.RoundedBox_GreyBG { background: #d8dde0; background:url("images/adv_dash_bg.jpg"); }*/

/*
//TKS 10-18-10 #1742 advanced dashboard
*/
.RoundedBox_group_header { height:22px; display:block; font-size: 0.9em; color:#666; font-weight:bold; }

.RoundedBox_group_box { position:relative; display:block; } 

/* ###############
Since there are countless times you need to set a font to bold or a color to black or #666
and other repeated settings, instead of adding these lines in each class I am creating a class
for each that I can call when needed
#################### */
.font-black{color:#000;}
.font-white{color:#FFF;}
.font-light-grey{color:#666;}
.bold, b, strong{ font-weight:bold;}
.font-10{ font-size:10px;}
.font-12{ font-size:12px;}
.font-14{ font-size:14px;}

/* to remove padding */
/*********************/
.margin-bottom-none{margin-bottom:0px;}
.margin-top-none{margin-top:0px;}
.margin-right-none{margin-right:0px;}
.margin-left-none{margin-left:0px;}
.margin-none{margin:0px;}
/* ###############
/**************************************/
/**************************************/
/**************************************/
/**************************************/

/******** Webstore orders ***************/
.orderstatus_pending{ background-color:#ffd700; color:black;}
.orderstatus_approved{ background-color:#b8ff98; color:black;}
.orderstatus_removed{ background-color:#ff6961; color:black;}

.current_billto_shipto { background-color: #E2F0FF; padding:3px; }
.webstore_item { width:780px; position:relative; }

.confirm_bottom { border-top:1px solid #B7B7B7; min-height:100px; padding-bottom:30px; padding-right:20px; width:780px; background-color:#f2f2f2; }


#reg_dialog, #reg_headersalesnotes { width:0px; height:0px; z-index:499;/*//TKS 06.06.2012 changed from 600 so it goes behind overlays*/ position:absolute; }
/*//TKS 06.19.2013 #37066 moved reg_calllog out of the group above so I can increase its z-index to show over video overlay when logging a call*/
#reg_calllog { width:0px; height:0px; position:absolute; }
/*//TKS 09.29.2017 #113269 changed from 550 to 1600 to load over overlay*/
#reg_calllog, #call_dialog { z-index:1600; }

/*//TKS 09.01.2011 added style for open topics to be attached to side of new call log dialog window*/
#reg_calltopics { z-index:401; position:absolute; top:30px; right:-330px; }


/************cv unit finance reports*********************/
a.fill_cell { display:block; height:100%; width:100%; }

#reg_inprocess ul { list-style-type:none;}

/******** TKS 9.5.12 view contact styles ***************/

.bg_peach td a { color: Maroon; text-decoration: none; font-size: 0.8em; }
.bg_peach td a:hover { color: #000000; text-decoration: none; font-size: 0.8em; }
/**************************************/

/****drag and drop file attachments****/
.draganddrop { width: 425px; height: 50px; border: 3px solid #DDD; display:table-cell; -moz-border-radius: 8px; -webkit-border-radius: 8px; background-color: #FEFFEC; vertical-align: middle; }

.draganddrop_lbl { text-align: center; color: #BBB; font-size: 2em; }

.draganddrop_large { 
width: 500px; 
border: 3px solid #DDD; 
display:block;
position:relative;
-moz-border-radius: 8px; 
-webkit-border-radius: 8px; 
background-color: #FEFFEC; 
vertical-align: middle; 
}

.draganddrop_large_lbl {
width:500px;
display:block;
position:fixed;
text-align: center; 
color: #BBB; 
font-size: 24px; 
}
/****drag and drop file attachments****/


/**************************************/

/************less and more arrow buttons*************/
.more_arrow{ width:30px; height:15px; background-image: url("../1/images/more.png"); background-position: 50% 50%; background-repeat: no-repeat; background-color: #FFFFFF; border: 1px solid #A6A6A6; position: relative; cursor:pointer; }
.less_arrow{ width:30px; height:15px; background-image: url("../1/images/less.png"); background-position: 50% 50%; background-repeat: no-repeat; background-color: #FFFFFF; border: 1px solid #A6A6A6; position: relative; cursor:pointer; }
/**************************************/

/**************************************/
/*Expandable/Colapsible Divs*/
.expandheading { margin: 1px; padding: 3px 10px; cursor: pointer; position: relative; }

.expandcontent { padding: 5px 10px; } 

/*
.report_btn_look:hover { border-top-color: #b3b3b3; background: #adadad; color: #ccc; }
.report_btn_look:active { border-top-color: #a3a3a3; background: #a3a3a3; }
*/
.report_btn_look { -moz-box-shadow:inset 0px 0px 6px 0px #ffffff; -webkit-box-shadow:inset 0px 0px 6px 0px #ffffff; box-shadow:inset 0px 0px 6px 0px #ffffff; background-image:-webkit-gradient( linear,0 0, 0 100%, from(#fafafa ), to(#efefef)); background:-moz-linear-gradient( center top, #ededed 5%, #ededed 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ededed'); background-color:#fafafa; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; display:block; color:#777777; font-size:10px; font-weight:bold; text-decoration:none; text-align: center; text-shadow:1px 0px 0px #ffffff; }
.report_btn_look:hover { background: #CCC; color: #777; border:thin solid #777; }
.report_btn_look:active { background: #a3a3a3; }


#btn_Orange{
cursor: pointer; 
display: inline-block; 
margin-right: 0.1em; 
overflow: visible; 
padding: 0; 
position: relative; 
text-align: center; 
text-decoration: none; 
font-size:10px; 
border-radius: 5px 5px 5px 5px; 
font-weight: 300;
border: 1px solid #d3913c; 
color: #000; 
padding: .4em 1em; 
background: #ffc578; /* Old browsers */
background: -moz-linear-gradient(top,  #ffc578 0%, #fb9d23 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffc578 0%,#fb9d23 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffc578 0%,#fb9d23 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc578', endColorstr='#fb9d23',GradientType=0 ); /* IE6-9 */
}


td, th { display: table-cell; vertical-align: inherit; }

.gridHeader td, .grid .grid .gridHeader td { 
font-size: 15; 
font-weight: 300; 
color: white; 
border: Solid 1px #d4d4d4; 
/*bg color is in each template*/
padding: 5px; 
margin: 3px; 
height: 20px; 
border-spacing: 0px; 
white-space:nowrap; 
vertical-align: bottom; 
} 

.GridItem td, .GridAltItem td { border-style:solid; border-width:1px; border-color:#d4d4d4; }
.grid { font-size: 15px; background-color: #f9f9f9; font-weight:300; line-height:1.3; }

/* 
Handles the BG color of field elements in a
alt row coloring grid (in view mode)
*/
.GridItemFields, .GridItemFields { background-color: #FFFFFF; border: thin solid #bed6f6; border-spacing: 0px; }

.GridItem { background-color: #f1f1f1; border-spacing: 0px; }

.GridAltItem { background-color: #fff; border-spacing: 0px; }

.GridItem input[type=text]:focus { background:#a7c8903d; }

.GridAltItem input[type=text]:focus { background: #a7c8903d; }

.grid { font-size: 15px; background-color: #f9f9f9; font-weight:300; line-height:1.3; }

.lbl_black_m { color: #000; }

/********************PAGE LAYOUT*********************/
.page_tbl { width:100%; padding:4px; }

h1 { font-size:14px; }
h2 { font-size:16px; }

/********************BACKGROUND TABLE COLOR*********************/
table.background_Table1 { background-color:#008500; }
table.background_Table1 a { color:#324560; text-decoration:none; font-size:13px;; font-weight:400;}
table.background_Table1 a:hover { color:#CFEEF7; text-decoration:none; font-size:13px;; font-weight:bold;}

.background_Table2 {background-color:#f9f9f9;}
table.background_Table2 a { color:#324560; text-decoration:none; font-size:13px;;}
table.background_Table2 a:hover { color:#000000; text-decoration:none; font-size: 13px;;}

/*** Module Menu ***/
/*//TKS 03.21.2016 #82728 added icons for home button and
alerts as well as new design for alerts to be displayed*/
.alert-module{
margin-left:10px;
padding-right:10px;
display:inline-block;
width:32px;
height:32px;
position:relative;
}
#unread_alert_count{
position:absolute;
top:20px;
left:25px;
border-radius: 2px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
background-color: #FFF;
background-image: linear-gradient(#FFF, #CCC);
color: #000;
padding: 1px 3px;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
background-clip: padding-box;
display: inline-block;
/*font-family: "helvetica neue",helvetica,arial,sans-serif;*/
font-family: 'Open Sans', sans-serif;
font-size: 10px;
line-height: 1.3;
min-height: 13px;
}
.alertpopup {
background: #393935;
border: 2px solid white;
}
.alertpopup { 
z-index:250;
display: none;
position: absolute;
top:35px;
left:50px;
padding: 10px 20px;
color: #FFF;
border-radius: 20px;
margin-top: 20px;
box-shadow: 0 0 7px black;
}
.alertpopup a:link, .alertpopup a:visited{
color:#FFF;
text-decoration:none;
}
.alertpopup a:hover{
color:Yellow;
text-decoration:none;
}

#tabs ul li.no-divider{
background:none;
}

#reg_header { 
margin-top:0; 
height:75px; 
width:100%; 
min-width:1000px; 
font-size:15px; 
color:white; 
font-weight:300; 
}


.borderall { padding:5px; border:solid thin #DBE3E8; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }
.borderall>td { color:#000;}
.light-background{ background-color:#F1F1F1; color:#000;}
.light-background .lbl { font-size:11px; color:maroon; font-weight:300 }
.light-background2{ background-color:#D7D1D1; color:#000;}
.light-background2 .lbl { font-size:11px; color:maroon; font-weight:300 }
.lightgrey-background { background-color:#DCDCDC; color:#000; font-weight:500; }

.background-selected{ background-color:#fce19d; font-size:14px; color:black; font-weight:300; padding:10px; }
.background-selected a:link {text-decoration:none; font-size:12px; color:white; font-weight:300; }
.background-selected a:hover { font-size:12px; color:blue; font-weight:300; }
.background-selected .title { font-size:16px; color:black; font-weight:400; }
.background-selected .infotext { font-size:13px; color:gray; font-weight:300; }
.background-selected .lbl { font-size:11px; color:maroon; font-weight:300; }

/* floor plan alert, warning and expire days to no profit*/
.fp_alert {color:#FFF; background-color:#FF8C00;}
.fp_alert a:link {text-decoration:none; color:#FFF;}
.fp_alert a:visited {text-decoration:none; color:#FFF;}
.fp_alert a:hover {color:yellow;}
.fp_alert td .lbl, .fp_alert .lbl {font-size:11px; color:#FFF; font-weight:300;}

.fp_warning {color:#FFF; background-color:#FD6347;}
.fp_warning a:link {text-decoration:none; color:#FFF;}
.fp_warning a:visited {text-decoration:none; color:#FFF;}
.fp_warning a:hover {color:yellow;}
.fp_warning td .lbl, .fp_warning .lbl {font-size:11px; color:#FFF; font-weight:300;}

.fp_expired {color:#FFF; background-color:#8B0000;}
.fp_expired a:link {text-decoration:none; color:#FFF;}
.fp_expired a:visited {text-decoration:none; color:#FFF;}
.fp_expired a:hover {color:yellow;}
.fp_expired td .lbl, .fp_expired .lbl {font-size:11px; color:#FFF; font-weight:300;}

.latestpart_super { color:black; background-color:#b8ff98;}
.latestpart_super td a {text-decoration:none; color:blue; }
.latestpart_super td a:hover { color:red;  }
.latestpart_super td .title { font-size:16px; color:black; font-weight:400 }
.latestpart_super td .infotext { font-size:13px; color:#006180; font-weight:300 }
.latestpart_super td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolor_rma_expired { color:black; background-color:#e8596b;}
.rowcolor_rma_expired td a {text-decoration:none; color:blue; }
.rowcolor_rma_expired td a:hover {  color:red; }
.rowcolor_rma_expired td .title { font-size:16px; color:black; font-weight:400 }
.rowcolor_rma_expired td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolor_rma_expired td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolorSO, .rowcolorMaintenanceOld { color:black; background-color:#FFFF8F;}
.rowcolorSO td a:link, .rowcolorMaintenanceOld td a:link {text-decoration:none;  color:blue; }
.rowcolorSO td a:visited, .rowcolorMaintenanceOld td a:visited {text-decoration:none;  color:blue; }
.rowcolorSO td a:hover, .rowcolorMaintenanceOld td a:hover { color:green; }
.rowcolorSO td .title, .rowcolorMaintenanceOld td .title { font-size:16px; color:black; font-weight:400 }
.rowcolorSO td .infotext, .rowcolorMaintenanceOld td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolorSO td .lbl, .rowcolorMaintenanceOld td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolor_AlreadyOnOrder { color:black; background-color:#FFFF00;}
.rowcolor_AlreadyOnOrder td a:link {text-decoration:none;  color:blue; }
.rowcolor_AlreadyOnOrder td a:hover { color:green; }
.rowcolor_AlreadyOnOrder td .title { font-size:16px; color:black; font-weight:400 }
.rowcolor_AlreadyOnOrder td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolor_AlreadyOnOrder td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolorobsolete, .rowcolor_inactive { background-color:#708090; color:white;}
.rowcolorobsolete td, .rowcolor_inactive td{ background-color:#708090; color:white;}
.rowcolorobsolete td a:link, .rowcolor_inactive td a:link { color:white; }
.rowcolorobsolete td a:hover, .rowcolor_inactive td a:hover { color: white; }
.rowcolorobsolete td .lbl, .rowcolor_inactive td .lbl { font-size:11px; color:white; font-weight:300 }

.rowcolor_morenotes { background-color:#E2D3EF; color:#000;}
.rowcolor_morenotes td { background-color:#E2D3EF; color:#000;}
.rowcolor_morenotes td a { color:blue; }
.rowcolor_morenotes td a:hover { color: green; }
.rowcolor_morenotes td .lbl { font-size:11px; color:#000; font-weight:300 }

.rowcolor_dropship { background-color:#E2D3EF; color:#000;}
.rowcolor_dropship td { background-color:#E2D3EF; color:#000;}
.rowcolor_dropship td a { color:blue; }
.rowcolor_dropship td a:hover { color: green; }
.rowcolor_dropship td .lbl { font-size:11px; color:#000; font-weight:300 }
.rowcolor_dropshipordered { background-color:#B19CD9; color:#000;}
.rowcolor_dropshipordered td { background-color:#B19CD9; color:#000;}
.rowcolor_dropshipordered td a { color:blue; }
.rowcolor_dropshipordered td a:hover { color: green; }
.rowcolor_dropshipordered td .lbl { font-size:11px; color:#000; font-weight:300 }

.rowcolor_backordered { background-color:#8B232399; color:white;}
.rowcolor_backordered td { background-color:#8B232399; color:white;}
.rowcolor_backordered td a { color:yellow !important; }
.rowcolor_backordered td a:hover { color: yellow !important; }
.rowcolor_backordered td .lbl { font-size:11px; color:white; font-weight:300 }

.rowcolorpriority { background-color:#ffd700; color:black;}
.rowcolorpriority td { background-color:#ffd700; color:black;}
.rowcolorpriority td a:link { color:blue; }
.rowcolorpriority td a:visited { color:blue; }
.rowcolorpriority td a:hover { color: green; }
.rowcolorpriority .title { color:black !important; font-weight:400; font-size:18px;}

/*01.03.2018 rlw -  79402 adding red for Alert customers*/
.rowcoloralert { background-color:#ff8b8b; color:black;}
.rowcoloralert td { background-color:#ff8b8b; color:black;}
.rowcoloralert td a:link { color:yellow; }
.rowcoloralert td a:visited { color:yellow !important; }
.rowcoloralert td a:hover { color: white; }
.rowcoloralert .title { color:black; font-weight:400; font-size:18px;}

/*TKS for urgent ( customer is down )*/
.rowcolor_urgent { background-color:#ff8080; color:#000;}
.rowcolor_urgent td { background-color:#ff8080; color:#000;}
.rowcolor_urgent td a:link { color:yellow; }
.rowcolor_urgent td span.data_red { color:#000; }
.rowcolor_urgent td a:hover { color: green; }
.rowcolor_urgent td .lbl { font-size:11px; color:#000; font-weight:300 }
.rowcolor_urgent td .infotext { font-size:13px; color:#000; font-weight:300 }

.rowcolor_fraud, 
.rowcolor_internal, .rowcolor_preorder { background-color:#ead1ecba; color:#000;}
.rowcolor_fraud>td, 
.rowcolor_internal>td, .rowcolor_preorder td{ background-color:#ead1ecba; color:#000;}
.rowcolor_fraud td a:link, 
.rowcolor_internal>td a:link, .rowcolor_preorder td a:link{ color:#FFF; }
.rowcolor_fraud td span.data_red, 
.rowcolor_internal>td span.data_red, .rowcolor_preorder td span.data_red{ color:#000; }
.rowcolor_fraud td a:hover, 
.rowcolor_internal>td a:hover, .rowcolor_preorder td a:hover{ color:#000; }
.rowcolor_fraud td .lbl, 
.rowcolor_internal>td .lbl, .rowcolor_preorder td .lbl{ font-size:11px; color:#000; font-weight:300 }
.rowcolor_fraud td .infotext, 
.rowcolor_internal>td .infotext, .rowcolor_preorder td .infotext{ font-size:13px; color:#000; font-weight:300 }
.rowcolor_fraud span.title, 
.rowcolor_internal>span.title, .rowcolor_preorder span.title{ color:black; font-weight:400; font-size:18px;}

/*04.16.2015 zb - Ticket 65369 added color to return items*/
.rowcolorReturn { color:black; background-color:#81BEF7;}
.rowcolorReturn td a {text-decoration:none;  color:blue; }
.rowcolorReturn td a:hover {  color:green;  }
.rowcolorReturn td .title { font-size:16px; color:black; font-weight:400 }
.rowcolorReturn td .infotext { font-size:13px; color:green; font-weight:300 }
.rowcolorReturn td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolorsupersede { background-color:#FF7F50; color:black;}
.rowcolorsupersede td { background-color:#FF7F50; color:black; padding:5px;}
.rowcolorsupersede a:link { color:blue; }
.rowcolorsupersede a:visited { color:blue; }
.rowcolorsupersede a:hover { color: red; }
.rowcolorsupersede .title { color:black; font-weight:400; font-size:18px;}

.rowcolorCrossRef { background-color:#9F5F9F; color:black;}
.rowcolorCrossRef td { background-color:#9F5F9F; color:black; padding:5px;}
.rowcolorCrossRef a:link { color:blue; }
.rowcolorCrossRef a:visited { color:blue; }
.rowcolorCrossRef a:hover { color: red; }
.rowcolorCrossRef .title { color:black; font-weight:400; font-size:18px;}

.rowcolorChildItem, tr .rowcolorChildItem>td{ background-color:#FFCC99; color:black;}
.rowcolorChildItem td { padding:5px;}
.rowcolorChildItem a:link { color:blue; }
.rowcolorChildItem a:visited { color:blue; }
.rowcolorChildItem a:hover { color: red; }
.rowcolorChildItem .title { color:black; font-weight:400; font-size:18px;}

.rowcolorshipnextday { background-color:#ffa70091; color:#000;}
.rowcolorshipnextday td { background-color:#ffa70091; color:#000;}
.rowcolorshipnextday a:link { color:black; }
.rowcolorshipnextday a:visited { color:black; }
.rowcolorshipnextday td a:hover { color: blue; }
.rowcolorshipnextday .title { color:#000; font-weight:400; font-size:18px;}

.rowcolorshiptwoday { background-color:#6464fd; color:white;}
.rowcolorshiptwoday td { background-color:#6464fd; color:white;}
.rowcolorshiptwoday a:link { color:yellow; }
.rowcolorshiptwoday a:visited { color:yellow; }
.rowcolorshiptwoday a:hover { color: white; }
.rowcolorshiptwoday .title { color:white; font-weight:400; font-size:18px;}

.rowcolorvehicledown { background-color:#ff889f; color:#000;}
.rowcolorvehicledown td { background-color:#ff889f; color:#000;}
.rowcolorvehicledown td a { color:white; }
.rowcolorvehicledown td a:hover { color: white; }
.rowcolorvehicledown .title { color:#000; font-weight:400; font-size:18px;}

/*TKS 02.12.2013 #29981 rental quote if an item in the list does not support
the rental period you selected*/
.rowcolorRentalPeriodConflict { background-color:orange; color:black;}
.rowcolorRentalPeriodConflict td { background-color:orange; color:black;}
.rowcolorRentalPeriodConflict a:link { color:yellow; }
.rowcolorRentalPeriodConflict a:visited { color:yellow; }
.rowcolorRentalPeriodConflict a:hover { color: blue; }
.rowcolorRentalPeriodConflict .title { color:white; font-weight:400; font-size:18px;}

.rowcolorRentalScheduleConflict { background-color:red; color:white;}
.rowcolorRentalScheduleConflict td { background-color:red; color:white;}
.rowcolorRentalScheduleConflict a:link { color:yellow; }
.rowcolorRentalScheduleConflict a:visited { color:yellow; }
.rowcolorRentalScheduleConflict a:hover { color: blue; }
.rowcolorRentalScheduleConflict .title { color:white; font-weight:400; font-size:18px;}

.rowcolortrendup { background-color:green; color:white;}
.rowcolortrendup td { background-color:green; color:white;}
.rowcolortrendup a:link { color:blue; }
.rowcolortrendup a:visited { color:blue; }
.rowcolortrendup a:hover { color: yellow; }

/*01.02.2018 rlw -  119565 creating a lighter green color */
.rowcolortrendup2 { background-color:green; color:black;}
.rowcolortrendup2 td { background-color:#4ce650; color:black;}
.rowcolortrendup2 a:link { color:blue; }
.rowcolortrendup2 a:visited { color:blue; }
.rowcolortrendup2 a:hover { color: yellow; }

.rowcoloryellow { background-color:yellow; color:black;}
.rowcoloryellow td { background-color:#FFFF00; color:black;}
.rowcoloryellow a:link { color:blue; }
.rowcoloryellow a:visited { color:blue; }
.rowcoloryellow a:hover { color: red; }

.rowcolortrenddown { background-color:yellow; color:black;}
.rowcolortrenddown td { background-color:yellow; color:black;}
.rowcolortrenddown a:link { color:blue; }
.rowcolortrenddown a:visited { color:blue; }
.rowcolortrenddown a:hover { color: green; }

.rowcolorRMAItem { background-color:tan; color:black;}
.rowcolorRMAItem td { background-color:tan; color:black;}
.rowcolorRMAItem a:link { color:blue; }
.rowcolorRMAItem a:visited { color:blue; }
.rowcolorRMAItem a:hover { color: green; }

/*RCH 10.15.2013 changed row color for no category */
.rownocategory { background-color:#7f9fbd; color:white;}
.rownocategory td { background-color:#7f9fbd; color:white;}
.rownocategory a:link { color:blue; }
.rownocategory a:visited { color:blue; }
.rownocategory a:hover { color: yellow; }

/*servicelist colors and crm contact colors*/
/*04.01.2015 zb -added color to reconcile check*/ 
.crm_contact_completed_issues, .servicelist_ready, .so_called_answer, .check_reconcile, .pref_customer { background-color:#b8ff98; color:black;}
.crm_contact_completed_issues td, .servicelist_ready td, .so_called_answer td, .check_reconcile td, .pref_customer td { background-color:#b8ff98; color:black;}
.crm_contact_completed_issues a:link, .servicelist_ready td a:link, .so_called_answer td a:link, .check_reconcile td a:link, .pref_customer td a:link { color:blue; }
.crm_contact_completed_issues a:visited, .servicelist_ready td a:visited, .so_called_answer td a:visited, .check_reconcile td a:visited, .pref_customer td a:visited { color:blue; }
.crm_contact_completed_issues a:hover, .servicelist_ready td a:hover, .so_called_answer td a:hover, .check_reconcile td a:hover, .pref_customer td a:hover { color: green; }
.crm_contact_completed_issues .title, .servicelist_ready .title, .so_called_answer .title, .check_reconcile .title, .pref_customer .title  { color:black !important; font-weight:400; font-size:18px;}


.parts_pulled { background-color:#b3a3ff; color:black;}
.parts_pulled td { background-color:#b3a3ff; color:black;}
.parts_pulled a:link { color:blue; }
.parts_pulled a:visited, .parts_pulled td a { color:blue; }
.parts_pulled a:hover, .parts_pulled td a:hover { color: green; }
.parts_pulled .title { color:black !important; font-weight:400; font-size:18px;}

.unit_in_shop{
width:110px; 
display:inline-block; 
float:right;
}
.unit_in_shop a:link, 
.unit_in_shop a:visited, 
.unit_in_shop a:hover{
font-size:15px;
font-weight:bold;
}

.unitprep_hasdescphoto { background-color:#b8ff98; color:black;}
.unitprep_hasdescphoto td { background-color:#b8ff98; color:black;}
.unitprep_hasdescphoto td a  { color:blue; }
.unitprep_hasdescphoto td a:hover { color: green; }
.unitprep_hasdescphoto .title  { color:black; font-weight:400; font-size:18px;}

/*highlights orders that met supplier minimum for discount*/
.po_met_supplier_min { background-color:#b8ff98; color:black;}
.po_met_supplier_min td { background-color:#b8ff98; color:black;}
.po_met_supplier_min td a { color:blue; }
.po_met_supplier_min td a:hover { color: green; }
.po_met_supplier_min .title { color:black; font-weight:400; font-size:18px;}
.po_notmet_supplier_min { background-color:#ffba98; color:black;}
.po_notmet_supplier_min td { background-color:#ffba98; color:black;}
.po_notmet_supplier_min td a { color:blue; }
.po_notmet_supplier_min td a:hover { color: green; }
.po_notmet_supplier_min .title { color:black; font-weight:400; font-size:18px;}

.crm_contact_rejected_issues, .servicelist_ordered, .so_completed_pickedup { background-color:#e8596b; color:black;}
.crm_contact_rejected_issues td, .servicelist_ordered td, .so_completed_pickedup td { background-color:#e8596b; color:black;}
.crm_contact_rejected_issues a:link, .servicelist_ordered td a, .so_completed_pickedup td a { color:blue; }
.crm_contact_rejected_issues a:visited, .servicelist_ordered td a, .so_completed_pickedup td a { color:blue; }
.crm_contact_rejected_issues a:hover, .servicelist_ordered td a:hover, .so_completed_pickedup td a:hover { color: green; }
.crm_contact_rejected_issues .title, .servicelist_ordered .title, .so_completed_pickedup .title { color:black; font-weight:400; font-size:18px;}

.crm_contact_custupdate { background-color:#fefda1; color:black;}
.crm_contact_custupdate td { background-color:#fefda1; color:black;}
.crm_contact_custupdate a:link { color:blue; }
.crm_contact_custupdate a:visited { color:blue; }
.crm_contact_custupdate a:hover { color: green; }
.crm_contact_custupdate .title { color:black; font-weight:400; font-size:18px;}

.customer_marked_priority { background-color:#ff99cc; color:black;}
.customer_marked_priority td { background-color:#ff99cc; color:black;}
.customer_marked_priority a:link { color:blue; }
.customer_marked_priority a:visited { color:blue; }
.customer_marked_priority a:hover { color: green; }
.customer_marked_priority .title { color:black; font-weight:400; font-size:18px;}

.service_postfollowup { background-color:#FDB956AB; color:black;}
.service_postfollowup td { background-color:#FDB956AB; color:black;}
.service_postfollowup a:link { color:blue; }
.service_postfollowup a:visited { color:blue; }
.service_postfollowup a:hover { color: green; }
.service_postfollowup .title { color:black; font-weight:400; font-size:18px;}

.servicelist_norepair { background-color:#000; color:#FFF;}
.servicelist_norepair td { background-color:#000; color:#FFF;}
.servicelist_norepair a:link { color:Yellow; }
.servicelist_norepair a:hover { color: green; }
.servicelist_norepair .title { color:#FFF; font-weight:400; font-size:18px;}
.servicelist_norepair td .lbl, .servicelist_norepair td .data_cm { color:#FFF;}

.servicelist_needsapproval { background-color:#666; color:#FFF;}
.servicelist_needsapproval td { background-color:#666; color:#FFF;}
.servicelist_needsapproval a:link { color:#C88202; }
.servicelist_needsapproval a:visited { color:#C88202; }
.servicelist_needsapproval a:hover { color:green; }
.servicelist_needsapproval .title { color:#FFF; font-weight:400; font-size:18px;}
.servicelist_needsapproval td .lbl, .servicelist_needsapproval td .data_cm { color:#FFF;}

.servicelist_triagereq { background-color:#4292c2; color:#FFF;}
.servicelist_triagereq td { background-color:#4292c2; color:#FFF;}
.servicelist_triagereq a:link { color:#C88202; }
.servicelist_triagereq a:visited { color:#C88202; }
.servicelist_triagereq a:hover { color:green; }
.servicelist_triagereq .title { color:#FFF; font-weight:400; font-size:18px;}
.servicelist_triagereq td .lbl, .servicelist_triagereq td .data_cm { color:#FFF;}

.servicelist_showestonservlist { background-color:#e67817; color:black;}
.servicelist_showestonservlist td { background-color:#e67817; color:black;}
.servicelist_showestonservlist a:link { color:blue; }
.servicelist_showestonservlist a:visited { color:blue; }
.servicelist_showestonservlist a:hover { color:green; }
.servicelist_showestonservlist .title { color:black; font-weight:400; font-size:18px;}

/*//TKS 08.04.2015 #71406*/
.servicelist_estworkcomplete { background-color:#75ECFD; color:black;}
.servicelist_estworkcomplete td { background-color:#75ECFD; color:black;}
.servicelist_estworkcomplete td a { color:blue; }
.servicelist_estworkcomplete td a:hover { color:green; }
.servicelist_estworkcomplete .title { color:black; font-weight:400; font-size:18px;}

/*//TKS 08.05.2015 #71406*/
.servicelist_estcalled { background-color:#59955C; color:black;}
.servicelist_estcalled td { background-color:#59955C; color:black;}
.servicelist_estcalled td a { color:blue; }
.servicelist_estcalled td a:hover { color:green; }
.servicelist_estcalled .title { color:black; font-weight:400; font-size:18px;}

/*/12.01.2017 jec - Color Change	*/
.SOGridItem, .servicelist_onhold, .so_called_noanswer { background-color:#e699ff; color:black;}
.SOGridItem td, .servicelist_onhold td, .so_called_noanswer td { background-color:#e699ff; color:black;}
.SOGridItem a:link, .servicelist_onhold td a, .so_called_noanswer td a { color:blue; }
.SOGridItem a:visited, .servicelist_onhold td a, .so_called_noanswer td a { color:blue; }
.SOGridItem a:hover, .servicelist_onhold td a:hover, .so_called_noanswer td a:hover { color: green; }
.SOGridItem .title, .servicelist_onhold .title, .so_called_noanswer .title { color:black; font-weight:400; font-size:18px;}

/* 04.10.2013 : CMK : # 33407 : sales tax report rewrite - new backgrounds */
.rowcolortaxprior { color:black; background-color:yellow;}
.rowcolortaxprior td a {text-decoration:none; color:blue; }
.rowcolortaxprior td a:hover { color:red;  }
.rowcolortaxprior td .title { font-size:16px; color:black; font-weight:400 }
.rowcolortaxprior td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolortaxprior td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolortaxrecd { color:black; background-color:#e8596b;}
.rowcolortaxrecd td a {text-decoration:none; color:blue; }
.rowcolortaxrecd td a:hover { color:red;  }
.rowcolortaxrecd td .title { font-size:16px; color:black; font-weight:400 }
.rowcolortaxrecd td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolortaxrecd td .lbl { font-size:11px; color:maroon; font-weight:300 }

.rowcolortaxpaid { color:black; background-color:#c1dbfa;}
.rowcolortaxpaid td a {text-decoration:none; color:blue; }
.rowcolortaxpaid td a:hover { color:red;  }
.rowcolortaxpaid td .title { font-size:16px; color:black; font-weight:400 }
.rowcolortaxpaid td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolortaxpaid td .lbl { font-size:11px; color:maroon; font-weight:300 }


/*on merge ticket screen highlight first ticket they select to show which ticket they are merging into*/
.rowcolorMergeTicket { background-color:green; color:white;}
.rowcolorMergeTicket td { background-color:green; color:white;}
.rowcolorMergeTicket a:link { color:yellow; }
.rowcolorMergeTicket a:visited { color:yellow; }
.rowcolorMergeTicket a:hover { color: blue; }
.rowcolorMergeTicket .title { color:white; font-weight:400; font-size:18px;}
/*******************************************************/
.rowcolorUnitDeliveredOnDeal { background-color:#c1dbfa; color:#000;}
.rowcolorUnitDeliveredOnDeal td { background-color:#c1dbfa; color:#000;}
.rowcolorUnitDeliveredOnDeal a:link { color:blue; }
.rowcolorUnitDeliveredOnDeal a:visited { color:blue; }
.rowcolorUnitDeliveredOnDeal a:hover { color: green; }
.rowcolorUnitDeliveredOnDeal .title { color:#000; font-weight:400; font-size:18px;}
/*//TKS 06.18.2014 #53411 parts look up parts list, if part is already on invoice*/
.rowcolor_pl_oninvoice { background-color:#32CD32; color:white;}
.rowcolor_pl_oninvoice td { background-color:#32CD32; color:white;}
.rowcolor_pl_oninvoice a:link { color:blue; }
.rowcolor_pl_oninvoice a:visited { color:blue; }
.rowcolor_pl_oninvoice a:hover { color: yellow; }
/*//TKS 02.17.2015 #63686 highlight cross reference part if in stock*/
.rowcolorInStockCrossRef { background-color:#b8ff98; color:black;}
.rowcolorInStockCrossRef td { background-color:#b8ff98; color:black;}
.rowcolorInStockCrossRef a:link { color:blue; }
.rowcolorInStockCrossRef a:visited { color:blue; }
.rowcolorInStockCrossRef a:hover { color: green; }
.rowcolorInStockCrossRef .title { color:black; font-weight:400; font-size:18px;}

.rowcolorWarrantyHeader{ 
background: #196bb6; /* Old browsers */
background: -moz-linear-gradient(top,  #196bb6 0%, #4d9fea 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#196bb6), color-stop(100%,#4d9fea)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #196bb6 0%,#4d9fea 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #196bb6 0%,#4d9fea 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #196bb6 0%,#4d9fea 100%); /* IE10+ */
background: linear-gradient(to bottom,  #196bb6u 0%,#4d9fea 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#196bb6', endColorstr='#4d9fea',GradientType=0 ); /* IE6-9 */
} 
/*//08.30.2017 rlw -  ( 86363 ) Change Estimate Header to orange */
.rowcolorEstimateHeader{ 
background-color: #ffa64d; /* Old browsers */
} 
.rowcolorExpenseHeader{ 
background: #6C6D6A; /* Old browsers */
background: -moz-linear-gradient(top,  #6C6D6A 0%, #909090 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6C6D6A), color-stop(100%,#909090)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #6C6D6A 0%,#909090 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #6C6D6A 0%,#909090 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #6C6D6A 0%,#909090 100%); /* IE10+ */
background: linear-gradient(to bottom,  #6C6D6A 0%,#909090 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C6D6A', endColorstr='#909090',GradientType=0 ); /* IE6-9 */
} 
/*** COLORS ***/
.color1 { color:white;}
.color2 { color:green;}
.color3 { color:#67e667;}
.color4 { color:blue;}
.prioritycolor { background-color:#ffd700; font-size: 16px; font-weight:500; color:black;}
.prioritycolor .title { font-size: 16px; font-weight:500; color:black;}
/*//TKS 05.08.2013 got with Noel and discovered that using the > symbol forces the browser to only apply the class to the direct decendent
so below it would only affect the first level tr and td under highlight color.*/
.highlightcolor, tr .highlightcolor>td, 
tr .highlightcolor>td .lbl { background-color:#708090; color:white;}

.rowcolor_resolved, tr .rowcolor_resolved>td,
tr .rowcolor_resolved>td .lbl { background-color:#c1dbfa; color:#000;}
/*TKS 63087 added for obsolete models. probabaly will need to assign this class to obsolete items later
right now they use highlightcolor which can change and they will not be consistent*/
.obsolete, tr .obsolete>td,
tr .obsolete>td .lbl { background-color:#708090; color:white;}

.selectedcolor { background-color:#fce19d; color:black;}
/*** END COLORS ***/
/***************************/
/***************************/
/*** TABLES ***/
.table1 { background-color:#f9f9f9;border-collapse:collapse;line-height:1.3; color:#000; }                                      
/*
.table1 th{ background-color: #626262; background-image: none; color: #cccccc; font-weight: 400; font-size: 14px; padding:5px; border-bottom: 1px solid darkgrey;}
*/
.table1 th{ background-color: #999696; background-image: none; color: #FFF; font-weight: 400; font-size: 14px; padding:5px;}
.table1 th a:link, .table1 .table1 th a:link{color:#FFF; font-weight:bold;}
.table1 th a:hover, .table1 .table1 th a:hover{color:yellow; font-weight:bold;}
.table1 table.rental_quote_fields span.lbl, .table1 table.rental_quote_fields div.lbl{color:#CCC !important;}
.tablefooter1 { font-size: 17px; font-weight: 300; line-height: 30px; color: white !important; background-color: #000; padding: 5px; margin: 3px; height: 20px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }

.table2 { background-color:#f9f9f9;border-collapse:collapse; }                                      
.table2 th { font-size:15px; font-weight:400; background-color:#265E26;color:#fff; padding:5px; height:20px; vertical-align: bottom; }
/*.table2 td { font-size:13; font-weight:300; padding-left:5px;padding-right:5px;border:hidden; }       */ 
.tablefooter2 { font-size: 17px; font-weight: 300; line-height: 30px; color: white; background-color: #008100; padding: 5px; margin: 3px; height: 20px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }

/*TKS same thing as table1 but with borders so grid headers and columns have separators*/
.table3 { background-color:#f9f9f9;line-height:1.3; border-collapse:collapse;}
.table3 td{border: solid 1px #C0C0C0; padding-left:5px; padding-right:5px;}                                      
.table3 th { font-size:15px; font-weight:400; border-spacing:0px; background-color:#626262;color:#ccc; padding:5px; vertical-align: bottom; }
.tablefooter3 { font-size: 17px; font-weight: 300; line-height: 30px; color: white; background-color: #2a8b2a; padding: 5px; margin: 3px; height: 20px; border-spacing: 0px; white-space:nowrap; vertical-align: bottom; }
/*******************************/

.tablenavigator {font-size:17px; font-weight:300; line-height:30px; color:white; background-color:#008100; padding:5px; margin:3px; height:20px; vertical-align: bottom;}                               
.tablepriority {font-size:17px; font-weight:300; line-height:30px; color:white; background-color:#e67817; padding:5px; height:20px; margin:3px; vertical-align:center;}                               
.Header { font-size:15; font-weight:200; color:white; background-color:#265E26; padding:5px; margin:10px; height:30px; vertical-align:center; }

.table-noborders, .table-noborders td{border:none;}
/*** END TABLES ***/

/*TKS cursor nav styles in grid controls*/
.display_box_hover { border: thin solid #FFFF00 !important; color:black !important; background-color:#FFFF00 !important;}
.display_box_hover td a:link {text-decoration:none !important;  color:blue !important; }
.display_box_hover td a:hover { color:green !important; }
.display_box_hover td .title { font-size:16px !important; color:black !important; font-weight:400 !important; }
.display_box_hover td .infotext { font-size:13px !important; color:#006180 !important; font-weight:300 !important; }
.display_box_hover td .lbl { font-size:11px !important; color:maroon !important; font-weight:300 !important; }
.display_box{ }

/*** DEFAULT ICONS ***/
.icon-cancel { background: url('../1/images/Cancel.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-edit { background: url('../1/images/icon_note.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-save { background: url('../1/images/Save.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-trash { background: url('../1/images/trashcan.gif') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-addimage { background: url('../1/images/imageplus.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-add { background: url('../1/images/Add.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-remove { background: url('../1/images/Remove.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-print { background: url('../1/images/printer.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-relationship { background: url('../1/images/icon_exist_rel.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-addchat { background: url('../1/images/adduserchat.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-removechat { background: url('../1/images/removeuserchat.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-allowlogin { background: url('../1/images/key-plus.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-setprimary { background: url('../1/images/M66.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-viewcontact { background: url('../1/images/M28.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-history { background: url('../1/images/history_icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-phone { background: url('../1/images/phone_icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-facetoface { background: url('../1/images/multidev.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-down { background: url('../1/images/bullet_arrow_down.png') no-repeat; width: 18px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-select { background: url('../1/images/view.png') no-repeat; width: 18px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-invoice { background: url('../1/images/GenInv-icon.png') no-repeat; width: 18px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-list { background: url('../1/images/icon_list.png') no-repeat; width: 18px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-email { background: url('../1/images/compose-email.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-favorites-star{ background: url('../1/images/star.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-favorites-star-empty{ background: url('../1/images/star-empty.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-write-check { background: url('../1/images/write-check-icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-unit-access { background: url('../1/images/unit-access-icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-incentives { background: url('../1/images/green-star.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-serviceticket { background: url('../1/images/ServiceInv-icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-dollar { background: url('../1/images/dollar_sign_icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-percent { background: url('../1/images/percent.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-upload { background: url('../1/images/drive-upload.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-eye { background: url('../1/images/eye-icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-hideeye { background: url('../1/images/hideeye.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-copy { background: url('../1/images/document-copy.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-docman { background: url('../1/images/doc-manager.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-usersadd { background: url('../1/images/M76.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-template { background: url('../1/images/template_icon.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }
.icon-rentalinv { background: url('../1/images/M81.png') no-repeat; width: 16px; height: 16px; opacity: 0.9; margin: 0px; padding: 0px; cursor: pointer; border: none; display: inline; }

.icon-cancel:hover, .icon-edit:hover, .icon-trash:hover,
.icon-addimage:hover, .icon-add:hover, .icon-remove:hover,
.icon-print:hover, .icon-relationship:hover, .icon-addchat:hover,
.icon-removechat:hover, .icon-allowlogin:hover, .icon-setprimary:hover,
.icon-history:hover, .icon-phone:hover, .icon-facetoface:hover,
.icon-viewcontact:hover, .icon-select:hover, .icon-invoice:hover,
.icon-list:hover, .icon-email:hover, .icon-favorites-star:hover,
.icon-favorites-star-empty:hover, .icon-write-check:hover, .icon-unit-access:hover,
.icon-incentives:hover, .icon-serviceticket:hover, .icon-dollar:hover,
.icon-percent:hover, .icon-upload:hover, .icon-eye:hover,
.icon-hideeye:hover, .icon-copy:hover, .icon-docman:hover,
.icon-usersadd:hover, .icon-template:hover, .icon-rentalinv:hover{ opacity:0.5; }
/*** END DEFAULT ICONS ***/

/*** LABELS ***/
#reg_dialog .lbl { font-size:11px; color:Maroon;}
.lbl_black { font-size:11px; color:#000000; font-weight:300; }
.lbl_white { /*font-size:9px;*/ color:#FFF;}

.data { font-size: 13px; font-weight:400 }
.data_grey { font-size: 10px; color: #999; }
.data_white { font-size: 10px; color: white; }
.data_red { color: red !important; }
.data_green { font-size: 10px; color: green; }
.lbl_data { font-size: 11px;; color: maroon; }
.data_sm { font-size: 10px; color: #888888; }
.data_m { font-size: 12px; color: Black; }
.data_ml { font-size: 12px; color: #484848; }
.data_mred { font-size: 12px; color: Red; }
.data_mwhite { font-size: 12px; color: White; }
.data_mgreen { font-size: 10px; color: Green; }
.data_l { font-size: 18px; color: Black; }
.data_cm { font-size: 9px; color: maroon; }
.data_cb { font-size: 9px; color: Black; }
.data_cblack { font-size: 12px; color: Black; }

.backgroundtable1_data { font-size: 13px; color:white; }
.backgroundtable1_lbl { font-size: 11px; color: #FFFFE0; }
.backgroundtable2_data { font-size: 13px; color:white; }
.backgroundtable2_lbl { font-size: 11px; color: Maroon; }
/*** END LABELS ***/


/*** DROP LISTS ***/
.droplist1 { width:125px; }
.droplist2 { width:90px; }
/*this is for stylized list with either image or color square*/
/*####################################*/
/*####################################*/
.dropdown dd, 
.dropdown dt, 
.dropdown ul, .dropdown { margin:0px; padding:0px; }
.dropdown dd { position:relative; }               

/* The visible container */    
.dropdown dt a {
background:#ffffff url(../1/images/bullet_arrow_down.png) no-repeat scroll 97.5% center; 
display:block; 
padding-right:20px; 
width:200px; 
border: 2px solid #c9f1c2;
border-radius: 6px 6px 6px 6px;
line-height: 16px;
cursor:pointer; 
display:inline-block; 
padding:0px 5px 0px 5px;
line-height: 18px; 
font-size:12px;
vertical-align: middle; }

/* Text for both (box and options) */
.dropdown a, .dropdown a:visited { 
color:#555555; 
text-decoration:none; 
outline:none;
}
.dropdown li:hover { 
background:#ffff00; 
}        

/* The container for the dropdown options */         
.dropdown dd ul { 
background:#ffffff none repeat scroll 0 0; 
border:1px solid #d3d3d3; 
color:#555555; 
display:none; 
left:0px; 
padding:5px 0px; 
position:absolute; 
top:0px; 
width:200px; 
list-style:none;
z-index:10;
}  

/* The dropdown options */                 
.dropdown dd ul li a { font-size:12px; padding:5px; display:block;}                         
.dropdown span.value { display:none;}  

/* If using images */       
.dropdown img.flag { border:none; vertical-align:middle; margin-left:10px; }
/* If using colors */     
.dropdown .color { 
border: 1px solid silver; 
vertical-align:middle; 
margin-right:5px; 
min-width: 10px;
}
/*####################################*/
/*####################################*/
/*** END DROP LIST ***/

/*** SHAPES ***/
.square { border:solid thin #545454; width:16px; height:16px; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; -khtml-border-radius:2px; display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline; }
.square2 { border:solid thin #b6adad; width:22px; height:22px; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; -khtml-border-radius:2px; display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline; }
.circle { border:solid thin #545454; width:16px; height:16px; border-radius:16px; -moz-border-radius:16px; -webkit-border-radius:16px; -khtml-border-radius:16px; display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline; }
.vert-ellipsis:after{content: '\2807';}
/*** END SHAPES ***/

.both{ clear: both; }
.li_backgroundnone { background:none; } 


.margin-bottom-none{margin-bottom:0px;}
.margin-top-none{margin-top:0px;}
.margin-right-none{margin-right:0px;}
.margin-left-none{margin-left:0px;}
.margin-none{margin:0px;}
.padding-none{padding:0px;}
.bordertop { border-top:solid thin #666; }
.borderright { border-right:solid thin #666; }
.borderbottom { padding-bottom:5px; border-bottom:solid thin #666; }
.borderbottomtop { padding-bottom:5px; border-bottom:solid thin #666; border-top:solid thin #666; }
.borderleft { border-left:solid thin #666; }
.borderbottomleft { padding-bottom:5px; border-bottom:solid thin #666; border-left:solid thin #666; }
.borderbottomright { padding-bottom:5px; border-bottom:solid thin #666; border-right:solid thin #666; }
.bordernone{border:0px;}


.popup_layer { position:absolute; z-index: 250;}
/*//TKS 08.26.2013 added so search or popup can be used within overlay and z index will be higher*/
.popup_layer_overlay { position:absolute; z-index: 570; }

.choosecompany { position:absolute; top:20px; right:10px; z-index: 250; }
.clockout_reason { position:absolute; top:20px; left:10px; z-index: 250; }

SPAN#reg_companyname.choosecompany a,
div#reg_switchuser.choosecompany a,
div#reg_headerloc a,
div#reg_clockout_reason.clockout_reason a { color: Blue; text-decoration: none; font-size: 13px; }

SPAN#reg_companyname.choosecompany a:hover,
div#reg_switchuser.choosecompany a:hover,
div#reg_headerloc a:hover,
div#reg_clockout_reason.clockout_reason a:hover { color: Green; text-decoration: none; font-size: 13px; }

.red_alert {	background: url( "images/red_alert_icon.png"); background-repeat: no-repeat; width:16px; height:16px; border:none; z-index:50; }
.yellow_alert { background: url( "images/yellow_alert_icon.png"); background-repeat: no-repeat; width:16px; height:16px; border:none; z-index:50; }
.no_alert { border:none; background:none; }
/************************************/

/*header1, 2 & 3 are extra divs I added in the template to give more
flexibility to add images and styles*/
#header1 { }
#header2 { }
#header3 { }
#header4 { }

#nizex_logo_div { 
position:absolute; top:6px; left:8px; width:150px; height:80px; 
}
#logo_name { background-repeat: no-repeat; width:45px; position:absolute; top:40px; left:20px; height:30px; }
#logo_name div { position:absolute; bottom:-6px; left:20px; }
.statusbar { color:white;	font-size:0.9em; }
.mysaved { 
top:30px;
z-index:250;
position:absolute;
right:45px; 
background: #F8F8F8; 
border: solid #BDBDBD 1px; 
padding:5px;
color:#666;
max-height:400px;
overflow-y:auto;
-moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px;
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-moz-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
}
.mysaved a:link, a:visited{color:#C88202;}
.mysaved a:hover{color:#FFA603;}


.currcontactinfo { 
top:30px;
z-index:250;
position:absolute;
left:35px; 
background: #F8F8F8; 
border: solid #BDBDBD 1px; 
padding:5px;
color:#666;
max-height:400px;
overflow-y:auto;
-moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px;
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-moz-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
}
.currcontactinfo_arranging { 
height:90vh;
top:30px;
z-index:250;
position:absolute;
left:35px; 
background: #F8F8F8; 
border: solid #BDBDBD 1px; 
padding:5px;
color:#666;
overflow-y:auto;
-moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px;
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-webkit-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
-moz-box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2); 
}
.currcontactinfo a:link, a:visited{color:#C88202; !important}
.currcontactinfo a:hover{color:#FFA603; !important}
.currcontactinfo_arranging a:link, a:visited{color:#C88202; !important}
.currcontactinfo_arranging a:hover{color:#FFA603; !important}

#reg_statusheader { position:absolute; top:90px; left:15px; }

#clockin { position:relative; left:180px; }
#clockin a {text-decoration:none; color:#FFF; font-size:13px; font-weight:300; }
#clockin a:hover { color:Yellow; font-size:13px; font-weight:300; }

#tabs2 { position:absolute; top:0px; right:0px; font-size:12px; z-index:200; }

.user_db { color:#CCC; font-size:13px; font-weight:300; position:absolute; top:30px; right:20px; z-index:200; }
.user_db a:link {text-decoration:none; color:#FFF; font-size:13px; font-weight:300; }
.user_db a:hover { color:Yellow; font-size:13px;; font-weight:300; }

#mysaved>a:link {text-decoration:none; color:#FFF; font-size:13px; font-weight:300; }
#mysaved>a:hover { color:Yellow; font-size:13px;; font-weight:300; }

.logout_links{ position:relative; top:0px; right:40px; float:right; display:inline; color:#FFF; width:750px; height:50px; }
.using_loc_header{top:65px !important;}

.chat_icon { position:relative; padding-top:5px; padding-right:10px; display:inline; float:left; }
#chatdock_wrapper { position:fixed; direction:ltr; bottom:0; right:50px; z-index:105; color:#333; margin: 0 15px; display:block; }
#chattab1, #chattab2, #chattab3 { display:none; float:left; position:relative; width:150px; }
.chatname_btn { background-color:#D8D8D8; color:#555555; border: thin solid #666; font-weight:bold; height:16px; padding:4px 5px; position:relative; z-index:251; cursor:pointer; }
.chatname_btn_over{background-color:#FFF;}
.chatclose{ background: url( "images/CloseXOut.png"); background-repeat: no-repeat; display:inline; width:15px; height:15px; position:absolute; right:3px; top:5px; }
.chatcloseover{ background: url( "images/CloseXOver.png"); background-repeat: no-repeat; display:inline; width:15px; height:15px; position:absolute; right:3px; top:5px; cursor:pointer; }
.chatrule_top { border-top:1px solid #CCC; padding-top:4px; }
.chatrule_left { border-left:1px solid #CCC; }
.chatrule_right { border-right:1px solid #CCC; }
/*************************/

/* class for the header bar in the chat window that displays the user's name*/
.chatwindowheader { font-size:0.7em; font-weight: normal; padding:5px; background-color:#6d84b4; color:#FFF; }

/*class for the div where we load the person's name you are chatting with*/
.chat1name, .chat2name, .chat3name { font-size:0.7em; font-weight: normal; }

/*chat window styles for all 3 windows */
.chat1, .chat2, .chat3 { width:250px; max-height:375px; overflow-y:hidden; overflow-x:hidden; visibility:hidden; z-index: 250; background-color: #DCDCDC; border: thin solid #666666; color: #999; font-weight: normal; }

/*individual positioning of each of the 3 chat windows*/
.chat1{ position:absolute; bottom:25px; right:0px; }
.chat2 { position:absolute; bottom:25px; right:0px; }
.chat3 { position:absolute; bottom:25px; right:0px; }

/* overall div containing chat*/
.messagehistory { padding-left:5px; background-color:white; height: 300px; width: 240px; overflow-x:hidden; overflow-y:auto; }

/*class for row in chat where message was sent by you*/
.ChatMine { background-color: #bed6f6; border: thin solid #bed6f6; border-spacing: 0px; }

/*class where they sent you the message*/
.ChatTheirs { background-color: #FFFFFF; border: thin solid #bed6f6; border-spacing: 0px; }

/* data cell style per chat */
.ChatMine td, .ChatTheirs td { border: thin solid #bed6f6; border-spacing: 0px; color: Black; padding: 5px 5px 5px 5px; margin: 3px 3px 3px 3px; height: 20px; }
/* style for the row containing the name and datetime of message*/
.ChatNameDate{font-size:0.7em; color:#555;}

#contact_timer { border:thin solid red; position:absolute; float:left; left:0px; top:25px; }

#x-header{ background-color: #004181; }
.nav-info{ font-size: 12px; color: #333; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CAD0D5; margin-bottom: 10px; }
.nav-info a{ color: #039; text-decoration: none; }
	
.tblHeader { background:#efefef; }
.systemheader { font-size: 14px; font-style: italic; font-weight: bold; }

#container { 
width:98%; 
height:auto; 
position:relative;
/*top:145px;*/
left:10px;
}
.container_withmenu{
min-width:1300px;
}
.container_withoutmenu{
min-width:1100px;
}

/* this contains not only the master menu but the dashboard */
.reg_menuleft { 
width:210px; 
/*float:left;*/
display:inline-block;
vertical-align: top;
}

/* this is the main div that holds our content on the right */
#reg_body_main { 
vertical-align: top;
display:inline-block;
height:90%; 
}
.reg_body_main_withmenu{
/* Firefox */
width: -moz-calc(100% - 225px);
/* WebKit */
width: -webkit-calc(100% - 225px);
/* Opera */
width: -o-calc(100% - 225px);
/* Standard */
width: calc(100% - 225px);
}
.reg_body_main_withoutmenu{
width:100%;
}

/* top left div holds master menu */
#reg_left1 { padding:0px 5px 5px 5px; }
#reg_left2 { padding:0px 5px 5px 5px; }


/**************** footer.tpl *******************************/
/*div containing footer in index file*/
#reg_footer { } 
.tbl_footer { } 

/*//TKS 06.04.2012 changed shadow color from 333 to 666 to lighten it*/
.shadow { 
/*
//TKS 02.25.2025 no ticket commented out shadows
-moz-box-shadow: 5px 5px 6px #666; 
-webkit-box-shadow: 5px 5px 6px #666; box-shadow: 5px 5px 6px #666; 
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666')"; 
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666'); 
*/
}

/*
###################################
###################################
	 WEEKLY CALENDAR STYLE
TKS 01.22.2020 #163841 rewrote weekly calendar
*/		

#reg_calweekly{
height:100%;
width:105%;
display:flex;
position:relative;
flex-direction:column;
}
#cal_weekly_header{
background-color:#FFF;
width:100%;
display:flex;
flex-direction:row;
border-bottom: 1px solid #e0e0e0;
}

/*blank cell before days of weeks just above the time column*/
#cal_weekly_blank{
width:60px;
min-height: 65px;
background-color:#FFF;
flex: none;
overflow: hidden;
box-sizing: border-box;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:column;
}
.cal_weekly_hdrblock{
overflow: hidden;
box-sizing: border-box;
-moz-box-flex: 1 1 0%;
flex: 1 1 0%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction:column;
text-align:center;
justify-content: center;
height: 65px;
font-weight:bold;
color:#666;
width:13.7%;
}

.cal_weekday{
margin-top:4px;
height:20px;
font-size:12px;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
text-align:center;
justify-content: center;
}
.cal_weekmonthday{
font-size:15px;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
text-align:center;
justify-content: center;
height:40px;
}
/* these next 3 classes are just for coloring 
cells for when you are closed, viewing today
or everything else ( open )*/
.cal_weekly_day_open{
background-color: #FFF;
}
.cal_weekly_day_today{
background-color: #FFFFCC;
}
.cal_weekly_day_closed{
background-color: Whitesmoke;
}

#alldayrow{
overflow: hidden;
box-sizing: border-box;
-moz-box-flex: 1 1 100%;
flex: 1 1 100%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction: row;
width: 100%;
background-color:#FFF;
}

.cal_weekly_allday_blocks{
border-right: #e0e0e0 1px solid;
overflow: hidden;
box-sizing: border-box;
-moz-box-flex: 1 1 0%;
flex: 1 1 0%;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-direction: column;
width: 13.7%;
padding-left:3px;
cursor:pointer;
}

.cal_weekly_allday_event{
border: none;
padding: 1px 1px;
text-decoration: none;
margin: 2px 2px;
border-radius: 5px;
white-space: nowrap;
overflow-x: hidden;
height:19px;
min-height:19px;
font-size:12px;
font-weight:400;
width:90%;
}

#allday_toggleup{
width:100%;
height:100%;
display:none;
align-items: center;
justify-content: center;
}
#allday_toggleup span{
align-self: flex-end;
cursor:pointer;
font-size:24px;
color:#666;
}
#allday_toggledown{
width:100%;
height:100%;
display:flex;
align-items: center;
justify-content: center;
}
#allday_toggledown span{
align-self: flex-end;
cursor:pointer;
font-size:24px;
color:#666;
}

.allday_toggle_more{
background-color:#FFFF;
color:#333;
align-items: center;
justify-content: center;
font-weight:700;
font-size:12px;
display:flex;
border: none;
padding: 1px 1px;
text-decoration: none;
margin: 2px 2px;
cursor: pointer;
border-radius: 5px;
white-space: nowrap;
overflow-x: hidden;
height: 19px;
min-height: 19px;
}
.allday_toggle_more:hover{
background-color:#DCDCDC;
}


/*container block that holds everything below the header
has an overflow-y and set height so you can scroll within
the div*/
#cal_time_content_container{
display:flex;
align-items:flex-start;
width:100%;
height:100%;
/*
position:absolute;
left:0px;
top:192px;
*/
}
/*vertical container for all the times displayed on left*/
#cal_weekly_time_container{
position:relative;
width:60px;
flex: none;
}
/* each time cell that holds a displayed time*/
.cal_weekly_times{
width:60px;
height:47px;
text-align:center;
background-color:#FFF;
border-bottom: 1px solid #e0e0e0;
flex: none;
flex-direction:column;
font-size:12px;
}

#cal_content_container{
width:100%;
height:100%;
display:flex;
}
/*columns that hold each column with padding so you have
space to click and add more*/
.cal_column_container{
position: relative;
padding-right: 12px;
box-sizing: border-box;
-moz-box-flex: 1 1 auto;
flex: 1 1 auto;
width:100%;
}
/*columns that hold our events*/
.cal_column{
position: relative;
height: 100%;
width: 100%;
}

/*the scheduling cells below the days of the week
and across from the times*/
.cal_weekly_cell{
position:relative;
width:100%;
height:47px;
flex-grow:1;
border-bottom: 1px solid #e0e0e0;
border-left: #e0e0e0 1px solid;
}
/*our column containers have right margin of 12px to
ensure we have space to click to add when there's a bunch of events
this causes our weekly cells to fall short in reaching the 
the right side with background color and styling so this 
takes a span and absolutely positions it to the right and fills in the gap
giving the appearance that it is one cell with background color, leaving 
the margin we need to prevent events filling up the clickable space*/
.cal_weekly_cell_extra{
content: " ";
height: 47px;
width: 12px;
position: absolute;
right: -12px;
border-bottom: 1px solid #e0e0e0;
}

/*each event has to have the position, height, width and z-index calculated
on the fly. But these are default settings that are consistent for each event*/
.cal_weekly_event{
border-radius: 5px; 
border:1px solid #FFF; 
position:absolute; 
font-weight:400;
font-size:12px;
}

/*
###################################
###################################
	 END WEEKLY CALENDAR STYLE
TKS 01.22.2020 #163841 rewrote weekly calendar
*/		

.monthly_popup { position: absolute; margin-top:10px; z-index: 600; }
.sm_calendar { z-index:1; }

/*
For the monthly calendar (large)
*/
.calmonthtop { background-color:black; color:purple; }

.calmonthtop .calnavigatemonth a { color: #993333; font-size: 1em; }

/*TKS 12-23-10 moved hardcoded style from daily view php to here*/
#reg_quickadd1 { position:absolute; bottom:0px; left:0px; height:15px; width:15px; z-index:650px; }

.calnavigatedaily { color: #993333; font-size: 1em; }
.calnavigatedaily a { color: #993333; font-size: 1em; }

.calnavigatedaily a:hover { color: #993333; font-size: 1em; }

.monthly_view { border: solid 1px #C0C0C0; }

.fullheight { height:100%; }


.monthly_view a { color: #666666; }

.monthly_view a:hover { color: #999999; }

.monthly_view_weekday { }

.monthly_view_weekend { background-color:#eaf7e8; }


.monthly_view_today { background-color: #ffffcc; }

.monthly_view_day { background-color:  white; }

.monthly_view_outside { background-color: #EEEEEE; }

.monthly_view_team { background-color: blue; }

.monthly_view_personal { color: black; font-size: 0.7em; /*background-color: #667ed9;*/ background-color: #c3d9ff; border:solid thin #a2bbdd; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }

.monthly_view_normal { color: black; font-size: 0.7em; background-color: #66d974; padding-left:5px; }

.monthly_view_personalallday { color: black; font-size: 0.7em; background-color: #d9d566; padding-left:5px; }

.monthly_view_normalallday { color: black; font-size: 0.7em; background-color: #d9667e; padding-left:5px; }

.monthly_view_more { color: BLUE; font-size: 0.7em; padding-left:5px; }

.monthly_view_holiday { color: black; font-size: 0.7em; background-color: Yellow; padding-left:5px; }
.monthly_view_vacation { color: black; font-size: 0.7em; background-color: tan; padding-left:5px; }
.cal_list li a { color: #666666; font-size: 0.7em; }

.cal_list li a:hover { color: #999999; font-size: 0.7em; }

.cal_list { padding:0px; margin-left:20px; }

.cal_link { }
/**************************************************/
.allday_holiday { font-weight:bold; color: #000000; font-size: 0.8em; }
.daily_view { width:800px; border: solid thin #C0C0C0; }
/*
our info popup layer that gives us additional info
//TKS 03.24.2014 #49635 changed absolute to relative so event title fit and placed correctly
*/
.daily_info_reg { position: relative; z-index: 10; padding-top:3px; padding-left:3px; }

.daily_info { background: #DFEDF7; width:360px; border: #666666 solid thin; padding:2px; }

.cal_info_title { font-weight:bold; font-size:0.9em; color:GREEN; }

.daily_dayofweek { background-color:#DCDCDC; } 

.daily_hours { border-bottom: 1px solid #C0C0C0; border-left: thin solid #a2bbdd; background:#c3d9ff; color:#597796; font-size:0.7em; }

.daily_event { background:#FFFFCC; border-bottom: solid thin #C0C0C0; }

.lizzyhint { background:#666666; border-bottom: solid thin #C0C0C0; font-size: 0.8em; font-style: bold; color: white; padding:2px; z-index=300; }

.daily_event_highlight { background:#DCDCDC; border-bottom: solid thin #C0C0C0; }

.daily_row { height:25px; }

/**************************************************/
/*Weekly view*/
.weekly_today_grid { border-bottom:solid thin #a2bbdd; background:Whitesmoke; }
/**************************************************/
/* calendar details view*/
.cv_cal_details { border: solid 1px #C0C0C0; background:#E8EEF7; width:520px; }


/**************************************************/
/* calendar details view*/
/* 
TKS 4-22-10 I added additional style code to handle a calendar within a grid since the griditem and gridaltitem
classes were cascading down to the calendar and jacking up its style
*/
.calendar-back, 
.grid .GridItem td .calendar-back, 
.grid .GridAltItem td .calendar-back { position: absolute; z-index: 450; }

.grid .GridItem td .calendar td, 
.grid .GridAltItem td .calendar td { border:none; border-spacing: 0; }

.calendar, 
.grid .GridItem td .calendar, 
.grid .GridAltItem td .calendar { width: 150px; border: solid 1px #C0C0C0; background-color:#FFF; padding:3px; border:solid thin #DBE3E8; -moz-border-radius: 10px; -webkit-border-radius: 20px; border-radius: 10px; }

.calendar-navrow{}

.calendar-navleft, 
.grid .GridItem td .calendar td table tr td .calendar-navleft, 
.grid .GridAltItem td .calendar td table tr td .calendar-navleft { border-right: 1px solid #C0C0C0; }

.calendar-navright, 
.grid .GridItem td .calendar td table tr td .calendar-navright, 
.grid .GridAltItem td .calendar td table tr td .calendar-navright { border-left: 1px solid #C0C0C0; }


.calday { font-size:0.8em; color: black; padding: 5px; }

.calweekendday { font-size:0.8em; color: #a7a7aa; padding: 5px; }

.calendar-dayname,
.grid .GridItem td .calendar td table tr td .calendar-dayname, 
.grid .GridAltItem td .calendar td table tr td .calendar-dayname { font-size:0.9em; color: #FFF; padding: 5px; } 
.calendar-weekenddayname { font-size:0.9em; color: #a7a7aa; padding: 5px; }

.calendar a,
.grid .GridItem td .calendar td table tr td .calendar a, 
.grid .GridAltItem td .calendar td table tr td .calendar a { text-decoration:none; color: #666666; }

.calendar a:hover,
.grid .GridItem td .calendar td table tr td .calendar a:hover, 
.grid .GridAltItem td .calendar td table tr td .calendar a:hover { color: #999999; }

.calendar-today,
.grid .GridItem td .calendar td table tr td .calendar-today, 
.grid .GridAltItem td .calendar td table tr td .calendar-today { border: 1px solid #999999; background-color: #DCDCDC; }

.calendar-today a,
.grid .GridItem td .calendar td table tr td .calendar-today a, 
.grid .GridAltItem td .calendar td table tr td .calendar-today a { color: #666666; font-weight: bold; }

.calendar-today a:hover,
.grid .GridItem td .calendar td table tr td .calendar-today a:hover, 
.grid .GridAltItem td .calendar td table tr td .calendar-today a:hover { color: #999999; font-weight: bold; }

/*TKS 10-8-12 added to make days highlighted on small calendar if you have activities on that day*/
.calendar a.activity_monthly { color:#ffa500; font-weight:bold; }
/*	 
###################################
*/
/* this handles our box sizes */
.width_900{ width:900px; }
.width_800{ width:800px; }
.width_700{ width:700px; }
.width_650{ width:650px; }
.width_600{ width:600px; }
.width_550{ width:550px; }
.width_500{ width:500px; }
.width_450{ width:450px; }
.width_400{ width:400px; }
.width_300{ width:300px; }
.width_250{ width:250px; }
.width_200{ width:200px; }
.width_160{ width:160px; }
.width_150{ width:150px; }

.btn_Misc.stop_time{
cursor: pointer; 
display: inline-block; 
margin-right: 0.1em; 
overflow: visible; 
padding: 0; 
position: relative; 
text-align: center; 
text-decoration: none; 
font-size:10px; 
border-radius: 5px 5px 5px 5px; 
border: 1px solid #650100; 
color: #FFFFFF; 
padding: .4em 1em; 
background: #ea908f; /* Old browsers */
background: -moz-linear-gradient(top,  #ea908f 0%, #cc5b57 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ea908f), color-stop(100%,#cc5b57)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ea908f 0%,#cc5b57 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ea908f 0%,#cc5b57 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ea908f 0%,#cc5b57 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ea908f 0%,#cc5b57 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea908f', endColorstr='#cc5b57',GradientType=0 ); /* IE6-9 */
}
.btn_Misc.start_time{
cursor: pointer; 
display: inline-block; 
margin-right: 0.1em; 
overflow: visible; 
padding: 0; 
position: relative; 
text-align: center; 
text-decoration: none; 
font-size:10px; 
border-radius: 5px 5px 5px 5px; 
border: 1px solid #2A8B2A; 
color: #FFFFFF; 
padding: .4em 1em; 
background: #c0e58b;
background: -moz-linear-gradient(top,  #c0e58b 0%, #58933f 100%);
background: -webkit-linear-gradient(top,  #c0e58b 0%,#58933f 100%);
background: linear-gradient(to bottom,  #c0e58b 0%,#58933f 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c0e58b', endColorstr='#58933f',GradientType=0 );
}

/*specific button on invoice that needs to jump out. parts request*/
#btn_request, #btn_pullmultibins, #btn_shipnextbin_new 
{ 
cursor: pointer; 
display: inline-block; 
margin-right: 0.1em; 
overflow: visible; 
padding: 0; 
position: relative; 
text-align: center; 
text-decoration: none; 
font-size:10px; 
font-weight: bold; 
border-radius: 5px 5px 5px 5px; 
border: 1px solid red; 
color: #FFFFFF; 
padding: .4em 1em; 
background: #f85032; /* Old browsers */
background: -moz-linear-gradient(top,  #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c), color-stop(51%,#f6290c), color-stop(71%,#f02f17), color-stop(100%,#e73827)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}
#btn_request:hover { border: 1px solid black; color:black; }

/*this class puts a style on the field itself for required in case
you wanted a red border or different color background for required fields instead of
changing the lbl*/
input[type=text].required, input[type=password].required, textarea.required, select.required { }
input[type=email]:focus, input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus 
{ 
background:#a7c8903d; border:1px thin solid #DCDCDC; 
}
input[type=email], input[type=text], input[type=password], textarea, select 
{
/*
background: none repeat scroll 0 0 white; border: 1px solid #DBE3E8; border-radius:6px 6px 6px 6px; line-height: 16px; 
*/

border: 0;
outline: 0;
color: rgb(60, 66, 87);
background-color: rgb(255, 255, 255);
box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(60 66 87 / 16%) 0px 0px 0px 1px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px;
border-radius: 4px;
font-size: 12px;
line-height: 20px;
font-weight: 400;
padding: 2px 3px;
min-height: 20px;
vertical-align: middle;
}
/*TKS 2-7-2013 although GHH said not to use, this is for priority customers and it style gets overridden by classes above it
we need this color not only for the rounded bar at the top of ticket headers but we plug this in and apply a square class for our
grid legends so this color HAS to be what we set it as. So in this case the !important needs to stay*/
.bg_priority {background-color:#e67817 !important; color:white;}
/*DO not remove the !important from the line above without getting with TKS first*/

/*builds progress sales bar*/
/*//TKS 01.14.2014 #45508 fixed gradients to be cross browser*/
.progress_reached
{
-moz-border-radius: 2px; 
-webkit-border-radius: 2px; 
border-radius: 2px; 
width:8px; 
height:16px; 
border:thin solid #2A8B2A; 
background-position: top; 
color:#FFFFFF; 
font-weight: bold; 
position:relative; 
background: #C9DE96; /* Old browsers */
background: -moz-linear-gradient(top,  #C9DE96 0%, #398235 48%, #C9DE96 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C9DE96), color-stop(48%,#398235), color-stop(100%,#C9DE96)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #C9DE96 0%,#398235 48%,#C9DE96 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #C9DE96 0%,#398235 48%,#C9DE96 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #C9DE96 0%,#398235 48%,#C9DE96 100%); /* IE10+ */
background: linear-gradient(to bottom,  #C9DE96 0%,#398235 48%,#C9DE96 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C9DE96', endColorstr='#C9DE96',GradientType=0 ); /* IE6-9 */
display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline;
}


/*//TKS 11.15.2017 #117434 once you pass the isSold level*/
.progress_pastsold
{
-moz-border-radius: 2px; 
-webkit-border-radius: 2px; 
border-radius: 2px; 
width:8px; 
height:16px; 
border:thin solid #2A8B2A; 
background-position: top; 
color:#FFFFFF; 
font-weight: bold; 
position:relative; 
background: #ffd9c5; /* Old browsers */
background: -moz-linear-gradient(top, #ffd9c5 0%, #fa9660 50%, #feb086 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffd9c5 0%,#fa9660 50%,#feb086 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffd9c5 0%,#fa9660 50%,#feb086 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd9c5', endColorstr='#feb086',GradientType=0 );
display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline;
}


.progress_notreached
{
-moz-border-radius: 2px; 
-webkit-border-radius: 2px; 
border-radius: 2px; 
width:8px; 
height:16px; 
border:thin solid #b6b4b4; 
background-position: top; 
color:#FFFFFF; 
font-weight: bold; 
position:relative; 
background: #e2e2e2; /* Old browsers */
background: -moz-linear-gradient(top,  #e2e2e2 0%, #d1d1d1 48%, #e2e2e2 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(48%,#d1d1d1), color-stop(100%,#e2e2e2)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 48%,#e2e2e2 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 48%,#e2e2e2 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e2e2e2 0%,#d1d1d1 48%,#e2e2e2 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e2e2e2 0%,#d1d1d1 48%,#e2e2e2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#e2e2e2',GradientType=0 ); /* IE6-9 */
display: -moz-inline-stack; display: inline-block; vertical-align: top; transform: scale(1); transform-origin: 0 0; *display: inline;
}

#featured_sortable, 
#unit_videos_sortable,
#model_videos_sortable,
#item_videos_sortable,
#featured_unit_sortable, 
#featured_home_sortable, 
#featured_unittype_sortable,
#featured_vendor_sortable{ list-style-type: none; margin: 0; padding: 0; width: 400px; }
#featured_sortable li, 
#unit_videos_sortable li,
#model_videos_sortable li,
#item_videos_sortable li,
#featured_unit_sortable li, 
#featured_home_sortable li, 
#featured_unittype_sortable li,
#featured_vendor_sortable li{ cursor:move; width: 800px; margin-bottom:20px; text-align: center; }
/*TKS added for favorite reports drag and drop in settings/maintenance*/
#reports_sortable { list-style-type: none; margin: 0; padding: 0; }
#reports_sortable li { margin: 3px 3px 3px 0; padding-left: 3px; padding-bottom:3px; width: 500px;}
/*TKS 76195 drag and drop sorting of webstore images*/
#webstoreimage_sortable { 
list-style-type: none; 
margin: 0; 
padding: 0; 
width:100%; 
}
#webstoreimage_sortable li { 
cursor:move; 
padding-bottom: 15px; 
text-align: center; 
width:100px; 
height:100px; 
margin-right:15px; 
display:inline-block;
}

/*for smaller links - first used in settings/webstore/shipmethods*/
a:link.lbl_link { font-size:0.8em; text-decoration:none; }
a:hover.lbl_link { font-size:0.8em; text-decoration:none; }

/*08.20.2013 rl - added collapsing element for phone settings*/
.collapsing_element
{
overflow: hidden;
transition: height 1s;
-webkit-transition: height 1s;
}

/*04.07.2014 naj - added divs for handling the ADP payroll setup screen.*/
#adp_employee{float: left;}

#adp_departments
{
float: left;
margin-left: 40px;
text-align: center;
}

/*CSS Working Spinner*/
#workingcontainer
{
display: none;
color: #000;
background-color: #DFDADA;
width: 100%;
height: 100%;
opacity: 0.6;
float: inherit;
position: absolute;
z-index: 1600;
}

.working
{
width: 300px;
height: 300px;
margin: 200px auto;
position: relative;
box-sizing: border-box;
z-index: 0;
}

#workingtextcontainer
{
display: none;
width: 100%;
height: 100%;
position: absolute;
z-index: 1601;
}

#workingcipcontainer
{
display: none;
width: 100%;
height: 100%;
position: absolute;
z-index: 1601;
}

.workingtext
{
text-transform: uppercase;
color: #000;
margin: 330px auto;
text-align: center;
font-weight: 500;
font-size: 26px;
}

.working:before,
.working:after {
opacity: 0;
box-sizing: border-box;
content: "\0020";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 200px;
border: 5px solid #807f7f;
box-shadow: 0 0 50px #000, inset 0 0 50px #fff;
}

.working:after
{
z-index: 1;
-webkit-animation: gogoloader 2s infinite 1s;
animation: gogoloader 2s infinite 1s;
}

.working:before
{
z-index: 2;
-webkit-animation: gogoloader 2s infinite;
animation: gogoloader 2s infinite;
}

@-webkit-keyframes gogoloader
{
0%
	{
	-webkit-transform: scale(0);
	opacity: 0;
	}
50%
	{
	opacity: 1;
	}
100%
	{
	-webkit-transform: scale(1);
	opacity: 0;
	}
}

@keyframes gogoloader
{
0%
	{
	transform: scale(0);
	opacity: 0;
	}
50%
	{
	opacity: 1;
	}
100%
	{
	transform: scale(1);
	opacity: 0;
	}
}

/*TKS 06.11.2014 #53411 parts look up styles*/
/******************************/
/******************************/
/******************************/
.assembly_image{
display:none;
margin: auto;
width:100%;
}

#parts_lookup_img_div{
height:85%; 
width:100%;
border: thin solid #999;
}

#reg_lizzy_parts_lookup_img{
height:100%;
width:70%;
float:left;
}
#reg_lizzy_parts_lookup_partslist{
width:250px;
float:right;
overflow-y: auto;
}
a:link.linkto_master_model { color: Maroon; font-size:0.8em; text-decoration:none; }
a:hover.linkto_master_model { color: #000; font-size:0.8em; text-decoration:none; }

.partslist_itemnumber { color: #0000FF; font-size:0.9em; font-weight:500; }

.parts_lookup_text{font-size:0.8em;}
.parts_lookup_desc{color:#999;}
.parts_lookup_price{color:#999;}

/*** ZOOM CONTROLS *****/
#zoom-controls span {
position:relative;
float: left;
z-index:100;
}

#partsfetch-homebtn {
position:relative;
background-image: url("images/partsfetch-home-off.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}
#partsfetch-homebtn:hover {
position:relative;
background-image: url("images/partsfetch-home-on.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}
#partsfetch-zinbtn {
position:relative;
background-image: url("images/partsfetch-zoom-off.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}
#partsfetch-zinbtn:hover {
position:relative;
background-image: url("images/partsfetch-zoom-on.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}
#partsfetch-zoutbtn {
position:relative;
background-image: url("images/partsfetch-zoomout-off.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}
#partsfetch-zoutbtn:hover {
position:relative;
background-image: url("images/partsfetch-zoomout-on.png");
border: 0 none;
cursor: pointer;
display: block;
z-index:100;
width:33px;
height:32px;
}

#partsfetch-homebtn-info { 
width:80px;
margin-top:30px;
margin-left:15px;
}
#partsfetch-zinbtn-info { 
width:220px;
margin-top:30px;
margin-left:45px;
}
#partsfetch-zoutbtn-info { 
width:220px;
margin-top:30px;
margin-left:80px;
}
/******************************/
/******************************/
/******************************/
/******************************/
/* Sales Dept Dashboard */
#sales_summary_container{
margin-top:25px;
width: 800px;
}
.sales_summary_single_block{
width:200px;
height:200px;
cursor:pointer;
display:inline-table;
margin-left:25px;
background-color:#FFF;
}
.sales_summary_double_block{
width:440px;
height:auto;
display:inline-table;
margin-left:25px;
background-color:#FFF;
}
#reg_totalsales{
width:100%;
height:300px;
}
.sales_totalsales_hdr_left{
font-size:16px;
font-weight:bold;
color:#939393;
width:200px;
display:inline-block;
float:left;
}
.sales_totalsales_hdr_right{
font-size:16px;
font-weight:bold;
color:#000;
width:150px;
text-align:right;
display:inline-block;
float:right;
}
.salesdash_btns{
width:100%;
height:50px;
margin-top:50px;
text-align:center;
display:block;
clear:both;
}

a.btn_SalesDashInactive{
background: #fff none repeat scroll 0 0;
color:#777 !important;
}
a.btn_SalesDashActive{
background: #59d none repeat scroll 0 0;
color:#FFF !important;
}
a.btn_SalesDash{
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
border-radius: 3px;
box-shadow: 0 -1px 0 1px rgba(0, 0, 0, 0.1) inset, 0 -10px 20px rgba(0, 0, 0, 0.1) inset;
cursor: pointer;
display: inline-block;
font-size:13px !important;
min-width: 70px;
padding: 6px 10px 8px;
text-align:center;
}
a.btn_SalesDashInactive:hover{
background: #f5f5f5 none repeat scroll 0 0;
color: #777 !important;
}
a.btn_SalesDashActive:hover{
background: #48c none repeat scroll 0 0;
color: #FFF !important;
}

.sales_summary_single_block:hover{
-moz-box-shadow: 5px 5px 6px #666; -webkit-box-shadow: 5px 5px 6px #666; box-shadow: 5px 5px 6px #666; /* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666')"; /* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666'); 
}

.sales_summary_single_block_calendar{
background-image: url("images/calendar_64.png"); background-repeat: no-repeat;
width:64px;
height:64px;
margin: 20px auto 20px;
}
.sales_summary_single_block_calls{
background-image: url("images/call_64.png"); background-repeat: no-repeat;
width:64px;
height:64px;
margin: 20px auto 20px;
}
.sales_summary_single_block_opp{
background-image: url("images/opportunity_64.png"); background-repeat: no-repeat;
width:64px;
height:64px;
margin: 20px auto 20px;
}

.sales_summary_single_block_info{
width:100%;
height:20px;
clear:both;
}
.sales_summary_single_block_lbl{
display:inline-block;
width:80%;
height:20px;
}
.sales_summary_single_block_value{
display:inline-block;
width:15%;
height:20px;
text-align:right;
font-weight: bold;
}

/* Interested unit/model image styles */
.intunit_container{
display: inline-block;
margin-bottom: 30px;
margin-left: 20px;
position: relative;
width: auto;
}
.single_intunit_container{
background-image: linear-gradient(to top, #fafafa 0px, #fdfdfd 20%, #fff 60%);
background-position: left bottom;
background-repeat: no-repeat;
background-size: 100% 200px;
border: 1px solid #eee;
box-shadow: 1px 1px 3px 0 #f2f2f2;
display: inline-block;
float: left;
height: 375px;
margin: 0 0 12px 12px;
overflow: hidden;
padding: 5px 20px 20px !important;
position: relative;
text-align: center;
width: 160px;
}
.intunit_inner_container {
padding-top: 3px;
}
/******************************/
/******************************/
/******************************/
/**** SMS Texting control******/
.texting{
list-style: outside none none;
margin: 60px 0 10px;
padding: 0 0 50px;
}
.texting li {
display: flex;
overflow: hidden;
padding: 0.5rem;
}
.text-self {
align-items: flex-end;
justify-content: flex-end;
}
.text-other::before {
height: 0;
left: 40px;
position: relative;
right: 0;
top: 0;
width: 0;
}
.text-self .text-avatar::after {
bottom: 19px;
box-shadow: 0 2px 0 #d4d4d4;
display: inline-block;
height: 0;
position: relative;
right: 0;
width: 0;
}
.text-self .text-avatar {
order: 2;
}
.texting .text-avatar {
display: block;
height: 50px;
position: relative;
width: 50px;
z-index: 2;
}
.text-other .text-message {
order: 1;
margin-left: 10px;
}
.text-self .text-message {
margin-right: 10px;
}
.text-message {
min-width: 250px;
max-width:600px;
padding:5px; 
border:solid thin #DBE3E8; 
-moz-border-radius: 10px; 
-webkit-border-radius: 20px; 
border-radius: 10px;
}
.message-self {
background: #f5f5f5 none repeat scroll 0 0;
border: 1px solid #c7c7c7;
color:#000;
}
.message-other {
background: #779ecb none repeat scroll 0 0;
color:#FFF;
}

.text-message time::before {
color: #ddd;
display: inline-block;
margin-right: 4px;
}

.message-self time{
color: #a7a0a0;
}
.text-message time {
-moz-user-select: none;
cursor: default;
font-size: 0.7rem;
float: right;
margin-top: 3px;
}
.text-message p {
/*color: #777;*/
font-size: 0.8rem;
margin: 0 0 0.2rem;
}

#reg_lizzysms{
width:650px; 
display:inline-block; 
vertical-align:top;
padding-left:8px;
}

#reg_last20sms{
height:550px; 
overflow-y:scroll; 
display:inline-block; 
vertical-align:top; 
text-align:center;
background-color:#E6E6E6;
border: 1px solid #c7c7c7;
}
.last20_box{
position:relative; 
/*height:70px;*/
height:auto;
/*width:150px;*/
width:100%;
cursor:pointer;
display:block;
background-color:#FFF;
}
.last20_box1{
border-left: 1px solid #bcbcbc;
border-right: 1px solid #bcbcbc;
border-top: 1px solid #bcbcbc;
}
.last20_middle{
border: 1px solid #bcbcbc;
}
.last20_lastbox{
border-top: 1px solid #E9E4E4;
border-left: 1px solid #bcbcbc;
border-right: 1px solid #bcbcbc;
border-bottom: 1px solid #bcbcbc;
}

.initials_circle{
display: inline-flex;
-webkit-box-align: center;
align-items: center;
justify-content: center;
border-radius: 50%;
border: 1px solid #c7c7c7;
background-color: #f5f5f5;
overflow: hidden;
color: #333;
text-transform: uppercase;
width:50px;
height:50px;
}
/******************************/
/******************************/
/******************************/
.viewreceipt{
max-width: 800px;
max-height: 800px;
}

#anychart_print{
display:block;
width : 150px;
height : 20px;
background-color : #444444;
color : white;
text-align : center;
border : 3px solid #444444;
border-radius : 7px 7px 7px 7px;
font-size : 15px;
cursor : pointer;
}

/*TKS 144502 sales manager dash with widgets*/
/******************************/
#reg_platform, #dash_container{
width:98%;
height:100%;
}

#reg_platform *, #dash_container * { box-sizing: border-box; } 

/* ---- grid ---- */
.dash_header{
color: #000;
padding:0 20px; 
background:#FFF; 
border 1px solid #DDD; 
width:100%; 
height:64px; 
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.dash_nav_item{
height:50px;
width:70px;
cursor:pointer;
text-align:center;
padding-top:10px;
display:table-cell;
}

#dash_last10{font-size: 13px; color:#000;}
#dash_last10 a:link, #dash_last10 a:hover, #dash_last10 a:visited{color: blue;}

#kbfavs_sortable { list-style-type: none; margin: 0; padding: 0; }
#kbfavs_sortable li { margin: 3px 3px 3px 0; padding-left: 3px; padding-bottom:3px; width: 300px;}

.masonry, .dashboard_content {
background: #F5F5F5;
width:100%;
min-height:800px;
position:relative;
}

/* clear fix */
.masonry:after {
content: '';
display: block;
clear: both;
}
/* ---- .masonry-item ---- */
.masonry-item{
display: block;
position: absolute;
margin: 8px;
padding:8px;
z-index: 1;
border: 1px solid #DDDDDD;
background-color:#FFF;
}
.masonry-item.muuri-item-dragging {
z-index: 3;
}
.masonry-item.muuri-item-releasing {
z-index: 2;
}
.masonry-item.muuri-item-hidden {
z-index: 0;
}

.masonry-item div.widget_title{
text-align:center; 
float:left; 
width:auto; 
height:20px;
font-weight: 500;
}
.masonry-item-1x1 div.widget_title{
max-width:100px;
overflow:hidden;
}

.masonry-item div.widget_header{
vertical-align:top; 
width:100%; 
height:30px; 
padding:5px;
}
.widget_colors, .calendar_colors{
cursor:pointer;
display:inline-block;
margin:3px;
width:20px;
height:20px;
border-radius:50%;
}
.widget_color_check, .calendar_color_check, .caltype_color_check{
height:8px;
width:4px;
margin-top:3px;
margin-left: 6px;
}

.masonry-item div.vellipsis{
cursor:pointer;
text-align:center; 
float:right; 
width:20px; 
height:20px;
font-size:16px;
}
.masonry-item div.widget_refresh{
cursor:pointer;
text-align:center; 
float:right; 
width:20px; 
height:20px;
font-size:16px;
margin-right:5px;
}
.masonry-item div.widget_menu{
display:none;
position:absolute;
right:20px;
top:30px;
width:130px;
height:auto;
background: #FFF;
border: 1px solid #DDDDDD;
-webkit-box-shadow: 0 2px 4px -1px rgba(0,0,0,.21),0 4px 5px 0 rgba(0,0,0,.15),0 1px 10px 0 rgba(0,0,0,.13);
box-shadow: 0 2px 4px -1px rgba(0,0,0,.21),0 4px 5px 0 rgba(0,0,0,.15),0 1px 10px 0 rgba(0,0,0,.13);
z-index:100;
}


.widget_menu_options{
cursor:pointer;
width:100%;
padding:10px;
font-size:16px;
color:#666;
}

.widget_menu_options:hover{background-color:#DDD;}
.widget_menu_options i {
font-size:18px;
margin-right:10px;
}
/*
To build boxes:
take your 1x1 item size ( above is 180 ), multiply it by the square size
then add the additional 8px margin (per side) for gutter size per additional
boxe that make up the size.

so if you are doing a 2X2 box: 
it needs to account for the fact that 1x1 box includes a margin of 8 per side ( for 16 )
Since the finished box will include its own margins, you don't include itself into the
equation, only the additional boxes that make up side you are calculating.

So in our example of 2x2 you would have 
376 = ( 180 + 180 ) + ( 16 margin )
if doing a 3x3 box, you take 16 x 2 for the margins
remember, the .masonry-item has the margin on itself 
already so only calc for additional boxes
*/

.masonry-item-1x1{
width: 180px;
height: 180px;
}
.masonry-item-2x1{
width: 376px;
height: 180px;
}
.masonry-item-2x2{
width: 376px;
height: 376px;
}
.masonry-item-2x3{
width: 376px;
height: 572px;
}
.masonry-item-3x1{
width: 572px;
height: 180px;
}
.masonry-item-3x2{
width: 572px;
height: 376px;
}
.masonry-item-2x4{
width: 376px;
height: 768px;
}
.masonry-item-4x2{
width: 768px;
height: 376px;
}
.masonry-item-4x3{
width: 768px;
height: 572px;
}
.masonry-item-3x3{
width: 572px;
height: 572px;
}

.widget_btn{
display:inline-block;
position:relative;
height: 180px;
width: 180px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #FFF;
border: 1px solid #DDDDDD;
padding:8px;
margin:8px;
background-color:#FFF;
cursor:pointer;
vertical-align:top;
}
.widget_btn:hover{border-color: hsla(0, 0%, 100%, 0.5);}
.widget_btn i{
text-align:center;
margin-top:40px;
margin-bottom:20px;
font-size: 60px;
}
.widget_btn_lbl {
text-align:center;
font-size: 16px;
color:#898989;
}

.currcontact_item.muuri-item-dragging {
z-index: 3;
}
.currcontact_item.muuri-item-releasing {
z-index: 2;
}
.currcontact_item.muuri-item-hidden {
z-index: 0;
}
.masonry-item-draggable:hover, .currcontact_item_draggable:hover {
border-color: hsla(0, 0%, 100%, 0.5);
cursor: move;
}
.masonry-item-draggable-disabled:hover, .currcontact_item_draggable_disabled:hover {
border-color: hsla(0, 0%, 100%, 0.5);
cursor: default !important;
}

/*toggle switch*/
/***************/
.toggle_switch{
margin-left:20px;
display:inline-block;
}
.toggle_switch_lbl{
display:inline-block;
font-weight:bold;
margin-left:6px;
}
input.toggle-round {
display:none;
}
input.toggle-round + label {
display: block;
position: relative;
cursor: pointer;
padding: 1px;
width: 50px;
height: 25px;
background-color: #ddd;
border-radius: 25px;
border: 1px solid #ccc;
box-sizing: unset !important;
}

input.toggle-round + label:after {
display: block;
position: absolute;
content: "";
width: 25px; height: 25px;
background-color: white;
border-radius: 100%;
box-shadow: 0 2px 3px #888;
transition: margin 0.5s;
}
input.toggle-round:checked + label {
background-color: #86d993;
}
input.toggle-round:checked + label:after {
margin-left: 25px;
}
/***************/
.add_widget{
text-align:center;
vertical-align:center;
display:inline-block;
width:100px;
height:50px;
position:absolute;
right:100px;
cursor:pointer;
border-radius: 10px;
border: 1px solid #000;
}
.add_widget:hover{background-color:#deb002; color:#FFF; border:1px solid #DDDDDD;}
.widget_control{
width:98%;
margin-top:10px;
}
.widget_content_center{
width:98%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}

.widgetclock{
display:block;
font-weight:bold;
color:#000; 
text-align:center;
}

.clockunit{
display:inline-block;
width:auto;
height:auto;
}
.widgetdate, .widgetday{
display:block;
width:auto;
color:#666; 
text-align:center;}
/******************************/
/******************************/
.masonry-item-1x1 .widgettext1{
font-size:15px;
}
.masonry-item-1x1 .widgettext2{
font-size:18px;
}
.masonry-item-1x1 .widgettext3{
font-size:24px;
}

.masonry-item-2x2 .widgettext1{
font-size:15px;
}
.masonry-item-2x2 .widgettext2{
font-size:25px;
}
.masonry-item-2x2 .widgettext3{
font-size:40px;
}
.widget_sizes{
text-align: center;
vertical-align: middle;
line-height: 30px;
display: inline-block;
width: 50px;
height: 30px;
cursor: pointer;
border-radius: 10px;
border: 1px solid #333;
color:#333;
}
.widget_size_set{border: 1px solid #6b8e23; background-color:#addfad;}

.dash-info-item{
margin: 8px;
padding:8px;
border: 1px solid #DDDDDD;
background-color:#FFF;
}
.widget_footer{
display:none;
background-color:#f5f5f5;
width: 98%;
height: 40px;
position: absolute;
bottom: 8px;
}

.widget_heading_1x1{
color:#23282d;
font-size: 14px;
font-weight: 600;
width:100%;
text-align:center;
margin-bottom:8px;
}
.widget_heading{
font-weight: 600;
color:#23282d;
font-size: 14px;
width:100%;
text-align:left;
margin-bottom:8px;
}

.count_1x1{
margin-top:8px;
font-size: 30px;
font-weight:bold;
padding-bottom:8px;
width:100%;
text-align:center;
}
.count_1x1 a:link{
font-size: 30px;
font-weight:bold;
}

.icon_1x1_icon{
font-size: 60px;
margin-bottom:18px;
}

.icon_1x1_text{
font-size: 20px;
color:#23282d;
}

.widget_grid{
width:100%;
background-color: #fafafa;
border-bottom:1px solid #eee;
}
.widget_appt{
width:100%;
/*min-height: 70px;*/
min-height: 108px;
border-top: 1px solid #eee;
color:#000;
}
.widget_appt:hover, .widget_highlight_appt:hover{
background-color:#e0e0e0;
}

.widget_appt_left{ 
display:table-cell;
text-align:center;
width:80px;
color:#82878c;
font-size:12px;
border-right: 1px solid #eee;
}
.widget_appt_right{
display:table-cell;
padding-left:8px;
padding-top:8px;
}
.widget_highlight_appt{
background-color:blanchedalmond;
}
.widget_invited_appt{
border:1px red solid;
}
#dash_menu{
display:none;
position: absolute;
left: -140px;
top: 10px;
width: 260px;
height: auto;
background: #FFF;
border: 1px solid #DDDDDD;
-webkit-box-shadow: 0 2px 4px -1px rgba(0,0,0,.21),0 4px 5px 0 rgba(0,0,0,.15),0 1px 10px 0 rgba(0,0,0,.13);
box-shadow: 0 2px 4px -1px rgba(0,0,0,.21),0 4px 5px 0 rgba(0,0,0,.15),0 1px 10px 0 rgba(0,0,0,.13);
z-index: 100;
}

/*data management control for owner/admin good will calls*/
/*end of data management control*/
#dm_mainblock{
margin: auto;
width: 80%;
min-width:800px;
display:block;
background-color:#FFF;
border-radius:10px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
margin-bottom:50px;
}
.dm_section_block{
display:block;
width:100%;
clear:both;
}
.dm_panel_heading{
cursor:move;
display:block;
padding:15px 0px 15px 0px;
width:100%;
background-color: #e3e3e3;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.dm_section_name{
padding-left:8px;
color: #58595b !important;
font-size: 16px;
font-weight:600;
width:95%;
display:inline-block;
}
.dm_section_hide{
width:auto;
display:inline-block;
}
.dm_section_data{
display:grid;
width:100%;
}
.dm_subsection{
font-size: 12px;
font-weight:900;
color: #58595b;
padding: 5px 0px 5px 10px;
grid-column-start: 1;
grid-column-end: 2;
}
.dm_subsection2{
font-size: 12px;
font-weight:600;
color: #58595b;
padding: 5px 0px 5px 25px;
grid-column-start: 1;
grid-column-end: 2;
}
.dm_data_row{ 
display:flex;
}
.dm_left{
background: #FFF;
font-size: 12px;
font-weight:300;
color: #58595b;
padding: 5px;
overflow: hidden;
text-overflow: ellipsis;
width:50%;
display:grid-item;
}
.dm_right{
background-color: #eef6ff;
font-size: 12px;
font-weight:300;
color: #424242;
padding: 5px;
overflow: hidden;
text-overflow: ellipsis;
width:50%;
display:grid-item;
}
.dm_top_border{border-top: 1px solid #8cbded;}
.dm_lastrow{margin-bottom: 20px;}

ul.sortable_forms{
min-height:100px; 
vertical-align:top; 
width:18%; 
display:inline-block;
}
ul.sortable_forms li{
list-style: none;
padding:2px;
}
/*//TKS 04.24.2023 #238251 contact info drawer in header*/
/*********************************/
/*********************************/
#currcontact_container {
background: #F5F5F5;
width:100%;
min-height:370px;
position:relative;
}

/* clear fix */
#currcontact_container:after {
content: '';
display: block;
clear: both;
}
/* ---- .masonry-item ---- */
.currcontact_title{font-weight:bold; width:100%; text-align:center;}
.currcontact_item{
display: block;
position: absolute;
margin: 8px;
padding:8px;
z-index: 1;
border: 1px solid #DDDDDD;
background-color:#FFF;
}
.currcon_singleline_short{
width:125px;
height:50px;
}
.currcon_singleline_med{
width:225px;
height:50px;
}
.currcon_singleline_wide{
width:505px;
height:50px;
}
.currcon_multiline_short{
width:125px;
}
.currcon_multiline_med{
width:225px;
}
.currcon_multiline_wide{
width:505px;
}
.currcon_multiline_full{
width:750px;
}
/*********************************/
/*********************************/
#edit_unit_jumpto{
min-width:100px;
padding:3px;
position:fixed;
}
/****** Calculator***********/
.advanced-calc {
width: 200px; /* Was ~270px; now about 25% smaller */
background: #fff;
padding: 15px; /* Reduced from 20px */
border-radius: 8px; /* Reduced from 10px */
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); /* Reduced shadow size */
}

.advanced-calc-display {
width: 195px; /* Was 260px */
height: 30px; /* Was 40px */
text-align: right;
font-size: 1.125em; /* Was 1.5em */
margin-bottom: 8px; /* Was 10px */
padding-right: 8px; /* Was 10px */
border: 1px solid #ddd;
 border-radius: 4px; /* Was 5px */
 }

.advanced-calc-buttons-grid {
display: grid;
grid-template-columns: repeat(4, 45px); /* Each button now 45px instead of 60px */
gap: 8px; /* Was 10px */
}
.advanced-calc-buttons-grid button {
height: 45px; /* Was 60px */
font-size: 0.9em; /* Was 1.2em */
border: none;
background: #e0e0e0;
border-radius: 4px; /* Was 5px */
cursor: pointer;
transition: background 0.2s;
}
.advanced-calc-buttons-grid button.calcnumber{
background: #f9f9f9;
}
.advanced-calc-buttons-grid button.calcequal{
background: #4d90fe;
color:#FFF;
}
.advanced-calc-buttons-grid button:hover {
background: #d4d4d4;
}
/****************************/
.ticket_sq_bg { color:black; background-color:#eceff7;}
.ticket_sq_bg td a:link {text-decoration:none; color:blue; }
.ticket_sq_bg td a:visited {text-decoration:none; color:blue;}
.ticket_sq_bg td a:hover { color:red;  }
.ticket_sq_bg td .title { font-size:16px; color:black; font-weight:400 }
.ticket_sq_bg td .infotext { font-size:13px; color:#006180; font-weight:300 }
.ticket_sq_bg td .lbl { font-size:11px; color:maroon;}

/*//TKS 08.15.2025 #284778*/
/* Floating Amount-to-Pay badge */
#amountToPayFixed{
position: fixed;
top: 500px;          /* adjust as needed */
left: 0;             /* JS sets this */
right: auto;         /* ensure right isn't used */
white-space: nowrap;   /* keep on one line */
width: max-content;    /* don't shrink-to-fit on very small gaps */
display: inline-block; /* safe sizing */
background: #fff;
padding: 8px 12px;
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: 0 2px 6px rgba(0,0,0,.15);
z-index: 999;

/* hide but keep measurable (do NOT use display:none) */
visibility: hidden;
opacity: 0;
pointer-events: none;
transition: opacity .15s ease;
}

#amountToPayFixed.is-visible{
visibility: visible;
opacity: 1;
pointer-events: auto;
}

/****************************/