.staerken {
    position: relative;
    min-height: 100vh;
    background-image: url(/wp-content/uploads/2023/03/melchers_infografik.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 52%;
}
.ausgrauen {
    filter: grayscale(100%); /* Standard */
    -webkit-filter: grayscale(100%); /* Webkit */
    filter: gray;  /* IE6-9 */
    -webkit-filter: grayscale(1); /* Old WebKit */
    opacity: 0.7;
    transition: 0.5s all;
}

.symbolback {
    position: absolute;
    width:100vw;
    height: 100vh;
}
.symbolback img {
    transition: 0.5s all;
    display: inline-block;
    position: absolute;
}

.symbolback .brand {
    top:0;
    left:0;
}
.symbolback .strategy {
    top:0;
    right:0;
}
.symbolback .trade {
    bottom:0;
    left:18%;
}
.linktext .linkbild {
    max-width:100%;
}
.linktext.strategy {
    position: absolute;
    left: 59vw;
    top: 26vh;
}
.linktext.brand {
    position: absolute;
    left: 12vw;
    top: 37vh;
}
.linktext.trade {
    position: absolute;
    right: 30%;
    top: 80vh;
}

.textbox {
    display:none;
}

.linkline {
    position:relative;
    overflow:hidden;
    height: 20px;
    width:100%;
    transition: 0.5s all;
}
.trade .linkline img {
    position: absolute;
    left: -210px;
}
.brand .linkline img {
    position: absolute;
    left: -217px;
}
.strategy .linkline img {
    position: absolute;
    left: -250px;
}
.trade .linkline.full img {
    left: -57px;
    transition: 0.5s all;
}
.brand .linkline.full img {
    left:-54px;
    transition: 0.5s all;
}
.strategy .linkline.full img {
    left: -15px;
    transition: 0.5s all;
}
.threelinks {
    position: relative;
}

.rota {
    animation: plusrota 0.5s;
    animation-fill-mode: forwards;
}
@keyframes plusrota {
    20% { 
        transform: rotate(-20deg);
        }
    100%    { 
        transform: rotate(90deg);
    }
}

.rota2 {
    animation: plusrota2 0.5s;
    animation-fill-mode: forwards;
}
@keyframes plusrota2 {
    20% { 
        transform: rotate(20deg);
        }
    100%    { 
        transform: rotate(-90deg);
    }
}


.movestrategy {
    animation: moversta 0.5s;
    animation-fill-mode: forwards;
}
@keyframes moversta {
    20% { 
        left: 58vw;
        }
    100%    { 
        left: 62vw;
    }
}
@media (max-width: 430px) {
    @keyframes moversta {
        20% { 
            left: 24vw;
            }
        100%    { 
            left: 28vw;
        }
    }
}
.symbolback .strategy.move {
    right: 60px;
    transition: 0.5s all;
}

.movebrand {
    animation: moverbra 0.5s;
    animation-fill-mode: forwards;
}
@keyframes moverbra {
    20% { 
        left: 11vw;
        }
    100%    { 
        left: 15vw;
    }
}
@media (max-width: 430px) {
    @keyframes moverbra {
        20% { 
            left: -22vw;
            }
        100%    { 
            left: -18vw;
        }
    }
}
.symbolback .brand.move {
    left: -60px !important;
     transition: 0.5s all;
}

.movetrade {
    animation: movertra 0.5s;
    animation-fill-mode: forwards;
}
@keyframes movertra {
    20% { 
        right: 29%;
        }
    100%    { 
        right: 35%;
    }
}
@media (max-width: 430px) {
    @keyframes movertra {
        20% { 
            right: -20vw;
            }
        100%    { 
            right: -24vw;
        }
    }
}
.symbolback .trade.move {
    left: 120px !important;
     transition: 0.5s all;
}

.linktext {
    cursor:pointer;
    display:block;
    transition: 0.5s all;
    z-index:20;
}
.linktext .plus {
    position:  relative;
    top: -30px;
    display:inline-block;
    transition: 0.5s all;
}
.linktext.strategy .linkline,
.linktext.trade .linkline {
    position: relative;
    left: 56px;

}
.linktext.brand .linkline {
    position: relative;
}
.textboxen {
    position:relative;
}
.textbox {
    position: absolute;
    text-align: right;
    width: 33%;
}
.textbox h3 {
    line-height: 35px !important;
}
.textbox.strategy {
    top: -60vh;
    right: 5vh;
    z-index: 15;
}
.textbox.brand {
    top: -50vh;
    left: -10vw;
    z-index: 15;
}
.textbox.trade {
    top: -35vh;
    right: 2vh;
    z-index: 15;
}

@media (max-width: 430px) {
    .staerken {
        background-size: 60%;
        background-position: center 33%;
        min-height: 65vh;
    }
    .symbolback {
        height:73vh;
    }
    .symbolback .strategy {
        width: 45%;
        top: -4vh;
    }
    .symbolback .brand {
        left: -24%;
        height: 27vh;
        top: -5vh;
    }
    .symbolback .trade {
        left: 21%;
        width: 55%;
        bottom: 17vh;
    }
    .trade .linkline.full img {
        left: -105px;
    }
    .brand .linkline.full img {
        left: -94px;
    }
    .linktext {
        transform: scale(0.3);
        width:100%;
    }
    .linktext.strategy {
        left: 25vw;
        top: 15vh;
    }
    .linktext.brand {
        left: -21vw;
        top: 18vh;
    }
    .linktext.trade {
        right: -21vw;
        top: 32vh;
    }
    .textbox {
        background-color: rgba(0,0,0,0.7) !important;
        text-align:center !important;
        width: 100%;
    }
    .textbox h3 {
        font-size: 19px !important;
        line-height: 22px !important;
    }
    .textbox p {
        text-align: center !important;
        font-size: 12px !important;
        line-height: 15px !important;
        margin-bottom: 5px;
    }
    .textbox.strategy {
        top: -18vh;
        right: 0;
        left:0;
    }
    .textbox.brand {
        top: -18vh;
        right: 0;
        left:0;
    }
    .textbox.trade {
        top: -18vh;
        right: 0;
        left:0;
    }
}