/*
###################################
BLUE STYLES
*/

.btn_glow { box-shadow: 0px 0px 8px red !important; }
a.linkglow { text-shadow:0 0 5px green; }
a:hover.linkglow { text-shadow:0 0 5px green; }
/*TKS release notes link in header. glows if they have not read latest release*/
a.release_linkglow { color:#FFF !important; text-shadow:4px 4px 5px #ffa500; }
a:hover.release_linkglow { text-shadow:0 0 5px green; }

.menu_master 
{ 
width:181px; 
height:32px; 
background-position: top; 
position:relative; 
background: #4070a4;
}
.menu_master:hover{background: #6e8fdf;}

.gridHeader td, .grid .grid .gridHeader td {
background-color: #125385;
} 

.ticket-list-bg{background-color:#ADCBFB;}
.ticket-list-bg span.title{color:#000; font-weight:300;}

body a:link, body a:visited { text-decoration:none; font-size:14px; color:#2A648B; font-weight:400 }
body a:hover { font-size:14px; color:#ffa500; font-weight:400 }

th>a:link, th>a:visited, th>span a:link, th>span a:visited { text-decoration:none; font-size:14px; color:#FFFFFF; font-weight:bold }
th>a:hover { font-size:14px; color:yellow; font-weight:bold }

#logintable { margin-left:20px; padding: 3px; background:url("images/login-bg.png"); background-repeat:repeat-y; background-color: #125385; }

.header_container{ 
width:100%; 
/*background-color: #125385;
background:url("images/header-bg.png"); 
*/
background-repeat:repeat-y; 
background-color: #4070a4;
}
#header_bottom { min-width:100%; width:100%; }
.header-shadow { 
/*background: url("images/header-shadow.png") repeat-x scroll left top transparent;*/
height: 21px; margin-bottom: 9px; border-top: 3px solid;
}
#header_middle { min-width:100%; position:relative; width:100%; height:125px; }

/*** Module Menu ***/
/*//TKS 03.21.2016 #82728 added icons for home button and
alerts as well as new design for alerts to be displayed*/
.home-module{
margin-left:10px;
padding-right:10px;
display:inline-block;
width:32px;
height:32px;
background-image:url("images/home-module-icon.png"); 
background-repeat:no-repeat;
cursor:pointer;
}
.home-module:hover{
margin-left:10px;
padding-right:10px;
display:inline-block;
width:32px;
height:32px;
background-image:url("images/home-module-icon-hover.png"); 
background-repeat:no-repeat;
cursor:pointer;
}
.alert-module-none{
background-image:url("images/alert-module-icon-none.png"); 
background-repeat:no-repeat;
cursor:pointer;
}
.alert-module-read{
background-image:url("images/alert-module-icon-read.png"); 
background-repeat:no-repeat;
cursor:pointer;
}
.alert-module-new{
background-image:url("images/alert-module-icon-new.png"); 
background-repeat:no-repeat;
cursor:pointer;
}

.calltimer { color:#265E26 ; font-size: 13px; font-weight: bold; z-index:402; width:200px; position:absolute; top:7px; left:250px; }

.calendar-dayabbr,
.grid .GridItem td .calendar td table tr td .calendar-dayabbr, 
.grid .GridAltItem td .calendar td table tr td .calendar-dayabbr { background-color: #3C78B7; }

.background-main{ font-size:14px; color:black; font-weight:300; padding:5px; }
.background-main .title { font-size:16px; color:black; font-weight:400; }
.background-main .infotext { font-size:12px; color:#006180; font-weight:300; }
.background-main .lbl { font-size:11px; color:maroon;}

.background-one{ background-color:#37b437; font-size:14px; color:black; font-weight:300; padding:10px; }
.background-one .title { font-size:16px; color:white; font-weight:400; }
.background-one .infotext { font-size:13px; color:gray; font-weight:300; }
.background-one .lbl { font-size:11px; color:black;}

.background-two{ background-color:#F9F9F9; font-size:14px; color:#001d35; font-weight:300; padding:5px; }
.background-two .title { font-size:16px; color:#001d35; font-weight:300; }
.background-two .infotext { font-size:13px; color:#000; font-weight:300; }
.background-two .lbl { font-size:11px; color:#000;}

.background-three{ background-color:#F9F9F9; font-size:14px; color:black; font-weight:300; padding:5px; }
.background-three .title { font-size:16px; color:black; font-weight:300; }
.background-three .infotext { font-size:13px; color:gray; font-weight:300; }
.background-three .lbl { font-size:11px; color:#000;}

.background-four{ background-color:#F0A350; font-size:14px; color:black; font-weight:300; padding:5px; }
.background-four .title { font-size:16px; color:black; font-weight:300; }
.background-four .infotext { font-size:13px; color:gray; font-weight:300; }
.background-four .lbl { font-size:11px; color:#000;}
.background-four a:link {text-decoration:none; font-size:12px; color:blue; font-weight:300; }
.background-four a:hover { font-size:12px; color:red; font-weight:300; }

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

.rowcolor2 { color:black; background-color:#eee;/*EAF5FF*/}
.rowcolor2 td a:link {text-decoration:none; color:blue; }
.rowcolor2 td a:visited {text-decoration:none; color:blue;}
.rowcolor2 td a:hover {  color:red; }
.rowcolor2 td .title { font-size:16px; color:black; font-weight:400 }
.rowcolor2 td .infotext { font-size:13px; color:#006180; font-weight:300 }
.rowcolor2 td .lbl {font-size:11px; color:maroon;}

/***************************/
/***************************/
/*INVOICE HEADER STYLES*/
.rowcolorPartsHeader
{
background: #62a9d6; /* Old browsers */
}
.rowcolorPartsHeader label.lbl{color:#FFF;}
.rowcolorJobHeader{ 
background: #ca6c6c;
} 

.rowcolorJobHeader .h2 { color:#000;}
.rowcolorJobHeader td { color:#000;}

#tabs { 
position:absolute; 
top:40px; 
left:160px; 
height:40px; 
font-size:16px; 
font-weight: 300; 
min-width:700px;
}
#tabs ul, #tabs2 ul { margin: 10px; padding: 0px; }
#tabs ul li, #tabs2 ul li { float:left; display:block; list-style-type: none; padding: 0px; margin-top: 0; margin-bottom: 0; background: url("images/nav-divider.png") no-repeat scroll right center transparent; }
#tabs ul li .l-link{ padding-top: 3px; padding-bottom: 3px; }
#tabs ul li .l-link img{ vertical-align: middle; }
#tabs .selected_module { color:#FFF; }
#tabs ul li>a { float:left; text-decoration:none; color:#FFF; display: block; padding-left: 10px; padding-right: 10px; font-size: 17px; font-weight: 500; }
#tabs2 ul li>a { float:left; text-decoration:none; color:#FFF; display: block; padding-left: 10px; padding-right: 10px; font-size: 14px; font-weight: 500; }
#tabs ul li>a:hover, #tabs2 ul li>a:hover { color: Yellow; }
#tabs a:hover>span { color:#FFF; }
#tabs>a:hover { }
#tabs a:hover>span { }
/*** END Module Menu ***/

.popup_layer td a:link, .popup_layer_overlay td a:link {
	color: blue;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	}
.popup_layer td a:hover, .popup_layer_overlay td a:hover {
	color: red;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	}

/*//TKS 04.15.2014 #50926 color block around the current location to highlight it and make it stick out*/
#header_location_highlight{
height:10px; 
background-color:#74A4BA; 
padding:0 5px 0 5px;
display:inline;
}

/*this is located in the contacts/cv_updatestatus.php file*/
a.header_contact_phone:link { color:Yellow; }
a.header_contact_phone:hover { color:#FFF; }
#reg_statusheader>a{ color:Yellow; }


#icon_collapse_left_menu{color:#1c7ac0;} 
/*buttons with gradient background*/
.ui-widget input[ type="button" ], input[type=button] 
{ 
font-size: 11px;
cursor: pointer; 
padding: 6px 12px;
border-radius: 6px;
border: none;
background: #4070a4;
box-shadow: 0px 0.5px 1px rgba(0, 0, 0, 0.1), inset 0px 0.5px 0.5px rgba(255, 255, 255, 0.5), 0px 0px 0px 0.5px rgba(0, 0, 0, 0.12);
color: #FFF;
user-select: none;
-webkit-user-select: none;
/*
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 #125385; 
color: #FFFFFF; 
padding: .4em 1em; 
background: #62a9d6; 
background: -moz-linear-gradient(top,  #62a9d6 0%, #4881a8 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#62a9d6), color-stop(100%,#4881a8)); 
background: -webkit-linear-gradient(top,  #62a9d6 0%,#4881a8 100%); 
background: -o-linear-gradient(top,  #62a9d6 0%,#4881a8 100%); 
background: -ms-linear-gradient(top,  #62a9d6 0%,#4881a8 100%); 
background: linear-gradient(to bottom,  #62a9d6 0%,#4881a8 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#62a9d6', endColorstr='#4881a8',GradientType=0 ); 
*/
}


.ui-widget input[ type="button" ]:hover, input[type=button]:hover { background-color:#6e8fdf; }
/*
//TKS 02.01.2013 #29991
JQuery UI builds items on the fly and applies the styles
//automatically. the first one we currently have installed is blue. So to fix the header
//color and border so that across the board we can change it in all templates
//I created new class prefixes to replace the ui- prefixes with .drag- 
//and our CSS style sheet handles how they look. This swaps the class name once it loads
//to my class so that it looks proper.
*/
/* draggable dialog style*/
.drag-widget-content { border: 1px solid #a6c9e2; background: #fcfdfd url(images/ui-bg_inset-hard_100_fcfdfd_1x100.png) 50% bottom repeat-x; color: #222222; }
.drag-widget-content a { color: #222222; }
.drag-widget-header { border: 1px solid #56B1B1; background:#E1E3F0; color: #125385; font-weight: bold; }
.drag-widget-header a { color: blue; text-decoration:none;}
.drag-widget-header a:hover { color: red; text-decoration:none;}
.drag-corner-all { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.drag-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }
.drag-dialog .drag-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; transform: scale(1); transform-origin: 0 0; }
.ui-draggable .drag-dialog-titlebar { cursor: move; }

.drag-dialog .drag-dialog-titlebar { padding: .4em 1em; position: relative;  }
.drag-dialog .drag-dialog-title { float: left; margin: .1em 16px .1em 0; } 
.drag-dialog .drag-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
.drag-dialog .drag-dialog-titlebar-close span { display: block; margin: 1px; }
.drag-dialog .drag-dialog-titlebar-close:hover, .drag-dialog .drag-dialog-titlebar-close:focus { padding: 0; }
.drag-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
.drag-icon { width: 16px; height: 16px; background-image: url(images/drag-icons-grey.png); }
.drag-icon-close { background-position: -80px -128px; }
.drag-icon-closethick { background-position: -96px -128px; }
.drag-widget-content .drag-icon {background-image: url(images/drag-icons-grey.png); }
.drag-widget-header .drag-icon {background-image: url(images/drag-icons-grey.png); }
.drag-state-default .drag-icon { background-image: url(images/drag-icons-grey.png); }

/* TKS 1-17-11 style for loading calendar quick view event in header area from alert window*/
.alert_cal_quickview { position:absolute; top:35px; right:400px; z-index: 250; }
.alert_btn_and_box { display:inline; } 
.alert_info_btn { float:left; font-size:0.8em; cursor:pointer; }
/*.alertpopup { position:fixed; bottom:0px; right:0px; z-index: 250; width:250px; color: #333; font-weight: normal; }*/
/* link colors for dashboard control panel on left*/
#reg_left2 a:link {text-decoration:none; font-size:12px; color:#2D5391; font-weight:300 }
#reg_left2 a:hover { font-size:12px; color:red; font-weight:300 }

/*classes for module drawer*/
#trigger img {cursor:pointer; position:absolute; top:0px;}
.panel {
position:relative;
top:0px;
left:150px;
margin-left:16px;
display: none;
background-color:#1b82d0;
border: thin solid #FFF;
width: 120px;
height: auto;
z-index:1;
} 
.panel.left {
border-bottom-right-radius: 15px;
border-top-right-radius: 15px;
left: 0;
padding: 10px 30px 10px 10px;
}
.panel.left a 
{ 
text-decoration:none; 
color:#FFF; 
padding-left: 10px; 
padding-right: 10px; 
font-size: 17px; 
font-weight: 500; 
}
.panel.left a:hover { color: Yellow; }


/******************************/
/*//TKS 07.30.2014 #55679 our jquery ui uses a customer template
therefore all teh images are for that template. We need multiple 
template images for green and red so I copied the classes here so we have control
since our style sheet loads after the jquery ui, these will override those settings
I also uploaded different images per template*/
.ui-widget-header {
border: 1px solid #4297d7;
background: #5c9ccc url("images/ui-bg_gloss-wave_55_5c9ccc_500x100.png") 50% 50% repeat-x;
color: #ffffff;
font-weight: bold;
}
.ui-widget-header a {
	color: #ffffff;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
border: 1px solid #c5dbec;
background: #dfeffc url("images/ui-bg_glass_85_dfeffc_1x400.png") 50% 50% repeat-x;
font-weight: bold;
color: #2e6e9e;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
	color: #2e6e9e;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
border: 1px solid #79b7e7;
background: #d0e5f5 url("images/ui-bg_glass_75_d0e5f5_1x400.png") 50% 50% repeat-x;
font-weight: bold;
color: #1d5987;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
	color: #1d5987;
	text-decoration: none;
}

.ui-widget-content{
border: 1px solid #A6C9E2;
font-size: 13px;
font-weight: normal;
}
/******************************/

.sales_summary_single_block_hdr{
display:block;
position:relative;
font-weight:bold;
font-size:14px;
clear:both;
width:100%;
text-align:center;
border-bottom: thin solid #DCDCDC;
/*gradient*/
background: #f0f9ff; /* Old browsers */
background: -moz-linear-gradient(top,  #f0f9ff 0%, #cbebff 47%, #a1dbff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#a1dbff',GradientType=0 ); /* IE6-9 */
}


/* 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;
}


/*TKS 144502 sales manager dash with widgets*/
/******************************/
.dash_nav{
height:50px;
width:100%;
background-color:#cedffb;
color:#FFF;
font-size:32px;
}
.dash_nav_item_active{
background-color:#83B0F9;
}
div.dash_nav div a:link, div.dash_nav div a:visited{
color:#2A648B;
}


.icon_1x1{
color: #2A648B;
cursor:pointer;
margin-top:8px;
padding-bottom:8px;
width:100%;
text-align:center;
}
.widget_appt_left i.fas, .widget_appt_left i.far{ 
color:#2A648B;
font-size:24px;
}
.widgetpaging{
color: white !important; 
background-color:#2A648B; 
padding: 5px; 
margin: 3px; 
height: 40px; 
width:99%;
border-spacing: 0px; 
white-space:nowrap; 
vertical-align: bottom; 
}