/*AppContent*/

.leftTable, .topTable {
    background-color: var(--default_back_color); 
    border-color: var(--darkNeutral_border_color); 
}
.rightDetails, .bottomDetails {
    background-color: var(--default_back_color); 
    border-color: var(--darkNeutral_border_color); 
}
#splitter, #hsplitter {
	border-left-color: var(--mediumNeutral_border_color);
	border-right-color: var(--mediumNeutral_border_color);
	border-top-color: var(--mediumNeutral_border_color);
	border-bottom-color: var(--mediumNeutral_border_color);
}
.splitterLeftPanel, .splitterTopPanel {
	background-color: var(--default_back_color);
	border-top-color: var(--mediumNeutral_border_color);
	border-bottom-color: var(--mediumNeutral_border_color);
	border-left-color: var(--mediumNeutral_border_color);
	border-right-color: var(--mediumNeutral_border_color);
}
.splitterRightPanel, .splitterBottomPanel {
	background-color: var(--default_back_color);
	border-top-color: var(--mediumNeutral_border_color);
	border-bottom-color: var(--mediumNeutral_border_color);
	border-left-color: var(--mediumNeutral_border_color);
	border-right-color: var(--mediumNeutral_border_color);
}
.splitterTopBorder {
    background-color: var(--lightNeutral_back_color); 
    border-top-color: var(--lightHighlight_border_color); 
}

/*Old Splitter (NEW splitter CSS moved to jquery.splitter.css 8/17/2013 SGY)
/*===========================================================================*/
.vsplitbar {
    background-color: var(--lightNeutral_back_color); 
    border-left-color: var(--darkNeutral_border_color); 
    border-right-color: var(--darkNeutral_border_color);
}
.hsplitbar {
    background-color: var(--lightNeutral_back_color); 
    border-top-color: var(--darkNeutral_border_color); 
    border-bottom-color: var(--darkNeutral_border_color); 
}
.vsplitbar.active, .vsplitbar:hover, .hsplitbar.active, .hsplitbar:hover {
    background-color: var(--mediumHighlight_back_color); 
}
/*==========================================================================*/

.appBody {
	background-color: var(--lightNeutral_back_color); 
}
.appTableHeader {
	background-color: var(--mediumNeutral_back_color);
	color: var(--mediumNeutral_text_color);
	border-color: var(--mediumNeutral_border_color);
}
.appButtonBar {
	background-color:  var(--appbuttonbar_back_color); 
	border-top-color: var(--appbuttonbar_border_color); 
	border-bottom-color: var(--appbuttonbar_border_color); 
}

.appEditArea 
{
	background-color: var(--default_back_color);
	border-top-color: var(--lightHighlight_border_color); 
	border-right-color: var(--lightHighlight_border_color); 
	border-bottom-color: var(--lightHighlight_border_color); 
	border-left-color: var(--lightHighlight_border_color); 
}
.DnDrowDragClass
{
    background-color: var(--lightHighlight_back_color);
}

/*
------------------------------------------------
Background Color Classes 
------------------------------------------------
*/

.darkHighlight {
	background-color: var(--darkHighlight_back_color) !important;
	color: var(--darkHighlight_text_color) !important;
}
.mediumHighlight {
	background-color: var(--mediumHighlight_back_color) !important;
	color: var(--mediumHighlight_text_color) !important;
}
.lightHighlight {
	background-color: var(--lightHighlight_back_color) !important;
	color: var(--lightHighlight_text_color) !important;
}
.darkNeutral {
	background-color: var(--darkNeutral_back_color) !important;
	color: var(--darkNeutral_text_color) !important;
}
.mediumNeutral {
	background-color: var(--mediumNeutral_back_color) !important;
	color: var(--mediumNeutral_text_color) !important;
}
.lightNeutral {
	background-color: var(--lightNeutral_back_color) !important;
	color: var(--lightNeutral_text_color) !important;
}
.panelNeutral {
	background-color: var(--panelNeutral_back_color);
	color: var(--panelNeutral_text_color);
}
/*
------------------------------------------------
Border Color Classes
------------------------------------------------
*/

.darkHighlightBorder
{
    border-color: var(--darkHighlight_border_color); 
}
.mediumHighlightBorder
{
    border-color: var(--mediumHighlight_border_color); 
}
.lightHighlightBorder
{
    border-color: var(--lightHighlight_border_color); 
}
.darkNeutralBorder
{
    border-color: var(--darkNeutral_border_color);
}
.mediumNeutralBorder
{
    border-color: var(--mediumNeutral_border_color); 
}
.lightNeutralBorder
{
    border-color: var(--lightNeutral_border_color); 
}

/*
------------------------------------------------
Font Foreground Color Classes
------------------------------------------------
*/

.darkHighlightColor
{
    color: var(--darkHighlight_color); 
}
.mediumHighlightColor
{
    color: var(--mediumHighlight_color); 
}
.lightHighlightColor
{
    color: var(--lightHighlight_color); 
}
.darkNeutralColor
{
    color: var(--darkNeutral_color); 
}
.mediumNeutralColor
{
    color: var(--mediumNeutral_color); 
}
.lightNeutralColor
{
    color: var(--lightNeutral_color); 
}

/*
------------------------------------------------
App Column Menu (Vertical)
------------------------------------------------
*/

.appColumnMenu {
	float: left;
	width: 150px;
	height: 100%;
	background-color: var(--mediumNeutral_back_color);
	color: var(--mediumNeutral_text_color);
}  

.ColumnMenu {
	width: 150px;
	margin-top: 0px;
	border-style: none none none none;
	border-color: var(--mediumNeutral_border_color); 
	border-width: 1px;
	}
    
.ColumnMenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
    }
    	
.ColumnMenu li a {
	height: 32px;
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	height: 24px;
	text-decoration: none;
	font-weight: bold;
	font-size: 0.9em;
	}

	.ColumnMenu li a:link, .ColumnMenu li a:visited {
		display: block;
		border-right: solid 1px var(--columnmenu_li_border_right_color);
		border-bottom: solid 1px var(--columnmenu_li_border_bottom_color);
		border-left: solid 1px var(--columnmenu_li_border_left_color);
		border-top: solid 1px var(--columnmenu_li_border_top_color);
		background-color: var(--columnmenu_li_back_color);
		color: var(--columnmenu_li_text_color);
		padding: 8px 0 0 5px;
	}

	.ColumnMenu li a:hover {
		background-color: var(--columnmenu_li_hover_back_color);
		color: var(--columnmenu_li_hover_text_color);
		border-right: solid 1px var(--columnmenu_li_hover_border_right_color);
		border-bottom: solid 1px var(--columnmenu_li_hover_border_bottom_color);
		border-top: solid 1px var(--columnmenu_li_hover_border_top_color);
		padding: 8px 0 0 5px;
	}

.ColumnMenu li a:focus {
    outline: none;
}

	.ColumnMenu li.selected a {
		background-color: var(--columnmenu_li_selected_back_color);
		color: var(--columnmenu_li_selected_text_color);
		border-top: solid 1px var(--columnmenu_li_selected_border_top_color);
		border-right: solid 1px var(--columnmenu_li_selected_border_right_color);
		border-bottom: solid 1px var(--columnmenu_li_selected_border_bottom_color);
		padding: 8px 10px 0 0;
		text-align: right;
	}

.ColumnMenu li.selected a.last {
    border-bottom: solid 1px var(--columnmenu_li_selected_border_bottom_color); 
	}

/*
------------------------------------------------
Table Sorter 
------------------------------------------------
*/

.header:hover {
	background-color: var(--lightNeutral_back_color);
	color: var(--lightNeutral_text_color);
	cursor: pointer;
}

/*
------------------------------------------------
Cafeteria ten-key button colors & gradients
------------------------------------------------
*/
.tkKey-grad {
    	background-image:radial-gradient(circle, #426788 0%,#002556 100%);
    	}
.tkKey-flat {
	background-color: var(--mediumHighlight_back_color); 
    	}
.sp-picker-container {
	background-color: var(--mediumNeutral_back_color); 
}
.sp-palette-container {
	background-color: var(--mediumNeutral_back_color); 
}