.sp-error {
  position: absolute;
  z-index: 3;
  width: 100%;
  height: 100%;
  background-color: $backgroundColor;
  border-radius: $borderRadius;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  svg {
    width: 60px;
    height: 60px;

    path {

      fill: $iconErrorColor;
      d: path("M 36 21 c -9.93 0 -18 8.07 -18 18 c 0 4.98 2.04 9.45 5.28 12.72 l 4.26 -4.26 C 25.35 45.3 24 42.33 24 39 c 0 -6.63 5.37 -12 12 -12 s 12 5.37 12 12 c 0 3.33 -1.35 6.3 -3.54 8.46 l 4.26 4.26 C 51.96 48.45 54 43.98 54 39 c 0 -9.93 -8.07 -18 -18 -18 Z m 0 -12 C 19.44 9 6 22.44 6 39 c 0 8.28 3.36 15.78 8.79 21.21 l 4.26 -4.26 C 14.7 51.63 12 45.63 12 39 c 0 -13.26 10.74 -24 24 -24 c 7.59 0 14.34 3.51 18.72 9 h 7.26 C 56.79 15.03 47.1 9 36 9 Z m 0 24 c -3.3 0 -6 2.7 -6 6 c 0 1.65 0.69 3.15 1.77 4.23 C 32.85 44.31 34.35 45 36 45 c 1.65 0 3.15 -0.69 4.23 -1.77 C 41.31 42.15 42 40.65 42 39 c 0 -3.3 -2.7 -6 -6 -6 Z m 24 -3 h 6 v 18 h -6 V 30 Z m 0 24 h 6 v 6 h -6 v -6 Z");

    }

  }

  span {
    color: $textErrorColor;
    font-size: 18px;
    font-family: $fontBold;
    text-align: center;
  }

  @media (max-width: 600px) {
    span {
      font-size: 16px;
    }
  }
}