/*
Float clearing goodness from Handcrafted CSS book ------------------------------------------------------------- */
.group:after { content: "."; display: block; height: auto; clear: both; visibility: hidden; }
* html .group { height: 1%; }
*:first-child+html .group { min-height: 0px; }

/*
Stacks CSS ----------------------------------------------------------------------------------------------------------- */

/* Layout */
.stack { float: left; width: inherit;   position: relative; z-index: 10; }

/* Image styles */
.stack img { max-width: 100%; height: 100%; vertical-align: bottom; border: 5px solid #fff; border-radius: 3px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.stack:last-of-type { margin-right: 0; }

/* Stacks creted by the use of generated content */
.stack:before, .stack:after { content: ""; border-radius: 3px; width: 100%; height: 100%; position: absolute; border: 10px solid #fff; left: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-webkit-transition: 0.3s all ease-out;
	-moz-transition: 0.3s all ease-out;
	transition: 0.3s all ease-out;
}
.stack:before { top: 4px; z-index: -10; } /* 1st element in stack (behind image) */	
.stack:after { top: 8px; z-index: -20; } /* 2nd element in stack (behind image) */

/* Second stack example (rotated to the right from the bottom left) */
.stack.rotated:before { 
	-webkit-transform-origin: left bottom left;
	-moz-transform-origin: left bottom left;
	transform-origin: left bottom left;
	-webkit-transform: rotate(6deg);
	-moz-transform: rotate(6deg);
	transform: rotate(6deg);
}
.stack.rotated:after { 
	-webkit-transform-origin: left bottom left;
	-moz-transform-origin: left bottom left;
	transform-origin: left bottom left;
	-webkit-transform: rotate(12deg);
	-moz-transform: rotate(12deg);
	transform: rotate(12deg);
}

/* Third stack example (One stack element rotated in the opposite direction) */
.stack.twisted:before {
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	transform: rotate(10deg);
}	
.stack.twisted:after {
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	transform: rotate(-10deg);
}	

/* Fourth stack example (Similar to the second but rotated left) */
.stack.rotated-left:before {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
	transform: rotate(-4deg);
}
.stack.rotated-left:after {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	transform: rotate(-8deg);
}

/* Second stack example (Similar to the second but rotated right) */
.stack.rotated-right:before { 
	-webkit-transform-origin: bottom right;
	-moz-transform-origin: bottom right;
	transform-origin: bottom right;
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	transform: rotate(4deg);
}
.stack.rotated-right:after { 
	-webkit-transform-origin: bottom right;
	-moz-transform-origin: bottom right;
	transform-origin: bottom right;
	-webkit-transform: rotate(8deg);
	-moz-transform: rotate(8deg);
	transform: rotate(8deg);
}		

/* Reset all rotations on hover */
.stack:hover:before, .stack:hover:after {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	transform: rotate(0deg);
}

/*
iPhone and mobile widths --------------------------------------------------------------------------------------------------------------------------- */
/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen 
	and (min-device-width: 320px) 
	and (max-device-width: 568px)
	and (-webkit-min-device-pixel-ratio: 2) {
		.stack { width: 100px; height: 100px; margin-bottom: 35px; }
	}
/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen 
	and (min-device-width: 375px) 
	and (max-device-width: 667px) 
	and (-webkit-min-device-pixel-ratio: 2) { 
		.stack { width: 100px; height: 100px; margin-bottom: 35px; }
	}

	
@media only screen and (max-width: 767px){
	.col-lg-4 .stack{margin: 10% 7% !important;}
	.col-lg-12 .stack:first-child{margin-top:0px !important;}
	.col-lg-12 .stack{/*margin: 10% 7% !important;*/ margin: 10% auto !important;display: block;
    position: relative;float: none;width: auto;max-width: 235px;height:100%;}
	.inner_page_content.inner_page_content_events .wpb_text_column.wpb_content_element{margin-bottom:0px !important;}
}
@media only screen and (min-width: 768px) and (max-width: 991px){
	.col-lg-4 .stack{margin: 10% 5% !important;}
	.col-lg-12 .stack{margin: 10% 5% !important;}
}
@media only screen and (min-width: 992px){
	.col-lg-4 .stack{margin: 10% 5% !important;}
	.col-lg-12 .stack{margin: 10% 5% !important;}
}
body#body_innerpage .inner_page_content .album_gallery_description_main{width:100%;float:left;display:block;}
body#body_innerpage .inner_page_content .album_gallery_description_main .maintitle{float:left;display:block;width:100%;font-size:22px;font-family:'Crimson Text', serif !important;/*font-family:'Work Sans', sans-serif !important;*/color:#d8292f !important;text-align:center;margin-bottom:5px;font-weight: 500;}
body#body_innerpage .inner_page_content .album_gallery_description_main .countphotos{float:left;display:block;width:100%;font-size:16px;font-family:'Work Sans', sans-serif !important;text-align:center;margin-bottom:15px;}
body#body_innerpage .inner_page_content .album_gallery_description_main .album_gallery_description{float:left;display:block;width:100%;font-size:14px;font-family:'Work Sans', sans-serif !important;text-align:center;}