/*
   New Perspectives on JavaScript, 2nd Edition
   Tutorial 4
   Case Problem 4

   Author:   Linda K.Pady
   Date:     9-15-2011
   Filename: dinner.css

   This file contains styles used in the dinnerplate.htm file.

*/

*                   {padding: 0px; margin: 0px; line-height: 1.2}

body                {background-color: white; 
                     font-family: 'Trebuchet MS', Arial, Verdana, sans-serif;
                     font-size: 15px}

#page               {position: absolute; top: 0px; left: 10px; width: 850px}

a                   {text-decoration: none; color: black}
p                   {margin: 15px 0px}
ul                  {list-style-type: none}
ol			{margin: 0px 25px 0px}
h1			{margin-top: 20px}
h2			{margin-top: 10px}
h3			{margin-top: 5px}

#logo               {position: absolute; top: 0px; left: 0px;
                     width: 100%; height: 194px; background-color: white; z-index: 3}
#logo img           {float: left}
#logo label         {float: right; margin-top: 15px; margin-right: 10px}
#logo input         {float: right; margin-top: 15px; background-color: ivory}

.menu               {position:absolute; top: 200px; width: 140px; height: 40px; z-index: 3;
                     border: 1px solid black; color: black; background-color: rgb(212, 212, 212);
                     text-align: center}
.menu a             {display: block; width: 140px; height: 40px; color: black}
.menu a:hover       {background-color: rgb(188, 132, 0); color: white}

#menu1, #menu1List  {left: 0px}
#menu2, #menu2List  {left: 141px}
#menu3, #menu3List  {left: 282px}
#menu4, #menu4List  {left: 423px}
#menu5, #menu5List  {left: 564px}
#menu6, #menu6List  {left: 705px}

.menuList           {position: absolute; top: 235px; width: 140px; z-index: 2;
                     background-color: ivory; border: 1px solid black; display: none}

.menuList li        {margin: 5px}
.menuList a         {display: block; width: 132px}
.menuList a:hover   {background-color: rgb(188, 132, 0); color: white}

#linkList           {position: absolute; top: 250px; left: 5px; width: 175px;
                     border-right: 1px solid black}
#linkList li        {line-height: 1.5}
#linkList .newGroup {margin-top: 15px}
#linkList a:hover   {text-decoration: underline overline; 
                     color: GoldenRod; background-color: ivory}

#main                {position: absolute; top: 250px; left: 190px; z-index: 1}
.mainBullet		{list-style-type: square; margin: 0px 25px 15px}