/* CSS Document */
.cont-mainpict {
    animation: slideleft 2s ease-in-out; 
}
.heli {
    animation: helifadein 2s ease-in-out 1s 1;
    animation-fill-mode: forwards;
    opacity: 0;
}
.mainpict {
    animation: pulse 5s ease-in-out 2s infinite;
}
.logoframe-shadow {
    animation: shadowplay 5s ease-in-out 2s infinite;
    opacity: .2;
    filter: blur(20px);
}
.arrow1, .arrow2, .arrow3, .arrow4 {
    opacity: 0;
    animation-fill-mode: forwards;
}
.arrow1 {
    animation: arrowbeam1 2s ease-in-out infinite;
}
.arrow2 {
    animation: arrowbeam2 2s ease-in-out infinite;
}
.arrow3 {
    animation: arrowbeam3 2s ease-in-out infinite;
}
.arrow4 {
    animation: arrowbeam4 2s ease-in-out infinite;
}

@keyframes liner {
    0% {width: 0; margin: auto 50%;}
    100% {width: 100%; margin: auto 0;}
}
@keyframes slideleft {
    0% {transform: translateX(400px); opacity: 0;}
    100% {transform: translateX(0); opacity: 1}
}
@keyframes helifadein {
    0% {opacity:0;}
    100% {opacity: 1}
}
@keyframes pulse {
	0% {transform: scale(1);}
	50% {transform: scale(.98);}
	100% {transform: scale(1);}
}
@keyframes shadowplay {
    0% {opacity:.2; filter: blur(20px);}
    50% {opacity:.5; filter: blur(0);}
    100% {opacity:.2; filter: blur(20px);}
}
@keyframes arrowbeam1 {
    0% {opacity:0}
    5% {opacity:.7}
    75% {opacity:0}
}
@keyframes arrowbeam2 {
    5% {opacity:0}
    10% {opacity:.7}
    80% {opacity:0}
}
@keyframes arrowbeam3 {
    10% {opacity:0}
    15% {opacity:.7}
    85% {opacity:0}
}
@keyframes arrowbeam4 {
    15% {opacity:0}
    20% {opacity:.7}
    90% {opacity:0}
}