spot light style

by James Doyle

HTML

<h1>goal</h1>

CSS

body{background:#000;}
h1 {
    text-align: center;
    margin: 200px auto;
    font-family: Arial;
    font-size: 5em;
    font-weight: bold;
    text-transform: uppercase;
    color: white;
    -webkit-animation-duration: 5s;
    -webkit-animation-name: circle;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-timing-function:ease;
}

@-webkit-keyframes circle {
    0% {
        text-shadow: 5px 5px 0 #FFD217, 10px 10px 0 #5AC7FF, 15px 15px 0 #FFD217, 20px 20px 0 #5AC7FF;
}

25% {
    text-shadow: 5px -5px 0 #FFD217, 10px -10px 0 #5AC7FF, 15px -15px 0 #FFD217, 20px -20px 0 #5AC7FF;
}

50% {
    text-shadow: -5px -5px 0 #FFD217, -10px -10px 0 #5AC7FF, -15px -15px 0 #FFD217, -20px -20px 0 #5AC7FF;
}

75% {
    text-shadow: -5px 5px 0 #FFD217, -10px 10px 0 #5AC7FF, -15px 15px 0 #FFD217, -20px 20px 0 #5AC7FF;
}

100% {
        text-shadow: 5px 5px 0 #FFD217, 10px 10px 0 #5AC7FF, 15px 15px 0 #FFD217, 20px 20px 0 #5AC7FF;
}


}/*end of @declaration*/