SCSS
@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro');
html, body {
height: 100%;
margin: 0;
}
body {
display: flex;
justify-content: center;
align-items: center;
background-image: url('https://image.ibb.co/icbLMF/ep_naturalblack.png');
}
.btn-wrapper {
width: 290px;
height: 110px;
position: relative;
margin: 40px auto 0;
&:hover {
.btn-inner {
top: -4px;
transform: scale(1, 1);
cursor: pointer;
}
}
&__container {
border-bottom: 2px solid #15B5E2;
position: absolute;
width: 100%;
height: 80px;
&:before,
&:after {
border-bottom: 2px solid #15B5E2;
width: 96%;
left: 2%;
bottom: -8px;
content: "";
position: absolute;
}
&:after {
width: 92%;
left: 4%;
bottom: -14px;
}
.btn-inner {
width: 104.2%;
height: 100%;
position: absolute;
top: 20px;
left: -2.1%;
border: 2px solid #15B5E2;
box-sizing: border-box;
color: #15B5E2;
display: flex;
justify-content: center;
align-items: center;
font-family: 'Source Code Pro', monospace;
letter-spacing: 1px;
text-transform: uppercase;
font-size: 18px;
background: #10131C;
transform: scale(.96, .96);
transition: all .3s;
z-index: 4;
}
}
}