#n23 .sample-boxes > ul li {
  position: relative;
}
.sample-boxes .tooltip {
  box-sizing: border-box;
  position: absolute;
  left: 0;
  transform: translateX(calc(-50% + 14px));
  top: 23px;
  background-color: #344350;
  background-color: #707070;
  color: rgba(250, 250, 250, 1);
  display: block;
  white-space: nowrap;
  line-height: 2em;
  padding: 0.06em 1em !important;
  border-radius: 0.35em;
  font-size: 0.9em !important;
  z-index: 1;
  opacity: 0;
  transition: opacity 500ms ease, transform 500s ease-in-out;
  pointer-events: none;
}
.sample-boxes .tooltip::after {
  position: absolute;
  top: -8px;
  right: 50%;
  margin-inline: auto;
  display: inline-block;
  border-right: 5px solid transparent;
  border-bottom: 8px solid #344350;
  border-bottom: 8px solid #707070;
  border-left: 5px solid transparent;
  content: "";
}
#n23 .sample-boxes > ul li:hover .tooltip,
#n23 .sample-boxes > ul li .tooltip:hover {
  opacity: 1;
  transform: translateY(0);
}