* {box-sizing:border-box;} 
@font-face {
   font-family: Alba;
   src: url(Alba.ttf.woff);
   }
body {
	font-family:  Arial, Trebuchet, sans-serif;
	background-color: red;
    overflow:visible;

}
html, body{height: 100%}

input {height: 40px;
       width: 50%;
	   margin-bottom: 20px;
	   font-size: 1em;
}

#wrapper{height: 100vh;
         background-color: black;
		 padding-top: 15px;
		 width: 100vw;
        }
.pointer{cursor: pointer;
}

label{ width:  100px;
       display: inline-block;
     }

p.menu{color: white;
      font-size: 1.2em;
	  cursor: pointer;	  
	  margin-top: 8px;
}
a.menu{
	text-decoration: none;
	color: white;
}
a.klein_menu{
	text-decoration: none;
	color: black;
}

figure a, .markt{font-size: 1em;
         text-decoration: none;
		 color: red;
        }

a.menu:hover{color  #999999;
            }	
#spalte1 a {text-decoration: none;
            color: #97797e;
			}
#spalte1 a:hover{color: #999999;
          }			
.menu-grid{display: grid;
           justify-items: center;
           height: 100%;
		   width: 100%;
		   max-width: 1200px;
		   grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
          }
    .menu-grid > p{width: auto;
	              }


.main_spalten {	display: grid;
                width: 100%;
	            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Umbrechen, sobald die Box 400 Pixel Breite hat */
              }

.zwei_images {
	    display: grid;
		justify-items: center;
        width: 90%;
		min-width: 500px;
		grid-column-gap: 6em;
	    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); /* Umbrechen, sobald die Box 300 Pixel Breite hat */
	}

	.zwei_images > img {		
        padding-right: 0em;
		margin-left:2em;		
	}
.zwei_300 {
	    display: grid;
		justify-items: center;
        width: 80%;
		
	    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Umbrechen, sobald die Box 300 Pixel Breite hat */
	}

	.zwei_300 > div {		
        padding-right: 0em;		
	}
.zwei_spalten {
	    background-color: #fff;
	    display: grid;
        width: 100%;
	    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Umbrechen, sobald die Box 300 Pixel Breite hat */
	}

	.zwei_spalten > div {
		background-color: #000;
        padding-right: 0em;		
	}
.zwei_spalten_klein {
	   
	    display: grid;
		margin-bottom: 10px;
		justify-items: center;
        width: 100%;
	    grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));
        	/* Umbrechen, sobald die Box 300 Pixel Breite hat */
	}

	.zwei_spalten_klein > div {
		
        padding-right: 1em;		
	}
.zwei_ueber {
	    background-color: #fff;
	    display: grid;
		justify-items: center;
        width: 80%;
	    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		grid-gap: 30px;	
     }

	.zwei_ueber > div {
		
        padding: 1em;
        height: auto;		
	}


a:hover{ /* Durch diese Gruppe von Selektoren wird bei Verwendung der Tastatur der gleiche Hover-Effekt wie beim Verwenden der Maus erzielt. */
	color:#76797e;
	text-decoration: none;
}

.aktuell {line-height: 1.5em;
         }
.aktuell>ul{list-style-position:inside;
             line-height: 2em;
}
.aktuell>div>a{text-decoration: none;
           color: red;
}

.galerie{ 

	 padding:0.5em;
    display: block;
	width: 90%;
	background-color: black;
	
}
.galleria{background-color: black;
          min-height: 70vh;
}
div#upload-button{height: 20px;
                  width: 15%;
				  background-color: grey;
				  float: right;
				  position: relative;
				  padding-top: 0px;
				  cursor: pointer;
				  margin-right: 30px;
				 
                 }