/* Zielgruppen-Element */
.zielgruppen {
    background-color: var(--us-lightgrey);
    padding: 50px 0 0 0;
    height: auto;
}
.zielgruppen li {
    display: inline-block;
    padding-left: 45px;
    height: 80px;
}
.zielgruppen h2, .zielgruppen li a {
    font-size: 17px;
    color: #323232;
    text-decoration: none;
}
.zielgruppen li a:hover {
    color: var(--us-blue);
    text-decoration: underline;
}
.zielgruppen h2 {
    font-size: 22px;
    margin-bottom: 30px;
}

/** Zielgruppen: Icons vor Einträgen: allgemein */
.zielgruppen li a::after {
    position: absolute;
    z-index: 0;
    content: " ";
    left: -10px;
    top: -10px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1.5px solid #323232;
    background-color: transparent;
}
.zielgruppen li a:hover::after {
    background-color: var(--us-blue);
    border-color: var(--us-blue);
}
.zielgruppen li a::before {
    position: absolute;
    z-index: 1;
    content: " ";
    left: -6px;
    top: -7.5px;
    width: 37px;
    height: 37px;
    background-size: var(--us-img-iconsprite-size);
    background-image: var(--us-img-iconsprite);
    box-sizing: inherit;
    border-radius: 50%;
}

/** Zielgruppen: Icons vor jeweiligen Buttons **/
/* Doktorhut (Wissenschaftlicher Nachwuchs)  */
.zielgruppen li a.persona-1::before {
    background-position: -651px -21px;
}
.zielgruppen li a.persona-1:hover::before {
    background-position: -651px 9px;
}
/*** Köpfe (Beschäftigte)  */
.zielgruppen li a.persona-2::before {
    background-position: -511px -25px;
    top: -5px;
}
.zielgruppen li a.persona-2:hover::before {
    background-position: -511px 5px;
}
/*** Aktenkoffer (Wirtschaft) */
.zielgruppen li a.persona-3::before {
    background-position: -441px -23px;
}
.zielgruppen li a.persona-3:hover::before {
    background-position: -441px 8px;
}
/*** Rakete (Gründer*innen) */
.zielgruppen li a.persona-4::before {
    background-position: -371px -29px;
    height: 35px;
    border-radius: 0;
    top: -4px;
    transform: scale(0.85);
}
.zielgruppen li a.persona-4:hover::before {
    background-position: -372px 2px;
    height: 30px;
}
/*** Bleistift (Presse und Medien) */
.zielgruppen li a.persona-5::before {
    background-position: -580px -30px;
    border-radius: 0;
    height: 31px;
    top: -2px;
    transform: scale(0.9);
}
.zielgruppen li a.persona-5:hover::before {
    background-position: -580px 1px;
    height: 31px;
    top: -3px;
}
/*** Infopoint (Studieninteressierte) */
.zielgruppen li a.persona-6::before {
    background-position: -776px -2px;
    width: 7px;
    height: 16px;
    top: 3px;
    left: 8.5px;
    transform: scale(1.8);
    border-radius: 0;
}
.zielgruppen li a.persona-6:hover::before {
    background-position: -801px -2px;
    width: 7px;
    height: 16px;
    top: 3px;
    left: 8.5px;
    transform: scale(1.8);
    border-radius: 0;
}
/*** Netzwerk (Alumni und Förder*innen) ->  */
.zielgruppen li a.persona-7::before {
    background-position: -711px -56px;
    width: 31px;
    left: -2.5px;
    top: -7.5px;
    border-radius: 0;
    transform: scale(0.9);
}
.zielgruppen li a.persona-7:hover::before {
    background-position: -772px -56px;
}
/*** Reagenzglas (Forschende) ->  */
.zielgruppen li a.persona-8::before {
    width: 30px;
    height: 33px;
    top: -3px;
    background-position: -581px -60px;
    border-radius: 0;
}
.zielgruppen li a.persona-8:hover::before {
    background-position: -648px -60px;
}
/*** Person liest Buch (Studierende)*/
.zielgruppen li a.persona-9::before {
    background-position: -240.5px -26px;
    width: 30px;
    border-radius: 0;
    left: -3px;
}
.zielgruppen li a.persona-9:hover::before {
    background-position: -302.5px -26px;
    width: 30px;
    left: -2px;
    border-radius: 0;
}