/* private_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: 90%; text-align: center;
    behavior:url(/private/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: 760px; height: 77px;
    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: 180px;
    display: inline; /* stops IE doubling  margin on float*/
    font-size:.8em; overflow: hidden;
    background-color: #CCC;}

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

div#column2 {width: 100%; margin: 0 0px 0 0px;}

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

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 */

p.caption {font-size: 0.9em; font-style: italic;
    color: #700;
    padding: 0px 0px 0px 0px;
    text-align: center;}

/* Column 1 CSS */
div#column1 p {font-size: 0.9em; font-weight: bold;
    color #004;
    padding: 8px 8px 8px 8px;
    text-align: center;}

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

div#column1 img {border: none; margin: 10em 0 0 40px;}

/* Column 2 CSS */
div#column2 h2 {border: 1px solid #333; 
    background-color: #99F; text-align: center;
    padding: 3px 0 3px 0;
    font-size: 1em; }

div#column2 table { width: 100%; }
div#column2 td { text-align: center; 
    padding: 10px 0 10px 0;
    border-bottom: 2px solid #E60; }

/* Column 3 CSS */
div#column3 img {border: none; margin: 14em 0 0 40px;}

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

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

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

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

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;}

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

div#dropmenu li:hover {background-color: #FF9; color: #000;}

div#dropmenu li.active {background-color: #B00; color: #FFF;}

div#dropmenu li p {float:right;}

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

div#dropmenu a.active {text-decoration: none; 
    display: block; color:#FFF; padding: 2px 4px 2px 4px;}

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 */