body {
  background-color: #e5e5e5;
}
.logo {
  /*position: absolute;*/
  padding: 0px 20px;
}
.logo a {
  display: inline-block;
}
.header {
  background-color: #003a60;
  height: 70px;
  color: #fff;
  background-image: none;
}
.header .fa-home {
  position: absolute;
  color: #fff;
  font-size: 36px;
  top: 20px;
  left: 7em;
}
.navbar-right {
  list-style: none;
  padding: 0;
  margin-right: 1em;
  margin-top: 1em;
}
.navbar-right li {
  display: inline-block;
  margin-left: 20px;
}
.navbar-right li i {
  font-size: 30px;
}
.navbar-right li div {
  font-size: 9px;
  text-align: center;
}
.navbar-right li div span {
  border-top: 12px dashed;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}
.navbar-right li:nth-child(3) i {
  font-size: 34px;
}
#wrapper a.dropdown-toggle {
  color: #fff;
  font-size: 18px;
  background-image: none;
  background-color: #003a60;
  box-shadow: none;
}
#page-wrapper {
  /*margin-top: 3em;*/
  font-family: Verdana;
  padding-bottom:  0px;
}
.footer {
  background-color: #003a60;
  color: #fff;
  padding: 1em;
  text-align: center;
  margin-bottom:  0px;
  border-radius:  0px;
}
.rate-menu {
  background-color: #d1d3d4;
  min-height: 737px;
  padding: 0px;
}
.rate-menu>ul {
  padding: 0px;
  list-style: none;
}
.rate-menu>ul>li {
  padding: 15px;
  font-size: 17px;
  font-weight: bold;
}
.rate-menu>ul>li:hover {
  background-color: #c5d0db;
}
.rate-menu a {
  color: #02214c;
}
.rate-menu i {
  margin-right: 15px;
}
.rate-content {
  padding: 0px;
}
.bengine-content {
  background-color: #f1f2f2;
}
.bengine-content>h3 {
  margin: 0px;
  padding: 15px 10px;
  background-color: #c5d0db;
  font-weight: bold;
  color: #02214c;
}
.add-roomtype {
  padding: 10px 10px 6px 10px;
  display: inline-block;
  width: 100%;
}
.left {
  float: left;
}
.right {
  float: right;
}
.txt-left {
  text-align: left;
}
.txt-right, .tb-basic-info td:nth-child(2) {
  text-align: right;
}
.txt-center, .tb-room-type-detail tr th {
  text-align: center;
}
.btn-add-room, .btn-plus, .btn-open-roomdetail {
  background-color: #216093;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 5px 10px;
}
.btn-open-roomdetail {
  width: 80px;
}
.btn-add-room {
  width: 140px;
}
.roomtype-detail {
  padding: 2em 10px;
}
.tb-room-type {
  background-color: #fff;
  border-radius: 10px;
  margin: 15px 0px;
}
.tb-room-type td {
  padding: 20px;
}
.tb-rty-detail {
  color: #808285;
}
.tb-rty-detail table {
  width: 100%
}
.tb-room-type-detail {
  border: 1px solid #e6e7e8;
}
.tb-room-type-detail tr>th:nth-child(1) {
  width: 30%
}
.tb-room-type-detail tr>th:nth-child(2) {
  width: 30%
}
.tb-room-type-detail tr>th:nth-child(3) {
  width: 40%
}
.tb-room-type-detail tr th{
  height: 50px;
  border: 1px solid #e6e7e8;
}
.tb-room-type-detail>tbody>tr>td {
  border: 1px solid #e6e7e8;
  padding-top: 15px;
  padding-bottom: 15px;
}
.tb-basic-info {
  color: #58595b;
}
.tb-basic-info td:nth-child(2) {
  padding-right: 15px;
}
.tb-basic-info td {
  width: 50%;
  height: 40px;
  padding-left: 15px;
}
.tb-basic-info td>span {
  color: red;
}
.btn-rm-type {
  border: 1px solid #bcbec0;
  border-radius: 7px;
}


.frm-login {
  margin: 2em auto;
  max-width: 400px;
}
#page-wrapper>.container{
  min-height: 600px;
}
/*################################  Dev T #############################*/
ul.sub-menu {
  display: none;
  margin: 0;
  list-style: none;
  list-style-type: none;
  background-color: #003a60;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  margin-top: 0.5em;
  position: relative;
}
ul.sub-menu:before {
  content: "";
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #003a60;
  top: -15px;
  position: absolute;
  right: 20px;
}
ul.sub-menu a {
  color: #fff;
  text-decoration: none;
}
.rate-menu>ul>li.active {
  background-color: #c5d0db;
}
.rate-menu>ul>li.active ul.sub-menu {
  display: block;
}
span.icon-active {
  float: right;
}
li.active  span.icon-active{
  color:#02214c;
}
li.active .sub-menu span.icon-active{
  color: #fff;
}
.rate-menu>ul>li {
  padding-right: 5px;
}





.add-ratetype {
  padding: 20px;
}
.head-bar{
  background-color: #c5d0db;
  color: #003a60;
  padding-top: 15px;
  padding-bottom: 15px;
  border-radius: 5px;
  margin: 15px 10px;
}
.title-type-bar{
  color: #003a60;
  padding-top: 15px;
  padding-bottom: 10px;
  margin: 15px 10px;
  font-size: 12px;
  border-bottom: 1px solid lightgray;
}
.rate_type .btn.toggle-title-panel{
  padding: 2px;
  width: 20%;
}
.col-rate-name{
  padding-right: 40px;
}
.col-rate-rmt ul{
  padding: 0px 15px;
}
.btn-add-room, .btn-plus, .btn-open-roomdetail, .btn-add-rate {
  background-color: #216093;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 5px 10px;
}
.rate_detail_rmt ul{
  list-style: none;
  padding: 0px;
}
.rate_detail_rmt li{
  margin: 5px 0px;
}
.rate_detail_rmt span{
  
}
.rate_type_detail .table-row-equal {
  margin-top: 35px;
}
.rate_type_detail .form-group {
  margin-bottom: 15px;
  background-color: #e5e5e5;
  padding: 10px 0px;
}
.check_rmt_id{
  width: 15px;
  height: 15px;
}
.contro_select_rate{
  margin-bottom: 30px;
}
.contro_select_rate input{
  margin-left: 20px;
  vertical-align: top;
}
.contro_select_rate label{
  margin-right: 15px;
}
.contro_select_rate span{
  font-weight: bold;
}



#box-loading {
  background-color: #000;
  opacity: 0.2;
  width: 100%;
  height: 100%;
  position: fixed;
  display: inline-block;
  top: 0;
  left: 0;
  z-index: 9999;
}
#img-loading {
  position: fixed;
  top: 45%;
  left: 49%;
  z-index: 9999;
}
.table-row-equal {
  padding: 1em;
  box-sizing: border-box;
}
.btn.btn-control-item {
  width: 100%;
  padding: 5px 0;
}



.item.active .fa-caret-right:before {
  content: "\f0d7";
}
.item .panel-toggle {
  display: none;
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.05s;
  padding: 1em 2.6em;
  border-top: 0px solid #d1d3d4;
  border-left: 1px solid #d1d3d4;
  border-right: 1px solid #d1d3d4;
  border-bottom: 0px solid #d1d3d4;
}
#tab-prs .tbody-item .list-items>li.item:last-child .panel-toggle{
  border-bottom: 1px solid #d1d3d4;
}
.item.active .panel-toggle {
  display: inline-block;
  width: 100%;
  -webkit-transition: max-height 1s;
  -moz-transition: max-height 1s;
  -ms-transition: max-height 1s;
  -o-transition: max-height 1s;
  transition: max-height 0.25s;
  max-height: 100%;
}
.box-items .thead {
  box-sizing: border-box;
  padding: 0 0.5em;
  overflow: hidden;
}
.box-items .thead strong {
  font-weight: bold;
  font-size: 1.1em;
  margin-right: 0.3em;
}
.box-items .thead>div {
  padding: 1em;
}
.item.active a.open-panel{
  color: #fff;
}



/*############# class until #############*/
  span.badge.badge-notify {
    background-color: #da1313;
    margin-top: -43px;
  }

  .green {
    color: #30a75c;
  }
  .red {
    color: #c31818;
  }



/*######################## tooltip ########################*/
  [data-tooltip] {
      display: inline-block;
      position: relative;
      cursor: help;
      padding: 4px;
  }
  /* Tooltip styling */
  [data-tooltip]:before {
      content: attr(data-tooltip);
      display: none;
      position: absolute;
      background: #000;
      color: #fff;
      padding: 4px 8px;
      font-size: 14px;
      line-height: 1.4;
      min-width: 100px;
      text-align: center;
      border-radius: 4px;
  }
  /* Dynamic horizontal centering */
  [data-tooltip-position="top"]:before,
  [data-tooltip-position="bottom"]:before {
      left: 50%;
      -ms-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
  }
  /* Dynamic vertical centering */
  [data-tooltip-position="right"]:before,
  [data-tooltip-position="left"]:before {
      top: 50%;
      -ms-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
  }
  [data-tooltip-position="top"]:before {
      bottom: 100%;
      margin-bottom: 6px;
  }
  [data-tooltip-position="right"]:before {
      left: 100%;
      margin-left: 6px;
  }
  [data-tooltip-position="bottom"]:before {
      top: 100%;
      margin-top: 6px;
  }
  [data-tooltip-position="left"]:before {
      right: 100%;
      margin-right: 6px;
  }

  /* Tooltip arrow styling/placement */
  [data-tooltip]:after {
      content: '';
      display: none;
      position: absolute;
      width: 0;
      height: 0;
      border-color: transparent;
      border-style: solid;
  }
  /* Dynamic horizontal centering for the tooltip */
  [data-tooltip-position="top"]:after,
  [data-tooltip-position="bottom"]:after {
      left: 50%;
      margin-left: -6px;
  }
  /* Dynamic vertical centering for the tooltip */
  [data-tooltip-position="right"]:after,
  [data-tooltip-position="left"]:after {
      top: 50%;
      margin-top: -6px;
  }
  [data-tooltip-position="top"]:after {
      bottom: 100%;
      border-width: 6px 6px 0;
      border-top-color: #000;
  }
  [data-tooltip-position="right"]:after {
      left: 100%;
      border-width: 6px 6px 6px 0;
      border-right-color: #000;
  }
  [data-tooltip-position="bottom"]:after {
      top: 100%;
      border-width: 0 6px 6px;
      border-bottom-color: #000;
  }
  [data-tooltip-position="left"]:after {
      right: 100%;
      border-width: 6px 0 6px 6px;
      border-left-color: #000;
  }
  /* Show the tooltip when hovering */
  [data-tooltip]:hover:before,
  [data-tooltip]:hover:after {
      display: block;
      z-index: 50;
  }



/*######################## check box bootstrap style ###########################*/
  .funkyradio div {
    clear: both;
    overflow: hidden;
  }

  .funkyradio label {
    width: 100%;
    border-radius: 3px;
    border: 1px solid #D1D3D4;
    font-weight: normal;
  }

  .funkyradio input[type="radio"]:empty,
  .funkyradio input[type="checkbox"]:empty {
    display: none;
  }

  .funkyradio input[type="radio"]:empty ~ label,
  .funkyradio input[type="checkbox"]:empty ~ label {
    position: relative;
    line-height: 2.5em;
    text-indent: 3.25em;
    margin-top: 0;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }

  .funkyradio input[type="radio"]:empty ~ label:before,
  .funkyradio input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 2.5em;
    background: #D1D3D4;
    border-radius: 3px 0 0 3px;
  }

  .funkyradio input[type="radio"]:hover:not(:checked) ~ label,
  .funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
    color: #888;
  }

  .funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
  .funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #C2C2C2;
  }

  .funkyradio input[type="radio"]:checked ~ label,
  .funkyradio input[type="checkbox"]:checked ~ label {
    color: #777;
  }

  .item.active .funkyradio input[type="radio"]:checked ~ label,
  .item.active .funkyradio input[type="checkbox"]:checked ~ label {
    color: #fff;
  }

  .funkyradio input[type="radio"]:checked ~ label:before,
  .funkyradio input[type="checkbox"]:checked ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #333;
    background-color: #ccc;
  }

  .funkyradio input[type="radio"]:focus ~ label:before,
  .funkyradio input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
  }

  .funkyradio-default input[type="radio"]:checked ~ label:before,
  .funkyradio-default input[type="checkbox"]:checked ~ label:before {
    color: #333;
    background-color: #ccc;
  }

  .funkyradio-primary input[type="radio"]:checked ~ label:before,
  .funkyradio-primary input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #337ab7;
  }

  .funkyradio-success input[type="radio"]:checked ~ label:before,
  .funkyradio-success input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5cb85c;
  }

  .funkyradio-danger input[type="radio"]:checked ~ label:before,
  .funkyradio-danger input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #d9534f;
  }

  .funkyradio-warning input[type="radio"]:checked ~ label:before,
  .funkyradio-warning input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #f0ad4e;
  }

  .funkyradio-info input[type="radio"]:checked ~ label:before,
  .funkyradio-info input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5bc0de;
  }

  .title-toggle {
    color: #6d6e71;
    box-sizing: border-box;
    padding: 0.5em;
    cursor: auto;
    border-top: 1px solid #d1d3d4;
    border-left: 1px solid #d1d3d4;
    border-right: 1px solid #d1d3d4;
    border-bottom: 0px;
  }

  ul.list-items>li.item:last-child>.title-toggle{
    border-bottom: 1px solid #d1d3d4;
  }


  .container-admin {
    box-sizing: border-box;
    padding: 2em;
  }



  /*################## Vender #####################*/
    .box-vender {
      margin-bottom: 2em;
    }


  /*################## Purchase #######################*/
    .triangle-icon {
      font-size: 1em;
      float: left;
      /*margin-top: 0.5em;*/
      width: 10px;
    }
    .box-btn-control>button {
      font-weight: bold;
    }






  /*################## AutoCompalte #######################*/
    .box-auto-complate {
      position: relative;
    }
    .box-auto-complate>.container-items {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      display: inline-block;
      z-index: 9999;
      background-color: #fff;
      box-sizing: border-box;
      height: 300px;
      overflow: auto;
    }
    .box-items {
      margin: 0;
      padding: 0;
      list-style-type: none;
      list-style: none;
    }
    .box-items>li {
      list-style: none;
      padding: 0.2em 1em;
    }
    .box-items>li:hover,
    .box-items>li:focus,
    .box-items>li:active {
      background-color: #f6f6f6;
    }
    .box-items>li>a {
      display: inline-block;
      width: 100%;
      padding: 7px 0;
      text-decoration: none;
    }

.img-staff-login>strong {
  font-size: 42px;
  color: #3176b2;
}
.img-staff-login {
    text-align: center;
    padding: 7px 0;
}

form.frm-login {
    padding: 5px;
    background: #fff;
}

form.frm-login>.form-group>.btn {
    width: 100%;
    font-size: 16px;
}