#sectionTop1      {background-color: goldenRod;}
#sectionTop2      {background-color: darkRed;}
#sectionTop3      {background-color: darkOrange;}
#sectionTop4      {background-color: forestGreen;}
#sectionTop5      {background-color: dodgerBlue;}

body              {font-family: tahoma, geneva, sans-serif; margin: 0; padding: 0; font-size: 1.0em;}
a                 {color: #505050; text-decoration: none}

p.breadCrumb      {height: 35; width: 100%; }
table.breadCrumb  {width: 100%; height: 100%; padding: 8; }
td.breadCrumbL    {font-size: 1em; text-align:left;  vertical-align:middle; }
td.breadCrumbC    {font-size: 1em; text-align:center;vertical-align:middle; }
td.sections       {font-size: 1em; text-align:right; vertical-align:middle; }
a.breadCrumb      {font-weight: bold; }

div.userStuff     {height: 20; width: 100%;  text-align:right;}
table.userStuff   {width: 100%; height: 100%; padding: 20; }
td.userStuff      {text-align:right; vertical-align:middle; }

div.sectionHeader {height: 400; width: 100%;  text-align:right;}
p.userStuff       {height: 20; width: 100%;  text-align:right; vertical-align:top;}
p.sectionHeader   {height: 380; width: 100%;  text-align:right; vertical-align:middle;}
table.sectionHeader
                  {width: 90%; height: 100%; padding: 20; }
td.sectionTitle   {font-size: 4.5em; color: #FFFFFF; text-align:left; vertical-align:middle; }
td.sectionSubTitle 
                  {font-size: 1.5em; color: #FFFFFF; text-align:left; }

p.sectionBody     {height: 500; width: 100%; }
p.sectionBlurb    {text-align:left; margin: 10;}
table.sectionBody {width: 100%; padding: 20;}
table.sectionContent
                  {width: 100%;}
td.sectionBlurb   {width:  60%; border: 1px solid gray; border-radius: 5px;}
td.sectionMenue   {width:  40%;}
td.border100      {width: 100%; border: 1px solid gray; border-radius: 5px;}
td.menueTable     {width: 100%;}
td.sectionDescription 
                  {height: 100%;}
td.sectionTop     {height: 500; width: 100%;}

div.pageBody1     {padding: 20;}
div.pageBody      {padding: 20; border: 1px solid gray; border-radius: 5px;}

p.more            {padding: 20;}
p.moreItem        {padding: 20; border: 1px solid gray; border-radius: 5px;}
a.moreItem        {font-weight: bold}
td.moreItem       {height: 100%;background-color: white; padding: 20; border: 1px solid gray; border-radius: 5px;}
tr#moreTr         {vertical-align:top}

table.bottom      {width: 100%;}
p.bottom          {background-color: #DDDDDD;}
td.copyright      {padding: 10; text-align: center; font-size: 0.625em;}
td.contact        {padding: 10; text-align: center; font-size: 0.875em;}

div.float         { float:right; width: 400px; margin: 0 0 10px 20px; }
div.floatC        { float:right; width: 400px; margin: 0 0 10px 20px; padding: 15px; border: 1px solid black; text-align: center }

# tooltip stuff from w3schools.com CSS tutorial
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;