CSS中的背景图片淡入

Question

我的网站首页上有几秒钟要淡化为模糊的背景图像。我尝试了几种不同的方法，例如Webkit动画和过渡。我似乎无法使其正常工作。

SyntaxException: line 1:132 no viable alternative at input '(' (...int, num_io_ops int, primary_key [(]...)

.homeBG {
	background-image: url("https://www.incimages.com/uploaded_files/image/970x450/getty_482805043_185511.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top;
	background-size: cover;
}

.blur {
  -webkit-animation: blur 0.5s linear forwards;
  -moz-animation: blur 0.5s linear forwards;
  -ms-animation: blur 0.5s linear forwards;
  -o-animation: blur 0.5s linear forwards;
  animation: blur 0.5s linear forwards;
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  animation-delay: 1s;
}

@-webkit-keyframes blur {
  to {
    -webkit-filter: blur(5px);
    filter: blur(5px);
  }
}
@-moz-keyframes blur {
  to {
    -moz-filter: blur(5px);
    filter: blur(5px);
  }
}
@keyframes blur {
  to {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    filter: blur(5px);
  }
}