.btn{
color: #000;
background: #fff;
font-family:'Archivo', sans-serif;
font-size: 18px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
padding: 8px 15px;
margin-right: 18px;
border-radius: 0;
border: none;
border-right: 1px solid #000;
position: relative;
z-index: 1;
transition: color 0.2s ease-in-out 0.25s;
}
.btn:hover{
color: #fff;
transition: color 0.2s ease-in-out 0.25s;
}
.btn:after{
content: "";
background-color: #000;
width: 1px;
height: 100%;
transform: rotate(-90deg);
transform-origin: center;
position: absolute;
top: 0;
right: 0;
transition: width 0.3s ease-in-out, transform 0.2s ease-in-out 0.3s;
}
.btn:hover:after{
width: 100%;
transform: rotate(0deg);
z-index: -1;
transition: transform 0.2s ease-in-out, width 0.3s ease-in-out 0.2s;
}
@media only screen and (max-width: 767px){
.btn{ margin-bottom: 30px; }
}