/*	The Holland Home website is built with pure HTML5. We’re proud to support web standards.
	
	We also want to share what we’ve learned. Although the basic design of this site, as
	well as all written content, photographs, and logos are the copyright property of
	Holland Home, the HTML and CSS code for this site is licensed under a Creative Commons
	BSD license (http://creativecommons.org/licenses/BSD). Share alike and give it away. */

/*	This is the main stylesheet for the faithhospicecare.org website. The design and styling of
	this site are built on the philosophy of minimizing ID and class specification whenever
	possible, in favor of using broad element styles through the use of selector specificity. */

@media all {
	/*	Zero out padding, margins, and borders on all elements. */
	* {
		margin: 0; padding: 0; border: 0; }

	/*	Because this site uses new HTML5 elements, it is necessary to specify that
		they are block-level elements; otherwise, all user agents that don't understand
		these tags will render them as inline. */
	article, aside, footer, header, nav, section {
		display: block !important; }

	a:link,
	a:visited {
		color: #7070ac;
		text-decoration: underline; }

	blockquote p {
		font-style: italic; }

	ol,
	ul {
		padding-left: 2.5em; }

	ol li ul,
	ul li ul {
		padding-left: 0.5em;
		margin-bottom: 0; }

	span.trademark {
		font-size: 60%;
		vertical-align: top; }
}


@media screen {
	/*	Basic typographical styles. */
	p, li, th, td {
		color: #666;
		font: 9pt/14pt Verdana, Arial, Helvetica, sans-serif; }

	/*	Basic elements. */
	a:hover,
	a:active {
		text-decoration: none; }

	article {
		background: #fff url('http://faithhospicecare.org/images/shadow.png') repeat-x;
		clear: both;
		padding-bottom: 12px;
		overflow: hidden; }

	body {
		background: #7070ac url('http://faithhospicecare.org/images/purpleBack.png') repeat-x; }

	div#wrap {
		width: 963px;
		margin: 0 auto;
		text-align: left; }

	footer {
		clear: both; }

	footer p {
		margin: 5px 0 10px 0;
		color: #fff;
		font: 7.5pt Verdana, Arial, Helvetica, sans-serif;
		text-align: center; }

	header {
		height: 60px;
		padding: 14px 28px 28px 28px;
		background: #fff; }

	header h1 {
		float: right;
		font: 18pt Verdana, Arial, Helvetica, sans-serif;
		color: #7070ac !important;
		margin-top: 28px; }

	header img {
		float: left; }

	iframe {
		width: 500px;
		height: 400px;
		border: 1px solid #666; }

	section {
		height: auto !important;
		min-height: 400px;
		height: 400px; }

	section h1 {
		color: #7070ac;
		font: 14.5pt Helvetica, Verdana, Arial, sans-serif;
		padding: 28px 0 14px 0;
		margin: 0 28px; }

	section h2 {
		color: #666;
		font: bold 10.5pt Helvetica, Verdana, Arial, sans-serif;
		padding: 14px 0 9px 0;
		margin: 0 28px; }

	section h3 {
		color: #666;
		font: bold 9pt Helvetica, Verdana, Arial, sans-serif;
		padding: 0 0 7px 0;
		margin: 0 28px; }

	section img {
		margin: 14px -14px 14px 28px; }

	section p,
	section ol,
	section ul {
		margin: 0 28px 14px 28px; }

	table {
		margin: 0 28px; }


	/*	The skip navigation link, which is provided for accessibility */
	div#skip {
		text-align: right; }

	div#skip a:link,
	div#skip a:visited {
		font: 9pt/14pt Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
		position: absolute;
		left: -10000px;
		top: auto;
		width: 1px;
		height: 1px;
		overflow: hidden; } 

	div#skip a:focus {
		text-decoration: none;
		position: static;
		width: auto;
		height: auto; }


	/*	The main navigational menu that appears at the top of every page. */
	nav ul {
		padding-left: 0;
		list-style: none;
		line-height: 17px;
		background: #dbd9f0;
		font: 10pt Arial, Helvetica, sans-serif; }

	nav li {
		float: left;
		display: block;
		text-align: center; }

	nav li a:link,
	nav li a:visited {
		display: block;
		background: #dbd9f0 url('http://faithhospicecare.org/images/menuLeft.png') no-repeat;
		color: #7070ac;
		text-decoration: none;
		padding: 18px 0 8px 0;
		height: 24px;
		vertical-align: middle;
		width: 107px; }

	nav li a:hover,
	nav li a:active {
		background: #7070ac;
		text-decoration: none;
		padding: 18px 0 8px 0;
		color: #fff; }

	nav li a.menuDouble:link,
	nav li a.menuDouble:visited,
	nav li a.menuDouble:hover,
	nav li a.menuDouble:active {
		padding-top: 8px;
		height: 34px; }

	nav li a.menuLast:link,
	nav li a.menuLast:visited {
		background: #dbd9f0; }

	nav li a.menuLast:hover,
	nav li a.menuLast:active {
		color: #fff;
		background: #7070ac; }


	/*	The left-side column <aside> for two-column and three-column pages. Note
		that both left and right columns are built with an <aside>, but only the
		right column requires additional styling, since it builds off the base
		styles specified here. */
	aside {
		float: left;
		width: 212px;
		margin-top: 35px;
		margin-bottom: -32767px;
		padding-bottom: 32767px; }

	aside h1,
	aside h2 {
		color: #666;
		font: bold 9pt Verdana, Arial, Helvetica, sans-serif; }

	aside h1 a:link,
	aside h1 a:visited {
		display: block;
		border-bottom: 1px solid #ddd;
		padding: 4px 0 4px 20px;
		text-decoration: none;
		color: #7070ac; }

	aside img {
		margin-top: 50px;
		margin-left: 55px; }

	aside ul li a:link,
	aside ul li a:visited {
		display: block;
		border-bottom: 1px solid #ddd;
		padding: 4px 0 4px 20px;
		text-decoration: none;
		color: #666; }

	aside ul li a:hover,
	aside ul li a:active {
		text-decoration: underline; }

	aside h1 a.active:link,
	aside h1 a.active:visited,
	aside ul li a.active:link,
	aside ul li a.active:visited {
		color: #7070ac;
		background: #dbd9f0; }

	aside ul {
		list-style: none;
		padding-left: 0; }

	aside ul li ul {
		padding-left: 20px; }

	aside ul li ul li a:link,
	aside ul li ul li a:visited {
		border-bottom: none;
		margin-left: -20px;
		padding-left: 40px; }

	aside ul li ul li ul li a:link,
	aside ul li ul li ul li a:visited {
		margin-left: -40px;
		padding-left: 60px; }

	/*	Right-side column on three-column layouts. */
	aside#right {
		float: right;
		background: #ddd url('http://faithhospicecare.org/images/shadow.png') repeat-x;
		margin-top: 0;
		width: 184px;
		padding: 14px;
		margin-bottom: -32767;
		padding-bottom: 32767px; }

	aside#right h1,
	aside#right h2 {
		padding: 12px 0; }

	aside#right img {
		margin: -14px 0 0 -14px; }
}


@media print {
	/*	Suppress display-specific elements from printing. */
	nav, aside, iframe, section img {
		display: none !important; }

	/*	Basic typographical styles. */
	p, li, th, td {
		font: 10pt/14pt Verdana, Arial, Helvetica, sans-serif !important;
		color: #000 !important; }

	/*	This suppresses hyperlinks with a ‘mailto’ URL scheme from printing, per the CSS3
		selector described below. This needs to come before the next declaration, and be
		specified as !important, or else it is ineffective. */
	a[href^="mailto"]:after {
		content: "" !important; }

	/*	This CSS3 selector prints the URL for a hyperlink after the hyperlink, to aid readers
		of a printed page in determining where the link points to. This technique comes from
		Eric Meyer’s article “CSS Design: Going to Print” in A List Apart, Issue 144
		(http://www.alistapart.com/articles/goingtoprint) */
	section p a:link:after,
	section p a:visited:after,
	section li a:link:after,
	section li a:visited:after {
		content: " (" attr(href) ") ";
		font-size: 8pt !important; }

	ol,
	ul {
		margin: 1em 0 !important; }

	ol li ul,
	ul li ul {
		padding-left: 2.5em !important; }

	span.trademark {
		font-size: 60% !important;
		vertical-align: top !important; }

	a:link, a:visited {
		text-decoration: underline !important; }

	footer p {
		font: 6pt Verdana, Arial, Helvetica, sans-serif !important;
		margin-top: 1em !important;
		border-top: 1pt dotted #ddd !important;
		text-align: center !important;
		color: #666 !important; }

	header {
		border-bottom: 1px solid #000 !important; }

	header h1 {
		font: 16pt Verdana, Arial, Helvetica, sans-serif !important;
		float: right !important;
		margin-top: 1.5em !important;
		color: #000 !important; }

	section {
		margin: 0 !important; }

	section h1 {
		font: bold 16pt Helvetica, Verdana, Arial, sans-serif !important;
		clear: both !important;
		margin: 1.5em 0 0.5em 0 !important;
		color: #7070ac; }

	section h2 {
		padding-top: 0.5em !important;
		font: 14pt Helvetica, Verdana, Arial, sans-serif !important;
		margin-top: 1em !important; }

	section h3 {
		font: 12pt Helvetica, Verdana, Arial, sans-serif !important;
		margin: 0.5em 0 0.25em 0 !important; }
}