*{
 box-sizing    : border-box ;	
 padding       : 0          ;
 margin-top    : 1.0vh      ;
 margin-bottom : 1.0vh      ;
 margin-left   : 0.5vw      ;
 margin-right  : 0.5vw      ; 
 font-family   : 'Helvetica','Helvetica Light',sans-serif;
 }

p{
 margin-top:0vh;	 
 }

h1,h2,h3,h4{
          text-align  : left ;
          margin-left : 0.5vw;		
          }
	   
h2{
  margin-bottom : 0.75vh;	
  }

h3{
  margin-bottom : 0.5vh;	
  }

h4{
  margin-bottom : 0.25vh;	
  }

ul{
  padding-left : 0.5em;	
 }

table{
	width   : 100% ;
    }

tr:nth-child(even) {
  background-color: rgb(120,210,120);
}

th{
  background-color : rgb(160,220,160); /* Überschriften wie Hintergrund */
  text-align: left;
  padding: 0.5vh;                     /* Abstände von allen Rändern */
  }

td{
  vertical-align:top; /* Text in Zellen oben ausrichten */
  padding: 0.5vh;
  }
  
  
  
/*td:nth-of-type(1){
	            text-align:left; 
                }  

td:nth-of-type(2){
	            width:5%;
				text-align:center; 
                }
				
td:nth-of-type(3){
	            text-align:left;
                }  



li{
 list-style-position:inside;	
 }*/

form{
	width            : 100%             ;
	height           : 100%             ;        
	background-color : rgb(160,210,255) ;
	display          : flex             ;
	justify-content  : space-around     ;
	align-items      : center           ;
	margin           : 0                ;
    }

input[type="submit"]{
                   border           : 0.25vh solid         ;
                   border-radius    : 25%                  ;
	               width            : 17.5%                ;
	               height           : 4vh                  ;
				   padding          : 0.5%                 ;
	               background-color : gray                 ; 	
				   transition       : background-color 1s  ;
				   font-size        : calc(0.75vh + 0.5vw) ;
				   font-weight      : bold                 ;
				   letter-spacing   : -0.05em              ;
                   }

input[type="submit"].small{
	                     border-radius : 40% ;
	                     width         : 4%  ;
	                     height        : 3vh ;
						 padding       : 0   ;
	                     }

input[type="submit"]:hover:enabled{
	                             background-color : rgb(45,135,45)       ;
	                             transition       : background-color  1s ;
                                 }

label{
   font-size : calc(0.75vh + 0.75vw) ;
   }
   
.animated-text {
              font-family: monospace  ;
              overflow   : hidden     ;
              height     : 10vh		  ;
              word-wrap  : break-word ;
              white-space: nowrap     ;
              animation  : typing 3s steps(26) forwards ;
}

@keyframes typing {
                  from { width: 0; } to  { width: 26ch; }
                  }
				  
html{
	height:95%;
	}

body{
	height          : 100%;
	margin          : 0.75%;
	overflow        : auto;
	background-color: rgb(160,220,160);
    }

#site{
     height:100%;
	 background-color: rgb(45,135,45);
	 display: -ms-grid;
	 -ms-grid-columns: 0% 100% 0%;
     -ms-grid-rows: 10% 10% 13% 34% 23% 10%;
     display: grid;
     grid-template-columns: 0% 100% 0%;
     grid-template-rows : 10% 10% 13% 34% 23% 10%;
     }
	
@media screen and (min-width: 40em)
{#site{
      display: -ms-grid;	
      -ms-grid-columns: 0% 75% 25%;
      display: grid;
      grid-template-columns: 0% 75% 25%;
      }
}

@media screen and (min-width: 50em)
{#site{
      display: -ms-grid;	
      -ms-grid-columns: 20% 60% 20%;
      display: grid;
      grid-template-columns: 20% 60% 20%;
      }
}

#left{
	 display:none;
     }

#picture1{
	     display:none;
		 }
		 
@media screen and (min-width: 50em)
{#picture1{
	      display:flex;
	      -ms-grid-column: 1;
	      -ms-grid-row  : 1;
          -ms-grid-row-span: 3;
          grid-column: 1;
	      grid-row: 1 / 4; 
          background-image: url("bild1.jpg");
          background-size:cover;		 
          }
}		  
	  
#picture2{
	     display:none;
		 }	
		 
@media screen and (min-width: 50em)
{#picture2{
	      display:flex;
	      -ms-grid-column: 1;
	      -ms-grid-row  : 4;
	      grid-column: 1;
	      grid-row: 4;  
		  background-image:url("bild2.jpg");
          background-size:cover;
		  }
}		 
		 
#picture3{
	     display:none;  /* ausblenden */
		 }

@media screen and (min-width: 50em)		 
{#picture3{
	      display:flex;
	      -ms-grid-column: 1;
          -ms-grid-row  : 5;
	      -ms-grid-row-span: 3;
	      grid-column: 1;
	      grid-row: 5 / 7; 
		  background-image: url("bild3.jpg");
          background-size:cover;		 
          }
}		 

#header{
	   display: flex;
	   -ms-grid-column  : 2;
	   -ms-grid-row     : 1;
	   grid-column      : 2;
	   grid-row         : 1; 
       background-color : rgb(160,220,160);
	   align-items      : center;
	   justify-content  : center;
	   font-size        : calc(50% + 0.5vh + 1vw);
	   }

#nav{
	-ms-grid-column  : 2 ;
	-ms-grid-row     : 2 ;
	grid-column      : 2 ;
	grid-row         : 2 ;  
	}
	  
#main{
	 -ms-grid-column   : 2;
     -ms-grid-row      : 3;
     -ms-grid-row-span : 3;
   	 grid-column       : 2;
	 grid-row          : 3 / 6;  
     display           : flex;
	 flex-direction    : column;
	 background-color  : rgb(160,220,160);
	 padding           : 5%;
	 }
	 
#footer{
	   -ms-grid-column : 2;
	   -ms-grid-row    : 6;
	   grid-column     : 2;
	   grid-row        : 6;  
       background-color: yellow;
	   }

#aside1{
	   display:none;
	   }
	   
@media screen and (min-width: 40em)	  
{#aside1{	    
	    -ms-grid-column   : 3     ;
	    -ms-grid-row      : 1     ;
	    -ms-grid-row-span : 3     ;
	    grid-column       : 3     ;
	    grid-row          : 1 / 4 ; 
        display           : flex  ;		
		background-image  : url("bild4.jpg");
        background-size   : cover ;
	    }
}
	  
#aside2{
  	   display:none;
	   }
	   
@media screen and (min-width: 40em)
{	  
#aside2{	  
	   -ms-grid-column  : 3      ;
	   -ms-grid-row     : 4      ;
	   -ms-grid-row-span: 3      ;
	   grid-column      : 3      ;
	   grid-row         : 4 / 7  ;
	   display          : flex   ;
	   flex-direction   : column ;
       justify-content  : center ;
	   align-items      : flex-start ;	
       font-size        : calc(0.75vh + 0.75vw);	   
       background-color : rgb(160,220,160);
	   padding          : 5%     ;
	   }	  
}