
/* **************************** CONTENT GENERAL **************************** */

/* see frontpage.css for declarations specifically relating to the front page */
/* most general content declarations can be found in ../editor-style-shared.css */

#content { margin-top: 15px; margin-bottom: 15px; }
	.not-front-page #content { margin-top: 45px; margin-bottom: 65px; }
	.page-template-products-page #content { margin-top: 35px; }
	.chr_content { }
		.not-front-page .chr_content td img{ 
			width: 175px;
			height: 130px;
			max-width: 175px;
		}
	
/* easy sidebar column support */
.content_main { float: left; width: 57%; }
	.front-page .content_main { float: none; width: 100%; }
.content_side { float: right; width: 36.5%; }
		
	/* when there's no sidebar */
	.stretch .content_main, .content_main.stretch { float: none; width: 100%; }
	.stretch .content_side, .content_side.stretch { display: none; }
	
a.post-edit-link { text-transform: uppercase; font-size: .85em; color: #000; text-decoration: none; padding: 3px; margin: -3px; }
	a.post-edit-link:hover { text-decoration: none !important; background-color: #000; color: #fff; }
		a.post-edit-link:active { top: 1.5px; }

/* **************************** CONTENT FEATURE **************************** */

.feature { }
	.front-page .feature { /* see frontpage.css */ }
	.not-front-page .feature { height: 147px; border-top: 1px solid #B8B8B8; }
	
	.feature .inner_header { height: 100%; }
	
		.feature .inner_header_background_container {
			/* container to allow overflow:hidden to be applied in Firefox, since FF will not consider the blur element part of the overflow on an element itself */
			height: 100%;
			overflow: hidden; /* hide the blur */
		}
	
			.feature .inner_header_background {
				height: 100%;
				background-image: url("../images/inner_header_default.jpg"); /* will be replaced inline if set; this just the default */
			}
			
				.feature .inner_header.has-bg-img .inner_header_background {
					/* apply blur filtering to any image that is set directly as the header background - .has-bg-img means that this won't apply to our default image, since that is already delivered pre-blurred */
					-webkit-filter: blur(3px); /* grayscale(0.5);Chrome, Safari etc without css-filters-polyfill being required */
					-moz-filter: blur(3px); /*grayscale(0.5); /* compat? */
					-ms-filter: blur(3px); /*grayscale(0.5); /* future compat? */
					-o-filter: blur(3px); /*grayscale(0.5); /* compat? */
					filter: blur(3px); /*grayscale(0.5); /* Firefox, css-filters-polyfill */
					position: absolute;
					top: 0;
					left: 0;
				}
				
			.feature .inner_header_background_blurhelper {
				height: 100%;
				position: absolute;
				filter: none !important; /* *intentionally* not blurred, this is to soften the edges of the bevel */
				z-index: -1; /* make sure it is definitely hiding behind the other image; Chrome doesn't mind but Firefox requires it */
				top: 0;
				left: 0;
			}
			
			.feature .inner_header_background_container svg { display: none; position: absolute; top: 0; left: 0; }
			
			/* switch on IE10+ implementation */
			
				.mod-svgfilters.Explorer .feature .has-bg-img .inner_header_background_container .inner_header_background { display: none; }
				.mod-svgfilters.Explorer .feature .has-bg-img .inner_header_background_container svg { display: block; }
		
		.feature .inner_header_content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: table; }
		
			.feature .inner_header_title {
				display: table-cell;
				vertical-align: middle;
				font-size: 30px;
				color: #404040;
				font-family: "Brooklyn Samuels Five Bold";
				text-transform: uppercase;
			}
			
				.feature .inner_header_background_container.darkbg + .inner_header_content .inner_header_title { color: #fff; }
			
			.feature .inner_header_feature_image {
				background-image: url("../images/inner_feature_default.png"); /* will be replaced inline if set */
				width: 409px; /* will be replaced inline if set */
				height: 211px; /* will be replaced inline if set */
				position: absolute;
				right: -104px;
				bottom: 0;
				max-width: 430px;
				max-height: 210px;
				background-position: bottom right;
				background-size: contain;
			}
			
				.feature.megamenu_lightbox_is_active .inner_header_feature_image { opacity: 0;}
				.feature.megamenu_lightbox_deactivating .inner_header_feature_image { opacity: 1;}
				
/* **************************** PRODUCT CONTENT **************************** */

.product_content { }

.product-dropdown-wrapper{
	display: none;
    padding-bottom: 20px;

}
	
	.product_title { text-align: center; margin-bottom: 35px; }

	.product_content.cols-1 { }
		.product_content.cols-1 .col { }
			.product_content.cols-1 .col { width: 100%; }
	.product_content.cols-2 { }
		.product_content.cols-2 .col { }
			.product_content.cols-2 .col:nth-of-type(1) { width: 48%; margin-right: 2%; }
			.product_content.cols-2 .col:nth-of-type(2) { width: 48%; margin-left: 2%; }
	.product_content.cols-3 { }
		.product_content.cols-3 .col { }
			.product_content.cols-3 .col:nth-of-type(1) { width: 25%; }
			.product_content.cols-3 .col:nth-of-type(2) { width: 41%; margin: 0 4%; }
			.product_content.cols-3 .col:nth-of-type(3) { width: 26%; }
	
	.product_content .left { float: left; }
	.product_content .center { float: left; text-align: center; }
	.product_content .right { float: right; }
	
	.product_content .button { margin-top: 15px; }

		.product_content .mobile-btn { display: none; }
	
	.product_content .product_specs dl { border: 1px solid #B8B8B8; padding: 25px 30px; }
	
		.product_content .product_specs dt {
			font-family: "Gotham Bold";
			font-size: 16px;
			color: #404040;
			text-transform: uppercase;
			margin: 20px 0 10px 0;
		}
		
			.product_content .product_specs dt:first-child { margin-top: 0; }
		
		.product_content .product_specs dd { }
		
	.product_menu { margin-top: 35px; position: relative; }
	
		.product_menu .arrow {
			position: absolute;
			top: 0;
			right: -30px;
			height: 100%;
			width: 30px;
			background-image: url("../images/icons/arrow1_right_orange.png");
			background-position: center;
			background-repeat: no-repeat;
			color: transparent;
			text-indent: -9999px;
			opacity: .8;
		}
		
			.product_menu .arrow.prev {
				left: -30px;
				right: auto;
				-webkit-transform: rotate(180deg);
				-moz-transform: rotate(180deg);
				-ms-transform: rotate(180deg);
				-o-transform: rotate(180deg);
				transform: rotate(180deg);
			}
			
			.product_menu .arrow:hover { opacity: 1; }
			
		.product_menu .jcarousel { }
			.product_menu ul { }
				.product_menu ul li { float: left; text-align: center; position: relative; }
				
					.product_menu ul li a {
						text-decoration: none;
						display: block;
						opacity: 1; /* for animation */
						padding: 0 19px;
						/* width is limited inline based on thumbnail width setting */
						border: 2px solid #fff;
						opacity: .5;
						color: #404040;
					}
					
						.product_menu ul li a img {
							margin-bottom: 10px;
							width: 150px;
							height: 150px;							
						}
						
						.product_menu ul li a span { font-family: "Gotham Bold"; font-size: 12px; text-transform: uppercase; display: block; }
						
					.product_menu ul li.current { }
					.product_menu ul li:active { top: 1px; }
					
						/*.product_menu ul li.current a { cursor: default; border-color: rgba(235,140,33,.3); border-radius: 10%; }*/
							.product_menu ul li.current a span { margin-top: -7px; padding-bottom: 7px; }
						.product_menu ul li:active a { }
						
					/*.product_menu:hover ul li a { opacity: .5; }*/
						.product_menu ul li.current a,
						.product_menu ul li a:hover { text-decoration: none; opacity: 1; }

/* **************************** CONTACT PAGE CONTENT **************************** */
.contact-details{
	margin: 0;
	padding: 0;
	float: left;
	width: 50%;
	overflow: hidden;
}


.contact-label,
.contact-value{
	float: left;
	width: 50%;
	min-height: 30px;
	margin: 8px 0; 

}

.label-img{
	display: block;
	width: 30px;
	height: 30px;
}

.contact-label{
	text-transform: uppercase;
	color: #404040;
	font-weight: 800;
}

.contact-value a{
	/*color: #404040;*/
}

.contactmap{
	height: 350px;
	overflow: hidden;
}

.contactmap iframe {
    width: 100% !important;
    height: 100% !important;
}

/* **************************** IMAGE GALLERY **************************** */




/* ************************ The end, thanks for visiting! *********************** */
