EffectHub.com: your best source for gaming

Recommendation

More Effects...

CSS

body {
  margin: 0 auto;
}

#b {
  width: 100%;
  height: 100%;
  background: url(http://wallpapershd2014.com/wallpaper/wp-content/uploads/2014/02/14/1516/Titanfall-Wallpaper-Game-2014-2489.jpg) no-repeat;
  background-position: 50% center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    height: 100%;
    width: 100%;
  position: relative;
}

#c {
 width: 100%;
  height: 600px;
  background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/62476/smoke.png) no-repeat;
   -webkit-animation: 40s FOG infinite;
  bottom: 0px;
}

@keyframes FOG {
        0% {background-position:left;}
        30% {opacity:.5;}
        80% {opacity: .8;}
        100%{background-position:right; opacity:1;}
    }
    
    @-moz-keyframes FOG {
       0% {background-position:left;}
        30% {opacity:.5;}
        80% {opacity: .8;}
        100%{background-position:right; opacity:1;}
    }
    
    @-webkit-keyframes FOG {
        0% {background-position:left;}
        30% {opacity:.5;}
        80% {opacity: .8;}
        100%{background-position:right; opacity:1;}
    }

HTML

Recommendation

Join Effecthub.com