@import url(../../www/CSS/calendar.css);
@keyframes calendarShowAnimation {
  from {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.5, 1.5, 1.5);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
#calc_div {
    border: none;
    width: 240px!important;
    padding: 2px;
    box-shadow: 0px 0px 10px #666;
    opacity: 0;
}
#calc_div.showed {
    opacity: 1;
    transition: transform 1s, opacity 1s;
    animation-duration: 0.4s;
    -webkit-animation-name: calendarShowAnimation;
    animation-name: calendarShowAnimation;
}
#calc_div table {
    border-spacing:0;
    border-collapse: collapse;
    width: 100%;
}
#calc_div td.cpMonthNavigation,
#calc_div td.cpYearNavigation {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
}
#calc_div select.cpMonthNavigation,
#calc_div select.cpYearNavigation {
    padding: 3px;
    width: 120px!important;
    border: thin solid #65a5e5;
}
#calc_div select.cpYearNavigation {
    width: 80px !important;
}
#calc_div .cpBorder {
    border: none;
}
#calc_div th,
#calc_div td {
    padding: 0;
}
#calc_div TD.cpDayColumnHeader
#calc_div TD.cpCurrentDate,
#calc_div TD.cpCurrentDateDisabled,
#calc_div TD.cpTodayText,TD.cpTodayTextDisabled {
    border: none;
}
#calc_div .cpDayColumnHeader,
#calc_div .cpCurrentDate,
#calc_div .cpYearNavigation,
#calc_div .cpMonthNavigation,
#calc_div .cpOtherMonthDate,
#calc_div .cpCurrentMonthDate,
#calc_div A.cpCurrentMonthDate,A.cpCurrentMonthDate:hover {
    font-family: inherit;
    font-size: 14px;
    line-height: 20px;
    color: #333;
}
#calc_div .cpCalendarClose {
    box-sizing: border-box;
    width: 50%;
    background: white;
    font-size: 14px;
    line-height: 14px;
    font-family: inherit;
    height: auto;
    font-weight: bold;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    margin-bottom: 8px;
    float: none;
    text-align: center;
    margin: auto;
    margin-bottom: 0.5rem;
}
#calc_div td.cpDayColumnHeader {
    text-align: center;
    font-weight: bold;
}
#calc_div span.cpDayColumnHeader {
    display: inline-block;
    font-family: sans-serif;
    padding: .5em 0;
}
#calc_div td.cpYearNavigation,
#calc_div td.cpMonthNavigation,
#calc_div td.cpCurrentDate {
    border: none;
}
#calc_div a.cpYearNavigation,
#calc_div a.cpMonthNavigation {
    padding: 0.4em;
}
#calc_div a.cpCurrentDate,
#calc_div a.cpOtherMonthDate,
#calc_div a.cpCurrentMonthDate,
#calc_div span.cpCurrentDate,
#calc_div span.cpOtherMonthDate,
#calc_div span.cpCurrentMonthDate {
    text-align: center;
    border: none;
    padding: 0.2em;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    transition: all 0.5s;
    box-sizing: border-box;
    border: 1px solid transparent;
}

#calc_div :focus {
    outline: #65a5e5 solid 3px !important;
    cursor: pointer;
}

#calc_div a.cpOtherMonthDate {
    color: #999;
}
#calc_div a.cpCurrentDate {
    border: 1px solid rgb(130, 126, 126);
    background-color: #ccc;
}
#calc_div .cpCurrentMonthDate a:hover,
#calc_div .cpOtherMonthDate a:hover {
    background-color: #eee;
}
#calc_div .cpCalendarClose,
#calc_div td.cpMonthNavigation,
#calc_div td.cpYearNavigation {
    background-color: #eeeeee;
}
#calc_div .cpCalendarClose,
#calc_div td.cpMonthNavigation select,
#calc_div td.cpYearNavigation select {
    background-color: white;
    border: 1px solid #ccc;
}
#calc_div .cpCalendarClose {
    background-color: #eeeeee;
    color: #000;
}
#calc_div .cpCalendarClose:hover {
    background-color: #e1e1e1;
}
#calc_div td.cpDayColumnHeader {
    border-bottom: thin solid #eeeeee;
    border-top: thin solid #eeeeee;
}
#calc_div span[class$="Disabled"] {
    color: #999;
    opacity: 0.3;
}
#calc_div table td { width: auto; display: table-cell; float: none; border: none;}