@keyframes focusRing{0%{box-shadow:#fff 0 0 0 1px inset,#69c 0 0 0 3px}100%{box-shadow:none}}.tooltip{display:inline-block;position:relative}.tooltip__control{cursor:pointer;display:inline-flex;justify-content:center}.tooltip__control svg{vertical-align:middle}.tooltip__content{animation:fade .3s ease-in-out both;background:hsl(251,51%,18%);color:#fff;font-size:.875rem;line-height:1.2;margin:.1em 0;padding:1em 1.2em;position:absolute;z-index:5;display:none}@media(max-width: 767px){.tooltip__content{width:10rem}}@media(min-width: 768px)and (max-width: 1023px){.tooltip__content{width:15rem}}@media(min-width: 1024px){.tooltip__content{width:15rem}}:focus+.tooltip__content,:hover>.tooltip__content{display:block}.tooltip__content[class*=bottom]{top:100%}.tooltip__content[class*=top]{bottom:100%}.tooltip__content[class$=right]{left:0}.tooltip__content[class$=left]{right:0}.tooltip__content[class*=center]{transform:translateX(-50%);left:50%}