/* Image
--------------------------------------------- */

.site-container .image {
	display: block;
	line-height: 0;
	margin-right: -50px;
	margin-left: 50px;
	margin-top: -20px;
	padding: 0;
	position: relative;
	-webkit-box-shadow: 8px 8px 35px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    8px 8px 35px 0px rgba(0, 0, 0, 0.5);
	box-shadow:         8px 8px 35px 0px rgba(0, 0, 0, 0.5);
	
	-webkit-transform: rotate3d(0,0,1,-5deg);
	-moz-transform: rotate3d(0,0,1,-5deg);
	transform: rotate3d(0,0,1,-5deg);
}

.site-container .image:after,
.site-container .image:before {
	background: #fff;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
	bottom: -3px;
	display: block;
	content: "";
	height: 100%;
	position: absolute;
	right: -3px;
	width: 100%;
	z-index: 2;
}

.site-container .image:after {
	bottom: -6px;
	right: -6px;
	z-index: 1;
	
	-webkit-box-shadow: 2px 2px 0 0 rgba(255, 255, 255, 1);
	-moz-box-shadow:    2px 2px 0 0 rgba(255, 255, 255, 1);
	box-shadow:         2px 2px 0 0 rgba(255, 255, 255, 1);
}

.site-container .image h2 {
	background: rgba(255,255,255,.90);
	font-size: 36px;
	padding: 10px 10px;
	position: absolute;
	top: 50px;
	left: 50px;
	margin-right: 50px;
	line-height: 1.2;
	text-align: center;
}

.site-container .image .module-wrap {
	position: relative;
	z-index: 99;
}

.site-container .image .module-wrap img {
	max-height: 500px;
    min-width: 100%;
}

.site-container .image figcaption {
	color: #fff;	
	bottom: 50px;
	display: inline-block;
	font-weight: bold;
	left: -10px;
	line-height: 1.5;
	margin-right: 20px;
	padding: 10px 20px;
	position: absolute;
}


/*
Media Queries
---------------------------------------------------------------------------------------------------- */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {

}

@media only screen and (max-width: 1139px) {
	
}

@media only screen and (max-width: 1024px) {
	
}

@media only screen and (max-width: 768px) {
	
	.site-container .image {
		margin-left: auto;
		margin-right: auto;
		width: 60%;
	}
	
	.site-container .image h2 {
		font-size: 30px;
	}
	
}

@media only screen and (max-width: 460px) {
	
	.site-container .image {
		width: 90%;
	}
	
	.site-container .image h2 {
		font-size: 26px;
		left: 20px;
		margin-right: 20px;
		top: 20px;
	}
	
}