body {
  margin: 0;
  height:100vh;
}

.enter {
    width:60px;
    height:60px;
    border:0;
}

.smallfade {
    opacity: 0.5;
}

 .size {
    width: 50px;
    height: 50px;
 }

 .emojipad {
    margin-top: 8px;
    margin-left: 1px;
 }

 .order {
    color:aliceblue;
    border: 5px;
    border-radius: 5px;
    padding:5px;
    background-color: rgba(82, 77, 56, 0.747);
    margin-top:3px;
 }

.race {
    position: absolute;
    animation-name: racetrack;
    animation-duration: 10s;
    animation-iteration-count: infinite;
  }
  
  @keyframes racetrack {
    25%  {
        transform: translate( calc(100vw - 30px),0px );
    }
    50%  {
        transform: translate( calc(100vw - 30px),calc(100vh - 50px) );
    }
    75%  {
        transform: translate( 0px, calc(100vh - 50px));
    }
    100% {left:0px; top:0px;}
  }


.iconbtn {
    border: 5px;
    border-radius: 5px;
    padding: 2px;
    background-color: rgba(127, 123, 145, 0.829);
}

.tobottom {
    transform: translateY(calc(100vh - 50px));
    transition-duration: 1s;    
}

.rotateme {
    animation-duration: 2s;
    animation-name: rotate;
    animation-iteration-count: 1;
  }
  
  @keyframes rotate {
    100% {transform: rotate(360deg);}
  }

.bounceme {
    animation-duration: 2s;
    animation-name: rotate;
    animation-iteration-count: 1;
  }
  
  @keyframes bounce {
    100% {transform: rotate(360deg);}
  }
  
.hide {
    display: none;
}

.Cow {
  background-color: rgb(209, 194, 146);
}

.Soy {
  background-color: rgb(223, 197, 127);
}

.Almond {
  background-color: rgb(146, 128, 87);
}

.Oat {
  background-color: rgb(197, 197, 188);
}

.Skinny {
  background-color: rgb(151, 156, 160);
}