#css_horizontal_menu{
/*specify here a width for a horizontal menu at fixed measure*/
/*1. remove the default list bullets*/
list-style:none;

/*2. method to avoid that the background of the div container collapse with floated elements*/
overflow:hidden;

/*3. in relation to the above method, for Internet Explorer 6, we need to specify a width of 100%*/
width:100%;

/*4. margin value to null – needed for Internet Explorer*/
margin:0;

/*5. a space (padding) of 1 px between the list border and its content*/
padding:0px;

/*6. the background color of the menu*/
background-color:#7A8B9D;

/*7. a border of 1px around the menu*/
	border:0px solid #f6f0e4;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
} 


/*  MENU li  */

#css_horizontal_menu li{
display:inline;
}


/*  MENU a  */

#css_horizontal_menu a{
/*1. convert the link from inline to block element so that we can next specify width/height*/
display:block;

/*2. the float left that will align the links horizontally*/
float:left;

/*3. a fixed width for al the links*/
/*for links adaptable in width to its text content, using padding-right without the width*/
width:auto;

/*4. the height*/
height:10px;

/*5. an empty space to the left of each link*/
	margin-right: auto;
	margin-left: auto;

/*6. and a left space (padding) between the border and the text link*/
padding:15px;

/*7. background color of the links*/
	/*background-color:#18a5cc;*/
	/*background: -moz-linear-gradient(center top, #0a85a8 8%,#18a5cc 100%);*/
	/*background: -webkit-gradient(linear, left top, left bottom, color-stop(0.08, #0a85a8),color-stop(1, #18a5cc));*/

/*8. a left border of 10px*/
border-width:0px solid #C7E2E2;

/*9. the font family*/
font-family:Verdana, Arial, Helvetica, sans-serif;

/*10. the font size*/
font-size:10px;

/*11. convert the font to capital letter*/
text-transform:uppercase;

/*12. remove the text underline added by default to the links*/
text-decoration:none;

/*13. the color of the text links*/
color:#FFFFFF;

/*14. vertical align of the text link (value equal to the height)*/
line-height:auto;
}

/*  HOVER  */

#css_horizontal_menu a:hover{
/*1. change of background color*/
	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#18a5cc', endColorstr='#0a85a8');
	background: -moz-linear-gradient(center top, #0a85a8 8%,#18a5cc 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.08, #0a85a8),color-stop(1, #18a5cc));
	
	
	
	/* background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000));  THIS IS FOR WEBKIT BROWSERS*/
	/* background: -moz-linear-gradient(top,  #ccc,  #000);  For Firefox 3.6+ */
	/* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000');  For Internet Explorer */
	
	/* background: rgb(255,255,255);  For Internet Explorer ? */
    /* background: rgba(255,255,255,0.7);  For Internet Explorer ? */
	

/*2. change of the left border color*/
border-width:0px solid #CCCCCC;
	-moz-border-radius: 0px 0px 0px 0px;
	-webkit-border-radius: 0px 0px 0px 0px;
	border-radius:0px 0px 0px 0px ; 

/*3. change the color of the text link*/
color:#FFFFFF;


/* DROP SHADOW */

	-webkit-box-shadow:10px 10px 10px rgba(0,0,0,.5);
	-moz-box-shadow:0px 10px 10px rgba(0,0,0,.5);
	box-shadow:0px 10px 10px rgba(0,0,0,.5);




}


#css_horizontal_menu a.first{
margin-left:0;
}