
table.jCalendar th { background: #342c29; color: #fff; font-weight: bold; padding: 7px} 
table.jCalendar td { background: #6e5a53; color: #000; padding: 5px 7px; text-align: center; border-right: 1px solid #342c29; border-bottom: 1px solid #342c29} 
table.jCalendar td.other-month { background: #342c29; color: #26201e} 
table.jCalendar td.today { background: #826f60; color: #000} 
table.jCalendar td.selected { background: #efdfa4; color: #000} 
table.jCalendar td.selected:hover { background: #ac9a7a; color: #000} 
table.jCalendar td:hover, table.jCalendar td.dp-hover { background: #ac9a7a; color: #000} 
table.jCalendar td.disabled, table.jCalendar td.disabled:hover { background: #ffe6cf; color: #f57402} 


table.jCalendar td.other-month:hover { background: #342c29; color: #26201e; cursor: default} 

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup { position: relative; font-size: 9px; padding: 20px; background: #342c29} 
div#dp-popup { position: absolute; z-index: 199} 
div.dp-popup h2 { font-size: 12px; text-align: center; line-height: 170%; color:#FFFFFF}
a#dp-close { font-size: 11px; padding: 4px 0; text-align: center; display: block} 
a#dp-close:hover { text-decoration: underline} 
div.dp-popup a { color: #ac9a7a; text-decoration: none; padding: 5px 5px} 

div.dp-popup a:hover { color: #fff1be} 

div.dp-popup div.dp-nav-prev { position: absolute; top: 2px; left: 4px; width: 100px} 
div.dp-popup div.dp-nav-prev a { float: left} 

/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a { cursor: pointer} 
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled { cursor: default} 
div.dp-popup div.dp-nav-next { position: absolute; top: 2px; right: 4px; width: 100px} 
div.dp-popup div.dp-nav-next a { float: right} 
div.dp-popup a.disabled { cursor: default; color: #aaa} 
div.dp-popup td { cursor: pointer} 
div.dp-popup td.disabled { cursor: default} 

a.dp-choose-date { width: 16px; height: 16px; display: block; text-indent: -2000px; overflow: hidden; background: url(../img/icons/calendar.png) no-repeat; position: absolute; top: 35px; left: 6px}
a.dp-choose-date.dp-disabled { background-position: 0 -20px; cursor: default} 

a.dp-choose-date:hover {cursor: pointer} 
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied { width: 140px; float: left} 

form.main label input.date-pick { width: 53%;}