/*INSTRUCTIONS FOR ADDING Call Out (3 ITEMS) Hover*/
/*Add 'Call Out (3 Items) Hover' Block to Content Center in the Block Layout (select domain and '<front>').
Activate this Stylesheet on the Domain Below.
DO NOT MAKE CHANGES TO THIS STYLE SHEET. OVERWRITE ALL CHANGES ON SITE SPECIFIC CSS*/


.PhotoCallOut img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.PhotoCallOutTitle h2 {
	font-size: 1.1em;
}


.CallOutBody {
	position: relative !important;
	top: -10em !important;
	color: white !important;
	margin-bottom: 0em !important;
	left: 0em !important;
	right: 0em !important;
	text-align: left !important;
	padding: 0em 1em !important;
	text-shadow: #000000 1px 0 10px;
	min-height: 0em;
	max-height: 0em;
}

.CallOutBody a {
	color: white !important;
}
.view-content #views-bootstrap-photo-with-call-out-block-2 .field-content a:hover, .view-content #views-bootstrap-photo-with-call-out-block-2 .field-content a:active, .view-content #views-bootstrap-photo-with-call-out-block-2 .field-content a:focus, .view-content #views-bootstrap-photo-with-call-out-block-2 .field-content a {text-decoration:none!important;}
a .PhotoCallOut .blackoverlay .CallOutBody, a .PhotoCallOut .blackoverlay .CallOutBody:hover, a .PhotoCallOut .blackoverlay .CallOutBody:active, a .PhotoCallOut .blackoverlay .CallOutBody:visited {text-decoration:none!important; color:white;}

.PhotoCallOut .CallOutBody p {
	position: relative;
	left: 0px;
	opacity: 0;
	top: .2em;
	transition: all 1s ease-out !important;
}

.PhotoCallOut .blackoverlay {
	background-color: black;
}




.PhotoCallOut:hover img {
	opacity: .3 !important;
	transition: all 1s ease-in !important;
}
  


.PhotoCallOut:hover p {
	opacity: 1;
	transition: all 1s ease-in !important;
}

@media screen and (max-width: 1300px) {
	.PhotoCallOutTitle h2 {
		font-size: .9em;
	}

	.PhotoCallOut .CallOutBody p {
		font-size: .8em;
	}

	.CallOutBody {
		top: -7.5em !important;
	}

}

@media screen and (max-width: 992px) {
	.PhotoCallOutTitle h2 {
		font-size: 1.1em;
	}

	.PhotoCallOut .CallOutBody p {
		font-size: 1em;
	}

	.CallOutBody {
		top: -12.5em !important;
	}

	.PhotoCallOut {
		margin: 1em 0em 0em 0em;
	}
}

@media screen and (max-width: 576px) {
	.CallOutBody {
		top: -10em !important;
	}
}

@media screen and (max-width: 476px) {
	.CallOutBody {
		top: -8em !important;
	}

	.PhotoCallOutTitle h2 {
		font-size: .8em;
	}

	.PhotoCallOut .CallOutBody p {
		font-size: .8em;
	}
}