/*---------- Стили для всего проекта ----------*/
/*@import url('../fonts/verdana/fonts.css');*/
html,
body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

.no-select {
    -moz-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

body {
    background-color: #ffffff;
    background-position:center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #484747;
    font-family: Ubuntu, 'Segoe UI', Arial, Helvetica, sans-serif;
    font-size: 12pt;
}
img {
    height: 100%;
    width: auto;
    max-width: 100%;
}

.h100 {
    height: 100%;
}
.lprp-0 {    
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.box1 {
    background-color: #1b1b1b;
    padding: 20px;
    border: 1px solid #fff;
}
h1 {
    color: #343434;
}
a {
    color: #343434;
}
a:hover {
    text-decoration: none;
    color: #B3B3B3;
}
a:visited {
    text-decoration: none;
}
a:active {
    color: #B3B3B3;
    text-decoration: none;
}
ul, li {
    margin: 0;
    padding: 0;
}
li {
    list-style-type: none;
}
.t-color {
    color: #B3B3B3;
}
.t-up {
    text-transform: uppercase;
}
.rel {
    position: relative;
}
.rel-in {
    position: relative;
    display: inline-block;
    text-overflow: ellipsis;
}
.f-left {
    float: left;
}
.f-right {
    float: right;
}
.clear-fix {
    clear: both;
}
.t-center {
    text-align: center;
}
.t-right {
    text-align: right;
}
.vert-mid {
    vertical-align: middle;
}
.ov-h {
    overflow: hidden;
}
.d-n {
    display: none !important;
}
.navbar-nav {
    margin: 0px 0px 0px;
}
.navbar-brand {
    
}
.wrapper {
    margin: 0.5vw 0 10vw;
    padding: 2vw 3vw 2vw 3vw;
}
.wrapper1 {

    padding: 1vw 3vw 1vw 3vw;
    background-color: #eeeeee;
    border-radius: 6px;
}
.popap-box {
    background-color: #A5A5A5;
    opacity: 0.3;
    border: 1px solid #65615b;
    padding: 0 20px 20px;
}
.popap-box h2 {
    color: #B3B3B3;
}
.profile-btn {
    margin-right: 15px;
}
.user-menu h1, h2 {
    text-transform: uppercase;
}
.t1 {
    font-size: 25px;
    color: #2c3e50;
    margin-bottom: 10px;
}
.fw-b {
    font-weight: bold;
}
.h-auto {
    height: auto !important;
}
.w-auto {
    width: auto !important;
}
.h-100 {
    height: 100% !important;
}
.w-100 {
    width: 100%;
}
.br-8 {
    border-radius: 8px;
}
.m-0 {
    margin: 0;
}
.m-5 {
    margin: 5px;
}
.m-10 {
    margin: 10px;
}
.m-3vh {
    margin: 3vh;
}
.mt-5 {
    margin-top: 5px;
}
.mt-10 {
    margin-top: 10px;
}
.mt-15 {
    margin-top: 15px;
}
.mt-20 {
    margin-top: 20px;
}
.mt-30 {
    margin-top: 30px;
}
.mt-40 {
    margin-top: 40px;
}
.mt-50 {
    margin-top: 50px;
}
.mt-60 {
    margin-top: 60px;
}
.mb-5 {
    margin-bottom: 5px;
}
.mb-10 {
    margin-bottom: 10px;
}
.ml-5 {
    margin-left: 5px;
}
.ml-10 {
    margin-left: 10px;
}
.mr-5 {
    margin-right: 5px;
}
.mr-10 {
    margin-right: 10px;
}
.p-5 {
    padding: 5px;
}
.p-10 {
    padding: 10px;
}
.pt-60 {
    padding-top: 60px;
}
.pt-200 {
    padding-top: 15vh;
}
.pb-200 {
    padding-bottom: 15vh;
}
.p-mid {
    padding: 24vh 0;
}
.pl-10 {
    padding-left: 10px;
}
.pr-10 {
    padding-right: 10px;
}
.w-25 {
    width: 25%;
}
.w-30 {
    width: 30%;
}
.w-35 {
    width: 35%;
}
.w-40 {
    width: 40%;
}
.w-60 {
    width: 60%;
}
.w-90 {
    width: 90%;
}
.zag1 {
    color: #2c3e50;
    font-size: 5vw;
}
.b-l {
    margin: 15px 0 0 15px;
}
.b-r {
    margin: 15px 15px 0 0;
}
.tehno3 {
    height: 5vw;
}
.tehno4 {
    height: 0.5vw;
}
.tehno5 {
    height: 62px;
}
.tehno-10 {
    height: 10px;
}
.tehno-20 {
    height: 20px;
}
.tehno-30 {
    height: 30px;
}
.tehno-40 {
    height: 40px;
}
.tehno-50 {
    height: 50px;
}
.tehno-70 {
    height: 70px;
}
.tehno-80 {
    height: 80px;
}
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-btn:last-child > .dropdown-toggle, .input-group-btn:first-child > .btn:not(:first-child), .input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
    border-radius: 4px;
}
/*---------- FLEX BOX ----------*/
.fl {
    display: flex !important;
}
.fl-in {
    display: inline-flex;
}
.jc-sa {
    justify-content: space-around;
}
.jc-sb {
    justify-content: space-between;
}
.jc-se {
    justify-content: space-evenly;
}
.jc-c {
    justify-content: center;
}
.ai-s {
    align-items: stretch;
}
.ai-c {
    align-items: center;
}
.ai-fs {
    align-items: flex-start;
}
.ai-fe {
    align-items: flex-end;
}
.ac-c {
    align-content: center;
}
.fd-c {
    flex-direction: column;
}
.fw-w {
    flex-wrap: wrap;
}
.fg-0 {
    flex-grow: 0 !important;
}
.fg-05 {
    flex-grow: 0.5 !important;
}
.fg-08 {
    flex-grow: 0.8 !important;
}
.fg-087 {
    flex-grow: 0.87 !important;
}
.fg-1 {
    flex-grow: 1 !important;
}
.fg-2 {
    flex-grow: 2 !important;
}
/*---------- MY BOOTSTRAP STYLES ----------*/
/*---------- BUTTONS ----------*/
.btn {
    border: none;
    height: 7vh;
    min-height: 40px;
    padding: 0.2vh 0.4vw;
}
.btn-primary {
    background-color: #6ac0f3;
    border-color: #6ac0f3;
}
.btn-secondary {
    background-color: #6b7a85;
    border-color: #6b7a85;
}
.btn-success {
    background-color: #6ac0f3;
    border-color: #6ac0f3;
}
.btn-info {
    background-color: #ac6bec;
    border-color: #ac6bec;
}
.btn-warning {
    background-color: #f29824;
    border-color: #f29824;
}
.btn-danger {
    background-color: #c7c7c7;
    border-color: #c7c7c7;
}
.btn-delete {
    background-color: #fa424a;
    border-color: #fa424a;
}
.btn-primary:active, .btn-primary:hover {
    background-color: #16b4fc!important;
    border-color: #16b4fc!important;
}
.btn-secondary:active, .btn-secondary:hover {
    background-color: #7a8994!important;
    border-color: #7a8994!important;
}
.btn-success:active, .btn-success:hover {
    background-color: #6ACEF3!important;
    border-color: #6ACEF3!important;
}
.btn-info:active, .btn-info:hover {
    background-color: #bb86ef!important;
    border-color: #bb86ef!important;
}
.btn-warning:active, .btn-warning:hover {
    background-color: #f4a641!important;
    border-color: #f4a641!important;
}
.btn-danger:active, .btn-danger:hover {
    background-color: #D2D0D0!important;
    border-color: #D2D0D0!important;
}
.btn-delete:active, .btn-delete:hover {
    background-color: #fb6067!important;
    border-color: #fb6067!important;
}


.chat-block{
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 10px 12px 0px 15px;
    cursor: pointer;
}

.chat-block:hover{
    background-color: #f7f7f7;
}

.chat-block-select{
    background-color: #ebebeb;
}

.content-block::-webkit-scrollbar {
    width: 5px;
    background-color: #f6f6f6;
}

.content-block::-webkit-scrollbar-thumb {
    background-color: #ccc;
}

.chat-icon-size{
    position: relative;
    width: 40px;
    height: 40px;
}

.chat-icon{
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-weight: 600;
    font-size: 20px;
}

.chats-time-block{
    width: 46px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: end;
}

.chat-time{
    color: #979797;
    font-size: 13px;
}

.chat-name{
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.chat-org{
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.chat-org-block{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(100% - 60px);
}

.chat-count{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ff5050;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    color: #fff;
    font-size: 11px;
}

.rigth-block{
    border-bottom: 1px solid #c3c3c329;
    justify-content: space-between;
    display: flex;
    flex-grow: 1;
    padding-bottom: 12px;
    margin-left: 10px;  
    width: calc(100% - 50px);
}
/*---------- FORMS ----------*/
.form-control {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
    border: 1px solid #c5d6de;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 40px;
    color: #343434!important;
}
.form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #00a8ff;
}
select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: right 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    padding: .5em;
    padding-right: 1.5em
}
/*---------- PRELOADER ----------*/
.preloader {
    z-index: 10000;
    position: absolute;
    width: 60px;
    height: 60px;
    right: 0;
    top: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.preloader-img {
    width: 80px;
    height: 80px;
}

::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #c1c1c1; 
    border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: #a19f9f;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #838282; 
}