﻿/* ------- Colors -----------------------------
purple = #005ba1
green = #00A942
green for link rollover = #269936


------------------------------------------------*/
body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#666;
}
#obtutorialxy {
	display: none;
	position: absolute;
	width: 259px;
	height: 155px;
	z-index: 11000;
	background-image: url(images/bg_tutorial.png);
	background-repeat: no-repeat;
	margin-left: 205px;
	margin-top: 170px;
}
#obtutorialx {
	position: absolute;
	top: 3px;
	right: 21px;
	z-index: 11100;
	width: 15px;
	height: 15px;
}
#obtutorial {
	width: 214px;
	height: 145px;
	padding: 10px 15px 0px 20px;

}
#obtutorial h1 {
	display: block;
	background-image: url(images/square.gif);
	background-repeat: no-repeat;
	background-position: left center;
	color: #005CA2;
	font-size: 11px;
	font-weight: bold;
	padding-left: 15px;
	margin: 0px;
}
#obtutorial p {
	font-size: 10px;
	color: #373737;
	padding: 3px 0px 3px 0px;
	margin: 2px 0px 2px 0px;
}
#obtutorial a {
	color: #005CA2;
	font-size: 11px;
	text-decoration: none;
}
#obtutorial a:hover {
	text-decoration: underline;
}
#obtutorial ul {
	margin: 0px 0px 10px 30px;
	padding: 0px;
}
#obtutorial ul li {
	font-size: 10px;
	color: #4c4c4c;
	padding: 0px;
	margin: 0px;
}
img {
	border: 0;
}
a:link, a:visited {
	color: #005ba1;
	text-decoration: underline;
}
a:hover, a:active {
	color: #269936;
	text-decoration: none;
}
h1 {
	color: #005ba1;
	font-family: Verdana, Tahoma, Arial;
	font-size: 16px;
	margin: 0px;
}
h2 {
	color: #00A942;
	font-size: 14px;
	line-height: 28px;
}
h3 {
	color: #00A942;
	font-size: 12px;
	line-height: 28px;
}

h4 {
	color: #666;
	font-size: 12px;
	line-height: 28px;
}

hr {
	border:none;
	height:2px;
	background-color:#E6ECF6;
}

blockquote {
	margin-left: 15px;
	margin-right: 15px;
}
.subTitles {
	color: #005ba1;
	font-family: Verdana, Tahoma, Arial;
	font-size: 12px;
	font-weight: bold;
}

.hidden {display:none;}
.visible {display:inline;}

p strong:first-child {font-size:12px;}
#BGcontainer {width: 100%;}
#container {
	margin: 0 auto;
	border: 0;
	padding: 0;
	width: 935px;
}
#topContainer {
	width: 935px;
	height: 33px;
	background-image: url('images/BG-top.jpg');
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	margin-top:10px;
}
#Logo {
	float: left;
	padding: 13px;
	width:197px;
}
/* ------------------------------------------ Top Right Links ----------------------------------------------- */
#topPhone {
	height: 30px;
	padding: 5px 0px 0px 0px;
	position: absolute;
	top: 0px;
	right: 0px;
}
#topRightLinks {
	color: #005BA1;
    font-size: 10px;
    height: 20px;
    margin-left: -15px;
    width: 240px;
        }
        
#topRightLinks a:link, #topRightLinks a:visited {
	color: #005ba1;
	text-decoration: none;
}
#topRightLinks a:hover, #topRightLinks a:active {
	color: #269936;
	text-decoration: none;
}
#top {
	margin: 0 auto;
	width: 900px;
	background-color: silver;
}
#bottomContainer {
	width: 935px;
	margin-top:3px;
}
#leftSideContainer {
	float: left;
	width: 224px;
}
/* ------------------------------------------ Online Banking ----------------------------------------------- */
#onlineBankingContainer {
	border: 1px #cccccc solid;
	width: 202px;
	background-color: #f6f6f6;
	text-align: center;
	padding: 10px;
	height: 107px;
	background-image: url('images/BG-leftLogin.jpg');
	background-repeat: repeat-x;
	float:left;
}
.onlineBankingTitle {
	color: #005CA2;
	display: block;
	font-family: Verdana;
	font-size: 12px;
	font-weight: bold;
	height: 20px;
	text-align: right;
	margin-right: 10px;
}
.onlineBanking {
	color: #555;
	font-size: 8pt;
	font-family: Verdana, Tahoma, Arial;
	text-align: center;
}
.onlineBanking-AccessID {
	padding: 3px 4px 0 0;
	text-align: center;
}
.onlineBanking-ButtonAndLockContainer {
	padding: 5px 9px 0 5px;
	text-align: right;
}
.onlineBanking-lock {
	float: right;
	padding: 3px 7px 0 0;
}
.onlineBankingLinks {
	font-size: 7pt;
	padding-top: 7px;
	padding-right: 10px;
	text-align: right;
}
.onlineBankingLinks a:link, .onlineBankingLinks a:visited {
	text-decoration: none;
	color: #005ba1;
}
.onlineBankingLinks a:hover, .onlineBankingLinks a:active {
	text-decoration: underline;
	color: #269936;
}
#bottomLeftImage {
	border: 1px solid #CCCCCC;
	font-size: 11px;
	height: 90px;
	line-height: 18px;
	margin-top: 3px;
	padding: 18px;
	width: 186px;
	float:left;
}
.spacer3 {
	height: 3px; *;
	height: 0;
}
#bottomLeftText {
	border: 1px solid #CCCCCC;
	padding: 10px;
	font-weight: bold;
	margin-top: 3px;
	height: 30px;
	float:left;
	width:202px;
}
#rightSideContainer {
	float: left;
	width: 708px;
	margin-left: 3px;
	margin-bottom: 3px;
}
#rightSideContainerSubs {
	border:1px solid #CCCCCC;
	float:left;
	line-height:20px;
	margin-left:3px;
	min-height:770px;
	padding:25px;
	width:656px;
	margin-bottom:3px;
}

/* Mortage content styles*/
#mortgageContentTop {
	width: 150px;
	height: 27;
	float:left;
	background-color:#005ba1;
}
#mortgageContent{
	width: 365px;
	height: auto;
	float:left;
}

#mortgageRates{
	width: 237px;
	height: auto;
	padding:10px 15px;
	float:right;
	border:1px #005ba1 solid;
	border-top:13px #005ba1 solid;
}
#mortgageRates h2, #mortgageForm h2{
	padding:0px;
	margin:5px 0px 10px;
	line-height:14px;
	font-size:14px;
}
#mortgageForm h3{
	padding:0px;
	margin:0px;
}

#mortgageRates table td, #mortgageRates table th{
	text-align:left;
	height:15px;
	line-height:12px;}
#mortgageRates table td{
	}

#mortgageForm{
	width: 227px;
	height: auto;
	padding:10px 20px;
	float:right;
	border:1px #005ba1 solid;
	border-top:13px #005ba1 solid;
	margin-top:13px;
}

/* end Mortage content styles*/
#homePics {
	width: 708px;
	height: 205px;
}

#mainimg{
    overflow: hidden;
    position: relative;
	height:205px;
	width:708px;
}
#mainimg img{
	position: absolute;
	left: 0px;
	top: 0px;
	visibility: hidden;
	opacity: 0;
}
#bottomRightContent {
	padding: 22px;
	border: 1px #cccccc solid;
	margin-top: 3px;
	min-height: 352px; *;
	min-height: 352px;
	_padding: 25px 25px 45px;
	_margin-top: 1px;
}
.welcomeText {
	padding: 15px 0 6px;
}
#HomePageContentBoxesContainer {
	font-weight: normal;
}
#HomePageContentBoxesContainer ul {
	list-style-type: none;
	margin: 10px 0 0 -36px;
*	margin: 10px 0 0 3px;
}
#HomePageContentBoxesContainer li {
	padding-bottom: 4px;
}
#HomePageContentBoxesContainer a:link, #HomePageContentBoxesContainer a:visited {
	text-decoration: none;
	color: #777;
}
#HomePageContentBoxesContainer a:hover, #HomePageContentBoxesContainer a:active {
	text-decoration: underline;
	color: #269936;
}
.content {
	float: left;
	text-align: left;
	width: 655px;
	line-height:20px;
}
.content img:first-child {
	float: right;
	margin:0 0 10px 30px;
}

.hcontent {
	float: left;
	text-align: left;
	width: 450px;
	line-height:20px;
}
.rightcol {
	float: left;
	width: 190px;
	margin-left: 22px;
}
/* ------------------------------------------ Footer Styles ----------------------------------------------- */
#footerLine {
	width: 935px;
	text-align: center;
	padding: 0;
	margin-top: 3px;
}
#footer {
	width: 935px;
	font-family: Verdana, Tahoma, Arial;
	font-size: 8pt;
	color: #00a942;
	text-align: right;
	padding: 7px 0px;
}
#footer a:link, #footer a:visited {
	color: #00a942;
	text-decoration: none;
}
#footer a:hover, #footer a:active {
	color: #098339;
	text-decoration: none;
}
.FDICandEHL {
	float: right;
}
.footerLinks {
	float: left;
	padding: 4px 0;
	text-align: left;
	width: 650px;
}
#ratesTable {
	margin: 0;
	font-size: 9pt;
}
.clear {
	clear: both;
}
.invisible {
	border: 0;
	height: 0;
	width: 0;
	display: none;
}
.tableContent {
	font-size: 8pt;
}
.tableHeader {
	background-color: #39b44a;
	color: #fff;
	font-weight: bold;
	text-align: center;
}
.dividerLine {
	border-bottom: 1px #ccc dotted;
	width: 100%;
	height: 1px;
}

/******************* Main Navigation****************/
#nav {
	margin-top: 3px;
	width: 224px;
}
#nav ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	z-index: 1;
}
#nav ul li {
	float: left;
	position: relative;
	z-index: 1;
}
#nav a {
	background-image: url('images/BG-leftNav.jpg');
	background-repeat: repeat-x;
	line-height:35px;
	margin:0;
	position:relative;
	z-index:200;
	font-family: Verdana;
	font-size: 12px;
	color: #005ba1;
	text-decoration: none;
	font-weight: bold;
	display: block;
	height: 35px;
	width: 222px;
	border-left: 1px #ccc solid;
	border-top: 1px #ccc solid;
	border-right: 1px #ccc solid;
	text-indent:35px;
}
#nav a:hover {
	font-family: Verdana;
	font-size: 12px;
	color: #269936;
	text-decoration: none;
	font-weight: bold;
	background-image: url('images/BG-leftNav.jpg');
	background-repeat: repeat-x;
	display: block;
	height: 35px;
	width: 222px;
}
#nav ul li ul {
	float: none;
	position: absolute;
	width: 194px;
	height: auto;
	left: -999em;
	margin: 0px;
	padding: 1px 0px 0px 0px;
	list-style: none;
	background:url("images/subnav_ul_arrow.png") no-repeat scroll 0 0 transparent;
}
#nav ul li ul li {
	height: 33px;
	width: 180px;
	margin-bottom:0px !important;
	border:0px;
}

#nav li li a {
	background:url("images/subnav_ul_back.png") no-repeat scroll 0 0 transparent;
	font-size: 11px;
	line-height: 30px;
	height: 33px;
	width: 182px;
	margin-left:12px;
	text-indent:25px;
}
#nav li li a:hover {
	color: #fff;
	background:url("images/subnav_ul_back_on.png") no-repeat scroll 0 0 transparent;
	border:0px;
	text-indent:25px;
	font-size: 11px;
}

/*************** Nav (Special Positioning) */
/* New Magic */
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul {
	left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul {
	top: 0px;
	left: 210px;
}
#nav ul li#navAbout:hover ul {
	top: -166px;
}
#nav ul li#navCalc:hover ul {
	top: -59px;
}
#nav ul li#navEdu:hover ul {
	top: -146px;
}
#nav ul li#navEdu:hover ul ul {
	top: -1px;
}
#nav ul li#navOnline:hover ul {
	top: -79px;
}
#nav ul li#navAccess:hover ul {
	top: -117px;
}
#nav ul li#navIns:hover ul ul {
	top: -1px;
}
#nav ul li#navIns:hover ul {
	top: -88px;
}
#nav ul li#navEdu:hover ul li#navMortgageLoans ul {
	top: -108px;
}
#nav ul li#navIns:hover ul li#navLife ul {
	top: -99px;
}
#nav ul li#navAccess:hover ul li#navByPhone ul {
	top: -1px;
}
/******************************************************************/
/*tables*/
/**/

.styledtable th {
	padding: 7px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #ffffff;
	background-color: #D7DCE8;
	text-align: center;
	color:#005BA1;
}
.styledtable th a {
	color:#025949;
}
.styledtable th a:hover {
	color:#FFFFFF;
}
.styledtable td {
	padding: 7px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #ffffff;
}
.styledtable td:hover {
	padding: 7px;
	color:#000000;
	border-bottom-color: #024080;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	background-color: #D7DCE8;
}

.styledtable td:hover h4 {
	color:#fff !important;
}

.styledtable caption {
	padding: 7px;
	font-size: 11px;
	color: #FFFFFF;
	text-align: left;
	font-weight: bold;
	margin-top: 15px;
	background-color: #005BA1;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #ffffff;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ffffff;
}
table.styledtable.bordered {
	background-color: #ffffff !important;
	border: 1px solid #D7DCE8;	
}
table.styledtable.bordered td {
	bbbbackground-color: #ffffff !important;
	border: 1px solid #D7DCE8;	
}
table.styledtable.bordered th {
	border: 1px solid #D7DCE8;	
}
.odd {
	background-color: #8eb7af;
}
.even {
	background-color: #ffffff;
}

/*content*/

.contentIntro {
	float: left;
	width: 437px;
}
.contentRight {
	float: right;
	width: 193px;
}

body.history hr {
background-color:#E6ECF6;
margin:0px;width:100%;
padding:0px;float:left;
}

body.history h2 {
float:left;
width:646px;
}

body.history p {
float:left;
line-height:18px;
width:550px;
}

.contentIntro p {
width:350px !important;
}

body.history img {
margin:0 10px 10px 0;float:left;
}

/**/

body.community h2 {
border-bottom:2px #00A942 solid;
}

/* calculators*/

table.calcTable {
width:631px;
background-color:#E5ECF6;
}
table.calcTable th {
text-align:left;
}

table.calcTable div {
margin:0 20px;
width:571px;}
table.calcTable div div {
margin:0;
}

table.calcTable div table.calcLeft {
float:left; margin-right:10px;}

table.calcTable div table.calcLeft td, table.calcTable div table.calcRight td {
height:25px;
}

table.calcTable div table.calcRight {
float:left; margin-left:10px;}


/* contact form*/
.cforms {width:600px;}
.cforms td {padding: 3px;}
.cforms td a {color:#00A942}
.cforms td a:hover {color:#fff;}
/* mortgage form*/
.cforms2 {width:227px;}
.cforms2 table td, .cforms2 table th {line-height:14px;padding: 2px; text-align:left;}
.cforms2 td a {	color:#00A942}
.cforms2 td a:hover {color:#fff;}

/* Personal Banking Section*/

body.perBank img:first-child {float:right;}

/* SOCIAL NETWORKS */
#Logo p, body.history #Logo p {
	font:bold 17px/20px Arial, Helvetica, sans-serif;
	color:#0168B3;
	text-align:center;
	margin:10px 0 0 0;
	float:none;
	width:auto;
}
.social {
	overflow:hidden;
	margin:8px 0 0;
}
.social li {
	float:left;
	margin-right:8px;
	list-style:none;
}
.social li a {
	width:32px;
	height:32px;
	display:block;

}
.facebook a {
	background:url("images/facebook2.png") no-repeat;	
}
.twitter a {
	background:url("images/twitter2.png") no-repeat;	
}
.blog a {
	background:url('images/blog.png') no-repeat;
}



