/**/
/* CSS for Career Pages */
/**/

:root
{
    --gbGreen: #54CC90;
}

@media screen and (min-width: 1200px) {

    #headerWrapper .menuLinkLevel1:hover,
    #headerWrapper .menuLinkLevel1:focus
    {
        background-color: var(--gbGreen);
        color: white;
    }

    li.level1:hover > a,
    li.level1:focus > a {
        background-color: var(--gbGreen);
        color: white!important;
    }

}

.logoText
{
    fill: var(--gbGreen);
}

.stdPage8 #breadCrumbWrapper
{
    /*background-color: var(--gbGreen);*/
    color: var(--gbBlack2);
    /*border-top-color: var(--gbGreen);*/
}

section.contentItemBackground_greenBG .frame .contentBody,
section.contentItemBackground_greenBG .imageTextTextItem
{
    background-color: var(--gbGreen);
}

.content-wide:has(#teaser)
{
    width: unset;
    padding-inline: 0;
}

#stoererRechts a
{
    background-color: var(--gbGreen);
}

.contentItemLayout13 > .frame > *
{
    max-width: 650px;
}

section.contentItemBackground_collage
{
    background-color: var(--gbLightGrey);
}

.contentItemtextpic.contentItemBackground_collage .frame
{
    width: var(--NarrowContentWidth);
}

.contentItemtextpic.contentItemBackground_collage .ce-gallery
{
    padding-block: 8rem;
    color: var(--gbDarkGrey);
}

#mainContent .contentItemLayout2
{
    background-color: white;
}

.imageTextGroup
{
    /*width: var(--NarrowContentWidth);*/
    margin-inline: auto;
}

.imageTextTextItem
{
    /*background-color: var(--gbGreen);*/
}

.imageTextTextItem header
{
    color: var(--gbBlau);
}

.footerHeader
{
    display: none;
}

.verzeichnisse
{
    display: none;
    padding-top: 0;
}

.frame-layout-8 .contentBody p:first-child
{
    break-after: auto;
}

a.ctaLink:link,
a.ctaLink:visited {
    position: absolute;
    bottom: 8%;
    right:  5%;
    min-width: 130px;
    padding-inline: 1.5rem;
    padding-top: 0.5rem;
    padding-bottom: 1rem;
    margin-left: auto;
    color: var(--gbBlack);
    background-color: transparent;
    background-image: linear-gradient(var(--gbBlack), var(--gbBlack));
    background-repeat: no-repeat;
    background-position: 100% 100%;
    background-size: 0 100%;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

a.ctaLink:after {
    content: url(images/Pfeil_mehr_78x15px_schwarz.svg);
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translateX(-50%);
}

a.ctaLink:hover {
    color: white;
    background-size: 100% 100%;
}

a.ctaLink:hover:after {
    content: url(images/Pfeil_mehr_78x15px_weiss.svg);
}

.stdPage5 #teaserWrapper
{
    height: auto;
}

.stdPage5 #teaserWrapper .ce-textpic.ce-left.ce-intext.ce-nowrap .ce-bodytext header
{
    position: unset;
    top: unset;
    left: unset;
    width: auto;
    padding-left: 0;
}

.stdPage5 #teaserWrapper .ce-textpic.ce-left.ce-intext.ce-nowrap .ce-bodytext header *
{
    color: var(--gbBlau);
}

.stdPage5 #teaserWrapper .contentItemsliderItem > .content,
.stdPage5 #teaserWrapper .frame-sliderItem
{
    max-width: var(--NarrowContentWidth);
    padding-inline: var(--content-padding-inline);
    margin-inline: auto;
    /*background-color: transparent;*/
}

div.locationListItem:nth-of-type(1) .locationText { background-image: url('images/GrubBrugger_Karriere_Standorte_Stuttgart.svg'); background-position: right  bottom; }
div.locationListItem:nth-of-type(2) .locationText { background-image: url('images/GrubBrugger_Karriere_Standorte_Muenchen.svg');  background-position: center bottom; }
div.locationListItem:nth-of-type(3) .locationText { background-image: url('images/GrubBrugger_Karriere_Standorte_Frankfurt.svg'); background-position: left   bottom; }
div.locationListItem:nth-of-type(4) .locationText { background-image: url('images/GrubBrugger_Karriere_Standorte_Freiburg.svg');  background-position: left   bottom; }

div.locationText
{
    background-color: var(--gbGreen);
}

@media only screen and (max-width: 1200px) {

    :root {
        --headerHeight: 90px;
    }
}

@media only screen and (max-width: 800px) {

    a.ctaLink:link,
    a.ctaLink:visited {
        bottom: var(--content-padding-inline);
        right:  var(--content-padding-inline);
    }

}


