@charset 'utf-8';

#foo {
    -skrollr-animation-name: animation1;
    -skrollr-anchor-target: '#target';
    width: 500px;
    height: 300px;
    background: red;
    position: absolute;
    width: 500px;
    height: 900px;
    font-size: 5em;
    background: red;
}

#target1{
    width: 300px;
    height: 100px;
    background: green;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
}

@-skrollr-keyframes animation1 {
    0 {
        left:100%;
        color:rgb(0,0,0);
    }

    300 {
        left:0%;
        color:rgb(255,0,0);
    }
}




#foo2 {
    width: 500px;
    height: 900px;
    font-size: 10em;
    background: red;
}