Explode background

by paullferguson

HTML

<section>
    <h2>Hello, Im going to fade out with style</h2>
    <p>unlike Barry Moor</p>
</section>

CSS

section {
    background: yellow;
    padding: 1.5em;
    width: 70%;
    margin: 50px auto 0;
    
    -webkit-animation: fade 2s 1 normal forwards;
}

h2 {
    font-size: 1.5em;
}

@-webkit-keyframes fade {
    0% {box-shadow: 0 0 0 0 yellow; opacity: 1;}
    90% {box-shadow: 0 0 0 0 yellow; opacity: 1;}
    100% {box-shadow: 0 0 2em 0 yellow; opacity: 0;}
}