/*
    This style sheet was designed by Fred Dearman for the Orlando Jug website
    4-2-2007.

    This code has been decoupled from other sheets and only uses the generic
    style sheets "generic" "navigation" and "header".   Future code breakers
    "should be" easier to find because the source is confined to this sheet.
    Other errors would show up on all sheets that use the OJUGMaster2.css.
    Using the id in the body tag forcibly makes the styles localized to this sheet

    Current Design: 2007-07-25 by Fred Dearman (3rd redesign)
    Contact info:  FredzDearman  AT gmail  DOT com
    Design Standards of CSS 2.1 applied along with HTML 4.01
*/
div#DDMWrap {
   float: left;
   border-top:    1px solid black;
   border-bottom: 1px solid black;
   font-size: 1em;
   background-color: #FFCCFF;
   margin: 0.5em 0 0 0.5em;
   }
div#DDMWrap ul {
    margin:0;
    padding: 0;
    }
div#DDMWrap ul li {
    float:left;
    background-color: #C5C5C5;
    border-right: 1px solid #456;
    position: relative;
    padding: 0em 0.5em;
    }
div#DDMWrap ul li:first-child {
    border-left: 1px solid #456;
    }
div#DDMWrap ul li a {
    font-variant: small-caps;
    padding: 0em 0.5em;
    color: #1C3E56;
    background-color: #C5C5C5;
    }
div#DDMWrap ul li a:hover {
    background-color: #888;
    color: #FFF;
    margin: 0;
    padding: 0 0.5em;
    }
/*
    this explicit strong selector was required to add
    to the top level UL w/o affecting the lower level anchors
    particularly with the padding/margins specified for the li's
*/
#MeetingMins04to07 div#DDMWrap ul li#expandLink a:hover {
    margin: 0 -0.5em;
    padding: 0 1em;
    display: block;
    }
#MeetingMins04to07 div#DDMWrap ul li#expandLink a {
    display: block;
    }
/*
    the disappearing act is accomplished by
    now you don't see it, when you hover, you do
    either display: none or block
*/
div#DDMWrap ul li ul {
    width:  4.0em;   /* change this req's changing the next ul margin */
    margin:   0;
    position: absolute;
    top: 1.1em;
    left: -1px;
    display:  none
    }
div#DDMWrap ul li:hover ul{
    display: block;
    }
div#DDMWrap ul li:hover {
    background-color: #D2D2D2;   /* middle grey shade */
    color: #000;
}
div#DDMWrap ul li ul li {
    width: 100%;
    border-left:   1px solid teal;
    border-right:  1px solid teal;
    border-bottom: 1px solid teal;
    line-height: 1.5em;
    }
div#DDMWrap ul li ul li:first-child {
    border-top: 1px solid teal;
    }
div#DDMWrap ul li ul li ul li:first-child {
    border-left: 0;
    }
div#DDMWrap ul li   ul li   ul {
    visibility: hidden;
    margin-left: 4.8em; /* ul width + border */
    top: -1px;         /* req'd for alignment */
    width: 43em;
    padding-top: 0.1em;
    }
div#DDMWrap ul li ul li:hover ul {
    visibility: visible;
    }
.DDMboxTop {
    background-image: url(images/revTop4.png);
    background-repeat: no-repeat;
    background-position: bottom left;
    height: 2.5em;
    }
.DDMboxTile {
    background-image: url(images/revTile4.png);
    background-repeat: repeat-y;
    background-position: top left;
    }
.DDMboxBot {
    background-image: url(images/revBot4.png);
    background-repeat: no-repeat;
    background-position: bottom left;
    height: 2.5em;  /* creates a gap if taller */
    }

/*
    the width of li and font size are highly coupled
*/
div#DDMWrap ul li   ul li   ul li {
    float: left;
    border: none;
    width: 55em;
    background-color: transparent;
    padding: 1em 3em 0em 3em;
    font-size: 0.7em;
    left: 5px;
/*
    adding a top offset screws up the horizontal contact of the mouse
*/
    }
div#DDMWrap ul li  ul li  ul li:first-child {
    border-top: none;
    }
div#DDMWrap ul li   ul li   ul li:hover {
    background-color:  transparent;
    }
    /*
    the secondary content is mis-named and needs to be changed later and/or
    moved to the generic set of code.  Meanwhile, it works for this page
    */
 #SecondaryContentWrap {
    width: 90%;
    float: left;
    padding: 0.0em;
    text-align: center;
    color: #005;
    margin-top: .0em;
    }
.SecondaryContentItem {
    margin: 0em -.1em .75em 0;
    background-color: #F8F8F8;
    padding-bottom: 1em;
    padding-top: 0;
    }
.SecondaryContentItem a {
    display: block;
    position: relative;
    color: #005;
    width: 81%;
    padding: .5em 1em; /* inside the link box */
    margin: -0.5em 0 0.25em 50%; /* otherwise background creeps over header */
    background-color:#C5C5C5;
    font: 0.9em verdana, arial, sans-serif;
    border: 1px solid black;
    left: -47%;
    }
 .SecondaryContentItem a:hover {
    background-color: #888888;
    color: #FFF;
    }
 .SecondaryContentItem ul li {
    display: block;
    }
