/* -----------------------------------------------------------------------
/* <copyright file="colors.css" company="ViCon GmbH">
/*     Copyright © ViCon GmbH.
/* </copyright>
/* <summary>
/*		This file provides all styles for coloring
/*		this web apps content.
/* </summary>
/* -----------------------------------------------------------------------*/

/* --------------------------------------------------------- COLORS --------------------------------------------------------- */

:root{
	--accent: #005EA8;
	--dark-accent: #002E51;	
	--light-grey: #EFEFEF;	
	--grey: #E0E0E0;
	--dark-grey: #CCCCCC;
	--window: #5E676B;
	--text: #5E676B;
	--light-text: #fff;
}

/* --------------------------------------------------------- GENERAL --------------------------------------------------------- */

/* tables */
.propTable{
	color: #5E676B;
	color: var(--text);
}

td a{
	color: #005EA8;
	color: var(--accent);
}

#copyright{
	color: #fff;
}


/* -------------------------------------------------------- NAVIGATION ------------------------------------------------------- */


/* breadcrump */
#whereami li a:after{
	border-left-color: #E0E0E0;
	border-left-color: var(--grey);
}

#whereami li a:before{
	border-left-color: #fff;
}

#whereami li a{
	background: #E0E0E0;
	background: var(--grey);
	color: #5E676B;
	color: var(--text);
	border-right-color: #fff;
}

#whereami li:last-child a{
	background: #005EA8;
	background: var(--accent);
	border-right-color: #005EA8;
	border-right-color: var(--accent);
	color: #fff;
}

#whereami li a:hover:after{
	border-left-color: #005EA8;
	border-left-color: var(--accent);
}

#whereami li:last-child a[href="#"]:after{
	border-left-color: #E0E0E0;
	border-left-color: var(--grey);	
}

#whereami li:last-child a[href="#"]:hover{
	background: #005EA8;
	background: var(--accent);
	color: #fff;
}

#whereami li:last-child a[href="#"]:hover:after{
	border-left-color: #005EA8;
	border-left-color: var(--accent);	
}

#whereami li:last-child a[href="#"]{
	background-color: #E0E0E0;
	background-color: var(--grey);
	color: #5E676B;
	color: var(--text);
}

/* menu */
#tabs{
	background: #EFEFEF;
	background: var(--light-grey);
}

#objectNav{
	background: #EFEFEF;
	background: var(--light-grey);
	border-top-color: #005EA8; 	
	border-top-color: var(--accent); 	
}

#navibar ul li a.menuActive{
	background: #005EA8;
	background: var(--accent);
	color: #fff;
}

#navibar ul li a:hover, #whereami li a:hover, #contextmenu li a:hover {
	background: #005EA8;
	background: var(--accent);
	color: #fff;
}

#naviProcessesLink, #naviInformationLink, #naviAreasLink{
	background: #EFEFEF;
	background: var(--light-grey);
	color: #5E676B;
	color: var(--text);
}

#naviProcessesLink.menuActive, #naviInformationLink.menuActive, #naviAreasLink.menuActive{
	background: #005EA8;
	background: var(--accent);
	color: #fff;
	color: var(--light-text);
}

#naviHistoryLink, #naviZoomLink, #naviFeedbackLink, #hyperlinkMenuLink{
	background: #E0E0E0;
	background: var(--grey);
	color: #5E676B;	
	color: var(--text);	
}

#naviUsers a, #naviSettingsLink, #naviHelpLink{
	background: #EFEFEF;
	background: var(--light-grey);
	color: #5E676B;		
	color: var(--text);		
}

#foldersbutton {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #EFEFEF;
	border-left-color: var(--light-grey);
	background-color: #005EA8;
	background-color: var(--accent);
}

	#foldersbutton:hover {
		background-color: #002E51;
		background-color: var(--dark-accent);
	}

#searchField{
	background: #002E51;
	background: var(--dark-accent);
	border: none;
	color: #EFEFEF;
	color: var(--light-grey);
}

#searchButton{
	background: #002E51;
	background: var(--dark-accent);
}

#searchButton:hover{
	background: #005EA8;
	background: var(--accent);
}

ul.dropdown{
	background: #EFEFEF;
	background: var(--light-grey);
	border-top-color: #005EA8;
	border-top-color: var(--accent);
}

/* treeview */
/* switch between all and personalized objects */
.tabstrip ul{
	background: #002E51;
	background: var(--dark-accent);
}

.tabstrip ul li a{
	color: #EFEFEF;
	color: var(--light-grey);
}

.tabstripActive{
	border-bottom-color: #EFEFEF;
	border-bottom-color: var(--light-grey);
}

/* treeview content */
.treeViewNoTabs{
	background: #EFEFEF;
	background: var(--light-grey);
}

/*  show/hide Header */

.showHeader{
	background-color: #005EA8;
	background-color: var(--accent);
}

/* -------------------------------------------------- WINDOWS ------------------------------------------------------ */
.box{
	background: #fff;
	border-color: #5E676B;
	border-color: var(--window);
}

.boxTop h1{
	color: #EFEFEF;
	color: var(--light-text);
	background: #5E676B;
	background: var(--window);
}

.boxTop h1 span:hover { 
	background-color: #002E51;
	background-color: var(--dark-accent);
}

.box h2{
	color: #5E676B;	
	color: var(--text);	
}

.box p{
	color: #5E676B;	
	color: var(--text);	
}

/* -------------------------------------------------- PROPERTIES WINDOW ------------------------------------------------------ */

#propertiesWindowContent{
	background: #EFEFEF;
	background: var(--light-grey);
	border-left-color: #005EA8;
	border-left-color: var(--accent);
}

#propertiesWindowNavigation ul li a{
	color: #5E676B;	
	color: var(--text);	
}

#propertiesWindowNavigation ul li.propertiesActive, #propertiesWindowNavigation ul li:not([disabled]):hover{
	background: #005EA8;
	background: var(--accent);
}

#propertiesWindowNavigation ul li.propertiesActive a, #propertiesWindowNavigation ul li:not([disabled]):hover a {
    color: #fff;
}

.searchHit:after{
	background: #005EA8;
	background: var(--accent);
}

.kpiGoalReached {
    color: green;
}

.kpiGoalNotReached {
    color: red;
}

/* --------------------------------------------- PRINT-/ SETTINGS-/ ZOOM BOX ------------------------------------------------- */

/* --------------------------------------------------------- SETTINGS BOX ---------------------------------------------------- */

/* ---------------------------------------------------------- ZOOM BOX ------------------------------------------------------- */

#zoomEvents{
	border-color: #5E676B;
	border-color: var(--window);	
}

/* ---------------------------------------------------------- RESULT BOX ----------------------------------------------------- */

#resultData{
	background: #fff;
}

/* ~~~ property window content ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~ search result window content ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~ what's changed box ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.propTable:not(.sortable) tr:nth-child(odd){
	background: none;
}

.propTable tr:nth-child(odd){
	background: #E0E0E0;
	background: var(--grey);
}