.union a {color: #8a8a8a; }
.union a:hover { color: var(--cdPink);}

.union.col-content { margin: 10px 0 44px; }
.union.col-content .item {}


.union.col-content h2 { font-size: 1.7em; color: var(--contentBlue); margin-bottom: 26px; text-align: center; }
.union.col-content ul { list-style: none; margin: 0; font: 1em var(--fontHeadline); background-color: #f3f3f3; padding: 8px 28px 28px 28px; display: flex; align-items: center;  }
.union img { width: 96px; height: auto;}
.union li.image { margin-right: 10px; }


/* Im Stil des eigentlichen Contentbanners
.union.col-content {display: flex; background-color: var(--contentBlue); padding: 0 36px 30px 36px;}
.union.col-content a {color: #fff; }
.union.col-content h4 { font-size: 1.94em; color: #fff; margin: 26px 0; }
.union.col-content img { width: 210px; background-color: rgba(255,255,255,.87); margin-bottom: 10px;}
.union.col-content ul { display: flex; justify-content: space-between; }
.union.col-content ul li { flex: 1; display: flex; flex-flow: column; max-width: 210px; font: 1.2em var(--fontHeadline); }

 */

@media (min-width: 576px) {

    .union.col-content .item {display: flex; justify-content: space-between;}
    .union.col-content ul { display: block;text-align: center; flex: 1; font-size: .74em; margin-top: 0 !important; }
    .union.col-content ul:nth-of-type(2) { margin: 0 24px;}
    .union.col-content img { max-width: 100%; width: auto;  }
    .union.col-content li.image { margin-right: 0; }

}

@media (min-width: 768px) {


    .union.col-content ul { font-size: 1em;}

}

@media (min-width: 992px) {

    .union.col-content ul { font-size: .9em; }
}

@media (min-width: 1200px) {
    .union.col-content ul { font-size: 1em;  }
    .union.col-content img { max-width: 180px; height: 180px; }

}

@media (min-width: 1320px) {
    .union.col-content ul { font-size: 1em;  }
    .union.col-content img { max-width: 180px; height: 180px; }
}