Close button in CSS

index.html

<a href="#" class="close">

main.scss

.close {
  position: absolute;
  right: 0;
  left: 20px;
  top: 32px;
  width: 21px;
  height: 21px;
  opacity: 0.3;
  background: red;
  border-radius: 50px;
  
  &:hover { opacity: 1; }

  &:before, &:after {
    position: absolute;
    left: 10px;
    top: 6px;
    content: '';
    height: 11px;
    width: 2px;
    background: $white;
  }

  &:before { transform: rotate(45deg); }

  &:after { transform: rotate(-45deg); }
}