.checkout { background: #ffcf4c !important;}
.midstay { background: #fff !important;}

.mainContainer {
    padding-top:23px;
}

.readonly {
    background: #e2e2e2
}

.tab-button {
    cursor: pointer;
      text-align: center;
      color: var(--color-yellow-1);
      padding: 10px 20px;
      border-radius: 10px;
      background: #000;
}

.selected-button {
    background: var(--color-yellow-1);
    color: #000;
}

.old {
    background:#999 !important; color:#fff !important;
}

td.day{width: 14%; position:relative; overflow:hidden; height: 75px; border: none; vertical-align: top; background:#fff; border-left: 1px solid;border-bottom: 1px solid;padding-top:7px;border-top:1px solid;padding-left:10px;}
td.day div.day-date{font-size: 14pt; font-weight: 700;position:absolute;z-index:2;}

th.table_header{background-color: #000; color: #fff; font-size: 10pt; padding: 5px;text-align:center;}
.not-month{background-color: #fff;}
td.today {background-color:#efefef;}
td.day span.today-date{font-size: 16pt;}
td.day:first-child {
  
  border-left:0px !important;
}

.night-mode td.day {
  background:#333 !important;
}

tr:last-child td.day { border-bottom:none !important }
tbody tr:first-child td.day { border-top:none !important }
table.calendar {
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  border: none;
}

.calendar-btn-td { text-align: center;font-size: 20px;padding: 5px;background: #000;color: #fff !important;font-weight: bold;}
.calendar-month-title { text-align: center;font-size: 16px;padding: 5px;background: #000;color: #fff !important;font-weight: bold; }
.render_calendar { width:100%; }
.currentday {border-left:0px !important; }

.mainContainer { position:relative; }

.ownerbooking {
        background:#e6e6e6;
    }

.fullday {
    background: #ffcf4c !important;
}

.startday {
    position: absolute;
      width: 50%;
      height: 75px;
      background: #ffcf4c;
      right: 0;
      top: 0;
}

.endday {
    position: absolute;
      width: 50%;
      height: 75px;
      background: #ffcf4c;
      left: 0;
      top: 0;
}

.startday { border-left: 5px solid #09090999;  }
    .endday { border-right: 5px solid #09090999; width:47% !important; }
    
    .slideout {
          background: #fff !important;
          color: #333;
          position: fixed !important;
          top: 0;
          right: -1000px !important;
          max-width: 950px;
          width:100%;
          height: 100vh;
          -webkit-transition-duration: 0.3s;
          -moz-transition-duration: 0.3s;
          -o-transition-duration: 0.3s;
          transition-duration: 0.3s;
          z-index:1;
          overflow-y: scroll;
          box-shadow:30px 30px 38px 22px #888;
          z-index:999999999999;
        }
        .slideout.on {
          right: 0  !important;
          
        }
        .modalFade {
            background:#000;height: 100vh;position: fixed;z-index: 101;width: 100%;opacity: 0.3;display:none;
        }
        .progress-bar {
            text-align: center;
  color: #fff;
  font-size: 10px;
  border-radius:10px;
        }
        
        .fixed {
  position: fixed;
  width: 100%;
}