/* This is a very basic stylesheet for the date-picker. Feel free to create your own. */
 /* The wrapper div */
div.datePicker {
 position: absolute;
 min-width: 20em;
 width: 20em;
 z-index: 9999;
 text-align: center;
 /* Change the font-size to suit your design's CSS. The following line is for the demo that has a 12px font-size defined on the body tag */
 font: 900 0.8em/ 0.8em Verdana, Sans-Serif;
 /* For Example: If using the YUI font CSS, uncomment the following line to get a 10px font-size within the datePicker */
 /* font:900 77%/77% Verdana; */
 background: transparent;
 /* Mozilla & Webkit extensions to stop text-selection. Remove if you wish to validate the CSS */
 -moz-user-select: none;
 -khtml-user-select: none;
 border: 3px solid #CCCCCC;
}

/* Styles for the static datePickers */
div.staticDP {
 position: relative;
 top: 5px;
 left: 0;
}

/* The iframe hack to cover selectlists in Internet Explorer <= v6 */
iframe.iehack {
 position: absolute;
 background: #fff;
 z-index: 9998;
 padding: 0;
 border: 0;
 display: none;
 margin: 0;
}

/* The "button" created beside each input for non-static datePickers */
a.date-picker-control:link,a.date-picker-control:visited,a.date-picker-control:hover,a.date-picker-control:active,a.date-picker-control:focus
 { /*position:relative;*/ /* Moz & FF */
 display: -moz-inline-stack;
 border: 0 none;
 padding: 0;
 margin: 0 0 0 4px;
 background: transparent url(/js/calendar/media/cal.gif) no-repeat 50%
  50%;
 min-width: 16px;
 line-height: 1;
 cursor: pointer;
 visibility: visible;
 text-decoration: none;
 vertical-align: middle;
}

/* Feed IE6 the following rule, IE7 should handle the min-width declared above */
* html a.date-picker-control {
 width: 16px;
}

a.date-picker-control {
 /* IE, Safari & Opera. Seperate CSS rule seems to be required. */
 display: inline-block;
}

a.date-picker-control span {
 display: block;
 width: 16px;
 height: 16px;
 margin: auto 0;
}

/* The next & previous buttons */
div.datePicker th span {
 display: inline;
 padding: 0;
 margin: 0;
 color: #000;
 text-align: center;
 line-height: 1em;
 border-width: 0;
 font-family: georgia, times new roman, palatino, times, bookman, serif;
 background: transparent;
 font-weight: bold;
 cursor: pointer;
}

div.datePicker th span.month-display,div.datePicker th span.year-display
 {
 text-transform: uppercase;
 letter-spacing: 1px;
 font: normal 1.2em Verdana, Sans-Serif;
 cursor: default;
}

div.datePicker th span.prev-but,div.datePicker th span.next-but {
 font-size: 1.8em;
 cursor: pointer !important;
}

div.datePicker th span.today-but {
 text-align: center;
 margin: 0 auto;
 font: normal 1em Verdana, Sans-Serif;
 width: 100%;
 text-decoration: none;
 line-height: 1.6em;
 text-transform: uppercase;
 cursor: pointer !important
}

div.datePicker thead th span.fd-disabled {
 color: #aaa;
 cursor: default !important;
}

/* The mon, tue, wed etc day buttons */
div.datePicker th span.fd-day-header {
 text-align: center;
 margin: 0 auto;
 font: 900 1em Verdana, Sans-Serif;
 height: 1.4em;
 width: 2em;
 text-decoration: none;
 text-transform: lowercase;
 line-height: 1.4em;
}

/* The table */
div.datePicker table {
 position: relative;
 margin: 0;
 padding: 0;
 border: 1px solid #ccc;
 background: #fff url(/js/calendar/media/gradient-e5e5e5-ffffff.gif)
  repeat-x 0 -20px;
 text-align: center;
 width: 100%;
 border-spacing: 2px;
 table-layout: fixed;
 border-collapse: separate;
 font-size: 10px;
}

/* Common TD & TH styling */
div.datePicker table td {
 border: 1px solid #ccc;
 padding: 0;
 text-align: center;
 vertical-align: middle;
 /* Opera requires a line-height bigger than 1em in order to redraw properly */
 line-height: 1.2em;
 cursor: pointer;
 background: #fff url(/js/calendar/media/gradient-e5e5e5-ffffff.gif)
  repeat-x 0 -40px;
 width: 3em;
 height: 3em !important;
 height: 2.8em;
 outline: none;
 color: #3B2828;
}

div.datePicker table th {
 border: 0 none;
 padding: 0;
 line-height: 1em;
 font-weight: bold;
 color: #222;
 text-align: center;
 vertical-align: middle;
}

div.datePicker table td.date-picker-unused {
 background: #fff url(/js/calendar/media/backstripes.gif);
 border-color: #dcdcdc;
 padding: 0;
 cursor: default !important;
}

div.datePicker table thead th.date-picker-title {
 width: auto;
 height: auto;
 padding: 0.4em 0;
}

/* The "mon tue wed etc" day header button styles */
div.datePicker table th.date-picker-day-header {
 text-transform: lowercase;
 width: 3em;
}

div.datePicker table th.date-picker-day-header span {
 display: block;
}

/* The "todays date" style */
div.datePicker table td.date-picker-today {
 background: #fff url(/js/calendar/media/bullet2.gif) no-repeat 0 0;
 color: rgb(100, 100, 100) !important;
}

/* The "selected date" style */
div.datePicker table td.date-picker-selected-date {
 color: #333 !important;
 border-color: #333 !important;
}

/* the "highlight days" style */
div.datePicker table td.date-picker-highlight {
 color: #a86666;
}

/* The date "out of range" style */
div.datePicker table td.out-of-range {
 color: #ccc !important;
 font-style: oblique;
 background: #fcfcfc !important;
 cursor: default !important;
}

/* The "disabled days" style */
div.datePicker table td.day-disabled {
 color: #aaa !important;
 background: transparent !important;
 cursor: default !important;
}

/* The "active cursor" style */
div.datePicker table tbody td.date-picker-hover {
 background: #fff url(/js/calendar/media/bg_header.jpg) no-repeat 0 0;
 cursor: pointer;
 border-color: rgb(100, 130, 170);
 color: rgb(100, 130, 170);
}

/*
   Quirksmode necessity?
   ---------------------

   If your HTML document renders in quirksmode (i.e. has no doctype declaration)
   then uncomment the following CSS rule to set a less drastic font-size in IE

div.datePicker table th,
div.datePicker table td
        {
        font-size:100%;
        }
*/
 /* Remove the images for Internet Explorer <= v6 using the "* html" hack */
* html div.datePicker table td {
 background-image: none;
}

* html div.datePicker table td.date-picker-unused {
 background: #f2f2f2;
}