html {  
  background-color: #a8e1af;
}

body {
  margin: 2em 0 0 0;
  justify-content: center; 
  align-items: center;
}

.box {
 display: grid;
 grid-gap: 0.5em;
  margin: 20 auto;
  justify-content: center; 
  align-items: center;
}

.pdf {
  justify-content: center; 
  align-items: center;
}

.nav {
width: 25em;
height: 3em;
background-color: #3fe3bf;
font-family: Arial;
text-transform: uppercase;
font-size: 1em;
font-weight: bold;
letter-spacing: .1em;
line-height: 3em;
color: black;
text-align: center; 
border-color: black;
border-width: 1px;
border-style: solid;
}

.nav:hover{
  background-color: #F0F06C;
  color: blue;
}

.navgap {
height: 2em;
}

.Tab {
  display: grid;
  grid-template-areas: "Tit Aut Auf Jah Verl Cov ISN F1 F2";
  grid-template-columns: 40em 15em 5em 5em 17em 7em 13em 6em 6em;
  height: 8em;
font-family: Arial;
font-size: 1em;
line-height: 8em;
color: black;
text-align: center; 
  background-color: #FFFFFF;
}

.Tab_H {
  display: grid;
  grid-template-areas: "TitH AutH AufH JahH VerlH CovH ISNH F1H F2H";
  grid-template-columns: 40em 15em 5em 5em 17em 7em 13em 6em 6em;
  height: 2em;
font-family: Arial;
font-size: 1em;
line-height: 2em;
color: black;
text-align: center; 
  background-color: #719e5c;
}

.Tab_z {
  display: grid;
  grid-template-areas: "Num Tit Jah Verl Cov ISN F1 F2";
  grid-template-columns: 5em 30em 5em 10em 7em 13em 6em 6em;
  height:8em;
font-family: Arial;
font-size: 1em;
line-height: 8em;
color: black;
text-align: center; 
  background-color: #FFFFFF;
}

.Tab_z2 {
  display: grid;
  grid-template-areas: "Num Tit Aut Jah Verl Cov ISN F1 F2";
  grid-template-columns: 5em 25em 15em 5em 10em 7em 13em 6em 6em;
  height:8em;
font-family: Arial;
font-size: 1em;
line-height: 8em;
color: black;
text-align: center; 
  background-color: #FFFFFF;
}

.Tab_z3 {
  display: grid;
  grid-template-areas: "Num Jah Verl Cov ISN F1 F2";
  grid-template-columns: 5em 5em 10em 7em 13em 6em 6em;
  height:8em;
font-family: Arial;
font-size: 1em;
line-height: 8em;
color: black;
text-align: center; 
  background-color: #FFFFFF;
}

.Tab_m {
  display: grid;
  grid-template-areas: "Aut Tit Jah Verl Inh Hue ISN F3 F4 F5 F6 F7 F8";
  grid-template-columns: 13em 27em 5em 12em 5em 5em 10em 6em 6em 6em 6em 6em 6em;
  height:6em;
font-family: Arial;
font-size: 1em;
line-height: 6em;
color: black;
text-align: center; 
  background-color: #FFFFFF;
}

.TabNum, .TabTit, .TabAut, .TabJah, .TabAuf, .TabVerl, .TabCov,  .Tabinh, .TabHue, .TabISN, .TabF1, .TabF2 , .TabF3 , .TabF4 , .TabF5 , .TabF6 , .TabF7 , .TabF8{
border-color: black;
	  border-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
    border-left-style: solid;
}  

.TabNumH, .TabTitH, .TabAutH, .TabJahH, .TabAufH, .TabVerlH, .TabCovH,  .TabinhH, .TabHueH, .TabISNH, .TabF1H, .TabF2H, .TabF3H, .TabF4H, .TabF5H, .TabF6H, .TabF7H, .TabF8H{
border-color: black;
	  border-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
    border-left-style: solid;
}  

.TabNum, .TabTit, .TabAut, .TabJah, .TabAuf, .TabVerl, .TabCov, .Tabinh, .TabHue, .TabISN, .TabF1, .TabF3 , .TabF4 , .TabF5 , .TabF6 , .TabF7 {
  border-right-style: none;
}  

.TabNumH, .TabTitH, .TabAutH, .TabJahH, .TabAufH, .TabVerlH, .TabCovH, .TabinhH, .TabHueH, .TabISNH, .TabF1H, .TabF3H, .TabF4H, .TabF5H, .TabF6H, .TabF7H {
  border-right-style: none;
}  

.TabF1, .TabF2, .TabF3 , .TabF4 , .TabF5 , .TabF6 , .TabF7 , .TabF8  {
   display: grid;
   justify-content: center;
   align-items: center;
} 

.TabF1H, .TabF2H, .TabF3H, .TabF4H, .TabF5H, .TabF6H, .TabF7H, .TabF8H {
   display: grid;
   justify-content: center;
   align-items: center;
}  

.TabNum{
grid-area: Num;
}

.TabNumH{
grid-area: NumH;
}

.TabTit{
grid-area: Tit;
}

.TabTitH{
grid-area: TitH;
}

.TabAut{
grid-area: Aut;
}

.TabAutH{
grid-area: AutH;
}

.TabJah{
grid-area: Jah;
}

.TabJahH{
grid-area: JahH;
}

.TabAuf{
grid-area: Auf;
}

.TabAufH{
grid-area: AufH;
}

.TabVerl{
grid-area: Verl;
}

.TabVerlH{
grid-area: VerlH;
}

.TabCov{
grid-area: Cov;
}

.TabCovH{
grid-area: CovH;
}

.TabHue{
grid-area: Hue;
}

.TabHueH{
grid-area: HueH;
}

.TabInh{
grid-area: Inh;
}

.TabInhH{
grid-area: InhH;
}

.TabISN{
grid-area: ISN;
}

.TabISNH{
grid-area: ISNH;
}

.TabF1{
grid-area: F1;
}

.TabF1H{
grid-area: F1H;
}

.TabF2{
grid-area: F2;
  border-right-style: solid;
}

.TabF2H{
grid-area: F2H;
  border-right-style: solid;
}

.TabF3{
grid-area: F3;
}

.TabF3H{
grid-area: F3H;
}

.TabF4{
grid-area: F4;
}

.TabF4H{
grid-area: F4H;
}

.TabF5{
grid-area: F5;
}

.TabF5H{
grid-area: F5H;
}

.TabF6{
grid-area: F6;
}

.TabF6H{
grid-area: F6H;
}

.TabF7{
grid-area: F7;
}

.TabF7H{
grid-area: F7H;
}

.TabF8{
grid-area: F8;
  border-right-style: solid;
}

.TabF8H{
grid-area: F8H;
  border-right-style: solid;
}

.pic{
 width: 5em;
 height: 7em;
}

.pic2{
 width: 5em;
 height: 5em;
}

.pic:hover{
-webkit-transform: scale(1.8);
-moz-transform: scale(1.8);
-ms-transform: scale(1.8);
-o-transform: scale(1.8);
transform: scale(1.8);  
}

.pic2:hover{
-webkit-transform: scale(1.8);
-moz-transform: scale(1.8);
-ms-transform: scale(1.8);
-o-transform: scale(1.8);
transform: scale(1.8);  
}
