/*The Bank of St. Elizabeth's website Prepared by Casey Fick */ /* 1. General -------------------------------------------*/ * { margin: 0; padding: 0; line-height: 1.4; font-style: normal; font-weight: normal; } .group:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} body {font: normal 62.5% Arial, Arial, Helvetica, sans-serif; background: #4d5255 url(../images/body_backer.gif) repeat-x;} h1 { font-size: 34px; color: #9b9da0; font-family: Arial Narrow, Arial, sans-serif; line-height: 1; margin: 0 0 20px; width: 736px; } #mainleft h1, #sub h1 { width: auto; font-size: 30px; } h2 { font-size: 18px; font-weight: bold;} h2 a { font-size: 18px; text-decoration: none; } h3 { font-size: 16px; color: #333; margin: 0 0 6px; line-height: 1.2; } h3 a { text-decoration: none; line-height: 1.2; } h4 { color: #373737; font-size: 11px; font-family: Arial, Verdana, sans-serif; font-weight: bold; text-transform: uppercase; display: block; margin: 0 0 4px; clear: both; } h4 a { font-weight: bold; } h5 { font-size: 13px; color: #333; margin: 0 0 10px; font-weight: bold; } h5 a { font-weight: bold; } h6 { font-size: 11px; color: #333; margin: 0 0 8px; font-weight: bold; } h6 a { font-weight: bold; } p, ul, dl, ol { font-size: 13.5px; margin: 0 0 1.5em; color:#333333; } ul, ol {margin-left: 1.5em;} p { line-height: 1.6; font-family: Arial, Helvetica, sans-serif; } strong{font-weight: bold;} ol { margin-left: 1.5em; } ul li { list-style-type: none; background: transparent ; padding-left: 0px; } #content ul li, #content ol li { margin-bottom: 3px; } a {text-decoration: none; color:#0066CC;} strong a {font-weight: bold;} a:hover, a:focus {text-decoration: underline; color: #CC3300;} /* 2. Global combos-----------------------------------------*/ #mast h1 a, #nav-online a, #nav-investments a, #nav-publication a, #nav-deposit a, #nav-more a, #main-nav li a, #tools-account a, #tools-wizard a, #tools-calcs a, #tools-worksheet a, #tools-dcupdate a, #footer h2 { display: block; text-indent: -9999px; background-color: transparent; background-position: 0 0; background-repeat: no-repeat; } #tools-account a, #tools-wizard a, #tools-calcs a, #tools-worksheet a, #tools-dcupdate a {border:1px solid #d0d0d0; width: 285px; height: 35px;} /* 3. Structure-----------------------------------------*/ #header, #header-wrap, #intro, #content-wrap, #content, #footer { width: 901px; margin: 0 auto; background:none; } #header {position: relative; background: none; } /* 4. Header---------------------------------------*/ #header-wrap {clear: both;} #header { margin: 0; position: relative; z-index: 500; } #header #search {background-image: none; width: 400px;} #header li { background: none; padding-left: 0; } #mast { background: none; margin:0; padding: 5px 0px 10px 0px; } #mast img#logo{position: relative; float: left; width: inherit; height: inherit; } #mast a img {border: none;} #mast div#mast-right {float: right; position:relative; margin-top: 15px; width: 325px;} #mast-right div#home {float: right; text-align: right;} #mast img.clock{float:right; margin-top: 8px;} #clock { color: #666666; font-size: 12px; padding: 2px 4px; font-weight: bold; float: right; margin-top: 8px;} div#home img {margin: 0; text-align: right;} #mast img {float: left; margin: 10px 10px 0 0;} #mast h2 {float: right;width: 275px; text-align: right; font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #000; height: 20px; font-weight:bold;} #mast img.home {float: left;} #main-nav { position: relative; bottom: 0; width: 901px; background-image: url(..../images/nav_backer.gif) height: 90px; margin-top: 1.5em; z-index: 500;} #main-nav li { float: left; } #main-nav li a { height: 44px;} #nav-online, #nav-investments, #nav-loan, #nav-deposit {margin-right: 37px;} #nav-online a { background-image: url(../images/online_services.gif); width: 150px;} #nav-loan a { background-image: url(../images/loan_services.gif); width: 150px;} #nav-investments a { background-image: url(../images/investment_services.gif); width: 150px;} #nav-deposit a { background-image: url(../images/deposit_services.gif); width: 150px;} #nav-more a { background-image: url(../images/more.gif); width: 150px; } #nav-online a:hover, #nav-online a:focus, #nav-investments a:hover, #nav-investments a:focus, #nav-loan a:hover, #nav-loan a:focus, #nav-deposit a:hover, #nav-deposit a:focus, #nav-more a:hover, #nav-more a:focus { background-position: 0 -46px; outline: none;} /* 5. content--------------------------------------*/ #content-wrap {width: 901px; margin: 0 auto; min-height: 315px; margin-top: 2em; position: relative; z-index: 200;} #content-wrap.secondary {background: #f8fafb; clear: both; position: relative; z-index: 200;} #content-wrap.secondary:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} #content-wrap embed{ z-index: 1000; position:absolute;}/*for FF flash background embed*/ #content-wrap object{ z-index: 1000; position:absolute;}/* for IE flasch background object*/ #content {position: relative; z-index:200;} #content h2.pageheader {font-size: 20px; border-bottom: 1px solid #CCCCCC; margin: 0 20px; padding-top: 20px;} #mainleft { float: left; padding: 18px 2px 10px 20px; width: 575px; } #mainleft:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} #mainleft h2 {font-size: 30px; width: 100%; font-family: Georgia, "Times New Roman", Times, serif; color: #333333; font-weight: normal;} #mainleft h3 {font-size: 18px; font-family: Georgia, "Times New Roman", Times, serif; color: #cccccc; font-weight: normal; color: #77787B;} #mainleft img {padding: 0; margin: 0;} object {z-index: 1000; position: relative; margin-top: -175px;} #indent {margin: 10px 8px 10px 0px;} #indent h3 {font-size: 20px;} #indent div.column1 {float: left; width: 275px;} #indent div.column2 {float: right; width: 275px;} #indent img {padding: 5px; border: 1px solid #999999; background: #F3F1F1; color:} #indent img.floatLeft {float: left; margin-right: 10px; margin-bottom: 15px; clear:both;} #indent img.floatRight {float: right; margin-left: 10px; margin-bottom: 15px; clear: both;} #indent p.caption {font-size: 11px; color:#333333;} #indent ul {list-style-type: square;} #indent ul.items {margin: 0;} #indent ul li {list-style-type: square; list-style-position: outside;} #indent ul ul {margin: 10px 0 10px 0;} #indent ul ul, #indent ul ul li {margin: 0 0 0 15px; list-style-type: disc;} #indent ul.none {list-style-type: none; margin:0;} #indent ul.none li {list-style-type: none; } #indent ul.none ul {list-style-type: none;} /*use the following styles for list items with images floating left and supporting text (or links) floating right...such as on the TextCaster page*/ #indent ul.items li.callout {list-style-type: none; float: left; padding: 12px 0 8px 15px; width: 100%;} li.callout {background: #F3F1F1;} li.callout:hover {background: #E3E2E2;} li.callout * {width: 435px; float: right;} li.callout *.thin {width: 310px; margin-right: 30px;} li.callout *.thin p {margin: 0;} #indent li.callout div.thin ul{margin: 0; font-size: 13px; margin-bottom: 1.5em;} li.callout *.mid {width: 375px; margin-right: 30px;} li.callout *.wide {width: 500px;} li.callout *.left {width: auto; float: left; margin: 10px 0 0 5px;} li.callout * * {width: auto; float:none;} li.callout img {float:left; width: auto;} li.callout div.right * {float: left width: 100px; } li.callout div.left * * {float: none; width: auto;} li.callout h3.links {margin-top:35px;} li.callout h3.menu {margin-top: 15px;} #indent li.callout h3, li.callout a:hover {color: #0066CC;} li.callout a:hover, li.callout div.mid a:hover {text-decoration: underline;} /*use the following styles for list items with images floating left and supporting text (NO LINKS) floating right...such as on the About Us page*/ #indent ul.items li.calloutnone {list-style-type: none; float: left; padding: 12px 0 25px 15px; width: 100%;} #content ul li.calloutnone {background: none; border-bottom: 1px solid #cccccc; margin-bottom: 1.5em; padding-bottom: 1.5em;} li.calloutnone * {width: 435px; float: right;} li.calloutnone *.thin {width: 310px; margin-right: 30px;} li.calloutnone *.thin p {margin: 0;} #indent li.calloutnone div.thin ul{margin: 0; font-size: 13px; margin-bottom: 1.5em;} li.calloutnone *.mid {width: 375px; margin-right: 30px;} li.calloutnone *.mid h3 a:hover {text-decoration: underline;} li.calloutnone *.wide {width: 500px;} li.calloutnone *.left {width: auto; float: left; margin: 10px 0 0 5px;} li.calloutnone * * {width: auto; float:none;} li.calloutnone img {float:left; width: auto;} li.calloutnone div.right * {float: left width: 100px; } li.calloutnone div.left * * {float: none; width: auto;} li.calloutnone h3.menu {margin-top: 15px;} #indent li.calloutnone h3, li.calloutnone a:hover {color: #0066CC;} li.calloutnone a:hover, li.calloutnone div.mid a:hover {text-decoration: underline;} #indent h4 {font-size: 14px; margin: 15px 0; text-transform:none; background-color:#CCCCCC; padding: 6px; margin-bottom: 0px; border-bottom: 1px solid #999999;} #indent ul.table{width: 100%; list-style-type:none; margin: 0; font-size: 12px;} #indent ul.table li {border-bottom: 1px solid #999999; list-style-type: none; padding: 6px 4px; margin: 0;} #indent ul.table li.odd {background-color:#EDEBEB; } #indent ul.table li.nobord {border-bottom: 0px;} #indent img.small {border: none; background: transparent; padding:0; vertical-align: bottom;} #indent ul.map {margin: 0;} #indent ul.map li {border: 0; margin: 0; list-style-type: none; padding: 3px 0 3px 16px; background: #fff; border-bottom: 1px solid gray; } #indent ul.map li.header {background: #cccccc; color: #ffffff; padding-left: 8px; font-weight: bold;} #indent ul.map li.header a {font-weight: bold;} #map_canvas {border: 1px solid gray; margin-bottom: 1em;} #map_canvas div ul {font-size: 12px; margin: 10px 0 0 0; padding:10px 0 0 0;} #map_canvas div ul li {margin: 0;} #map_canvas img {float: left; margin: 0 0 10px 0;} #sub {width: 250px; float: right; margin-right: 20px; position: relative; border: 1px solid #b1afaf; margin-top: 20px; min-height: 130px; padding: 5px; background: url(../images/login_backer.gif) repeat-x scroll 0% 50%; } #sub.home { z-index: 1001; width: 250px; float: right; margin-right: 20px; position: relative; border: 1px solid #b1afaf; margin-top: 20px; min-height: 130px; padding: 5px; background: url(../images/login_backer.gif) repeat-x scroll 0% 50%; } #sub .topper {padding: 3px; border-bottom: 1px solid #b1afaf; height: 25px;} #sub .topper h2 span {float: left; width: 185px; color: #000000; font-family:Arial, Helvetica, sans-serif; font-size: 16px; font-weight:bold;} #sub .topper h2 img {width: 18px; height: 18px; margin: 0 0 -3px 5px; float:right;} #sub h3.user {font-size: 13px; font-family:Arial, Helvetica, sans serif; text-transform: uppercase; color:#CC6600; font-weight: bold; margin-top: 8px; } #sub span.forgot {font-size: 11px; color: #666666; font-family: Arial, Helvetica, sans-serif; margin-left: 5px;} #sub span.forgot a {text-decoration: none; color: #CC6600;} #sub span.forgot a:hover, #sub span.forgot a:focus { text-decoration: underline;} input.shadow {padding: 3px; font-size: 13px; font-family:Arial, Helvetica, sans-serif; color: #999999; height: 15px; width: 90%; margin-top: 4px;} input.submit {height: 25px; border:none; background-color:#666666;} #sub input.submit {height: 30; border:none; background: #d06506 /*url(..../images/submit_backer.gif) repeat-x*/; color: #fff; font-size: 10px; margin-top: 10px; width: 85px; font-weight:bold;} #sub input.submit:hover, input.submit:focus {background: #a14e04} #tools-list { position: absolute; margin: 0; bottom: 0; width: 293px; padding:0;} #sub ul {padding:0; margin:0 0 0 0;} /* 6. products tray--------------------------------------*/ #product-wrap {clear:both; padding: 0 15px;} #product * {margin:0;} #product {position: relative; margin: 0 0 .5em 1em; height: 135px; float: left;} #product ul {display: inline; font-family:Arial, Helvetica, sans-serif; color:#333333; margin-bottom: 1.5em;} #product ul li { width: 165px; min-height: 115px;padding: 5px 8px; border-right: 1px solid #b1afaf; float:left; position: relative; margin-right: 7px;} #product li h2 {font-size: 15px; color:##4B4F5B; margin: 0pt 0pt 5px; text-indent: 0; line-height: 17px;} #product li img {float: left; margin: 0px 9px 35px 0pt;} #product li p {font-size: 12px; line-height:17px; margin-top: 0pt; padding: 0pt !important;} #product li p.link {font-size: 11px; margin-top: 7px; padding: 0pt !important;} p.link a {color: #C73318; text-decoration: none; font-weight: bold;} p.link a:hover, p.link a:focus {text-decoration: underline;} #product ul.links {display: block; float:right;} #product ul li {margin-bottom: 10px; display: block;} /* 7. footer--------------------------------------*/ #footer-wrap {clear:both;} #footer {height: 150px; background: #000000 url(../images/footer_backer.gif) repeat-x; border-bottom: 5px solid #000; padding-top: 10px;} #footerhome {margin-top: 5em;} #footer h2 {line-height:0;} ul.links {float: right; position: relative; width: 125px; margin: 10px 0 10px 0;} ul.links li {font-size: 12px; color:#333333;} ul.links li a {text-decoration: none; color: #333333;} ul.links li a:hover, ul.links li a:focus {text-decoration: underline;} ul.logo-list {display: inline; float:right; position: relative; margin: 0 1em 0 0;} ul.logo-list li {display: inline;} ul.logo-list img{border: none;}