.popup{position:fixed;top:auto;right:auto;bottom:0;left:0;max-height:100%; width: 100%; z-index: 10001; overflow-y:auto;background-color:#F5F5F4; box-sizing:border-box;transform:translateY(-100%);opacity: 0;}
.popup-bottom{animation:ease-out 300ms 1 sport forwards;}
/* .popup-top{animation:ease-out 300ms 1 sportNone forwards;} */
.overlay{width: 100%; height: 100%; background: rgba(0,0,0,.7); position: fixed;top: 0; left: 0; z-index: 10000;}
@keyframes sport {
    0%   {transform: translateY(100%);opacity: 0;}
    100% {transform: translateY(0);opacity: 1;}
}
@keyframes sportNone {
    0%   {transform: translateY(0);opacity: 1;}
    100% {transform: translateY(100%);opacity: 0;}
}