.toast {
    position: fixed;
    top:50%;
    left:50%;
    transform:translate(-50%,-70%) scale(1);
    word-wrap:break-word;
    padding:30px;
    text-align: left;
    z-index:9999;
    font-size: 28px;/*px*/
    max-width:80%;
    color: #fff;
    border-radius: 5px;
    background: rgba(0,0,0,0.7);
    overflow: hidden;
}
.toast.middle{
    top:50%;
}
.toast.top{
    top:10%;
}
.toast.bottom{
    top:90%;
}
.fade-enter-active, .fade-leave-active {
  transition: transform .5s
}
.fade-enter, .fade-leave-active {
  transform:translate(-50%,-50%) scale(0);
}