Bolding current menu item in header

I know there have been a lot of threads about bolding the current page item in menus but I haven’t found anything that has helped me.

I have made a child theme for Custom Community theme and created a simple menu in the header.php file as follows:

<?php do_action( ‘bp_before_access’)?>

<center><div id=”menu”>HOME | ABOUT THEA | SERVICES | CONTACT | RESOURCES</div></center>

<?php do_action( ‘bp_after_header_nav’ ) ?>

And in my CSS I have the following:

#menu {
font-size:small;
width: 100%;
height: 15px;
margin-top:180px;
text-align: center;
}
a:active {
color:#CC3300;
text-decoration:none;
font-weight:bold;
}

But it does nothing. Absolutely nothing. I have also tried the following:

li.current-menu-item a {
text-decoration:none;
font-weight:bold;
}

and different variations of it. To no avail. And now I am lost. I have no idea what to do now. It is WordPress that is messing with it and I don’t know how to work around it.

I would be forever grateful if someone had the answer to my mystery!