@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);

div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, tt, var, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

ol, ul { list-style: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
	
table { border-collapse: collapse; border-spacing: 0; }

body {
	padding: 0;
	margin: 0;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.4em;
	color: #444;
}

.wrapper {
	position: relative;
	max-width: 960px;
	margin: 0 auto;	
	overflow: hidden;
}

#header {
	background: #28292C;
	padding: 10px 0;
}
	#logo {
		color: #FFF;
		font-weight: 600;
		text-decoration: none;
	}

	#navigation {
		float: right;
	}
		#navigation a {
			display: inline-block;
			color: #FFF;
			font-size: 13px;
			text-transform: uppercase;
			text-decoration: none;
		}
			#navigation a:focus,
			#navigation a:hover {
				text-decoration: underline;
			}
			#navigation a + a {
				margin: 0 0 0 1em;
			}

#search {
	background: #3293E9;
}
	#search.large {
		padding: 50px 0;
		text-align: center;
	}
	#search.small {
		padding: 20px 0;
	}

	#search input {
		background: #FFF;
		padding: 0 20px;
		box-sizing: border-box;
		border: none;
		vertical-align: middle;
	}
		#search.large input {
			width: 85%;
			font-size: 1.5rem;
			height: 48px;
		}
		#search.small input {
			width: 65%;
			font-size: 1.2rem;
			height: 40px;
		}
		
	#search button {
		background: #EEE url(/resources/images/search.svg) center center no-repeat;
		padding: 0;
		border: none;
		vertical-align: middle;
		cursor: pointer;
	}
		#search.large button {
			width: 48px;
			height: 48px;
			margin: 0 0 0 -48px;
		}
		#search.small button {
			width: 40px;
			height: 40px;
			margin: 0 0 0 -40px;
		}

	#search h1 {
		margin: 0 0 1em 0;
		color: #FFF;
		line-height: 1.35em;
		cursor: default;
	}
		#search.large h1 {
			font-size: 200%;
		}
		#search.small h1 {
			font-size: 150%;
		}
		#search h1 span {
			font-size: 13px;
			font-weight: 600;
			text-transform: uppercase;
			vertical-align: top;
		}

#sidebar {
	float: left;
	width: 20%;
	padding: 0 0 50px 0;
	margin: 20px 20px 0 0;
	border-right: 1px solid #AAA;
}
	#sidebar a {
		display: block;
		padding: 7px 10px;
		color: #222;
		/*line-height: 2.2em;*/
		text-decoration: none;
	}
		#sidebar a:focus,
		#sidebar a:hover {
			background: #F4F4F5;
			text-decoration: none;
		}
	#sidebar .category {
		background: #F4F4F5;
		margin: 0 0 1px 0;
	}
		#sidebar .category:focus,
		#sidebar .category:hover {
			background: #EBEEF1;
			text-decoration: none;
		}
		#sidebar .category.selected {
			background: #28292C;
			color: #FFF;
		}
	#sidebar .items {
		padding: 0 0 10px 0;
	}
	#sidebar .item {
		padding: 7px 10px 7px 17px;
		border-left: 3px solid transparent;
	}
		#sidebar .item.selected {
			border-left: 3px solid #3293E9;
		}

#content {
	padding: 20px 0 50px 0;
	overflow: hidden;
}
	#content p { margin: 0 0 1em 0; }

	#content a { color: #2283D9; text-decoration: none; }
		#content a:focus,
		#content a:hover { text-decoration: underline; }

	#content img { max-width: 100%; }

	#content ul { margin: 0 0 10px 0; }
		#content ol li { list-style: decimal; margin-left: 35px; }
		#content ul li { list-style: disc; margin-left: 35px; }
			#content ul li li { list-style: circle; }
				#content ul li li li { list-style: square; }

	#content h1 {
		margin: 0 0 1em 0;
		font-size: 165%;
		font-weight: 600;
		line-height: 1.35em;
		cursor: default;
	}
	#content h2 {
		margin: 0 0 1em 0;
		color: #424044;
		font-size: 150%;
		font-weight: 600;
		line-height: 1.35em;
		cursor: default;
	}
	#content h3 {
		margin: 0 0 1em 0;
		color: #666;
		font-size: 135%;
		font-weight: 600;
		line-height: 1.35em;
		cursor: default;
	}

	#content .form { }
		#content .form .instructions {
			color: #888;
			font-size: 13px;
			margin: 0;
		}
		#content .form .textbox {
			padding: 4px 8px;
			border: 1px solid #CCC;
			box-sizing: border-box;
			font-family: inherit;
			font-size: inherit;
		}
			#content .form .textbox.medium {
				width: 50%;
				min-width: 200px;
			}
			#content .form .textbox.large {
				width: 100%;
				min-width: 200px;
			}
		#content .form .button {
			background: #35B535;
			padding: 8px 16px;
			border: none;
			color: #FFF;
			font-family: inherit;
			font-size: inherit;
		}

#breadcrumbs {
	font-size: 14px;
	margin: 0 0 1em 0;
}

#topics {
	overflow: hidden;
}
	#topics .topic {
		display: block;
		float: left;
		background: #EEE;
		width: 33.33%;
		min-width: 100px;
		padding: 50px 0 25px 0;
		border: 5px #FFF solid;
		color: #000;
		font-size: 18px;
		text-align: center;
		transition: background-color ease 0.3s;
	}
		#topics .topic:focus,
		#topics .topic:hover {
			background: #DDD;
			text-decoration: none;
		}

#contact {
	background: #F8F8F8;
	padding: 50px 0;
	border-top: 1px solid #E8E8E8;
}
	#contact p { margin: 0 0 1em 0; }

	#contact a { color: #2283D9; text-decoration: none; }
		#contact a:focus,
		#contact a:hover { text-decoration: underline; }

	#contact h2 {
		color: #424044;
		font-size: 150%;
		font-weight: 600;
		line-height: 1.35em;
		cursor: default;
	}

.announcement {
	padding: 10px;
	margin: 0 0 2em 0;
	border: 1px solid #CCC;
}

.result-title {
	display: block;
	text-decoration: none;
	margin: 0 0 4px 0;
}
	.result-title:focus,
	.result-title:hover { text-decoration: underline; }
.result-relevance {
	display: block;
	margin: 4px 0 0 0;
	color: #AAA;
}
.result-highlight { background: #FFB; }

#footer {
	background: #28292C;
	padding: 20px 0;
	color: #AAA;
	font-size: 14px;
}