

$color_bg: #1f1f1f;
$color_text: #e0dfdf;
.dzstooltip--close {
  $size: 32px;
  width: $size;
  height: $size;
  position: absolute;
  cursor: pointer;
  top: -($size/2.5);
  right: -($size/2.5);
  box-shadow: 1px 1px 4px 0 rgba(50, 50, 50, 0.3);
  border-radius: 50%;
  z-index: 5;
  background-color: $color_bg;
  color: $color_text;

  >.label--x-button{
    font-size: 17px;
    line-height: 1;
    font-family: sans-serif;

    position: absolute;
    top:50%; left:50%; transform: translate(-50%,-50%) rotate(0deg);


    transition: transform 0.3s ease-out;

  }
  &:hover{

    >.label--x-button{
      transform: translate(-50%,-50%) rotate(90deg);
    }
  }
  > svg {
    width: $size;
    height: $size;

    .bg-circle {
      fill: #fff;
    }

    .x-path {
      fill: #444;
    }
  }
}
