html { height: 100%}
body { margin: 0; 100%; } 

 input[type=submit]
{
font-family: 'Open Sans', sans-serif;
font-size:0.8em;
padding: 3px 8px;
line-height:18px;
text-shadow:none;
cursor:pointer;
box-shadow: none;

width: auto;
border:0;
background: linear-gradient(to bottom, #c8d5e7 , #ffffff 4%, #c8d5e7 );
} 
/*
6cb9fa;
*/

 input.set[type=submit]
{
font-family: 'Open Sans', sans-serif;
font-size:0.8em;
padding: 12px 13px;
line-height:18px;
text-shadow:none;
cursor:pointer;
box-shadow: none;

background: linear-gradient(to bottom, #9aa9bd, #ffffff 2%, #9aa9bd );
width: auto;
border:0;
} 

input[type=text]
{
font-family: 'Open Sans', sans-serif;
font-size:1.0em;
padding: 3px;
outline: 0;
border:0;
color:#123456;
background: #eeeeee;
box-shadow: inset 1px 1px 2px 0 #707070;
border-radius:5px;
margin-top:3px;
}

.top {background:#eeeeee; height: 40px; font-family: 'Open Sans', sans-serif; 
border-top:1px solid black; border-right:1px solid black; border-left:1px solid black;
font-size:1.2em; color:#123456;  width:calc(100% - 30px);  margin:0 auto; padding:10px;}

.mitte {  border-right:1px solid black;border-left:1px solid black; 
font-family: 'Open Sans', sans-serif; height: calc(100% - 180px); 
font-size:1.2em; color:#123456;  width:calc(100% - 10px); background:#eeeeee; margin:0 auto;}

.mitte2 { border-right:1px solid black;  border-left:1px solid black; border-top:1px solid black;
font-family: 'Open Sans', sans-serif; height: calc(100% - 120px);
font-size:1.2em; color:#123456;  width:calc(100% - 10px); background:#eeeeee; margin:0 auto;}

.links   { background:#ffffff; margin:0 auto; 
padding:0px; height:auto; float:left; width:220px; margin-right:1%;background:#eeeeee;}

.rechts  { border:1px solid #888888;  background:#ffffff; margin:0 auto; padding:10px; min-height:96%;  float:left; }

.rechtsmen  { float:right; padding-right:10px; }
.rechtslogo  { float:right; padding-right:10px; padding-left:10px; }
.rechtshome  { float:right; padding-right:10px; padding-left:30px; }


.bottom { position absolute; border:1px solid black; height: 40px; font-family: 'Open Sans', sans-serif; 
font-size:0.6em; color:#123456;  width:calc(100% - 30px); background:#c3c3c3; margin:0 auto; padding:10px;margin-bottom:5px; }



.bildg {float:right; margin-right:30px; max-height:100%;}

.titel {float:left; font-family: 'Open Sans', sans-serif; font-size:0.8em; color:#000;}
.titelfett {float:left; font-family: 'Open Sans', sans-serif; font-size:1.3em; color:#000; font-weight: bold;}
 

 .dypos { float:left; width: auto; height: auto; margin-left:20px; margin-top: 20px;}
#legend {font-family: 'Open Sans', sans-serif; font-size:13px; padding:20px;} 
#legend2 {font-family: 'Open Sans', sans-serif; font-size:14px;} 

/*  #graphdiv2 {margin-right:0px; margin-left:0px; height:90%;}*/


#graphdiv2d {height: calc(100% - 150px); position: absolute; margin-left:55px; margin-top:-130px;inset: 150px 10px 10px 200px; 
background: #000000; margin-right:20px; border:1px solid #999999;}
#graphdiv2h {height: calc(100% - 150px); position: absolute; margin-left:55px; margin-top:-130px;inset: 150px 10px 10px 200px; 
background: #ffffff; margin-right:20px; border:1px solid #999999;}
  /*  #graphdiv2 {width:140px; height:90%;}*/
  /*  #graphdiv3 {width:350px; height:90%;}*/
  
 #graphdiv3d { height: calc(100% - 210px);            position: absolute; margin-left:-175px; 
 margin-top:-70px;inset: 150px 10px 10px 200px; margin-bottom:100px;
background: #000000; margin-right:10px; border:1px solid #999999;} 
 
  #graphdiv3h { height: calc(100% - 210px);            position: absolute; margin-left:-175px; 
 margin-top:-70px;inset: 150px 10px 10px 200px; margin-bottom:100px;
background: #ffffff; margin-right:10px; border:1px solid #999999;} 
 
  
  
  .topindex {background:#eeeeee; height: 80px; font-family: 'Open Sans', sans-serif; 
border:1px solid black; 
font-size:1.2em; color:#123456;  width:calc(100% - 30px);  margin:0 auto; padding:10px;}
  
  .bild {float:right;}
  .kasten { float:left; width: 30%; margin-left:2%; height:auto; margin-top:30px; 
 font-family: 'Open Sans', sans-serif; font-size:0.9em;}
  .kasteninnen {min-width:96%; border:1px solid #999999; padding:2%; overflow: auto;
   background: linear-gradient(to bottom, #f1f3f6 , #ffffff 2%, #f1f3f6 );}
   
  .kasteninnenindex {min-width:96%; border:1px solid #999999; padding:2%; overflow:scroll;
   max-height:calc(100% - 340px);
   background: linear-gradient(to bottom, #f1f3f6 , #ffffff 2%, #f1f3f6 );}
      

   
   
.rechtsoben {float:right;}
.rechtsobenblaua {float:right; font-family: 'Open Sans', sans-serif;
font-size:0.8em;
padding: 3px 8px;
line-height:18px;
text-shadow:none;
cursor:pointer;
box-shadow: none;
border-radius:1px;
outline: 0;
border:1px solid #888;
background: #abc4d9;
width: auto;}

.rechtsobenblau {float:right; font-family: 'Open Sans', sans-serif;
font-size:0.8em;
padding: 3px 8px;
line-height:18px;
text-shadow:none;
cursor:pointer;
box-shadow: none;
border-radius:0px;
outline: 0;
background: linear-gradient(to bottom, #c8d5e7 , #ffffff 4%, #c8d5e7 );

width: auto;}
  
  .buttonx {float:left; width:100%; padding: 0px;  height:50px; margin-top:20px;
 font-family: 'Open Sans', sans-serif; font-size:1.1em; }

  .isp {padding:10px; font-family: 'Open Sans', sans-serif; font-size:1.0em; 
 background:#dddddd; width:60%; color:#000;border: none; border:1px solid #999;}
  
 .button { font-size:0.4em;float: left; width:auto; padding: 2px; margin: 2px; height:15px; background: #f6f6f6; border: 1px solid#000000;border-radius:5px; box-shadow: -2px -2px 4px  #999; }
.set {margin:20px 5px; Padding:2px; Border: 1px solid #cccccc; 
font-family: 'Open Sans', sans-serif; font-size:0.7em; Background:#b2e1c3; border-radius:3px;}
.set1 {margin:20px 5px; Padding:2px; Border: 1px solid #cccccc; font-family: 'Open Sans', sans-serif; font-size:0.7em; Background:#a2b0d0; border-radius:5px;}
.buttonan {font-size:0.4em; float: left; width:auto; padding: 2px; margin: 2px; height:15px; background: #cdcdcd; border: 1px solid#000000;border-radius:5px; box-shadow: 4px 4px 6px #555 inset;} 
  
.textinfo {height: auto; width:300px; margin:0 auto; padding:30px; float:left;}
  
 .texteingabe {height: auto; width:auto; margin:0 auto; padding:10px; border:1px solid #999999;margin-left:30px;float:left;} 
  
  .platzieren { min-width:100px;  margin: 4px 5px 0 0; padding-top:3px;}
  .top2 {padding-left: 25px;padding-top:10px; width:100%; height: 55px;}
  
#zeigeli1 {float:right; width: 200px; height: 20px; margin-right:10px; padding:0; font-size:0.9em; background-color:#fff;z-index: 100;}
#zeigeli2 {float:right; width: 200px; height: 20px; margin-right:10px; padding:0; font-size:0.9em; background-color:#fff;z-index: 100;}
#zeigeli1a {float:right; width: 200px; height: 20px; margin-right:10px; padding:0; font-size:0.9em; background-color:#c3c3c3;z-index: 100;}
#zeigeli2a {float:right; width: 200px; height: 20px; margin-right:10px; padding:0; font-size:0.9em; background-color:#c3c3c3;z-index: 100;}


.kasten1 { float:left; width: 100%;  height:60px; margin-top:30px;  font-family: 'Open Sans', sans-serif; font-size:0.9em;}
.kasten2 { float:left; width: 60%; margin-left:2%; height:40%; margin-top:30px;  font-family: 'Open Sans', sans-serif; font-size:0.9em;}
.kasten2a { float:left;  width: 60%; padding:2%; height:45px; margin-top:5px;  font-family: 'Open Sans', sans-serif; font-size:0.9em;}

.button6b { margin:0 auto; padding: 20px;  height:50px; margin-top:0px; font-family: 'Open Sans', sans-serif; font-size:1.1em; }
.texteingabe6b {height: auto; width:200px; margin:0 auto; padding:10px; border:1px solid #999999;margin-left:30px;float:left;} 
.speicherbut4 {position:fixed; margin-top:10px; margin-left:52%;}
  
  
  
        @media screen and (min-width: 600px) {
      
  .bottom { position absolute; border:1px solid black; height: 40px; font-family: 'Open Sans', sans-serif; 
font-size:0.8em; color:#123456;  width:calc(100% - 30px); background:#c3c3c3; margin:0 auto; padding:10px;margin-bottom:5px; }
.button { font-size:0.7em; float: left; width:auto; padding: 3px; margin: 5px; height:15px; background: #f6f6f6; border: 1px solid#000000;border-radius:5px; box-shadow: -2px -2px 4px  #999; }
.buttonan {font-size:0.7em; float: left; width:auto; padding: 3px; margin: 5px; height:15px; background: #cdcdcd; border: 1px solid#000000;border-radius:5px; box-shadow: 4px 4px 6px #555 inset;} 
 
      }
  
  
  
  

      @media screen and (min-width: 1000px) {
      
  .bottom { position absolute; border:1px solid black; height: 40px; font-family: 'Open Sans', sans-serif; 
font-size:1.2em; color:#123456;  width:calc(100% - 30px); background:#c3c3c3; margin:0 auto; padding:10px;margin-bottom:5px; }
 .button { font-size:1em; float: left; width:auto; padding: 6px; margin: 8px; height:15px; background: #f6f6f6; border: 1px solid#000000;border-radius:5px; box-shadow: -2px -2px 4px  #999; }
  .buttonan {font-size:1em; float: left; width:auto; padding: 6px; margin: 8px; height:15px; background: #cdcdcd; border: 1px solid#000000;border-radius:5px; box-shadow: 4px 4px 6px #555 inset;} 
  
      }