title: How to control the rendering of a menu in Orchard
body: <p>I have the following problem: I'm making a site in Orchard and have to apply a design made by some design company. They delivered html and CSS (+ LESS) and I have to make it into a theme. 
  I get it done for the most part except the menu's. I want to apply a class to the <strong>nav</strong> tag in the following code, but I can't make any alternates for that end up rendering it.</p>
  
  <pre><code>&lt;article class="widget-navigation widget-menu-widget widget" shape-id="18"&gt;
  &lt;nav shape-id="19"&gt;
      &lt;ul class="menu menu-main-menu" shape-id="19"&gt;
  &lt;li class="current first" shape-id="22"&gt;
      &lt;a href="/" shape-id="22"&gt;Home&lt;/a&gt; 
  &lt;/li&gt;
  &lt;li shape-id="24"&gt;
  &lt;a href="/Something1" shape-id="24"&gt;Something1&lt;/a&gt;
  &lt;/li&gt;
  &lt;li shape-id="26"&gt;
  &lt;a href="/Something2" shape-id="26"&gt;Something2&lt;/a&gt;
  &lt;/li&gt;
  &lt;li class="last" shape-id="28"&gt;
  &lt;a href="/Something3" shape-id="28"&gt;Something3&lt;/a&gt;
  &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/nav&gt;
  &lt;/article&gt;
  </code></pre>
  
  <p>How do I influence the rendering of my menu's so that I can apply proper CSS to it? The only alternates that I can make either contain only:</p>
  
  <pre><code>&lt;a href="@Model.Href"&gt;@Model.Text&lt;/a&gt;
  </code></pre>
  
  <p>or:</p>
  
  <pre><code>@Display(Model.Menu)
  </code></pre>