title: Override jQuery UI Datepicker div visible strangely on first page load.
body: <p>Something strange afoot, here:</p>
  
  <p>An instance of Datepicker is showing up in a weird place as a single bar in the upper left hand corner of <a href="http://bigsilkdesign.com/comida/#&amp;panel1-1" rel="noreferrer">this</a> page.</p>
  
  <p>I'm using both jQuery UI's Datepicker and Accordion on a page. In the CSS for the UI, the <code>display:none</code> for Datepicker seems to be overridden by the <code>display:block</code> for the Accordion, at least according to Firebug (see img below).</p>
  
  <p>Then, once the Datepicker trigger is clicked in the 'catering/event room' tab (click one of the buttons to show div with Datepicker,) the <code>display:none</code> seems to then work.</p>
  
  <p>Here's what the bad div looks like:</p>
  
  <p><img src="https://i.stack.imgur.com/JoCv1.jpg" alt="bad div"></p>
  
  <p>and here's the Firebug panel:</p>
  
  <p><img src="https://i.stack.imgur.com/3gcS3.jpg" alt="css"></p>