body { font-family: Arial ; background: #c0c0c0 ; color = #202020; font-size: 2vw; }

button {
  width: 90%;
  height: 80%;
  font-size: 4vw;
  background-color: #a0a0a0;
  color: #101010;
  border-radius: 20px;
}
button.small {
  width: 90%;
  font-size: 2vw;
  background-color: #a0a0a0;
  color: #101010;
  border-radius: 20px;
}
button.sa {
  width: 40%;
  font-size: 2vw;
  background-color: #a0a0a0;
  color: #800000;
  border-radius: 20px;
}
.wide50 {
  width: 50%;
  height: 100%;
  font-size: 4vw;
  background-color: #c0c0c0;
  border-radius: 12px;
}

.wide_x {
  height: 100%;
  font-size: 4vw;
  background-color: #c0c0c0;
  border-radius: 12px;
}

select {
  width: 60%;
  height: 100%;
  font-size: 4vw;
  background-color: #c0c0c0;
  border-radius: 12px;
  text-align: center;
}

table.ergebnis {
  width: 100%;
  font-size: 3vw;
  background-color: #c0c0c0;
  border: 1px solid white;
  border-collapse: collapse;
}

tr{
  width: 100%;
  font-size: 3vw;
  background-color: #c0c0c0;
  }

tr.ergebdis {
  width: 100%;
  font-size: 3vw;
  background-color: #d0d0d0;
}

td {
  border: 1px solid white;
  border-collapse: collapse;
}

h1 {
  background: #c0c0c0 ;font-size: 4vw; /* 40px/16=2.5em */
}

h2 {
  font-size: 2vw; /* 30px/16=1.875em */
 }

p {
  font-size: 2vw; /* 14px/16=0.875em */
}

div.type1a { color: #800000; background-color: #c0c0c0; text-align: center; height: 10%; width: 100%; overflow-y: hidden;font-size: 4vw;}
div.type1 { background-color: #c0c0c0; text-align: center; height: 10%; width: 100%; overflow-y: hidden;font-size: 4vw;}
div.type2 { background-color: #c0c0c0; text-align: center; height: 10%; width: 100%; overflow-y: hidden;font-size: 2vw;}
div.type3 { background-color: #c0c0c0; text-align: center; height: 10%; width: 100%; overflow-y: hidden;font-size: 3vw;}

div.typeh { background-color: #c0c0c0; text-align: center;  width: 100%; overflow-y: hidden;font-size: 3vw;text-align: center;}
div.typeh1 { background-color: #c0c0c0; text-align: center;  width: 25%; overflow-y: hidden;font-size: 3vw;text-align: center; float: left;}
div.typeh2 { background-color: #c0c0c0; text-align: center;  width: 50%; overflow-y: hidden;font-size: 3vw;text-align: center; float: left;}
div.typeh3 { background-color: #c0c0c0; text-align: center;  width: 25%; overflow-y: hidden;font-size: 3vw;text-align: center;}
div.typeh4 { background-color: #e0e0e0; text-align: center;  width: 100%; overflow-y: hidden;font-size: 4vw;text-align: center;}

html { font-size: 4vw; margin: 0;}

td.coll10 { background-color: #c0c0c0; text-align: left; width: 10%; font-size: 3vw;}
td.coll14 { background-color: #c0c0c0; text-align: left; width: 14%; font-size: 3vw;}
td.coll20 { background-color: #c0c0c0; text-align: left; width: 20%; font-size: 3vw;}
td.coll40 { background-color: #c0c0c0; text-align: left; width: 40%; font-size: 3vw;}
td.coll80 { background-color: #c0c0c0; text-align: left; width: 80%; font-size: 3vw;}
td.colc8 { background-color: #c0c0c0; text-align: center; width: 8%; font-size: 3vw;}
td.colc10 { background-color: #c0c0c0; text-align: center; width: 10%; font-size: 3vw;}
td.colc20 { background-color: #c0c0c0; text-align: center; width: 20%; font-size: 3vw;}
td.colc40 { background-color: #c0c0c0; text-align: center; width: 40%; font-size: 3vw;}
td.colr10 { background-color: #c0c0c0; text-align: right; width: 10%; font-size: 3vw;}
td.colr20 { background-color: #c0c0c0; text-align: right; width: 20%; font-size: 3vw;}
td.colr40 { background-color: #c0c0c0; text-align: right; width: 40%; font-size: 3vw;}