
/*
    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. See: http://webaim.org/techniques/css/invisiblecontent/
*/
.fd-screen-reader
    {
    position:absolute;
    left:-999em;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
    -moz-outline: 0 none;
         outline: 0 none;
    } 
/*
    The wrapper div
*/
.date-picker
    {
    position:absolute;
    z-index:9999;
    text-align:center;
    /* 
    Change the font-size to suit your needs. The following line is for the demo
    that has a 14px font-size defined on the body tag.

    All other rules are "em" based and inherit from the font-size set here.
    */
    font-weight:700;
	font-size:11px;
	font-family:'Malgun Gothic', '맑은 고딕', Tahoma, Arial, Helvetica, Verdana, Arial, "Lucida Grande", sans-serif;
    background:transparent;
    -webkit-user-select:none;
       -moz-user-select:none;
        -ms-user-select:none;
         -o-user-select:none;
            user-select:none;
    /*
    Set the fade in/out animation time here. This is used for browsers that
    support CSS transitions. Non-supporting browsers receive the fade effect
    using a Javascript fallback.
    */
    opacity:1;
    -webkit-transition:opacity .75s ease-in-out;
       -moz-transition:opacity .75s ease-in-out;
        -ms-transition:opacity .75s ease-in-out;
         -o-transition:opacity .75s ease-in-out;
            transition:opacity .75s ease-in-out;
    }
.date-picker div
    {
    border: 1px solid #ccc;
    border-radius:0.4em;
	background-color: #fff;
	box-shadow: 0px 0px 5px rgba(0,0,0,.25);
    }
	
/*
    The following rule is used whenever CSS Animations are supported by the
    browser
*/
.date-picker.fd-dp-fade
    {
    opacity:0;
    }
	
/*
    Styles for the static datePickers
*/
.static-datepicker
    {
    position:relative;
    top:5px;
    left:0;
    margin-bottom:1.5em;
    }
	
/*
    The iframe hack to cover selectlists in IE6
*/
.iehack
    {
    position:absolute;
    background:#fff;
    z-index:9998;
    padding:0;
    margin:0;
    border:0;
    display:none;
    }
	
/*
    The activation "button" created beside each input for popup datePickers
*/
.date-picker-control span
    {
    display:block;
    width:17px;
    height:17px;
    overflow:hidden;
    margin:auto 0;
    resize:none;
    outline:none;
    }

/*
    A base64 encoded image-sprite is used for the activation button. IE6 and 7
    get fed "normal" png images within the rule that follows.
*/
.date-picker-control:link,
.date-picker-control:visited
    {
    position:relative;
    display: -moz-inline-box;
    border:0 none;
    padding:0;
    margin:-1px 4px;
    background-color:transparent;
    background-image:url(../../Common/Image/i-calendar.png);
    background-repeat:no-repeat;
    min-width:17px;
    line-height:1;
    cursor:pointer;
    visibility:visible;
    text-decoration:none;
    vertical-align:text-bottom;
    resize:none;
    }

/*
    Hover states etc for the activation button
*/
.date-picker-button-active:link,
.date-picker-button-active:visited,
.date-picker-control:focus,
.date-picker-control:hover,
.date-picker-control:active
    {
    background-image:url(../../Common/Image/i-calendar-active.png);
	
    }

/*
    Disabled activation button
*/
.date-picker-control-disabled:link,
.date-picker-control-disabled:visited,
.date-picker-control-disabled:hover,
.date-picker-control-disabled:active
    {
    cursor:default;
    }
	
/*
    IE 6 disabled activation button
*/
.date-picker-control-disabled:hover span,
.date-picker-control-disabled:active span
    {
    box-shadow:none !important;
    }

/*
    IE, older Safari & Opera. Seperate CSS rule seems to be required.
*/
.date-picker-control
    {
    display:inline-block;
    outline:none !important;
    }
	
/*
    Default datepicker "button" styles
*/
.date-picker th span
    {
    display:block;
    margin:0;
    text-align:center;
    line-height:19px;
    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;
    }
	
/*
    Generic button class for Next & Previous (both month & year) buttons
*/
.date-picker .prev-but,
.date-picker .next-but
    {
    font-weight:normal;
    font-size:1.75em;
    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;
        -ms-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:#333;
    }

/*
    Today button
*/
.date-picker .today-but
    {
    text-align:center;
    margin:0 auto;
    font-weight:700;
    font-size:12px;
    width:100%;
    text-decoration:none;
    padding-top:0.48em;
    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;
    }

/*
    The gradient background image
*/
.date-picker table
    {
    table-layout:auto;
    empty-cells:show;
    border-spacing:5px;
    border-collapse:separate;
    position:relative;
    margin:0.8em 1em;
    background:url(../../Common/Image/date-picker-table-bg.png) repeat-x 0 0; 
    text-align:center;
    width:auto;
    height:auto;
    color:#555;
    font-size:11px;
    }
	
/* 
    Common TD & TH styling
*/
.date-picker td,
.date-picker tbody th
    {
    padding:0;
    text-align:center;
    vertical-align:middle;
    cursor:pointer;
    width:2em;
    height:2em;
    overflow:hidden;
    border-radius:50%;
	line-height:1.5em;
	border:1px solid transparent;
	font-size:11px;
    font-weight:700;
    }
	
.date-picker th
    {
    border:0 none;
    padding:0;
    font-weight:bold;
    color:#707070;
    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;
    text-transform:uppercase;
    height:30px;
	font-size:11px
    }
	
/* 
    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
    {
    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;
    }
	
/* 
    The "todays date" cell style 
*/
.date-picker .date-picker-today
    {
    background:#828c94;
	    color: #fff;
    }
.date-picker .month-out.date-picker-highlight 
    {
    color:#b87676;
    }
	
/* 
    The "highlight days" style 
*/
.date-picker .date-picker-highlight
    {
    color:#e24b4e;
    }

/*
    Keyboard users get a scaled cursor. webKit exhibits buggy behaviour when 
    scaling TD cells so commented out until I find a curious CSS based fix.
    Opera no longer appears to apply the scale... ho hum...
*/
.date-picker .date-picker-hover,
.date-picker .month-out.date-picker-hover
    {
    cursor:pointer;
    border-color:#828c94;
	-webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
    }

/* 
    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:#555 !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;
    }
.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 .month-display,
.date-picker .year-display
    {            
    cursor:default;                            
    }
.date-picker td:focus,
.date-picker .date-picker-hover 
    {
    overflow:hidden;
	-moz-outline:0 none;
         outline:0 none;        
	-o-highlight:0 none;
	border-color:#555
    }

/*
    Remove the box-shadow & lifted corner effect for the inline datepickers
*/
.static-datepicker table
    {
    box-shadow:0 0 0 transparent;
    }
.static-datepicker:before,
.static-datepicker:after
    {
    display:none;
    }

/* 
    Draggable datepickers 
*/
.date-picker .drag-enabled,
.date-picker .drag-enabled span
    {
    cursor:move;
    }    
/* 
    Disabled datePicker 
*/	
.date-picker-disabled table
    {
    opacity:.8 !important;
    }
.date-picker-disabled table:before,
.date-picker-disabled table:after
    {
    display:none;
    }
.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
    {
    text-shadow:none;
    }
body.fd-drag-active 
    {
    -webkit-touch-callout:none; 
    -webkit-user-select:none;
       -moz-user-select:none;
            user-select:none;     
    }
/* 
    Glow effect for the focused (keyboard active) cursor cell and popup
    datepickers activation button 
*/
@-webkit-keyframes fd-dp-pulse {
    from{box-shadow:0 0 2px rgba(100, 130, 170, 0.8)}
    to{box-shadow:0 0 6px rgba(10, 130, 170, 0.5)}
}
@-moz-keyframes fd-dp-pulse {
    from{box-shadow:0 0 2px rgba(100, 130, 170, 0.8)}
    to{box-shadow:0 0 6px rgba(10, 130, 170, 0.5)}
}
@-ms-keyframes fd-dp-pulse {
    from{box-shadow:0 0 2px rgba(100, 130, 170, 0.8)}
    to{box-shadow:0 0 6px rgba(10, 130, 170, 0.5)}
}
@-o-keyframes fd-dp-pulse {
    from{box-shadow:0 0 2px rgba(100, 130, 170, 0.8)}
    to{box-shadow:0 0 6px rgba(10, 130, 170, 0.5)}
}

.dtpicker-control, .searchForm .attribute .dtpicker-control {width:calc(100% - 26px)}