.pulse {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: black;
    
    animation: 1s ease pulse infinite;
    -webkit-animation: 1s ease pulse infinite;
    -moz-animation: 1s ease pulse infinite;
    -o-animation: 1s ease pulse infinite;
    -ms-animation: 1s ease pulse infinite;
}

.block {

    animation: 2s linear appear;
    -webkit-animation: 2s linear appear;
    -moz-animation: 2s linear appear;
    -o-animation: 2s linear appear;
    -ms-animation: 2s linear appear;

    animation-timeline: view();
    animation-range: entry 0 cover 40%;
}

@keyframes appear{
    0% { opacity: 0; scale: 0.5;}
    100% { opacity:1; scale: 1;}
}
@-webkit-keyframes appear{
    0% { opacity: 0; scale: 0.5;}
    100% { opacity:1; scale: 1;}
}

@-moz-keyframes appear{
    0% { opacity: 0; scale: 0.5;}
    100% { opacity:1; scale: 1;}
}

@-o-keyframes appear{
    0% { opacity: 0; scale: 0.5;}
    100% { opacity:1; scale: 1;}
}

@-ms-keyframes appear{
    0% { opacity: 0; scale: 0.5;}
    100% { opacity:1; scale: 1;}
}