/*****
 * Product Features Highlighter
 * 1.0.2
*****/

/* default */
.product-features-highlighter { display: block; margin-bottom: 40px; font-size: 0px; }
	.pfh-container { position: relative; }
		.pfh-product-image { position: relative; display: block; width: 240px; height: 460px; margin: 0px auto; }
			.pfh-product-image span { display: block; margin: 0px auto; }
			.pfh-product-image-node { position: absolute; display: block; width: 24px; height: 24px; cursor: pointer; border: 2px solid #999; border-radius: 50%; 
				background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0.65) 100%);
				background: -webkit-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0.65) 100%);
				background: -moz-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0.65) 100%);
				background: -o-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0.65) 100%);
				box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.35); -webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.35); -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.35); -o-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.35); }
			.pfh-product-image-node:hover, .pfh-product-image-node.active { border-color: #c00; }
		.pfh-side { box-sizing: border-box; position: absolute; display: block; max-width: 360px; min-height: 300px; max-height: 500px; padding: 10px; }
		.pfh-side-L { left: 0px; }
		.pfh-side-R { right: 0px; }
			.pfh-side .pfh-quadrant { display: block; width: auto; height: auto; margin-bottom: 40px; opacity: 0.5; }
			.pfh-side .pfh-quadrant.last { margin-bottom: 0px; }
			.pfh-side .pfh-quadrant.active { opacity: 1; }
				.pfh-quadrant .pfh-quadrant-thumbnail { box-sizing: border-box; display: block; width: 70px; height: 70px; margin: 0px auto 10px; border: 5px solid #fff; border-radius: 50%; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25); -o-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.25); }
				.pfh-quadrant.focusing .pfh-quadrant-thumbnail, 
				.pfh-quadrant.active .pfh-quadrant-thumbnail { background-position: 0px -100px; }
					.pfh-quadrant .pfh-quadrant-thumbnail span { display: block; margin: 0px auto; width: 60px; height: 60px; border-radius: 50%; }
				.pfh-quadrant .pfh-quadrant-copy { display: block; width: 100%; text-align: center; text-shadow: 0px 1px 0px #fff; }
					.pfh-quadrant .pfh-quadrant-copy-title { font: 18px 'Karla', Arial, sans-serif; color: #222; text-transform: uppercase; }
					.pfh-quadrant .pfh-quadrant-copy p { margin: 5px 0px 0px; font-size: 12px; color: #777; }
					
/* custom */
.pfh-product-image span, .pfh-quadrant-thumbnail span { background-image: url('//cdn2.bigcommerce.com/server4400/23b24/templates/__custom/images/site/pfh-sprites.png?t=1461362181'); background-repeat: no-repeat; }
.pfh-product-image span { width: inherit; height: inherit; }
.pfh-product-davinci .pfh-product-image span { background-position: 0px 0px; }
.pfh-product-ascent .pfh-product-image span { background-position: -240px 0px; }
.pfh-product-davinci #quadrant-1 .pfh-quadrant-thumbnail span { background-position: 0px -460px; }
.pfh-product-davinci #quadrant-2 .pfh-quadrant-thumbnail span { background-position: -60px -460px; }
.pfh-product-davinci #quadrant-3 .pfh-quadrant-thumbnail span { background-position: -120px -460px; }
.pfh-product-davinci #quadrant-4 .pfh-quadrant-thumbnail span { background-position: -180px -460px; }
.pfh-product-ascent #quadrant-1 .pfh-quadrant-thumbnail span { background-position: -240px -460px; }
.pfh-product-ascent #quadrant-2 .pfh-quadrant-thumbnail span { background-position: -300px -460px; }
.pfh-product-ascent #quadrant-3 .pfh-quadrant-thumbnail span { background-position: -360px -460px; }
.pfh-product-ascent #quadrant-4 .pfh-quadrant-thumbnail span { background-position: -420px -460px; }