:root {

	--bgc_separator: #1570A5;
	--bgc_title: #7dafc4;

	--fgc_def: #EEE;
	--bgc_def: #465f6a;
	--cnc_def: #465f6a; 
	
	--fgc_param: #FFF;
	--bgc_param: #018a01;
	--cnc_param: #016301;

	--fgc_locked: #FFF;
	--bgc_locked: #AAAAAA;
	--cnc_locked: #777777;

	--fgc_chart: #FFF;
	--bgc_chart: #0080c0;
	--cnc_chart: #005f8c;
	
	--fgc_report: #FFF;
	--bgc_report: #800280;
	--cnc_report: #4e024e;

	--fgc_cnt: #FFF;
	--bgc_cnt: #e3c801;
	--cnc_cnt: #b39c01;

	--fgc_err: #FFF;
	--bgc_err: #d00000;
	--cnc_err: #800000;

	--fgc_cloud: #FFF;
	--bgc_cloud: #1e90ff;
	--cnc_cloud: #176fc5;

	--fgc_nav: #FFF;
	--bgc_nav: #0146aa;
	--cnc_nav: #000080;

	--fgc_std: #33444c;
	--bgc_std: transparent;
	--cnc_std: #33444c;

	--fgc_std_inv: WhiteSmoke;
	--bgc_std_inv: transparent;
	--cnc_std_inv: WhiteSmoke;

	--fgc_tabact: WhiteSmoke;
	--bgc_tabact: #7dafc4;
	--cnc_tabact: #7dafc4;
	--boc_tabact: #465f6a;

	--fgc_tabinact: #DDD;
	--bgc_tabinact: transparent;
	--cnc_tabinact: transparent;
	--boc_tabinact: #7996a3;

	/*--bgc_tabinact: rgba(255,255,255,0.3);
	--cnc_tabinact: rgba(255,255,255,0.3);*/

}

/* ==========================================================================
   COLORS styles
   ========================================================================== */
   
   
.color-mainwnd
{
	background-color:WhiteSmoke;
	color:#000;
}

.color-authwnd
{
	background-color:#33444c;
	color:#FFFFFF;
}

.color-wingrey
{
	background-color:#C0C0C0;
	color:#000;
}   

.color-separator
{
	/*background-color:#1e90ff;*/
	background-color:#1570A5;
	
	color:#FFF;
}

.color-separator-background
{
	border-top-color:#cdbdd5;
	border-bottom-color:#EEEEEE;
	
}

.color-footer
{
/*	background-color:#1570A5;*/
	background-color:#1e90ff;
	color:#FFF;
}

.color-stdbar
{
	background-image: linear-gradient(grey,grey);
	color:black;
}

/* Tab Folder */
.tabfolder
{
	/*background-color: #c0c0c0;*/
	background-color: #33444c;
}



/*Panel*/
.Wt-panel {
  background-color: White; 
  border-color:White;
}

.Wt-panel .titlebar {
  background-color: #7dafc4; 
  color: #FFFFFF;
}

.Wt-panel .body {
  background-color: White;
}


 
/* defaultfarbe Buttons */
.color-def,
.color-def.siocs-btn
{
	/*color:#000;*/
	color:var(--fgc_def);
	background-color:var(--bgc_def);
}
/* defbutton Kontrastfarbe */
.color-def.siocs-btn span
{
	background-color:var(--cnc_def);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-def.siocs-btn span:before
{
	background-color:var(--cnc_def);
}

/* Farbe für Parameter */
.color-param,
.color-param.siocs-btn
{
	color:var(--fgc_param);
	background-color:var(--bgc_param);

}
/* Parameter Kontrastfarbe */
.color-param.siocs-btn span
{
	background-color: var(--cnc_param);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-param.siocs-btn span:before
{
	border-top-color:var(--cnc_param);
}

/* Farbe für Parameter */
.color-locked,
.color-locked.siocs-btn
{
	color:var(--fgc_locked);
	background-color:var(--bgc_locked);
}
/* Parameter Kontrastfarbe */
.color-locked.siocs-btn span
{
	background-color: var(--cnc_locked);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-locked.siocs-btn span:before
{
	border-top-color: var(--cnc_locked);
}


/* Farbe für Chart */
.color-chart,
.color-chart.siocs-btn
{
	color:var(--fgc_chart);
	background-color:var(--bgc_chart);
	border-bottom:1px solid var(--cnc_chart);
	
}
/* Parameter Kontrastfarbe */
.color-chart.siocs-btn span
{
	background-color: var(--cnc_chart);
/*	Kontrastfarbe hat hier anderen Zweck*/
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-chart.siocs-btn span:before
{
	border-top-color:var(--cnc_chart);
}


/* Farbe für Statistik */
.color-report,
.color-report.siocs-btn
{
	color:var(--fgc_report);
	background-color:var(--bgc_report);
}
/* Parameter Kontrastfarbe */
.color-report.siocs-btn span
{
	background-color: var(--cnc_report);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-report.siocs-btn span:before
{
	border-top-color:var(--cnc_report);
}

/* Farbe für Zähler */
.color-cnt,
.color-cnt.siocs-btn
{
	color:var(--fgc_cnt);
	background-color:var(--bgc_cnt);
}
/* Zähler Kontrastfarbe */
.color-cnt.siocs-btn span
{
	background-color: var(--cnc_cnt);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-cnt.siocs-btn span:before
{
	border-top-color:var(--cnc_cnt);
}

/* Farbe für Fehler */
.color-err,
.color-err.siocs-btn
{
	color:var(--fgc_err);
	background-color:var(--bgc_err);
}
/* Fehler Kontrastfarbe */
.color-err.siocs-btn span
{
	background-color: var(--cnc_err);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-err.siocs-btn span:before
{
	border-top-color:var(--cnc_err);
}

/* Farbe für Cloud */
.color-cloud,
.color-cloud.siocs-btn
{
	color:var(--fgc_cloud);
	background-color:var(--bgc_cloud);
}
/* Fehler Kontrastfarbe */
.color-cloud.siocs-btn span
{
	background-color: var(--cnc_cloud);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-cloud.siocs-btn span:before
{
	border-top-color:var(--cnc_cloud);
}

/* Für Navigation allgemein */
.color-nav,
.color-nav.siocs-btn
{
	color:var(--fgc_nav);
	background-color:var(--bgc_nav);
}
/* Navigation Kontrastfarbe */
.color-nav.siocs-btn span
{
	background:var(--cnc_nav);
}
/* Abschrägung gleich wie Kontrastfarbe */
.color-nav.siocs-btn span:before
{
	border-top-color:var(--cnc_nav);
}


/* Für Standardbuttons */
.color-std,
.color-std.siocs-btn
{
	/*color:#333;*/
	color:var(--fgc_std);/*wie spin-buttons-ctrl*/
	background-color:var(--bgc_std);
}
/* Keine Kontrastfarbe -> gleich wie Hintergrund*/
/* Navigation Kontrastfarbe */
.color-std.siocs-btn:hover
{

/*	Kontrastfarbe hat hier anderen Zweck*/
	border-bottom:1px solid var(--cnc_std);
	border-radius:0px;
}

/* Für Standardbuttons */
.color-std_inv,
.color-std_inv.siocs-btn
{
	color:var(--fgc_std_inv);
	background-color:var(--bgc_std_inv);
}
/* Keine Kontrastfarbe -> gleich wie Hintergrund*/
/* Navigation Kontrastfarbe */
.color-std_inv.siocs-btn:hover
{
/*	Kontrastfarbe hat hier anderen Zweck*/
	border-bottom:1px solid var(--cnc_std_inv);
	border-radius:0px;	
}


/* Für Aktive Tab-Buttons */
.color-tabact,
.color-tabact.siocs-btn
{
	/*color:#333;*/
	color:var(--fgc_tabact);
	background-color:var(--bgc_tabact);
}
.color-tabact.siocs-btn span
{
	background-color: var(--cnc_tabact);
	border-width: 0px 3px 0px 0px;
	border-style: solid;
	border-color: var(--boc_tabact);;
}


/* Für Inaktive Tab Buttons */
.color-tabinact,
.color-tabinact.siocs-btn
{
	color:var(--fgc_tabinact);
	background-color:var(--bgc_tabinact);
	border: 1px solid var(--boc_tabinact);
}
.color-tabinact.siocs-btn span
{
	background-color:var(--bgc_tabinact);
	border-width: 0px 4px 0px 0px;
	border-style: double;
	border-color: var(--boc_tabinact);
}




input {
    border: solid 1px #aacfe4;
	/*background-color:#d4dce9;*/
	background-color:SmokeWhite;
}
select {
    border: solid 1px #aacfe4;
	background-color:SmokeWhite;
}

.Wt-treeview {
	border:1px solid #aacfe4;
}



.Wt-itemview .Wt-headerdiv,
.Wt-itemview .Wt-headerdiv .Wt-tv-rowc,
.Wt-itemview th {
    background-color: #c0c0c0;
}

/*
 * WSlider-Farben in siocs_default
 -> evtl später über Widget einstellbar
 */

 
 .Wt-dialog {
	background-color: White;
 }
 
 .Wt-dialog .titlebar {
	background-color: #465f6a; 
	color: #FFFFFF;
 	
}
.Wt-form p {
    color: #BBBBBB;
}

.Wt-form .Wt-fields .Wt-info {
    color: #7dafc4;
}

.Wt-form .Wt-error {
    color: black;
}

.siocs-form .siocs-info {
    color: #7dafc4;
}



/*siocs-form wird durch Wt-form in siocs_form.css übernommen

.siocs-form  p {
    border-bottom: solid 1px #b7ddf2;
}

.siocs-fields input, .siocs-fields select
{
	background-color:White;
}
.siocs-form .siocs-info 
{
    color: #666666;
}

.siocs-form .siocs-error {
    color: black;
}
*/
