@charset "UTF-8";

/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/* end of Eric Meyer's reset file */




body { font: 100% Verdana, Arial, Helvetica, sans-serif; background: #A4A6A8; margin: 0; padding: 0; text-align: center; color: #2b2c2c; line-height: 1.5; }

/* ----- site-wide layout divs ----- */
#container { width: 1000px; background: #FFFFFF; margin: 0 auto; margin-top: 8px; border: none; text-align: left; background-color: #fff; overflow: auto;
  /* offset left, top, thickness, color with alpha */
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  /* IE */
  /*filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=0, Color='gray');*/
  /* slightly different syntax for IE8 */
  /*-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=0, Color='gray')";*/
 }
#header { background: #dcddde url(/assets/images/masthead/background-tiled.png) repeat; padding: 16px 43px 0 45px; overflow: auto; }
body.home #header { background: #fff; }
	#search { float: right; }
	#navprimary { float: right; text-transform: uppercase; text-decoration: none; font-size: 80%; } /* see ul#navlist below for list styles */

#navsecondary { width: 100%; text-align: center; text-transform: uppercase; font-size: 75%; border-top: 5px solid white; background: #4190cd url(/assets/images/masthead/subnav_bg.png) no-repeat; min-height: 36px; } /* see ul#navlist2 below for list styles */
#navtertiary { width: 100%; text-align: center; text-transform: uppercase; font-size: 70%; border-top: 2px solid white; background: #5b5b5b; margin-top: -10px; padding-bottom: 8px; } /* see ul#navlist3 below for list styles */

#mainContent { padding: 30px 53px 44px 53px; background: #FFFFFF; margin: -10px 0 0 0; overflow: auto; }
#footer { width: 1000px; margin: 0 auto; padding: 0 20px; text-align: center; }



/* ----- custom page layout divs ----- */
	
	.sidebar { padding-top: 3em; font-size: 85%; font-style: italic; } /* ----- used in a couple of layouts ----- */
		.sidebar em { font-style: normal; }

	/* ----- home page (see also /home/page.css and /home/slider.css and IE-specific files in /home) ----- */
		body.home div.columnleft { float: left; width: 273px; height: 332px; margin: 0 5px 0 0; background: #33a6d7 url(/assets/images/home/left_bg.jpg) no-repeat; }
		body.home div.columnright { float: right; width: 722px; height: 332px; margin: 0; }

		body.home #mainContent { padding: 30px 53px 32px 53px; background: #dcddde url(/assets/images/masthead/background-tiled.png) repeat; margin: 5px 0 0 0; overflow: hidden; }
		body.home #mainContent #groupleft { float: left; width: 462px; }
			body.home #mainContent #groupleft #column_one { float: left; width: 50%; } /*projects*/
			body.home #mainContent #groupleft #column_two { float: right; width: 50%; } /*products*/
		body.home #mainContent #groupright { float: right; width: 423px; }
			body.home #mainContent #groupright #column_three { float: left; width: 55%; } /*news*/
				body.home #mainContent #groupright #column_three #headlines { background-color: #f7f8f8; width: 90%; height: 155px; }
			body.home #mainContent #groupright #column_four { float: right; width: 45%; } /*newsletter form*/
		body.home div.caption { width: 215px; background-color: #515151; }
			body.home div.caption p { color: white; font-size: 70%; font-weight: bold; line-height: 1.4; padding: 0.5em; }

	/* ----- T-shaped layout ----- */
		body.tshaped div.columnleft { float: left; width: 48%; margin: 1em 26px 0 0; }
		body.tshaped div.columnright { float: right; width: 48%; margin: 1em 0 0 0; }

	/* ----- T-shaped layout with sidebar (3-column Dreamweaver Template) ----- */
		body.tshapedwsidebar div.sidebar { float: right; width: 200px; margin: 0 0 0 44px/*1.5em*/;  /*border: 1px solid #000;*/ }
		body.tshapedwsidebar div.columnleft { float: left; width: 311px; margin: 1em 0 0 0; padding: 0 24px 0 0;  /*border: 1px solid #000;*/ }
		body.tshapedwsidebar div.columnright { float: right; width: 311px; margin: 1em 0 0 0; padding: 0 0/*24px*/ 0 0; /*border: 1px solid #000;*/ }
		
	/* ----- sidebar option for 1-column layout ----- */
		html body.onecolumn div#container div#mainContent div.optionalside { float: right; width: /*277px*/200px; margin: 0 0 0 1em; font-size: 85%; font-style: italic; }
		body.onecolumn div.nonsidebar {  }/* be sure to create a container for the main content (unless you're okay with it wrapping under the sidebar) */
		
	/* ----- onecolumnnews -- news column doesn't wrap under sidebar ----- */
		html body.onecolumnnews div#mainContent {  }
		html body.onecolumnnews div#container div#mainContent div#narrowcontent { float: left; width: 645px; }		
		html body.onecolumnnews div#container div#mainContent div.optionalside { float: right; width: /*277px*/200px; margin: 50px 0 0 1em; font-size: 85%; font-style: italic; }
		html body.onecolumnnews div.nonsidebar {  }/* be sure to create a container for the main content (unless you're okay with it wrapping under the sidebar) */		
		
/* ----- navigation ----- */
	/* ----- primary (see also #navprimary above) ----- */
	ul#navlist { margin: 45px 0 0 0; white-space: nowrap; padding-bottom: 10px;}
	ul#navlist li { display: inline; list-style-type: none; border-right: 2px solid #4190cd; }
		/*ul#navlist li:after { content: "|"; color: #4190cd; }*/
		/*ul#navlist li.last:after { content: ""; }*/
		ul#navlist li.last { border-right: none; padding-left: 0; }

	ul#navlist li a { padding: 10px 10px 17px /* too much here creates an overflow issue */ 10px; color: #515151; text-decoration: none; }
		ul#navlist li a:hover { background-color: #eee; }
	ul#navlist li a:link { color: #515151; /*background-color: #036;*/ text-decoration: none; }
	ul#navlist li a:hover { color: #515151; /*background-color: #369;*/ text-decoration: none; }
	body.home ul#navlist li a:hover { color: #2b2c2c; background-color: #dededf; text-decoration: none; }

	/* ----- secondary ----- */
	ul#navlist2 { margin: 0; white-space: nowrap; padding: 5px; }
	ul#navlist2 li { display: inline; list-style-type: none; }
	ul#navlist2 a { padding: 6px 10px 5px 10px; margin-bottom: /*-5*/0px; color: #fff; text-decoration: none; }
		ul#navlist2 a:hover { background-color: #007AAA; color: white/*#3990CC*/; text-decoration: none; }

	/* ----- tertiary ----- */
	ul#navlist3 { margin: 0; white-space: nowrap; padding: 5px; }
	ul#navlist3 li { display: inline; list-style-type: none; }
	ul#navlist3 a { padding: 6px 10px 5px 10px; margin-bottom: -5px; color: #fff/*515151*/; text-decoration: none; }
		ul#navlist3 a:hover { background-color: #007AAA/*dfdfdf*/; color: white; text-decoration: none; }

/* ----- headings ----- */
	h1, h2, h3, h4, h5, h6, th { font-family: "Tahoma","Trebuchet MS","Trebuchet",Verdana,sans-serif; margin-bottom: 0; margin-top: 0.5em; text-align: left; color: #4190cd; font-weight: bold; }
	h1 { font-size: 135%; margin-bottom: .3em; }
		/*h1 + h2 { margin-top: 0.2em; }*/
		#header h1 img { float: left; margin-bottom: 16px; }
		body.newsdetail h1 { width: 645px; }
	h2 { color: #5a5b5e; font-size: 100%; line-height: 1.3; margin-bottom: 0.3em; font-weight: bold; }
		h2 + h3 { margin-top: 0.2em; }
	h3 { font-size: 90%; line-height: 1.3; }
	.sidebar h3 { margin: 1em 0 0.3em 0; line-height: 1.4; }
	body.home h3 { margin-top: 0; margin-bottom: 0.3em; line-height: 1.2; }
	h4 { color: #2b2c2c; font-size: 75%; font-weight: bold; margin: .5em 0 .2em 0; }
	h5 {  }
	h6 {  }

/* ----- paragraphs ----- */
	p { font-size: 75%; margin: 0 0 0.75em 0; }
	#footer p { margin: 0; padding: 20px 0; font-size: 70%; }
	body.home div.columnleft p { margin: 26px 1em 0 52px; color: white; font-weight: bold; font-size: 75%; line-height: 1.7; }
	body.home form p { font-size: 70%; }

/* ----- lists ----- */
	ul, ol { margin: 0.5em 0 0.75em 2.5em; }
	ul { list-style-type: disc; }
	ol { list-style-type: decimal; }
	li { margin: 0 0 0.3em 0; font-size: 100%; }
	/*dl { width: 100%; margin: 1em 0 2em 0; display: inline; }*/
	/*dt { width: 15%; float: left; margin: 0.5em 0 0 0; padding: 0.5em; border-top: 1px solid #999; font-weight: bold; background-color: #ccc; }*/
	/*dd { width: 80%; float: left; margin: 0.5em 0 0 0; padding: 0.5em; border-top: 1px solid #999; background-color: #eee; }*/

	.newslisting dl { float: left; width: 645px; margin: 0; padding: 0; display: inline; /* fixes IE/Win double-margin bug */ }
	.newslisting dt { float: right; width: 420px; margin: 0; padding: 0; font-weight: bold; font-size: 90%; line-height: 1.3; }
	.newslisting dd { margin: 0 0 0 4px; padding: 0; color: #666; font-size: 80%; }
	.newslisting dd.img img { float: left; margin: 0 10px 0 0; padding: 6px 4px 4px 4px; border: none; }

	/* ----- see Search styles ----- */	
	
	#mainContent li { font-size: 70%; margin-bottom: 0.5em; }

	.sidebar ul, .sidebar ol { margin: .5em 0 1em 2.5em; }
	.sidebar li { font-size: 85%; }

/* ----- links ----- */
	#mainContent a:link { text-decoration: underline; color: #317CC5; }
	#mainContent a:visited { text-decoration: underline; color: #25639F; }
	#mainContent a:hover { text-decoration: underline; color: #317CC5; background-color: #dededf; }
	#mainContent a:active { text-decoration: underline; /*color: #;*/ }
	
	a:link img.logo, a:visited img.logo, a:hover img.logo, a:active img.logo { border: none!important; background-color: #fff!important; text-decoration: none!important; }
	#mainContent a img, #mainContent a:link img, #mainContent a:visited img, #mainContent a:hover img, #mainContent a:active img { border: none!important; background-color: #fff!important; text-decoration: none!important; }

	#footer a:link { text-decoration: underline; color: #000; }
	#footer a:visited { text-decoration: underline; color: #000; }
	#footer a:hover { text-decoration: underline; color: #000; background-color: #ccc; }
	#footer a:active { text-decoration: underline; color: #000; }
	
	/*a.productbox { text-decoration: none; white-space: nowrap; font-size: 90%; font-weight: normal; color: #97999c!important; border: 1px solid #97999c; padding: .15em .3em; margin: 0 -.1em 0 0; line-height: 1.9; }
	a.productbox span.bullet { color: #a3a3a3!important; }
	a:hover.productbox span.bullet, a:hover.productbox sup { color: #fff!important; }
	a.productbox:link { color: #97999c; text-decoration: none!important; }
	a.productbox:visited  { color: #97999c; text-decoration: none!important; } 
	a.productbox:hover { color: #fff!important; text-decoration: none!important; background: #237EC3!important; } 
	a.productbox:active { color: #97999c; text-decoration: none!important; }*/
			
/* ----- images ----- */
	img { margin: 0; }
	img.noborder { border: none; }
	img.border { border: 1px solid #000; }
	img.right { float: right; margin: 0.4em 0 0.4em 0.4em; }
	img.left { float: left; margin: 0.4em 1em 0.4em 0; }
	img.center,img.centre { display: block; margin: .4em auto; }
	img.logo { margin: 2em 0 1em 0; border: none; }
	p img { margin-top: .5em; }

/* ----- see custom classes for bordered image divs w captions ----- */

/* ----- tables ----- */
	table { border: 1px solid #555; margin: 1em 0 1em 0; }
	th { border: 1px solid #333; font-weight: bold; text-align: center; padding: 0.3em; background-color: #999; }
	tr { border: 1px solid #888; padding: 0.3em; }
	td { border: 1px solid #888; padding: 0.3em; }
	td.left { text-align: left; }
	td.right { text-align: right; }
	
	/*<table><tbody><tr><td>xxx</td></tr></tbody></table>*/
	/* tbody prevents styling of th backgrounds */
	tbody tr:nth-child(odd) { background-color: #ccc; }

/* ----- miscellaneous HTML tags ----- */
	em,i { font-style: italic; }
	em em { font-style: normal!important; }
	strong,b { font-weight: bold; }
	hr { padding: 0 0.3em 0 0.3em; margin: 0.3em 0 0 0.3em; }
	blockquote,q { font-style: italic; border-left: 3px solid #999; margin: 1.5em 0 0 3em; padding: 0 1.5em 0 1em; font-size: 90%; line-height: 1.8; }
		blockquote.pull { border-left: none; float: none; }
		blockquote.pull p { font-size: 125%; color: #317CC5; }
	address { padding: 0; font-style: normal; line-height: 1.6; }
	acronym, abbr { border-bottom: 1px dotted #BBBDBD; /*text-decoration: dotted;*/ cursor: help; }
	code, kbd { font-family: "Monaco", "Lucida Console", Courier, "Courier New", monospace; font-size: 95%; background-color: #ccc; color: #000; margin: .5em 2em .5em 2em; }
	pre { font-family: Courier, Monaco, "American Typewriter", monospace; color: #eee; margin: 2em 0 2.5em 0; padding: 5px 0 5px 10px; border-width: 1px 0 1px 0; border-color: #6b6b6b; border-style: dashed; }
	sup { vertical-align: baseline; font-size: 0.6em; position: relative; top: -0.4em; }
	sub { vertical-align: baseline; font-size: 0.6em; position: relative; top: 0.3em; }

/* ----- forms ----- */
	input { background-color: #ECECF2; color: #3990CC; }
	body.home form#profiles, form#profiles { margin-bottom: 1em; }
	body.home input { background-color: #fff; }
	textarea { overflow: auto; }

/* ----- custom classes ----- */
	.feature {  }
	.featureright { width: 250px; float: right; border: 1px solid #000; padding: .4em; margin: .4em 0 .4em .4em; background: #ccc; }
	.featureleft {  }
	.pullquote { font-size: 200%; width: 40%; border: none; text-align: left; float: right; margin: 1em 0 1em .5em; padding: 0.3em 0.5em; background: #ddd; }
	/*.caption { width: 215px; color: white; background-color: #515151; font-size: 75%; font-weight: bold; line-height: 1.4; padding: 0.3em 0 0.3em 0.3em; }*/
	.attribution { text-align: right; margin: 0; padding: 0 20px 10px 200px; font-style: italic; }
	.postalcode { margin: 0 0 0 0.5em; text-transform: uppercase; white-space: nowrap; }
	/* span class to keep postal codes uppercase, to prevent wrapping, and to include extra white-space before them, per Canada Post's guidelines at https://canadapost-postescanada.ca/business/tools/pg/manual/PGaddress-e.asp#1399210 */
	.tel, .gps, .nobr { white-space: nowrap; }
	/* span class to keep phone numbers & GPS coordinates from wrapping  ----- MSIE 8 SERIOUSLY HATES THIS CLASS; IT MESSES UP LAYOUT BADLY IN SOME CASES -----*/
	/*.transparent_class { filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; }*/
	.required { color: red; font-weight: bold; } /* for form fields, mainly; there's also a copy of this rule in the contact form */
	.dlmeta { white-space: nowrap; color: #999; font-size: 85%; }

	/* ----- image galleries ------ */
	div.project_gallery { width: 645px; display: inline-block!important; border: none; margin-bottom: 2em; /*border: 1px solid black;*/ }
	div.project_gallery_item { border: none; width: 208px; margin: 20px 0px 0 0; display: inline-block!important; overflow: auto; vertical-align: top; float: left; }
		div.project_gallery img { /*float: left;*/ margin: 0 8px 0 0; width: 200px; border: none; }

	/*div.project_gallery { width: 645px; display: inline-block; border: none; margin-bottom: 2em; }
	div.project_gallery_item { border: none; width: 208px; margin: 20px 0px 0 0; display: inline-block; overflow: auto; vertical-align: top; }
		div.project_gallery img { float: left; margin: 0 5px 5px 0; width: 133px; border: none; }*/

	img.detail_item { margin: 10px 0 20px 0; padding: 0 32px 0 0;}
	a.nohover:hover { text-decoration: none!important; background: transparent !important; }
	
	.brochure { overflow: auto; }  /* for left-aligned images with descriptions; see Downloads page */
	.brochure img { float: left; margin: 3px 8px 0 0; border: none; }
	.brochure .dlmeta { font-weight: normal;  }
	.brochure h3 { margin-bottom: .5em; font-size: 90%; }

	/* ----- News styles ----- */
	.newslisting { /*float: left;*/ width: 645px; padding: 0; overflow: auto; /*border: 2px solid #ccc;*/ }
	/* ----- see Lists, too ----- */
	.newsdate { white-space: nowrap; margin-left: 0; color: gray; font-size: 70%; }


	/* ----- Search styles ----- */
	dl.searchresults { width: 645px; float: left; margin: 1em 0 2em 0; display: inline; }
	dl.searchresults dt { width: 15%; float: left; margin: 0.5em 0 0 0; padding: 0.5em; border-top: 1px solid #999; background-color: white; font-weight: normal; font-size: 80%; }
	dl.searchresults dd { width: 80%; float: right; margin: 0.5em 0 0 0; padding: 0.5em; border-top: 1px solid #999; background-color: #eee; font-size: 80%; }

	
	.searchmeta { color: #666; white-space: nowrap; font-size: 80%; }
	
/* ----- AIL/ACP-specific product-name classes ------ */
	/* ----- these are duplicated in /home/page.css for the home page product slider ----- */
	span.productname { white-space: nowrap; }
	span.productname span.bullet { font-size: 100%;  }
		a span.productname span.bullet, a:visited span.productname span.bullet { color: #317CC5; }
		h1 span.productname span.bullet { font-size: 75%; position: relative; top: -.1em; color: #4190cd; }
		h2 span.productname span.bullet { font-size: 75%; position: relative; top: -.1em; }
		h3 span.productname span.bullet {  }
		h4 span.productname span.bullet {  }
	span.productname sup { font-size: 60%; top: -.5em; }
		h1 span.productname sup { /*color: #75B3FF;*/ font-size: 50%; top: -.7em; }
	span.productname span.altname, span.altname { visibility: hidden; display: none; width: 0; }
	p span.productname span.bullet, li span.productname span.bullet { color: #636363; font-size: 85%; margin-left: .1em; margin-right: .1em; }
	p span.productname sup, li span.productname sup { color: #7e7e7e; font-size: 65%; }
	a span.productname sup, a span.productname span.bullet { color: #2995E7; }