/* Small Fruit
Welcome to custom CSS for the WSU Spine Theme!

You may delete these comments and get started with your custom stylesheet.
Before doing so, please review the WSU web standards:

http://brand.wsu.edu/media/web/web-standards/

As a general rule of thumb, if your styles target aspects of the spine
(#spine), that's against standard, whereas if you're styling elsewhere on
the page, it's all good.
*/
/*=======================================================*/
/* WP Gallery Styles (Remove if UComm finds missing CSS) */
/*=======================================================*/
.gallery {
	display: -webkit-flex;
/* Safari */
	display: flex;
	flex-flow: row wrap;
}

.gallery img {
	display: flex-box;
	border: .5em solid #fff;
	box-shadow: 0 1px 3px #b5babe;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
	filter: alpha(opacity=85);
	-moz-opacity: .85;
	-khtml-opacity: .85;
	opacity: .85;
}

.gallery img:hover, .gallery img:active {
	box-shadow: 0 1px 3px #5e6a71;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}

.gallery .gallery-caption {
	min-height: 2.5em;
	padding: 0;
	margin: 0;
	margin-bottom: .5em;
}

.gallery .gallery-caption, .wp-caption-text {
	max-width: 90%;
	text-align: left;
	font-size: 90%;
	line-height: 120%;
	font-style: italic;
}

@media screen and (min-width:694px) {
	.gallery-columns-1 figure.gallery-item {
		width: calc(100% - 10px);
	}
	
	.gallery-columns-2 figure.gallery-item {
		width: calc(100% / 2 - 10px);
	}
	
	.gallery-columns-3 figure.gallery-item {
		width: calc(100% / 3 - 10px);
	}
	
	.gallery-columns-4 figure.gallery-item {
		width: calc(100% / 4 - 10px);
	}
	
	.gallery-columns-5 figure.gallery-item {
		width: calc(100% / 5 - 10px);
	}
	
	.gallery .gallery-item {
		margin: 0;
		margin-top: 10px;
		margin-right: 10px;
	}
}

@media screen and (max-width:693px) {
	.gallery-columns-1 figure.gallery-item, .gallery-columns-2 figure.gallery-item, .gallery-columns-3 figure.gallery-item, .gallery-columns-4 figure.gallery-item, .gallery-columns-5 figure.gallery-item {
		width: 100%;
	}
	
	.gallery .gallery-item {
		margin: 0;
		margin-top: 10px;
	}
}

/*===================*/
/*    List Styles    */
/*===================*/
.no-bullet ul, ul.no-bullet {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.hanging li, .hanging p {
	padding-left: 1em;
	text-indent: -1em;
}

.highlight-item li:hover {
	color: #2a3033;
/* dark gray */
}

.highlight-item li:hover:before {
	content: "\25B6";
	color: #C69214;
	font-size: 150%;
	line-height: 0;
	float: left;
	clear: none;
	position: relative;
	left: -.9em;
	top: .35em;
}

.noLink {
/* Fades back link list items that do not have an href */
	color: #b5babe;
}

.no-margin-top {
	margin-top: 0;
	padding-top: 0;
}

/*================================================================*/
/* Nested floating div for links; attached to initial  of section */
/*================================================================*/
@media screen and (min-width: 694px) {
	.linkbox {
	/* Nested floating div for links; attached to initial  of section */
		width: 35%;
		max-width: 200px;
		min-width: 100px;
		margin-left: 2em;
		padding: .5em;
		float: right;
		clear: both;
		background-color: rgba(239,240,241,0.7);
		border-left: 1px dotted #b5babe;
		border-top: .25em solid #b5babe;
	}
}

@media screen and (max-width: 693px) {
	.linkbox {
		margin: 1em 0;
	}
	
	.linkbox h6:not(:first-of-type) {
		margin-top: 1em;
	}
	
	.linkbox ul {
		list-style: none;
		margin: 0;
		padding: 0;
		background: #eff0f1;
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: column wrap;
		flex-flow: column wrap;
	}
	
	.linkbox li a {
		text-align: center;
		text-decoration: none;
		display: block;
		color: #981e32;
		padding: 1em;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #b5babe;
	}
	
	.linkbox li a:hover, .linkbox li a:active {
		background: #981e32;
		color: #fff;
	}
	
	.linkbox li {
		padding: 0;
	}
	
	.linkbox li:last-of-type a {
		border-bottom: none;
	}
}

.content {
	overflow: auto;
}

/*=====================*/
/* Image style classes */
/*=====================*/
/*  wrapper to properly nest images into following content */
p.nested {
	margin: 0;
	padding-bottom: 0;
	padding-top: .5em;
}

.frame {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border: .5em solid #FFF;
	font-size: .9em;
	line-height: 1.4em;
}

.shadow {
	box-shadow: 0 1px 2px #D7DADB;
}

/*===============*/
/* Contact Icons */
/*===============*/
.spine-blank-template [title^="Email"]:before, .contactbox a[href^="mailto:"]:before {
	font-family: Spine-Icons;
	content: "\0040";
	margin-right: .3em;
	cursor: default;
}

.spine-blank-template [title^="Phone"]:before {
	font-family: Spine-Icons;
	content: "\1F4DE";
	margin-right: .3em;
	cursor: default;
}

.spine-blank-template [title^="Fax"]:before {
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	margin-right: .3em;
	content: "";
	background: url("../wp-content/uploads/sites/402/2015/01/fax-icon.svg") no-repeat 0 0;
	background-size: 100%;
}

@media only screen and (min-width:480px) {
	a[href^="tel://"] {
		color: #5E6A71 !important;
		text-decoration: none !important;
		cursor: text;
	}
}

#contact {
	margin-bottom: 1em;
}

#contact p {
	padding-bottom: 0;
	font-size: .9em;
	line-height: 1.4em;
}

.contactbox {
	background-color: #fff;
	padding-top: 1rem;
	padding-bottom: 1rem;
	margin-bottom: .5rem;
	border-bottom: 1px solid #d7dadb;
}

.contactbox:last-of-type {
	padding-bottom: 2rem;
	margin-bottom: 0;
	border-bottom: 0;
}

/*Add icon after PDF links*/
a[href*=".pdf"]:after {
	height: 16px;
	width: 16px;
	margin: 0 4px;
	content: url('../wp-content/uploads/sites/1032/2015/10/pdficon_small.png');
}