.ghost-button-border-color { display: inline-block; width: 200px; padding: 8px; color: #fff; border: 2px solid #fff; text-align: center; outline: none; text-decoration: none; transition: border-color 0.3s ease-out, color 0.3s ease-out; } .ghost-button-border-color:hover, .ghost-button-border-color:active { color: #66d8ed; border-color: #66d8ed; transition: border-color 0.4s ease-in, color 0.4s ease-in; } Ghost button text