html,
body {
	*margin: 0;
	*padding: 0;
	*width: 100%;
	*height: 200%;
}

body {
	overflow-x: hidden;
}


#placeholder {
	*overflow: hidden;
	position: absolute;
	top: 50px;
	left:50px;
	
	width: 900px;
	height: 600px;
	
	perspective: 100px;
}





.bannerStripe .bannerStripe-banner {
	position: absolute;
	left: 0;
	width: 100%;
	background: url() top center no-repeat transparent;
}
@media screen and (max-width: 979px) {
	.bannerStripe .bannerStripe-banner { display: none; }
	.bannerStripe .bannerStripe-placeholder { height: auto !important }
}


.play { display: block  !important; }
.pos_a_t { position: absolute  !important; }


.videos {
	position: relative;
	margin: 0 auto;
	
	*background-image: url('bg-blue.jpg');
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	
	box-sizing: border-box;
}

.hexagon {
	position: absolute;
	width: 100%;
}

.hexagon canvas {
	width: 100%;
	*height: 100%;
}



.newFeatureClips .hexagon {
	width: 23%;
	height: 300px;
	margin: 0;
	text-align: center;
	
	*border: 1px solid grey;
	*box-sizing: border-box;
	
	perspective: 500px;
	-webkit-perspective: 500px;
	
	*transition: all 0.3s;
	*-webkit-transition: all 0.3s;
}

.newFeatureClips .hexagon h5 {
	position: absolute;
	top: 60%;
	
	width: 80%;
	left: 10%;
	
	opacity: 1;
	
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
	
	z-index: 1;
	
    text-shadow:
		-1px -1px 0 #ffffff,
		1px -1px 0 #ffffff,
		-1px 1px 0 #ffffff,
		1px 1px 0 #ffffff; 
}

.newFeatureClips .hexagon h5.comingsoon {
	top: 35%;
	
	color: #ffffff;
	text-shadow: none; 
}




.hexagonBanner {}

.hexagonBanner-images {
	position: relative;
}

.hexagonBanner-placeholder {
	display: none;
}


.hexagonBanner [class*="span"] {
	float: left !important;
}



.textShaper { *background-color: yellow; }


.XcolorStripe-color {
	position: absolute;
	right: 0;
	left: 0;
	height: 100%;
}



@media (min-width:768px) and (max-width:979px) {
	.newFeatureClips .hexagon {
		width: 225px;
		height: 225px;
	}
	
	.textShaper,
	.XcolorStripe-color { display: none; }
	
	.hexagonBanner-placeholder {
		display: block;
	}
	
	.newFeatureClips .hexagon h5 {
		display: none;
	}
}
@media (max-width: 767px) {
	.newFeatureClips .hexagon {
		width: 145px;
		height: 145px;
	}
	
	.textShaper,
	.XcolorStripe-color { display: none; }
	
	.hexagonBanner-placeholder {
		display: block;
	}
	
	.newFeatureClips .hexagon h5 {
		display: none;
	}
}














.clip {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	border-radius: 1000px;
	
	*background-color: rgba(0,0,255,0.2);
	background: url("/img/video_play.png") no-repeat scroll center center rgba(0, 0, 0, 0);
	
	/*
	transform-origin:50% 100%;
	-webkit-transform-origin:50% 100%;
	transform: rotateX(30deg);
	-webkit-transform: rotateX(30deg);
	*/
	
	z-index: 2;
}

.grow {
	display: inline-block;
	
	transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	
	transition-property: transform;
	-webkit-transition-property: transform;
	
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	
	z-index: 1;
}
.grow:hover, .grow:focus, .grow:active {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
	z-index: 2;
}
.grow:hover h5, .grow:focus h5, .grow:active h5 {
	opacity: 0;
	z-index: 1;
}

/* grey filter */
.grow canvas {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}

.grow:hover canvas, .grow:focus canvas, .grow:active canvas {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
	-webkit-filter: grayscale(0%);
}