﻿div.navMainContainer ul.navMain li  {
padding:0 4px;
}
div.navMainContainer ul.navMain li a {
font-family: "Lucida Sans Unicode", "Trebuchet MS", Arial;
font-weight: bold;
font-size: 12px;
line-height: 1.0em;
text-decoration: none;
padding:8px 22px 10px 22px;
}
.navMainContainer a:link { color: #fff; }
.navMainContainer a:visited { color: #fff; }
.navMainContainer a:hover { color: #FFCC00; }
/* The menu adapter renders an unordered list (ul) in HTML for each tier in the menu. */
/* So, effectively says: style all tiers in the menu this way... */
.navMainContainer ul.navMain, 
.navMainContainer ul.navMain ul {
margin-bottom: 0;
}
/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
.navMainContainer ul.navMain ul {
width: 180px;
top: 44px;
/*
border-left:1px solid #ddd;
border-top:1px solid #ddd;
border-right:3px solid #ccc;
border-bottom:3px solid #ccc;
*/
}
/* The menu adapter generates a list item (li) in HTML for each menu item. */
/* Use this rule create the common appearance of each menu item. */
.navMainContainer ul.navMain li ul li {
margin: 0;
padding: 0;
}
/* Within each menu item is a link or a span, depending on whether or not the MenuItem has defined it's */
/* NavigateUrl property. By setting a transparent background image here you can effectively layer two images */
/* in each menu item.  One comes from the CSS rule (above) governing the li tag that each menu item has. */
/* The second image comes from this rule (below). */
.navMainContainer ul.navMain li ul li a,
.navMainContainer ul.navMain li ul li span {
/*	height: 28px; */
font-size: 13px;
font-weight: normal;
background-color: #286469; 
margin: 0;
padding: 0.6em 0.5em 0.6em 1.2em;
border: 0;
height: auto; /* fix cut-off of multiline entries, when last in the list */
}
/* When a menu item contains no submenu items it is marked as a "leaf" and can be styled specially by this rule. 
	Background del UL que se desplega
*/
.navMainContainer ul.navMain li.navMain-Item a,
.navMainContainer ul.navMain li.navMain-Item span {
/* background:top left url(../images/bgsubmenu.jpg) repeat-x; */
background-color: #529FC4; 
border-top:1px solid #94C4DA;
border-bottom:1px solid #336379;
}
.navMainContainer ul.navMain li.navMain-Item a:hover {
background: #318AB6;
color:#fff;
}

/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is navMainHorizontal. */
/* Note that the example menu in this web site uses absolute positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */
/* #header */
/*.navMainContainer .navMainHorizontal*/
.navMainContainer {
clear:both;
width:920px;
margin:0px 0 10px 0;
text-align: left;
height: 44px;
background:url(../images/bgmenu.jpg) top left repeat-x;

}

div.navMainContainer img { vertical-align: bottom; }
.navMainContainer .navMainHorizontal {
text-align: left;
}
/* This rule controls the width of the top tier of the horizontal menu. */
/* BE SURE TO MAKE THIS WIDE ENOUGH to accomodate all of the top tier menu items that are lined */
/* up from left to right. In other words, this width needs to be the width of the individual */
/* top tier menu items multiplied by the number of items. */
.navMainContainer .navMainHorizontal ul.navMain {
text-align: left;
}

.navMainContainer ul {
background-color: transparent;
margin: 0;
padding: 0; 
list-style: none;
}
/* #header li */
.navMainContainer li {
float: left;
background: url("../images/divmenu.jpg") -1px 0px no-repeat;
margin: 0;
padding: 0 10px 0 10px;
}
.navMainContainer li.first /* NOTE: Adaptor must insert class "first" on first menu item for IE */ {
background: none;
}
.navMainContainer ul li:first-child /* NOTE: IE does NOT understand the :first-child selector */ {
background: none;
}
/* #header a */
/*.navMainContainer .navMainHorizontal a*/
.navMainContainer a {
display: block;
padding: 12px 13px 2px 15px;
}
.navMainContainer ul li ul li a  {
display: block;
}

/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
/* Remember that only the topmost tier of the menu is horizontal.  The second and third tiers are vertical. */
/* So, they need a much smaller width than the top tier.  Effectively, the width specified here is simply */
/* the width of a single menu item in the second and their tiers. */
.navMainContainer .navMainHorizontal ul.navMain ul {
font-size: 0.8em;
margin-top: -1.4em; /* height of the top-tier text; if sized up in browser, this keeps dropdowns in same vert. position */
}
/* Generally, you use this rule to set style properties that pertain to all menu items. */
/* One exception is the width set here.  We will override this width with a more specific rule (below) */
/* That sets the width for all menu items from the second tier downward in the menu. */
.navMainContainer .navMainHorizontal ul.navMain li {
float: left;
margin: 0;
padding: 0 0 0 2px;
}
/* This rule can be used to set styles for the menu items in the second tier (and lower) in the menu. */
/*.navMainContainer .navMainHorizontal ul.navMain li li*/
.navMainContainer li li {
/*	background: #4682B4 url(bg_nav.gif) repeat-x; */
}
/* This rule establishes the width of menu items below the top tier.  This allows the top tier menu items */
/* to be narrower, for example, than the sub-menu items. */
/* This value you set here should be slightly larger than the left margin value in the next rule. See */
/* its comment for more details. */
.navMainContainer .navMainHorizontal ul.navMain ul li {
width: 100%;
margin: 0;
padding: 0;
}
/* Third tier menus have to be positioned differently than second (or top) tier menu items because */
/* they drop to the side, not below, their parent menu item. This is done by setting the last margin */
/* value (which is equal to margin-left) to a value that is slightly smaller than the WIDTH of the */
/* menu item. So, if you modify the rule above, then you should modify this (below) rule, too. */
/*.navMainContainer .navMainHorizontal ul.navMain li ul li ul*/
.navMainContainer .navMainHorizontal ul.navMain ul li ul {
width: 150px;
font-size: 1.0em; /* prevent the font-size reduction in 2nd level from cascading to 3rd */
margin-top: -3.08em; /* move up to match vert position of parent */
margin-left: 203px;
padding: 0;
}


