@font-face {
  font-family: 'icomoon';
  src: url("fonts/icomoon.eot?kulzch");
  src: url("fonts/icomoon.eot?kulzch#iefix") format("embedded-opentype"), url("fonts/icomoon.ttf?kulzch") format("truetype"), url("fonts/icomoon.woff?kulzch") format("woff"), url("fonts/icomoon.svg?kulzch#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-angle-up:before {
  content: "\f106"; }

.icon-angle-down:before {
  content: "\f107"; }

.cal-md,
.cal-hd,
.cal-title,
.cal-prev,
.cal-next,
.cal-bd,
.cal-week,
.cal-day,
.cal-dates,
.cal-date,
.cal-months,
.cal-month,
.cal-years,
.cal-year,
.cal-ft,
.cal-today {
  margin: 0;
  overflow: hidden;
  position: relative;
  z-index: 1; }

.cal-bd-mask{
  margin: 0;
  overflow: hidden;
  position: absolute;
  z-index: 1;
  display: block;
  width: 100%;
  height: calc(100%);
}

.cal-bd-parent{
  margin: 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  /* height: calc((100% / 9) * 7); */
  height: calc((100% / 9) * 8);
}

.next-mask{
  height: calc(100%);
  top: 0px;
  position: absolute;
  animation:bd-nextMask-animatin 0.5s;
}

@keyframes bd-nextMask-animatin
{
  0%   {opacity:1; left:0px;top: 0px;}
  100%  {opacity:1; left:0px;top: calc(-100%);}
  /* 0%   {opacity:1; left:0px;top: 0px;}
  100%  {opacity:1; left:0px;top: calc(120%);} */
}

.cal-bd-next{
  animation:bd-next-animatin 0.5s;
}

@keyframes bd-next-animatin
{
  0%   {opacity:1; left:0px;top: calc(100%);}
  100%  {opacity:1; left:0px;top: 0px;} 
  /* 0%   {opacity:1; left:0px;top: calc(-120%);}
  100%  {opacity:1; left:0px;top: 0px;} */
}

.prev-mask{
  height: calc(100%);
  top: 0px;
  position: absolute;
  animation:bd-prevMask-animatin 0.5s;
}

@keyframes bd-prevMask-animatin
{
  0%   {opacity:1; left:0px;top: 0px;}
  100%  {opacity:1; left:0px;top: calc(100%);} 
  /* 0%   {opacity:1; left:0px;top: 0px;}
  100%  {opacity:1; left:0px;top: calc(-120%);} */
}

.cal-bd-prev{
  animation:bd-prev-animatin 0.5s;
}

@keyframes bd-prev-animatin
{
  0%   {opacity:1; left:0px;top: calc(-100%);}
  100%  {opacity:1; left:0px;top: 0px;} 
  /* 0%   {opacity:1; left:0px;top: calc(120%);}
  100%  {opacity:1; left:0px;top: 0px;} */
}







.cal-hd,
.cal-ft {
  box-sizing: border-box;
  height: calc(100% / 10);
}

.cal-prev,
.cal-next,
.cal-date,
.cal-day,
.cal-month,
.cal-year {
  text-align: center; }

.cal-prev,
.cal-next,
.cal-year,
.cal-month,
.cal-date,
.cal-day {
  float: left; }

.cal-title,
.cal-prev,
.cal-next,
.cal-year,
.cal-month,
.cal-date,
.cal-today,
.cal-button {
  cursor: pointer; }

.cal-md {
  background-color: var(--mainBackgroundColor);
  font-size: 14px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  width: 100%; }

.cal-md,
.cal-switcher,
.cal-title,
.cal-prev,
.cal-next,
.cal-day,
.cal-today,
.cal-button,
.cal-months,
.cal-years,
.cal-ft-date {
  height: 100%; }

.cal-bd {
  /* height: calc((100% / 9) * 7);   1 */
  /* height: calc(100%); 2 */
  height: calc((100% / 9) * 8); 
 }

.cal-week {
  height: calc(100% / 7); }

.cal-dates {
  height: calc((100% / 7) * 6); }

.cal-day,
.cal-date {
  width: calc(100% / 7); }

.cal-date {
  height: calc(100% / 6); }

.cal-month,
.cal-year {
  height: 25%;
  width: 25%; }

.cal-md-without-footer .cal-bd {
  height: calc((100% / 8) * 7); }

.cal-title,
.cal-prev,
.cal-next,
.cal-day,
.cal-date,
.cal-month,
.cal-year,
.cal-today,
.cal-button {
  display: table; }

.cal-text {
  display: table-cell;
  vertical-align: middle;
  font-size: 12px;
  line-height: normal; }

.cal-festival-text,
.cal-lunar-text {
  bottom: 0;
  color: var(--calendar-color);
  font-size: 12px;
  margin: 0;
  padding: 5px;
  position: absolute;
  right: 0;
  z-index: 2; }

.cal-festival-text {
  color: var(--activeColor); }

.cal-hd {
  border-bottom: 1px solid var(--lightBackgroundColor); }

.cal-title {
  color: var(--mainTextColor);
  /* font: normal 16px 'Arial', sans-serif; */
  margin-right: 60px;
  padding-left: 10px; }
  .cal-title:hover {
    color: var(--activeColor); }

.cal-switcher {
  font-size: 22px;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  width: 60px;
  z-index: 2; }

.cal-prev,
.cal-next {
  color: var(--mainTextColor);
  width: 30px; }
  .cal-prev:hover,
  .cal-next:hover {
    background-color: var(--mainHoverColor);
    color: var(--mainTextColor); }

.cal-year,
.cal-month,
.cal-date {
  color: var(--mainTextColor); }
  .cal-year:hover,
  .cal-month:hover,
  .cal-date:hover {
    background-color: var(--mainHoverColor);
    color: var(--mainTextColor); }

.cal-year-prev,
.cal-year-next,
.cal-month-prev,
.cal-month-next,
.cal-date-prev,
.cal-date-next {
  background-color: var(--mainBackgroundColor);
  color: var(--lightTextColor); }
  .cal-year-prev:hover,
  .cal-year-next:hover,
  .cal-month-prev:hover,
  .cal-month-next:hover,
  .cal-date-prev:hover,
  .cal-date-next:hover {
    background-color: var(--mainHoverColor);
    color: var(--mainTextColor); }

.cal-weekend {
  color: #e24144; }
  .cal-weekend .cal-lunar-text {
    color: #e24144; }
  .cal-weekend:hover {
    color: var(--mainTextColor); }

.cal-picked {
  background-color: var(--hl-color);
  color: var(--calendar-color);
  font-weight: bold; }
  .cal-picked:hover {
    background-color: var(--mainHoverColor);
    color: var(--mainTextColor); }
  .cal-picked .cal-festival-text,
  .cal-picked .cal-lunar-text {
    color: var(--calendar-color); }
  .cal-picked.cal-current {
    background-color: var(--hl-color); }
    .cal-picked.cal-current:hover {
      background-color: var(--mainHoverColor); }
    .cal-picked.cal-current .cal-festival-text,
    .cal-picked.cal-current .cal-lunar-text {
      color: var(--calendar-color); }

.cal-picked-range {
  background-color: var(--calendar-bd-color);
  color: var(--hl-color);
  font-weight: normal; }
  .cal-picked-range:hover {
    background-color: var(--mainHoverColor);
    color: var(--mainTextColor); }

.cal-current {
  background-color: #34a6f8;
  color: var(--calendar-color); }
  .cal-current:hover {
    background-color: #34a6f8;
    color: var(--calendar-color); }
  .cal-current .cal-festival-text,
  .cal-current .cal-lunar-text {
    color: var(--calendar-color); }

.cal-ft {
  border-top: 1px solid var(--lightBackgroundColor);
  font-size: 13px; }

.cal-ft-date {
  margin-right: 70px;
  text-align: center; }


.cal-ft-time {
  padding-top: 1%;
    height: 90%; 
  margin: 0;
  overflow: hidden;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 70px;
  z-index: 2;
  
  
}

.cal-button{
  margin: 0;
  overflow: hidden;
  position: relative;
  width: 60px;
  background-color: var(--hl-color);
  border-radius: 5px;
  color: var(--calendar-color);
  z-index: 1; 
}


/* .cal-button:hover {
  
} */

.cal-today,
.cal-button {
  text-align: center; }
  .cal-today:hover{
    color: var(--hl-color); }

.cal-hidden {
  display: none; }
