* {
  box-sizing: border-box;
}

/* Create four equal columns that floats next to each other */
.column {
  float: left;
  width: 33%;
  padding: 20px;
  background-color: darkmagenta;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* On screens that are 992px wide or less, go from four columns to two columns */
@media screen and (max-width: 992px) {
  .column {
    width: 100%;
    background-color: darkmagenta;
  }
  
}

/* On screens that are 600px wide or less, make the columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }}
  h1{
    text-align: center;
    background-color: darkorchid;
    
                text-align: center;
                font-size: 1.5cm;
                font-weight: 300;
                border-style: solid;
                border-color: black;
                border-width: 3mm;
              
                background-color: rgb(150, 103, 194);
                padding-top: 2cm;
                padding-bottom: 2cm;
            }
   header{
      background-color: darkorchid;
   } 
     .slogan{border-style: solid;
  background-color: #3e8e41;
  font-size: 5mm;
  border-radius: 90%;
  text-align: center;
  padding: 5mm;
  margin-right: 4.1cm;
}
body{
  background-color:darkmagenta ;
}
button{
  border-style: solid;
  border-color: black;
  border-width: 0.3mm;
  background-color: blueviolet;
  font-size: 8mm;
}
img{
  height: 6cm;
  width: 9cm;
}

img :hover{
  height: 8cm;
  width: 12cm;
}
.pp{
  text-align: center;
  font-size: 7mm;
  border-style: solid;
  border-width: 0.3mm;
  border-radius: 90%;
  background-color: cornflowerblue;
}

button{
  border-style: solid;
  border-color: black;
  border-width: 0.3mm;
  background-color: cornflowerblue;
  font-size: 8mm;
 border-radius: 90%;
 margin-left: 4cm;
 padding: 4mm;
 
 text-align: center;
}
.welche{
  text-align: center;
  font-size: 0.8cm;

  }