
/* CONTENITORI PRINCIPALI che non stanno in main.css!!!
================================================================*/

#navigation {
position: relative;
z-index: 100;
padding: 0;
background-color:#FFFFFF;
width: 890px !important;
height: 24px;
text-align:left;
}

#flash {
position: relative;
z-index: 10;
padding: 0;
}

/************ NAVBAR ORIZZONTALE *************/	

/* remove all the bullets, borders and padding from the default list styling */
#navigation ul {
float: left;
padding: 0;
margin: 0;
list-style-type: none;
}

#navigation ul ul {
width: 60px;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#navigation li {
float: left;
position: relative;
border-right: 1px solid #fff;
width: 60px !important;
width /**/: 61px;
}

#navigation li.big {
float: left;
position: relative; 
border-right: 1px solid #fff;
width: 85px !important;
width /**/: 86px;
}

#navigation li.big a, #navigation li.big a:visited, #navigation li.big a:hover {
float: left; 
width: 85px;
}


#navigation li.tuttiiprodotti {
float: left;
position: relative;
text-align:left;
width: 134px !important;
}

#navigation li.outdoor {
float: left;
position: relative;
text-align:left;
width: 75px !important;
}

#navigation li.digitale {
float: left;
position: relative;
text-align:left;
width: 75px !important;
}

#navigation li.retail {
float: left;
position: relative;
text-align:left;
width: 75px !important;
}

#navigation li.magazine {
float: left;
position: relative;
text-align:left;
width: 76px !important;
}

#navigation li.reboard {
float: left;
position: relative;
text-align:left;
width: 76px !important;
}

#navigation li.tecnologie {
float: left;
position: relative;
text-align:left;
width: 89px !important;
}

#navigation li.salastampa {
float: left;
position: relative;
text-align:left;
width: 101px !important;
}

#navigation li.contatti {
float: left;
position: relative;
text-align:left;
width: 89px !important;
}

#navigation li.areariservata {
float: left;
position: relative;
text-align:left;
width: 90px !important;
}


#navigation li.medium {
float: left;
position: relative; 
text-align: center;
width: 76px !important;
width /**/: 77px;
}


#navigation li.little {
float: left;
position: relative;
text-align: center;
border-right: 1px solid #fff;
width: 46px !important;
width /**/: 47px;
}

#navigation li.little a, #navigation li.little a:visited, #navigation li.little a:hover {
float: left; 
width: 46px;
}


#navigation li.last {
float: left;
position: relative; 
border-right: none;
width: 60px !important;
width /**/: 61px;
}

#navigation li.last a, #navigation li.last a:visited, #navigation li.last a:hover {
float: left;
width: 60px;
}

/* style the links for the top level */
#navigation a, #navigation a:visited {
display: block;
font: 10px/22px Arial, Helvetica, sans-serif;
text-decoration: none; 
color: #fff !important; 
width: 60px; 
height: 24px; 
/*border: 1px solid #fff; 
border-width:1px 1px 0 0;*/ 
}

/* a hack so that IE5.5 faulty box model is corrected */
* html #navigation a, * html #navigation a:visited {
width: 60px;
w\idth: 60px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#navigation ul ul {
visibility: hidden;
position: absolute;
height: 0;
top: 24px;
left:0; 
width: 120px;
}

/* another hack for IE5.5 */
* html #navigation ul ul {
top: 24px;
t\op: 24px;
}

/* position the third level flyout menu */
#navigation ul ul ul {
left: 120px; 
top: 0;
width: 120px;
}
/* position the third level flyout menu for a left flyout */
#navigation ul ul ul.left {
left: -120px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
#navigation table { position: absolute; top: 0; left: 0;}

/* style the second level links */
#navigation ul ul a, #navigation ul ul a:visited {
background: #fedf9c; 
color: #000 !important; 
height: auto;
font: 11px/11px Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
padding: 4px 12px;
width: 230px !important;

/* yet another hack for IE5.5 */
}

* html #navigation ul ul a {
width: 120px;
w\idth: 110px;
}

/* style the top level hover */
#navigation a:hover {
color: #fff; 
}

#navigation ul ul a:hover {
background-image:url(grafica/sf_on.gif);
color: #000; 
}

#navigation :hover > a {
color: #fff;
}

#navigation ul ul :hover > a {
background-image:url(grafica/sf_on.gif);
color: #000;
}

/* make the second level visible when hover on first level list OR link */
#navigation ul li:hover ul,
#navigation ul a:hover ul {
visibility: visible; 
}
/* keep the third level hidden when you hover on first level list OR link */
#navigation ul :hover ul ul {
visibility: hidden;
}

/* make the third level visible when you hover over second level list OR link */
#navigation ul :hover ul :hover ul { 
visibility: visible;
}