css menu

[willscarlet]

I have a logo set up in the middle of my main menu bar and i was wondering if you guys knew of a better way to do it.

/* -- Menu : Begin -- */
#menu_outline {
	border-top:5px solid white;
	border-bottom:5px solid white;
	width: 100%;
	height:30px;
	background: url(../img/background/metal.jpg) top center repeat;
	padding: 1px 0;
}

menu {
	width: 970px;
	margin: 0 auto;
	position: relative;
}

menu a.menu_btn {
	font-family: sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	outline: none;
	padding: 10px 60px;
	float: left;
	
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	position: relative;
	behavior: url(../js/PIE.html);
	
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	transition: all .3s linear;
}

menu a.menu_btn u {
	font-family: "calluna-sans-1","calluna-sans-2", sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
	outline: none;
	padding: 10px 60px;
	float: left;
	list-style-type: none;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	position: relative;
	behavior: url(../js/PIE.html);
	
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	transition: all .3s linear;
}

menu a.menu_btn:hover, menu a.menu_btn.active {
	background: #b2b0b3;
	height: 10px;
	color: white;
}

menu .linebreak {
	float: left;
	padding-top: 13px;	
}

menu .linebreakright {
	float: right;
	padding-top: 13px;	
}
/* -- Menu : End -- */

/* -- Logo : Begin -- */
#logo1 {
	background-image: url(../img/background/photo.JPG);
    position: absolute;
    top: -20px;
	left: 330px;
	height: 100px;
	width: 280px;
	z-index: 999;
	border: 2px solid #00ff01;
}

/* -- Logo : End -- */

Then my menu just looks like this:

<menu>

<!-- Logos: Begin -->

<a id="logo1" href = "../index.html"></a>

<!-- Logos: End -->

<ul><a href="../index.html" class="menu_btn" style="float: left;">Home</a></ul>

<ul><a href="index.html" class="menu_btn" style="float: left;">About Us</a></ul>

<ul><a href="http://www.crossfitsumter.com/forum/" target = "_blank" style="float: right;" class="menu_btn" >Forums</a></ul>

<ul><a href="../contacts/index.html" style="float: right;" class="menu_btn active" >Contacts</a></ul>

<div class="clear"></div>
</menu>