body {

    background-color: #88a588;
    background-size: 100%;
}
   
h1 {
   
    text-align: center;
    background-color: rgb(237, 255, 196);
    border-radius: 20px;
    padding: 10px;
    margin: 10px;
   
}
h1 a{
    margin: 40px;
    text-decoration: none;
    color: rgb(75, 187, 122);
    transition: color 0.8s, font-size 0.8s;
    transition-timing-function: ease;
}
h1 a:hover{
  color: #18962d;
  font-style: inherit;
  font-size: 30px;
  text-decoration: none;
  padding-top: 0px;
}

a.active{
    color: rgb(12, 72, 10);
}

header {
    text-align: center;
    font-size: 50px;
    border-radius: 20px;
    background-color: rgb(255, 242, 227);
    color: rgb(109, 102, 102);
    
}
footer {
    background-color: rgb(255, 243, 228);
    text-align: center;
    font-size: 15px;
    padding: 00px;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    
    
}
footer a {
    text-decoration: none;
    color:rgb(109, 102, 102);
    background-color: rgb(255, 243, 228);
    
}
footer a:hover {
    color: rgb(0, 0, 0);
    text-decoration: underline;
}
::selection {
    background-color: rgba(111, 233, 137, 0.61);
    color: black;
}
.row {
  
  overflow: hidden;
}

.row img {
  width: 100%;
  transition: transform 0.3s ease;
}

.row img:hover {
  transform: scale(0.9);
}
.row {
  display: grid;
  grid-template-columns: 1fr 1fr; /* zwei Spalten */
  gap: 40px;
  align-items: center;
  margin: 10px auto;   /* auto = zentriert */
  max-width: 1400px;   /* damit es nicht ganz über den Bildschirm geht */
  padding: 20px;     /* bisschen Abstand links/rechts */
}

.row img {
  width: 100%;
  border-radius: 30px;
}

.text {
  font-size: 20px;
  text-align: center;
}

#creator {
   text-align: center;
   font-size: 30px;
   font-family: Georgia, 'Times New Roman', Times, serif
}