.font-normal,
.font-anchor,
.font-label,
.page-title,
.didascalia,
.site-header-title,
.site-header-subtitle,
.menu__list a,
.site-header__social,
.font-section-title,
.font-copyright {
  position: relative;
}

.font-normal:hover::after,
.font-anchor:hover::after,
.font-label:hover::after,
.page-title:hover::after,
.didascalia:hover::after,
.site-header-title:hover::after,
.site-header-subtitle:hover::after,
.menu__list a:hover::after,
.site-header__social:hover::after,
.font-section-title:hover::after,
.font-copyright:hover::after {
  position: absolute;
  bottom: 100%;
  left: 0;
  margin-bottom: 4px;
  background: #333;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 0.7rem;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 999;
  pointer-events: none;
}

.font-normal:hover::after,
.font-anchor:hover::after,
.font-label:hover::after,
.page-title:hover::after,
.didascalia:hover::after,
.site-header-title:hover::after,
.site-header-subtitle:hover::after,
.site-header__social:hover::after,
.font-section-title:hover::after,
.font-copyright:hover::after {
  content: attr(class);
}

.menu__list a:hover::after {
  content: 'font-menu';
}