:root[data-theme="dark"]{

	#page-top {
		background-color: #2d2d2d
	}

	.bg-gradient-primary {
		background-image: linear-gradient(180deg, #232323 10%, #232323 100%);
	}
	.header{
		background: #232323;
	}
	#css3menu1{
		background: #232323;
		background-image: none;

	}
	#content-wrapper {
		background-color: #2d2d2d !important;
	}
	.widget-master{
		background-color: #2d2d2d;
		color:white;
	}
	.box-content{
		background-color: #2d2d2d
	}
	.VerticalGauge canvas{
		background-color: #2d2d2d !important;
	}
	.TrajectoryTable .table-title{
		color : white !important;
	}
	.TrajectoryTable .table-selector{
		background-color: #2d2d2d !important;
	}

	.TrajectoryTable .trajectory-actual{
		color : white !important;
		background-color: #2d2d2d !important;
	}

	.Trajectory3D .widget-slave{
		background-color: #2d2d2d !important;
	}
	.Trajectory3D .legend{
		color : white !important;
	}
	.Trajectory3D .open{
		color : white !important;
	}

	.TableAnnotation tbody td{
		background-color: #2d2d2d !important;
		color : white !important;
	}

	.DepthCostChart .widget-slave{
		background-color: #2d2d2d !important;
	}
	.PieActivity .widget-slave{
		background-color: #2d2d2d !important;
	}
	.ActivityLegend .widget-slave{
		background-color: #2d2d2d !important;
	}
	.ActivityLegend div{
		background-color: #2d2d2d !important;
		color : white !important;
	}
}

:root[data-theme="system"]{
	@media (prefers-color-scheme: dark) {

		#page-top {
			background-color: #2d2d2d
		}

		.bg-gradient-primary {
			background-image: linear-gradient(180deg, #232323 10%, #232323 100%);
		}
		.header{
			background: #232323;
		}
		#css3menu1{
			background: #232323;
			background-image: none;

		}
		#content-wrapper {
			background-color: #2d2d2d !important;
		}
		.widget-master{
			background-color: #2d2d2d
		}
		.box-content{
			background-color: #2d2d2d
		}
		.VerticalGauge canvas{
			background-color: #2d2d2d !important;
		}
		.TrajectoryTable .table-title{
			color : white !important;
		}
		.TrajectoryTable .table-selector{
			background-color: #2d2d2d !important;
		}

		.TrajectoryTable .trajectory-actual{
			color : white !important;
			background-color: #2d2d2d !important;
		}

		.Trajectory3D .widget-slave{
			background-color: #2d2d2d !important;
		}
		.Trajectory3D .legend{
			color : white !important;
		}
		.Trajectory3D .open{
			color : white !important;
		}

		.TableAnnotation tbody td{
			background-color: #2d2d2d !important;
			color : white !important;
		}

		.DepthCostChart .widget-slave{
			background-color: #2d2d2d !important;
		}
		.PieActivity .widget-slave{
			background-color: #2d2d2d !important;
		}
		.ActivityLegend .widget-slave{
			background-color: #2d2d2d !important;
		}
		.ActivityLegend div{
			background-color: #2d2d2d !important;
			color : white !important;
		}
	}
}


ul#css3menu1,ul#css3menu1 ul{
	margin:0;
	list-style:none;
	padding:0;
	background-color:#000000;
	background-image:-o-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(255,255,255,0.16));
	background-image:-moz-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(255,255,255,0.16));
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0.38)),to(rgba(255,255,255,0.16)));
	background-image:-webkit-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(255,255,255,0.16));
	background-repeat:repeat;
	border-width:1px;
	border-style:solid;
	border-color:#343434;
	-moz-border-radius:0px 5px 20px 0px;
	-webkit-border-radius:0px 5px 20px 0px;
	border-radius:0px 5px 20px 0px;
}
ul#css3menu1 ul{
	display:none;position:absolute;right:0;top:100%;-moz-box-shadow:-1.4px 1.4px 2px #B1B1B1;-webkit-box-shadow:-1.4px 1.4px 2px #B1B1B1;box-shadow:-1.4px 1.4px 2px #B1B1B1;background-color:#202020;background-image:-o-linear-gradient(-90deg,rgba(255,255,255,0.16),rgba(255,255,255,0)); background-image:-moz-linear-gradient(-90deg,rgba(255,255,255,0.16),rgba(255,255,255,0));   background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0.16)),to(rgba(255,255,255,0)));  background-image:-webkit-linear-gradient(-90deg,rgba(255,255,255,0.16),rgba(255,255,255,0));border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;border-color:#000000;padding:0;}
ul#css3menu1 li:hover>*{
	display:block;}
ul#css3menu1 li{
	position:relative;zoom:1;display:block;white-space:nowrap;font-size:0;float:left;}
ul#css3menu1 li:hover{
	z-index:1;}
ul#css3menu1 ul ul{
	position:absolute;right:100%;top:0;}
ul#css3menu1{
	padding:3px 3px 3px 0;font-size:0;z-index:999;position:relative;display:inline-block;zoom:1;
	*display:inline;}
ul#css3menu1>li,ul#css3menu1 li{
	margin:3px 0 0 6px;}
* html ul#css3menu1 li a{
	display:inline-block;}
ul#css3menu1 ul>li{
	margin:6px 0 0;}
ul#css3menu1 a:active, ul#css3menu1 a:focus{
	outline-style:none;}
ul#css3menu1 a,ul#css3menu1 a.pressed{
	display:block;vertical-align:middle;text-align:center;text-decoration:none;font:12px Arial;color:#E7E5E5;cursor:pointer;}
ul#css3menu1 ul li{
	float:none;margin:0;}
ul#css3menu1 ul a{
	text-align:left;}
ul#css3menu1 li:hover>a{
	background-color:#7ACF27;border-color:#F8F8F8;border-style:solid;font:12px Arial;color:#333;text-decoration:none;background-image:-o-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7)); background-image:-moz-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7));   background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0.38)),to(rgba(85,170,0,0.7)));  background-image:-webkit-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7));filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#60FFFFFF,endColorstr=#B355AA00)}
ul#css3menu1 img{
	border:none;vertical-align:middle;margin-left:8px;}
ul#css3menu1 img.over{
	display:none;}
ul#css3menu1 li:hover > a img.def{
	display:none;}
ul#css3menu1 li:hover > a img.over{
	display:inline;}
ul#css3menu1 li a.pressed img.over{
	display:inline;}
ul#css3menu1 li a.pressed img.def{
	display:none;}
ul#css3menu1 a{
	padding:3px 15px 4px 15px;background-repeat:repeat;border-width:0;border-style:solid;border-color:transparent;color:#E7E5E5;text-decoration:none;}
ul#css3menu1 li:hover>a,ul#css3menu1 li>a.pressed{
	background-color:#7ACF27;background-image:-o-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7)); background-image:-moz-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7));   background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0.38)),to(rgba(85,170,0,0.7)));  background-image:-webkit-linear-gradient(-90deg,rgba(255,255,255,0.38),rgba(85,170,0,0.7));border-style:solid;border-color:#F8F8F8;color:#333;text-decoration:none;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#60FFFFFF,endColorstr=#B355AA00)}
ul#css3menu1 li.topmenu>a{
	border-width:1px 0 0 0;border-style:solid;border-radius:16px;-moz-border-radius:16px;-webkit-border-radius:16px;font:bold 13px Arial;color:#E7E5E5;text-decoration:none;text-shadow:0 1px 1px #000000;}
ul#css3menu1 li.topmenu:hover>a,ul#css3menu1 li.topmenu>a.pressed{
	background-color:#7dfa00;background-image:-o-linear-gradient(-90deg,rgba(255,255,255,0.77),rgba(85,170,0,0.7)); background-image:-moz-linear-gradient(-90deg,rgba(255,255,255,0.77),rgba(85,170,0,0.7));   background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgba(255,255,255,0.77)),to(rgba(85,170,0,0.7)));  background-image:-webkit-linear-gradient(-90deg,rgba(255,255,255,0.77),rgba(85,170,0,0.7));border-style:solid;border-color:#F8F8F8;font:bold 13px Arial;color:#444444;text-decoration:none;text-shadow:0 1px 0 #C5EAA1;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#C6FFFFFF,endColorstr=#B355AA00)}
ul#css3menu1 li.subfirst>a{
	border-radius:9px 9px 0 0;-moz-border-radius:9px 9px 0 0;-webkit-border-radius:9px;-webkit-border-bottom-right-radius:0;-webkit-border-bottom-left-radius:0;}
ul#css3menu1 li.sublast>a{
	border-radius:0 0 9px 9px;-moz-border-radius:0 0 9px 9px;-webkit-border-radius:0;-webkit-border-bottom-right-radius:9px;-webkit-border-bottom-left-radius:9px;}

#css3menu1 {
	position: relative;
	left: 151px;
	min-height: 47px;
	padding: 0 0 !important;
}
.logo-navita {
	position: absolute;
	width: 150px;
	height: 47px;
}
.colorpicker-input-addon i{
	width:10px;
	height : 10px;
}
.input-group-append .light-color{
	background-color: white !important;
}
.input-group-append .dark-color{
	background-color: #2f2f2f !important;
}