.watch-live {
    width: 130px;
    height: 40px;
    display: inline-block;
    padding: 10px 25px;
    border: 2px solid #000;
    font-weight: 700;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
  }
.watch-live{
    background: rgb(0, 0, 0);
    color: #fff;
    line-height: 42px;
    padding: 0;
    border: none;
  }
.watch-live:hover {
    background: rgb(48, 46, 46);
    color: rgb(0, 183, 255);
    box-shadow:-7px 2px 10px 2px rgb(0, 238, 255);
  }
.watch-live:before,.watch-live:after{ 
    content:'';
    position:absolute;
    top:0;
    right:0;
    height:2px;
    width:0;
    background: rgb(204, 0, 255);
    transition:300ms ease all;
  }
.watch-live:after{
    right:inherit;
    top:inherit;
    left:0;
    bottom:0;
}
.watch-live:hover:before,.watch-live:hover:after{
    width:100%;
    transition:400ms ease all;
  }