@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@200&display=swap');

.ff-2 {
    font-family: 'Barlow Condensed', sans-serif;
}

.fs-55 {
    font-size: 1.15rem !important;
}

.vertical-line {
    border: 1px solid grey;
}

.linkbtn {
    margin-top: 30px;
    position: relative;
}

.linkbtn::before,
.linkbtn::after {
    content: "";
    background: #a1a1a1;
    width: 100%;
    height: 1px;
    position: absolute;
    transition: left 0.3s cubic-bezier(0.38, 0.005, 0.215, 1), right 0.3s cubic-bezier(0.38, 0.005, 0.215, 1);
}

.linkbtn::before {
    top: 0;
    left: 20px;
}

.linkbtn::after {
    bottom: 0;
    right: 20px;
}

.linkbtn:hover::before {
    left: 0px;
}

.linkbtn:hover::after {
    right: 0px;
}

.linkbtn:hover span::before,
.linkbtn:hover span::after {
    transition: height 0.3s cubic-bezier(0.38, 0.005, 0.215, 1) 0.3s;
    height: 100%;
}

.linkbtn span::before {
    top: 0;
    left: 0px;
}

.linkbtn span::after {
    bottom: 0;
    right: 0px;
}

.linkbtn span::after,
.linkbtn span::before {
    content: "";
    background: #a1a1a1;
    width: 1px;
    height: 0%;
    position: absolute;
    transition: height 0.3s cubic-bezier(0.38, 0.005, 0.215, 1);
}