.state{
    font-weight: bold;
}
.arr{
    text-align: center;
    /*display: none;*/
}
.inner-id{
    text-align: center;
    padding: 2em;
    color: green;
    font-weight: bold;
    font-size: 2em;
}
.back-param{
    text-align: left;   
}
.addr-table{
    border-bottom: 1px solid #777;
    border-top: 1px solid #777;
}
.hidden{
    display: none;
}
.shown{
    display: block;
}
#reply-button{
    width: 20%;
    margin: 0 40% 2em 40%;        
}
.mail-body{
    width:100%; 
    height:300px;
}
.gray{
    background-color: #efefef;
    padding: 7px 0;
}
.add-to-dialog-wrap{
    display:none;
}
.cc-subj{
    font-weight: bold; 
}
.mail-row{
    border-bottom: 1px #999 solid;
    padding: 7px;
}
.mess-text{
    background-color: #cecece;
    padding: 7px;
    display:none;
    
}
.green{
    color:green;
}
.red{
    color:red;
}
.flex-container {
  display: flex;
  padding: 37px;
}
#dataTables-example_filter{
    display:none;
}
#dataTables-example_info{
    display:none;
}
#dataTables-example_previous{
    display:none;
}
#dataTables-example_paginate{
    display:none;
}
#dataTables-example_length{
    display:none;
}
.get-button{
    width:17%;
    text-align: center;
    border: solid 1px #ebebeb;
    cursor: pointer;
}
.get-button.active{
    background-color: #ebebeb;
    cursor: inherit;
}
.input-copy-wrap{
    padding:21px 7px;
}
.add-cc-wrap{
    border-bottom: #ddd 1px solid;
    border-top: #ddd 1px solid;
    padding-bottom: 7px;
    margin:14px 0;
}
.email-copy{
    width: 100%;
    height:28px;
    margin: 37px 0;
    border:blue 1px solid;
}
.copy-button{
    margin-right: 7px;
    cursor: pointer;
}
.copy-block{
    padding:3px 0;
}
.check_period{
    width: 70%;
}
/*.glyphicon.list-close{
    display: block;
}
.glyphicon.list-open{
    display: none;
}*/
.delete-truck-dialog{
    display: none;
}
.js-save-truck{
    display: none;
}
.truck-form{
    display: none;   
    padding:21px;
}
.truck-late{
    color:red;
}
.on-load{
    color:green; 
    font-weight:bold;
}
.left-col-button{
    color:#fff;
    background-color: darkorange;
    border-radius: 3px;
    text-align: center;
    width:70%;
    margin:21px 15%;
    padding:7px;
    cursor:pointer;    
}
.left-col-button:hover{
    color:#cecece;
}
.message-window{
    width: 100%;
    height:377px;
    overflow-y: scroll; 
}
.onemessage{
    margin: 21px 14px;
}
.message-date{
    padding:7px 0 0 7px;
    font-size:12px;
    font-weight: bold;
    color:#337acc;
}
.message-author{
    padding:0 7px;
    margin-bottom:7px;
}
.from-message{
    font-size:12px;
    font-weight: bold;
    color:#337acc;
}
.ms-author{
    font-weight: bold;
}

.ms-text{
    font-size:12px;
    padding: 3px;
    color: green;
}

.js-add-new-truck{
    cursor: pointer;
}
.left-button{
    cursor:pointer;
}
.last-message{
    padding:0 15px; 
    font-size:11px; 
    font-weight:bold
}
.js-create-message{
    /*display: none;*/
}
.li-new-message-form{
    padding:3px; 
}
.message-form-block{
    padding: 4px;
    display: none;
}
.from-wrapper{
    text-align: center;
    margin: 7px;
}
.from-message-input{
    width:90%;
    padding-left: 3px;
}
.message-wrapper{
    text-align: center;
    margin: 7px;
}
.message-text-input{
    width:90%;
    padding-left: 3px;
    height: 77px;
    font-size: 11px;    
}
.info-show{
    cursor: pointer;
    color: #999;
}
.info-show:hover{
    color: #cfcfcf;
}
.info-show.red{
    color: red;
}
#logout{
    cursor: pointer;
}
.input-sms-wrap{
    margin : 2em;
}
.input-sms-wrap input{
    width: 300px;
}
#messanger-bar{
    width: 19%;
    margin-top: 3px;
}
.mms-text-wrap {
  width: 100%;
  padding: 0 13px;
  margin-bottom: 21px;
}
#mms-text{
  border: 1px solid #777;
  height: 33px;
  padding: 3px 4px;
  width: 100%;
}
.new-vac-driver-list{
    width      :92%;
    height     : 333px;
    overflow-y : scroll;
    display    : none;
    margin-top : 17px;
}
.driver-row-vac{
    border-bottom : 1px solid #999;
    font-size     : 12px;
    padding       : 3px 0;
    cursor        : pointer;
}
.driver-row-vac:hover{
    background-color : #ebebeb;
    
}
#result-vac-driver{
    color       : green;
    font-weight : bold;
}
.red-name{
    color:red;
}
.smile{
    cursor           : pointer;
    display          : inline-block;
    padding          : 3px;
    background-color : #fff;
}
.smile:hover{
    background-color : #ebebeb;
}
@media(max-width: 767px) {
    #messanger-bar{
        width: 100%;
        margin-top: 3px;
    }
}

.round-letter{
    width            : 33px;
    height           : 33px;
    border-radius    : 50%;
    color            : #fff;
    background-color : green;
    text-align       : center;
    padding          : 4px; 
    font-weight      : bold;
    vertical-align   : middle;
    font-size        : 17px;
    text-transform   : uppercase; 
}
.m-whom{
    width            : 23px;
    height           : 23px;
    font-size        : 17px;
    font-weight      : bold;
    color            : white;
    text-align       : center;
    border-radius    : 50%;
    background-color : green;
    text-align       : center;
}
.user-small{
    width            : 17px;
    height           : 17px;
    font-size        : 12px;
    font-weight      : bold;
    color            : white;
    text-align       : right;
    border-radius    : 50%;
    background-color : green;
    text-align       : center;
    float            : left;
    text-transform   : uppercase;
    margin-top       : 17px; 
}
.driver-row{
    padding          : 7px 0 4px 4px;
    border-bottom    : 1px solid #ebebeb;
    width            : 100%;
    cursor           : pointer;
}
.driver-row:hover{
    background-color: #bcbcbc;
}
.driver-name{
    padding-top : 3px;
    font-size   : 12px;
}
.driver-window{
    background-color : #fff;
    max-height       : 500px;
    overflow-y       : scroll; 
    padding          : 7px; 
}
.mess-search{
    border       : 1px #ebebeb solid;
    height       : 31px;
    padding-left : 4px;
    width        : 320px; 
    margin-top   : 10px;   
}
/*.fa-search{
    cursor       : pointer;
}*/
.main-window{
    background-color : #fff;
    min-height       : 400px;
    max-height       : 700px;
    /*margin-left      : 31%!important;*/
    margin-top       : 47px!important;
    overflow-y       : scroll;  
}
.header-dialogue{
    height: 37px;
    text-align: center;
    border-bottom: 1px solid #ebebeb;
    padding : 49px 0;
}
.dialogue-name{
    font-size : 37px;
    color      : green;
    margin-right: 37px;
}
.dialogue-phone{
        font-size : 19px;
        color      : #777;
}
.row.message-in{
    padding: 21px 0 0 0;
}
.message-in-wrapper{
    background-color : rgba(70,170,70,0.3);
    border-radius    : 5px;
    padding          : 7px 0 7px 9px; 
    margin-left      : -37px;
}
@media(max-width: 991px) {
    .message-in-wrapper{
        margin-left      : 0;
    }
}
.message-out-wrapper{
    background-color : rgba(255,140,0,0.2);
    border-radius    : 5px;
    padding          : 7px 9px 7px 0; 
    margin-left      : -37px;
}
@media(max-width: 991px) {
    .message-in-wrapper{
        margin-left      : 0;
    }
    .message-out-wrapper{
        margin-left      : 0;
    }
}
.date-in{
    margin-bottom: 49px;
    border-bottom: 1px solid #ebebeb;
    padding-bottom : 14px;
    padding-top    : 7px;
}
.date-out{
    padding-bottom : 14px;
    padding-top    : 7px;
    margin-bottom: 49px;
    border-bottom: 1px solid #ebebeb;
}
.date-in-wrapper{
    color          : #777;
    font-weight    : bold;    
}
.date-in-wrapper{
    color          : #777;
    font-weight    : bold; 
    text-align     : left; 
}
.date-out-wrapper{
    color          : #777;
    font-weight    : bold; 
    text-align     : right; 
}
.date-out-status{
    color        : #ff8c00;
    font-weight  : bold; 
    text-align   : right; 
    font-size    : 14px;
    margin-right : 7px;
}
.img-wrapper{
    width       : 57%;
    
}
.row.message-out{
    padding    : 21px 0 0 0;
    text-align : right; 
}
.mmm-logo-wrapper{
    width:35px;
    margin-top:0;
}
@media(max-width: 991px) {
    .mmm-logo-wrapper{
        margin-top:7px;
    }
}

.write-message{
    background-color : #fff;
    min-height       : 100px;
    margin-top       : 37px!important;
    display          : none;
}
.new-textarea{
    width  : 100%;
    border : 1px solid #bcbcbc;
}
.new-text{
    padding : 37px;
}
.send-button{
    vertical-align : middle;
    font-size      : 31px; 
    color          : darkorange;
    cursor         : pointer;
}
.send-wait{
    display     : none;
    color       : green;
    font-weight : bold;
    font-size   : 10px;
}
#dialog-confirm{
    display : none;
}
.js-send-new-message{
    cursor : pointer;
}
.field-wrap{
    padding-top: 7px;
    width      : 100%;
}
.field-message{
    width        : 100%;
    border       : 1px #bcbcbc solid;
    padding-left : 3px;
}
.text-message{
    width        : 100%;
    border       : 1px #bcbcbc solid;
    padding-left : 3px;
}
.error-message{
    color   : red;
    display : none;
}
#simple-send{
    text-decoration : underline;
    cursor          : pointer;
}
.picture-form{
    margin :21px 0;
}
#upload-file{
    border : none;
    color  : #fff;
    
}
.img-container{
    width      : 90%;
    text-align : center;
}
.img-wrap{
    width         : 90%;
    text-align    : center;
    padding       : 7px 0;
    border-bottom : #ebebeb 1px solid;
}
.pic-delete{
    padding     : 21px;
    color       : darkred;
    font-size   : 21px;
    font-weight : bold;
}
.pic-delete i{
    cursor: pointer;
}
.wait-message{
    color       : green;
    font-size   : 12px;
    font-weight : bold;
    display     : none;
}
.padding-row{
    color      : darkorange;
    font-size  : 37px;
    text-align : center;
    cursor     : pointer;
    padding    : 0;
}
.hidden{
    display : none;
}
.see-more, .see-up{
    background-color : #e37223;
    color            : #fff;
    padding          : 7px;
    border-radius    : 3px;
    width            : 10%;
    margin           : 0 45%;
    text-align       : center;
    font-weight      : bold;
    cursor           : pointer; 
    display          : none;
    margin-bottom    : 21px; 
}
.see-more:hover{
    background-color : #fff;
    color            : #e37223;
}
.see-up:hover{
    background-color : #fff;
    color            : #e37223;
}
.not-seen{
    font-weight: bold;
}
.w-shift{
    width            : 47px;
    height           : 20px;
    border-radius    : 7px;
    background-color : #ebebeb;
    cursor           : pointer; 
}
.w-ball{
    width            : 27px;
    height           : 27px;
    border-radius    : 50%;
    background-color : #999;
    position         : absolute;
    margin-left      : -1px;
    margin-top       : -3px; 
    cursor           : pointer;    
}
.started{
    background-color : rgba(0,100,0,0.3);
}
.started .w-ball{
    background-color : #00f000;
    margin-left      : 50%;
}
.mark-unread{
    display         : none;
    text-decoration : underline;
    cursor          : pointer; 
}
.dr-selected{
   background-color : #bebebe;
}
.edit-driver,.remove-driver{
    font-size    : 27px; 
    color        : #ccc; 
    margin-right : 21px;
    cursor       : pointer;
    display      : none; 
}
.edit-driver:hover{
    color        : #ff8c00;
}
.remove-driver:hover{
    color        : #ff8c00;
}

#driver-form{
    display : none;
}
.driver-input-wrap{
    margin : 11px 0;
}
.driver-input{
    width        : 100%;
    border       : solid 1px #bcbcbc;
    height       : 28px;
    padding-left : 3px; 
}
.add-user{
    margin-left : 49px;
    color       : #ff8c00;
    font-size   : 16px; 
}
.add-user:hover{
    color       : #ebebeb;
}
.sys-phone-label{
    font-size   : 12px;
    margin      : 0 14px 0 21px;
    color       : #777;
    font-weight : bold;
}
.sys-phone{
    font-size   : 16px;
    /*margin      : 21px 0;*/
    color       : #ff8c00;
    font-weight : bold;
}
.not-red{
    color : red;
}
.one-message{
    position         : absolute;
    width            : 330px;
    margin-top       : 22px;
    margin-right     : 449px;
    margin-top       : 35px;
    margin-left      : -126px;
    background-color : #ebebeb;
    text-align       : center; 
    padding          : 14px; 
    display          : none;
}
.sender-name{
    text-transform   : uppercase;
    font-weight      : bold;
    font-size        : 21px;
    color            : green;    
}
.sender-date{
    font-size        : 12px; 
}
.message-body{
    padding   : 7px;
    font-size : 18px;
    color     : green;
}
.del-mes{
    position    : absolute;
    margin-left : 300px;
    cursor      : pointer;
}
#dialog-group{
    display:none;
}
.gr-sms{
    background-color : #ff8c00;
    color            : #fff;
    padding          : 4px 13px;
    border-radius    : 3px;
    cursor           : pointer
} 
.gr-sms:hover{
    background-color : #fff ;
    color            : #ff8c00;
}
.edit-list{
    color: #ff8c00;
    text-decoration : underline;
    font-size       : 10px;
    font-weight     : bold;
    cursor          : pointer;
    margin-left     : 21px;
}

.l-number{
    font-size: 12px;
    color:green;
    font-weight: bold;
}
.l-another{
    font-size: 12px;
    color: #007bb6;
    font-weight: bold;
}
.l-location{
    font-size: 12px;
    color: darkgoldenrod;
    font-weight: bold;
}
.l-name{
    font-size: 12px;
    color:#333;
    font-weight: bold; 
}
.list-sel{
    font-size   : 14px;
    color       : #ff8c00;
    font-weight : bold; 
    cursor      : pointer;
}
.list-sel:hover{
    color       : green;
}
.all-buttnon{
    background-color : #ff8c00;
    color            : #fff;
    padding          : 4px 13px;
    border-radius    : 3px;
    cursor           : pointer;
    text-align       : center; 
}
.ss-number{
        font-size: 12px;
        color:#333;
        font-weight: bold; 
}
.ss-name{
        font-size: 12px;
        color: green;
        font-weight: bold; 
}
.list-del{
        font-size   : 14px;
        color       : #ff8c00;
        font-weight : bold; 
        cursor      : pointer;
}
.list-del:hover{
    color       : green;
}
.all-list-row{
    width:100%;
    border-bottom : 1px #ebebeb solid;
}
.original-list{
    width      : 100%; 
    height     : 610px; 
    overflow-y : scroll;
}
.result-list{
    width      : 100%; 
    height     : 610px; 
    overflow-y : scroll;
}
.dr-row{
     border-bottom : 1px #ebebeb solid;
}
.js-result-list{
    margin-top:21px;
    width : 90%;
}
.error-group-message{
    width:90%;
    font-size: 14px;
    font-weight: bold;
}
.error-head{
    margin : 12px 0;
    color  : darkorange;
}
.success-head{
    margin      : 12px 0;
    color       : green;
    font-weight : bold;
}
.upper-user{
    font-size   : 14px;
    font-weight : bold;
    color  : darkorange;
}
.list-count{
    font-size   : 23px;
    font-weight : bold;
    color       : green;
}
.wrong-croup-list{
    color       : darkred;
    font-weight : bold;
    display     : none;
}
.vacances{
    font-size       : 18px;
    font-weight     : bold;
    color           : #777;
    text-decoration : underline;
    cursor          : pointer;
    margin-top      : 21px;
}
.vacances:hover{
    color           : darkcyan;
}
.vacancies-list-wrap{
    width      : 100%;
    max-height : 501px;
    overflow-y : scroll;
}
.vac-row{
    width:95%;
}
.vac-delete{
    cursor : pointer;
}
.driver-search-button{
    cursor: pointer;
}
.driver-search-button:hover{
    color: green;
}
.driver-search-button-vac{
    cursor: pointer;
}
.driver-search-button-vac:hover{
    color: green;
}
#js-dr-count{
    font-weight: bold;
}
.from-phone-wrap {
  position: absolute;
  margin-top: -34px;
  margin-left: 131px;
}
.from-phone-select{
    background-color: #fff;
    border: 1px grey solid;
}
.from-phone-label{
    color       : #000;
    font-weight : bold;
}
.find-wrap{
    margin-left : 21px;
    color       : green;
    cursor      : pointer;
}
.find-wrap:hover{
    color       : darkorange;
}