html
{
  background-color: green;
}

#game{
  height: 500px;
  width: 500px;
  margin: auto;
  background-color: white;
  border: inset;
  display: flex;
   overflow: hidden;
}
#player
{

  text-align: center;
  margin-top: 20%;
  transform: scale(0.3);
}
#enemy
{
  height: 20px;
  margin: auto;
  position: relative;
  transform: scale(0.2);
  animation: enemy-motion calc(var(--speed) * 1s) infinite;
}
/*#enemy2*/
/*{*/
/*  height: 20px;*/
/*  width: auto;*/
/*  margin: auto;*/
/*  position: relative;*/
/*  transform: scale(0.05);*/
/*  animation: enemy-motion-left calc(var(--speed) * 1s) infinite;*/
/*}*/
@keyframes enemy-motion
{
  from {right: 0px;}
  to {right: 500px;}
}
:root {
  --speed: 10; /* Blue */
  
}
/*@keyframes enemy-motion-left*/
/*{*/
/*  from {left: 0px;}*/
/*  to {left: 500px;}*/
/*}*/