.logout{
  right: 0;
  position: fixed !important;
  z-index: 3;
  top: 22px;
  color: white;
  display: block;
  margin-right: 45px;
}
.invalid_manager{
  color: red !important;
}
.warning_manager{
  color: orange !important;
}
.invalid_phone_number,.invalid_phone_number a{
  color: red !important;
}
.selected_row {
    background-color: #d9edf7 !important;
}
.searchbox_send_sms{
  width: 30%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.formSearchFilter tr td{
  padding: 0 10px 10px 0;
}
.nonldap{
}
.hideColumn{
  display: none;
}
.tblcheckbox tr td {
  padding-right: 20px;
}
#debug{
  display:none;
}
.tbl_data tr td{
  padding: 8px;
}
.sort_icon{
  width: 20px;
  height: 20px;
}
.tab_active{
  border-bottom: 3px solid #488FCC !important;
}
.button{
  font-family: 'Roboto', sans-serif;
  padding:15px;
  font-size: 15px;
  font-weight:bold;
  /*background:#488FCC;*/
  border-radius:0 !important;
}
.center_div{
  margin-left: auto;
  margin-right: auto;
}
.hidechangepass{
  display: none;
}
.hidechangepass table tr td{
  padding: 2px;
}
.table_view tr td{
  padding-top:5px;
  padding-bottom: 5px;
  font-size: 20px;
  word-wrap: break-word;
  min-width: 160px;
  max-width: 160px;
}
.table_view{
  font-family: 'Roboto', sans-serif;
  width: 100%;
  table-layout: fixed;
}
.table_view table{
  margin-left: 25px;

}
.table_view td:first-child {
  padding-right: 5px;
}
#demo-ribbon {
 width: 100%;
 height: 225px;
 background-color: #488FCC;
 -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
 }

.demo-main {
   margin-top: -220px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
#demo-header{
  background-color:#488FCC;
}

.demo-container {
  max-width: 1800px;
  width: calc(100% - 16px);
  margin: 0 auto;
}
.demo-content {
  border-radius: 2px;
  margin-bottom: 80px;
}
.demo-content1 {
  border-radius: 2px;
}
.login_content{
  width: 100%;
  position:fixed !important;
  height: 100%;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background: #488FCC;
}
body{
  background: #f5f5f5;
}
body h5{
  font-size: 15px !important;
}
/*profile pic*/
.profile_pic{
  width: 330px;
  height: 411px;
  background-position: center center;
  background-size: cover;
}
/*media reponsive*/
@media (max-width:989px) {
  .login-form{
    margin-left:auto;
    margin-right:auto;
  }
}
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2) {
  .login-screen{
    padding:0px;
  }
  .col-md-offset-2{
    margin-left: 0;
  }
  .login-form{
    margin-left:auto;
    margin-right:auto;
  }

}
/*profile picture responsive*/
@media (max-width:415px) {
  .profile_pic{
    width: auto;
    background-size: 100% auto;
    background-repeat: no-repeat;
    height: 411px;
    background-position: center center;
  }
}
/*table view profile  + document*/
@media (max-width:500px) {
  table.table_view, table.table_view tr, table.table_view th, table.table_view td{
    display: block;
  }
  table.tbl_upload, table.tbl_upload tr, table.tbl_upload th, table.tbl_upload td{
    display: block;
  }
  /*tab*/
  .remove_float{
    float: none !important;
  }
}
@media (max-width:989px) {
  .login-form{
    margin-left:auto;
    margin-right:auto;
  }
}
@media (max-width:641px) {
  .demo-main{
    margin-top: -215px;
  }
}
@media (max-width:905px) {
  .col-md-5{
    width: 100% !important;
  }
  .col-md-7{
    width: 100% !important;
  }
}
@media (max-width:840px) {
  body{
    background: green;
  }
  .content2{
    padding-left: 30px;
    padding-right: 30px;
  }
  .content3{
    padding-left: 30px;
    padding-right: 30px;
  }
  /*.demo-main{
    padding-left: 30px;
    padding-right: 30px;
  }*/
  .demo-container{
    padding: 0  !important;
    width: 100%;
    }
  /*floating button back*/
  #back{
    height: 50px !important;
    min-width: 50px !important;
    width: 40px !important;
    margin-right: 0px !important;
    margin-bottom: 100px !important;
  }
  #icon_float_button_back {
    font-size: 26px !important;
    margin-left: 0 !important;
  }
  /*button register*/
  #btn_register{
    height: 50px !important;
    min-width: 50px !important;
    width: 40px !important;
    margin-right: 0px !important;
  }
  #icon_float_register{
    font-size: 26px !important;
    margin-left: 0 !important;
  }
  /*back button go to profile*/
  #btn_profile{
    height: 50px !important;
    min-width: 50px !important;
    width: 40px !important;
    margin-right: 0px !important;
  }
  #icon_profile{
    font-size: 26px !important;
    margin-left: 0 !important;
  }

}
@media (min-width:1366px) {
  .demo-content{
    margin-left: auto !important;
    margin-right: auto !important;
    width: 1041px;
  }
  .demo-content1{
    margin-left: auto !important;
    margin-right: auto !important;
    width: 1041px;
  }
  .mdl-cell--hide-tablet ,.mdl-cell--hide-phone{
    display: none;
  }
}
/*header for simple user view*/
@media (max-width:635px) {
  .ahem{
    font-size:65px !important;
    margin-top:45px
  }
  .ahemtext{
    margin-top:20px;
  }
  .ahemtext span{
    font-size: 12px !important;
  }
  .search_box{
    height: 70px !important;
    margin-top:30px !important;
  }

}
@media (max-width:375px) {
  .ahem{
    font-size:50px !important;
  }
  .ahemtext{
    margin-top:5px !important;
  }
  .ahemtext span{
    font-size: 9px !important;
  }
  .search_box{
    height: 52px !important;
    margin-top:35px !important;
  }

}
@media (max-width:380px) {
  .demo-main {
   padding-left: 0 !important;
   padding-right: 0  !important;
   /*background: red;*/
  }
.demo-container{
  padding: 0  !important;
  width: 100%;
  }
  .demo-layout.is-small-screen .demo-content {
    padding: 0 !important;
  }
  .wrap_table_view{
    padding: 0 !important;
  }
  .view_info{
    padding: 0!important;
  }
}
@media (max-width:355px) {
  .login-icon > img{
    width: 160px;
  }
}
@media (max-width:450px) {
  .temp_password{
    font-size: 40px;
  }
}
/*end media screen*/
/*header*/
.ahem{
  font-size:85px;
  margin-top:45px;
  font-weight:bold;
}
.ahemtext{
  white-space: nowrap;
  margin-top:20px;
}
.ahemtext span{
  font-size: 15px;
}
.search_box{
  font-size:25px;
  font-style:italic;
  color:gray;
  width:60%;
  height:80px;
  float:right;
   margin-top:20px;
}
.employeelist_admin tr th{
  color: white;
  background: #488FCC;

}
/*button go back to profile*/
#btn_profile {
  width:100px;
  height:100px;
  position: fixed !important;
  display: block;
  right: 0;
  bottom: 0;
  margin-right: 10px;
  margin-bottom: 150px;
  z-index: 3;
}
#icon_profile{
  font-size:57px;
   color:white;
   margin-left:-17px;
}
/*back button*/
#back{
  width:100px;
  height:100px;
  position: fixed !important;
  display: block;
  right: 0;
  bottom: 0;
  margin-right: 10px;
  margin-bottom: 150px;
  z-index: 3;
}
#icon_float_button_back{
  font-size:57px;
   color:white;
   margin-left:-17px;
}
/*register button*/
#btn_register{
  width:100px;
  height:100px;
  position: fixed !important;
  display: block;
  right: 0;
  bottom: 0;
  margin-right: 15px;
  margin-bottom: 40px !important;
  z-index: 3;
}
#icon_float_register{
  font-size:57px;
  color:white;
  margin-left:-17px;
}
.menu{
    z-index: 3;
    position: absolute;
    height: auto;
    top: 174px;
}
#dropdown_menu{
  padding: 0;
  width: auto !important;
  overflow: hidden;
  list-style: none;
}
#dropdown_menu li{
  line-height: 19px;
}
#dropdown_menu li a{
  color: black;
  display: block;
  background-color: #f5f5f5;
  text-align: center;
  padding: 10px 30px 10px 30px;
}
#menu_image{
  height: 50px;
  width: 55px;
  padding: 10px;
  cursor: pointer;
}
.collape{
  margin-left: -125px;
  width: 126px;
  height: auto;
}
.btn_bgcolor{
  background: rebeccapurple !important;
}
/*reports*/
.reports td{
  padding: 0 5px 0 5px;
  color: #428bca;
}
.toprint{
  display: none;
}


.tbl_upload tr td{
  padding: 5px 0 5px 0;
}
.tbl_group tr td,.tbl_group tr th{
  padding: 10px;
  text-align: left;
  vertical-align: top;

}
.table-responsive{
  overflow-x: auto !important;
}
/*.row{
  margin: 0 !important;
}*/
/*modify border reponsive table*/
.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td{
   border:none !important;
 }
 .mdl-layout__drawer-button{
   color: white !important;
 }
 .mdl-layout__drawer-button .material-icons {
   color: #fff;
 }
 .mdl-data-table td,.mdl-data-table th{
    height: 20px !important;
 }
