.month ul, .weekdays ul, .days ul {list-style-type: none;}
.month, .weekdays, .days {font-family: Verdana, sans-serif;}

/* Month header */
.month {
  padding: 70px 25px;
  width: 100%;
  background: #1abc9c;
  background: #447acf;
  background: #00A79D;
  text-align: center;
  padding: 3px 16px;
}

/* Month list */
.month ul {
  margin: 0;
  padding: 0;
}

.month ul li {
  color: white;
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: 3px;
}



/* Previous button inside month header */
.month .prev {
  float: left;
  padding-top: 10px;
  cursor: pointer;
}

/* Next button */
.month .next {
  float: right;
  padding-top: 10px;
  cursor: pointer;
}

.month ul li:hover{ color: #000000;}

/* Weekdays (Mon-Sun) */
.weekdays {
  margin: 0;
  padding: 10px 0;
  background-color:#ddd;
}

.weekdays li {
  display: inline-block;
  width: 13.6%;
  color: #666;
  text-align: center;
}

/* Days (1-31) */
.days, .months {
  padding: 10px 0;
  background: #eee;
  margin: 0;
}

.days li, .months li, .years li {
  list-style-type: none;
  display: inline-block;
  width: 13.6%;
  text-align: center;
  margin-bottom: 5px;
  font-size:12px;
  color: #777;
  cursor: pointer;
  padding: 5px;
}

.days li.selected-date, .months li.selected-date, .years li.selected-date {
  background-color: #17a2b8;
  color: #fff;
}
.days li.to-date, .months li.to-date, .years li.to-date{
  background-color: #beccce;
    color: #4f4c4c;
}

.days li:hover, .months li:hover, .years li:hover{
  background-color: #e1e1e1;
  color: #777;
}

/* Highlight the "current" day */
.days li .active, .months li .active , .years li .active {
  padding: 5px;
  background: #1abc9c;
  color: white !important
}

.clFooter{
  text-align: center;
}
.clFooter a:hover{background-color: #e1e1e1;
  color: #777; padding: 5px; }
.HsnCalender-container{
  border: #000 solid 1px;
  width: 400px;
  position: absolute;
  z-index: 2;
  background-color: #fff;
}

.HsnCalender-container .clickable{cursor: pointer;;}