@charset "utf-8";
/* CSS Document */

/* Firefox Dotted Outline Fix */
	a:active { 
		outline: none; 
	}
	
	/* Firefox Dotted Outline Fix */
	a:focus {
	-moz-outline-style: none;
	text-align: center;
	}
	
	/* Menu Body */
	ul#menu {
		width:800px;
		height:100px;
		list-style:none;
		float:left;
		padding:0;
	}
	
	/* Float LI Elements - horizontal display */
	ul#menu li {
		float:left;
	}
	
	/* Link - common attributes */
	ul#menu li a {
	background:url(buttons.png) no-repeat scroll top left;
	display:block;
	height:132px;
	position:relative;
	float:left;
	visibility: inherit;
	}
	
	/* Specify width and background position attributes specifically for the class: "about" */
	ul#menu li a.about {
		float:left;
		width:130px;
		height:132px;
		background-position:-10px 0px;
	}
	
	/* Specify width and background position attributes specifically for the class: "marketing" */
	ul#menu li a.marketing {
		float:left;
		width:130px;
		background-position:-150px 0px;
		}
		
		/* Specify width and background position attributes specifically for the class: "design" */
	ul#menu li a.design {
		float:left;
		width:130px;
		background-position:-292px 0px;
	}
	
	/* Specify width and background position attributes specifically for the class: "webdev" */
	ul#menu li a.webdev {
		float:left;
		width:130px;
		background-position:-432px 0px;
		}
	
	/* Specify width and background position attributes specifically for the class: "contactus" */
	ul#menu li a.contactus {
		float:left;
		width:130px;
		height:132px;
		background-position:-572px 0px;
		}
	
	/* Span (on hover) - common attributes */
	ul#menu li a span {
		background:url(buttons.png) no-repeat scroll bottom left;
		display:block;
		top:0;
		left:0;
		height:130px;
		width:100%;
		z-index:100;
		float:left;
	}
	
	/* Span (on hover) - display pointer */
	ul#menu li a span:hover {
		cursor:pointer;
	}
	
	/* Shift background position on hover for the class: "about" */
	ul#menu li a.about span {
		background-position:-10px -130px;
	}
	
	/* Shift background position on hover for the class: "marketing" */
	ul#menu li a.marketing span {
		background-position:-149px -130px;
	}
	
	/* Shift background position on hover for the class: "design" */
	ul#menu li a.design span {
		background-position:-291px -130px;
	}
	
	/* Shift background position on hover for the class: "webdev" */
	ul#menu li a.webdev span {
		background-position:-431px -130px;
	}
	
	/* Shift background position on hover for the class: "contactus" */
	ul#menu li a.contactus span {
		background-position:-573px -130px;
	}