/*
 * Title: Hestia Featured Header Image - Fullsize Button CSS
 * Author: David Madison
 * URL: www.partsnotincluded.com
 * Version: 1.0.1
 *
 */

.header-image-container > img {
	-webkit-box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.35); 
	box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.35);
}

/* Header image button style */
#header-image-button {
	position: absolute;
	cursor: pointer;
	transition: opacity 0.7s;
	opacity: 0;
	font-size: 0;
	padding: 15px;
	border-radius: 100%;
}

#header-image-button {
	margin-top: 70px;
	top: 20px;
	right: 20px;
}

#header-image-button.active {
	background-color: transparent;
	padding: 0;
	margin-top: 0;
}

/* If too small to benefit from seeing the full image... */
@media (max-width: 928px) {
	#header-image-button:not(.active) {
		display: none;
	}
}

#header-image-button:before {
	font-size: 22px;
	content: "\f030";  /* camera icon */
}

#header-image-button.active:before {
	font-size: 32px;  /* making up for the lack of padding */
	content: "\f057";  /* 'times' icon */
}

#header-image-button:hover {
	filter: opacity(0.75);
}

.header-image-button-hide {
	display: none;
}