/* https://github.com/twbs/bootstrap-expo/blob/fa9fe6f5e89bbe35ac3ef19c10b170747f383eb5/src/_sass/_bootstrap.scss#L2774 */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	/*-*/ margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap; /*+*/
	border: 0;
}


/*
{
	/ *(lost the source link)* /
	.visually-hidden {
		position: absolute !important;
		height: 1px;
		width: 1px;
		overflow: hidden;
		clip: rect(1px, 1px, 1px, 1px);
	}

	/ *
	{
		position: static !important;
		height: auto;
		width: auto;
		overflow: visible;
		clip: auto;
	}
	* /
}
*/




/* https://medium.com/@matuzo/writing-css-with-accessibility-in-mind-8514a0007939#3613 */
.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%); 


	/* It seems like at the moment nobody is quite sure why margin: -1px is there. On top of that it seems to cause issues (see: https://github.com/h5bp/html5-boilerplate/issues/1985). */
	margin: -1px;
}