I used Artisteer to build the following Joomla 2.5 template (http://upgrade.rosmini.school.nz/). I needed to add an extra position called #icon-menu. I have done this but for some reason none for the icon-menu css is being applied to the div tag. When I inspect the element via Chrome, I can't see the CSS being used of overwritten anywhere. Its been a while since I've worked on CSS so am sure that I am overlooking something very obvious.... but just can't see what.

HTML Code:
      <div class="ros-header">
        <?php if ($view->containsModules('position-0')) : ?>
        	<div class="icon-menu"><?php echo $view->position('position-0'); ?></div>
        <?php endif; ?>
        <div class="ros-headerobject"></div>
        <div class="ros-logo">
          <h1 class="ros-logo-name"><a href="<?php echo $document->baseurl; ?>/"><?php echo $this->params->get('siteTitle'); ?></a></h1>
          <h2 class="ros-logo-text"><?php echo $this->params->get('siteSlogan'); ?></h2>
        </div>
      </div>
HTML Code:
#icon-menu {
	position: absolute;
	top: 12px;
	display:block;
	left: 500px;
}