/* ---------------------------- 
[Master Stylesheet]

Project: 	Exchange Bank
Version:	1.0
Last change:	07/02/08 [site created, lg]
Assigned to:	Lonnie Griffin [lg]
Primary use:	Web
------------------------------- */

/* ---------------------------- */
/* Basic Elements
/* ---------------------------- */

		body{background-color: #8c8c8c; margin:0px; padding:0px; font-size: 14px; font-family:Arial, Helvetica, sans-serif; text-align:center}
		h1  {display: none;}
		h2, h3, h4 {font-family: "Trebuchet MS", "Times New Roman", Times, serif; margin: 10px 0px 10px 0px; padding: 0px; }
		h2 { font-size: 22px; color: #3a4993; font-weight: normal; font-style: italic; letter-spacing:.5px;}
	    p { line-height:20px; margin: 10px 0px 10px 0px; padding: 0px;}
		a, a:visited { color: #0000ff; }
		a:hover { text-decoration: none; }
		a img { border: none; }
		hr {height:1px; background-color:#ccc; border: 0px; display:block; clear:both; margin:10px 0px 10px 0px; overflow:hidden}
		address { font-style: normal; line-height: 18px; margin: 0px 0px 10px 0px; }

/* ---------------------------- */
/* Containers
/* ---------------------------- */

		#wrapper {width: 859px; text-align: left; margin: 20px auto 10px auto; background: url(../images/bkground-wrapper.gif) repeat-y;}
		#wrapper-top {height: 18px; width: 859px; background:url(../images/bkground-wrapper-top.gif) no-repeat;}
		#wrapper-bottom {height: 24px; width: 859px; background:url(../images/bkground-wrapper-bottom.gif) no-repeat;}
		#header {position: relative;margin: 0px auto 0px auto; width: 805px; height: 247px; background:url(../images/bkground-header.gif) no-repeat 0px 24px;}
			#header #welcome {position: absolute; top: 67px; left: 13px;}
		#topnav {position: absolute; top: 36px; right: 8px; margin: 0px; padding: 0px;}
			#topnav li {list-style: none; display: inline; margin: 0px 10px 0px 0px; background: url(../images/bullet-topnav.gif) no-repeat 0px 4px; padding: 0px 0px 0px 14px;}
			#topnav li a { text-decoration: none; color: #636363}
			#topnav li a:hover { text-decoration: underline; color: #000; }
		#menu {position: absolute; top: 185px; left: 12px;}
			#menu img { float: left; }
			#menu a { color: #fff; }
		#content {float: right; width: 575px; margin: 0px 27px 0px 0px;}
			#content ul, ol { margin: 10px 0px 10px 30px; padding: 0px; }
			#content ul li, ol li { line-height: 16px; padding: 0px 0px 5px 0px; }
		#sidebar {float: left; margin: 0px 0px 0px 27px; padding: 0px 0px 10px 0px; width: 215px; background:url(../images/bkground-sidebar.gif) bottom no-repeat; background-color: #e5e5e5;}
			#sidebar p { color: #636363; margin: 5px 0px 5px 10px; }
			#sidebar img { text-align: center; }
			#sidebar #box { margin: 0px auto 0px auto;width: 189px; background: url(../images/bkground-box-content.gif) repeat-y; }
			#sidebar #box-top {background: url(../images/bkground-box-top.gif) no-repeat; width: 189px; height: 11px; }
			#sidebar #box-bottom {background: url(../images/bkground-box-bottom.gif) no-repeat; width: 189px; height: 11px; overflow: hidden;}
			#sidebar ul {margin: 5px 0px 10px 30px; padding: 0px; color: #fff;}
			#sidebar ul a {color: #fff;}
			#sidebar ul a:hover {text-decoration: none;}
			#sidebar ul li {line-height: 18px;}
			#sidebar ul li ul {margin: 7px 0px 7px 17px;}
			#sidebar ul li ul li {}
			
		#menu-bottom-no-graphic {position: relative; margin: 0px 0px 0px 27px;height: 50px;width: 815px; display: block; clear: both; background: url(../images/spacer.gif) left no-repeat;}
			#menu-bottom-no-graphic:after {content: "."; display: block;  height: 0; clear: both; visibility: hidden;}
			#menu-bottom-no-graphic ul {position: absolute; right: 0px; top: 22px; margin: 0px; padding: 0px;}
			#menu-bottom-no-graphic ul li {list-style: none; display: inline; margin: 0px 10px 0px 0px; }
			#menu-bottom-no-graphic ul li a { color: #636363; }
			#menu-bottom-no-graphic ul li a:hover { text-decoration: none; color: #000; }
					
		#menu-bottom {position: relative; margin: 0px 0px 0px 27px;height: 50px;width: 815px; display: block; clear: both; background: url(../images/bkground-menu-bottom.gif) left no-repeat;}
			#menu-bottom:after {content: "."; display: block;  height: 0; clear: both; visibility: hidden;}
			#menu-bottom ul {position: absolute; right: 0px; top: 22px; margin: 0px; padding: 0px;}
			#menu-bottom ul li {list-style: none; display: inline; margin: 0px 10px 0px 0px; }
			#menu-bottom ul li a { color: #636363; }
			#menu-bottom ul li a:hover { text-decoration: none; color: #000; }
		#footer {width: 859px; text-align: left; margin: 0px auto 0px auto; padding: 0px 0px 15px 0px; position: relative;}
			#footer p {margin: 0px; padding: 0px; color: #fff;}
			#footer .grey {color: #d2d2d2;}
			#footer .grey a { color: #d2d2d2; }
			#footer .right {position: absolute; right: 5px; top: 0px;}
			#footer a { color: #fff;}
			#footer a:hover { text-decoration: none; }
		#homepage {}
			#homepage #header {width: 805px; height: 300px; background:url(../images/bkground-header-homepage.gif) no-repeat 0px 24px; }
			#homepage #menu {position: absolute; top: 249px; left: 12px;}
			#homepage #content {float: left; width: 411px; margin: 0px 0px 0px 27px; }
			#homepage #content #member-login { background:url(../images/bkground-member-login.gif) no-repeat; width: 381px; height: 47px; position: relative;}
			#homepage #content #member-login p { margin: 0px; padding: 0px; position: absolute; left: 26px; top:12px;}
			#homepage #content #member-login img {position: absolute; right: 20px; top: 6px;}
			#homepage #sidebar { float: right; margin: 0px 27px 0px 0px; background:url(../images/bkground-sidebar-home.gif) bottom no-repeat; background-color: #e5e5e5; width: 394px; padding: 0px;}
			#homepage #sidebar img {margin: 0px 0px 10px 15px;}
		
/* ---------------------------- */
/* Forms Validation
/* ---------------------------- */

		.lbl { display: block; font-weight: bold; margin: 0px; padding: 0px 0px 2px 0px;}
		.alert { background: url(../images/alert-small.gif) no-repeat 0px -3px; padding: 0px 0px 2px 18px; display: block; margin: 5px 0px 5px 0px; font-size: 11px; position: relative; clear: both; }
		.success, .error {padding: 10px 10px 0px 10px; margin: 10px 0px 15px 0px; font-weight: normal; clear: both; text-align: left; position: relative;}
		.success p, .error p { margin: 0px; padding: 0px; text-align: left; line-height: 18px; color: #000;}
		.error {}
			.error h4 {font-size: 15px; font-family: Arial, Helvetica, sans-serif;padding: 8px 0px 15px 35px; margin: 0px; background: url(../images/alert.gif) no-repeat 0px 0px; color: Red;  font-size: 14px; position: relative;}
		.success {background-color:#c3fbbb;  border:1px solid #abe9a2 }
			.success h4 {font-size: 15px; font-family: Arial, Helvetica, sans-serif;padding: 5px 0px 10px 30px;background: url(../images/success.gif) no-repeat 0px 0px; margin: 0px 0px 0px 0px; color: #000;}
		.progress {padding: 10px 0px 13px 10px; }
			.progress img {float: left; padding: 0px 10px 0px 0px; }
			.progress h4 { font-size: 15px; margin: 0px; padding: 5px 0px 10px 0px; color: Red; font-weight: bold; }
			
/* ---------------------------- */
/* Forms Formatting
/* ---------------------------- */

		#form {}
			#form .left{float:left; padding:0px 5px 0px 0px}
			#form .left-phone{float:left; }
			#form .right-phone{float:left; padding:0px 0px 0px 3px}
			#form .clear{float:none}
			#form .lbl{position:relative; display:block; font-weight:bold; margin:5px 0px 1px 0px; clear:both; color:#000; font-size:12px}
			#form .field {font-size:11px; line-height: 14px; font-family:Arial,Helvetica,sans-serif; margin:0px 0px 3px 0px; padding: 0px; }
			#form label {font-size:12px; padding: 8px 0px 0px 0px;} 
			#form select {font-size:12px; }
			#form h5 {position:relative; font-family:Arial,Helvetica,sans-serif;font-weight:bold; font-size:12px; padding:4px; margin:10px 0px 5px 0px; color:#000; background: #c0cbda; border-bottom: 1px solid #b9d0c8; display:block; clear:both}
			#form select { font-size: 13px; margin: 0px 0px 0px 0px; }
			#form .red{color:red;}
			#form .small{font-size:11px; line-height:14px; margin:5px 0px 5px 0px; color: #666;}
			#form #PreferredContact label { font-size: 12px; }
			#form table { border-collapse: collapse; }
			#form .btn-submit { display: block; margin: 10px 0px 0px 0px; clear: both;}
			#form td, th { text-align: center; }

/* ---------------------------- */
/* Misc
/* ---------------------------- */

		.float-left{float:left; }
		.float-right { float: right; }
		.align-center { text-align: center; }
		.align-left { text-align: left; }
		.align-right { text-align: right; }
		.img-left{float:left; margin:0px 10px 0px 0px; }
		.img-right{float: right; margin: 0px 0px 0px 10px; }
		.margin-left {margin-left: 10px; }
		.margin-right{margin-right: 10px;}
		.margin-top{ margin-top: 10px;}
		.margin-bottom { margin-bottom: 10px; }
		.small{font-size:11px; line-height:14px; }
		.large{font-size:16px; }
		.nodis { display: none; }
		.clear{ clear: both; }
		.highlight { padding: 2px; background-color: #FFFF66; }
		.grey { color: #666; }
		.list-no-style { list-style:none; }


