body {
    overflow-x: hidden;
    background: #000;
}


div.parent {
    display: block;
    width: 100%;
    position: relative;
    height: 100%;
}

div.img {
    width: 100%;
    height: 710px;
    position: absolute;
}

div.img .img1 {
    -webkit-animation: myfirst 5s infinite;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-direction: alternate;
    /* Safari 4.0 - 8.0 */
    animation: myfirst 5s infinite;
    animation-direction: alternate;
    width: calc(100% + 300px);
    /*height: 100%;*/
    height: 750px;
    position: absolute;
}

@keyframes myfirst {
    0% {
        opacity: 1;
        top: 0px;
        left: 0px;
    }
    100% {
        opacity: 0.8;
        left: -150px;
        top: 0px;
    }
}

div.img .img2 {
    -webkit-animation: mySecond 5s infinite;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-direction: alternate;
    /* Safari 4.0 - 8.0 */
    animation: mySecond 5s infinite;
    animation-direction: alternate;
    height: 750px;
    /* height: 100%;
*/
    width: 100%;
    position: absolute;
}

@keyframes mySecond {
    0% {
        opacity: 1;
        left: 0px;
        top: 0px;
    }
    100% {
        opacity: 0.8;
        left: 0px;
        top: -50px;
    }
}

div.img .img3 {
    -webkit-animation: myThird 5s infinite;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-direction: alternate;
    /* Safari 4.0 - 8.0 */
    animation: myThird 5s infinite;
    animation-direction: alternate;
    width: calc(100% + 300px);
    /*height: 100%;*/
    height: 750px;
    position: absolute;
}

@keyframes myThird {
    0% {
        opacity: 1;
        left: -70px;
        top: 0px;
    }
    100% {
        opacity:0.8;
        left: 0px;
        top: 0px;
    }
}

#navi_wrapper {
    position: absolute;
    z-index: 1;
    float: left;
    padding: 10px;
    margin: 0 !important;
}

.text-container {
    position: absolute !important;
    right: 38px !important;
    top: 23px !important;
}

.menu-img-container {
    position: absolute !important;
    left: 435px;
}

.img-div:hover {
    transition: all .2s ease-in-out;
}

.footer {
    /*position: relative;*/position: absolute;
    bottom: 0px;
    width: 100%;
    left: 0px;
}


.menu {
    bottom: 28px;
}

#navi_wrapper {
    /*margin: 11px 0 5px 45px !important;*/
}


div.img .img4 {
   -webkit-animation: myFourth 5s infinite;
   /* Safari 4.0 - 8.0 */
   -webkit-animation-direction: alternate;
   /* Safari 4.0 - 8.0 */
   animation: myFourth 5s infinite;
   animation-direction: alternate;
   /*height: 100%;*/
    height: 750px;
   width: 100%;
   position: absolute;
}

@keyframes myFourth {
   0% {
       opacity: 1;
       left: 0px;
       top: -50px;
   }
   100% {
       opacity: 0.8;
       left: 0px;
       top: 0px;
   }
}
