/*
Theme Name: Chromatix Timplate
Author: Tim Malone, tim.malone@chromatix.com.au
Author URI: http://www.chromatix.com.au
Description: Chromatix theme
Version: 2.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chromatix.com.au
*/

/* **************************** INIT **************************** */

/* Reset code */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline;
}

/* css to skip for search engines */
.assistive-text { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); }
#access a.assistive-text:active, #access a.assistive-text:focus {
	background: #eee; border-bottom: 1px solid #ddd; color: #809a04; clip: auto !important;
	font-size: 12px; position: absolute; text-decoration: underline; top: 0; left: 7.6%;
}

a img { border: 0; } /* IE fix. Make images that are links not have obnoxious blue borders */
li { list-style-type: none; } /* We'll turn 'em on if we need 'em */
.clear { clear: both; }
.disable > a, a.disable, .disabled > a, a.disabled { cursor: default !important; text-decoration: none !important; }
.nomargin { margin: 0 !important; }
.nocaps { text-transform: none !important; }
.clickable { cursor: pointer; }
.close { position: absolute; top: 10px; right: 10px; z-index: 1100; width: 32px; height: 32px; 	background-image: url("images/icons/close2_black.png"); background-size: 32px; background-repeat: no-repeat; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; cursor: pointer; }
	.close:hover { opacity: .6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.hide_till_loaded { display: none; }
.hide_when_loaded { }
.fixedbg { background-attachment: fixed; }
.bs { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.topoffset { position: relative; top: -25px; }
.rightoffset { position: relative; right: -25px; }
.bottomoffset { position: relative; bottom: -25px; }
.leftoffset { position: relative; left: -25px; }
a.opacity_hover { opacity: .8; -webkit-transition: opacity .5s; -moz-transition: opacity .5s; transition: opacity .5s; }
	a.opacity_hover:hover { opacity: 1; }
	
.jcarousel { overflow: hidden; }
	.jcarousel ul { width: 20000em; position: relative; }

.imagebg { background-position: center; background-repeat: no-repeat; background-size: cover; }
	.mod-no-bgsizecover .imagebg { /*background-size: 100%; FIXXX*/ }

	img.imagebg {
		padding-left: 100%; /* allow a background-image to be used on an img element */
		-webkit-box-sizing: border-box; /* stop the padding-left above from breaking everything ;) */
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		background-size: contain;
	}
	
.buttonpress:active,
.chr_slider .links .link:active { top: 1px; }

.post-continue::after,
.trans,
.product_menu ul li a,
.feature .inner_header_feature_image,
.header_menu ul.menu > li > ul.sub-menu,
.featured_pages .link,
.content_section ul.icons li img,
.chr_slider .links .link,
.footer_top .logo .link,
.footer_middle a,
.footer_middle a:after,
.footer_bottom a:after,
.back_to_top,
.chr_slider .links .link-featured:before,
.chr_slider .links .link-featured:after,
.chr_slider .links .link-featured .arrow,
.chr_slider .links .link-featured .arrow:before,
.chr_slider .links .link-featured .arrow:after,
.sidebar .image_gallery .nav .element,
.header_menu ul.menu > li > a,
.header_menu ul.menu > li > ul.sub-menu > li > a,
.mm-opened ul.menu > li > a,
.mm-opened ul.menu > li > ul.sub-menu > li > a,
input[type="submit"],
input[type="button"],
button,
a.button,
.buttons a,
a.button_link,
.button_links a,
.fadeonview {
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}

.fadeonview { opacity: 1; position: relative; right: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

	.fadeonview.off {
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
		right: -15px;
		-webkit-transition: none;
		-moz-transition: none;
		transition: none;
	}
	
	/* disable fadeonview for touch devices, due to issues with momentum scroll not showing it, and not showing at all on old iPad */
	.mod-touch .fadeonview, .mod-touch .fadeonview.off {
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		right: 0;
	}

.noselect {
	/* stops user from selecting text, for example when clicks are handled in a web app */
	-webkit-user-select: none; /* webkit (safari, chrome) browsers */
	-moz-user-select: none; /* mozilla browsers */
	-khtml-user-select: none; /* webkit (konqueror) browsers */
	-ms-user-select: none; /* IE10+ */
}

/* **************************** FONTS **************************** */

/* See editor-style-shared.css for fonts */

/* ************************** STRUCTURE ************************** */

html, body, .chr_page {
	width: 100%;
	/* see editor-style-shared.css for font-family and font-size */
	-webkit-text-size-adjust: none; /* to stop iPhone Safari from changing text sizes on us */
	position: relative;
}

	/* horizontal scroll fixes: Mac Books require overflow-x hidden on html AND body to avoid trackpad scroll; Windows Chrome then requires a full overflow hidden on body to avoid additional scrollbars */
	html { overflow-x: hidden; }
	body { overflow: hidden; }
	
	/* may need to be hidden if page_containers or fullwidth_containers are used */
	/*.chr_page { overflow-x: hidden; }*/

.content_container, .page_container, .fullwidth_container {
	margin-left: auto; margin-right: auto; position: relative; }
	
	.content_container { max-width: 960px; clear: both; }
	.page_container { width: 2560px; left: -800px; /* half of the difference between this width and content_container's width */ }
	.fullwidth_container { width: 100%; }

/* *********************** OLD IE ********************** */

/* to deal with Old IE, we'll hide anything that doesn't look quite right and show a message */
	
.oldie .chr_page { padding-top: 100px; }
.oldie .chr_page:before {
	content: "It looks like you're using an unsupported browser. While you can view this site, the experience will not be the same as with a newer browser. To experience the latest of what the web has to offer - and keep your browsing secure - we recommend downloading the latest version of Chrome or Firefox.";
	background-color: #F9D5AC;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 96%;
	z-index: 100;
	height: 60px;
	padding: 2%;
}

.oldie .megamenu_wrapper,
.oldie .contact_popout_wrapper,
.oldie .greyscale-image-img,
.oldie .greyscale-image-link { display: none !important; }

.oldie li.disabled.megamenu a { cursor: pointer !important; }

.oldie img.imagebg,
.oldie .pdf_icon,
.oldie .email_icon,
.oldie .phone_icon { background-image: none !important; padding-left: 0 !important; }

	.oldie img.imagebg { box-sizing: content-box !important; margin-left: auto; margin-right: auto; width: auto; }

/* *********************** MASTHEAD (HEADER) ********************** */

.masthead { background-color: #fff; }
	.home.page .masthead { position: absolute; }
	
	.masthead_top { height: 106px; z-index: 20; }
		.masthead_content_top { height: 100%; overflow: hidden; /* hide any overflow of the widget table */ }
	
			.logo_wrapper { position: absolute; top: 0; left: 0; height: 100%; width: 236px; }
			
				.logo_wrapper h1,
				.logo_wrapper a { width: 100%; height: 100%; display: block; }
				
				.logo_wrapper img { width: 100%; height: 100%; }
				
			.header_widget_area { float: right; height: 100%; display: table; max-width: 650px; /* don't hit the logo! */ }
				.header_widget_area .widget { display: table-cell; vertical-align: middle; padding: 0 20px; }
					.header_widget_area .widget:first-child { padding-left: 0; }
					.header_widget_area .widget:last-child { padding-right: 0; }
				
				.header_widget_area h2 { font-size: 31px; }
					.header_widget_area h2 .phone_icon { background-size: auto; padding-left: 40px; }
						.header_widget_area a,
						.header_widget_area a:hover,
						.header_widget_area a:visited{
							color: #040404;
							text-decoration: none;
						}

	.masthead_bottom { height: 57px; border-top: 1px solid #B8B8B8; }
		.masthead_content_bottom { height: 100%; }
	
/* **************************** FOOTER **************************** */

.footer { border-top: 1px solid #B8B8B8; background-color: #FFECD6; }

	.footer_feature_image {
		position: absolute;
		left: -150px; /* if you change this, update the $feat_img_width value at the top of footer.php */
		top: -50px; /* if you change this, update the $feat_img_height value at the top of footer.php */
		z-index: 1;
	}

	.footer_top { background-color: #FFFFFF; }
		.footer_content_top { padding: 30px 0; }
			.footer_top .logos { margin: 0 -5%; }
				.footer_top .logo { width: 20%; margin: 2% 5%; height: 90px; float: left; }
					.footer_top .logo .link { display: block; height: 100%; opacity: 1; padding: 2% 5%; }
					.footer_top .logo .image { width: 100%; height: 100%; }
					
				.footer_top .logos:hover .link { opacity: .5; }
					.footer_top .logos:hover .link:hover { opacity: 1; }
	
	.footer_details{
		float: left;
	}				
	.footer_middle { background-color: #FFECD6; }
		.footer_content_middle { padding: 50px 0; }
			.footer_middle .map { float: right; width: 280px; height: 200px; background-color: #FFECD6; }
				.footer_middle .map iframe { width: 100%; height: 100%; }
			.footer_middle .title { margin-top: 0; }
			.footer_middle .street { margin: 20px 0; }
			
			.footer_middle .phone,
			.footer_middle .email { display: block; font-size: 16px; font-family: "Open Sans Bold"; margin: 2px 0; }
			
			.footer_middle a { color: #656565; text-decoration: none; position: relative; }
			
				.footer_middle a:after {
					content: "";
					border-top: 2px solid rgba(235,140,33,0.8);
					position: absolute;
					bottom: 1px;
					left: 0;
					height: 0;
					width: 0;
				}
			
				.footer_middle a:hover { color: #EB8C21; text-decoration: none; }
					.footer_middle a:hover:after { width: 100%; }

.footer_bottom { background-color: #EB8C21; font-size: 11px; }
	.footer_content_bottom { padding: 15px 0; }

		.footer_bottom .widgettitle { display: none; }
		.footer_bottom div.widget { display: none; float: left; width: 33%; min-height: 1px; }
			.footer_bottom div.widget:first-child { display: block; text-align: left; }
			.footer_bottom div.widget:nth-child(2) { display: block; text-align: center; }
			.footer_bottom div.widget:nth-child(3) { display: block; text-align: right; }
			
		.footer_bottom a { text-decoration: none; position: relative; }
			.footer_bottom a img{ vertical-align: middle; margin: 5px 3px; }
			
			.footer_bottom a:after {
				content: "";
				border-top: 1px solid rgba(255,255,255,0.8);
				position: absolute;
				bottom: 1px;
				left: 0;
				height: 0;
				width: 0;
			}
			
			.footer_bottom a:hover { text-decoration: none; }
				.footer_bottom a:hover:after { width: 100%; }

/* ***************** The end, thanks for visiting! **************** */
