/* This CSS document is for WET-like features that can be used throughout the website. */

/* ASL/LSQ ALERT: Purple alert box and video icon for ASL/LSQ videos */
.alert-asl {
	background: #d9dbf8;
	border-color: #313772;
}

.alert-asl p, .alert-asl h2, .alert-asl h3, .alert-asl h4 {
	color: #000;
}

.alert-asl > :first-child::before {
	content: url("/_site/theme/assets/Accessibility_Alert box_Icon-camera.svg");
	height: 1em;
	width: 1em;
}
/* END OF ASL/LSQ ALERT */

/* ACCESSIBILITY BUTTON: Purple button for ASL videos and other accessibility-related links */
.btn-access, .btn-access:visited, .btn-access:hover, .btn-access:focus {
	color: #FFF;	
}

.btn-access {
	background: #313772;
	border-radius: 20%/50%;
	font-family: "Arial", sans-serif;
	font-weight: bold;
	font-size: 20px;
	padding: 9px 36px;
	margin-top: 6px;
}

.btn-access:hover, .btn-access:focus, .btn-access:active {
	background: #24244C;
}
/* END OF ACCESSIBILITY BUTTON */

/* TWEAKS FOR ACCESSIBLE WEB CONTENT */

/* For when the copy is bolded for style but not for emphasis. Use this to not annoy screen reader users. */
.boldForStyle {
	font-weight:bold;
}
/* For when the copy is italicized for emphasis but not because it's a Law, Act, etc. Make sure to wrap in a strong tag so screen reader users still hear the emphasis. Example use:
<p><strong><span class="italicizeForEmphasis">Italicized content here</span></strong></p>
*/
.italicizeForEmphasis {
	font-weight: normal;
	font-style: italic;
}

/* END OF TWEAKS FOR ACCESSIBLE WEB CONTENT */