body {
grid-template-rows: auto;
grid-template-columns: 100%;
grid-template-rows: 10% 86% auto;
background-color: var(--hintergrund-4);
}

main {
display: grid;
grid-template-columns: 100%;
grid-template-rows: 30vh;
grid-template-areas:
"überschrift-seite"
"container-card";
color: var(--textfarbe-2);
font-family: mundial, nothing, Yu Gothic;
}

.seite-titel {
margin-top: calc(.1vh + (800 - 3) * ((100vh - 600px) / (2500 - 900)));
text-align: center;
color: black;
font-size: calc(25px + (40 - 25) * ((100vw - 250px) / (2500 - 320)));
font-weight: 500;
letter-spacing: .25em;
text-transform: uppercase;
hyphens: auto;
letter-spacing: .5em;
}
.card {
display: grid;
grid-template-columns: 100%;
grid-template-rows: auto;
grid-area: 
"card-text"
"card-ziffer";
background-color: black;
color: var(--textfarbe-2);
width: calc(85px + (200 - 85) * ((100vw - 250px) / (2500 - 320)));
height: calc(85px + (200 - 85) * ((100vw - 250px) / (2500 - 320)));
padding: calc(10px + (50 - 25) * ((100vw - 250px) / (2500 - 320)));
flex-direction: column;
border: 3px solid rgb(163, 63, 5);

}
.card-ziffer {
font-size: calc(50px + (150 - 50) * ((100vw - 250px) / (2500 - 320)));
font-weight: 500;
color: rgb(99, 16, 10);
text-align: center;
}
.card-titel {
grid-area: card-text;
font-size: calc(12px + (27.5 - 12) * ((100vw - 250px) / (2500 - 320)));
font-weight: 300;
margin-top: -10px;
margin-bottom: 0%;
color: var(--textfarbe-2);
letter-spacing: .0em;
text-align: left;
}
.card:hover .card-titel{
color: var(--textfarbe-2);
}
.card:hover .card-ziffer{
color: var(--textfarbe-4);
font-weight: 100 ;
}


#container-card {
grid-area: container-card;
display: flex;
justify-content: center;
align-items: center;
gap: calc(7px + (25 - 7) * ((100vw - 250px) / (2500 - 320)));
margin-top: 1vh;
margin-bottom: calc(60px + (120 - 60) * ((100vw - 320px) / (1500 - 320)));
padding: 0 25px;
flex-wrap: wrap;
position: relative;
}

a:hover {
color: var(--textfarbe);
font-weight: 900;
letter-spacing: 0em;
}
.card-bild:hover, .card-bild-hoch:hover {
filter: none;
transform: scale(1.1);
transition: 250ms;
}


