/**** navbar code ****/
/* modified January 14, 2010 to substitute secure locations
 * for the .gif icons, which will enable our support.php page
 * to be viewed as a secure web page.
*/
img.navtop { /* this is special for the top of the navbar */
    display: block;
    margin: 18px auto 25px auto;
    padding: 0;
    border: 4px inset #999;
    width: 130px;
}
#navbar {
    position: fixed;
    left: 0;
    top: 0;
    width: 175px;
    height: 100%;
    margin: 0;
    padding: 0;
    background: url(https://www14.cruzio.com/w14a136/backgrounds/texture_lt_blue.jpg);
    z-index: 1000; /* don't want anything above navbar */
}
#navbar ul {
    width: 174px;
    list-style: none;
    border-bottom: 1px solid #adf;
    z-index: 10;
    padding: 0;
    margin: 0;
}
#navbar a {
    display: block;
    text-decoration: none;
    border-top: 1px solid #adf;
    border-left: 1px solid #adf;
    width: 174px;
    padding: 21px 0 0 0; /* reveals only 1/3 of background gif */
    outline: none;       /* gets rid of firefox's dotted box */
}
/* add to the following list for new links to be added to the
 * navbar.  each gif is 174px wide by 90px high; the top 30px
 * is the link image, the middle 30px is the hover image, and
 * the bottom 30px is the "you are here" image.  it is easy to
 * use gimp to make one of these gifs. this is the "pixy" method,
 * described on page 229ff of mc farland's book.
 */
#navbar a.homelink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/home.gif) no-repeat;
}
#navbar a.wholink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/who.gif) no-repeat;
}
#navbar a.contactlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/contact.gif) no-repeat;
}
#navbar a.supportlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/support.gif) no-repeat;
}
#navbar a.linklink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/links.gif) no-repeat;
}
#navbar a.inducedlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/induced.gif) no-repeat;
}
#navbar a.raillink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/rail.gif) no-repeat;
}
#navbar a.placeslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/places.gif) no-repeat;
}
#navbar a.ploverviewlink,
#navbar a.repoverviewlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/overview.gif) no-repeat;
}
#navbar a.sanjoselink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sanjose.gif) no-repeat;
}
#navbar a.sanjoseaptlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sanjoseapt.gif) no-repeat;
}
#navbar a.sfandsfolink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sfandsfo.gif) no-repeat;
}
#navbar a.highway1link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/highway1.gif) no-repeat;
}
#navbar a.auxlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/aux.gif) no-repeat;
}
#navbar a.transitlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/transit.gif) no-repeat;
}
#navbar a.supportmetrolink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/supportmetro.gif) no-repeat;
}
#navbar a.vibrantlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/vibrant.gif) no-repeat;
}
#navbar a.esurveylink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/esurvey.gif) no-repeat;
}
#navbar a.petitionlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/petition.gif) no-repeat;
}
#navbar a.songslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/songs.gif) no-repeat;
}
#navbar a.worklink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/work.gif) no-repeat;
}
#navbar a.freewayslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/freeways.gif) no-repeat;
}
#navbar a.bicyclelink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/bicycle.gif) no-repeat;
}
#navbar a.mudlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/mud.gif) no-repeat;
}
#navbar a.bloglink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/blog.gif) no-repeat;
}
#navbar a.reportslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/reports.gif) no-repeat;
}
#navbar a.rep2009link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/reports2009.gif) no-repeat;
}
#navbar a.rep2008link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/reports2008.gif) no-repeat;
}
#navbar a.rep2007link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/reports2007.gif) no-repeat;
}
#navbar a.report1link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report1.gif) no-repeat;
}
#navbar a.report2link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report2.gif) no-repeat;
}
#navbar a.report3link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report3.gif) no-repeat;
}
#navbar a.report4link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report4.gif) no-repeat;
}
#navbar a.report5link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report5.gif) no-repeat;
}
#navbar a.report6link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report6.gif) no-repeat;
}
#navbar a.report7link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report7.gif) no-repeat;
}
#navbar a.report8link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report8.gif) no-repeat;
}
#navbar a.report9link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report9.gif) no-repeat;
}
#navbar a.report10link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report10.gif) no-repeat;
}
#navbar a.report11link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report11.gif) no-repeat;
}
#navbar a.report12link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report12.gif) no-repeat;
}
#navbar a.report13link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report13.gif) no-repeat;
}
#navbar a.report14link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report14.gif) no-repeat;
}
#navbar a.report15link {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/report15.gif) no-repeat;
}
#navbar a.easternlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/eastern.gif) no-repeat;
}
#navbar a.freedomlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/freedom.gif) no-repeat;
}
#navbar a.forumlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/forum.gif) no-repeat;
}
#navbar a.metrolink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/metro_news.gif) no-repeat;
}
#navbar a.keeleylink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/keeley.gif) no-repeat;
}
#navbar a.surveylink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/survey.gif) no-repeat;
}
#navbar a.priceguidelink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/priceguide.gif) no-repeat;
}
#navbar a.roads_ghglink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/roads_ghg.gif) no-repeat;
}
#navbar a.schedlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/schedule.gif) no-repeat;
}
#navbar a.history17xlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/17x_history.gif) no-repeat;
}
#navbar a.stppguidelink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/stppguide.gif) no-repeat;
}
#navbar a.brodylink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/brody.gif) no-repeat;
}
#navbar a.relatedlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/related.gif) no-repeat;
}
#navbar a.descriptslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sitedescripts.gif) no-repeat;
}
#navbar a.acronymslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/acronyms.gif) no-repeat;
}
#navbar a.sccrtclink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sccrtc.gif) no-repeat;
}
#navbar a.tamclink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/tamc.gif) no-repeat;
}
#navbar a.scmtdlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/scmtd.gif) no-repeat;
}
#navbar a.ctalink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/cta.gif) no-repeat;
}
#navbar a.stpplink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/stpp.gif) no-repeat;
}
#navbar a.aptalink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/apta.gif) no-repeat;
}
#navbar a.caltranslink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/caltrans.gif) no-repeat;
}
#navbar a.sightlinelink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sightline.gif) no-repeat;
}
#navbar a.ridespringlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/ridespring.gif) no-repeat;
}
#navbar a.ecoactlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/ecoact.gif) no-repeat;
}
#navbar a.sierraclublink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/sierraclub.gif) no-repeat;
}
#navbar a.missionpedlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/missionped.gif) no-repeat;
}
#navbar a.fortlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/fort.gif) no-repeat;
}
#navbar a.peoplepowerlink {
    background: #74c1f0 url(https://www14.cruzio.com/w14a136/icons/peoplepower.gif) no-repeat;
}
body#home a.homelink,
body#who a.wholink,
body#support a.supportlink,
body#freedom a.freedomlink,
body#forum a.forumlink,
body#metro_news a.metrolink,
body#keeley a.keeleylink,
body#survey a.surveylink,
body#induced a.inducedlink,
body#rail a.raillink,
body#places a.placeslink,
body#ploverview a.ploverviewlink,
body#sanjose a.sanjoselink,
body#sanjoseapt a.sanjoseaptlink,
body#sfandsfo a.sfandsfolink,
body#eastern a.easternlink,
body#highway1 a.highway1link,
body#aux a.auxlink,
body#transit a.transitlink,
body#supportmetro a.supportmetrolink,
body#vibrant a.vibrantlink,
body#esurvey a.esurveylink,
body#petition a.petitionlink,
body#songs a.songslink,
body#work a.worklink,
body#freeways a.freewayslink,
body#bicycle a.bicyclelink,
body#mud a.mudlink,
body#blog a.bloglink,
body#reports a.reportslink,
body#repoverview a.repoverviewlink,
body#report1 a.report1link,
body#report2 a.report2link,
body#report3 a.report3link,
body#report4 a.report4link,
body#report5 a.report5link,
body#report6 a.report6link,
body#report7 a.report7link,
body#report8 a.report8link,
body#report9 a.report9link,
body#report10 a.report10link,
body#report11 a.report11link,
body#report12 a.report12link,
body#report13 a.report13link,
body#report14 a.report14link,
body#report15 a.report15link,
body#priceguide a.priceguidelink,
body#roads_ghg a.roads_ghglink,
body#schedule a.schedlink,
body#history17x a.history17xlink,
body#sttpguide a.sttpguidelink,
body#brody a.brodylink,
body#related a.relatedlink,
body#descripts a.descriptslink,
body#acronyms a.acronymslink,
body#sccrtc a.sccrtclink,
body#tamc a.tamclink,
body#scmtd a.scmtdlink,
body#cta a.ctalink,
body#caltrans a.caltranslink,
body#sightline a.sightlinelink,
body#ridespring a.ridespringlink,
body#ecoact a.ecoactlink,
body#sierraclub a.sierraclublink,
body#missionped a.missionpedlink,
body#fort a.fortlink,
body#peoplepower a.peoplepowerlink {
    background-position: 0 -42px;
}
#navbar a:hover {
    background-position: 0 -21px;
}
/* these next ones from tanfa.co.uk site, for pop-out menus.
* tanfa uses 3 nesting levels, but we need only 2, so we've
* modified the tanfa scheme accordingly.
*/
#navbar li {
    position: relative;
}
/* 1st nested ul is positioned absolutely wrt its containing
 * li, at top: 0; and left: full width of that li.  its width
 * is the same as the containing li, however you don't want it
 * to be displayed until you hover over it, so we set
 * display: none;
 */
#navbar ul ul {
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    display: none;
}
/* when you hover over a list item that contains more than one
 * ul, you don't want the additional ul list to be displayed,
 * so we set display: none; for this case.
 */
#navbar ul li:hover ul ul {
    display: none;
}
/* when you hover over a list item that contains only one ul,
 * then you want that ul item to be displayed, so we set
 * display: block; for that case.  display: inline; also
 * works.
 */
#navbar ul li:hover ul,
#navbar ul ul li:hover ul {
    display: block;
}

