/*** tooltips ***/

.imglink {
  display: grid;
  position: relative;
  justify-items: center;
  background: white;
}

.imglink a {
  overflow: hidden;
}

[role="tooltip"] {
  display: none;
  position: absolute;
  bottom: 3.4em;
  width: 377%;

  justify-content: center;
  align-content: center;
}

[role="tooltip"] * {
  padding: 0.1em 0.3em;
}

[role="tooltip"] span {
  background: black;
  color: var(--vio2);
  border: 1px solid white;
}

a:hover + [role="tooltip"],
a:focus + [role="tooltip"] {
  display: grid;
}

:focus > img,
:hover > img {
  filter: opacity(55%);
}
