.mainwindow_T44
{
	position: relative;
	left: 2%;
	margin-right: 5%;
	background-image: linear-gradient(-20deg, hsla(0, 0%, 10%, 0) 38%, hsla(20, 0%, 98%, 0.75) 38.3%, hsla(20, 0%, 95%, 0.70) 48%, hsla(0, 0%, 10%, 0) 48.3%),
						linear-gradient(-20deg, hsl(0,0%,6%), hsl(0,0%,19%) 30%, hsl(0,0%,27%) 45%, hsl(0,0%,6%) 80.5%, hsl(30, 1%, 44%) 80.8%, hsl(30, 1%, 44%) 83.3%, hsl(240, 6%, 13%) 83.6%, hsl(0,0%,13%));
 	border: 3px outset #b0b0b0;
	border-top: 3px outset #fff;
	border-left: 3px outset #dadada;
	border-radius: 10px;
	box-shadow: 3px 3px 5px black;
	font-size: 22px;
	text-shadow: 0px 0px 6px black;
	margin-bottom: 40px;
}

.mainwindow_S2
{
	position: relative;
	left: 2%;
	margin-right: 5%;
	background-image: linear-gradient(-20deg, hsla(20, 90%, 50%, 0) 38%, hsla(30, 90%, 95%, 0.75) 38.3%, hsla(30, 90%, 95%, 0.70) 48%, hsla(20, 0%, 10%, 0) 48.3%),
						linear-gradient(-25deg, hsl(45,70%,6%), hsl(45,70%,19%) 30%, hsl(45,70%,27%) 45%, hsl(45,60%,6%) 80.5%, hsl(45, 12%, 54%) 80.8%, hsl(50, 12%, 54%) 83.3%, hsl(45, 6%, 13%) 83.6%, hsl(45,70%,13%));
 	border: 3px outset #b0b0b0;
	border-top: 3px outset #fff;
	border-left: 3px outset #dadada;
	border-radius: 10px;
	box-shadow: 3px 3px 5px black;
	font-size: 22px;
	text-shadow: 0px 0px 6px black;
	margin-bottom: 40px;
}

.led_channel
{
	display: inline-block;
	color: black;
	position: relative;
	height: 280px;
	width: 240px;
	border: 2px outset #eeeeee;
	border-radius: 3px;
	padding: 0px;
	margin: 0px 20px 20px 0px;
	background-image: -webkit-repeating-linear-gradient(91deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0)   3%, hsla(0,0%,100%, .1) 3.75%),
    -webkit-repeating-linear-gradient(90deg, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   2%, hsla(0,0%,  0%,.03) 2.25%),
    -webkit-repeating-linear-gradient(89deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 0.6%, hsla(0,0%,100%,.15) 1.1%),
    
    linear-gradient(180deg, hsl(0,0%,78%)  0%, 
    hsl(0,0%,90%) 47%, 
    hsl(0,0%,78%) 53%,
    hsl(0,0%,70%)100%);
	box-shadow: 4px 4px 3px black;
	text-shadow: 1px 1px 1px white;
}
.led_channel>.bezeichnung
{
	font-size:	14px;
	position:	relative;
	top: 		178px;
	left:		58px;
}
.led_channel>.custom_name {
	position: absolute;
	top: 5px;
	left: 10px;
	font-size: 14px;
	height: 18px;
	overflow-wrap: break-word;
}
.led_channel>.powermeter{
	position: absolute;
	bottom: 50px;
}

.switch_channel {
	display: inline-block;
	color: black;
	position: relative;
	height: 200px;
	width: 200px;
	border: 2px outset #eeeeee;
	border-radius: 3px;
	padding: 0px;
	margin: 0px 20px 20px 0px;
	background-image: -webkit-repeating-linear-gradient(91deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0)   3%, hsla(0,0%,100%, .1) 3.75%),
    -webkit-repeating-linear-gradient(90deg, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   2%, hsla(0,0%,  0%,.03) 2.25%),
    -webkit-repeating-linear-gradient(89deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 0.6%, hsla(0,0%,100%,.15) 1.1%),
    
    linear-gradient(180deg, hsl(0,0%,78%)  0%, 
    hsl(0,0%,90%) 47%, 
    hsl(0,0%,78%) 53%,
    hsl(0,0%,70%)100%);
	box-shadow: 4px 4px 3px black;
	text-shadow: 1px 1px 1px white;
}
.switch_channel>.bezeichnung
{
	font-size:	14px;
	position:	absolute;
	top: 		178px;
	left:		58px;
}
.switch_channel>.custom_name {
	position: absolute;
	width: 150px;
	top: 5px;
	left: 10px;
	font-size: 14px;
	height: 18px;
	overflow-wrap: break-word;
}





.sol_channel {
	display: inline-block;
	color: black;
	position: relative;
	height: 80px;
	width: 240px;
	border: 2px outset #eeeeee;
	border-radius: 3px;
	padding: 0px;
	margin: 0px 20px 20px 0px;
	background-image: -webkit-repeating-linear-gradient(91deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 3%, hsla(0,0%,100%, .1) 7%),
    -webkit-repeating-linear-gradient(90deg, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0) 4%, hsla(0,0%,  0%,.03) 4.5%),
    -webkit-repeating-linear-gradient(90deg, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.3%, hsla(0,0%,100%,.15) 2.5%),
    
    linear-gradient(180deg, hsl(0,0%,78%)  0%, 
    hsl(0,0%,90%) 47%, 
    hsl(0,0%,78%) 53%,
    hsl(0,0%,70%)100%);
	box-shadow: 4px 4px 3px black;
	text-shadow: 1px 1px 1px white;
}
.sol_channel>.bezeichnung
{
	font-size:	14px;
	position:	absolute;
	top: 		178px;
	left:		58px;
}
.sol_channel>.custom_name {
	position: absolute;
	top: 5px;
	left: 10px;
	font-size: 14px;
	height: 18px;
	overflow-wrap: break-word;
}

.board_type {						
	position: absolute;
	transform: rotate(-90deg);
	text-align: left;
	left: -12px;
	bottom: -28px;
	font-size: 30px;
	height: 40px;
	white-space: nowrap;
	transform-origin: 0% 0%;
}
.temp_anzeige{
	font-size: 12px;
	position: absolute;
	width: 40px;
	left: -6px;
	top: 0px;
}
.temp_anzeige:before{
	position: relative;
	top: -8px;
	left: 3px;
	content: "Temp  ";
}
.temp_anzeige:after{
	content: " °C";
}
.power_anzeige{
	font-size: 12px;
	position: absolute;
	width: 40px;
	left: -10px;
	top: 0px;
}
.power_anzeige:before{
	position: relative;
	top: -8px;
	left: 4px;
	content: "Power ";
}
.power_anzeige:after{
	position: relative;
	text-align: right;
	content: " W";
}

.current_volt
{
	font-size: 14px;
	font-weight: bold;
	position: absolute;
	right: 175px;
	top: 202px;
	text-align: right;
}
.current_power
{
	font-size: 14px;
	font-weight: bold;
	position: absolute;
	text-align: right;
	left: 160px;
	top: 202px;
}
.current_current
{
	font-size: 14px;
	font-weight: bold;
	position: absolute;
	left: 85px;
	top: 202px;
	text-align: right;
}

.edit_button {
	position: relative;
	font-family: "Segoe MDL2 Assets";
	font-size: 0.8em;
	opacity: 0.4;
	cursor: pointer;
}
.edit_button:hover {
	transition: opacitiy .2s;
	opacity: 1;
}

.refresh_button {
	position: absolute;
	left: 4px;
	top: 4px;
	font-weight: normal;
	cursor: pointer;
}
.refresh_button_auto{
	position: absolute;
	font-size: 9px;
	left: 0px;
	top: 33px;
	font-weight: bold;
	cursor: pointer;
	color: rgb(70,70,70);
	text-shadow: 1px 2px 0px black;
	backface-visibility: "hidden";
}


.big_input {
	height: 1.2em;
	position: relative;
	left: -2px;
	font-family: inherit;
	text-align: left;
	font-size: 22px;
	font-weight: bold;
	outline: none;
	border: none;
	appearance: none;
	color: white;
	text-shadow: 0px 0px 2px black;
	background-color: hsla(10, 100%, 60%, 0);
}

.small_input{
	height: 1.2em;
	position: relative;
	left: -2px;
	font-family: inherit;
	text-align: left;
	font-size: 14px;
	border: none;
	outline: none;
	appearance: none;
	background-color: hsla(10, 100%, 60%, 0);
}
.zahnrad{
	font-family: "Segoe MDL2 Assets";
	cursor: pointer;
	
}
.zahnrad.small{
	font-size: 16px;
	position: absolute;
	right: 57px;
	bottom: 90px;
	
}
.zahnrad.big{
	font-size: 22px;
	position: absolute;
	right: 0px;
	bottom: 0px;
}

.settings_dialog{
	font-family: "Segoe UI";
	border: 3px solid red;
}

.settings_dialog::backdrop{
	backdrop-filter: blur(4px);
}

.settings_dialog table{
	border-spacing: 2px;
	font-size: 16px;
	color: black;
}
.settings_dialog td{
	border: 1px solid blue;
}

.train_link{
	font-family: "Segoe MDL2 Assets";
	cursor: pointer;
	font-size: 16px;
	position: absolute;
	left: 10px;
	bottom: 87px;
}
.train_link.blink{
	color: black;
	animation: blinker 0.3s cubic-bezier(1,0,0,1) infinite alternate;
}
@keyframes blinker { to {color: blue; text-shadow: 0px 0px 3px blue;} }

.trashcan_row{
	position: absolute;
	height: 0px;
	bottom: 55px;
	font-family: "Segoe MDL2 Assets";
	right: 0px;
}

.linkstatus{
	font: normal 12px "Segoe UI";
	position: absolute;
	top: 57px;
	left: -3px;
	text-shadow: 1px 1px 1px black;
}
.linkstatus.offline{
	color: rgba(250,40,10,0.8);
}
.linkstatus.online{
	color: rgba(10,240,10,0.8);
}

table
{
	border-spacing: 24px 14px;;
	color: white;
}
table th
{
	position: relative;
	bottom: 5px;	
	text-align: left;
//	border: 1px solid blue;
}


html
{
//	height: 100%;
	margin: 0px;
	box-shadow: 4px 4px 5px 2px black inset;
}
body
{
//    height: calc(100% - 6px);
	margin: 0px;
    background-repeat: no-repeat;
    background-attachment: fixed;
	font-family: "Segoe UI";
	font-size: 2em;
	color: #ffffff;
	background-image: linear-gradient(to bottom right, #faf4db, #a7a09c, #676060, #505050);
	border-top: 3px inset #999;
	border-left: 3px inset #999;
	border-bottom: 3px inset #eee;
	border-right: 3px inset #eee;
	border-radius: 5px;

}
h2
{
	margin-right: 2%;
	text-align: right;
	text-shadow: 2px 2px 3px black;
}
h2 sup
{
	position: relative;
	top: -8px;
	font-size: 0.3em;
}

.slidecontainer {
	position: absolute;
	right: -58px;
	top: 80px;
	width: 180px; /* Width of the outside container */
	height: 15px;
	padding: 0px;
	margin: 0;
  
}

/* The slider itself */
.slider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 35px; /* Specified height */
//  background-image: linear-gradient(60deg, #d3d0cb, #d0ccc2, #c5c1bb, #b0aba0); /* Grey background */
  background-image: linear-gradient(90deg, #242220, #f0e6d0); /* Grey background */
  outline: none; /* Remove outline */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
  transform: rotate(-90deg);
  border-top: 2px inset #4a4a4a;
  border-right: 2px inset #111;
  border-left: 2px inset #ffffff;
  border-bottom: 2px inset #f6f6f6;
  border-radius: 3px;
  box-shadow: -2px 2px 3px black inset;
}

/* Mouse-over effects */
.slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  position: relative;
  top:  -1px;
  width: 25px; /* Set a specific slider handle width */
  height: 30px; /* Slider handle height */
  background-image: linear-gradient(to right, #101030, #202040);
  cursor: pointer; /* Cursor on hover */
  border-radius: 3px;
  border-top: 1px outset #ccd;
  border-right: 1px outset #dde;
  border-bottom: 1px outset #585858;
  border-left: 1px outset #555;
  box-shadow: -1px 1px 3px black;
  margin-right: 10px;
}

.slider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #4CAF50; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.slider_value {
	position: absolute;
	top: 192px;
	right: 9px;
	width: 50px;
//	border: 1px inset #222222;
	text-align: right;
	font-size: 0.7em;
	font-weight: bold;
}

.metal_btn {
  position: relative;
  margin: 10px auto;
  outline: none;
  left: -38px;
  top: 30px;
  font-weight: bold;
  font-size: 24px;
  text-align: center;
  overflow: visible;
  color: hsla(0,0%,20%,1);
  text-shadow: hsla(0,0%,40%,.5) 0 -1px 0, hsla(0,0%,100%,.6) 0 2px 1px;

  background-color: hsl(0,0%,90%);
  box-shadow: inset hsla(0,0%,15%,  1) 0  0px 0px 4px, /* border */
    inset hsla(0,0%,15%, .8) 0 -1px 5px 4px, /* soft SD */
    inset hsla(0,0%,0%, .25) 0 -1px 0px 7px, /* bottom SD */
    inset hsla(0,0%,100%,.7) 0  2px 1px 7px, /* top HL */
    
    hsla(0,0%, 0%,.15) 0 -5px 6px 4px, /* outer SD */
    hsla(0,0%,100%,.5) 0  5px 6px 4px; /* outer HL */ 
  

  	user-select: none;
	cursor: pointer;

}

/* Radial ------------------------- */

.radial.metal_btn {
  width: 120px;
  height: 120px;
  top: 44px;
  line-height: 17px;
  border-radius: 60px;
  background-image: -webkit-radial-gradient(  50%   0%,  8% 50%, hsla(0,0%,100%,.5) 0%, hsla(0,0%,100%,0) 100%),
    -webkit-radial-gradient(  50% 100%, 12% 50%, hsla(0,0%,100%,.6) 0%, hsla(0,0%,100%,0) 100%),
    -webkit-radial-gradient(   0%  50%, 50%  7%, hsla(0,0%,100%,.5) 0%, hsla(0,0%,100%,0) 100%),
    -webkit-radial-gradient( 100%  50%, 50%  5%, hsla(0,0%,100%,.5) 0%, hsla(0,0%,100%,0) 100%),
    
    -webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   3%, hsla(0,0%,  0%,.1) 3.5%),
    -webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0)   6%, hsla(0,0%,100%,.1) 7.5%),
    -webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.2) 2.2%),
    
    -webkit-radial-gradient( 50% 50%, 200% 50%, hsla(0,0%,90%,1) 5%, hsla(0,0%,85%,1) 30%, hsla(0,0%,60%,1) 100%);
}


.metal_btn.radial:before, .metal_btn.radial:after {
  content: "";
  top: 0;
  left: 0;
  position: absolute;
  width: inherit;
  height: inherit;
  border-radius: inherit;
  
  /* fake conical gradients */
  background-image: -webkit-radial-gradient(  50%   0%, 10% 50%, hsla(0,0%,0%,.1) 0%, hsla(0,0%,0%,0) 100%),
    -webkit-radial-gradient(  50% 100%, 10% 50%, hsla(0,0%,0%,.1) 0%, hsla(0,0%,0%,0) 100%),
    -webkit-radial-gradient(   0%  50%, 50% 10%, hsla(0,0%,0%,.1) 0%, hsla(0,0%,0%,0) 100%),
    -webkit-radial-gradient( 100%  50%, 50% 06%, hsla(0,0%,0%,.1) 0%, hsla(0,0%,0%,0) 100%);
}
.metal_btn.radial:before { transform: rotate( 65deg); }
.metal_btn.radial:after { transform: rotate(-65deg); }


.metal_btn.on {
  color: hsl(40, 100%, 50%);
  text-shadow: hsla(40,100%,15%,0.3) 0 -1px 0, hsl(40,100%,95%) 0 2px 1px, hsla(40,100%,80%,1) 0 0 5px, hsla(40,100%,90%,.6) 0 0 20px;
  box-shadow: 
    inset hsla(40,80%,50%,  1) 0  0px 0px 4px, /* border */
    inset hsla(40,100%,15%, .4) 0 -1px 5px 4px, /* soft SD */
    inset hsla(40,100%,20%,.25) 0 -1px 0px 7px, /* bottom SD */
    inset hsla(40,100%,100%,.7) 0  2px 1px 7px, /* top HL */
    
    hsla(40,100%,75%, .8) 0  0px 3px 2px, /* outer SD */
    hsla(40,50%,40%, .25) 0 -5px 6px 4px, /* outer SD */
    hsla(40,80%,95%,   1) 0  5px 6px 4px; /* outer HL */
}

.metal_btn.glow {
  color: hsl(10, 100%, 50%);
  text-shadow: hsla(10,100%,15%,0.3) 0 -1px 0, hsl(40,100%,95%) 0 2px 1px, hsla(40,100%,80%,1) 0 0 5px, hsla(40,100%,90%,.6) 0 0 20px;
  box-shadow: 
    inset hsla(10,80%,50%,  1) 0  0px 0px 4px, /* border */
    inset hsla(10,100%,15%, .4) 0 -1px 5px 4px, /* soft SD */
    inset hsla(10,100%,20%,.25) 0 -1px 0px 7px, /* bottom SD */
    inset hsla(10,100%,100%,.7) 0  2px 1px 7px, /* top HL */
    
    hsla(10,100%,75%, .8) 0  0px 3px 2px, /* outer SD */
    hsla(10,50%,40%, .25) 0 -5px 6px 4px, /* outer SD */
    hsla(10,80%,95%,   1) 0  5px 6px 4px; /* outer HL */
}



/* Linear ------------------------- */

.metal_btn.linear {
  width: 60px;
  padding-top: 8px;
  font-size: 20px;
  height: 47px;
  line-height: 35px;
  position: relative;
  left: 80px;
  top: 3px;
  border-radius: 10px;
  background-image: -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0)   6%, hsla(0,0%,100%, .1) 7.5%),
    -webkit-repeating-linear-gradient(left, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   4%, hsla(0,0%,  0%,.03) 4.5%),
    -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
    
    linear-gradient(180deg, hsl(0,0%,78%)  0%, 
    hsl(0,0%,90%) 47%, 
    hsl(0,0%,78%) 53%,
    hsl(0,0%,70%)100%);

}


/* Oval ------------------------- */

.metal_btn.linear.oval {
  margin-top: 100px;
  width: 70px;
  height: 60px;
  line-height: 60px !important;
  border-radius: 50%;
  font: italic bold 3em/50px Georgia, "Times New Roman", Times, serif;
}




/* active ------------------------- */

.metal_btn_on:active {
  color: hsl(210, 100%, 40%);
  text-shadow: hsla(210,100%,20%,.3) 0 -1px 0, hsl(210,100%,85%) 0 2px 1px, hsla(200,100%,80%,1) 0 0 5px, hsla(210,100%,50%,.6) 0 0 20px;
  box-shadow: 
    inset hsla(210,100%,50%,  1) 0  0px 0px 4px, /* border */
    inset hsla(210,100%,15%, .4) 0 -1px 5px 4px, /* soft SD */
    inset hsla(210,100%,20%,.25) 0 -1px 0px 7px, /* bottom SD */
    inset hsla(210,100%,100%,.7) 0  2px 1px 7px, /* top HL */
    
    hsla(210,100%,75%, .8) 0  0px 3px 2px, /* outer SD */
    hsla(210,50%,40%, .25) 0 -5px 6px 4px, /* outer SD */
    hsla(210,80%,95%,   1) 0  5px 6px 4px; /* outer HL */

}




/* ------------------------ liquid glass meter ---------------------------- */
.glass_tube {			/* Rahmen ganz außen */
	content: "";
	position: absolute;
	width: 220px;
	height: 50px;
	top: -5px;
	left: 10px;
	border-radius: 28px;
	box-shadow: 2px 2px 4px black;
	background-image: linear-gradient(-5deg, rgb(30,30,30) 15%, rgb(40,40,40) 45%, rgb(40,40,40) 52%, rgb(230,230,230) 62%, rgb(240,240,240) 80.5%, rgb(255,255,255));
}

.glass_tube>.frame {				/* Rahmen Oberfläche */
	position: absolute;
	width: 216px;
	height: 46px;
	top: 2px;
	left: 2px;
	border-radius: 27px;
	background-color: black;
	background-image: 	linear-gradient(-2deg, rgba(250,250,250,0) 70%, rgba(250,250,250,0.9) 70.8%, rgba(250,250,250,0.95) 78%, rgba(250,250,250,0) 78.8%, rgba(250,250,250,0) ),
						linear-gradient(174deg, #ddd 10%, #aaa 13%, #f0f0f0 17%, #d5d5d5 55%, #404040 60%, #f0f0f0 65%, #ebebeb 88.5%, #666 92%),
						linear-gradient(0deg, rgba(160, 160, 162, 1), rgba(200,200,200,1));
}

.glass_tube>.frame>.hintergrund {				/* schwarzer Hintergrund für meter */
	position: absolute;
	left: 6.5px;
	top: 6px;
	width: 198.5px;
	height: 29px;
	border-radius: 22px; 
	border: 2px inset #888;
	background-color: black;
}

.glass_tube>.frame>.hintergrund>.meter {		/* the meter itself */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 15px;
	height: 29px;
	border-radius: 18px 0px 0px 18px; 
	background-color: hsla(35,95%,45%,0);
	background-image: linear-gradient(90deg, rgba(10,10,10, 0.3), rgba(10,10,10,0) 12%, rgba(10,10,10,0) 88%, rgba(10,10,10,0.3) );   /* Abschattung links und rechts */
	box-shadow: 0px 0px 0px 0px hsla(35,95%,45%,0);
	transition: width 1.9s, background-color 1.9s, border-radius 1.9s, box-shadow 1.9s;
}

.glass_tube>.frame>.hintergrund>.meter>.glass {			/* Glasoberfläche */
	content: "";
	position: absolute;
	width: 196px;
	height: 27px;
	top: 1px;
	left: 1px;
	border-radius: 17px;
	background-image: 		radial-gradient(circle farthest-corner at 55% 2500px, rgba(255,255,255, 0.05) 99.52%, rgba(255,255,255, 0.3) 99.54%, rgba(255,255,255, 0.75) 99.6%),			/* Highlight von oben nach unten */
							linear-gradient(180deg, rgba(255,255,255,0) 86%, rgba(250,250,250, 0.2) 92%, rgba(250,250,250,0.2)),			/* Highlight von oben nach unten */
							radial-gradient(ellipse farthest-corner at 50% 12px, rgba(255,255,255,0) 78%, rgba(250,250,250, 0.2) 81%, rgba(250,250,250,0.2));			/* Highlight von oben nach unten */
//	background-image: 		linear-gradient(179deg, rgba(250,250,250, 0.75), rgba(250,250,250,0.3) 48%, rgba(250,250,250,0.05) 50%);			/* Highlight von oben nach unten */
}

/* --------------------------------- end liquid glass meter -------------------------------------*/



/* --------------------------------- Thermometer --------------------------------------------------------------------*/
.mini_gauge{
	position: absolute;
	left: -12px;
	width: 50px;
	height: 3px;
	top: 11px;
	background: black;
	border: 1px outset #aaa;
	border-bottom-color: #999;
	border-right-color: #999;
}
.mini_gauge>.temp{
	position: absolute;
	width: 50px;
	height: 3px;
	right: 0px;
	top: 0px;  
	background-image: linear-gradient(90deg, rgb(0,10,200) 0%, rgb(0,10,200) 12%, rgb(140,220,0) 30%, rgb(230,240,0) 55%, rgb(240,160,0), 80%, rgb(240,0,0));
}
.mini_gauge>.power{
	position: absolute;
	width: 50px;
	height: 3px;
	right: 0px;
	top: 0px;  
	background-image: linear-gradient(90deg, rgb(10,230,0), rgb(220,220,0), rgb(230,10,0));
}
.mini_gauge>.meter{
	position: absolute;
	width: 100%;
	height: 3px;
	right: 0px;
	top: 0px;  
	background: black;
}
/* ------------------------------------------- ende Thermometer -------------------------------------------------------*/




.grid1
{
	position: absolute;
	text-align: center;
	top: 50%;
	width: 98%;
	left: 1%;
	display: grid;
	grid: auto / auto;
	grid-gap: 10px;
	background-color: #101020;
	vertical-align: middle;
}

.grid1 div div
{
	position: absolute;
	width:100%;
	top: 50%;
	background-color: #251600;
}

.grid1 input
{
	background-color: #34659d;
}
.grid1 sup
{
	position: relative;
	top: -5px;
	font-size: 10px;
}