:root{ --white: #fff; --color1: #e74784; --color2: #00aaff; } .link{ color: var(--white); background: linear-gradient(to right, var(--color1), var(--color2)); font-family: "Kanit", sans-serif; font-size: 24px; font-weight: 400; line-height: 31px; padding: 4px 6px; text-transform: capitalize; border-radius: 10px 10px; border: 0; display: inline-block; overflow: hidden; position: relative; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); transition: all 0.3s ease; margin: 0 10px; z-index: 1; } .link:hover, .link:focus{ color: var(--white); transform: scale(1.1); box-shadow: 0 0 15px var(--color1); } @media only screen and (max-width: 767px){ .link{ margin-bottom: 30px; } }