:root{ --white: #fff; --main-color: #906d32; } .link{ color: var(--main-color); font-family: "Lexend Deca", sans-serif; font-size: 22px; font-weight: 500; line-height: 31px; text-transform: capitalize; border-radius: 30px 30px; border: 3px solid var(--main-color); display: inline-block; overflow: hidden; position: relative; transition: all 0.3s ease-in; z-index: 1; } .link:hover, .link:focus{ color: var(--white); background: var(--main-color); } .link span{ display: block; padding: 2px 10px; transform: scale(0.8); transition: all 0.3s ease-in; } .link:hover span{ transform: scale(1); } @media only screen and (max-width: 767px){ .link{ margin-bottom: 30px; } }