.card__container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; 
    margin: 0 auto;
    padding: 20px;
    width: 100%;
    max-width: 90%;
}

.card__div {
    max-width: fit-content;
    margin-left: auto;
    margin-right: auto;
    border: var(--writing-color) 2px solid;
    border-radius: 9px;
    padding: 12px;
    color: var(--writing-color);
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    width: 400px;
    max-width: 400px;
    height: 280px;
    max-height: 280px;
    transition: background-color 0.6s ease, transform 0.6s ease;
    transition: color 0.6s ease, transform 0.6s ease;
}


.card__div:hover {
    background-color: var(--writing-color);
    cursor: pointer;
    transform: scale(1.1);
    color: #343434;
}

.card__body h1 {
    color: var(--primary-color);
}

.card__img, .card__body {
    text-align: center;
}

.card__type {
    text-align: center;
}

.type__header {
    color: var(--primary-color);
}

.card__more {
    color: var(--primary-color);
    text-decoration: underline var(--primary-color) 2px solid;
    text-align: center;
}

#colorAlfredGiegerich {
    color: #7844A6;
    text-decoration-color: #7844A6;
}

#colorJoesNetwork {
    color: #AC7E41;
    text-decoration-color: #AC7E41;
}

#colorLinktree {
    color: #43E660;
    text-decoration-color: #43E660;
}

#colorStraesslerGebeudebau {
    color: #177983;
    text-decoration-color: #177983;
}

#colorNavbar {
    color: #d0c743;
    text-decoration-color: #d0c743;
}

#colorTicketSystem {
    color: #E60D0A;
    text-decoration-color: #E60D0A;
}

#colorRechner {
    color: #0A55E6;
    text-decoration-color: #0A55E6;
}

#colorBootStrap {
    color: #7210F7;
    text-decoration-color: #7210F7;
}

#colorBackend {
    color: #2DE184;
    text-decoration-color: #2DE184;
}

#colorShop {
    color: #980F15;
    text-decoration-color: #980F15;
}