Ошибка CSS: «Не используйте идентификаторы в селекторах», как я могу это исправить?

У меня есть этот код для анимированного фона для моей HTML-страницы (я нашел этот код в интернете). каждый раз, когда я сохраняю файл CSS, я получаю эту ошибку: «Не используйте идентификаторы в селекторах». Как я могу это исправить?

HTML

<link rel="stylesheet" href="style.css">
<div id="smoke">
  <span class="s0"></span>
  <span class="s1"></span>
  <span class="s2"></span>
  <span class="s3"></span>
  <span class="s4"></span>
  <span class="s5"></span>
  <span class="s6"></span>
  <span class="s7"></span>
  <span class="s8"></span>
  <span class="s9"></span>
</div>

CSS

body {background: #18d0f0}

/* Smoke container */

#smoke {
    position: absolute;
    z-index: 3;
    width: 1px; height: 160px;
    left: 50%; bottom: 30px;
}

/* No animations? Display a static smoke image */

.disableAnimations #smoke,
.no-cssanimations #smoke {
    width: 86px;
    margin-left: -25px;
    bottom: 146px;
    background: url('../img/smokeNoAni.png') no-repeat center bottom;
}

/* smoke balls */

.cssanimations #smoke span {
    display: block;
    position: absolute;
    bottom: -35px; left: 50%; margin-left:-20px;
    height: 0px; width: 0px;
    border: 35px solid #4b4b4b;
    border-radius: 35px;
    left: -14px; opacity: 0;
    transform: scale(0.2);
}