@media(min-width: 0px) {
    .info-box-grid {
        display: grid;
        align-items: flex-start;
    }

    .info-box-grid-2-cols {
        gap: var(--Spacing-Mid-Spacing, 40px);
        grid-template-columns: repeat(1, 1fr); /* grid-cols-2 not working?? */
    }

    .info-box-grid-3-cols {
        gap: var(--Spacing-Mid-Spacing, 40px);
        grid-template-columns: repeat(1, 1fr);
    }

    .info-box-item {
        display: flex;
        padding: var(--spacing-small);
        align-items: flex-start;
        gap: var(--spacing-large);
        flex:1;
        background:white;
        color: black;
        flex-direction: column;
        height: 100%;
        grid-template-rows: auto auto;
      }

    .info-box-item-top {
        display: flex;
        align-items: flex-start;
    }

    .info-box-item-top .info-box-item-image {
        border-radius: 182.154px;
        border: 0.3125rem solid var(--White);
        width: 74px;
        height: 74px;
        flex-shrink: 0;
    }

    .info-box-item-top .bw_icon {
        background-color: var(--Red);
        border-radius: 100%;
        width: 74px;
        height: 74px;
        text-align: center;
        border: 0.3125rem solid var(--White);
    }

    .info-box-item-top .material-symbols-outlined {
        color: var(--White);
        border-radius: 100%;
        font-size: 2rem;
        text-align: center;
        margin-top: 25%;
    }

    .info-box-item-top div {
        margin-left: -21px; /* Überlappung */
    }

    .info-box-item-top div:first-child{
        margin-left: 0; /* Verhindert negativen Margin beim ersten Element */
    }

    .info-box-item-content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-small, 16px);
        align-self: stretch;
        flex-grow: 1;
    }


    .info-box-item-content .contact-container h2:first-of-type,
    .info-box-item-content .contact-container h3:first-of-type,
    .info-box-item-content .contact-container h4:first-of-type
     {
        font-size: var(--font-size-16);
        font-weight: bold;
    }


    .info-box-item-content .contact-container {
        padding-top: 24px;
        gap: 24px;
    }

    /*
    .info-box-item-content .contact-container:has(> .contact:only-child) {
        height: 100%;
        justify-content: end;
    }
        */
/*
    .info-box-item-content .contact-container:has(> *:only-child) {
        margin-top: unset;
        height: 100%;
        justify-content: center;
    }
*/
    .linklisting_item a:hover {
    border-bottom: 1px solid white;
}


}
@media(min-width: 576px) {}
@media(min-width: 768px) {
        .info-box-item-top .info-box-item-image {
        width: 90px;
        height: 90px;
    }

    .info-box-item-top .bw_icon {
        width: 90px;
        height: 90px;
    }
    .info-box-item-top .material-symbols-outlined {
        margin-top: 30%;
    }

}
@media(min-width: 992px) {
    .info-box-grid-2-cols {
        grid-template-columns: repeat(2, 1fr); /* grid-cols-2 not working?? */
    }
    .info-box-grid-3-cols {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .info-box-item {
        padding: var(--spacing-medium);
      }
}
@media(min-width: 1200px) {
    .info-box-item {
        padding: var(--spacing-large);
      }
}
@media(min-width: 1400px) {}
@media(min-width: 1920px) {}