/* common styling */
/* Width  and height control the table box the images reside in */
/* Margin seems to control how far down from the top of the table the images should  be placed */
/* Background controls the color of the table background */
/* Padding seems to control the distance of space around the images (top/bottom first and then left/right) */
/* Border controls the width of the line around the table, followed by color */
.menu1{
font-family: Verdana; width:170px; height:200px; position:relative; margin:0px 0; background:#FFF; padding:0px 0px; border:0px solid #888; 
}
.menu1 ul {
padding:0; margin:0; list-style-type: none;
}

/* The Top and Left values determine placement of the sub nav */
.menu1 ul li ul {
visibility:hidden; position:absolute; height:0; overflow:hidden; top:-5px; left:170px;
}
.menu1 ul li {
float:left; position:relative; z-index:90;
}
.menu1 ul li a, .menu1 ul li a:visited 
{
/* The Height value determines the height of each navigation button's height */
/* The Font-Size value determines the sub-nav's font size */
/* The Padding-Left value somehow determines the the width of the images or better yet it deffinetly seems to control how far to the right of the image the mouse starts to become a pointer */
display:block; float:left; text-decoration:none; color:#000; width:170px; height:20px; line-height:29px; font-size:11px; background:transparent; padding-left:5px;
}
* html .menu1 ul li a, .menu1 ul li a:visited {width:176px; w\idth:170px;}
.menu1 ul li.Home {background:url(images/Slice1.gif) no-repeat;}
.menu1 ul li.AboutUs {background:url(images/Slice2.gif) no-repeat;}
.menu1 ul li.Bulletin {background:url(images/Slice3.gif) no-repeat;}
.menu1 ul li.GetInvolved {background:url(images/Slice4.gif) no-repeat;}
.menu1 ul li.Stewardship {background:url(images/Slice5.gif) no-repeat;}
.menu1 ul li.CatholicSchools {background:url(images/Slice6.gif) no-repeat;}
.menu1 ul li.FaithFormation {background:url(images/Slice7.gif) no-repeat;}
.menu1 ul li.Blog {background:url(images/Slice8.gif) no-repeat;}
.menu1 ul li.SCRIP {background:url(images/Slice9.gif) no-repeat;}
.menu1 ul li.ChangeInPastors {background:url(images/Slice10.gif) no-repeat;}
.menu1 ul li.OnlineGiving {background:url(images/Slice11.gif) no-repeat;}
.menu1 ul li.MassTimes {background:url(images/Slice12.gif) no-repeat;}
.menu1 ul li.Podcasts {background:url(images/Slice13.gif) no-repeat;}

.menu1 ul li ul li.subprod1 {background:url;}
.menu1 ul li ul li.subprod2 {background:url;}
.menu1 ul li ul li.subprod3 {background:url;}
.menu1 ul li ul li.subprod4 {background:url;}

.menu1 ul li ul li.subserv1 {background:url;}
.menu1 ul li ul li.subserv2 {background:url;}
.menu1 ul li ul li.subserv3 {background:url;}
.menu1 ul li ul li.subserv4 {background:url;}

.menu1 table {
border-collapse:collapse; border:0; padding:0; font-size:1em; position:absolute; left:0; top:0;
}

.menu1 ul li:hover a,
.menu1 ul li a:hover{
text-decoration:underline; border:0;
}

.menu1 ul li a:hover {position:relative; z-index:100;}

.menu1 ul li:hover ul,
.menu1 ul li a:hover ul {
visibility:visible; width:350px; height:auto; border:1px solid #606; z-index:10; background:#f8f8f8; overflow:visible;
}
/* xxx */
.menu1 ul li:hover ul li a,
.menu1 ul li a:hover ul li a{
display:block; background:transparent; color:#000; width:165px; line-height:15px; padding:5px 0px 5px 5px; height:auto; text-decoration:none;
}
* html .menu1 ul li a:hover ul li a {width:170px; w\idth:135px;}

/* The background color controls the shade of the menu item we are hoveing over*/
.menu1 ul li:hover ul li a:hover,
.menu1 ul li a:hover ul li a:hover {
text-decoration:underline; border:0; background:#ddd; 
}

/* The left value controls how far to the right the 3rd level menu group is positioned from the 2nd level */
.menu1 ul li:hover ul li ul,
.menu1 ul li a:hover ul li a ul {
visibility:hidden; position:absolute; height:0; overflow:hidden; top:0; left:170px;
}
.menu1 ul li:hover ul li:hover ul,
.menu1 ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; width:180px; height:auto; color:#000; padding:0; border:1px solid #888; list-style-type:none; background:#eee;
}
/*  The width controls how wide the 3rd level sub-nav box of menu items is*/
.menu1 ul li:hover ul li:hover ul li a,
.menu1 ul li a:hover ul li a:hover ul li a {
display:block; width:170px; background:transparent; color:#000;
}
* html .menu1 ul li a:hover ul li a:hover ul li a {width:150px; w\idth:115px;}

.menu1 ul li:hover ul li:hover ul li a:hover,
.menu1 ul li a:hover ul li a:hover ul li a:hover {
background:#ddd; text-decoration:underline;
}
