.one {height: 10%; animation: rotate-one 4s ease-out; -webkit-transform: rotateX(82deg) translateY(-1500px); border-bottom: 0px solid rgba(70,70,70,1);
       }
.two {height: 10%; animation: rotate-two 4s ease-out;  -webkit-transform: rotateX(82deg) translateY(-1500px); }
.three {height: 10%; animation: rotate-three 4s ease-out;  -webkit-transform: rotateX(82deg) translateY(-1500px); }
.four {height: 10%; animation: rotate-four 4s ease-out;  -webkit-transform: rotateX(82deg) translateY(-1500px); }
.five {height: 10%; animation: rotate-five 4s ease-out;  -webkit-transform: rotateX(82deg) translateY(-1500px); }


.fold { background: rgb(214,214,214);
background: -moz-linear-gradient(top, rgba(214,214,214,1) 0%, rgba(102,104,107,1) 99%);
background: -webkit-linear-gradient(top, rgba(214,214,214,1) 0%,rgba(102,104,107,1) 99%);
background: linear-gradient(to bottom, rgba(214,214,214,1) 0%,rgba(102,104,107,1) 99%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d6d6', endColorstr='#66686b',GradientType=0 );
}


.container { width: 100%; height: 100%; position: absolute; top: -100%; animation: displ 3.5s; z-index: 11111; overflow: hidden; }

@keyframes rotate-one {
    0% { -webkit-transform: rotateX(0deg); }
    9% { -webkit-transform: rotateX(0deg); }
    15% { -webkit-transform: rotateX(20deg); }
    45% { -webkit-transform: rotateX(86deg);}
    50% { -webkit-transform: rotateX(82deg);}
    59% { -webkit-transform: translateY(0px) rotateX(82deg); }
    68% { -webkit-transform: translateY(100px) rotateX(82deg); }
    100% { -webkit-transform: translateY(-1400px) rotateX(82deg); }
}

@keyframes rotate-two {
    0% { -webkit-transform: rotateX(0deg); }
    9% { -webkit-transform: rotateX(0deg); }
    15% { -webkit-transform: rotateX(20deg); }
    45% { -webkit-transform: rotateX(86deg); }
    50% { -webkit-transform: rotateX(82deg); }
    57% { -webkit-transform: translateY(0px) rotateX(82deg); }
    66% { -webkit-transform: translateY(100px) rotateX(82deg); }
    100% { -webkit-transform: translateY(-1500px) rotateX(82deg); }
}

@keyframes rotate-three {
    0% { -webkit-transform: rotateX(0deg); }
    9% { -webkit-transform: rotateX(0deg); }
    15% { -webkit-transform: rotateX(20deg); }
    45% { -webkit-transform: rotateX(86deg); }
    50% { -webkit-transform: rotateX(82deg); }
    55% { -webkit-transform: translateY(0px) rotateX(82deg); }
    64% { -webkit-transform: translateY(100px) rotateX(82deg); }
    100% { -webkit-transform: translateY(-1600px) rotateX(82deg); }
}

@keyframes rotate-four {
    0% { -webkit-transform: rotateX(0deg); }
    9% { -webkit-transform: rotateX(0deg); }
    15% { -webkit-transform: rotateX(20deg); }
    45% { -webkit-transform: rotateX(86deg); }
    50% { -webkit-transform: rotateX(82deg); }
    53% { -webkit-transform: translateY(0px) rotateX(82deg); }
    62% { -webkit-transform: translateY(100px) rotateX(82deg); }
    100% { -webkit-transform: translateY(-1700px) rotateX(82deg); }
}

@keyframes rotate-five {
    0% { -webkit-transform: rotateX(0deg); }
    9% { -webkit-transform: rotateX(0deg); }
    15% { -webkit-transform: rotateX(20deg); }
    45% { -webkit-transform: rotateX(86deg); }
    50% { -webkit-transform: rotateX(82deg); }
    51% { -webkit-transform: translateY(0px) rotateX(82deg); }
    60% { -webkit-transform: translateY(100px) rotateX(82deg); }
    100% { -webkit-transform: translateY(-1800px) rotateX(82deg); }
}

@keyframes displ {
    0% {  top: 0%; }
    99% { top: 0%; }
    100% { top: -100%; }
}