* {
    box-sizing: border-box;
    margin: 0em;
    
}

body{
    padding: 1em 1em 1em 1em;
}


h1, h2, h3, p, li {
    font-family: "Raleway", Arial, sans-serif;
    color: #4D4D4C;
  }

h1 {
    letter-spacing: 0.1em;
    font-size: 1.3em;
    
}

h2 {
    font-size: 1em;

}

h3{
    font-style:italic;
        font-weight: 100;
    font-size: 0.8em;
    
}

.header3{
    font-style: normal;
    font-weight: bold;
}

p{
    font-size: 0.8em;
     padding: 0.5em 0em 0.5em 0em;
}


li{
    font-size: 0.8em;
}

table {
   table-layout: fixed;
   max-width:100%;
   width:100%;
}

.container  {
  max-width: 100%;
  height: auto;
}


main {
    background-color: white;
}

.responsive {
    max-width: 100%;
    height: auto;
    background-color:white;
    border: none;
}

.mySlides {
    max-width: 100%;
    height: auto;
    border: none;
}

.einbetten {
    max-width: auto;
    height: auto;
    border: none;
}

a {
    border: none;
    text-decoration: none;

}
.klein {
    font-family: "Raleway", Arial, sans-serif;
    font-size: 0.8em;
    color: #4D4D4C;
}

/*video {
  max-width: auto;
  height: 100%;
}
*/

/*img[usemap] {
		border: none;
		height: auto;
		max-width: 100%;
		width: auto;




#hinweis {
    font-family: 'Raleway';
    font-size:1.4em;
    text-align: center;

}

#none { 
    background-color:white;
}

.navigation{
    text-align: center
}




.social{
    font-size:1.5em;   
    color:white;
}

#social{
    font-size: 0.8em;
    text-align: right;
 
}

#copyright{
    font-size: 0.8em;
    text-align: right;
}

/* Frosch in Landschaft */
#black {
    color: black;
}


/*Responsive Tabelle */

.row {
  display: flex;
  flex-wrap: wrap;    
}

/* Create four equal columns that sits next to each other */
.column {
  flex: 25%;
  max-width: 25%;
  padding: 01.em 0.1em 0.1em 0.1em;
    color: none;

  
    
}
.column p {
  margin-top: 0.1em;
  vertical-align: left;
  max-width: 300px;
}
.column img {
  margin-top: 0.1em;
  vertical-align: left;
  max-width: 300px;
    
 
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
      
      
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    flex: 100%;
    max-width: 100%;