.calendar {

  width: 280px;

  height: 330px;

}

.calendar-modal {

  display: none;

  position: absolute;

  background: #fdfdfd;

  border: 1px solid #e8e8e8;

  box-shadow: 1px 2px 3px #ddd

}

.calendar-inner {

  position: relative;

  z-index: 1;

  -webkit-perspective: 1000;

  -moz-perspective: 1000;

  -ms-perspective: 1000;

  perspective: 1000;

  -ms-transform: perspective(1000px);

  -moz-transform: perspective(1000px);

  -moz-transform-style: preserve-3d;

  -ms-transform-style: preserve-3d;

}

.calendar-views {

  transform-style: preserve-3d;

}

.calendar .view {

  backface-visibility: hidden;

  position: absolute;

  top: 0;

  left: 0;

  *overflow: hidden;

  

}


.calendar-views .days li.now{
color:#fff;
background:#214089;
}
.calendar-views .days li.nowdate{
color:#fff;
background:#ddd;
}

.calendar-views .days li.has{
cursor:pointer;
color:#fff;

}

.calendar-d .view-month,

.calendar-m .view-date {

  transform: rotateY(180deg);

  visibility: hidden;

  z-index: 1;

}

.calendar-d .view-date,

.calendar-m .view-month {

  transform: rotateY(0deg);

  visibility: visible;

  z-index: 2;

}

.calendar-ct,

.calendar-hd,

.calendar-views .week,

.calendar-views .days {

  overflow: hidden;

}

.calendar-views {

  width: 100%;

}

.calendar .view,

.calendar-display,

.calendar-arrow .prev,

.calendar .date-items li {

  float: left;

}

.calendar-arrow,

.calendar-arrow .next {

  float: right;

}

.calendar-hd {

  padding: 10px 0;

  height: 30px;

  line-height: 30px;

background:#a74035;

}

.calendar-display {

  font-size: 28px;

  text-indent: 10px;

}

.view-month .calendar-hd {

  padding: 10px;

}

.calendar-arrow,

.calendar-display {

  color: #fff;

}

.calendar li[disabled] {

  color: #fff;

}

.calendar li.old[disabled],

.calendar li.new[disabled] {

  color: #eee;

}

.calendar-views .week{ background:#a74035; color:#fff;}



.calendar-display .m,

.calendar-views .days .new,

.calendar-display:hover,

.calendar-arrow span:hover {

  color: #fff;

}

.calendar-views .days li.old,.calendar-views .days li.new{ color:#999;}

.calendar-views .days .new[data-calendar-day]{color:#999;}

.calendar .calendar-views .new .dot,.calendar .calendar-views .old .dot{background:none}

.calendar-arrow span,

.calendar-views .days li[data-calendar-day],

.calendar-views .view-month li[data-calendar-month] {

 

} 

.calendar li[disabled] {

  cursor: not-allowed;

}

.month-items li{ cursor:pointer;}
.month-items li:hover{ background:#eee;}
.calendar-arrow {

  width: 62px;

  margin-right: 10px;

  opacity: 0;
  visibility: hidden;

}

.calendar-arrow span {

  font: 500 18px sans-serif;
  display:inline-block;
  cursor:pointer;
  padding:0 8px;
  line-height:30px;
  background:#af5349;

}



.calendar ol li {

  position: relative;

  float: left;

  text-align: center;

  border-radius: 50%;

}

.calendar .week li,

.calendar .days li {

  width: 40px;

  height: 40px;

  line-height: 40px;

}

.calendar .month-items li {

  width: 70px;

  height: 70px;

  line-height: 70px;

}

.calendar .days li[data-calendar-day]:hover,

.calendar .view-month li[data-calendar-month]:hover {

   

}

.calendar .calendar-views .now {

   

}

.calendar .calendar-views .selected {

  

}

.calendar .calendar-views .dot {

  position: absolute;

  left: 50%;

  top: 50%;

  margin-left: -20px; 

  margin-top: -20px; 

  width: 40px;

  height: 40px;

  background: #a74035;

  border-radius: 50%;

  cursor: pointer;

  z-index:-1;

}

.calendar-views .now .dot {

  background: #fff;

}



.calendar .date-items {

  width: 300%;

  margin-left: -100%;

}



.calendar-label {

  display: none;

  position: absolute;

  top: 50%;

  left: 50%;

  z-index: 2;

  padding: 5px 10px;

  line-height: 22px;

  color: #fff;

  background: #000;

  border-radius: 3px;

  opacity: 0;

  filter: alpha(opacity=0);

}

.calendar-label i {

  display: none;

  position: absolute;

  left: 50%;

  bottom: -12px;

  width: 0;

  height: 0;

  margin-left: -3px;

  border: 6px solid transparent;

  border-top-color: #000;

}