.bg-primary {
    background-color:#000;
}

.bg-custom-primary {
    background-color:#F8F8F8;
}

.bg-custom-second {
    background-color:#FFF;
}

body, html {
    background-color:#F1F1F1;
}

.custom-col{
    border-radius:20px;
    margin-bottom:20px;
    margin-top:20px;
}

.custom-col.chat{
    min-height:500px;
}

.custom-col.clients{
    min-height:50px;
}

.custom-col.rooms{
    min-height:50px;
}

.room{
    margin:3px;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;

  > .col,
  > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
  }
}

.nav-item.hide {
    display:none;
}

#carouselButtons {
    margin-left: 100px;
    position: absolute;
    bottom: 0px;
}

/*Bootstap links */
ul li a, ul li a:visited {
    color: #000 !important;
}

ul li a:hover, ul li a:active {
    color: #1565C0 !important;
}

ul li.active a {
    color: #1565C0 !important;
}

.bottom-border {
    border-bottom:1px solid #E8E8E8;
}

.slick-slide{
    width: 320px;
    max-width: 320px;
}

.channel_li{
    cursor:pointer;
}

.channel_li:hover{
    background:#f1f1f1;
}

.channel-btn {
    color:#000;
}

.channel-btn:hover {
    color:#1565C0;
    cursor:pointer;
}

.channel_newmsg {
    background:#F00;
    color:#FFF;
    font-size:9px;
    font-weight:bold;
    height:14px;
    line-height:14px;
    margin-top:5px;
    text-align:center;
    width:14px;
}

.chatlinecount {
    background:#F00;
    border-radius: 50%;
    color:#FFF;
    display:none;
    font-size:9px;
    font-weight:bold;
    height:14px;
    line-height:14px;
    margin-left:10px;
    margin-top:5px;
    text-align:center;
    width:14px;
}


.ch-active {
    color:#1565C0;
}

.ch-active:hover {
    cursor:default;
}

ul{
    margin:0;
    padding:0;
    list-style-type:none;
    -webkit-backface-visibility: hidden; backface-visibility: hidden;  }
    
.var_nav{
    position:relative;
    background:#ccc;
    width:30px;
    height:30px;
    margin-bottom:5px;}
    
.link_bg{
    width:30px;
    height:30px;
    position:absolute;
    background:#0078E7;
    color:#fff;
    z-index:2;}
    
.link_bg i{
    position:relative;}
    
.link_title{
    position:absolute;
    width:100%;
    z-index:3;
    color:#fff;}
    
.link_title:hover .icon{
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -o-transform:rotate(360deg);
    -ms-transform:rotate(360deg);
    transform:rotate(360deg);}
    
.var_nav:hover .link_bg{
    width:100%;
    background:#0078E7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;}
.var_nav:hover a{
    font-weight:bold;
    -webkit-transition:all .5s ease-in-out;
    -moz-transition:all .5s ease-in-out; 
    -o-transition:all .5s ease-in-out; 
    -ms-transition:all .5s ease-in-out;
     transition:all .5s ease-in-out;  }
.icon{
    position:relative;
    width:70px;
    height:30px;
    text-align:center;
    color:#fff;
    -webkit-transition:all .5s ease-in-out;
    -moz-transition:all .5s ease-in-out; 
    -o-transition:all .5s ease-in-out; 
    -ms-transition:all .5s ease-in-out;   
    float:left;
    transition:all .5s ease-in-out;}
.icon i{top:22px;position:relative;}

    
.ul_jes{
      color:#000;
      margin-bottom:20px;
      overflow:hidden;
    }
    
.ul_jes li{
      line-height:1.5em;
      float:left;
      clear:left;

    }    
    .ul_jes li a{
        color:#0078E7;
        float:left;
        width:100%;
    }  
    
.popup-bck{
    display:none;
    background-color: rgba(102, 102, 102, .5);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 10;
}
.popup-content-box{
    display:none;
    background-color: white;
    position: fixed;
    margin: 0px auto;
    top: 50%;
    left: 50%;
    z-index: 11;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.popup-relations{
    display:none;
    background-color: rgba(102, 102, 102, .5);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 10;
}
.popup-relations-box{
    display:none;
    background-color: white;
    position: fixed;
    margin: 0px auto;
    top: 50%;
    left: 50%;
    z-index: 11;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.my-new-list {
    width:400px;
    overflow-x:scroll;
    display:none;
    background:#FFF;
    box-shadow: 10px 10px 5px #888888;
    clear:both;
}

.my-new-list .emoji-close{
    border-bottom:1px solid #000;
    cursor:pointer;
    display:block;
    text-align:right;
    float:right;
    clear:both;
    width:100%;
    
}

.my-new-list li {
    cursor:pointer;
    float:left;
    padding:3px;}

.chatwindow {
    display:block;
    vertical-align:bottom;
    font-size:13px;
    bottom: 0;
    width:500px;
    max-height:500px;
    overflow-y:scroll;
    height:500px;
    border-top-left-radius:20px;
    border-bottom-left-radius:20px;
    padding:10px;
}

.vertical-menu {
     /* Set a width if you like */ 
}

.vertical-menu a {
    background-color: #eee; /* Grey background color */
    color: black; /* Black text color */
    display: block; /* Make the links appear below each other */
    padding: 12px; /* Add some padding */
    text-decoration: none; /* Remove underline from links */
}

.vertical-menu a:hover {
    background-color: #ccc; /* Dark grey background on mouse-over */
}

.vertical-menu a.active {
    background-color: #4CAF50; /* Add a green color to the "active/current" link */
    color: white;
}

.channels{
    border-top-left-radius:20px;
    border-top-right-radius:20px;
    margin:0;
    padding-left:30px;
}

.users {
    border-top-left-radius:20px;
    border-top-right-radius:20px;
    margin:0;
    padding-left:30px;
}

.close_channel:hover{
    color:red;
}


.modal-startchat{
    color:#000;
}

.modal-startchat:hover{
    color:#1565C0;
}

.lock-options{
    display:none;
}

.video-options{
    display:none;
}

.autoplay {
    position: relative;
}

.cVideoContainer {
    height:240px;
    width:320px;
    position:absolute;
}

#clientsUL li svg {
    margin:4px;
}

.publisher-container {
    background:#fff;
    height:240px;
    width:320px;
}

.publisher-container video {
    /*height:240px;
    width:320px;*/
}

.video-window {
    background-color:#FFF;
    background-color:rgba(0, 0, 0, 0.5);
    color:#FFF;
    padding-left:10px;
    position:absolute;
    top:0;
    width:inherit;
    z-index:999;
}


.publisher-container .video-window i {
    
}

.publisher-container .video-window svg {
    float:right;
    margin:4px;
    
}

.publisher-container .video-window svg:hover  {
    color:yellow;
    cursor:pointer;
}