/*****************************************************
  * DH Interactive Ltd:
  * Duncan Hart
  * http://www.dhinteractive.co.uk
  *
  * Client: Ink and Oranges Inc
  * Client: http://www.inkandoranges.com
  *
  * Author: Duncan Hart
  * Author: http://www.dhinteractive.co.uk <support@dhinteractive.co.uk>
  *
  *Date 05/2014 - Created
  *
 *****************************************************
 */


/**** Isotope Filtering ****/

#container {
	margin: 0 auto;
	width: 98%;
}

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
          transition-duration: 0s;
}

/* End: Recommended Isotope styles */

/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
     -moz-transition: none;
          transition: none;
}

/**** Isotope styles ****/
.element {
	width: 48%;
	min-height: 50px;
	margin: 0.5%;

	float: left;
	overflow: hidden;
	position: relative;
	background: #FFF;
}

.element_overlay {
	position: absolute;
	float: left;
	top: 0;
	z-index: 99;
	width: 100px;
	height: 100px;
	border: 3px solid #FFF;
	text-align: center;
	color: #FFF;
}

.element_overlay_text {
	position: absolute;
	display:table;
	width: 100%;
	height: 100%;
	background: url('../_img/_global/thumb_bg.png');
  	background-size: 1px 1px;
  	background-repeat: repeat;
  	visibility: hidden;
}

.element_overlay_text_inner {
	display:table-cell;
	vertical-align: middle;
	line-height: 18px;
}

.element_over_text_highlight {
	color: #939598;
}


.element_movie {
	position: absolute;
	float: left;
	top: 0;
	z-index: 100;
	width: 30px;
	height: 30px;
	margin-left: 185px;
	margin-top: 5px;
	background-image: url('../_img/_global/movie.png');
	background-repeat: no-repeat;
}

.element>a>video {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 1;
}

/* The Magnificent Clearfix: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/*****************************************************
* Responsive Override
/*****************************************************
*/

@media screen and (min-width: 640px) {

	.element {
		width: 19%;
	}

}