/*
	Mosaic - Sliding Boxes and Captions jQuery Plugin
	Version 1.0.1
	www.buildinternet.com/project/mosaic
	
	By Sam Dunn / One Mighty Roar (www.onemightyroar.com)
	Released under MIT License / GPL License

*/

	/*General Mosaic Styles*/
	
		.mosaic-block {
			/*float:left;*/
			position:relative;
			overflow:hidden;
		}

		.mosaic-backdrop {
			display:none;
			/*position:absolute;*/
			top:0;
			height:100%;
			width:100%;
			background:#111;
		}
		
		.mosaic-overlay {
			display:none;
			z-index:5;
			position:absolute;
			width:100%;
			height:100%;
			background:rgba(255,255,255,0.85);
		}
	
		/*** Custom Animation Styles (You can remove/add any styles below) ***/
		.circle .mosaic-overlay {
			background:url(../img/hover-magnify.png) no-repeat center center;
			opacity:0;
			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
			filter:alpha(opacity=00);
			display:none;
		}
		
		.fade .mosaic-overlay {
			opacity:0;
			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
			filter:alpha(opacity=00);
			/*background:url(../img/bg-black.png);*/
		}
		
		.bar .mosaic-overlay {
			bottom:-100%;
			height:100%;
			/*background:url(../img/bg-black.png);*/
		}
		
		.bar2 .mosaic-overlay {
			bottom:-50%;
			height:100%;
			opacity:0.8;
			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
			filter:alpha(opacity=80);
		}
		
			.bar2 .mosaic-overlay:hover {
				opacity:1;
				-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
				filter:alpha(opacity=100);
			}
		
		.bar3 .mosaic-overlay {
			top:-100%;
			height:100%;
			/*background:url(../img/bg-black.png);*/
		}
		/*** End Animation Styles ***/

		.details{ 
			margin:15px 20px; 
		}
			
			
			
			
			
			
			
			
			/* entire container, keeps perspective */
.flip-container {
	-webkit-perspective: 900px; /* Chrome, Safari, Opera */
    perspective: 900px;
}

.flip-container.flipper {
		transform: rotateY(0deg);
	}

@media screen { /* hover styles here */ 
/*.flip-container:hover .flipper {
		transform: rotateY(180deg);
	}*/
	div.front.margins > img.pure-img-responsive:hover {
		opacity:0.875;
	}
} 

 /*@media handheld { non-hover styles here */ 
	.flip-container.flip180 .flipper {
		transform: rotateY(180deg);
	}

/*}*/



	/* flip the pane when hovered
	.flip-container:hover .flipper, .flip-container.flip180 .flipper {
		transform: rotateY(180deg);
	} */

.flip-container, .front, .back {
	width: 100%;
	height: 100%;
}

/* flip speed goes here */
.flipper {
	transition: 0.6s;
	transform-style: preserve-3d !important;

	position: relative;
}

/* hide back of pane during swap */
.front, .back {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;

	
	top: 0;
	left: 0;
	cursor:pointer;
}
h3.marginLeft, h4.marginLeft{
	cursor:pointer;
	}

/* front pane, placed above back */
.front {
	z-index: 2;
	/* for firefox 31 */
	transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back {
	transform: rotateY(180deg);
	position: absolute;
}
.flip-container .back > p{
	margin:0;
	padding:0;
	line-height:1.65em;
	font-size:0.9em;
	display: block;
	color: #777;
}
/*@media (min-width: 84em) {
	.flip-container .back > p {
		padding:1em 1em 0 0;
	}
}*/