JSFiddle - React, Tailwind, and code Playground

HTML

<button class="back">Log In</button>
<button class="front">Log In</button>

CSS

body {
    background: #FFF;
}

button.back {
    
        border:1px solid #890000;
        display:block;
        margin:0 auto;
        width:200px;
        padding:5px 0;
        border-radius:8px;
        font-weight:700;
        background: -webkit-linear-gradient(top,  #ff3019 0%,#cf0404 100%);
        color: transparent;  
        text-shadow:0 1px 1px #000+50;
        box-shadow:0 2px 3px #000+150;
        z-index: 0;
    position: absolute;
top: 0;
left: 150px;    
        
}  

button.front {
        background: -moz-linear-gradient(top,  #ff3019 0%, #cf0404 100%);
        background: -o-linear-gradient(top,  #ff3019 0%,#cf0404 100%);
        background: -ms-linear-gradient(top,  #ff3019 0%,#cf0404 100%);
        background: -webkit-linear-gradient(top,  #ff3019 0%,#cf0404 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 );
        border:1px solid #890000;
        display:block;
        margin:0 auto;
        width:200px;
        padding:5px 0;
        border-radius:8px;
        color:#fff;
        font-weight:700;
        text-shadow:0 1px 1px #000+50;
        box-shadow:0 2px 3px #000+150;
        -webkit-transition:background linear .5s;
    position: absolute;
    top: 0;
    left: 150px;
    }
button.front:hover {
    background:#ff3019;
}
button.front:active {
    background:#cf0404;
}