@keyframes lightning {
    from {
        opacity: 0
    }
    80% {
        opacity: 0
    }
    82% {
        opacity: .4
    }
    83% {
        opacity: .3
    }
    85% {
        opacity: .6
    }
    to {
        opacity: 0
    }
}
.lightning {
    position: absolute;
    opacity: 0;
    /*top: -0px;*/
    left: 20px;
    width: 300px;
    height: 300px;
    right: auto;
    bottom: auto;
    background-size: contain;
    background-repeat: no-repeat;
    animation: 6s lightning 0s infinite;
}

.lightning-1 {
    /*top: -0px;*/
    left: 4rem;
    width: 3rem;
    height: 3rem;
    background-image: url(../images/lightning.png);
    animation-delay: 2s;
    transform: rotateZ(24deg);
}
.lightning-2 {
    /*top: -0px;*/
    left: 0rem;
    width: 3rem;
    height: 3rem;
    background-image: url(../images/lightning2.png);
}