/* *** css by miss monorom www.intensivstation.ch *** */
/* css released under Creative Commons License -  http://creativecommons.org/licenses/by/2.0/deed.en  */

body {
background-color: #cccccc;
font-size: 11px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#564b47;
padding:0px;
margin:0;
text-align: center; /*zentrieren der Seite*/
}

div {
text-align: left; /* text-align:center wieder aufheben, damit DIV-Inhalte linksbündig ausgerichtet sind */
}

fieldset {
border: 1px solid cornflowerblue; 
background: lavender;
padding: 5px;
}

legend {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
color: #000000;
}

label, input#Login, select#Login{ /* Alle Labels UND Formularelemente auswählen */
  display: block;
  float: left;
  width: 50px; /* Breite.*/
}


form br { /* Alle Zeilenumbrüche in Formularen auswählen */
  clear: left; /* das floating der labels und inputs aufheben */
}

input#submit { /* den Submit-Button */
  float: none;
  width: auto;
}

a {color: black;}
a:visited {color:gray;}
a:hover {color: #a9a9a9;}
a:active { color:black;}

h1 {
font-size: 15px;
text-transform:uppercase;
background-color: #99ccff;
border: 1px solid #564b47;
margin:0 
}

h2 {
font-size: 12px;
font-weight: normal;
padding: 5px 10px;
margin: 0px;
}

img.download {
vertical-align: middle;
}

img{
margin: auto;
}

p, pre{
padding: 0px 0px;
margin: 0px;
}

input{
border: 1px solid black;
}

/* ----------wrapper zentriert das layout-------------- */
div#wrapper {
width: 1208px;
margin: 0 auto; 
background-color: lavender;
}
/* Fucking IE-Hack */
html>body div#wrapper {
width: 1200px;
margin: 0 auto; 
background-color: lavender;
}

/*----------Header--------------------------------------*/
header{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.2em;
border: 1px solid #000000;
background: #FFFFFF;
height: 90px;
width: 100%;
}

#HeaderText{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.5em;
font-weight: bold;
width: 50%;
margin-top: 0;
float: left;
padding: 5px;
}

#HeaderLogo{
float: right;
padding: 5px;
}

#HeaderLogo img{
  float:right;
}

/* --------------left navigavtion------------- */
#left{
float: left;
width: 200px;
margin: 0px;
padding: 0px;
}

nav fieldset{
min-height: 385px;
}

#Toplevel{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
}

#Secondlevel{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
}

#Achsen{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
min-height: 250px;
}


/* --------------right navigavtion------------- */
/*#right{*/
aside{
float: right;
width: 200px;
margin: 0;
padding: 0;
}

#Zeit{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
}

#User{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
}

#error{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
color: #FF0000;
height: 50px;
}

#Download{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
}

input:invalid {background:red;}
input:valid {background:white;}



/* -----------footer--------------------------- */
#footer {
clear: both;
margin: 0px;
padding: 0px;
text-align: right; 
}/* CSS Document */


/* -----------------Inhalt--------------------- */

#Title{

}


#Text div{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
color: black;
background-color: white;
}

#content{
padding: 0;
margin: 0 200px;
background-color: lavender;
}

div#content{ 
min-height:800px;
height:expression(this.scrollHeight > 600 ? "auto":"600px"); 
}

.coveredImage {
      width:100%;
     height:100px;
      position:absolute;
      top:0px;
      left:0px;
  }

 div#myCanvas{
 	background-color: rgba(255, 0, 0, 0);
 }

#Impressum{
position : absolute;
left : 0px;
top : 0px;
width : 100%;
height : 600px;
overflow : auto; 
}

div#Alarme td{
  text-align:center;
  background-color:white;
}

div#Watchdogs td{
  text-align:center;
  background-color:white;
}

div#Users td{
  text-align:center;
  background-color:white;
}

#Plot{
/*
padding-top: 0px;
padding-left: 0px;
position: relative;
margin: auto;
*/
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
color: #000000;
padding-top: 0px;
padding-left: 0px;
position: relative;
margin: auto;
}


/* clearfix zum Aufheben der Floatumgebung */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#Links a, #Links_dia a{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
color: #000000;
}

#Text{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.0em;
font-weight: bold;
color: #000000;
}

#Bezeichnung{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
font-weight: bold;
color: #000000;
border:1px solid #000000;
}

.Phase1{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
font-weight: bold;
color: #000000;
border:1px solid #FF0000;
}

.Phase2{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
font-weight: bold;
color: #000000;
border:1px solid #00FF00;
}

.Phase3{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
font-weight: bold;
color: #000000;
border:1px solid #0000FF;
}

#MW div {
}


.MWwhite{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWgray{
background-color:#FFFFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWgreen{
background-color:#00FF00; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWred{
background-color:#FF0000; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWyellow{
background-color:#FFFF00; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWyellow1{
background-color:#FFD700; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWorange{
background-color:#FFA500; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWblue{
background-color:#7777FF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWcyan{
background-color:#00FFFF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.MWmagenta{
background-color:#FF00FF; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
color: #000000;
}

.ebene1{
text-indent:25px;
}
.ebene2{
text-indent:50px;
}
.ebene3{
text-indent:75px;
}
.ebene4{
text-indent:100px;
}
.ebene5{
text-indent:125px;
}

@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
  text-decoration: blink;
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 0.6s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:ease-in-out;
  -webkit-animation-direction: alternate;
}
.sollwertg{
  background-color:#AAAAAA; 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
  color: #000000;
  width: 36px;
  display: block;
}
.sollwert{
  background-color:#FFFFFF; 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
  color: #000000;
  width: 36px;
  display: block;
}
#map {
  height: 86%;
   height: 600px;
  width: 100%;
  padding: 0; margin: 0;
}

#osm {
  font-size: 0.7em;
  font-style: italic;
  margin-bottom: 20px;
}

.marked {
  border:1px solid #FF0000
}

/* https://hellocoding.de/blog/coding-language/css/file-upload-stylen */
input[type="file"]{
    opacity: 0;
    z-index: -1;
    position: absolute;
    top: -1px;
    left: 0;
    width: 0.1px;
    height: 0.1px;
}

input[type="file"]:focus + label[for="myfile"]{
    border: 1px solid #85E5FF;
}

label[for="myfile"]{
    width: 120px;
    background: #FFFFFF;
    padding: 10px;
    color: #000;
    border-radius: 4px;
    cursor: pointer;
}

label[for="myfile"]:hover{
    background: #FF9E59;
}