

@-webkit-keyframes movietitletranslator {
    0% {
        transform: translate3d(0px, 0px, 0px);
        /*z-index: 0;*/
        opacity:0;
    }
    5% {
        /*transform: translate3d(0px, 0px, 0px);*/
        /*z-index: 0;*/
        opacity:1;
        transform: rotateX(0deg);
    }
    97% {
        opacity:1;
    }
    100% {
        transform: translate3d(0px, 20px, 300px) rotateX(5deg);
        /*z-index: 20;*/
        opacity:0;
    }
}

.movietitlewrapper {
    position:absolute;
    /*transform: rotateY(-20deg);*/
    transform-origin: top left;
    opacity:0;
    left:25%;
    -webkit-animation-name: movietitletranslator;
    -webkit-animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    /*-webkit-animation-timing-function: ease-in-out;*/
    -webkit-animation-timing-function: linear;
    width:400px;
    height:300px;
    position:absolute;
}

.movietitleimg {
    max-width: 100%;
    max-height: 100%;
    /* bottom: 0px; */
    position: absolute;
    margin-right: auto;
    margin-left: auto;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0px 3px 3px #333333;
}

#movietitleswapper {
    width: 100%;
    height: 400px;
    margin-top:30px;
}

// #movietitle1 {-webkit-animation-delay: 0s;}
// #movietitle2 {-webkit-animation-delay: -2s;}
// #movietitle3 {-webkit-animation-delay: -4s;}
// #movietitle4 {-webkit-animation-delay: -6s;}
// #movietitle5 {-webkit-animation-delay: -8s;}

@for $i from 1 through 5 {
    #movietitle#{$i} {
        -webkit-animation-delay: ((1-$i)*2)+s;
    }
}





.imdbpageimg {
    position:absolute;
}

#problem3intro3 {
    text-align: center;
    opacity:1;
}

/*do the fucked up transition for the imdbpageimgs*/
@-webkit-keyframes imdbpagetranslator {
    0% {
        transform: translate3d(0px, 0px, -400px) rotateY(-22deg);
        z-index: 0;
        opacity:0;
    }
    5% {
        opacity:1;
    }
    97% {
        opacity:1;
    }
    100% {
        transform: translate3d(-80px, 80px, -300px) rotateY(-18deg);
        z-index: 10;
        opacity:0;
    }
}

#imdbpageswapper {
    height:400px;
}

.imdbpageimg {
    width:100%;
    transform: rotateY(-20deg);
    transform-origin: top left;
    opacity:0;
    -webkit-animation-name: imdbpagetranslator;
    -webkit-animation-duration: 15s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
}

// #imdbpage1 {-webkit-animation-delay: 0s;}
// #imdbpage2 {-webkit-animation-delay: -3s;}
// #imdbpage3 {-webkit-animation-delay: -6s;}
// #imdbpage4 {-webkit-animation-delay: -9s;}
// #imdbpage5 {-webkit-animation-delay: -12s;}

@for $i from 1 through 5 {
    #imdbpage#{$i} {
        -webkit-animation-delay: ((1-$i)*3)+s;
    }
}

#problem3intro4 {
    opacity:1;
}

