﻿@charset "utf-8";

/* Google Fonts */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:600,600italic,800);
/* @import url(http://fonts.googleapis.com/css?family=Roboto:100,100italic,700); */

/* From x10.common.css */
* {border:0px;font-weight:600;margin:0px;padding:0px;-webkit-appearance:none;}
*:focus {outline:none;}
a, *.link {transition:color 500ms;-moz-transition:color 500ms;-webkit-transition:color 500ms;-o-transition:color 500ms;color:inherit;}
br {height:16px;}
body {background-color:rgba(255,255,255,1);color:rgba(0,0,0,1);font-family:'Open Sans', sans-serif;}
p {margin:16px;}
ul {list-style:circle;}

*.centered {text-align:center;}
*.clear {clear:both;}
*.hidden {display:none;}
*.title {display:block;margin:auto;text-align:center;}
img.title {width:100%;}
img.centered {display:block;margin:auto;width:620px;height:128px;}
img.left {display:block;float:left;margin:0px 32px;}
img.right {display:block;float:right;margin:0px 32px;}

/* Overrides */
*::selection {
	background-color:rgba(255,255,255,.8);
	color:rgba(58,99,177,1);
}
*::-moz-selection {
	background-color:rgba(255,255,255,.8);
	color:rgba(58,99,177,1);
}
body {
	/* UI Definition - Body background */
	background-attachment:fixed;
-x-	background-image:url("../images/background.png");
	background-repeat:no-repeat;
}
header, footer, div.form, div.layout blockquote, div.layout section, div.collapsible {
	/* UI Definition - Secondary color */
	background-color:rgba(58,99,177,1);
	color:rgba(255,255,255,1);
}
div.form:target, div.layout blockquote:target, div.layout section:target, div.collapsible:target {
	/* UI Definition - Targeted secondary color */
	background-color:rgba(176,135,58,1);
	color:rgba(255,255,255,1);
}
header > a {
	background-color:rgba(255,255,255,1);
	display:block;
	padding:16px 0px;
	width:100%;
}
header img {
	width:100%;
-x-	max-height:256px;
}
header > nav > table {
	border-collapse:collapse;
	margin:0px auto;
-x-	min-width:830px;
	text-align:center;
	width:90%;
}
header > nav > table  td {
	transition:background-color 300ms;-moz-transition:background-color 300ms;-webkit-transition:background-color 300ms;-o-transition:background-color 300ms;
	font-size:1.2em;
}
header > nav > table td:hover, header > nav > table a.active {
	/* UI Definition - Navigation hover color */
	background-color:rgba(255,255,255,1);
	color:rgba(58,99,177,1);
}
header > nav > table a {
	display:block;
	width:100%;
}
div.layout {
	/* UI Definition - Layout background color */
	background-color:rgba(255,255,255,.5);
	color:rgba(17,17,17,1);
}
div.layout {
	margin:auto;
	padding:16px 16px 32px 16px;
	width:900px;
}
div.layout a {
	color:rgba(58,99,177,1);
}
div.layout blockquote, div.layout section, div.collapsible, div#savings-calculator {
	margin:16px;
	padding:16px;
}
div.layout blockquote {
	text-indent:24px;
}
div.layout > *.split {
	display:inline-block;
	margin:0px 16px;
	vertical-align:top;
	width:calc(50% - 35px);
}
div.layout h2, div.layout h3 {
	margin:32px 16px 0px 16px;
}
div.layout h2:first-child, div.layout h3:first-child {
	margin-top:0px;
}
div.layout section a {
	color:inherit;
	text-decoration:none;
}
div.layout section h2 {
	border-bottom:1px solid rgba(238,238,238,1);
	margin:0px 0px 16px 0px;
	padding:0px 0px 8px 0px;
}
div.layout section > h3:first-child {
	border-bottom:1px solid #fff;
	margin:0px -16px;
	padding:0px 32px;
	padding-bottom:16px;
}
div.layout ul {
	margin-left:32px;
}
footer > table#links {
	border-collapse:collapse;
	margin:auto;
	width:900px;
}
footer > table#links td {
	padding:0px 8px;
	text-align:center;
	vertical-align:top;
}
footer > table#links td > a {
	display:block;
	font-size:.8em;
}

@media only screen and (max-width:932px) {
	header > nav > table {
		width:100%;
	}
	div.layout {
		width:90%;
	}
	div.layout > *.split {
		display:block;
		margin:0px;
		width:100%;
	}
}
@media only screen and (max-width:414px) {
	body {
		background-color:rgba(255,255,255,1);
		background-image:none;
	}
	header > nav > table td {
		display:inline-block;
		width:100%;
	}
	header > nav > table td > a {
		padding:8px;
		width:calc(100% - 16px);
	}
	div.layout {
		padding:0px;
		padding-top:16px;
		width:100%;
	}
	header, footer, div.form, div.layout blockquote, div.layout section, div.collapsible {
		margin-left:0px;
		margin-right:0px;
	}
}