.parent {
        position: absolute;
        width: 100%;
        top: 102px;
        margin-top: 8px;
        margin-bottom: 8px;
        z-index: -1;
    }

    .ballon {
        position: absolute;
        background-image: url(../img/ani/ballon.png);
        background-size: cover;
        width: 100px;
        height: 100px;
        z-index: 0;
        top:-100px;
        animation: slideballon 90s linear infinite;
    }

    @keyframes slideballon {
        0% {left: -100px;}
        50%{left: 100vw;}
        100% {left: -100px;}
    }

    .stop1{
        position: absolute;
        background-image: url(../img/ani/stopsev.png);
        background-size: cover;
    } 
    
    .stop2{
        position: absolute;
        background-image: url(../img/ani/stopsev.png);
        background-size: cover;
    }
    
    .kran{
        position: absolute;
        background-image: url(../img/ani/kran.png);
        transform: rotateY(180deg);
        background-size:cover;
    }

    .red-bus {
        position: absolute;
        background-image: url(../img/ani/busrot.png);
        background-size: cover;
    }

    .yellow-box {
        position: absolute;
        background-image: url(../img/ani/busl.png);
        background-size: cover;
    }

    .blue-box {
        position: absolute;
        background-image: url(../img/ani/busr.png);
        background-size: cover;
    }

    .police {
        position: absolute;
        background-image: url(../img/ani/police.png);
        background-size: cover;
        transform: rotateY(180deg);
    }

    @media only screen and (max-width : 480px) {
        
        #anzeige1, #anzeige2, #info , #werbung, #nachwort, #anzeigefoot, #anzeigemobi, #anzeigepc{
            width: 95vw;
        }

        #info{
            height: 85px;
        }

        #wrapper{
            width:90vw;
            height:calc(90vw * 0.6);
        }

        #slider-wrap{
            width:90vw;
            height:calc(90vw * 0.6);
        }

        #pagination-wrap{
            margin-top:calc(85vw * 0.57);
        }

        #slider-wrap ul#slider li{
            width:90vw;
            height:calc(90vw * 0.6);
        }

        #slider-wrap ul#slider li i{
            line-height:90vw;
        }

        #slider-wrap ul#slider li img{
            line-height:90vw;
        }

        #counter{
            top: 10%; 
            right:20px; 
        }
        
        #anzeigemobi{
            height: 400px;
        }

        .gallery  {  
            width: 150px;
            height: 300px;
            margin-top: 40px;
        }

        .gallery > img {
            width: 100%;
            height: 300px;
        }

        .diveingabe {
            flex-direction: column;
        }
        
        form{
            width:90vw;
        }
        .stop1{
            /*position: absolute;
            background-image: url(../img/ani/stopsev.png);
            background-size: cover;*/
            left:30vw;
            width: 70px;
            height: 70px;
            top: 25px;
            z-index: -2;
            object-fit: cover;
        }

        .stop2{
            /*position: absolute;
            background-image: url(../img/ani/stopsev.png);
            background-size: cover;*/
            left:50vw;
            width: 70px;
            height: 70px;
            top: 25px;
            z-index: 2;
            object-fit: cover;
        }
        
        .zug{
            position: absolute;
            background-image: url(../img/ani/3train.png);
            background-size:cover;
            top:-55px;
            width: 400px;
            height: 200px;
            z-index: -3;
            animation: slidezug 8s linear infinite;
        }        
        
        @keyframes slidezug {
            0% {left: -400px;}
            35%{left: calc(72vw - 400px);}
            60%{left: calc(72vw - 400px);}
            100% {left: -400px;}
        }
        
        .kran{
            /*position: absolute;
            background-image: url(../img/ani/kran.png);
            transform: rotateY(180deg);
            background-size:cover;*/
            top:0px;
            width: 100px;
            height: 100px;
            z-index: -3;
            left:72vw;
        }

        @keyframes slidekran {
            0% {left: 95%;}
            40%{left: 75%;}
            60%{left: 75%;}
            100%{left: 95%;}
        }

        .blink_me {
            background-color: orange;
            height: 10px;
            width: 10px;
            margin-top: 33px;
            margin-left: 30px;
            border-top-right-radius: 32px;
            border-top-left-radius: 32px;
            animation: blinker 1s linear infinite;
        }

        @keyframes blinker {
            50% {opacity: 0;}
        }

        .red-bus {
            /*position: absolute;
            background-image: url(../img/ani/busrot.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            top: 25px;
            z-index: 1;
            animation: sliderot 22s linear infinite;
        }

        @keyframes sliderot {
            0% {left: -100px;}
            50%{left: -100px;}
            65%{left: 50vw;}
            85% {left: 50vw;}
            100%{left: 100vw;}
        }

        .yellow-box {
            /*position: absolute;
            background-image: url(../img/ani/busl.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            top:23px;
            z-index: 1;
            animation: slidegelb 22s linear infinite;
        }

        @keyframes slidegelb {
            0% {left: -100px;}
            17.5%{left: 50vw;}
            35%{left: 50vw;}
            50% {left: 100vw;} 
            50.01%{left: -100px;}
            100%{left: -100px;}
        }

        .blue-box {
            /*position: absolute;
            background-image: url(../img/ani/busr.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            top:23px;
            z-index: -1;
            animation: slideback 12s linear infinite;
        }
        
        @keyframes slideback {
            0% {left: 100vw;}
            30%{left: 25vw;}
            70%{left: 25vw;}
            100% {left: -100px;}
        }

        .police {
            /*position: absolute;
            background-image: url(../img/ani/police.png);
            background-size: cover;
            transform: rotateY(180deg);*/
            width: 70px;
            height: 70px;
            z-index: 0;
            top:43px;
            animation: slidepoli 9s linear infinite;
        }

        @keyframes slidepoli {
            0% {left: 100%;}
            70% {left: -70px;}
            100%{left: -70px;}
        }
    }

    @media only screen and (max-width : 800px) and (min-width : 481px) {
        .diveingabe {
            flex-direction: column;
        }
    }
    @media only screen and (max-width : 1024px) and (min-width : 481px) {

        #anzeige1, #anzeige2, #info, #werbung, #nachwort, #anzeigefoot, #anzeigemobi, #anzeigepc{
            width: 90vw;
        }

        form{
            width:85vw;
        }

        #wrapper{
            width:85vw;
            height:calc(85vw * 0.6);
        }

        #slider-wrap{
            width:85vw;
            height:calc(85vw * 0.6);
        }

        #pagination-wrap{
            margin-top:calc(85vw * 0.57);
        }

        #slider-wrap ul#slider li{
            width:85vw;
            height:calc(85vw * 0.6);
        }

        #slider-wrap ul#slider li i{
            line-height:85vw;
        }

        #slider-wrap ul#slider li img{
            line-height:85vw;
        }

        #counter{
            top: 10%; 
            right:20px; 
        }

        .stop1{
            /*position: absolute;
            background-image: url(../img/ani/busstopx.png);
            background-size: cover;*/
            left:40vw;
            width: 70px;
            height: 70px;
            top:4px;
            z-index: -2;
            object-fit: cover;
        }

        .stop2{
            /*position: absolute;
            background-image: url(../img/ani/busstopx.png);
            background-size: cover;*/
            left:50vw;
            width: 70px;
            height: 70px;
            top:4px;
            z-index: 2;
            object-fit: cover;
        }

        .zug{
            position: absolute;
            background-image: url(../img/ani/train1.png);
            background-size:cover;
            top:-194px;
            width: 800px;
            height: 400px;
            z-index: -3;
            animation: slidezug 12s linear infinite;
        }        
        
        @keyframes slidezug {
            0% {left: -800px;}
            35%{left: calc(80vw - 800px);}
            60%{left: calc(80vw - 800px);}
            100% {left: -800px;}
        }

        .kran{
            /*position: absolute;
            background-image: url(../img/ani/kran.png);
            transform: rotateY(180deg);
            background-size:cover;*/
            top:-20px;
            width: 100px;
            height: 100px;
            z-index: -3;
            animation: slidekran 25s linear infinite;
        }

        @keyframes slidekran {
            0% {left: 95vw;}
            40%{left: 75vw;}
            60%{left: 75vw;}
            100%{left: 95vw;}
        }

        .blink_me {
            background-color: orange;
            height: 10px;
            width: 10px;
            margin-top: 33px;
            margin-left: 30px;
            border-top-right-radius: 32px;
            border-top-left-radius: 32px;
            animation: blinker 1s linear infinite;
        }

        @keyframes blinker {
            50% {opacity: 0;}
        }

        .walker{
            position: absolute;
            background-image: url(../img/ani/walker.png);
            background-size:cover;
            top:22px;
            left:80vw;
            width: 50px;
            height: 50px;
            z-index: -2; 
        }

        .police {
            /*position: absolute;
            background-image: url(../img/ani/police.png);
            background-size: cover;
            transform: rotateY(180deg);*/
            width: 70px;
            height: 70px;
            z-index: 0;
            top:19px;
            animation: slidepoli 16s linear infinite;
        }

        @keyframes slidepoli {
            0% {left: 100vw;}
            15%{left:80vw;}
            30%{left:80vw;}
            70% {left: -70px;}
            100%{left: -70px;}
        }

        .ambu {
            position: absolute;
            background-image: url(../img/ani/ambu.png);
            background-size: cover;
            width: 70px;
            height: 70px;
            left:-70px;
            z-index: 0;
            top:17px;
            animation: slideambu 36s 4s linear infinite;
        }
        
        @keyframes slideambu {
            0% {left: -70px;}
            80%{left: -70px;}
            100% {left: 100vw;}
        }

        .red-bus {
            /*position: absolute;
            background-image: url(../img/ani/busrot.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            top: 3px;
            z-index: 1;
            animation: sliderot 22s linear infinite;
        }

        @keyframes sliderot {
            0% {left: -100px;}
            50%{left: -100px;}
            65%{left: 50vw;}
            85% {left: 50vw;}
            100%{left: 100vw;}
        }

        .yellow-box {
            /*position: absolute;
            background-image: url(../img/ani/busl.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            z-index: 1;
            animation: slidegelb 22s linear infinite;
        }

        @keyframes slidegelb {
            0% {left: -100px;}
            17.5%{left: 50vw;}
            35%{left: 50vw;}
            50% {left: 100vw;} 
            50.01%{left: -100px;}
            100%{left: -100px;}
        }

        .blue-box {
            /*position: absolute;
            background-image: url(../img/ani/busr.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            z-index: -1;
            animation: slideback 12s linear infinite;
        }
        
        @keyframes slideback {
            0% {left: 100%;}
            30%{left: 38vw;}
            70%{left: 38vw;}
            100% {left: -100px;}
        }

        .boy{
            position: absolute;
            background-image: url(../img/ani/boy.png);
            background-size:cover;
            top:35px;
            left:43vw;
            width: 40px;
            height: 40px;
            z-index: -2;
            animation: slideboy 24s linear infinite;
        }

        @keyframes slideboy {
            0% {visibility:visible;}
            15%{ }
            30%{visibility: hidden;}
            68% {visibility:hidden;}
            69%{visibility:visible;}
            100%{visibility:visible;}
        }

        .girl{
            position: absolute;
            background-image: url(../img/ani/girl.png);
            background-size:cover;
            top:35px;
            left:40vw;
            width: 40px;
            height: 40px;
            z-index: -2;
            animation: slidegirl 24s linear infinite;
        }

        @keyframes slidegirl {
            0% {visibility:hidden;}
            15%{visibility:hidden;}
            30%{visibility: visible;}
            68% {visibility:visible;}
            69%{visibility:hidden;}
            100%{visibility:hidden;}
        }

        #anzeigemobi{
            height: 550px;
        }

        .gallery  {  
            width: 220px;
            height: 440px;
            margin-top: 50px;
        }

        .gallery > img {
            width: 100%;
            height: 440px;
        }
    }

    @media only screen and (min-width : 1025px) {
        
        #anzeige1, #anzeige2, #info, #werbung, #nachwort, #anzeigefoot, #anzeigemobi, #anzeigepc{
            width: 80vw;
        }

        form{
            width:75vw;
        }

        #wrapper{
            width:75vw;
            height:calc(75vw * 0.6);
        }

        #slider-wrap{
            width:75vw;
            height:calc(75vw * 0.6);
        }

        #pagination-wrap{
            margin-top:calc(75vw * 0.57);
        }

        #slider-wrap ul#slider li{
            width:75vw;
            height:calc(75vw * 0.6);
        }

        #slider-wrap ul#slider li i{
            line-height:75vw;
        }

        #slider-wrap ul#slider li img{
            line-height:75vw;
        }

        #counter{
            top: 10%; 
            right:20px; 
        }

        .stop1{
            /*position: absolute;
            background-image: url(../img/ani/busstopx.png);
            background-size: cover;*/
            left:40vw;
            width: 70px;
            height: 70px;
            top:7px;
            z-index: -2;
            object-fit: cover;
        }

        .stop2{
            /*position: absolute;
            background-image: url(../img/ani/busstopx.png);
            background-size: cover;*/
            left:51vw;
            width: 70px;
            height: 70px;
            top:7px;
            z-index: 2;
            object-fit: cover;
        }

        .walker{
            position: absolute;
            background-image: url(../img/ani/walker.png);
            background-size:cover;
            top:22px;
            left:80vw;
            width: 50px;
            height: 50px;
            z-index: -2; 
        }

        .zug{
            position: absolute;
            background-image: url(../img/ani/train1.png);
            background-size:cover;
            top:-194px;
            width: 800px;
            height: 400px;
            z-index: -3;
            animation: slidezug 12s linear infinite;
        }        
        
        @keyframes slidezug {
            0% {left: -800px;}
            35%{left: calc(75vw - 800px);}
            60%{left: calc(75vw - 800px);}
            100% {left: -800px;}
        }
        
        .kran{
            /*position: absolute;
            background-image: url(../img/ani/kran.png);
            transform: rotateY(180deg);
            background-size:cover;*/
            top:-20px;
            width: 100px;
            height: 100px;
            z-index: -3;
            animation: slidekran 25s linear infinite;
        }
        
        @keyframes slidekran {
            0% {left: 95vw;}
            40%{left: 75vw;}
            60%{left: 75vw;}
            100%{left: 95vw;}
        }

        .blink_me {
            background-color: orange;
            height: 10px;
            width: 10px;
            margin-top: 33px;
            margin-left: 30px;
            border-top-right-radius: 32px;
            border-top-left-radius: 32px;
            animation: blinker 1s linear infinite;
        }

        @keyframes blinker {
            50% {opacity: 0;}
        }

        .police {
            /*position: absolute;
            background-image: url(../img/ani/police.png);
            background-size: cover;
            transform: rotateY(180deg);*/
            width: 70px;
            height: 70px;
            z-index: 0;
            top:19px;
            animation: slidepoli 16s linear infinite;
        }

        @keyframes slidepoli {
            0% {left: 100vw;}
            15%{left:80vw;}
            30%{left:80vw;}
            70% {left: -70px;}
            100%{left: -70px;}
        }

        .ambu {
            position: absolute;
            background-image: url(../img/ani/ambu.png);
            background-size: cover;
            width: 70px;
            height: 70px;
            left:-70px;
            z-index: 0;
            top:17px;
            animation: slideambu 36s 4s linear infinite;
        }
        
        @keyframes slideambu {
            0% {left: -70px;}
            80%{left: -70px;}
            100% {left: 100vw;}
        }

        .red-bus {
            /*position: absolute;
            background-image: url(../img/ani/busrot.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            top: 3px;
            z-index: 1;
            animation: sliderot 22s linear infinite;
        }

        @keyframes sliderot {
            0% {left: -100px;}
            50%{left: -100px;}
            65%{left: 50vw;}
            85% {left: 50vw;}
            100%{left: 100vw;}
        }

        .yellow-box {
            /*position: absolute;
            background-image: url(../img/ani/busl.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            z-index: 1;
            animation: slidegelb 22s linear infinite;
        }

        @keyframes slidegelb {
            0% {left: -100px;}
            17.5%{left: 50vw;}
            35%{left: 50vw;}
            50% {left: 100vw;} 
            50.01%{left: -100px;}
            100%{left: -100px;}
        }

        .blue-box {
            /*position: absolute;
            background-image: url(../img/ani/busr.png);
            background-size: cover;*/
            width: 100px;
            height: 100px;
            z-index: -1;
            animation: slideback 12s linear infinite;
        }
        
        @keyframes slideback {
            0% {left: 100%;}
            30%{left: 40vw;}
            70%{left: 40vw;}
            100% {left: -100px;}
        }

        .boy{
            position: absolute;
            background-image: url(../img/ani/boy.png);
            background-size:cover;
            top:35px;
            left:43%;
            width: 40px;
            height: 40px;
            z-index: -2;
            animation: slideboy 24s linear infinite;
        }

        @keyframes slideboy {
            0% {visibility:visible;}
            15%{ }
            30%{visibility: hidden;}
            68% {visibility:hidden;}
            69%{visibility:visible;}
            100%{visibility:visible;}
        }

        .girl{
            position: absolute;
            background-image: url(../img/ani/girl.png);
            background-size:cover;
            top:35px;
            left:40%;
            width: 40px;
            height: 40px;
            z-index: -2;
            animation: slidegirl 24s linear infinite;
        }

        @keyframes slidegirl {
            0% {visibility:hidden;}
            15%{visibility:hidden;}
            30%{visibility: visible;}
            68% {visibility:visible;}
            69%{visibility:hidden;}
            100%{visibility:hidden;}
        }

        #anzeigemobi{
            height: 550px;
        }

        .gallery  {  
            width: 220px;
            height: 440px;
            margin-top: 50px;
        }

        .gallery > img {
            width: 100%;
            height: 440px;
        }
    }