/* public_3col.css   Style sheet for standard three column web page
    with drop-down menus for on-line banking. 

    Adapted from "Stylin' with CSS: A Designer's Guide," 
    by Charles Wyke-Smith. 2005. New Riders, pp 162 -166. */

/* start setup of main page layout */
body {font-family: verdana, helvetica, arial, sans-serif;
    font-size: 100%; text-align: center;
    behavior:url(/css/csshover2.htc);}

* {margin: 0; padding: 0;}

/* this div permits us to center the page even when the 
   user has set a high video resolution */
div#mainwrap {min-width: 770px; max-width: 980px;
    margin-left: auto; margin-right: auto;
    /* I.E. doesn't handle max-width. Hence this Javascript hack. */
    width: expression(Math.min(parseInt(this.offsetWidth), 980) + "px");}

div#header {width: 800px; height: 146px;
    border: 2px solid #E60;
    margin-left: auto; margin-right: auto; /* force
    the header to be centered in Mozilla */
    overflow: hidden; margin-top: 6px; margin-bottom: 0px;}

div#threecolwrap {float: left; width: 100%; text-align: left}

div#twocolwrap {float: left; width: 100%;
    display: inline; /* stops IE doubling  margin on float*/
    margin-right: -180px;} 

div#column1 {float: left; width: 176px;
    display: inline; /* stops IE doubling  margin on float*/
    font-size:.8em; overflow: hidden;
    background-color: #FFF;}

div#column2 {width: auto; margin: 0 187px 0 187px;
    border: 2px solid #BBB; }

div#column3 {float: left; width: 180px;
    font-size:.8em; overflow: hidden;
    background-color: #FFF;}

div#footer {width:100%;	clear: both; float:left;
    background-color: #090; text-align: center;
    margin-top: 10px; margin-bottom: 10px;
    padding-top: 3px; padding-bottom: 3px;
    color: #FFF;}
/* End Main page layout */

/* Column 1 CSS */
div#column1 p {font-size: 1em; font-weight: normal;
    padding: 8px 8px 8px 8px;
    text-align: left;}

div#column1 h2 {border: 2px solid #BBB; 
    background-color: #9FF; text-align:center;
    margin-top: 5px;
    padding: 3px 0 3px 0;
    font-size: 1em; }

div#column1 ul {margin-left: 2em; list-style-type: disc}

div#column1 img {border: none; padding: 0; float: right;}

div#column1 a.button { display:block; margin: 15px 35px 15px 35px;
    padding: 2px 6px 2px 6px; 
    text-align:center; text-decoration: none;
    border: 1px solid #069; color: #000;
    background-image: url(/images/button_green.jpg); }

div#column1 a.button:hover   { color:#000; background-image: url(/images/button_yellow.jpg); }

/* Column 2 CSS */
div#column2 p {font-size: .8em; font-weight: normal;
    padding: 8px 8px 8px 8px;}
div#column2 p.subheader {font-size: .9em; font-weight: bold;
    padding: 8px 8px 2px 8px; text-decoration: underline;}
div#column2 p.anuncio {font-size: 1.2em; font-weight: bold;
    padding: 8px 0px 8px 0px; color: darkgreen;
    margin: none;  text-align: center; overflow: hidden;}

div#column2 img {border: none; padding-left: 8px; float: right;}

div#column2 h2 {border-bottom: 2px solid #BBB; 
    background-color: #FBB; text-align:center;
    padding: 3px 0 3px 0;
    font-size: 1em; }

div#column2 ul {margin-left: 3em; list-style-type: disc}
div#column2 ol {margin-left: 3em; margin-top: 10px; list-style-type: disc}
div#column2 li {font-size: .8em; font-weight: normal;
    padding-left: 1em; padding-bottom: 1em;}

div#column2 table {width: 100%; empty-cells: show; 
    background-color: #FFF;
    padding: 0 0 0 0;
    border-collapse: collapse; font-size: .8em;}
div#column2 table.yellow { background-color: #FFA;}

div#column2 th { text-align: center; font-weight: bold;
    padding: 3px 5px 6px 5px;}

div#column2 td {text-align: left; padding: 3px 5px 3px 15px;
    border-top: 2px solid #BBB;}
div#column2 td.center { text-align: center; font-size: 1.5em; 
    font-style: italic; }

/* Column 3 CSS */
div#column3 p {font-size: .8em; font-weight: normal;
    text-align: center;}

div#anuncio {border: 2px solid #069; 
    text-align:center;
    margin: 10px 0 10px 0;
    font-size: 1em; 
    width: 175px; 
    overflow: hidden; }

div#anuncio h2 {font-size: 1.2em; font-weight: normal;
    color: #033; }

div#anuncio h3 {font-size: 0.7em; font-weight: normal;
    color: #000; display: inline;}

div#anuncio h4 {font-size: 3.5em; font-weight: normal;
    color: #F00; display: inline;}

div#anuncio p {font-size: .8em; font-weight: normal;
    text-align: center; padding-bottom: 4px;}

/* header and footer CSS */
div#header h1 {text-align: center;}

div#footer a {wisrh: 100%; float: right; color: #FFF; 
    padding-right: 10em; font-size: .9em;}

/* horizontal, dropdown menu */
div#dropmenu {width: 100%; float: left;
    border-top:1px solid #069;
    border-bottom:1px solid #069;
    font-size:.8em;
    background-color:#CCF;
    margin-bottom: 6px;}

div#dropmenu ul {margin:0 0 0 180px;} 

div#dropmenu li {float:left; position: relative;
    list-style-type:none;
    background-color:#9E9;
    text-align: left;
    padding: 0px 0px 0px 0px;
    border-right:1px solid #069;
    background-image: url(/images/button_green.jpg); }

div#dropmenu li:first-child {border-left: 1px solid #069;}

div#dropmenu li:hover {background-color: #FF9; color: #000;
    background-image: url(/images/button_yellow.jpg); }

div#dropmenu li p {float:right;}

div#dropmenu a {text-decoration: none; 
    display: block; color:#000; padding: 2px 6px 2px 6px;}

div#dropmenu a:hover {color:#000;}

/* horizontal menu ends here */

/* the sidemenu starts here */
div#dropmenu ul li ul {
    position:absolute;
    z-index:10;
    margin:0; 
    left: -1px;
    width: 15em;}

div#dropmenu ul li ul li {
    width: 100%; 
    border-left:1px solid #069; 
    border-bottom:1px solid #069;
    border-right:1px solid #069;}

div#dropmenu ul li ul li:first-child {
    border-top:1px solid #069;}

/* make the sidemenu display as the menu is rolled over */
div#dropmenu ul li ul {display: none;} 
div#dropmenu ul li:hover ul {display: block; } 

/* the second level sidemenu starts here */
div#dropmenu ul li ul li ul {visibility: hidden;
    position:absolute; 
    left: 15em;  /* don't delete */
    top: -1px;} 

div#dropmenu ul li ul li:hover ul {visibility: visible;} 

/* end dropdown menu section

/* Add the Alsett Clearing method  for floats */
.clearfix:after { content: "."; display: block;
    height: 0; clear: both; visibility:hidden;}

.clearfix {display: inline-table;}

/* Hide from IE-Mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End Alsett Clearing Method */

/* Begin hacks for IE */
* html div#dropmenu ul {
    float: left;
    border-left:1px solid #069; /*the top edge of the dropdown */
    margin-left: 15px;
	}

* html div#dropmenu ul li ul {
    border-left: 0;
    border-top:1px solid #069; /*the top edge of the dropdown */
    left: -1 px;}

/* the Box Model Hack fixes IE Win 5.5-5.0 problems in
   calculating the size of a box */
* html  div#dropmenu ul li ul li ul { 
    left: 14.8em;
    voice-family: "\"}\""; 
    voice-family: inherit;
    left: 15em;} 

/* End hacks */
