/*
* @Author: Mertens
* @Date:   2016-04-29 15:27:02
* @Last Modified time: 2016-05-02 23:19:37
*/
.calendar
{
    position: relative;
    z-index: 1;
    top: 20px;
    left: 25px;

    display: inline-block;

    padding: 0 10px;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    color: #fff;
    border-radius: 5px;
    background-color: #DA675C;
}
.calendar label
{
    cursor: pointer;
    font-weight: bold;
    color: #fff;
}
.calendar label:hover {
    color: #F8F7F5;
}
.calendar .input-box
{
    font-size: 12px;
    line-height: 14px;

    height: 14px;
    margin: 5px;
    padding: 5px;

    border: 1px solid #f47f7f;
    border-radius: 5px;
    outline-color: #f63939;
}

/* 日历开始 */
    .calendar-modal
    {
        position: absolute;
        z-index: 10;
        top: 100%;
        left: 87px;

        box-sizing: border-box;
        width: 340px;

        color: #726a6a;
        border-radius: 5px;
        background-color: #F8F7F5;
        padding: 10px;
        overflow: hidden;
    }
    .calendar-modal.hidden {
        display: none;
    }
    /* 头部开始 */
        .calendar-hd
        {
            overflow: hidden;

            padding: 10px;
        }
        .calendar-hd .prev,
        .calendar-hd .next
        {
            float: left;
            cursor: pointer;
        }
        .calendar-hd .prev
        {
            width: 0;
            height: 0;
            margin-left: -100%;

            border-width: 8px 16px 8px 0;
            border-style: solid;
            border-color: transparent #DA675C transparent transparent;
        }
        .calendar-hd .next
        {
            width: 0;
            height: 0;
            margin-left: -20px;

            border-width: 8px 0 8px 16px;
            border-style: solid;
            border-color: transparent transparent transparent #DA675C;
        }
        .calendar-hd .prev:hover {
            border-color: transparent #F16865 transparent transparent;
        }
        .calendar-hd .next:hover {
            border-color: transparent transparent transparent #F16865;
        }
        .calendar-hd .select-fix
        {
            float: left;

            width: 100%;
        }
        .calendar-hd .select
        {
            line-height: 20px;

            margin: 0 20px;

            text-align: center;
        }
        .calendar-hd .select .select-month,
        .calendar-hd .select .select-year
        {
            display: inline-block;
            margin: 0 10px;
        }
        .calendar-hd .select .btn-wrap {
            margin-left: 3px;
            width: 10px; 
            height: 16px;
            display: inline-block;
        }
        .calendar-hd .select .sub-btn-prev {
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 4px 8px 4px;
            border-color: transparent transparent #DA675C transparent;
            margin-top: 2px;
            cursor: pointer;   
        }
        .calendar-hd .select .sub-btn-next {
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 8px 4px 0 4px;
            border-color: #DA675C transparent transparent transparent;
            margin-top: 2px;
            cursor: pointer;
        }
        .calendar-hd .select .sub-btn-prev:hover {
            border-color: transparent transparent #F16865 transparent;
        }
        .calendar-hd .select .sub-btn-next:hover {
            border-color: #F16865 transparent transparent transparent;
        }
        .calendar-hd .select input
        {
            width: 50px;

            text-align: center;

            border-radius: 5px;
            outline: 0;
            line-height: 20px; 
            font-size: 12px;
            font-weight: bold;
        }
    /* 头部结束 */
    /* 日历内容开始 */
        .calendar-ct .week
        {
            overflow: hidden;
        }
        .calendar-ct .date-items {
            width: 3000px;
            overflow: hidden;
            margin-left: -100%; 
        }
        .calendar-ct .date-items.slide {
            transition: margin .3s ease-in;
        }
        .calendar-ct .date-items .days{
            float: left;
            width: 320px;
        }
        .calendar-ct .week li,
        .calendar-ct .days li
        {
            line-height: 40px;

            float: left;

            width: 40px;
            height: 40px;
            margin: 5px 0 0 5px;

            
            text-align: center;

            border-radius: 50%;
        }
        .calendar-ct .week li {
            font-weight: bold;
            color: #474644;
        }
        .calendar-ct .days li {
            cursor: pointer;
            color: #888683;
            transition: all .15s ease-in;
        }
        .calendar-ct .days li.selected:hover{
            background-color: #F16865;
        }
        .calendar-ct .days li.is-crt:hover {
            background-color: #D8D7D4;
            color: #F8F7F5;
        }
        .calendar-ct .days li.is-crt.duration {
            background-color: #FAABA0;
            color: #F8F7F5;
        }
        .calendar-ct .days li.selected,
        .calendar-ct .days li.selected:hover {
            background-color: #F16865;
            color: #F8F7F5;
        }
        .calendar-ct .days li.disable {
            color: #BCBCBC;
        }
        .calendar-ct .days li.disable:hover {
            background-color: #F8F7F5;
        }
    /* 日历内容结束 */
/* 日历结束 */