@media only screen and (min-width: 768px) {
  #page-container {
    position: relative;
    min-height: 100vh;
  }
  
  #content-wrap {
    padding-bottom: 20rem;
  }
  #footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 20rem;
  }
}

.nav-button {
    width: 120px;
}

.bg_footer {
  background-color: #7a7a7a;
}


.logout-button {
  width: 160px;
}

.month-btn {
  width:100px;
}


.record_button {
  width: 200px;
}

@media only screen and (min-width: 960px) {
  .navbar .navbar-nav .nav-item .nav-link {
    padding: 0 1em;
  }
  .navbar .navbar-nav .nav-item:not(:last-child) .nav-link {
    border-right: 2px solid #d3d3d3;
  }
}

@media screen and (min-width: 992px) {
  .c-border-right {
      border-right: 5px solid rgb(221, 221, 221);
  }
}

.anchored-titles {
  padding-top: 76px;
  margin-top: -76px;
}

.flat-detail-bg {
  background-color: #f8f9fa;
}

.record-bg {
  background-color: #f7f7f7;
}

.maintenance-head {
  background-color: #e9ecef;
}


.bg-free {
  background-color: #5acbed;
}

.bg-base {
  background-color: #3fb5d9;
}

.bg-pro {
  background-color: #199ac2;
}

.verticalText {
                white-space: nowrap;
                -webkit-transform: rotate(-90deg); 
                -moz-transform: rotate(-90deg);
                transform: rotate(-90deg);                 
}

.form-year {
  width: 0px !important
}

.form-month {
  width: 45px !important
}

.row-border {
  border-radius: 25px;
  background-color:#e9ecef;
  padding: 10px;
}

.contact-form {
  height: 50px;
}