title: CSS for drop down menu using asp.net sitemap not changing color on mouse over
body: <p>I am trying to get my drop down menu which is made from a sitemap to change colors when there is a mouse over. Here is my code to make the menu:</p>
  
  <pre><code>    &lt;asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" StaticDisplayLevels="2"
          Orientation="Horizontal" CssClass="aspmenu"&gt;
          &lt;StaticHoverStyle CssClass="test" /&gt;
      &lt;/asp:Menu&gt;
      &lt;asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" /&gt;
  </code></pre>
  
  <p>Additionally here is the css file:</p>
  
  <pre><code>.level1
  {
  
  }
  
  .level2
  {
      box-shadow: 10px 10px 5px #888888;
      color: White;
      font-style:italic;
      text-align:center;
      font-size: 1.3em;
      background-color: #fdbe12;
      width: 6em;
      padding: 4px;
      margin: 0px 25px 0px 0px;
  }
  
  .level3
  {
      box-shadow: 10px 10px 5px #888888;
      color: White;
      font-weight:100;
      text-align:center;
      font-size: 1.1em;
      background-color: #fdbe12;
      width: 6.85em;
      padding: 0.25em;
  }
  
  .test
  {
      font-weight: bold;
      background-color:Fuchsia;
      color:Black;
  
  }
  </code></pre>
  
  <p>Here is the pertinent part of the other CSS file:</p>
  
  <pre><code>    body
      {
         background: #EAFDB3;
         width: 100%;
      }
  
      #menuBar 
      { 
           text-align: left;
           width: 43.5em;
           display: block;
           margin-left: auto;
           margin-right: auto;
           margin-top: 7.75em;
      }
  </code></pre>
  
  <p>Here is a pic:</p>
  
  <p><img src="https://i.stack.imgur.com/5zZKB.png" alt="enter image description here"></p>