/* for optimal human readability a tab = 4 spaces */
body {
	margin: 0 0;
	padding: 0;
	background: #ffffff url('/images/bg_texture.png') 0 0 repeat;
	
	font-family: 'Whitney A', Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1em;
}

#page_wrapper {
	position: relative;
	margin: 0 auto;
	max-width: 1280px;
	width: 100%;
}

#footer {
	clear: both;
	max-width: 1280px;
	width: 100%;
	padding: 2.4% 0;
	font-size: 13px;
	line-height: 1.35em;
	color: #666666;
	background-color: #efeeed;
}
	#footer .legal {
		margin: 0 3%;
	}
		#footer .patents {
			font-size: 10px;
		}
	#footer .links {
		float: right;
		margin: 0 3%;
		line-height: 2.7em;
	}
		#footer .links a {
			text-decoration: none;
			color: #666666;
		}
		#footer .links a:hover {
			text-decoration: underline;
		}



#masthead {
	position: relative;
	line-height: 0;
}
	#masthead .logo {
		position: absolute;
		top: 7.5%;
		left: 7.75%;
		width: 14.8%
	}
	#masthead h1 {
		margin: 0;
	}
	#masthead h1 img {
		width: 100%;
		line-height: 1em;
	}

#interior_masthead {
	clear: both;
	padding: 1% 0;
	/*max-height: 422px;*/
	max-width: 1280px;
	text-align: center;
}
	#interior_masthead .gfx_masthead {
		width: 80%;
		margin-top: 49px;
	}
	#interior_masthead.with_callout .gfx_masthead {
		width: 60%;
	}


.node.callout {
	position: relative;
	float: right;
	width: 33.3%;
	height: 0;
	padding-bottom: 13.7%;
}	
	#interior_masthead .node.callout {
		margin: 7.5% 0 0;
	}
	#interior_tiles .node.callout,
	#interior_tiles .node.callout:hover {
		background: #f7cf3b none;
	}


	.node.callout h2 {
		margin: 0;
		padding: 0 0 4%;
		font-family: 'Tungsten A', Helvetica, Arial, sans-serif;
		font-size: 87px;
		line-height: 1em;
		color: #dbd9d6;
	}
	#interior_tiles .node.callout h2 {
		padding: 29% 0 0;
		font-size: 130px;
		color: #ffffff;
		background-color: transparent;
	}
	#interior_tiles .node.callout .content {
		height: auto;
		text-align: right;
	}
	.node.callout .download {
		padding: 0.5em 2.4em 0.5em 1.3em;
		font-size: 18px;
		line-height: 1em;
		font-weight: 600;
		text-decoration: none;
		color: #a11d2a;
		background: #f7cf3b url('/images/arrow-down-red.png') 89% center no-repeat;
	}
	#interior_masthead .node.callout .download {
		margin: 0 6% 0 18%;
	}
	#interior_tiles .node.callout .download {
		margin: 0 6% 0 0;
		line-height: 2.4em;
		background-color: #ffffff;
	}



#global_nav {
	float: left;
	top: 0;
	width: 100%;
	max-width: 1280px;
	height: 49px;
	padding: 1px 0 0;
	font-family: 'Tungsten A', Helvetica, Arial, sans-serif;
	font-weight: 500;
	font-size: 24px;
	line-height: 1.9em;
	background-color: #018eaa;
	z-index: 1000;
}
	.interior_page #global_nav {
		position: fixed;
	}
	#global_nav .sitemap {
		display: none;
	}
	#global_nav ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
		#global_nav ul > li {
			display: inline-block;
			position: relative;
			margin: 0 6.25% 0 0;
			padding: 0 0 2px;
			vertical-align: middle;
		}
		#global_nav ul > li > a {
			width: 100%;
			padding: 0.45em 15% 0.4em;
			text-decoration: none;
			white-space: nowrap;
			color: #ffffff;
		}
			
			#global_nav li:hover {
				background: transparent url('/images/global_nav-hover-nib.png') 66% bottom no-repeat;
			}
				#global_nav li:hover > ul > li {
					background: transparent none;
				}
			#global_nav li:hover > a, 
			#global_nav li > a.active {
				color: #f7cf3b;
			}
			#global_nav li:hover ul {
				height: 100%;
				border-top-width: 2px;
				z-index: 1001;
			}
				#global_nav ul > li > ul {
					position: absolute;
					margin: 2px 0 0;
					padding: 0 0.5em;
					height: 0%;
					line-height: 1.75em;
					background-color: #b9e3eb;
					border-top: 0px solid #ffffff;
					white-space: nowrap;
					transition: height 0.5s, border-top-width 0.25s;
					overflow: hidden;
					z-index: 1000;
				}
				#global_nav ul > li.about > ul {
					right: -1em;
				}
				#global_nav ul > li > ul > li {
					display: inline-block;
					margin: 0;
				}
				#global_nav ul > li > ul > li > a {
					padding: 0.45em 0.5em 0.4em;
					font-weight: normal;
					text-decoration: none;
					color: #018eaa;
				}
				#global_nav ul > li > ul > li > a:hover {
					text-decoration: underline;
					color: #018eaa;
				}
	#global_nav .home,
	#global_nav .login,
	#global_nav .email,
	#global_nav .search,
	#global_nav .news,
	#global_nav .blog {
		float: right;
		margin: 0;
		padding: 0 0 3px;
	}
	#global_nav .blog {
		margin-left: -6.25%;
	}
	#global_nav .home {
		float: left;
		padding: 0;
		margin: -1px 2% 0 0;
	}
	#global_nav .login {
		padding: 0;
		margin: -1px 0 0;
	}
		#global_nav .home:hover,
		#global_nav .login:hover,
		#global_nav .email:hover,
		#global_nav .search:hover,
		#global_nav .news:hover,
		#global_nav .blog:hover {
			background-position: 50% bottom;
		}
		#global_nav .home,
		#global_nav .home:hover,
		#global_nav .login, 
		#global_nav .login:hover {
			background-color: #00a9c0;
		}
			#global_nav .home a, 
			#global_nav .login a, 
			#global_nav .email a,
			#global_nav .search a,
			#global_nav .news a,
			#global_nav .blog a {
				display: inline-block;
				margin: 0 6px;
				padding: 0;
				width: 38px;
				height: 36px;
				text-indent: -10000%;
				vertical-align: middle;
				background-repeat: no-repeat;
				background-position: center center;
			}
			#global_nav .home a {
				margin: 0;
				width: 50px;
				height: 50px;
			}
			#global_nav .login a {
				margin: 0;
				width: 90px;
				height: 50px;
			}
			#global_nav .home a {					background-image: url('/images/arrow-up-blue.png');}
			.interior_page #global_nav .home a {	background-image: url('/images/arrow-left-blue.png');}
			#global_nav .login a {					background-image: url('/images/nav-login.png');}
			#global_nav .email a {					background-image: url('/images/nav-email.png');}
			#global_nav .search a {					background-image: url('/images/nav-search.png');}
			#global_nav .news a {					background-image: url('/images/nav-news.png');}
			#global_nav .blog a {					background-image: url('/images/nav-blog.png');}





#homepage_tiles {
	clear: both;
}
	#homepage_tiles .node {
		clear: both;
		position: relative;
		width: 100%;
		padding: 5.5% 0;
		background-size: cover;
	}
		#homepage_tiles .node .gfx_headline {
			display: inline-block;
			margin: 0 7%;
			width: 55%;
			vertical-align: middle;
		}
		#homepage_tiles .node .content {
			display: inline-block;
			margin: 0;
			width: 23%;
			vertical-align: middle;
		}
		#homepage_tiles .node h2 {
			display: none;
			margin: 0 2%;
			width: 34%;
			font-family: 'Tungsten A', Helvetica, Arial, sans-serif;
			font-size: 18px;
			font-weight: bold;
			letter-spacing: 0.025em;
			line-height: 1em;
			text-align: center;
			vertical-align: middle;
		}
		#homepage_tiles .node .content p {
			margin: 0;
			font-size: 18px;
			line-height: 1.5em;
		}
		#homepage_tiles .node a.more {
			position: absolute;
			right: 0;
			top: 0;
			height: 100%;
			width: 4.7%;
			text-indent: -1000%;
			background: transparent url('/images/arrow-right-blue_on_trans_white.png') center center no-repeat;
			transition: opacity 1s;
			opacity: 0;
			overflow: hidden;
		}
			#homepage_tiles .node a.more span {
				display: none;
			}
		#homepage_tiles .node:hover a.more {
			opacity: 1;
		}





#interior_tiles {
	clear: both;
}
	#interior_tiles .node {
		position: relative;
		float: left;
		width: 33.3%;
		height: 0;
		padding-bottom: 33.3%;
		color: #ffffff;
		background-color: #ac202d;
		border-top: 4px solid #ffffff;
	}
	#interior_tiles .node:hover {
		background: #890b10 url('/images/interior_node-rollover_bg.png') center center;
	}
		.interior_page h1 {
			display: none;
		}
		#interior_tiles .node h2 {
			margin: 0 13%;
			padding: 0.7em 0;
			font-family: 'Tungsten A', Helvetica, Arial, sans-serif;
			font-weight: 600;
			font-size: 38px;
			line-height: 1em;
			color: #018eaa;
			text-align: center;
			background-color: #b8e3ea;
		}
		#interior_tiles .node .subhead {
			display: table;
			width: 74%;
			margin: 0 13%;
		}
		#interior_tiles .node h3 {
			display: table-cell;
			height: 4.25em;
			margin: 0 13%;
			font-size: 24px;
			line-height: 1.23em;
			text-align: center;
			vertical-align: middle;
			border-bottom: 1px solid #cc5f5c;
		}
		#interior_tiles .node .content {
			margin: 0 13%;
			height: 10.6em;
			font-size: 18px;
			line-height: 1.25em;
			text-align: left;
			overflow: hidden;
		}
		#interior_tiles .node .content p {
			margin-top: 0.35em;
		}
		#interior_tiles .node .more {
			position: absolute;
			bottom: 0;
			right: 0;
			padding: 0.65em 2.5em 0.65em 1.35em;
			font-size: 18px;
			line-height: 1em;
			font-weight: 600;
			text-decoration: none;
			color: #ac202d;
			background: #cb5d5c url('/images/arrow-right-red.png') 87% center no-repeat;
		}




	/* debug temp *xxx/
	#interior_tiles .node:nth-child(even) {
		opacity: 0.5;
	}
	*/

	






/*

designs target the following screen widths:
	1280	desktop
	929		tablet horizontal
	547		tablet vertical
	380		mobile

designed homepage node heights:
	360
	260
	154
	107

*/

@media (max-width: 546px) {/* mobile */
	
	#footer {								font-size: 10px;}
	#footer .patents {						font-size: 8px;}
	
	
	#global_nav {
		position: fixed;
		top: 0;
		left: 0;
		width: auto;
		font-size: 18px;
		line-height: 1.5em;
	}
		#global_nav .sitemap {
			display: block;
			position: fixed;
			top: 0;
			left: 0;
			height: 30px;
			width: 25px;
			font-size: 18px;
			line-height: 1.5em;
			background: #eeeeee url('/images/icon-menu.png') center center no-repeat;
			text-indent: -10000%;
			z-index: 100;
		}
		#global_nav ul {
			position: fixed;
			top: 30px;
			left: -180px;
			background-color: #eeeeee;
			transition: left 0.5s;
		}
		#global_nav.expanded ul {
			left: 0px;
		}
			#global_nav ul > li {
				display: block;
				margin: 0;
				padding: 0;
			}
			#global_nav li:hover {
				background-image: none;
			}
			#global_nav ul > li > a, 
			#global_nav ul> li:hover > a {
				color: #333e48;
			}
			#global_nav ul > li {
				padding: 0;
			}
			#global_nav ul > li > a {
				display: block;
				margin: 0 22px;
				padding: 0 4px;
				width: 126px;
				font-weight: bold;
				letter-spacing: 0.02em;
				border-bottom: 1px solid #dbd9d6;
			}
			#global_nav ul > li:last-child > a {
				border-bottom: none;
			}
			#global_nav ul > li > ul {
				display: none;
				transition: none;
			}
			#global_nav li:hover ul {
				display: none;
				height: none;
			}
			
			#global_nav .home,
			#global_nav .login,
			#global_nav .email,
			#global_nav .search,
			#global_nav .news,
			#global_nav .blog {
				float: none;
				margin: 0;
				background-color: #eeeeee;
			}
			#global_nav .home:hover {
				background-color: #eeeeee;
			}
			#global_nav .home a,
			#global_nav .login a,
			#global_nav .email a,
			#global_nav .search a,
			#global_nav .news a,
			#global_nav .blog a {
				display: block;
				margin: 0 22px;
				padding: 0 4px;
				width: 126px;
				height: auto;
				text-indent: inherit;
				background-image: none;
			}
			#global_nav .login {
				position: fixed;
				top: 0;
				left: -100px;
				width: auto;
				background-color: #018eaa;
				transition: left 0.5s;
			}
			#global_nav.expanded .login {
				left: 25px;
			}
			#global_nav .login:hover {
				background-color: #018eaa;
			}
			#global_nav .login a {
				margin: 0;
				padding: 0 28px;
				width: auto;
				height: 30px;
				font-size: 24px;
				font-weight: 600;
				text-transform: uppercase;
				color: #f7cf3b;
				border-bottom: none;
			}
			#global_nav .login a:hover {
				color: #f7cf3b;
			}
	
	
	#masthead .logo {						left: 12.75%;
											width: 20.5%}
	#homepage_tiles .node {					line-height: 0;}
	#homepage_tiles .node h2 {				display: inline-block;}
	#homepage_tiles .node .gfx_headline {	margin: 0 0;
											width: 49%;}
	#homepage_tiles .node .content p {		display: none;}
	
	
	
	#interior_masthead {					padding: 0;}
	.interior_page h1 {						display: block;
											margin: 0;
											padding: 0.35em 0.5em 0.5em 2.4em;
											font-family: 'Tungsten A', Helvetica, Arial, sans-serif;
											font-weight: 600;
											font-size: 20px;
											line-height: 1em;
											text-align: left;
											color: #f7cf3b;
											background-color: #018eaa;}
	#interior_masthead .gfx_masthead {		margin-top: 0;
											width: 60%;}
	
	
	
	#interior_tiles .node {					clear: both;
											width: 100%;
											height: auto;
											padding: 0;
											border-top: none;
											border-right: none;
											border-bottom: 1px solid #cb5d5c;
											background: transparent none;
											}
	#interior_tiles .node:last-child {		border-bottom: none;}
	#interior_tiles .node:hover {			background: transparent none;}
	#interior_tiles .node h2 {				margin: 0;
											padding: 0.4em 0;
											font-size: 22px;}
	#interior_tiles .node h3 {				display: none;}
	#interior_tiles .node .content {		height: auto;}
	#interior_tiles .node .content p {		display: none;}
	#interior_tiles .node .content .more {	top: 0;
											left: 0;
											width: 100%;
											height: 100%;
											padding: 0;
											text-indent: -1000%;
											background: transparent url("/images/arrow-right-blue.png") 92% center no-repeat;
											background-size: auto 11px;}



	#interior_masthead.with_callout .gfx_masthead {	margin: 5% 0;
													width: 58%;}
	#interior_masthead .node.callout {				width: 40%;
													height: auto;
													margin: 4% 0 0;
													padding: 0;}
	#interior_tiles .node.callout .content {		margin: 0;}
	#interior_masthead .node.callout h2 {			margin: 0;
													padding: 0 0 4%;
													font-size: 37px;
													line-height: 1em;}	
	#interior_tiles .node.callout h2 {				font-size: 30px;
													padding: 0.4em 0;}
	.node.callout .download {						font-size: 12px;}
	#interior_tiles .node.callout .download {		position: absolute;
													top: 25%;
													right: 3%;
													margin: 0;
													line-height: 1.25em;}
	

}
/* end mobile @media */


@media (min-width: 547px) and (max-width: 929px) {/* tablet vertical */
	/* in between tablet vertical and the next size up, another intermediary size (738 is needed) */
	#global_nav {							height: 29px;
											font-size: 15px;
											line-height: 1.9em;}
		#interior_masthead .gfx_masthead {		margin-top: 29px;}
	#global_nav ul > li {					margin-right: 2%;}
		#global_nav ul > li > a {			padding: 0.45em 0 0.4em;}
		#global_nav .home,
		#global_nav .login,
		#global_nav .email,
		#global_nav .search,
		#global_nav .news,
		#global_nav .blog {					padding: 0;}
		#global_nav .home a, 
		#global_nav .login a, 
		#global_nav .email a,
		#global_nav .search a,
		#global_nav .news a,
		#global_nav .blog a {				margin: 0 5px;
											width: 16px;
											height: 29px;
											background-size: 15px auto;}
		#global_nav .home a, 
		#global_nav .login a {				margin: 0;
											width: 48px;
											height: 29px;
											background-size: 19px auto;}
		.interior_page #global_nav .home a {background-size: 7px auto;}
	
	
	
	#homepage_tiles .node .content {		width: 33%;}
	#homepage_tiles .node .gfx_headline {	margin: 0 3.5%;}
	#homepage_tiles .node .content p {		font-size: 15px;}
	
	
	
	#interior_tiles .node {					border-top: none;
											border-right: 1px solid #cb5d5c;
											border-bottom: 1px solid #cb5d5c;
											box-sizing: border-box;
											-webkit-box-sizing: border-box;
											-moz-box-sizing: border-box;
											-ms-box-sizing: border-box;}
	#interior_tiles .node:nth-child(3n+3) {	border-right: none;}
	#interior_tiles .node h2 {				font-size: 22px;
											padding: 0.4em 0;}
	#interior_tiles .node .subhead {		margin-top: 15%;}
	#interior_tiles .node h3 {				border-bottom: medium none;
											font-size: 14px;}
	#interior_tiles .node .content {		height: auto;}
	#interior_tiles .node .content p {		display: none;}
	#interior_tiles .node .more {			background-size: 0.5em auto;
											font-size: 11px;}



	#interior_masthead .node.callout h2 {			font-size: 52px;
													margin: 5% 0 0;}
	#interior_tiles .node.callout h2 {				font-size: 56px;}
	.node.callout .download {						font-size: 13px;}

}
/* end tablet vertical @media */


@media (min-width: 930px) and (max-width: 1279px) {/* tablet horizontal */
	#global_nav ul > li {					margin-right: 2.5%;}
	
	#interior_tiles .node h2 {				padding: 0.3em 0;
											font-size: 28px;}
	#interior_tiles .node h3 {				height: 3.25em;
											font-size: 17px;}
	#interior_tiles .node .content {		font-size: 15px;}
	
	#interior_tiles .node.callout h2 {		font-size: 96px;}
}
/* end tablet horizontal @media */





/* nav and interior tiles benefit from additional intermediary range(s) until the widespread adoption of vw units for fonts */
@media (min-width: 1050px) and (max-width: 1154px) {/* interior tiles */
	#global_nav ul > li {					margin-right: 4.4%;}
	
	#interior_tiles .node h2 {				padding: 0.45em 0;
											font-size: 31px;}
	#interior_tiles .node h3 {				height: 3.5em;
											font-size: 20px;}
	#interior_tiles .node .content {		font-size: 16px;}
	
	#interior_tiles .node.callout h2 {		font-size: 110px;}
}
@media (min-width: 1155px) and (max-width: 1279px) {/* interior tiles */
	#global_nav ul > li {					margin-right: 6.25%;}
	
	#interior_tiles .node h2 {				padding: 0.6em 0;
											font-size: 34px;}
	#interior_tiles .node h3 {				height: 3.85em;
											font-size: 22px;}
	#interior_tiles .node .content {		font-size: 17px;}
	
	#interior_tiles .node.callout h2 {		font-size: 120px;}
}
/* end interior tiles @media */




@media (min-width: 1280px) {/* desktop */
}
/* end desktop @media */






/* borrowing the parameters from the live site, screens less than 939px wide are assumed to be touchscreens that don't support hover */
@media (max-width: 939px) {/* touchscreen/no-hover */
	#homepage_tiles .node .content a.more {
		opacity: 1;
		width: 35px;
	}
	
	#masthead {margin-bottom: 0 !important;}
}
/* end touchscreen/no-hover @media */















































