/* Transitionspeed *****/
:root {
    --t:1s;
}

.schr_sw {
    position:absolute;
    top: 43px;
    left: 135px;
    height:45px;
    width:120px;
    transition: var(--t);
}

.schr_sw1 {
    left:10px;
    top:40px;
    height:0px;
    width:0px;
    opacity: 0;    
}

.logo2 {
    position:absolute;
    top:60px;
    left:2px;
    height:32px;
    width:273px;
    background:#C50000;
    transition: var(--t);
}

.logo2_small {
    top: 10px;
    left: 7px;
    width: 70px;
    height: 70px;
    background-color: yellow;
    border-radius: 50%;
}

.f1 {
    position:absolute;
    top:15px;
    left:-3px;
    height:90px;
    transition: var(--t);
    cursor: pointer;
    animation: wackeln 2s;
    animation-timing-function: linear ;
    animation-iteration-count: infinite;
    z-index: 100;
}

/* Logo Klickbereich (Link) */
.logo-click-area {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100px;
    width: 290px;
    z-index: 10000;
    cursor: pointer;
}


@keyframes wackeln {
    0%{
        transform: rotate(0deg) ;
        
    }
    20%{
        transform: rotate(0.5deg) translateX(1px) translateY(1px);
    }
    40% {
        transform: rotate(0deg);
    }
    60%{
        transform: rotate(0.5deg) translateX(1px) translateY(1px);
    }
    80% {
        transform: rotate(0deg);
    }
    80% {
        transform: rotate(0.5deg) translateX(1px) translateY(1px);
    }
}


.f1_small {
    top:10px;
    left:0px;
    height:60px;
}

@media screen and (max-width:1000px) {

    .logo-click-area {
        width: 160px;
        height: 80px;
    }

    .logo2 {
        transform: scale(0.55);
        transform-origin: top left;
        top: 35px;
        left: 8px;
        height: 32px;
        width: 273px;
        background: #C50000;
    }

    .logo2_small {
        top: 12px;
        left: 12px;
        width: 56px;
        height: 56px;
        background-color: yellow;
        border-radius: 50%;
        transform: none;
    }

    .schr_sw {
        transform: scale(0.55);
        transform-origin: top left;
        left: 81px;
        top: 25px;
    }

    .f1 {
        left: 6px !important;
        top: 12px !important;
        height: 48px !important;
    }
    
    .f1_small {
        left: 6px !important;
        top: 12px !important;
        height: 48px !important;
    }

}
