body { height:100%; magin:0px; padding:0px;font-family: Arial, Helvetica, "Liberation Sans", sans-serif; background: #292d33;}
html {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  margin: 0px;
  padding: 0px;
  min-width: 100%;
  height: 100%;
   background: #292d33;
  background-attachment: fixed;
  
  color: #4b4b4b;

}
.container {
  width:500px;
  height:50px;
  margin-left:auto;
  margin-right:auto;
  margin-top:100px;
}
#loader {
   background-image: rgba(235,235,235,1);
    background-image: -webkit-linear-gradient(top, #525252 0%,#000000 100%);
    background-image: -moz-linear-gradient(top, #525252 0%,#000000 100%);
    background-image: -o-linear-gradient(top, #525252 0%,#000000 100%);
    background-image: -ms-linear-gradient(top, #525252 0%,#000000 100%);
    background-image: linear-gradient(top, #525252 0%,#000000 100%);
    color: #fff;
    border-radius: 4px;
    padding: 4px;
    padding-left:100px;
  padding-right:100px;
  padding-top:20px;
  padding-bottom:20px;
    display: inline-block;
    -webkit-box-shadow: 0 0 5px red;
    box-shadow: 0 0 5px red;
    
    -moz-animation-name: glow;
    -moz-animation-duration: .8s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: alternate;

    -webkit-animation-name: glow;
    -webkit-animation-duration: .8s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: alternate;
}

@-moz-keyframes glow {
    from { box-shadow: 0 0 35px red; }
    to   { box-shadow: 0 0 60px yellow; }
}
@-webkit-keyframes glow {
    from { -webkit-box-shadow: 0 0 35px red; }
    to   { -webkit-box-shadow: 0 0 60px yellow; }
}
.strow {
  position: absolute;
  top: 18%;
  left: 40%;
  transform-style: preserve-3d;
  transform: rotateX(74deg) rotate(40deg) skew(-30deg);
  z-index:-1;
}

.smoke:nth-child(1) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px red;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.1s;
  margin-top: -10px;
  margin-left: 5px;
}

.smoke:nth-child(2) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px red;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.2s;
  margin-top: -20px;
  margin-left: 10px;
}

.smoke:nth-child(3) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.3s;
  margin-top: -30px;
  margin-left: 15px;
}

.smoke:nth-child(4) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.4s;
  margin-top: -40px;
  margin-left: 20px;
}

.smoke:nth-child(5) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.5s;
  margin-top: -50px;
  margin-left: 25px;
}

.smoke:nth-child(6) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.6s;
  margin-top: -60px;
  margin-left: 30px;
}

.smoke:nth-child(7) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.7s;
  margin-top: -70px;
  margin-left: 35px;
}

.smoke:nth-child(8) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.8s;
  margin-top: -80px;
  margin-left: 40px;
}

.smoke:nth-child(9) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -0.9s;
  margin-top: -90px;
  margin-left: 45px;
}

.smoke:nth-child(10) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1s;
  margin-top: -100px;
  margin-left: 50px;
}

.smoke:nth-child(11) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.1s;
  margin-top: -110px;
  margin-left: 55px;
}

.smoke:nth-child(12) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.2s;
  margin-top: -120px;
  margin-left: 60px;
}

.smoke:nth-child(13) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.3s;
  margin-top: -130px;
  margin-left: 65px;
}

.smoke:nth-child(14) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.4s;
  margin-top: -140px;
  margin-left: 70px;
}

.smoke:nth-child(15) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.5s;
  margin-top: -150px;
  margin-left: 75px;
}

.smoke:nth-child(16) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.6s;
  margin-top: -160px;
  margin-left: 80px;
}

.smoke:nth-child(17) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.7s;
  margin-top: -170px;
  margin-left: 85px;
}

.smoke:nth-child(18) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.8s;
  margin-top: -180px;
  margin-left: 90px;
}

.smoke:nth-child(19) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -1.9s;
  margin-top: -190px;
  margin-left: 95px;
}

.smoke:nth-child(20) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2s;
  margin-top: -200px;
  margin-left: 100px;
}

.smoke:nth-child(21) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.1s;
  margin-top: -210px;
  margin-left: 105px;
}

.smoke:nth-child(22) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.2s;
  margin-top: -220px;
  margin-left: 110px;
}

.smoke:nth-child(23) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.3s;
  margin-top: -230px;
  margin-left: 115px;
}

.smoke:nth-child(24) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.4s;
  margin-top: -240px;
  margin-left: 120px;
}

.smoke:nth-child(25) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.5s;
  margin-top: -250px;
  margin-left: 125px;
}

.smoke:nth-child(26) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.6s;
  margin-top: -260px;
  margin-left: 130px;
}

.smoke:nth-child(27) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.7s;
  margin-top: -270px;
  margin-left: 135px;
}

.smoke:nth-child(28) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.8s;
  margin-top: -280px;
  margin-left: 140px;
}

.smoke:nth-child(29) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -2.9s;
  margin-top: -290px;
  margin-left: 145px;
}

.smoke:nth-child(30) {
  width: 1px;
  height: 200px;
  border-radius: 50%;
  box-shadow: 30px 30px 30px #fff, 30px 30px 30px red, 30px 30px 30px #fff;
  position: absolute;
  animation: smoke 2.5s ease-in-out infinite;
  animation-delay: -3s;
  margin-top: -300px;
  margin-left: 150px;
}

@keyframes smoke {
  50% {
    transform: translateY(15px) translateX(-30px) translateZ(-30px) rotateX(15deg) rotate(15deg);
    box-shadow: 30px 30px 30px red, 30px 30px 30px #fff, 30px 30px 30px red;
  }
}