@import url('https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed|Roboto+Condensed:300|Roboto+Condensed:700');
@import url("font-awesome.min.css");

body {
	font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;
	font-size:13px;
	color:#454545;
	padding:0 0 25px 0;
	line-height:1.5;
	list-style-type:none;
	margin:10px auto 30px auto;
	
} #wrap {
	width:100%;
	background:#fff url('../images/background.png') repeat-x;
	background-size: auto 425px;
	text-align:left;
	margin:auto 0 18px auto;
	padding-bottom:0;
	
/* Begin elements within WRAP, but before CONTENT */
	
} #header {
	max-width:1200px;	
	margin:0 auto;
	min-height:55px;
	padding: 0 50px;
	
} #page-header { /* new - set as not defined in print css */
	position:relative;
	margin: -25px 0 0 0;	
	
} .headertitle::before {
	content:url(../logos/logo.zircoa.header.png);
	padding-right:10px;

} .headertitle {
	margin-left:10px;
	padding-top:60px;
	clear:left;
	color: #ffffff;	
	
} img.header-logo {
	margin: 0 5px -6px 0;	
	clear:both;
	display:none;

} img.header-logo-print {
	display:none;
	
} img.guy {
	max-width:200px;
	height:auto;
	
} img.montage {
	max-width:270px;
	height:auto;
	
} #globe {
	background:url('../../assets.homepage/hp.globe.png') no-repeat; 
	background-position:top center; 
	background-size:1000px auto;		
	
/* End elements within WRAP, but before CONTENT */

/* Begin elements within CONTENT, but before FOOTER (CONTENT includes SIDEBAR elements) */
	
} #content-home {
/*	background:url('../images/background-content.jpg') repeat-x; */
	max-width:871px; 
	min-width:400px;
	padding: 0 40px 30px 25px;
	text-align:left;
	float:right;
	margin-left: 170px;

} #content {
	max-width:1200px;	
	margin:0 auto;
	min-height:500px;
	padding: 0 50px 50px 50px;
	text-align:left;
	clear:left;	
	
} .content-survey-pm {
	width:800px;
	padding: 25px 30px 30px 25px;
	text-align:left;
	border-bottom: solid 1px #EA6F25;
	border-top: solid 1px #FFFFFF;

	min-height:400px;
	float:left;
	
} #content-contact { 
	background: url('../other/contact.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} #content-product { 
	background: url('../other/bkgrnd-product.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} #content-solon { 
	background: url('../other/bkgrnd-solon-plant.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} .content-survey {
	margin-left:0;
	padding: 25px 30px 30px 25px;
	text-align:left;
	border-bottom: solid 1px #EA6F25;
	border-top: solid 1px #FFFFFF;
	min-width:600px;
	max-width:850px	
	
} .content-overview {  
	background: url('../other/group-at-pc.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 15px 30px 30px 25px;
	border-top: solid 1px #FFFFFF;
	z-index:99;
	min-height:400px;
	
} .content-msds {  
	background: url('../other/safety.fem.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 15px 30px 30px 25px;
	border-top: solid 1px #FFFFFF;
	z-index:99;
	min-height:400px;
	
} .content-eng-sol {  
	background: url('../other/engineering.sol-2.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 15px 30px 30px 25px;
	border-top: solid 1px #FFFFFF;
	z-index:99;
	min-height:400px;
	
} #content-about { 
	background: url('../other/about-us-new.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} #content-contact { 
	background: url('../other/contact.jpg') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} #content-shortcut { 
	background: url('../other/search.results.gif') no-repeat right top; 
	margin:-15px -30px 0 -25px;
	padding: 0px 30px 0px 25px;
	border-top: solid 1px #FFFFFF;
	min-height:400px;
	
} .main-links {
	background: rgba(255, 255, 255, 0.4);
	margin:	0 0 6px -0;	
	padding:6px 15px 3px 15px;
	color:#454545;	

} .get-pdf {
	background:url('../icons/pdficon_small.gif') no-repeat top left;
	margin:0 0 10px 20px;
	padding:0 0 15px 23px;
	white-space: nowrap;
	z-index:100;
	
} .get-msds {
	background:url('../icons/pdficon_small.gif') no-repeat top left;
	margin:3px 0 3px 0;
	padding:0 0 3px 23px;
	
} .resources-prdt {
	background:url('../icons/resources.png') no-repeat top left;
	background-position: -2px 0px;
	margin:10px 0 10px 0;
	padding:0 0 5px 23px;
	
} .translate {
	margin: 0 0 20px 20px;

/* BEGIN hide Google banner which would otherwise overlay the top menu */

} .goog-te-banner-frame {
    display:none !important;
    
} body {
	position:static !important; 
	top:0px !important;
	
/* END hide Google banner which would otherwise overlay the top menu */	
    	
} .caption-hp {
	text-align:left;
	line-height:1.5;
	font-style:italic;
	font-size:75%;
	color:#6F6F6F;

} .caption-left {
	position:relative;
	float:left;
	text-align:left;
	margin:0 10px 8px 0;	
	padding:0 15px 0 0;	
	line-height:1.5;
	font-style:italic;
	color:#888888;

} .caption-right {
	position:relative;
	float:right;
	clear:right;
	text-align:right;
	margin:30px 30px 8px 10px;	
	padding:0 0 0 15px;
	line-height:1.5;
	font-style:italic;
	color:#888888;

} img.right { /*works in conjuction with .caption-right */
	float:right;
	margin:0px 0px 0px 15px;
	padding:0px 0px 2px 0px;
	
} img.frcr {
	float:right;
	
} img.fluidimage, img.fluidimage2 { /* new - set to not defined in print css */
	float:right;
	margin-bottom:5px;
	width:200px;
	height:auto;
	clear:left;
	box-shadow: 2px 2px 6px #888888;
	
} img.calc { /* new - set to not defined in print css */
	float:right;
	margin-bottom:5px;
	width:auto;
	height:auto;
	clear:left;
	margin-top:20px;
	box-shadow: 2px 2px 6px #888888;	
	
} img.staticimage { /* new - set to not defined in print css */
	float:right;
	margin-bottom:5px;
	box-shadow: 2px 2px 6px #888888;	
		
} img.staticimage-nf { /* new - set to not defined in print css */
	margin:0 10px 5px 0;
	box-shadow: 2px 2px 6px #888888;	
		
} img.staticimage-sml {
	float:left;
	margin:5px 10px 0 0;
	box-shadow: 2px 2px 6px #888888;	
	
} img.tmark {
	width:90px;
	height:auto;
	
} img.blu-globe {
	width:100px;
	height:auto;	
				
} .hp-subhead {
	font-size:16px; 
	margin:0; 
	padding:0 0 6px 0; 
	font-weight:normal; 
	line-height:120%;
	border-bottom:none;
	color:#FFFFFF;
		
/* Begin SIDEBAR elements (part of CONTENT) */

} .hp-translate {
	margin: 5px 0 15px 3px;

} #sidebar {

/* removed old */

/* begin new *?

/* The side navigation menu */

} .sidenav {
	padding-top:20px;
	font-size:1.2em;
	font: #000000;
	height: 100%; /* 100% Full-height */
	width: 0; /* 0 width - change this with JavaScript */
	position: fixed; /* Stay in place */
	z-index: 1; /* Stay on top */
	top: 0;
	lext: 0;
	background-color: #ffffff; /* white*/
	overflow-x: hidden; /* Disable horizontal scroll */
	padding-top: 60px; /* Place content 60px from the top */
	transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
	box-shadow: 3px 8px 18px #888888;	
	
} #sidebar {
	margin-left:20px;
	font-size:110%;
	z-index:1000;
	
} #sidebar ul.nav {
	list-style-type:none;
	line-height:1.0em;
	margin-top:-20px;
		
	
} #sidebar b, strong, p.small {
	color:#B5411B;
	
} #sidebar p  {
	padding-left: 20px;	
	
/* The navigation menu links */
} .sidenav a {
	list-style-type:none;
	padding: 8px 8px 8px 0;
	text-decoration: none;
	display: block;
	transition: 0.3s;
	cursor:pointer;

} .sidenav a:hover { /* When you mouse over the navigation links, change their color */
	color: #B5411B;

} .sidenav .closebtn { /* Position and style the close button (top right corner) */
	position: absolute;
	top: 20px;
	right: 25px;
	font-size: 36px;
	margin-left: 50px; 
	
} .burger {
	float:right;
	cursor:pointer; 
	color: #0066CC;
	padding:5px 5px 5px 5px !important;
	vertical-align: text-top;
	background-color:#ffffff;	
	
	
} .burger:hover {
	border:1px #ffffff solid;
	color:#0066cc;
	background-color:transparent;
	
} .no-widget {
	margin:10px 0 0 30px;
	
} .no-widget, p.small {
	margin: 0 0;
	padding:0 0;
	
} .searchbox {
	width:170px;
	margin:15px 0 10px 20px;
	padding-bottom:20px;
	
} input.find {
	margin-top:5px;
	font-size:11px;
	
} input.search {
	font-size:10px;

} form {
	margin:0;
	padding:0;
	
} input, select, textarea {
	font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;
	font-size:13px;
	padding:2px 0 2px 2px;
	
} .message {
	width:180px;
	margin:0 0 0 -8px;
	padding:3px 0 2px 0;
	font-size:10px;
	line-height:1.5;
	font-weight:normal;
	
} .notice p {
	padding:10px 10px;
	line-height:1.5em;
	
} .sidenav .notice a {
	padding:0 10px 15px 0;
	
	
} .no-widget p.small {
	line-height:1em;
	padding:0 15px;	
	
/* End SIDEBAR Elements (part of CONTENT) */

/* End all CONTENT elements */
	
/* Begin elements within FOOTER */
	
} #footer {
	max-width:1200px;	
	margin:0 auto;
	padding: 0 50px;

} #footer p {
	text-align:left;
	clear:left;	
	color:#888888;
	border-top: solid 1px #EA6F25;
	
} #footer-full {
	float: left;
	width:800px;
	color:#888888;
	margin:0;
	padding:0px 10px 3px 15px;
	
} #footer a, #footer-full a {
	color:#B5411B;
	text-decoration:none;
	
} #footer a:hover, #footer-full a:hover {
	color:#B5411B;
	text-decoration:underline;
	
/* End elements within FOOTER */	
	
/* Begin common elements */	
	
} p {	
	margin:0 0 0 0;
	padding:6px 0 6px 0;
	
} b {
	color:#727272;
	
} H1 {
	font-size:11px;
	margin:0px; 
	padding:4px 0px 6px 0px; 
	font-weight:normal; 
	line-height:150%;
	
} H1.special { 	/* extra 15px top padding to correct sandbag div bottoms in IE6 */
	font-size:11px;
	margin:0px; 
	padding:19px 0px 6px 0px; 
	font-weight:normal; 
	line-height:150%;
	
} h1.contact {
	margin:0 0 8px 0;
	padding:3px 0 5px 0;
	line-height:1.7;
	
} h1.details {
	padding:0 0 2px 0;
	text-transform:uppercase;	

} H2 {
	font-size:15px; 
	margin:0px; 
	padding:8px 0px 6px 0px; 
	font-weight:normal; 
	line-height:130%;
	border-bottom:none;
	
} h2.head {
	font-size:14px;
	line-height:1.2;
	padding:12px 0px 6px 0px;
	font-weight:700;
	text-transform:uppercase;
	color:#777575;
	border-bottom:1px solid #e0e0e0;
	
} h2.head-cl {
	font-size:14px;
	line-height:1.2;
	padding:12px 0px 6px 0px;	
	font-weight:700;
	text-transform:uppercase;
	color:#777575;
	border-bottom:1px solid #e0e0e0;
	clear:left;

} h2.specs {
	margin:0 0 0 0;
	padding:20px 0 0 0;
	font-weight:normal;
	color:#B5411B;

} H3 {
	font-size:17px;
	margin:0px; 
	padding:5px 0px 7px 0px; 
	font-weight:normal; 
	line-height:130%;
	
} H4 {
	font-size:22px;
	margin:0px; 
	padding:5px 0px 7px 0px;
	font-weight:normal;
	line-height:130%;	

} H5 {
	font-size:25px;
	margin:0px; 
	padding:5px 0px 7px 0px;
	font-weight:normal;
	line-height:130%;	

} H6 {
	font-size:28px;
	margin:0px; 
	padding:5px 0px 7px 0px;
	font-weight:normal;
	line-height:115%;

} .bigger {
	font-size: 130%;	

} .smallish {
	font-size: 90%;

} .small {
	font-size: 85%;

} .smaller {
	font-size: 80%;

	
} .small-screen-only {
	font-size: 85%;	
	
} .stealth {
	display:none;	

} .print-break {
	display:none;
	
} .cl {
	clear:left;	
	
} .cr {
	clear:right;
	
} .screen-only {
	/*not defined*/

} .print-only {
	display:none;
	
} li {
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	
} li.list {
	margin:0px 0px 0px 0px;
	padding:3px 0px 3px 0px;
	border-bottom:1px solid #C6C6C6;
	
} li.plain {
	list-style-type:none;

} li.ajax {
	list-style-type:disc;
	line-height:1.1;
	margin-left:20px;
	padding:0 0 4px 0px;
	
} li.apps {
	list-style-type:disc;
	line-height:1.1;
	margin-left:20px;
	padding:0 0 5px 0px;
	color:#B5411B;

} ul, ol {
	margin-top:5px;
	margin-bottom:5px;
	
} ul.ajax {
	margin:0 0 0 0;
	padding:0 0 0 0;
	
} table {
	padding: 0 0 0 0;
	margin: 10px 0 0 0;
	border-width: 1px;
	border-color: #C6A87D;
	border-style: solid;
	
} table.plain {
	padding: 0 0 0 0;
	margin: 13px 0 10px 0;
	border-width: 0;
	
} tr, td, th {
	font-size:13px;
	line-height:1.3;
	
} th {
	text-align:center;	
	
} td.red, th.red {
	font-size:13px;
	color:#454545;
	line-height:1.3;
	border-bottom:1px solid #B5411B;
	
} table.msd, td.red  {
	font-family:'roboto condensed';	
	
} table.msd, th.red {
	font-family:'roboto condensed';
	font-weight:700;
	
} table.msd,input , select, textarea {
	font-family:'roboto condensed';

} table.cru-size, td  {
	font-family:'roboto condensed';
	font-weight:300;
	
} table.cru-size, th {
	font-family:'roboto condensed';
	font-weight:700;
	
} td.contact-head {
	background:#CA3327;
	text-align:center;
	vertical-align:middle;
	font-size:11px;
	font-weight:bold;
	color:#FFFFFF;
	border-right:2px solid #FFFFFF;
	height:15px;
	
} td.contact {
	text-align:center;
	vertical-align:middle;
	font-size:11px;
	font-weight:normal;
	color:#000000;
	border-bottom:1px solid #CA3327;
	height:20px;
	
} tr.print-break {
	display:none;	
	
} table.prdt-info {
	font-family:'roboto condensed';
	border: 1px solid #454545;
	
} table.prdt-info td, th {
	padding:3px;
	
} table.prdt-info b {
	font-family:'roboto condensed';
	font-weight:700;
	
} sup {
	font-size: 70%; 
	vertical-align:super;

} sub {
	font-size: 70%; 
	vertical-align:sub;
	
} .hang { 
	text-indent: -5em; margin-left: 5em;

} .hang-more {
	text-indent: -3.2em; margin-left: 6em;
	
} .hang-max {
	text-indent: -3.7em; margin-left: 9.5em;	

} .red {
	color:#B5411B;
	
} .white {
	color:#FFFFFF;
	
} .site-map {
	float:right;
	margin-top:-16px;

} a:link, a:active, a:visited {
	font-weight:normal; 
	text-decoration:underline; 
	color:#0066CC

} a:hover {
	font-weight:normal; 
	text-decoration:underline; 
	color:#0066CC;

/*	
	defines styles for overflow scrolls
	used only due to limitations in handheld device browsers
	Not needed for majority of mature desktop browsers
*/


} #scroll_1, #scroll_2 {
	position: relative; /* IE overflow fix, must be relative or absolute */
	padding:10px;
	width:300px;
	height:75px; 
	overflow:scroll; 
	border:1px solid #e0e0e0
	
} #scroll_3 {
	position: relative; /* IE overflow fix, must be relative or absolute */
	padding:5px;
	height:100px; 
	overflow:scroll; 
	border:1px solid #e0e0e0
}	

/* Media Queries */

} @media (max-width: 900px) {

} @media (min-width: 900px) {
	
	#sidebar a, ul.nav, li.nav, .home, .products, .applications, .engineering, .about, .contact-us, .msds {
		display:inline;
		
	} i.burger, li.nav-plain, .closebtn {
	 	display: none;
	 	
	 } #sidebar ul.nav {
		display:block;
		padding: 0 50px 0 0;
		text-align:center;
				
	} #sidebar { 
		overflow:hidden;
		position:fixed; 
		top:0; 
		z-index:1000; 
		height:30px; 
		width: 100%;
		margin: 0 auto;
		padding: 40px 50px 10px 50px;
		text-align: center;
		font-size:100%;
		
	} .sidenav {
		background-color:#f9f9f9;
		transition: 0.0s;
		box-shadow: 0 8px 30px #6c6c6c;
		
	} .no-widget p.small {
		margin:0 auto;		
		display:inline;
		text-align:center;
		
	} .notice {
		margin:-30px 0 0 0px;
		float:left;
		text-align:left;
		width:200px;
		padding:0 0;
	
	} #sidebar p {
		padding:0 0;
		
	} .no-widget form {
		float:right;
		text-align:right;
		margin:-40px 100px 0 0;
		width:200px;
		
	} #wrap {
		background: url('../images/background.png') repeat-x;
		background-position: 0 20px;
		background-size: auto auto;

	} #header {
		margin-top:60px;
		
	} img.guy {
		max-width:261px;
		height:auto;
		
	} img.montage {
		max-width:400px;
		height:auto;
		
	} img.tmark {
		width:140px;
		height:auto;
		
	} img.blu-globe {
		width:177px;
		height:auto;

	} img.fluidimage, img.fluidimage2, img.calc { /* new - set to not defined in print css */
		float:right;
		margin-bottom:5px;
		width:auto;
		height:auto;
		clear:left;
		box-shadow: 2px 2px 6px #888888;
		
	} img.calc { /* new - set to not defined in print css */
		float:right;
		margin-bottom:5px;
		width:200px;
		height:255px;
		clear:left;
		margin-top:20px;
		box-shadow: 2px 2px 6px #888888;
		
		
	} table.msd, td.red  {
		font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;	
	
	} table.msd, th.red {
		font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;
		font-weight:;
	
	} table.msd,input , select, textarea {
		font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;
		
	} table.cru-size, td, th  {
		font-family:Verdana, Tahoma, Arial, Helvetica, Sans-Serif;
	

	}
}