/*animation css*/
.example1, .example2, .example3, .example4, .example5, .example6, .example7, .example8, .example9, .example10, .example11, .example12 {
 position: absolute;
 -moz-transform:translatey(100%);
 -webkit-transform:translatey(100%);  
 transform:translatey(100%);
 -moz-animation: example 8s linear infinite;
 -webkit-animation: example 8s linear infinite;
 animation: example1 8s linear infinite;
 transition: transform .5s; 
 display: inline-block;
 top:0;
 min-width: 400px;
 /*font-family: 'Heebo', sans-serif;*/
}

.example1{
    animation-delay: -1s;
}
.example2{
    animation-delay: -2s;
}
.example3{
    animation-delay: -3s;
}
.example4{
    animation-delay: -4s;
}
.example5{
    animation-delay: -5s;
}
.example6{
    animation-delay: -6s;
}
.example7{
    animation-delay: -7s;
}
.example8{
    animation-delay: -8s;
}
.example9{
    animation-delay: -9s;
}
.example10{
    animation-delay: -10s;
}
.example11{
    animation-delay: -11s;
}
.example12{
    animation-delay: -12s;
}
h3 {
    font-size: 17px;
    color: #fff;
    position: relative;
    width: 100%;
    margin: 20px 0;
    
}

.intra_menu:hover .commonEx{
    animation-play-state: paused;
}
.intra_menu:hover .commonEx{
  
}
.example1{
    /* animation-play-state: paused; */
}
/*.example1 h3:hover{
    transform: scale(1.1);
}*/
    /* opacity: 0.554222;
    transform: scale(0.875182, 0.875182) rotateX(15.7333deg); */

/* Move it (define the animation) */
@-moz-keyframes example1 {
    0%   {top:0%;opacity:0.1; transform: scale(1, 0.10) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}
}
@-webkit-keyframes example1 {
    0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example1 {
   0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}


/* Move it (define the animation) */
@-moz-keyframes example2 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example2 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example2 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}


/* Move it (define the animation) */
@-moz-keyframes example3 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example3 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example3 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}


/* Move it (define the animation) */
@-moz-keyframes example4 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example4 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example4 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}


/* Move it (define the animation) */
@-moz-keyframes example5 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example5 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example5 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}

/* Move it (define the animation) */
@-moz-keyframes example6 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example6 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example6 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}


/* Move it (define the animation) */
@-moz-keyframes example7 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example7 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example7 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
/* Move it (define the animation) */
@-moz-keyframes example8 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}
@-webkit-keyframes example8 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
 }
@keyframes example8 {
  0%   {top:0%;opacity:0.1; transform: scale(1, 0.80) rotateX(-25deg);}
 10%   {top:10% ;opacity:0.3; transform: scale(1, 0.90) rotateX(-20deg);}
 20%   {top:20%;opacity:.8;  transform: scale(1, 1) rotateX(-15deg);}
 30%  { top:30%;opacity:.9;  transform: scale(1, 1.2) rotateX(-10deg);}
 40% { top:40%;opacity:1; transform: scale(1, 1.5) rotateX(-5deg);}
 50% {  top:50%;opacity:1; transform: scale(1, 1.5) rotateX(0deg);}
 60% {  top:60%;opacity:1; transform: scale(1, 1.5) rotateX(5deg);}
 70% {  top:70%;opacity:0.9; transform: scale(1, 1.2) rotateX(10deg);}
 80% {  top:80%;opacity:0.8; transform: scale(1,1) rotateX(15deg);}
 90% {  top:90%;opacity:0.3; transform: scale(1, 0.90) rotateX(20deg);}
 100% {  top:100%;opacity:0.1; transform: scale(1, 0.80) rotateX(25deg);}   
}



.parenDivAnimation {
    position: relative;
	margin-top:-50px;
    height: 70vh;
    overflow: hidden;
    /* background-image: linear-gradient(to bottom, #00000036, #fff,#fff,#fff,#00000017); */
    padding: 0 200px 100px 00px;
}