.link{ color: #2f3542; font-family: 'Mulish', sans-serif; font-size: 22px; font-weight: 700; line-height: 23px; text-transform: capitalize; display: inline-block; position: relative; transition: all 0.3s ease 0s; } .link:hover, .link:focus{ color: #89348a; } .link:before{ content: ""; width: 100%; height: 100%; border: 2px solid #89348a; transform: scale(0); position: absolute; top: 0; left: 0; transition: transform 0.3s ease 0s,width 0.3s ease 0.2s,left 0.3s ease 0.2s,border 0.3s ease 0.2s; } .link:hover:before{ border-color: rgba(0,0,0,0.2); transform: scale(1.1,1.4); width: 90%; left: 10%; } @media only screen and (max-width: 767px){ .link{ margin-bottom: 30px; } }