@charset "utf-8";
/* CSS Document */

/* ------- TABLE OF CONTENTS ---------------

Project:       Mount Vernon Bank
Version:       1.0
Last change:   10/28/08 finished development
Designer:      Matt Johnson 
 
1. Import Reset and Global Styles
2. Structure Style Declarations 
3. Typography Style Declarations

---------- END TABLE OF CONTENTS ----------*/

/* ---------->>> 1. Import <<<-----------*/

/* import the forbin reset style sheet - browser default styles */

html {overflow-y:scroll;} /* Cross browser, validated version way to show vertical scrollbar */
img {float:left}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,pre,form,fieldset,input,p,blockquote,th,td y{margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
cite,code,em,strong,th {font-style:normal;font-weight:normal;}
ul {list-style:none;}
th {text-align:left;}
h1,h2,h3,h4 {font-size:100%;}
q:before,q:after {content:'';}
body {font-family:Arial, Helvetica, sans-serif;}
select,input,textarea{font:99% arial,sans-serif;}
:focus {outline: 0;}
strong {font-weight:bold;}

/* import the forbin global style sheet - contains common styles */

.absolute {position:absolute;}
.relative {position:relative;}
.fixed {position:fixed;}
.static {position:static;}
.bold {font-weight:bold; /* left in because of prior use, but should be using <strong></strong> */}
.italic {font-style:italic;}
.underline {border-bottom:1px solid;}
.nounderline {text-decoration:none;}
.line-through {text-decoration:line-through;}
.highlight {background:#ffc;}
.nopadding {padding:0; }
.noindent {margin-left:0;padding-left:0; }
.nobullet {list-style:none;list-style-image:none;}
.floatRight {float:right;}
.floatLeft {float:left;}
.floatNone {float:none;}
.width100 {width:100%;}
.width75 {width:75%;}
.width50 {width:50%;}
.width25 {width:25%;}
.width66 {width:66%;}
.width33 {width:33%;}
.upperCase {text-transform:uppercase;}
.lowerCase {text-transform:lowercase;}
.smaller {font-size:smaller;}
.larger {font-size:larger;}
.alignLeft {text-align:left;}
.alignRight {text-align:right;}
.alignJustify {text-align:justify;}
.alignCenter {text-align:center;}
.textIndent {text-indent:-9999px;}
.block {display:block;}
.inline {display:inline;}
.inline-block {display:inline-block;}
.imgReplace {display:block; text-indent:-9999px;}
.clear {clear:both;}
.clearfloat { /* this class can be placed on a div or break element and be the final element before the close of a container that should fully contain a float */ clear:both; height:0;font-size: 1px;line-height: 0px;}
.none {display:none;}
.overFlow { overflow:auto;}

/* ---------->>> END Import <<<----------*/

/* ---------->>> 2. Structure <<<-----------*/
/* Body */
body  {text-align: center;  background:url(/images/bg.gif) repeat-x ;background-color:#9c8953;}
#container {width:782px; margin:0 auto; text-align:left; position:relative;} 
/* Header */
#header {padding:0; width:782px; height:115px; /*position:absolute; top:0px;*/}    
   #header #login {background:url(/images/login.jpg); width:185px; height:64px; position:absolute; top:0; right:0; text-align:right; padding:30px 25px 0 0;}
   .enrollLink {font-size:9px; line-height:12px;}
/* Main Content */
#mainContent {margin:0; padding:0; width:780px; height:495px; display:block; border:1px solid #ffffff; position:absolute; top:154px;}

.flashMain {width:254px; height:269px; position:absolute; top:5px; left:4px;} 
.marketingMessage {width:513px; height:269px; position:absolute; top:5px; left:263px;}
.featuredProducts {width:254px; height:211px; position:absolute; top:278px; left:4px;} 
.latestPromotion {width:254px; height:211px; position:absolute; top:278px; left:263px;} 
.featuredTools {width:254px; height:211px; position:absolute; top:278px; left:522px;} 
	
/* Sub Page Content */
#subContent {background:url(/images/subpg_bg.gif) repeat-y;  margin:0; width:772px; display:block; border:1px solid #ffffff; padding:5px 4px 4px 4px;float:left;/*position:absolute; top:154px;*/}
.subpageMain {width:513px;  float:right; /*position:relative; top:5px; right:4px;  background-color:#ffffff;*/ margin-bottom:5px;}
.leftPhoto {width:254px;  float:left;  background-color:#f9f3e2; position:relative; bottom:6px; }
.subFeaturedTools {width:254px; height:211px; /*position:relative; left:4px;*/ }	
.subText {width:493px; /*height:500px; overflow:scroll;*/ padding:10px 10px 10px 10px; text-align:left; }
.sideMenu {width:220px; padding:0; text-align:left; margin:15px 0 10px 30px; clear:both;}
.sideMenu a {color:#000000;}

.map {width:470px; border:1px #CCCCCC solid; padding:0 0 5px 0; margin:0; }

/* Site Map Sub-Navigation */
.topNavigation {float:right; position:relative; bottom:28px; right:5px; color:#CCCCCC;}
.topNavHome a, .topNavHome a:hover{color:#cccccc; text-decoration:none;}
.topNav a{color:#eee0b9; text-decoration:none;}
.topNav a:hover{color:#ffffff; text-decoration:underline;}

/* Featured Tools Navigation */
ul#toolsNav {}
	ul#toolsNav {height:254px; width:210px; float:left;}
	ul#toolsNav li {float:left;}
	ul#toolsNav a {text-indent:-9999px; width:254px; display:block;}
	/*heading*/
	ul#toolsNav li.heading {background:url(/images/tools_top.jpg); height:26px; width:254px; display:block; text-indent:-9999;}
	/*checks*/
	ul#toolsNav li.checks {background:url(/images/tools_checks.jpg); height:31px;}
	ul#toolsNav li.checks a {height:31px;}
	ul#toolsNav li.checks a:hover, ul#toolsNav li.checks_active {background:url(/images/tools_checks_over.jpg); height:31px;}
	/*calculators*/
	ul#toolsNav li.calculators {background:url(/images/tools_calculators.jpg); height:31px;}
	ul#toolsNav li.calculators a {height:31px;}
	ul#toolsNav li.calculators a:hover, ul#toolsNav li.calculators_active {background:url(/images/tools_calculators_over.jpg); height:31px;}
	/*atm*/
	ul#toolsNav li.atm {background:url(/images/tools_atm_locator.jpg); height:30px;}
	ul#toolsNav li.atm a {height:30px;}
	ul#toolsNav li.atm a:hover, ul#toolsNav li.atm_active {background:url(/images/tools_atm_locator_over.jpg); height:30px;}
	/*rates*/
	ul#toolsNav li.rates {background:url(/images/tools_rates.jpg); height:29px;}
	ul#toolsNav li.rates a {height:29px;}
	ul#toolsNav li.rates a:hover, ul#toolsNav li.rates_active {background:url(/images/tools_rates_over.jpg); height:29px;}
	/*weather*/
	ul#toolsNav li.weather {background:url(/images/tools_weather.jpg); height:30px;}
	ul#toolsNav li.weather a {height:30px;}
	ul#toolsNav li.weather a:hover, ul#toolsNav li.weather_active {background:url(/images/tools_weather_over.jpg); height:30px;}
	/*fraud*/
	ul#toolsNav li.fraud {background:url(/images/tools_fraud.jpg); height:34px;}
	ul#toolsNav li.fraud a {height:34px;}
	ul#toolsNav li.fraud a:hover, ul#toolsNav li.fraud_active {background:url(/images/tools_fraud_over.jpg); height:34px;}
	
.error {
	color: #CC0000;
}

#disclaimerBox {width:500px; text-align:left; background-color:#ffffff; border:1px solid #cccccc; padding:15px; margin:10px; float:left;}

/* Footer */
#footer {background:url(/images/footer.jpg) no-repeat; width:782px; height:95px; padding:0px; position:absolute; top:655px;display:block; }
#subFooter {background:url(/images/footer.jpg) no-repeat; width:782px; height:95px; padding:0px; position:relative; display:block; }
#copyright {width:782px; height:95px; padding:0; font-size:11px; color:#333333; line-height:18px; text-align:right; position:absolute; right:15px; top:40px; }
.copylink a{color:#01094f;}
.copylink a:hover{color:#ffffff;}
/* ---------->>> END STRUCTURE <<<----*/

/* ---------->>> 4. TYPOGRAPHY <<<----*/

/* Text */
body 
{font-size:12px; line-height:24px; word-spacing:.12em; letter-spacing:.01em; color:#333333; font-family: Arial, Helvetica, sans-serif;}


h1 {font-family:Georgia, "Times New Roman", Times, serif; font-size:22px; color:#103e70;  margin-bottom:11px;border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #d7891e;}
h2 {font-family:Arial, "Times New Roman", Times, serif; font-size:16px; color:#002e52; padding:0; margin:7px 0 7px 0; font-variant:small-caps;border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #cccccc;}
h3 {font-family: Arial, Georgia, "Times New Roman", Times, serif; font-size:16px; color:#2860bc; padding-top:6px; margin-bottom:4px; font-weight:bold;border-bottom-width: 1px;
border-bottom-style: solid;
	border-bottom-color: #cccccc;}
h4 {color:#69622d; font-variant:small-caps;font-family:Verdana, Arial, Helvetica, sans-serif;}
h5 {color:#2860bc; font-variant:small-caps;font-family:Verdana, Arial, Helvetica, sans-serif;}

.h1_personal {background:url(/images/h1_personal.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_business {background:url(/images/h1_business.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_services {background:url(/images/h1_services.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_investment {background:url(/images/h1_investment.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_info {background:url(/images/h1_info.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_calc {background:url(/images/h1_calculators.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_loans {background:url(/images/h1_loans.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_community {background:url(/images/h1_community.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_weather {background:url(/images/h1_weather.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_fraud {background:url(/images/h1_fraud.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_friends {background:url(/images/h1_friends.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}
.h1_kids {background:url(/images/h1_kids.jpg); background-repeat:no-repeat; width:514px; height:67px; text-indent:-9999px;  margin:0px 0 0px 0; padding:0; position:relative; bottom:5px; right:1px;}

.smallText {font-size:9px;}
.white {color:#ffffff;}




/* Lists */

ul.list li {background:url(/images/dot.gif) top left no-repeat; padding-left:20px;}
ul.listSide li {/*background:url(/images/li_sub.jpg) top left no-repeat;*/ padding-left:25px;}
ul.listSide li a {color:#1564a0;}
ul.listSide li a:hover {color:#002e52;}
ul.listSide li ul li {list-style:none;list-style-image:none;}
ul.listSide li ul li a {color:#333333;}


/* Tables */
table.statement td{padding:3px; border:1px solid #cccccc;}
table.rates td{padding:3px;}
tr.odd {background-color:#f6fcfe; border-bottom:1px solid #f1f1f1;border-top:1px solid #f1f1f1;;line-height:30px;padding-top:4px;}
tr.even {line-height:30px;padding-top:4px;}
/* Forms */
.forminput {margin:0px 4px 4px 4px;}
.radio {margin-bottom:-1px; margin-left:5px;}
.checkbox {margin-left:35px;margin-right:10px; vertical-align:middle;}
textarea {margin:10px 0px;}
.requiredField {
	padding:1px;
	border:1px solid #a5acb2;
	background-color:#f6f7f7;
}
.formoutput {font-size: 11px; font-family:  Arial, Helvetica, sans-serif; color: #ffffff; border: 1px #023971 solid; background-color : #c47516; font-weight: bold;padding:2px;}
.formoutput:hover { color: #ffffff; border: 1px #333333 solid; background-color : #023971;}
#htmlForm {border:1px solid #cccccc; padding:5px; background-color:#fcf9f0;}
/* Links */
a, a.back {color:#01094f;}
a:hover, a.back:hover {color:#103e70;}
a.nolink, a.nolink:hover {color:#666666; text-decoration:none; cursor:text;}

/* ---------->>> END TYPOGRAPHY <<<---*/

/* MyPic Cards */

#MyPicContainer {
    width: 490px;
}

#left {
    float: left;
    width: 160px;
}

#middle {
    padding: 0 170px 0 165px;
}

#right {
    float: right;
    width: 160px;
}

.changes { line-height:12px; font-size:9px; padding:10px;}
