.pacman{
  display: inline-block;
  width: 50px;
  height: 50px;
}

.pacman-top{
  background-color:yellow;
  height:25px;
  width:50px;
  border-radius:100px 100px 0 0;
  animation: spin1 0.5s infinite linear;
}

.pacman-bottom{
background-color:yellow;
  height:25px;
  width:50px;
  border-radius:0 0 100px 100px;
  animation: spin2 0.5s infinite linear;
}

.feed:after {
  letter-spacing: 5px;
  display: inline-block;
  padding-top: 100px;
  color: black;
  font-family: arial;
  text-align: center;
  content: 'loading...';
}

.feed {
margin-top: -95px;
margin-left:15px;
width: 10px;
height: 10px;
border-radius: 100%;
-moz-animation: eat 0.5s linear 0s infinite;
-webkit-animation: eat 0.5s linear 0s infinite;
animation: eat 0.5s linear 0s infinite;
}

/* Animation*/

@keyframes spin1 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
	50%{transform: translate(-50px,0) rotate(-35deg);}
  100%{transform: translate(-50px,0) rotate(0deg);}
}
@keyframes spin2 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
  50%{transform: translate(-50px,0) rotate(35deg);}
  100%{transform: translate(-50px,0) rotate(0deg);}
}

@-moz-keyframes spin1 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
	50%{transform: translate(-50px,0) rotate(-35deg);}
	100%{transform: translate(-50px,0) rotate(0deg);}

}
@-moz-keyframes spin2 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
  50%{transform: translate(-50px,0) rotate(35deg);}
  100%{transform: translate(-50px,0) rotate(0deg);}
}

@-webkit-keyframes spin1 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
	50%{transform: translate(-50px,0) rotate(-35deg);}
	100%{transform: translate(-50px,0) rotate(0deg);}

}
@-webkit-keyframes spin2 {
	0%  {transform: translate(-50px,0) rotate(0deg);}
  50%{transform: translate(-50px,0) rotate(35deg);}
  100%{transform: translate(-50px,0) rotate(0deg);}
}

@keyframes eat {
	0% { box-shadow:
      0px 65px 0 0 blue,
      50px 65px 0 0 blue,
      100px 65px 0 0 blue;
	}

100% { box-shadow:
      -50px 65px 0 0 blue,
      0px 65px 0 0 blue,
      50px 65px 0 0 blue;
}
}

@-moz-keyframes eat {
	0% { box-shadow:
      0px 65px 0 0 blue,
      50px 65px 0 0 blue,
      100px 65px 0 0 blue;
	}

100% { box-shadow:
      -50px 65px 0 0 blue,
      0px 65px 0 0 blue,
      50px 65px 0 0 blue;
}
}


@-webkit-keyframes eat {
	0% { box-shadow:
      15px 65px 0 0 blue,
      65px 65px 0 0 blue,
      115px 65px 0 0 blue;
	}

100% { box-shadow:
      -35px 65px 0 0 blue,
      15px 65px 0 0 blue,
      65px 65px 0 0 blue;
}
}
