body{
    width: 300px;
    height: 250px;
    overflow: hidden;
    margin: 0;
}

div{
    position:absolute;
    overflow: hidden;
}

#banner {
  position: relative;
  width: 300px;
  height: 250px;
  background-color: #000000;
  cursor: pointer;
  overflow: hidden;
}
.text img{
    width: 300px;
    height: auto;
}
#lightning{
    width: 100%;
    height: 100%;
    background-color: white;
    -webkit-animation: lightning 12s infinite;
    -moz-animation: lightning 12s infinite;
    -o-animation: lightning 12s infinite;
    animation: lightning 12s infinite;
}

#lightning2{
    width: 100%;
    height: 100%;
    background-color: white;
    -webkit-animation: lightning2 12s infinite;
    -moz-animation: lightning2 12s infinite;
    -o-animation: lightning2 12s infinite;
    animation: lightning2 12s infinite;
}

#blende{
    width: 100%;
    height: 100%;
/*    display: none;*/
    background-color: #510005;
    transform-origin: 100% 100%;
    -webkit-animation: blende 12s infinite;
    -moz-animation: blende 12s infinite;
    -o-animation: blende 12s infinite;
    animation: blende 12s infinite;
}

#ripperSpot{
    transform-origin: 110px 117px;
    top: -20px;
    left: -10px;
}

#lady{
    
    transform-origin: 100% 100%;
    -webkit-animation: lady 12s linear infinite;
    -moz-animation: lady 12s linear infinite;
    -o-animation: lady 12s linear infinite;
    animation: lady 12s linear infinite;
}
#ladySpot{
    transform-origin: 88% 37%;
}

#textTop{
    top: -2px;
    transform-origin: 100% 100%;
    -webkit-animation: textTop 12s linear infinite;
    -moz-animation: textTop 12s linear infinite;
    -o-animation: textTop 12s linear infinite;
    animation: textTop 12s linear infinite;
}
#textTop2{
    top: -2px;
    transform-origin: 100% 100%;
    -webkit-animation: textTop2 12s linear infinite;
    -moz-animation: textTop2 12s linear infinite;
    -o-animation: textTop2 12s linear infinite;
    animation: textTop2 12s linear infinite;
}
#jack{
   
    transform-origin: 100% 100%;
    -webkit-animation: jack 12s infinite;
    -moz-animation: jack 12s infinite;
    -o-animation: jack 12s infinite;
    animation: jack 12s infinite;
}
#theRipper{
   
    transform-origin: 100% 100%;
    -webkit-animation: theRipper 12s infinite;
    -moz-animation: theRipper 12s infinite;
    -o-animation: theRipper 12s infinite;
    animation: theRipper 12s infinite;
}



#sendehinw2{
    
    transform-origin: 100% 100%;
    -webkit-animation: sh1 12s linear infinite;
    -moz-animation: sh1 12s linear infinite;
    -o-animation: sh1 12s linear infinite;
    animation: sh1 12s  infinite;
}
#ripper{
     transform-origin: 118px 158px;
    
    -webkit-animation: ripper 12s linear infinite;
    -moz-animation: ripper 12s linear infinite;
    -o-animation: ripper 12s linear infinite;
    animation: ripper 12s linear infinite;

}
#ripperContainer{
    width: 21%;
    height: 63%;
    transform-origin: 100% 100%;
    overflow: visible; 
}
#ripperShadow {
    transform-origin: 118px 158px;
    
    -webkit-animation: ripperShadow 12s linear infinite;
    -moz-animation: ripperShadow 12s linear infinite;
    -o-animation: ripperShadow 12s linear infinite;
    animation: ripperShadow 12s linear infinite;

}
#logo {
    transform-origin: 0% 0%;

}
#ball {
    width: 100%;
    height: 100%;
    transform-origin: 50% 50%;
    -webkit-animation: ball 12s linear infinite;
    -moz-animation: ball 12s linear infinite;
    -o-animation: ball 12s linear infinite;
    animation: ball 12s linear infinite;
}
#ball img{
    
    -webkit-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -o-transform: scale(0.7);
    transform: scale(0.7);
    
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

#ladySpot {
    
    -webkit-animation: ladySpot 12s linear infinite;
    -moz-animation: ladySpot 12s linear infinite;
    -o-animation: ladySpot 12s linear infinite;
    animation: ladySpot 12s linear infinite;

}
#ripperSpot {
   
    -webkit-animation: ripperSpot 12s linear infinite;
    -moz-animation: ripperSpot 12s linear infinite;
    -o-animation: ripperSpot 12s linear infinite;
    animation: ripperSpot 12s linear infinite;

}
#ballSmall {
    transform-origin: 0% 0%;
    -webkit-transform: scale(0.36);
    -moz-transform: scale(0.36);
    -o-transform: scale(0.36);
    transform: scale(0.36);
    left: 245px;
    top: 195px;
    
}

#rainContainer, #rainContainer2{
    width: 100%;
    height: 100%;
    overflow: visible;
    -webkit-animation: fall 0.7s linear infinite;
    -moz-animation: fall 0.7s linear infinite;
    -o-animation: fall 0.7s linear infinite;
    animation: fall 0.7s linear infinite;
}

.drop {
    background: -webkit-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(255,255,255,0.6) 100%);
    background: -moz-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(255,255,255,0.6) 100%);
    background: -o-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(255,255,255,0.6) 100%);
    background: linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(255,255,255,0.6) 100%);
 
    width:1px;
	height:50px;
	position: absolute;
	bottom:200px;
    -webkit-transform: rotate(26deg);
    transform: rotate(26deg);
}

.dropRed {
    background: -webkit-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(192,67,67,0.6) 100%);
    background: -moz-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(192,67,67,0.6) 100%);
    background: -o-linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(192,67,67,0.6) 100%);
    background: linear-gradient(rgba(192, 67, 67, 0.1) 0%, rgba(192,67,67,0.6) 100%);
    
    width:3px;
	height:50px;
	position: absolute;
	bottom:200px;
     -webkit-transform: rotate(26deg);
    transform: rotate(26deg);
  
}

#textShadow{
     -webkit-animation: shadow 12s  infinite;
    -moz-animation: shadow 12s  infinite;
    -o-animation: shadow 12s  infinite;
    animation: shadow 12s  infinite;
}

@-webkit-keyframes fall {to {margin-top:250px; margin-left: -125px}}
@-moz-keyframes fall {to {margin-top:250px; margin-left: -125px}}
@-o-keyframes fall {to {margin-top:250px; margin-left: -125px}}
@keyframes fall {to {margin-top:250px; margin-left: -125px}}




@-webkit-keyframes blende {0%{opacity:1;transform: scaleY(1);}7%{opacity:1;transform: scaleY(1);}9%{opacity:1;}14%{opacity:0;transform: scaleY(0);}90%{opacity:0;transform: scaleY(0);}95%{opacity:1;}100%{opacity:1;transform: scaleY(1);}}
@-moz-keyframes blende {0%{opacity:1;transform: scaleY(1);}7%{opacity:1;transform: scaleY(1);}9%{opacity:1;}14%{opacity:0;transform: scaleY(0);}90%{opacity:0;transform: scaleY(0);}95%{opacity:1;}100%{opacity:1;transform: scaleY(1);}}
@-o-keyframes blende {0%{opacity:1;transform: scaleY(1);}7%{opacity:1;transform: scaleY(1);}9%{opacity:1;}14%{opacity:0;transform: scaleY(0);}90%{opacity:0;transform: scaleY(0);}95%{opacity:1;}100%{opacity:1;transform: scaleY(1);}}
@keyframes blende {0%{opacity:1;transform: scaleY(1);}7%{opacity:1;transform: scaleY(1);}9%{opacity:1;}14%{opacity:0;transform: scaleY(0);}90%{opacity:0;transform: scaleY(0);}95%{opacity:1;}100%{opacity:1;transform: scaleY(1);}}


@-webkit-keyframes ball {0%{-webkit-transform: rotate(-12deg);opacity:1;}7%{-webkit-transform: rotate(0deg);opacity:1;}10%{opacity: 0;}92%{-webkit-transform: rotate(-25deg);opacity: 0;}96%{opacity: 1;}100%{-webkit-transform: rotate(-12deg);opacity:1}}
@-moz-keyframes ball {0%{-moz-transform: rotate(-12deg);opacity:1;}7%{-moz-transform: rotate(0deg);opacity:1;}10%{opacity: 0;}92%{-moz-transform: rotate(-25deg);opacity: 0;}96%{opacity: 1;}100%{-moz-transform: rotate(-12deg);opacity:1}}
@-o-keyframes ball {0%{-o-transform: rotate(-12deg);opacity:1;}7%{-o-transform: rotate(0deg);opacity:1;}10%{opacity: 0;}92%{-o-transform: rotate(-25deg);opacity: 0;}96%{opacity: 1;}100%{-o-transform: rotate(-12deg);opacity:1}}
@keyframes ball {0%{transform: rotate(-12deg);opacity:1;}7%{transform: rotate(0deg);opacity:1;}10%{opacity: 0;}92%{transform: rotate(-25deg);opacity: 0;}96%{opacity: 1;}100%{transform: rotate(-12deg);opacity:1}}

@-webkit-keyframes lady {0%{-webkit-transform: matrix(0.9,0,0,0.9,200,0);}14%{-webkit-transform: matrix(0.88,0,0,0.88,5,0);}100%{-webkit-transform: matrix(1,0,0,1,0,0);}}
@-moz-keyframes lady {0%{-moz-transform: matrix(0.9,0,0,0.9,200,0);}14%{-moz-transform: matrix(0.88,0,0,0.88,5,0);}100%{-moz-transform: matrix(1,0,0,1,0,0);}}
@-o-keyframes lady {0%{-o-transform: matrix(0.9,0,0,0.9,200,0);}14%{-o-transform: matrix(0.88,0,0,0.88,5,0);}100%{-o-transform: matrix(1,0,0,1,0,0);}}
@keyframes lady {0%{transform: matrix(0.8,0,0,0.8,200,0);}14%{transform: matrix(0.88,0,0,0.88,5,0);}100%{transform: matrix(1,0,0,1,0,0);}}

@-webkit-keyframes ladySpot {0%{opacity:0;}21%{opacity:0;}24%{opacity:0.5;}38%{opacity:1;}100%{opacity:0.7;}}
@-moz-keyframes ladySpot {0%{opacity:0;}21%{opacity:0;}24%{opacity:0.5;}38%{opacity:1;}100%{opacity:0.7;}}
@-o-keyframes ladySpot {0%{opacity:0;}21%{opacity:0;}24%{opacity:0.5;}38%{opacity:1;}100%{opacity:0.7;}}
@keyframes ladySpot {0%{opacity:0;}21%{opacity:0;}24%{opacity:0.5;}38%{opacity:1;}100%{opacity:0.7;}}

@-webkit-keyframes ripperSpot {0%{opacity:0;}28%{opacity:0;}26%{opacity:1;-webkit-transform: rotate(50deg);}100%{opacity:0.7;-webkit-transform: rotate(0deg);}}
@-moz-keyframes ripperSpot {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;-moz-transform: rotate(50deg);}100%{opacity:0.7;-moz-transform: rotate(0deg);}}
@-o-keyframes ripperSpot {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;-o-transform: rotate(50deg);}100%{opacity:0.7;-o-transform: rotate(0deg);}}
@keyframes ripperSpot {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;transform: rotate(50deg);}100%{opacity:0.7;transform: rotate(0deg);}}

@-webkit-keyframes lightning {0%{opacity:0;}10%{opacity:0;}11%{opacity:0.4;}11.5%{opacity:0;}12%{opacity:0;}13%{opacity:0.7;}14%{opacity:0;}25%{opacity:0;}26%{opacity:0.4;}27%{opacity:0;}28%{opacity:0.7;}28.5%{opacity:0.7;}30%{opacity:0;}100%{opacity:0;}}
@-moz-keyframes lightning {0%{opacity:0;}10%{opacity:0;}11%{opacity:0.4;}11.5%{opacity:0;}12%{opacity:0;}13%{opacity:0.7;}14%{opacity:0;}25%{opacity:0;}26%{opacity:0.4;}27%{opacity:0;}28%{opacity:0.7;}28.5%{opacity:0.7;}30%{opacity:0;}100%{opacity:0;}}
@-o-keyframes lightning {0%{opacity:0;}10%{opacity:0;}11%{opacity:0.4;}11.5%{opacity:0;}12%{opacity:0;}13%{opacity:0.7;}14%{opacity:0;}25%{opacity:0;}26%{opacity:0.4;}27%{opacity:0;}28%{opacity:0.7;}28.5%{opacity:0.7;}30%{opacity:0;}100%{opacity:0;}}
@keyframes lightning {0%{opacity:0;}10%{opacity:0;}11%{opacity:0.4;}11.5%{opacity:0;}12%{opacity:0;}13%{opacity:0.7;}14%{opacity:0;}25%{opacity:0;}26%{opacity:0.4;}27%{opacity:0;}28%{opacity:0.7;}28.5%{opacity:0.7;}30%{opacity:0;}100%{opacity:0;}}

@-webkit-keyframes lightning2 {0%{opacity:0;}87%{opacity:0;}88%{opacity:0.4;}89%{opacity:0;}90%{opacity:0.7;}91%{opacity:0;}100%{opacity:0;}}
@-moz-keyframes lightning2 {0%{opacity:0;}87%{opacity:0;}88%{opacity:0.4;}89%{opacity:0;}90%{opacity:0.7;}91%{opacity:0;}100%{opacity:0;}}
@-o-keyframes lightning2 {0%{opacity:0;}87%{opacity:0;}88%{opacity:0.4;}89%{opacity:0;}90%{opacity:0.7;}91%{opacity:0;}100%{opacity:0;}}
@keyframes lightning2 {0%{opacity:0;}87%{opacity:0;}88%{opacity:0.4;}89%{opacity:0;}90%{opacity:0.7;}91%{opacity:0;}100%{opacity:0;}}


@-webkit-keyframes ripper {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;-webkit-transform: matrix(1,0,0,1,0,0);}100%{opacity:1;-webkit-transform: matrix(1.2,0,0,1.2,0,15);}}
@-moz-keyframes ripper {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;-moz-transform: matrix(1,0,0,1,0,0);}100%{opacity:1;-moz-transform: matrix(1.2,0,0,1.2,0,15);}}
@-o-keyframes ripper {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;-o-transform: matrix(1,0,0,1,0,0);}100%{opacity:1;-o-transform: matrix(1.2,0,0,1.2,0,15);}}
@keyframes ripper {0%{opacity:0;}28%{opacity:0;}30%{opacity:1;transform: matrix(1,0,0,1,0,0);}100%{opacity:1;transform: matrix(1.2,0,0,1.2,0,15);}}

@-webkit-keyframes ripperShadow {0%{opacity:0;}28%{opacity:0;-webkit-transform: matrix(1,0,-0.5,1,0,0);}29%{opacity:1;-webkit-transform: matrix(1,0,-0.5,1,0,0);}100%{opacity:1;-webkit-transform: matrix(1.2,0,0,2,0,15));}}
@-moz-keyframes ripperShadow {0%{opacity:0;}28%{opacity:0;-moz-transform: matrix(1,0,-0.5,1,0,0);}29%{opacity:1;-moz-transform: matrix(1,0,-0.5,1,0,0);}100%{opacity:1;-moz-transform: matrix(1.2,0,0,2,0,15));}}
@-o-keyframes ripperShadow {0%{opacity:0;}28%{opacity:0;-o-transform: matrix(1,0,-0.5,1,0,0);}29%{opacity:1;-o-transform: matrix(1,0,-0.5,1,0,0);}100%{opacity:1;-o-transform: matrix(1.2,0,0,2,0,15);}}
@keyframes ripperShadow {0%{opacity:0;}28%{opacity:0;transform: matrix(1,0,-0.5,1,0,0);}29%{opacity:1;transform: matrix(1,0,-0.5,1,0,0);}100%{opacity:1;transform: matrix(1.2,0,0,2,0,15);}}

/*TEXT*/

@-webkit-keyframes shadow {0%{opacity:0;}45%{opacity:0;}60%{opacity:1;}100%{opacity:1;}}
@-moz-keyframes shadow {0%{opacity:0;}45%{opacity:0;}60%{opacity:1;}100%{opacity:1;}}
@-o-keyframes shadow {0%{opacity:0;}45%{opacity:0;}60%{opacity:1;}100%{opacity:1;}}
@keyframes shadow {0%{opacity:0;}45%{opacity:0;}60%{opacity:1;}100%{opacity:1;}}

@-webkit-keyframes textTop {0%{width:0;}13%{width:0;}18%{width:100%;}100%{width:100%;}}
@-moz-keyframes textTop {0%{width:0;}13%{width:0;}18%{width:100%;}100%{width:100%;}}
@-o-keyframes textTop {0%{width:0;}13%{width:0;}18%{width:100%;}100%{width:100%;}}
@keyframes textTop {0%{width:0;}13%{width:0;}18%{width:100%;}100%{width:100%;}}

@-webkit-keyframes textTop2 {0%{width:0;}16%{width:0;}22%{width:100%;}100%{width:100%;}}
@-moz-keyframes textTop2 {0%{width:0;}16%{width:0;}22%{width:100%;}100%{width:100%;}}
@-o-keyframes textTop2 {0%{width:0;}16%{width:0;}22%{width:100%;}100%{width:100%;}}
@keyframes textTop2 {0%{width:0;}16%{width:0;}22%{width:100%;}100%{width:100%;}}

@-webkit-keyframes jack {0%{opacity:0;}34%{opacity:0;}41%{opacity:1;}100%{opacity:1;}}
@-moz-keyframes jack {0%{opacity:0;}34%{opacity:0;}41%{opacity:1;}100%{opacity:1;}}
@-o-keyframes jack {0%{opacity:0;}34%{opacity:0;}41%{opacity:1;}100%{opacity:1;}}
@keyframes jack {0%{opacity:0;}34%{opacity:0;}41%{opacity:1;}100%{opacity:1;}}

@-webkit-keyframes theRipper {0%{opacity:0;}36%{opacity:0;}43%{opacity:1;}100%{opacity:1;}}
@-moz-keyframes theRipper {0%{opacity:0;}36%{opacity:0;}43%{opacity:1;}100%{opacity:1;}}
@-o-keyframes theRipper {0%{opacity:0;}36%{opacity:0;}43%{opacity:1;}100%{opacity:1;}}
@keyframes theRipper {0%{opacity:0;}36%{opacity:0;}43%{opacity:1;}100%{opacity:1;}}


@-webkit-keyframes sh1 {0%{opacity:0;}47%{opacity:0;}53%{opacity:1;}100%{opacity:1;}}
@-moz-keyframes sh1 {0%{opacity:0;}47%{opacity:0;}53%{opacity:1;}100%{opacity:1;}}
@-o-keyframes sh1 {0%{opacity:0;}47%{opacity:0;}53%{opacity:1;}100%{opacity:1;}}
@keyframes sh1 {0%{opacity:0;}47%{opacity:0;}53%{opacity:1;}100%{opacity:1;}}