Visually hide element

.visually-hidden {
  /* Remove the item from normal flow */
  position: absolute;
  /* Workaround for falsely pronounced, smushed text */
  white-space: nowrap;
  /* Set it to the smallest possible size (some screen readers ignore elements with zero height and width) */
  width: 1px;
  height: 1px;
  /* Hide overflowing content after resizing */
  overflow: hidden;
  /* Reset any property that may change the elements size */
  border: 0;
  padding: 0;
  /* Clipping defines what part of an element should be displayed. */
  /* Deprecated clip property for older browsers */
  clip: rect(0 0 0 0);
  /* clip-path for newer browsers. inset(50%) defines an inset rectangle that makes the content disappear.  */
  clip-path: inset(50%); 
}