/*
Welcome to Custom CSS!

CSS (Cascading Style Sheets) is a kind of code that tells the browser how
to render a web page. You may delete these comments and get started with
your customizations.

By default, your stylesheet will be loaded after the theme stylesheets,
which means that your rules can take precedence and override the theme CSS
rules. Just write here what you want to change, you don't need to copy all
your theme's stylesheet content.
*/
/* hiding text -- for screenreaders onlyl */
.visuallyhidden:not(:focus):not(:active) {
	clip: rect(0 0 0 0);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

/* border-left for blockquote */
blockquote.wp-block-quote {
	border-left: .25em solid #000;
	padding-left: 1em;
}

/* add border to screenshots with class screenshot-border on page */
.screenshot-border img {
	margin: 20px 20px 20px 0;
	padding: 20px;
	border: solid 1px #e5e5e5;
	background-color: #fff;
}

/* link icon after linked headers */
h1 a::after, h2 a::after, h3 a::after, h4 a::after, h5 a::after, h6 a::after {
	content: '\F126';
	font-family: wsu-icons;
	font-size: .875rem;
	color: #ca1237;
	margin-left: .6875rem;
	display: inline-block;
	text-decoration: none;
}

/* footer menu */
.wsu-footer-site__widgets .widget_text.wsu-widget h2 {
	font-size: .75rem;
	text-transform: uppercase;
	font-weight: 600;
}

.transcript {
	text-align: right;
	font-size: .75rem;
	text-transform: uppercase;
}

.classroom-breadcrumb {
	font-size: .88rem;
	text-transform: uppercase;
}

.back-to-top {
	text-align: right;
	font-size: .75rem;
	text-transform: uppercase;
}

.gray-background {
	background-color: #EBEBEB;
	padding: 10px;
	margin: 1rem 0;
}

.gray-rule {
	margin-top: 0;
	width: calc(100% + 30px);
	border: 0;
	color: #EBEBEB;
	background-color: #EBEBEB;
	height: 5px;
}

.indent-left {
	padding-left: 40px;
}

.wp-block-separator-thin {
	border-top: 2px solid #d9d9d9 !important;
}

/* ----------------------------------- faculty insider pages and all posts ---------------------- */
/* faculty insider post header */
.page-id-4796 h1.wsu-article-header__title, .page-id-4735 h1.wsu-article-header__title {
	display: none;
}

.postheader {
	margin-bottom: 1rem;
	text-align: center;
}

.postheader h1::after {
	display: none;
}

.postheader hr {
	margin-top: -2.5rem;
	border-top: 3px solid #d9d9d9;
}

address.wsu-meta-byline {
	display: none;
}

/* alternating background color for category page excerpts */
.category article:nth-of-type(odd), .tag article:nth-of-type(odd), .tax-wsuwp_university_location article:nth-of-type(odd) {
	background: #eff0f1;
	padding: 0 10px 15px;
	margin-top: 10px;
	margin-bottom: 10px;
}

/* inline light bulb images on Online Student Perspective and Zoom post */
.postid-10856 .alignnone, .postid-10716 .alignnone {
	margin: 5px 0 0;
}

/* ---------------------------------------- flex -------------------------------------------- */
/* flex for FOUR column layout */
.flexfourcol {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.flexfourcol-fourth {
	width: 25%;
	padding: 0 10px;
}

@media all and (max-width: 500px) {
	.flexfourcol {
	/* On small screens, we are no longer using row direction but column */
		flex-direction: column;
	}
	
	.flexfourcol-fourth {
		width: 100%;
		padding: 15px;
	}
}

/* flex for FOUR column layout for CLASSROOMS */
.flexfourcol-fourth-rooms {
	width: 25%;
}

.accordion div > .flextwocol, .accordion div > .flexfourcol-fourth-rooms {
	padding: 0;
}

@media all and (max-width: 500px) {
	.flexfourcol-fourth-rooms {
		width: 100%;
	}
}

/* flex for two column - one wide, one narrow - layout for training registration */
.flextwocol-left {
	width: 60%;
}

.flextwocol-right {
	width: 38%;
	text-align: right;
}

/* flex on small screens */
@media all and (max-width: 500px) {
	.flextwocol-left, .flextwocol-right {
		width: 100%;
		text-align: left;
	}
}

/* -------------------------------------- image gallery ------------------------------- */
/* remove captions on galleries */
.gallery figcaption {
	display: none;
}

/* less bottom margin */
.gallery figure {
	margin: 0;
}

/** Default Gallery Styles */
.gallery {
	display: flex;
	flex-wrap: wrap;
	margin: auto;
}

.gallery .gallery-item {
	box-sizing: border-box;
	padding: 1rem;
	text-align: center;
}

.gallery-columns-1 .gallery-item {
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	width: 50%;
}

.gallery-columns-3 .gallery-item {
	width: 33.333333%;
}

.gallery-columns-4 .gallery-item {
	width: 25%;
}

.gallery-columns-5 .gallery-item {
	width: 20%;
}

.gallery-columns-6 .gallery-item {
	width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	width: 11.11%;
}

.gallery img {
	border: 2px solid #cfcfcf;
	box-sizing: border-box;
	display: block;
	margin: 0 auto;
}

@media only screen and (max-width: 693px) {
	.gallery-columns-1 .gallery-item,
																											.gallery-columns-2 .gallery-item,
																											.gallery-columns-3 .gallery-item,
																											.gallery-columns-4 .gallery-item,
																											.gallery-columns-5 .gallery-item,
																											.gallery-columns-6 .gallery-item,
																											.gallery-columns-7 .gallery-item,
																											.gallery-columns-8 .gallery-item,
																											.gallery-columns-9 .gallery-item {
		width: 50%;
	}
	
	.gallery-item:nth-child(odd) {
		padding-left: 0;
	}
	
	.gallery-item:nth-child(even) {
		padding-right: 0;
	}
}

/* enlarge full-size-image link in JP Carousel */
a.jp-carousel-image-download {
	line-height: 1.5;
	font-size: 24px !important;
}