body {
    margin: 0;
    padding: 0;
}

.intro-container{
    height: 640px;
    display: flex;
    align-items: center;
    justify-content: center;
    /*border: solid;
    background-image: url(img/bild1.jpg);
    */background-size: cover;
    border-bottom: solid;
    background: linear-gradient(
        to right,
        beige 0%,
        beige 50%,
        #00dbab 50%,
        #00dbab 100%
    );
}

.img-header {
    position: absolute;
    top: 12px;
    left: 12px;
}
.img-header img{
    width: 150px;
}

.nav-bar{
    position: absolute;
    top: 24px;
    right: 24px;
    /*background-color: rgba(0, 0, 0, 0.5);*/
}

.nav-bar ul{
    list-style: none;
}

.nav-bar ul li{
    margin: 12px;
}

.nav-bar ul a{
    list-style: none;
    color: white;
    text-decoration: none;
}


.nav-bar .dropdown-content {
    display: none;
    position: absolute;
    right: 52px;
    top: 32px;
    z-index: 1;
    background-color: beige;
    border: solid;
    border-radius: 5px;
}

.nav-bar .dropdown-content li {
    display: block;
}

.nav-bar .dropdown-content li a {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: black;
    font-size: large;
}

.dropdown-btn {
    padding: 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 6px;
   border: none;
   width: 68px;
   background-color:  beige;
}




.content-rechts, .content-links {
    display: flex; /* Aktiviert Flexbox */
   
}

.content-text, .content-img {
    flex: 1; /* Weist beiden Kind-Elementen an, den verfügbaren Platz gleichmäßig aufzuteilen */
    display: flex;
}

/* Optional: Stellen Sie sicher, dass das Bild sich innerhalb seines Containers anpasst */
.content-img img {
    width: 100%; /* Passt die Breite des Bildes an seinen Container an */
    height: auto; /* Behält das Seitenverhältnis des Bildes bei */
}


.content-text {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;

}

.content-text p {
    
    font-size: larger;
    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    text-align:justify;

}

.footer{
    display: flex;
    align-items: start;
    justify-content: space-evenly;
   /* height: 44px; */
    background-color: rgb(0, 219, 171);
    padding-top: 32px;
    padding-bottom: 32px;
  
}

.footer a{
    margin-right: 12px;
    text-decoration: none;
    color: black;
}

.place {
    min-height: 220px;
}

.content-intro {
    display: flex;
    justify-content: space-between;
    width: 90vb;
}




/* CSS */
.button-33 {
  background-color: #c2fbd7;
  border-radius: 100px;
  box-shadow: rgba(44, 187, 99, .2) 0 -25px 18px -14px inset,rgba(44, 187, 99, .15) 0 1px 2px,rgba(44, 187, 99, .15) 0 2px 4px,rgba(44, 187, 99, .15) 0 4px 8px,rgba(44, 187, 99, .15) 0 8px 16px,rgba(44, 187, 99, .15) 0 16px 32px;
  color: green;
  cursor: pointer;
  display: inline-block;
  font-family: CerebriSans-Regular,-apple-system,system-ui,Roboto,sans-serif;
  padding: 7px 20px;
  text-align: center;
  text-decoration: none;
  transition: all 250ms;
  border: 0;
  font-size: 20px;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-33:hover {
  box-shadow: rgba(44,187,99,.35) 0 -25px 18px -14px inset,rgba(44,187,99,.25) 0 1px 2px,rgba(44,187,99,.25) 0 2px 4px,rgba(44,187,99,.25) 0 4px 8px,rgba(44,187,99,.25) 0 8px 16px,rgba(44,187,99,.25) 0 16px 32px;
  transform: scale(1.05) rotate(-1deg);
}