body { font-size: 14px; font-family: "Calibri", sans-serif; line-height: 1.25; color:white; background-color: black;}

a {color: white}

.error {color: red}
.okay {color: green}
.active_row {background-color: rgb(51, 49, 49)}

.text_center {text-align: center}
.text_right {text-align: right}

.pointer {cursor: pointer}

.scroll {overflow: scroll}

.none {display: none;}

.bg_grey{background-color: #494b4d};
.bg_trans{background-color: transparent};
.bg_error{background-color: red; color: white};
.bg_okay{background-color: rgb(23, 78, 2); color: white};
.bg_white{background-color: white; color: black};
.bg_warning{background-color: #fab104};

.login {position: relative; width: 25%; height: 50%; margin-left: 37%; margin-top: 25%;}
.logout {position: absolute; width: 20px; height: 20px; right: 5px; top: 5px; font-size: 20px}
.headline {position: absolute; width: 100%; height: 20px; left: 5px; top: 5px; font-size: 20px}
.headline_txt {position: relative; left: 5px; width: 220px; top: 0; height: 100%; cursor: pointer; float: left}
.headline_icon {position: relative; width: 50px; top: 0; height: 100%; left: 5px; cursor: pointer; float: left}
.new_sel {position: absolute; width: 10%; height: 90vh; left: 1%; top: 55px; border: 1px solid white}
.res {position: absolute; width: 86%; height: 90vh; left: 12%; top: 55px; border: 1px solid white; overflow: hidden}
.relative_90 {position: relative; width: 90%; margin-left: 5%; margin-bottom: 1%}
.relative_100 {position: relative; width: 100%; left: 0; margin-bottom: 1%}
.relative {position: relative; margin-left: 5%; margin-bottom: 1%}
.relative_pure {position: relative;}
.absolute_pure {position: absolute;}
.res_data_container {position: relative; width: 48%; margin-right: 2%; height: 100%; overflow: scroll; float: left;}
.diagramm {position: relative; width: 100%; left: 0; height: 200px;}
.diagramm_point {position: absolute; width: 5px;}
.diagramm_detail {position: absolute; height: 100%; cursor: pointer}
.diagramm_detail:hover {background-color: #494b4d}

.content_70 {position: relative; width: 70%; float: left;}
.content_50 {position: relative; width: 50%; float: left;}
.content_20 {position: relative; width: 20%; float: left;}
.content_25 {position: relative; width: 25%; float: left;}
.content_30 {position: relative; width: 30%; float: left;}
.content_35 {position: relative; width: 35%; float: left;}
.content_40 {position: relative; width: 40%; float: left;}
.content_15 {position: relative; width: 15%; float: left;}
.content_10 {position: relative; width: 10%; float: left;}
.content_9 {position: relative; width: 9%; float: left;}
.content_5 {position: relative; width: 5%; float: left;}
.content_1 {position: relative; width: 1%; float: left;}

.border_bottom {border-bottom: 1px solid gray}

.margin_bottom {margin-bottom: 10px}
.margin_top {margin-top: 10px}
.margin_left {margin-left: 20px}

.height_80 {height: 80vh}
.height_60 {height: 60vh}
.height_50 {height: 50vh}
.height_10 {height: 10vh}
.height_5 {height: 5vh}
.height_1 {height: 1vh}
.height_100_p {height: 100%}
.height_80_p {height: 80%}
.border_all {border: 1px solid white}
.width_10 {width: 10vh;}

.table_col {position: relative; width: 10%; float: left;}

input, select, textarea { border: 1px solid white; border-radius: 0; color: #444444; background-color: white; padding: 0.4vh; font-size: 12px;}
input, input:active, input:focus, select, select:active, select:focus, textarea, textarea:active, textarea:focus {outline: 0; outline-style: none; outline-width: 0;}

.iptStd { width: 100%; height: 100%;}
.selStd { width: 100%; height: 100%;}
.btnStd { width: 100%; height: 100%; border: none; text-align: center; cursor: pointer; margin-left: 0; margin-top: 0; display: block; font-weight: bold; background-color: rgb(51, 49, 49); color: white}
.txtStd { width: 100%; height: 8vh;}
.txtAmount{ width: 100%;}

.height80 {height: 80vh}

/* ------------------------------ loading ----------------------------------- */
.black {position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background-color: black; opacity:0.0; filter:alpha(opacity=0); -webkit-transition: opacity 0.5s ease, filter 0.5s ease; -moz-transition: opacity 0.5s ease, filter 0.5s ease; -o-transition: opacity 0.5s ease, filter 0.5s ease; -ms-transition: opacity 0.5s ease, filter 0.5s ease; transition: opacity 0.5s ease, filter 0.5s ease; display: none; z-index: 1301;}
.loading {position: fixed; width: 50%; left: 25%; height: 100vh; justify-content: center; align-items: center; display: none; background-color: transparent; opacity:0.0; filter:alpha(opacity=0); -webkit-transition: opacity 0.5s ease, filter 0.5s ease; -moz-transition: opacity 0.5s ease, filter 0.5s ease; -o-transition: opacity 0.5s ease, filter 0.5s ease; -ms-transition: opacity 0.5s ease, filter 0.5s ease; transition: opacity 0.5s ease, filter 0.5s ease; text-align: center; z-index: 1303;}

.wave {
  width: 1vw;
  height: 20vh;
  background: linear-gradient(45deg, cyan, #fff);
  margin: 2vw;
  animation: wave 1s linear infinite;
  border-radius: 20px;
}
.wave:nth-child(2) {
  animation-delay: 0.1s;
}
.wave:nth-child(3) {
  animation-delay: 0.2s;
}
.wave:nth-child(4) {
  animation-delay: 0.3s;
}
.wave:nth-child(5) {
  animation-delay: 0.4s;
}
.wave:nth-child(6) {
  animation-delay: 0.5s;
}
.wave:nth-child(7) {
  animation-delay: 0.6s;
}
.wave:nth-child(8) {
  animation-delay: 0.7s;
}
.wave:nth-child(9) {
  animation-delay: 0.8s;
}
.wave:nth-child(10) {
  animation-delay: 0.9s;
}

@keyframes wave {
  0% {
	transform: scale(0);
  }
  50% {
	transform: scale(1);
  }
  100% {
	transform: scale(0);
  }
}