/*

  Please note:
  
  * This is a version of the stylesheet that does not use base64 encoded images.
  * You will need to edit the image paths to point to the correct location on your server
  * You will, of course, need to upload the images to your server!   
  * Everything but IE6 uses an image sprite for the button. IE6 uses individual images
  * After editing the image paths, dont't forget to compress the CSS file (using YUI for example) before uploading to your server
    - http://www.refresh-sf.com/yui/
      
*/
    
/* Hide the datepickers associated input by using a className */
.fd-hidden-input
        {
        display:none;
        }
/* Screen reader class - used to hide spans inside each cell from the visual display */
.fd-screen-reader
        {
        position:absolute;
        left:-999em;
        top:0;
        width:1px;
        height:1px;
        overflow:hidden; 
        outline: 0 none;
	-moz-outline: 0 none;
        } 
/* The wrapper div */
.date-picker
        {
        position:absolute;        
        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/1em 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, sans-serif; */
        
        /* Or, if you prefer a pixel precision */
        /* font:900 12px/12px Verdana, sans-serif; */
        
        background:transparent;

        /* Mozilla & Webkit extensions to stop text-selection. */
        -moz-user-select:none;
        -khtml-user-select:none;
        -webkit-user-select:none;                 
        }
/* Styles for the static datePickers */
.static-datepicker
        {
        position:relative;        
        top:5px;
        left:0;
        margin-bottom:1.5em;
        }
.date-picker table
        {
        width:auto;
        height:auto;
        border-collapse:separate;
        color:#555;         
        } 
/* The iframe hack to cover selectlists in IE6 */
.iehack
        {
        position:absolute;
        background:#fff;
        z-index:9998;
        padding:0;
        border:0;
        display:none;
        margin:0;
        }
/* The "button" created beside each input for popup datePickers */
.date-picker-control span
        {
        display:block;
        width:18px;
        height:18px;
        overflow:hidden;
        margin:auto 0;
        }
.date-picker-button-active span,
.date-picker-control:focus span,
.date-picker-control:hover span,
.date-picker-control:active span
        {
        -webkit-box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        -moz-box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        -webkit-border-radius:2px;
        -moz-border-radius:2px;
        border-radius:2px;
        }
.date-picker-control:link,
.date-picker-control:visited
        {
        position:relative;
        display: -moz-inline-stack;
        border:0 none;
        padding:0;
        margin:0 15px;
        background:transparent url(../media/datepicker-sprite.png) no-repeat 0 -72px;
        min-width:18px;
        line-height:1;
        cursor:pointer;
        visibility:visible;
        text-decoration:none;
        vertical-align:text-bottom;         
        }
/* If the calendar has a valid date use different icon */
.date-picker-dateval:link,
.date-picker-dateval:visited
        {
        background-position:0 -108px;
        } 
/* IE 6 fed another rule to show the normal button icon */
.oldie-mhtml .date-picker-control:link,
.oldie-mhtml .date-picker-control:visited
        {
        /* IE6 gets the filter treatment */
        _background-image:none;
        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.frequency-decoder.com/demo/datePicker/media/datepicker-grey.png');        
        } 
/* IE 6 fed another rule to show the icon displayed when a valid date selected */
.oldie-mhtml .date-picker-dateval:link,
.oldie-mhtml .date-picker-dateval:visited
        {
        /* IE6 gets the filter treatment */
        _background-image:none;
        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.frequency-decoder.com/demo/datePicker/media/datepicker-selected.png');        
        }                           
/* Hover states etc for the button */
.date-picker-control:focus,
.date-picker-control:hover,
.date-picker-control:active,
.date-picker-button-active:link,
.date-picker-button-active:visited
        {
        background-position:0 0;
        }
/* IE 6 button hover states */
.oldie-mhtml .date-picker-button-active:link,
.oldie-mhtml .date-picker-button-active:visited,
.oldie-mhtml .date-picker-control:focus,
.oldie-mhtml .date-picker-control:hover,
.oldie-mhtml .date-picker-control:active
        {
        /* IE6 gets the filter treatment */
        _background-image:none;
        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.frequency-decoder.com/demo/datePicker/media/datepicker-cursor-selected.png');             
        }
/* Disabled button */
.date-picker-control-disabled:link,
.date-picker-control-disabled:visited,
.date-picker-control-disabled:hover,
.date-picker-control-disabled:active
        {
        background-position:0 -36px;
        cursor:default;
        }
/* IE 6 disabled button */
.oldie-mhtml .date-picker-control-disabled:link,
.oldie-mhtml .date-picker-control-disabled:visited,
.oldie-mhtml .date-picker-control-disabled:hover,
.oldie-mhtml .date-picker-control-disabled:active
        {
        /* IE6: Filter treatment */
        _background-image:none;
        _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.frequency-decoder.com/demo/datePicker/media/datepicker-disabled.png');                       
        }
.date-picker-control-disabled:hover span,
.date-picker-control-disabled:active span
        {
        -webkit-box-shadow:none !important;
        -moz-box-shadow:none !important;
        box-shadow:none !important;
        }
/* Feed IE6 the following rule, IE7 should handle the min-width declared above */
.oldie-mhtml .date-picker-control
        {
        _width:18px;
        }
/* IE, Safari & Opera. Seperate CSS rule seems to be required. */
.date-picker-control
        {
        display:inline-block;
        }
/* Default datepicker "button" styles */
.date-picker th span
        {
        display:block;
        padding:0;
        margin:0;
        text-align:center;
        line-height:1em;
        border:0 none;
        background:transparent;
        font-weight:bold;
        cursor:pointer;
        }
/* The "month, year" display */
.date-picker .month-display,
.date-picker .year-display
        {
        display:inline;
        text-transform:uppercase;
        letter-spacing:1px;
        font:normal 1.2em Verdana, Sans-Serif;
        }
/* Generic button class for Next & Previous (both month & year) buttons */
.date-picker .prev-but,
.date-picker .next-but
        {
        font-weight:normal;
        font-size:2.4em;
        font-family: georgia, times new roman, palatino, times, bookman, serif;
        cursor:pointer;
        }
.date-picker .prev-but,
.date-picker .next-but,
.date-picker .today-but
        {         
        -webkit-transition:all .2s ease-in-out;
        -moz-transition:all .2s ease-in-out;
        -o-transition:all .2s ease-in-out;
        transition:all .2s ease-in-out;        
        }
/* Hover effect for Next & Previous (month, year) buttons */
.date-picker .prev-but:hover,
.date-picker .next-but:hover,
.date-picker .today-but:hover
        {
        color:#a84444;
        }
.date-picker .prev-but:hover,
.date-picker .next-but:hover
        {
        /*        
        Uncomment this if you want a scale effect...
        
        -webkit-transform:scale(1.6);
        -moz-transform:scale(1.6);
        -ie-transform:scale(1.6);
        -o-transform:scale(1.6);
        transform:scale(1.6);
        
        text-shadow:0 2px 1px rgba(0,0,0,.4);
        */
        }
/* Today button */
.date-picker .today-but
        {
        text-align:center;
        margin:0 auto;
        font:normal 1em Verdana, Sans-Serif;
        width:100%;
        text-decoration:none;
        padding-top:0.3em;
        text-transform:uppercase;
        vertical-align:middle;
        cursor:pointer          
        }
/* Disabled buttons */ 
.date-picker-disabled .prev-but,
.date-picker-disabled .next-but,
.date-picker-disabled .today-but,
.date-picker-disabled .prev-but:hover,
.date-picker-disabled .next-but:hover,
.date-picker-disabled .today-but:hover,
.date-picker .prev-but.fd-disabled:hover,
.date-picker .next-but.fd-disabled:hover,
.date-picker .fd-disabled,
.date-picker .fd-disabled:hover
        {
        color:#aaa;
        cursor:default !important; 
        opacity:1;        
        }   
.date-picker .prev-but.fd-disabled:hover,
.date-picker .next-but.fd-disabled:hover
        {
        -webkit-transform:scale(1);
        -moz-transform:scale(1);
        -ie-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
        text-shadow:0 -1px 1px rgba(255,255,255,.8);
        }
/* The gradient background image */
.date-picker table,
.date-picker td,
.date-picker tbody th,
.date-picker .day-disabled,
.date-picker .date-picker-hover.day-disabled,
.date-picker .date-picker-unused,
.date-picker .month-out 
        {
        background-color:#fff;
        background-image:url(../media/datepicker-gradient.gif);
        background-repeat:repeat-x;
        background-position:0 0;
        }
/* Remove from IE6 */
.oldie-mhtml .date-picker table,
.oldie-mhtml .date-picker td,
.oldie-mhtml .date-picker tbody th,
.oldie-mhtml .date-picker .day-disabled,
.oldie-mhtml .date-picker .date-picker-hover.day-disabled,
.oldie-mhtml .date-picker .date-picker-unused,
.oldie-mhtml .date-picker .month-out 
        {
        _background-image:none;
        }
.date-picker table
        {
        position:relative;               
        margin:0;
        padding:0;
        border:1px solid #ccc;        
        background-position:0 -20px; 
        text-align:center;
        border-spacing:2px;
        padding:0.3em; 
        width:auto;             
        empty-cells:show;
        z-index:2;   
        -webkit-border-radius:0.8em;
        -moz-border-radius:0.8em;
        border-radius:0.8em;             
        -webkit-box-shadow:0px 0px 5px #aaa; 
        -moz-box-shadow:0px 0px 5px #aaa; 
        box-shadow:0px 0px 5px #aaa;               
        }
/* Common TD & TH styling */
.date-picker td,
.date-picker tbody th
        {                 
        border:0 none;
        padding:0;
        text-align:center;
        vertical-align:middle;               
        cursor:pointer;
        background-position:0 -35px; 
        width:3em;
        height:3em;   
        overflow:hidden;      
        outline:transparent none 0px;        
        border:1px solid #ccc;
        text-transform:none;
        text-shadow:0 1px #fff; 
        -webkit-border-radius:2px;        
        -moz-border-radius:2px;         
        border-radius:2px;
        }
.date-picker th
        {
        border:0 none;
        padding:0;        
        font-weight:bold;
        color:#333;
        text-align:center;
        vertical-align:middle; 
        text-transform:none;        
        }
.date-picker .date-picker-week-header
        {                          
        border:1px solid #dcdcdc;        
        font-style:oblique;  
        background:transparent;
        cursor:default;         
        }
.date-picker .date-picker-thead .date-picker-week-header
        {                          
        border:0 none;
        cursor:help;         
        }
/* The "mon tue wed etc" day header styles */
.date-picker .date-picker-day-header
        {
        cursor:help;
        border:0 none;
        padding:0 0 0.2em 0;
        text-transform:lowercase;
        height:auto;
        }
/* tfoot status bar */
.date-picker .date-picker-statusbar
        {
        cursor:default;
        font-weight:normal;
        text-transform:uppercase;
        letter-spacing:0.1em;
        border:0 none;
        background:#fff;
        height:2.8em;
        }
/* TD cell that is _not_ used to display a day of the month */
.date-picker .date-picker-unused
        {
        border-color:#dcdcdc;          
        cursor:default !important;
        background-position:0 -25px;
        }
/* The TH cell used to display the "month, year" title */
.date-picker .date-picker-title
        {
        width:auto;
        height:auto;
        padding:0.4em 0;
        }
/* The "todays date" cell style */
.date-picker .date-picker-today
        {
        background:#fff url(../media/datepicker-today.gif) no-repeat 0 0;
        }
.date-picker .month-out.date-picker-highlight 
        {
        color:#b87676;
        }
/* The "highlight days" style */
.date-picker .date-picker-highlight
        {
        color:#a86666;
        }
/* The "active cursor" style */
.date-picker .date-picker-hover,
.date-picker .month-out.date-picker-hover
        {
        background:#fff url(../media/datepicker-cursor.jpg) no-repeat 0 0;
        cursor:pointer;
        border-color:rgb(100,130,170) !important;
        border-color:rgba(100,130,170,.7) !important;
        color:rgb(100,130,170); 
        text-shadow: 0px 1px 1px #fff;        
        -webkit-box-shadow:0 0 6px rgba(100,130,170,.6); 
        -moz-box-shadow:0 0 6px rgba(100,130,170,.6); 
        box-shadow:0 0 6px rgba(100,130,170,.6);  
        }
/* The "disabled days" style */
.date-picker .day-disabled
        {          
        color:#888;
        cursor:default;
        text-decoration:line-through;
        background-position:0 -15px;
        } 
.date-picker .month-out 
        {
        border-color:#ddd;
        border-color:rgba(220,220,220,0.8);
        color:#aaa;
        background-position:0 -25px;
        } 
/* The "selected date" style - color changed below also */
.date-picker .date-picker-selected-date
        {
        border-color:#888 !important;
        border-color:rgba(7,7,7,.6) !important;
        }
/* The date "out of range" style */
.date-picker .out-of-range,
.date-picker .not-selectable
        {           
        color:#ccc;
        font-style:oblique;
        background:#fcfcfc;
        cursor:default;              
        } 
/* Week number "out of range" && "month-out" styles */
.date-picker th.month-out,
.date-picker th.out-of-range
        {
        color:#aaa;
        font-style:oblique;
        background:#fcfcfc;          
        }
/* Week numbers "out of range" */
.date-picker .out-of-range
        {
        opacity:0.6;
        }  
/* Used when the entire grid is full but the next/prev months dates cannot be selected */
.date-picker .not-selectable
        {         
        opacity:0.8;
        }
/* IE gets the filter treatment */
.oldie-mhtml .date-picker .out-of-range
        {
        filter:alpha(opacity=60);
        }
.oldie-mhtml .date-picker .not-selectable
        {
        filter:alpha(opacity=80);
        }
.date-picker tr
        {
        display:table-row;
        }
.date-picker sup
        {
        font-size:0.86em;
        letter-spacing:normal;
        text-transform:none;
        height: 0;
	line-height: 1;
	position: relative;
	top:-0.2em;	
	vertical-align: baseline !important;
	vertical-align: top;  
        }
.date-picker .date-picker-day-header,
.date-picker .month-display,
.date-picker .year-display
        {            
        text-shadow: 0px 1px 1px #fff;
        }
.date-picker .month-display,
.date-picker .year-display
        {            
        cursor:default;                            
        }
.date-picker td:focus,
.date-picker .date-picker-hover 
        {
        overflow:hidden;
        outline:0px solid #ff0000;        
	-moz-outline: 0 none;
	-o-highlight:0 none;
        }
.date-picker-focus .date-picker-hover,
.date-picker-control:focus span
        {
        -moz-animation:pulse 2s infinite;
        -webkit-animation:pulse 2s infinite;
        -ms-animation:pulse 2s infinite;
        }
/* The "selected date" style */
.date-picker .date-picker-selected-date
        {
        color:#333;
        color:rgba(3,3,3,.8);
        }
.static-datepicker table
        {
        -webkit-box-shadow:0 0 0 transparent;
        -moz-box-shadow:0 0 0 transparent;   
        box-shadow:0 0 0 transparent;           
        }               
.date-picker-focus table
        {
        /* Naughty, naughty - but we add a highlight & box shadow to make up for it */
        outline:none;
        border-color:#999;
        border-color:rgba(153,153,153,.8);
        -webkit-box-shadow:0px 0px 5px #aaa;
        -moz-box-shadow:0px 0px 5px #aaa;
        box-shadow:0px 0px 5px #aaa; 
        }
/* Draggable datepickers */
.date-picker .drag-enabled,
.date-picker .drag-enabled span
        {
        cursor:move;
        }    
/* Disabled datePicker */
.date-picker-disabled table
        {
        opacity:.8 !important;
        }
.oldie .date-picker-disabled table
        {
        filter:alpha(opacity=80);                  
        }
.date-picker-disabled,
.date-picker-disabled td,
.date-picker-disabled th,
.date-picker-disabled th span
        {
        cursor:default !important;          
        }
.date-picker-disabled .prev-but:hover,
.date-picker-disabled .next-but:hover
        {
        -webkit-transform:scale(1);
        -moz-transform:scale(1);
        -ie-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
        text-shadow:none;
        }
body.fd-drag-active 
        {
        -webkit-user-select:none;
        -moz-user-select:none;
        -khtml-user-select:none;
        -webkit-touch-callout:none; 
        user-select:none;     
        }
/* Glow effect for the focused (keyboard active) cursor cell */
@-webkit-keyframes pulse {
0%      {
        box-shadow:0 0 4px rgba(100, 130, 170, 0.5);
        }
20%     {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
40%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
60%     {
        box-shadow:0 0 6px rgba(10, 130, 170, 0.8);
        }
80%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
100%    {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
}
@-moz-keyframes pulse {
0%      {
        box-shadow:0 0 4px rgba(100, 130, 170, 0.5);
        }
20%     {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
40%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
60%     {
        box-shadow:0 0 6px rgba(10, 130, 170, 0.8);
        }
80%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
100%    {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
}
@-ms-keyframes pulse {
0%      {
        box-shadow:0 0 4px rgba(100, 130, 170, 0.5);
        }
20%     {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
40%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
60%     {
        box-shadow:0 0 6px rgba(10, 130, 170, 0.8);
        }
80%     {
        box-shadow:0 0 5px rgba(40, 130, 170, 0.7);
        }
100%    {
        box-shadow:0 0 4px rgba(70, 130, 170, 0.6);
        }
}