body {
grid-template-rows: auto;
grid-template-columns: 100%;
}
main {
display: grid;
grid-template-columns: 100%;
grid-template-rows: auto;
grid-template-areas:
"titel-dienstleistung"
"text-dienstleistung"
"titel-besonders"
"text-besonders"
"titel-vergütung"
"text-vergütung";
font-size: calc(14px + (24 - 14) * ((100vw - 320px) / (1250 - 320)));
font-weight: 100;
background-image: url("bilder/a-2-9.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
margin-top: 10vh;
padding-top: 10vh;
}

.angebot-titel {
text-align: left;
margin: 5vh 0 0 10vw;
padding: 1.5%;
padding-left: 2%;
color: var(--textfarbe-1);
font-size: calc(12px + (60 - 12) * ((100vw - 320px) / (1800 - 320)));
font-weight: 100;
border: 3px, solid, var(--hintergrund-1);
z-index: 0;
}
#about-untertitel{
font-size: calc(6px + (40 - 8) * ((100vw - 320px) / (1800 - 320)));
font-weight: 100;
text-transform: uppercase;
}
.angebot-text {
text-align: justify;
margin: -15vh 7.5vw 2vh 7.5vw;
padding: 5%;
padding-top: 20vh;
padding-bottom: 5vh;
background-color: rgba(59, 102, 96, 0.65);
background-color: var(--hintergrund-8);
background-color: rgb(154, 158, 121, 0.60);
color: var(--textfarbe-2) ;
font-size: 100%;
line-height: 175%;
}
#schlagwort {
line-height: 300%;
color: var(--textfarbe-8);
font-size: 125%;
font-weight: 900;
text-transform: uppercase;
}
.betont {
color: var(--textfarbe-8);
font-weight: 900;
}

#bild-header {
grid-area: bild-header; 
background-color: var(--hintergrund-1);
}
#about-titel{
text-align: left;
margin: 5vh 0 0 10vw;
padding: 1.5%;
padding-left: 30%;
color: var(--textfarbe-1);
font-size: calc(10px + (50 - 10) * ((100vw - 320px) / (1800 - 320)));
font-weight: 500;
border: 3px, solid, var(--hintergrund-1);
z-index: 0;
margin: 10vh 15% 2vh -10.5%;
grid-area: titel-dienstleistung;
background-color: var(--hintergrund-8);
background-color: rgba(59, 102, 96, 0.65);
background-color: var(--hintergrund-3);
color: var(--textfarbe-2);
}
#about-absatz {
padding-top: 5vh; 
margin-top: 5vh;   
color: black;
}
#about-bild-1 {
display: flex;
height: calc(175px + (350 - 175) * ((100vw - 320px) / (1600 - 320)));
width: calc(175px + (350 - 175) * ((100vw - 320px) / (1600 - 320)));
overflow: hidden; 
margin: 2.5vh auto 5vh auto;
align-items: center;
justify-content: center;
border: 2px solid var(--hintergrund-4);
border-radius: 100%;
}
#about-absatz-1 {
padding: 0 7.5vw;    
}
#about-absatz-2 {
margin: 7.5vh 0;
padding: 0 7.5vw;    
}
#about-absatz-3, #about-absatz-4 {
margin-top: 5vh;
padding: 0 5vw;    
}
