/* CSS Document */



/* Main Navigation */

#nav {    
	position:relative;    
	width:100%;    
	margin:0 auto;     
	margin-top:15px;  
	margin-bottom:30px;    
	padding:10px;
} 


ul#navigation {    
	margin:0px auto;    
	position:relative;    
	float:left;    
/*	border-left:1px solid #c4dbe7;    
	border-right:1px solid #c4dbe7;   */
} 


ul#navigation li {
    display:inline;    
	font-size:20px;  
	font-family:"Calibri";  
	font-weight:bold;    
	margin:0;    
	padding:0;    
	float:left;    
	position:relative;    
/*	border-top:1px solid #c4dbe7;    
	border-bottom:2px solid #c4dbe7;    */
} 


ul#navigation li a {
	/*padding here adjusts space between buttons */
    padding:8px 25px;    
	color:#ffffff;    
/*	text-shadow:1px 1px 0px #fff;    
	TEXT COLOR HERE IS MAIN MENU TEXT*/
	text-decoration:none;    
	display:inline-block;    
/*	border-right:1px solid #fff;    
	border-left:1px solid #C2C2C2;    
	border-top:1px solid #fff;   
	BACKGROUND COLOR HERE IS MAIN MENU BACKGROUND*/
	background: #69411E;         
	-webkit-transition:color 0.2s linear, background 0.2s linear;       
	-moz-transition:color 0.2s linear, background 0.2s linear;      
	-o-transition:color 0.2s linear, background 0.2s linear;        
	transition:color 0.2s linear, background 0.2s linear;   
} 


ul#navigation li a:hover {   
/*	BACKGROUND COLOR HERE IS FOR MOUSE OVER ON MAIN MENU; COLOR IS FONT COLOR ON MAIN MENU*/   
	background:#978581;    
	color:#000000;
} 

ul#navigation li a.first {
    border-left: 0 none;
} 

ul#navigation li a.last {    
	border-right: 0 none;
} 

ul#navigation li:hover > a {
    background:#978581;
	/*	BACKGROUND COLOR HERE IS FOR MOUSE OVER ON MAIN MENU */
} 




/* Drop-Down Navigation */

ul#navigation li:hover > ul{
/*these 2 styles are very important, being the ones which make the drop-down to appear on hover */    
	visibility:visible;    
	opacity:1;
} 

ul#navigation ul, ul#navigation ul li ul {
    list-style: none;    
	margin: 0;    
	padding: 0;    
	/*the next 2 styles are very important, being the ones which make the drop-down to stay hidden */    
	visibility:hidden;    
	opacity:0;    
	position: absolute;    
	z-index: 19999;    
	/* width below is for dropdown menu buttons (no mouseover)   */
	width:200px;    
	background:#978581; 
	/*BACKGROUND COLOR HERE IS FOR DROP DOWN MENU  */  
	box-shadow:1px 1px 3px #ccc;/* css3 transitions for smooth hover effect */    
	-webkit-transition:opacity 0.2s linear, visibility 0.2s linear;     
	-moz-transition:opacity 0.2s linear, visibility 0.2s linear;     
	-o-transition:opacity 0.2s linear, visibility 0.2s linear;     
	transition:opacity 0.2s linear, visibility 0.2s linear;     
} 

ul#navigation ul {
    top: 37px;    
	left: 0px;
} 

ul#navigation ul li ul {
    top: 0;    
	left: 181px; 
	/* strong related to width:180px; from above */
} 

ul#navigation ul li {
    clear:both;    
	width:100%;    
	border:0 none;    
	border-bottom:1px solid #c9c9c9;
} 

ul#navigation ul li a {
    background:none;    
	padding:7px 15px;    
	color:#ffffff;    
	/* padding 1st number is for top/bottom padding on dropdown button; 2nd number is for left side of dropdown buttons
	/*this color is the text of the dropdown buttons when the mouse is on the submenu  */
/*	text-shadow:1px 1px 0px #fff;    */
	text-decoration:none;    
	display:inline-block;    
	border:0 none;    
	float:left;    
	clear:both;    
	/* width below is for size of dropdown button on mouse over */
	width:170px;
}