body
{
    background-color: black;
}
.btn
{
    width: 300px;
    height: 100px;
    margin:100px auto;
    background-color:orange;
    border-radius:15px;
    position: relative;
    overflow: hidden;

    &:hover
    {
        &::before
        {
            transform:rotate(45deg)translate(100%,-300px);
            
        }
    }
    >a
    {
        display: flex;
        width: 100%;
        height: 100%;
        position:absolute;
        top: 0;
        left: 0;
        text-decoration: none;
        color:black;
        font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
        font-size: 30px;
        align-items: center;
        justify-content: center;
    }
    &::before
    {
        content:'';
        display: flex;
        width: 400px;
        height: 400px;
        position:absolute;
        background-color:yellowgreen;
        transition:1s;
        left:-458px;
        top:-225px;
        transform:rotate(45deg);
        

    }
}
/* end */