/*
Title: SHM Financial
Style: General stylesheet
Author: Tome Wilson - tome@creativewebgroup.net
Last Updated: June 2, 2010
*/

/* ---[ css reset ]--------------------- */
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, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, textarea, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline}
:focus {outline: 0}
body {line-height: 1}
ol, ul {list-style: none}


/* ---[ structure ]--------------------- */
html {background: #828289 url(../images/shell/background.png) repeat-x; width: 100%; display: table; font-size: 0; text-align: center; color: #000}
body {width: auto; text-align: center}
#container {margin: 0 auto; width: 855px}


/* ---[ header ]--------------------- */
#header {width: 855px; height: 138px; display: block; text-align: left;}
	#logo {float: left}
	#header-navigation {width: 315px; text-align: right; padding-top: 30px; font: bold 12px/1em Arial, Helvetica, sans-serif; color: #fff; float: right}
		#header-navigation a {color: #fff; text-decoration: none; padding: 4px; margin: 0 2px}
		#header-navigation a:visited {color: #fff}
		#header-navigation a:hover {color: #1c2148; background: #ebebec}


/* ---[ top-navigation ]--------------------- */
#top-navigation {width: 855px; height: 30px; display: block; background: transparent url(../images/shell/top-navigation.png) no-repeat}

	#top-navigation ul {list-style: none}
	#top-navigation li {float: left}

	#top-navigation a.home_button, 
	#top-navigation a.about_button, 
	#top-navigation a.financial-advisors_button, 
	#top-navigation a.services_button, 
	#top-navigation a.events_button, 
	#top-navigation a.consultation_button, 
	#top-navigation a.radio_button {float: left; display: block; height: 30px; text-indent: -999999px; background: transparent url(../images/shell/top-navigation.png) no-repeat}
	
	#top-navigation a.home_button {background-position: 0 0; width: 78px}
	#top-navigation a.home_button:hover {background-position: 0 -30px}

	#top-navigation a.about_button {background-position: 0 78px; width: 78px}
	#top-navigation a.about_button:hover {background-position: -78px -30px}

	#top-navigation a.financial-advisors_button {background-position: 0 156px; width: 120px}
	#top-navigation a.financial-advisors_button:hover {background-position: -156px -30px}

	#top-navigation a.services_button {background-position: 0 276px; width: 119px}
	#top-navigation a.services_button:hover {background-position: -276px -30px}

	#top-navigation a.events_button {background-position: 0 395px; width: 158px}
	#top-navigation a.events_button:hover {background-position: -395px -30px}

	#top-navigation a.consultation_button {background-position: 0 553px; width: 185px}
	#top-navigation a.consultation_button:hover {background-position: -553px -30px}

	#top-navigation a.radio_button {background-position: 0 738px; width: 117px}
	#top-navigation a.radio_button:hover {background-position: -738px -30px}


/* ---[ main area ]--------------------- */
#main {width: 855px; background: #fff url(../images/shell/main-background.gif) repeat-y; margin-top: 21px; padding-bottom: 40px; border-top: 1px solid #414141}

	/* ---[ photo-bar ]--------------------- */
	#photo-bar {margin-left: 1px}
	#photo-bar img {float: left}

	/* ---[ content ]--------------------- */
	#content {padding: 21px; width: 560px; float: left; display: block; text-align: left; font: normal 13px/1.35em Arial, Helvetica, sans-serif}


		/* ---[ link styles ]--------------------- */
		#content a {color: #276101; text-decoration: none}
		#content a:visited {color: #276101}
		#content a:hover {color: #276101; text-decoration: underline}


		em, .em {font-style: italic}
		strong, .strong {font-weight: bold}
		.big {font-size: 110%}
		.small {font-size: 75%}
		.l {float: left}
		.r {float: right}
		.clear {clear: both}
		.center {text-align: center}
		.hide {display: none}

		p {padding: .5em 0}
		#content p:first-child {padding: 0 0 .5em 0}

		.border {border: 1px solid #414141}
		.map-border {border: 1px solid #414141; padding: 10px; margin: .35em 0; background: #ebebec}

		#content ul {padding: .35em 0 .35em .35em; margin-left: 10px; list-style-type: none; text-align: left}
		#content li {padding: .15em 0 .35em 1em; background: transparent url(../images/graphics/bullet.gif) 0 .6em no-repeat}

		.hr {width: auto; height: 1px; font-size: 1px; display: block; border-top: 1px solid #555655; margin: 10px 0}

		.column1, .column2 {float: left; width: 285px; display: block; margin-right: 20px}
		.column2 {margin-right: 0}

		.col1, .col2, .col3 {float: left; width: 185px; display: block; margin-right: 20px}
		.col3 {margin-right: 0}

		.arrows {background: transparent url(../images/graphics/arrows.gif) no-repeat 0 3px; padding-left: 21px}

		.photoL {float: left; margin: 3px 10px 0 0}
		.photoR {float: right; margin: 3px 0 0 10px}


		/* ---[ services page ]--------------------- */

		.button, .button:visited {background: #1c2148 url(../images/graphics/alert-overlay.png) repeat-x; display: block; color: #fff !IMPORTANT; -moz-border-radius: 15px; -webkit-border-radius: 15px; text-align: center; font-size: 14px; font-weight: bold; line-height: 1; padding: 10px 20px}
		.button:hover {background-color: #33385b; color: #fff !IMPORTANT; text-decoration: none !IMPORTANT;}

		#services-subnav {width: 225px; display: block; font-weight: bold; margin-left: -14px; float: left; margin-right: 20px}
			#services-subnav ul {padding: 0; margin: 0; list-style-type: none; text-align: left}
			#services-subnav li {padding: .5em; margin: .35em 0; background: #ebebec; border-top: 1px dotted #33385b; border-bottom: 1px dotted #33385b; border-left: 2px solid #33385b}
		

		/* ---[ font colors ]--------------------- */
		.black {color: #000 !Important}
		.white {color: #fff !Important}
		.red {color: #ab0000 !Important}
		.grey {color: #78787f !Important}
		.blue {color: #1c2148 !Important}
		.ltblue {color: #33385b !Important}
		.green {color: #276101 !Important}
		.ltgreen {color: #3d711b !Important}


		/* ---[ headings ]--------------------- */
		h1 {font: bold 28px/1.1em Arial, Helvetica, sans-serif; color: #33385b}
		h2 {font: bold 24px/1.35em Arial, Helvetica, sans-serif; color: #b92027; margin: .7em 0 .35em 0}
		h3 {font: normal 20px/1.25em Arial, Helvetica, sans-serif; color: #555655; padding: .7em 0 0 0}
		h4 {font: bold 16px/1.25em Arial, Helvetica, sans-serif; color: #002663; letter-spacing: 0; padding: .7em 0 0 0}
		h5 {font: bold 16px/1.25em Arial, Helvetica, sans-serif; color: #b92027; letter-spacing: 0; padding: .7em 0 0 0}

		#green {background: #276101; margin: 1em 0}
			#green h1 {font: bold 20px/1em Arial, Helvetica, sans-serif; color: #fff; background: #3d711b; padding: 10px; letter-spacing: 0}
			#green p {padding: 10px; color: #f3f3f3; font-size: 14px; font-weight: bold; line-height: 1.35em}


	/* ---[ right side ]--------------------- */
	#right {width: 211px; float: right; padding: 0 20px; margin-right: 1px; display: block; font: normal 13px/1.4em Arial, Helvetica, sans-serif; text-align: left}

		#right .location {padding: 20px 0; border-bottom: 1px solid #414141}
		#right .office {display: block; font-size: 20px; font-weight: bold; color: #1c2148; padding-bottom: .35em}

		#right a {color: #000; text-decoration: none}
		#right a:visited {color: #000}
		#right a:hover {color: #000; text-decoration: underline}


/* ---[ footer ]--------------------- */
#footer-container {height: 71px; background: #1c2148; width: 100%; display: table; text-align: center}

	#footer {margin: 0 auto; width: 844px; height: 52px; display: block; text-align: right; padding: 19px 11px 0 0; font: normal 12px/1.75em Arial, Helvetica, sans-serif; background: url(../images/shell/phone-number.png) no-repeat; color: #fff}

	#footer .copyright {font-size: 14px; line-height: 1.15em; font-weight: bold; display: block}

	#footer a {color: #fff; text-decoration: none}
	#footer a:visited {color: #fff}
	#footer a:hover {color: #fff; text-decoration: underline}