How can I set a background on the whole JQuery-UI dialog

How can I set a background on the whole JQuery-UI dialog

In a function I open and display a JQuery-UI dialog by using this code.
 I have this code in a function which open and display a JQuery-UI dialog
$("#" + track.id).click(function ()
           {
            
               $("#dlgBooking").dialog({
                   width: 230
               });
           });

//Here is the actual JQuery-UI dialog to display.
******************************************************
 <div id="dlgBooking" title="Booking menu" style="display:none">
       <ul class="nav">
         <li><a href='javascript:Booking()'>Booking</a></li>
         <li><a href="javascript:ChangeTime()">Change time</a></li>
         <li><a href="javascript:CancelBooking()">Cancel booking</a></li>
         <li><a href="javascript:Createlocking()">Create locking</a></li>
         <li><a href="javascript:Removelocking()">Remove locking</a></li>
       </ul>
    </div>

There is one thing I can't manage and that is to set a background on the whole JQuery-UI dialog. I can only set a background on the ul element by using the class nav
I use this CSS to style.
.nav
    {
         background: #87a5be url(../Images/bg.jpg) no-repeat right bottom fixed;
         list-style:none;
         margin:0;
         padding: 0;
         padding-left:10px;
    }
   
    .nav li
    {
        border-left:10px solid rgb(144,154,181);
        border-bottom:1px solid rgb(144,154,181);
    }
   
   
    .nav li a:link, .nav li a:visited
    {
         color:rgb(49,52,61);
         padding:0.5em;
         display:block;
         text-decoration:none;
    }
   
    .nav li a:hover
    {
         color:rgb(255,255,6255);
    }

//Tony