@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');
@font-face {
   font-family: 'DroidSerifRegular';
   src: url('../fonts/DroidSerifRegular.eot');
   src: url('../fonts/DroidSerifRegular.eot') format('embedded-opentype'),
        url('../fonts/DroidSerifRegular.woff2') format('woff2'),
        url('../fonts/DroidSerifRegular.woff') format('woff'),
        url('../fonts/DroidSerifRegular.ttf') format('truetype'),
        url('../fonts/DroidSerifRegular.svg#DroidSerifRegular') format('svg');
}
@font-face {
   font-family: 'OswaldHeavy';
   src: url('../fonts/OswaldHeavy.eot');
   src: url('../fonts/OswaldHeavy.eot') format('embedded-opentype'),
        url('../fonts/OswaldHeavy.woff2') format('woff2'),
        url('../fonts/OswaldHeavy.woff') format('woff'),
        url('../fonts/OswaldHeavy.ttf') format('truetype'),
        url('../fonts/OswaldHeavy.svg#OswaldHeavy') format('svg');
}
@font-face {
   font-family: 'BryndanWrite';
   src: url('../fonts/BryndanWrite.eot');
   src: url('../fonts/BryndanWrite.eot') format('embedded-opentype'),
        url('../fonts/BryndanWrite.woff2') format('woff2'),
        url('../fonts/BryndanWrite.woff') format('woff'),
        url('../fonts/BryndanWrite.ttf') format('truetype'),
        url('../fonts/BryndanWrite.svg#BryndanWrite') format('svg');
}
@font-face {
   font-family: 'NoricanRegular';
   src: url('../fonts/NoricanRegular.eot');
   src: url('../fonts/NoricanRegular.eot') format('embedded-opentype'),
        url('../fonts/NoricanRegular.woff2') format('woff2'),
        url('../fonts/NoricanRegular.woff') format('woff'),
        url('../fonts/NoricanRegular.ttf') format('truetype'),
        url('../fonts/NoricanRegular.svg#NoricanRegular') format('svg');
}
html, body {
    height: 100%;
	color: #4b4b4b;
    font-family: 'Open Sans', sans-serif;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern";
    -moz-font-feature-settings: "kern";
    -moz-font-feature-settings: "kern=1";
}

::-webkit-scrollbar {
    width: .4em;
	height: 0.4em;
}
 
::-webkit-scrollbar-track {
    
}
 
::-webkit-scrollbar-thumb:vertical {
  background-color: darkgrey;
  outline: 1px solid slategrey;
  max-height:.8em !important;
  -webkit-border-radius: 0px;
  height:5px !important;
}

::-webkit-scrollbar-thumb:horizontal {
  background-color: darkgrey;
  outline: 1px solid slategrey;
  max-height:.8em !important;
  -webkit-border-radius: 0px;
  height:2px !important;
}

.ellipsify{
    position: relative;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	-webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.no-pad{
padding:0px !important;
}
.mar-top-100{
margin-top:100px;
}
.mb10{
margin-bottom: 10px !important;
}
a {
    color: #01a9e5;
}
a:visited,a:focus {
    color: #01a9e5;
}	
a:hover{
opacity:.6;
color: #01a9e5;
}
*{
	outline:none !important;
}
/**header**/
.header{
   position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999;
}	
.navbar-default {
border-radius:0;
 /* background:#67cbef;  */
 background:#265d71; 
color:#fff;
margin:0;
border:none;
}
.navbar-brand {
     padding: 10px 15px;
	margin-left:0;
	float:left;
	height: auto !important;
}	
.navbar-brand>img{
max-height:70px;
}
.navbar-nav>li {
    padding: 20px 15px;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > .active > a{
background: transparent;
box-shadow: none;
color:#fff !important;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
background: transparent !important;
box-shadow: none;
color:#fff !important;
}

@media (max-width: 767px)
{
.navbar-brand {
    padding: 10px;
}
.navbar-default .navbar-toggle{
border-color:transparent;
background-color:transparent !important;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}
.navbar-nav>li {
    padding: 10px 15px;
}
}

@media (min-width: 768px)
{

.navbar-right .dropdown-menu.language{
    right: 25px;
    left: 25px;
	top: 65px;
    min-width:60px;
	}
.navbar-default .navbar-nav>.open>.language{
 opacity:1;
}
.navbar-right .dropdown-menu.language{
 opacity:0;
 -moz-transition:    all 1000ms ease;
    -webkit-transition: all 1000ms ease;
    -o-transition:      all 1000ms ease;
    -ms-transition:     all 1000ms ease;
    transition:         all 1000ms ease;
display:block;
}
}
/**header-end**/

.download-section{
padding:45px 0;
}
.download-section h3{
margin-top:0;
}
.download-section p{
font-size:16px;
}
.download-btns-wrap img{
display:inline-block;
margin-top:15px;
margin-right:35px;
}




/**overview**/
.overview{
 padding:60px 0;
 margin-top:90px; 
}
.overview .banner-img{
width:100%;
}
.overview-content{
padding-top:100px;
}
.overview-content h1{
font-weight:normal;
margin-bottom:30px;
}
.overview-content p{
font-size:17px;
line-height:1.7;
margin-bottom:30px;
}
.overview-content small{
color: #777;
margin-bottom:30px;
display:block;
}
.overview-content h4{
color:#01a9e5 !important;
font-size:15px;
margin-bottom:15px;
}
.overview-content h4 a{
color:#01a9e5 ;
}
.overview-content h4 a:hover{
opacity:.6;
}
.overview-content h4 i{
padding-right:10px;
}
@media (max-width: 767px)
{
.overview{
margin-top:50px;
}
}
/**overview-end**/


/**features**/

@media (max-width: 767px)
{
.no-left-pad{
padding-left:0;
padding-right:0;
margin-bottom:0 !important;
}
.no-right-pad{
padding-right:0;
padding-left:0;
margin-bottom:0 !important;
}
.features-inner{
margin-top:50px;
}
}
@media (min-width: 768px)
{
.no-left-pad{
padding-left:0;
}
.no-right-pad{
padding-right:0;
}
}

.features-inner{
margin-top:90px;
}

.features .feat-calling{
/* background:#c1edfd; */
background:#f7f7f7;
padding:60px 60px 0;
text-align:center;
}
/*.features .row .col-md-6:nth-child(4n-7)>div{
    background:#f7f7f7;
}*/
.features .row .col-md-6:nth-child(4n-7)>div {
    background: #fbf6eb;
}
/*.features .row .col-md-6:nth-child(4n-6)>div{
    background:#f2f9fd;
}*/
.features .row .col-md-6:nth-child(4n-6)>div{
    background:#f3e7ed;
}
/*.features .row .col-md-6:nth-child(4n-5)>div{
    background:#fff8f8;
}*/
.features .row .col-md-6:nth-child(4n-5)>div {
    background: #f2ecff;
}
/*.features .row .col-md-6:nth-child(4n-4)>div{
    background:#fffaf3;
}*/
.features .row .col-md-6:nth-child(4n-4)>div{
    background:#ecf9f8;
}
.features .feat-calling h5{
margin: 0 auto 20px; 
}
.features .feat-calling h2{
margin: 0 auto 30px; 
}
.features .feat-calling p{
line-height: 2;
    margin-bottom: 30px;
}
.features .feat-calling img{
max-height:300px;
}
.features .feat-multimedia{
/* background:#def4fc; */
background:#edf9ff;
padding:60px 60px ;
text-align:center;
}
.features .feat-multimedia h5{
margin: 33px auto 0px; 
}
.features .feat-multimedia h2{
margin: 30px auto 0px; 
}
.features .feat-multimedia p{
line-height: 2;
    margin: 30px  auto 0 ;
}
.features .feat-multimedia img{
max-height:300px;
}
.btn-feature{
color:#01a9e5;
padding:15px 40px;
border: 2px solid #01a9e5;
border-radius:30px;
font-size:18px;
margin: 50px auto;
}
.btn-feature:hover{
background:#01a9e5;
color:#fff;
transition: all 0.5s ease;
}
/**features-end**/


.footer {
    background: #01465f;
    padding: 50px 0 35px;
    display: inline-block;
    width: 100%;
}
.footer h3{
margin:0 auto 20px;
color:#fff;
font-size:18px;
}
.footer li a{
color: #fff;
font-size:14px;
}
.footer li{
margin-bottom:15px;
}
.footer-bottom{
background: #023a4e;
}
.footer-bottom ul{
margin:0 !important;
}
.footer-bottom li{
margin: 0 80px 0 0 !important;
padding: 20px 0;
color:#fff !important;
}
.footer-bottom li a{
color:#fff !important;
}

a{
text-decoration:none !important;
}


/**web.html**/
.row2bg{
/* background:#f0fafc; */
background:rgba(128, 81, 249, 0.07);
padding: 50px 50px !important;
}
.web-wrap{
position:relative;
width:100%;
height:100%;
}
.web-wrap .top-bg{
position:relative;
width:100%;
height:30vh;
/* background:#01a9e5; */
background-color: #8051F9;
}
.web-wrap .bottom-bg{
position:relative;
width:100%;
min-height:70vh;
/* background:#c1edfd; */
background:rgba(222, 221, 222, 0.31);
}
.web-wrap .content-wrap{
position:absolute;
top:12%;
left:18%;
right:18%;
background: #fff;
border-radius:5px;
-webkit-border-radius: 5px; 
  -moz-border-radius: 5px;
      box-shadow: 2px 2px 20px #9a9a9a;
}
.row1pad{
/* padding: 50px 70px 70px; */
/*padding: 50px 0px 70px;*/
padding:0px;
    margin-right: 0px !important;
    margin-left: 0px !important;
}
.qrcode{
min-width:340px;
}
.web-wrap .content-wrap h3{
margin-top: 34px;
    margin-bottom: 15px;
	font-size: 25px;
	font-weight:normal;    color: #8051f9;
}
.web-wrap .content-wrap h5 {
    font-size: 22px;
	    margin-bottom: 10px;
    font-weight: normal;
    line-height: 1.3;
}
.web-wrap .content-wrap p {
color:#777;
margin: 15px auto 0;
font-size: 15px;
}
.web-icon{
width:50px;
height:50px;
font-size:30px;
color:#fff;
/* background: #01a9e5; */background: #8051f9;
border-radius:50%;
text-align:center;
padding-top:9px;
}
.web-wrap .content-wrap .media-body h4{
margin-top:5px;
margin-bottom:0px;
}
.web-wrap .content-wrap .media-body p{
margin-top:0px;
}


/**responsive**/
@media(min-width: 700px) and (max-width:900px){

.web-wrap .bottom-bg {
    min-height: 150vh;
}	
.media{
    margin-bottom: 20px;
}
.mob-mar-top-50{
margin-top:50px;
}
}

@media(max-width: 680px){
.web-wrap .bottom-bg {
    min-height: 110vh;
}
.web-wrap .content-wrap {
    top: 7%;
    left: 10%;
    right: 10%;
}
.row1pad{
    padding: 50px 50px 70px;
}
.mob-mar-top-50{
margin-top:50px;
}
.media{
    margin-bottom: 20px;
}




}

@media(max-width: 540px){

.web-wrap .content-wrap {
    top: 7%;
    left: 5%;
    right: 5%;
}
.row1pad{
    padding: 40px 30px 50px;
}
}

@media(max-width: 440px){
.web-wrap .content-wrap p{
font-size:12px;
}
.web-wrap .content-wrap h5{
font-size:16px;
}
.web-wrap .content-wrap h3{
font-size:25px;
}
}

@media(max-width: 390px){
.web-wrap .content-wrap .media-body p{
font-size:10px;
}
.web-icon {
    width: 35px;
    height: 35px;
    font-size: 25px;
    padding-top: 6px;
}
.web-wrap .content-wrap {
    top: 7%;
    left: 5%;
    right: 5%;
}
.web-wrap .bottom-bg {
    min-height: 110vh;
}
.row1pad{
    padding: 30px 20px 30px;
}
}

/**end-web.html**/


/**chat.html**/
.col-1, .col-2, .col-3, .col-1-shrink , .col-2-shrink{
float: left;
position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
	overflow:hidden;
}
.col-1{
width: 28%;
}
.col-2{
width: 72%;
}

.col-3{
width: 30%;
}

.col-1-shrink{
width: 25%;
}
.col-2-shrink{
width: 45%;
}

.scroll-bottom{
    position: absolute;
    right: 11px;
    bottom: 17px;
    z-index: 200;
    width: 42px;
    height: 42px;
    text-align: center;
    border-radius: 50%;
    background-color: #fff;
    cursor: pointer;
	box-shadow: 0 1px 1px 0 rgba(0,0,0,.06),0 2px 5px 0 rgba(0,0,0,.2);
	transform: scaleX(1) scaleY(1);
opacity:1 !important;
	
}
.scroll-bottom i{
padding-top:10px;
font-size:25px;
}
.chat-wrap{
position: absolute;
    top: 0;
    left: 0;
    width: 100%;
	height:100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.chat-wrap .top-bg::after {
    position: fixed;
    z-index: 1;
    background-color: #c1edfd; /* #01a9e5 */
    width: 100%;
    height: 131px;
    content: '';
    top: 0;
    left: 0;
}
.chat-wrap .top-bg{
width: 100%;
    height: 100%;
    overflow: hidden;
	overflow-y: auto;
	
}
.chat-wrap .content-wrap{
    width: 1118px;
    height: calc(100% - 58px);
    margin: 0 auto;
    top: 19px;
	    z-index: 2;
	min-height: 500px;
	    position: relative;
    overflow: hidden;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-animation: app-enter .3s cubic-bezier(.1,.82,.25,1);
    animation: app-enter .3s cubic-bezier(.1,.82,.25,1);
	box-shadow: 0 1px 1px 0 rgba(0,0,0,.06),0 2px 5px 0 rgba(0,0,0,.2);
}
@media screen and (max-width: 1400px)
{
.chat-wrap .content-wrap {
    width: 100%;
    height: 100%;
    border-radius: 0;
    top: 0;
}
}
@media screen and (min-width: 1401px)
{
.chat-wrap .content-wrap {
    width: 1396px;
    height: calc(100% - 38px);
    margin: 0 auto;
    top: 19px;
    border-radius: 3px;
}
}
@media screen and (max-height: 500px)
{
.chat-wrap .content-wrap{
    min-height: 500px;
}
}/* 
@media screen and (min-width: 1320px)
{
.chat-wrap .content-wrap {
    width: 1276px;
}
} */
 .app-user, .contact-info{
	padding-left:0;
	padding-right:0;
	    height: 100%;
	}
	
 .chat-screen{
	padding-left:0;
	padding-right:0;
	    height: 100%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-transform-origin: left top;
    transform-origin: left top;	
	}
  .show{
    opacity:1;
   }
   .hide{
   opacity:0;
   }
.chat-screen .welcome-scr{
    -webkit-transform-origin: left top;
    transform-origin: left top;
    background-color: #f0fafc;
    height: 100%;		
	text-align:center;
	padding:50px ;
	border-bottom: 6px solid #01a9e5;
	border-left: 1px solid #e0e0e0;	
}	
.chat-screen .welcome-scr img{
margin: 0px auto 30px;
border-radius: 50%;
}
.chat-wrap .content-wrap .app-user .app-user-info{
background:#01a9e5; /* #ecf9fd */
 float:left;
 width:100%;
    padding: 10px 15px 5px;
/*border:1px solid rgba(255, 255, 255,0.75);*/
border-left:0;
border-top:0;
border-bottom:0;
}

.chat-wrap .content-wrap .app-user .app-user-info .profile-img, .chat-wrap .content-wrap .chat-screen .active-chat-info .profile-img{
    cursor: pointer;
	cursor: hand;
	min-height: 37px !important;
    max-height: 37px !important;
    min-width: 37px !important;
    max-width: 37px !important;
    border-radius: 50% !important;
}

.chat-wrap .content-wrap .app-user .app-user-info .options ul{
margin-bottom:0;
}
.chat-wrap .content-wrap .app-user .app-user-info .options li{
    margin-left: 10px;
}


.chat-wrap .content-wrap .chat-screen .active-chat-info{
background: #01a9e5; /* #ecf9fd */
 width:100%;
    height: 58px;
padding: 10px 15px 5px;
/*border:1px solid #ddd;*/
/*border-left:0;
border-top:0;*/
border-left:1px solid rgba(255, 255, 255,0.75);

  -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;

}
.chat-wrap .content-wrap .chat-screen .active-chat-info img{
max-height:37px;
}
.chat-wrap .content-wrap .chat-screen .active-chat-info .active-chat-name{
display:inline-block;
padding: 0px 0px 0px 15px; 
    font-size: 15px;
    font-weight: 600;
	/* max-width:64%; */
color:#ffffff;	
}
.chat-wrap .content-wrap .chat-screen .active-chat-info .active-chat-name-details{
display:block;
font-size: 11px;
color: #ffffff;	
padding-left: 15px;
}

.chat-wrap .content-wrap .chat-screen .active-chat-info .options{
   
}
.chat-wrap .content-wrap .chat-screen .active-chat-info .options ul{
margin-bottom:0;
}
.chat-wrap .content-wrap .chat-screen .active-chat-info .options li{
    margin-left: 10px;
}


.contact-wrap{
height: calc(100% - 58px);
max-height:100%;
background:#fff;
position: relative;
    display: block;
    width: 100%;
    float: left;	
/*border-right: 1px solid #ddd;*/	
}
.contact-block{
background: #f9f9f9;  /* #fbfbfb */
height: calc(100% - 54px);
position: relative;
    display: block;
    width: 100%;
    float: left;
	overflow-y:auto;
}
.app-status {
    background: #ffde6f;
    position: relative;
    display: flex;
    width: 100%;
    float: left;
}
.app-status.active ~ .contact-block{
height: calc(100% - 135px);
}
.app-status .title{
font-size: 16px;
    line-height: 21px;
    color: #37474f;
	width: 100%;
margin-bottom:0;	
	}
.app-status .info{
font-size: 13px;
    line-height: 19px;
    margin-top: 2px;
    color: #37474f;
    opacity: .6;
	width: 100%;
}	
.app-status .media-left {
    padding-right: 15px;
	
}
.app-status .media-body
{
max-width: 75% !important;
}
.app-status .media-body, .app-status .media-left, .app-status .media-right {
       display: inline-block;
    vertical-align: middle;
}
.contact-block-inner{
position: relative;
    display: block;
    width: 100%;
    float: left;
	/* padding-left:15px;  */
}
/* contact Search */

.contact-search{
position: relative;
    display: block;
    width: 100%;
    float: left;
}	
.contact-search .form-group {
    margin-bottom: 0px;
padding:10px 20px;
background: #f1f1f1;  /* #fbfbfb */
    border-bottom: 1px solid #ddd;
}
.inner-addon {
  position: relative;
}

/* style glyph */
.inner-addon .fa {
  position: absolute;
  padding: 10px;
  pointer-events: none;
  color:#ccc;
}

/* align glyph */
.left-addon .fa  { left:  0px;}
.right-addon .fa { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  50px; border:0;}
.right-addon input { padding-right: 30px; }


.contact-block .media{
padding: 10px 0 0;
padding-left: 15px;
margin-top:0;
}
.contact-block .media:hover {
background:#ffffff; /* #ecf9fd */ 
}
.contact-block .media.active {
background:#ffffff; /* #c1edfd */ 
}
.contact-block .media a{
display:block;
opacity:1 !important;
overflow-x: hidden;
text-overflow: ellipsis;
 white-space: nowrap; 
}
.contact-block .media-left{
padding-right: 25px;
}
.contact-block .media-left img{
max-height:50px;
min-height:50px;
max-width:50px;
min-width:50px;
border-radius: 50%;
}
.contact-block .media-body{
border-bottom: 1px solid #eaeaea;
padding-right:20px;
}
.contact-block .media-body h4{
font-size:16px;
max-width: 190px;
color:#2b2b2b;
}
.contact-block .media-body p{
font-size:12px;
color:#888;
margin-bottom:15px;
max-width: 190px;
color:rgba(43, 43, 43, 0.87);
}
.contact-block .media-body .left{
display:inline-block;
float:left;
padding-top:4px;
}
.contact-block .media-body .right{
display:inline-block;
float:right;
padding-top:4px;
}
.contact-block .media-body .last-seen{
display:block;
color:#888;
font-size:12px;
float: right;
}
.chat-details{
display:block;
}
.contact-block .media-body .archived-label{
    border: .5px solid #434343;
    color: #434343;
    border-radius: 5px;
    padding: 2px 5px;
    font-size: 11px;
    margin-left: 3px;
    float: right; 
}
.contact-block .media-body .new-text-count{
width:18px;
height:18px;
text-align:center;
background: #01a9e5;
display:inline-block; /* block */
border-radius:50%;
color:#fff;
font-size:9px;
float:right;
margin-top:2px;
/*padding-top:2px;*/
margin-left:3px;
line-height: 16px !important;
}
.contact-block .media-body .chat-sync-loader{
display:inline-block;
float:right;
z-index: 0;
}
.contact-block .media-body .chat-menu-arrow{
width:0px;
height:0px;
text-align:center;
display:inline-block;
border-radius:50%;
color:#01a9e5;
font-size:20px;
float:right;
overflow: hidden;
}

.contact-block .media-body .chat-menu-arrow {
    width: 0px;
    height: 0px;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
    color: #4e4e4e;
    font-size: 20px;
    float: right;
    overflow: hidden;
}
.contact-block .media:hover .chat-menu-arrow {
    width: 18px;
    height: 18px;
}
.contact-block .media-body .chat-menu-arrow i{
    margin-top: 0;
	margin-left:3px;
    float: right;
    padding-top: 2px;
}
.icon-mute{
float:right;
margin-top:2px;
}
.icon-mute image{
width:18px;
height:18px;
}
.msg-screen-wrap{
/* position: relative;
    display: block;
    width: 100%;
    float: left;
	height: calc(100% - 58px);
 */
 
 -webkit-box-flex: 1;
    -ms-flex: 1 1 0;
    flex: 1 1 0;
    position: relative;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    z-index: 1;
 }
.msg-screen{
position: relative;
    display: block;
    width: 100%;
    float: left;
	min-height: calc(100% - 70px);
	background-color: #c1edfd;
/* background-image: url('../images/chatbg.jpg'); */
background-size:cover;
}
    .chat-empty{
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 12px;
   } 
.chat-bubble-container{
   /*  display: block;
     width: 100%;
    float: left;
    position: absolute;
    bottom: 0;
    left: 0;
	right:0; 
    max-height: calc(100%);
	 overflow-y: auto;
	*/
	padding: 10px 0 ;
   
	-webkit-transition: padding .3s cubic-bezier(.69,0,.79,.14);
  -moz-transition: padding .3s cubic-bezier(.69,0,.79,.14);
  -o-transition: padding .3s cubic-bezier(.69,0,.79,.14);
  transition: padding .3s cubic-bezier(.69,0,.79,.14);
  
   -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
.chat-bubble-container.msg-selectable{
    padding-left: 40px;
	-webkit-transition: padding-left .5s ease-in-out;
  -moz-transition: padding-left .5s ease-in-out;
  -o-transition: padding-left .5s ease-in-out;
  transition: padding-left .5s ease-in-out;
	}
.msg-screen .msg-wrap{
padding-left: 9%;
    padding-right: 9%;
    position: relative;
	display:block;
	width:100%;
	float: left;
}
.selected .msg-select {
    background-color: rgba(1, 169, 229, 0.09);
    background-blend-mode: multiply;
}
.msg-select:hover, .selected .msg-select:hover {
    background-color: rgba(1, 169, 229, 0.09);
    background-blend-mode: multiply;
}
.msg-select {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-top: 1px;
    padding-bottom: 1px;
    z-index: 100;
    cursor: pointer;
}
.msg-select-active{
display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.checkbox-selected{
 background-color: rgba(1, 169, 229, 0.09);
    background-blend-mode: multiply;
}
.msg-select md-checkbox{
    margin-bottom:0px !important;
	margin-left: 26px !important;
}
md-checkbox.md-default-theme.md-checked .md-icon, md-checkbox.md-checked .md-icon {
    background-color: rgb(1, 169, 229);
}
md-checkbox.md-default-theme.md-checked .md-ink-ripple, md-checkbox.md-checked .md-ink-ripple {
    color: rgb(1, 169, 229);
}
.checkbox-container {
    display: inline-block;
    position: relative;
    width: 18px;
    height: 18px;
    cursor: pointer;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    vertical-align: middle;
}

.msg-screen .receiver, .msg-screen .sender{
    display: block;
    width: 100%;
    float: left;
}
.msg-screen .receiver{
	    /* margin-top: 10px; */
		/* margin-bottom: 5px; */
		margin-top: 5px;
}
.msg-screen .sender{
	    margin-top: 5px;
}
.msg-screen .receiver .msg-txt{
background:#fff;
color:#767676;
border-radius:5px;
padding: 6px 7px 8px 9px;
z-index:inherit;
position: relative;
margin:0;
max-width: 65%;
text-align:left;
word-wrap: break-word;
}

.msg-option-wrap {
    right: 5px;
    top: 5px;
}
.msg-option-wrap {
    height: 23px;
    width: 48px;
}
.msg-option-wrap {
    position: absolute;
    overflow: hidden;
    z-index: 10;
}

.arrow-left {
      width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #fff;
	 position: absolute;
    left: -10px;
    top: 0px;
    border-radius: 5px;
	z-index:30;
	
}

.msg-screen .sender .msg-txt{
background:#01a9e5;
color:#fff;
border-radius:5px;
padding:6px 7px 8px 9px;
position: relative;
z-index:inherit; /* z-index:40; */
margin:0;
max-width: 65%;
text-align:left;
word-wrap: break-word;
}

.arrow-right {
     width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;  
  border-top: 10px solid #01a9e5;
	 position: absolute;
    right: -10px;
    top: 0px;
    border-radius: 5px;
	z-index:30;
}
.msg-screen .sender .msg-txt::after, .msg-screen .receiver .msg-txt::after {
    content: " \00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0";
    display: inline;
}
.msg-username{
    display: block;
    font-size: 13px;
	}
.msg-screen .sender .msg-time-wrap{
color:#fff;
}

.msg-time-wrap{
position: absolute;
    bottom: 2px;
    right: 5px;
    font-size: 11px;
    color: rgba(0,0,0,.45);
    line-height: 15px;
    height: 15px;
	z-index: 999;
}
.msg-time {
    vertical-align: top;
    margin-top: 1px;
    display: inline-block;
}
.unread-msg{
    display: block;
    width: 100%;
    float: left;
    margin:10px auto;
	text-align:center;
    padding:10px 0px;
	background:rgba(255,255,255,0.5);
	}
.msg-date{
    display: block;
    width: 100%;
    float: left;
    margin:10px auto;
	text-align:center;
}
.msg-date p:after{
content:"" !important;
}
.msg-date.on-scroll p:after{
content:"" !important;
}
.msg-date.on-scroll p{
    background: #ecf9fd;
    /* position: absolute; */
    position: relative;
    margin-left: -40px;
	z-index:999;
	    -webkit-box-shadow: 0 3px 12px rgba(0,0,0,.175);
    box-shadow: 0 3px 12px rgba(0,0,0,.175);
	}
.msg-date p{
background:#fff !important;
color:#767676 !important;
border-radius:5px !important;
padding: 6px 7px 8px 9px !important;
display:inline-block !important;
margin:0 !important;
}
.unread-msg p{
background:#fff;
color:#767676;
border-radius:25px;
padding: 6px 25px 8px;
display:inline-block;
margin:0;
}
.unread-msg-container{
    margin-right: -13.5%;
    margin-left: -13%;
}
.col-2-shrink .unread-msg-container {
    margin-right: -15%;
    margin-left: -14.5%;
}
.msg-input{
/* position: relative;
    display: block; 
    width: 100%;
    float: left;
background: #ecf9fd;
padding: 18px 15px;	 */
    background: #f9f9f9; /* #ecf9fd */
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 100%;
    box-sizing: border-box;
    padding: 11px 15px;
    z-index: 1;
}
.msg-input ul{
margin-left: 0px !important; 
}
.msg-input ul, .msg-input ul .form-group{
margin-bottom:0;
display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
position:relative;
}
.msg-input ul .form-group .form-control {
border:0;
}
.msg-input ul .msg-box{
width:100%;
}
.msg-input ul .msg-box {
    border-radius: 5px;
    background-clip: padding-box;
    width: inherit;
    background-color: #fff;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    border-color: #fff;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    padding-right: 16px;
    -webkit-transition: height .18s ease-in-out;
    transition: height .18s ease-in-out;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    line-height: 20px;
    font-size: 15px;
    min-height: 20px;
    border: none;
    padding: 10px 12px;
     width: 100%; 
    outline: none;
}
.msg-input ul .msg-box .input{
word-wrap: break-word;
    white-space: pre-wrap;
    padding: 0 2px 0 0;
    min-height: 20px;
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: rgba(255,255,255,0);
    border-left: .1px solid transparent;
    position: relative;
    z-index: 1;
	    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    line-height: 20px;
    font-size: 15px;
    border: none;
    width: 100%;
    outline: none;
}
.input-placeholder {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: absolute;
    /* top: 6px !important; */
    top: 0;
    margin-left: 2px;
    left: 0;
    color: #999;
    pointer-events: none;
    -webkit-transition: opacity .08s linear;
    transition: opacity .08s linear;
    font-size: 15px;
    line-height: 20px;
    z-index: 0;
}
.msg-input ul .btn-emoji {
-webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;	
margin: 0 20px 8px 10px;
}
.msg-input ul .btn-send-msg {
-webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;	
margin: 0 10px 8px 10px;
}
.msg-send-btn{
    margin-left: 10px;
    max-height: 27px;
	}
.msg-input ul .btn-mic-wrap{
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    transition: width .18s ease-in-out
   }
   .msg-input ul .btn-mic-wrap-inner{
    display:flex;
	width: 45px;
    transition: width .18s ease-in-out
   }
.msg-input ul .btn-mic-wrap-inner.active{
	width: 200px;
}   
.msg-input ul .btn-mic-wrap-inner .btn-mic{
   margin: 0 10px 8px 20px;
   display: flex;
   opacity:1;
   transition: all .18s ease-in-out
	}		
.msg-input ul .btn-mic-wrap-inner.active  .btn-mic{
   margin: 0 10px 8px 20px;
   display: none;
   opacity:0;
   transition: all .18s ease-in-out
	}		
	/* .audio-controls{	
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
     width:0px;
	  -webkit-transition: width 1s ease-in-out;
    transition: width 1s ease-in-out;
	  -webkit-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
	opacity:0;
	justify-content: space-around;
	}	 */
	.msg-input ul .btn-mic-wrap .audio-controls{
     
    display: none;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    width: 0px;
	overflow:hidden;
	}
	.msg-input ul .btn-mic-wrap-inner.active .audio-controls{
     display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    width: 200px
	}
	.audio-cancel{
	float:left;
	max-height: 40px;
	}
	.audio-send{
	float:left;
	max-height: 40px;
	}
	.audio-time{
	float:left;
	align-items:center;
	}
.starred{
   max-height: 14px;
    margin-right: 4px;
    opacity: 0.5;
	}
.reply-msg-box{
	
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;       
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 8px 6px 8px 3px;
	max-height: 40px;
  text-align: left;
  font-size: 12.6px;
    overflow: hidden;
    word-break: break-word;
    line-height: 20px;
	max-width: 65% !important;
	
  }
  .reply-msg-wrap{
    padding: 0px 5px;
	border-left:5px solid #01a9e5;
	border-radius:5px;
	background:#fbfbfb;
	max-width: 88% !important;	
   }
   
   .reply-box-positioning-container {
    position: absolute;
    top: 0;
    width: 100%;
	display:none;
    }
.reply-box-positioning-container.active{
display:block;
}
.reply-box-overlay-container {
    position: absolute;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
}
.reply-box {
    margin: 0;
    padding-top: 5px;
    width: 100%;
    float: none;
    box-shadow: none;
    background-color: #ecf9fd;
     transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
	 -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
	}
.reply-box-positioning-container.active .reply-box{   	
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);	
	}
.reply-box .reply-msg {
    background-color: transparent;
    margin-left: 63px;
    margin-bottom: 0;
    height: 67px;
	position: relative;
    min-width: 156px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: 7.5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.reply-box .reply-msg-status {
    min-height: 67px;
	max-height:67px;
    width: 100%;
    background-color: rgba(0,0,0,.05);
    border-radius: 5px;
}

.reply-msg-status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 50px;
    max-height: 90px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.reply-cancel-btn{
   height: 67px;
    width: 60px;
    min-width: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
	}
.reply-cancel-btn img{
max-width:25px;
min-width:25px;
max-height:25px;
min-height:25px;
opacity:0.6;
}
.reply-msg-color-bar {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    min-width: 4px;
    width: 4px;
    margin-right: 3px;
}
.reply-box .reply-msg-info {
    max-width: 65%;
    margin-top: 3px;
    margin-bottom: 3px;
}

.reply-msg-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 8px 6px 8px 3px;
}
.sender .reply-msg-author {
	color: #bfeeff !important;
}
.reply-msg-info .reply-msg-author {
	font-size: 16px;
    padding: 0!important;
    line-height: 18px;
    height: 20px;
    margin-top: 0;
	margin-bottom: 0;
    border: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	 display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.reply-msg-text {
    font-size: 12.6px;
	line-height: 19px;
    overflow: hidden;
    word-break: break-word;
	white-space: nowrap;
	max-height: 40px;
	 /* -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; */
    text-align: left;
}
.message-text, .media-caption {
    position: relative;
}
.reply-txt{
white-space: normal;
}
.message-text::after {
    content: " \00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0";
    display: inline;
}

.msg-txt .reply-msg {
    background-color: transparent;
    margin-left: 0px;
    margin-bottom: 0;
    height: 75px;
	position: relative;
    min-width: 156px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: 7.5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin-bottom: 3px;
}
.msg-txt .reply-msg-status {
    min-height: 67px;
	max-height:67px;
    width: 100%;
    background-color: #28728d;
    border-radius: 5px;
}

.msg-txt .reply-msg-status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 50px;
    max-height: 90px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.msg-txt .reply-msg-color-bar {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    min-width: 4px;
    width: 4px;
    margin-right: 3px;
}
.msg-txt .reply-msg-info {
    max-width: 80%;
    margin-top: 3px;
    margin-bottom: 3px;
}

.msg-txt .reply-msg-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 8px 6px 8px 3px;
}
.msg-txt .reply-msg-info .reply-msg-author {
	
	font-size: 16px;
    padding: 0!important;
    line-height: 18px;
    height: 20px;
    margin-top: 0;
	margin-bottom: 0;
    border: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	 display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.msg-txt .reply-msg-text {
    font-size: 12.6px;
	line-height: 19px;
    overflow: hidden;
    word-break: break-word;
	white-space: nowrap;
	max-height: 40px;
	 /* -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; */
    text-align: left;
}

.chat-footer {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    z-index: 1;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    position: relative;
    padding: 0;
    background-color: rgba(255,255,255,.6);
    box-sizing: border-box;
    min-height: 62px;
}
.hieght-filler,.hieght-filler2,.hieght-filler-emoji {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    height: 0px;
}
.hieght-filler.active{
height: 72px;
transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
}	
.hieght-filler2.active{
height: 144px;
transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
}	   
   
   .msg-screen {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 100;
    box-sizing: border-box;
    /*border-left: 1px solid rgba(0,0,0,.03);*/
    border-left: 1px solid rgb(222, 222, 222);
    -webkit-transition: background .3s ease-out .1s;
    transition: background .3s ease-out .1s;
    background-color: #f1f1f1 ;  /* transparent */
    width: 100%;
    height: 100%;
    position: absolute;
   /*-webkit-transform: translateZ(0);
    transform: translateZ(0);*/
	/* 
    position: relative;
    display: block;
    width: 100%;
    float: left;
    min-height: calc(100% - 70px) !important; */
	}
	
/* .reply-msg-wrap {
    position: relative;
    min-width: 156px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: 7.5px;
    background-color: rgba(0,0,0,.05);
    margin-bottom: 3px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	background-color: transparent;
    margin-left: 63px;
    margin-bottom: 0;
    height: 67px;
}	
.reply-msg-wrap .reply-msg-detail {
    min-height: 67px;
    width: 100%;
    background-color: rgba(0,0,0,.05);
    border-radius: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 50px;
    max-height: 90px;
    text-overflow: ellipsis;
    overflow: hidden;
}
 */
/* .msg-frwd{
position: relative;
    display: block;
    width: 100%;
    float: left;
background: #ecf9fd;
padding: 22px 15px;	
}
.msg-frwd .option-wrap1, .msg-frwd .option-wrap2{ 
    display: inline-flex;
}
.msg-frwd .option-wrap1 ul, .msg-frwd .option-wrap2 ul{ 	
margin-bottom:0;
}
.msg-frwd .option-wrap1 ul li img, .msg-frwd .option-wrap2 ul li img {
    padding-top: 5px;
} */

.more-controls {
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-right: 16px;
    padding-left: 15px;
    z-index: 1000;
    background: #ecf9fd;
    transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);	
}
.more-controls.active{
	-webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
	}
.multi-count {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 14.5px;
}
.more-controls .btn-icon:not(:last-of-type) {
    margin-right: 10px;
}
.more-controls .btn-clickable {
    opacity: 1;
}
.more-controls .btn-icon {
    padding: 8px;
    opacity: .5;
    -webkit-transition: opacity .12s ease-in-out;
    transition: opacity .12s ease-in-out;
	cursor:pointer;
	cursor:hand;
}
.more-controls .btn-icon img{
min-width: 24px;
max-width: 24px;
min-height: 24px;
max-height: 24px;
}
md-backdrop.md-menu-backdrop, .md-scroll-mask {
    z-index: -1 !important;
}


.chat-info-box{
display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-contents: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 70px;
    padding: 16px;
    box-sizing: border-box;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


.sidenav-profile, .sidenav-newchat, .sidenav-newgroup {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #f4f4f4; /* #ecf9fd */
    overflow-x: hidden;
    transition: 0.5s;
	overflow:hidden;
	transition-timing-function: cubic-bezier(.02,.09,0,1);
	-webkit-transition: all .5s; /* Safari */
    transition: all .5s;
	
	 -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            transform: translateX(-100%);
}
#sidenav-starredmessage.nav-active,#sidenav-archivedchat.nav-active,#sidenav-profile.nav-active, #sidenav-newchat.nav-active,#sidenav-newprivatechat.nav-active, #sidenav-newgroup.nav-active , #sidenav-newgroup-addcontacts.nav-active {
-webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
}	
.sidenav-profile .profile-nav, .sidenav-newchat .newchat-nav, .sidenav-newgroup .newgroup-nav{
background:#009dd6; /* #c1edfd */
padding: 60px 30px 10px;
color:#ffffff;
}
.sidenav-profile .profile-nav h5, .sidenav-newchat .newchat-nav h5, .sidenav-newgroup .newgroup-nav h5 {
font-size:20px;
}
.sidenav-profile .profile-nav h5 i, .sidenav-newchat .newchat-nav h5 i, .sidenav-newgroup .newgroup-nav h5 i{
margin-right:30px;
}
.sidenav-profile .profile-detail, .sidenav-newgroup .newgroup-detail{
padding: 25px 0px 0px;
min-height: calc(100% - 112px);
    max-height: calc(100% - 112px);
overflow-y:auto;
}
.sidenav-newchat .newchat-detail .contact-block {
   
   height: calc(100% - 54px);
    position: relative;
    display: block;
    width: 100%;
    float: left;
    overflow-y: auto;
	
/*    position: relative;
    display: block;
    width: 100%;
    float: left;
    padding-left: 15px;
	max-height: 100%;
	overflow-y:auto; */
	/* background: #fff; */
}
.sidenav-newchat .newchat-detail .contact-block-inner{
    position: relative;
    display: block;
    width: 100%;
    float: left;
    /* padding-left: 15px; */
}
.sidenav-newchat .newchat-detail {
   height: calc(100% - 111.25px);
    max-height: calc(100% - 111.25px);
    /* background: #fff; */
    position: relative;
    display: block;
    width: 100%;
    float: left;
}
.sidenav-profile .profile-detail img, .sidenav-newgroup .newgroup-detail img{
min-width:200px;
max-width:200px;
min-height:200px;
max-height:200px;
margin-bottom:35px;
}
.sidenav-profile .profile-detail .user-name-wrap, .sidenav-profile .profile-detail .user-status-wrap{
background:#fff;
padding:15px 30px 10px;
}
.sidenav-profile .profile-detail .user-name-wrap h5, .sidenav-profile .profile-detail .user-status-wrap h5{
margin-top:0;
margin-bottom:25px;
color:#7c8b92;
}
.sidenav-profile .profile-detail .user-name-wrap .user-name, .sidenav-profile .profile-detail .user-status-wrap .user-status{
border-bottom:0px;
padding-bottom:5px;
color: #4b4b4b;
margin:5px auto;
font-weight:600;
}
.sidenav-profile .profile-detail  p{
padding:0px 15px;
color:#999;
margin:10px auto 30px;
}
 .sidenav-newgroup .newgroup-detail {
 padding:0px;
 }
 .sidenav-newgroup .newgroup-detail .group-icon, .group-subj{
margin:30px auto 0px 30px; 
position:relative;
 }
 .sidenav-newgroup .newgroup-detail .group-icon{
    margin-left: 0;
 }
 .input-spacer {
    position: relative;
    height: 24px;
}
.group-subj #grpsubj, .transparent-input{
background-color: transparent;
    background-image: none;
    border-bottom: 1px solid #ccc !important;
    border: 0;
    padding-left: 0;
	padding-right: 0;
    box-shadow: none !important;
}
/**contact-info**/

.sidenav-contact-info, .sidenav-group-info {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #f4f4f4; /* #ecf9fd */
	border-left: 1px solid #fff;
    overflow-x: hidden;
    transition: 0.5s;
	overflow:hidden;
	transition-timing-function: cubic-bezier(.02,.09,0,1);
	-webkit-transition: all .5s; /* Safari */
    transition: all .5s;
	
	 -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
}
.sidenav-contact-info.active, .sidenav-group-info.active{
	 -webkit-transform: translateX(0%);
            -moz-transform: translateX(0%);
            -ms-transform: translateX(0%);
            -o-transform: translateX(0%);
            transform: translateX(0%);
}
.sidenav-contact-info .contact-info-nav{
    color:#fff;
	background: #009dd6;  /* #c1edfd */
    padding: 8px 30px 8px;
}
.sidenav-contact-info .contact-info-detail{
padding: 0px;
    min-height: calc(100% - 58px);
    max-height: calc(100% - 58px);
    overflow-y: auto;
}
.sidenav-contact-info .contact-info-nav h5{
font-size:20px;
}
.sidenav-contact-info .contact-info-nav h5 i{
margin-right:20px;
}
.sidenav-contact-info .contact-info-detail img {
    min-width: 200px;
    max-width: 200px;
    min-height: 200px;
    max-height: 200px;
    margin-bottom: 25px;
}
.contact-avatar-wrap{
background:#ffffff;
padding:30px 30px 20px;
margin-bottom:10px;
box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.contact-avatar-wrap .contact-name{
font-size: 18px;
margin-bottom:0;
}
.contact-avatar-wrap .contact-last-seen{
font-size: 14px;
opacity:0.7;
margin-bottom:0;
}
.sidenav-contact-info .contact-info-detail .media-wrap{
    background: #fff;
    padding: 20px 30px 5px;
	margin-bottom:10px;
	box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.contact-info-detail .media-wrap h5, .contact-info-detail .contact-status-wrap h5, .contact-info-detail .contact-phone-wrap h5{
    margin-top: 0;
    margin-bottom: 20px;
    color: #01a9e5;
	font-size:15px;
}
.contact-info-detail .media-wrap h5 i{
font-size: 20px;
    margin-top: -3px;
	}
.contact-info-detail .media-wrap .no-media{
    border-bottom: 0px;
	padding-bottom: 15px;
    padding-top: 5px;
    color: #4b4b4b;
    margin: 5px auto;
}
.chat-mute-wrap{
    background:#ffffff;
    position: relative;
    font-size: 14px;
    font-weight: 300;
    text-align: left;
    padding: 20px 30px;
	margin-bottom:10px;
	box-shadow: 0 2px 3px rgba(0,0,0,.1);
}	
.chat-mute-wrap h5{
    display: inline-block;
	margin:0;
}
.chat-mute-wrap md-checkbox{
    margin:0;
	float:right;
}
.chat-mute-wrap md-checkbox.md-default-theme.md-checked .md-icon, .chat-mute-wrap md-checkbox.md-checked .md-icon {
    background-color: rgb(1, 169, 229) !important;
}
.chat-mute-wrap-inner{
position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: block;
    z-index: 99;
}
md-checkbox.md-default-theme.md-checked .md-ink-ripple, md-checkbox.md-checked .md-ink-ripple {
    color: rgb(1, 169, 229);
}


.contact-info-detail .contact-status-wrap, .contact-info-detail .contact-phone-wrap {
    background: #fff;
    padding: 20px 0px 5px 30px;
	margin-bottom: 10px;
	box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.contact-info-detail .contact-status-wrap *, .contact-info-detail .contact-phone-wrap *{
    padding-right: 30px;
}
.contact-info-detail .contact-status-wrap .contact-status{
	border-bottom: 1px solid #eaeaea;
}
.contact-info-detail .contact-status-wrap .contact-status, .contact-info-detail .contact-phone {
    padding: 20px 0;
    color: #4b4b4b !important;
	margin-bottom: 0px !important;
}
.contact-info-detail .contact-status-wrap .contact-status .emoji {
    min-width: 20px !important;
    min-height: 20px !important;
	max-width: 20px !important;
    max-height: 20px !important;
	margin-right:2px;
	margin-bottom: 0px;
}	
.contact-info-detail .btn-chat img,.group-info-detail .btn-chat img{
   min-width: initial;
    max-width: initial;
    min-height: initial;
    max-height: initial;
    margin-bottom: initial;
    margin-left:0px;
    margin-right:15px;
    display:inline-block !important;
}   
.contact-info-detail .btn-chat img{
   min-width: initial;
    max-width: initial;
    min-height: initial;
    max-height: initial;
    margin-bottom: initial;
	margin-left:0px;
	margin-right:15px;
	display:inline-block !important;
}	
.contact-info-detail .btn-transparent{
margin-bottom: 10px;
box-shadow: 0 2px 3px rgba(0,0,0,.1) !important;
background:#ffffff;
padding: 20px 30px;
}
.contact-info-detail .btn-chat{
    position: relative;
    font-size: 14px;
    font-weight: 300;
	text-align: left;
    padding: 20px 30px;
	color: #4b4b4b !important;
	display:block;
	opacity:1 !important;
    text-transform: uppercase;
	cursor: pointer;
	cursor: hand;
	}
	.btn-chat{
    position: relative;
    font-size: 14px;
    font-weight: 300;
	text-align: center;
    padding: 10px 24px;
	display:block;
	opacity:1 !important;
    border-radius: 3px;
    text-transform: uppercase;
	cursor: pointer;
	cursor: hand;
	}
.btn-transparent{
    -webkit-transition: all .18s ease-out;
    transition: all .18s ease-out;
}	
.btn-transparent:hover{
    background:transparent;
	color: #01a9e5;
	-webkit-transition: all .18s ease-out;
    transition: all .18s ease-out;
}
.btn-danger{
background-color: #ffffff ;
color:#ff5252 !important;
    -webkit-transition: all .18s ease-out;
    transition: all .18s ease-out;
	border:0;
	margin-bottom:25px;
	box-shadow: 0 2px 3px rgba(0,0,0,.1) !important;
}
.btn-danger:hover{
background:transparent;
-webkit-transition: all .18s ease-out;
    transition: all .18s ease-out;
}
.media-gallery{
margin-bottom: 10px;
}
.media-gallery  .gallery-img-wrapper {
   padding:0 5px;
   cursor:pointer;
   cursor:hand;
	}
.media-gallery  .gallery-img-canvas:hover {
 border: 3px solid #d2d2d2;
}	
.media-gallery  .gallery-img-canvas{
    padding-top: 100%;	
   border: 3px solid #fff;
    outline: 4px solid #fff;
    background-size: cover;
    background-position: center;
	position: relative;
}

.media-gallery md-checkbox{
position:absolute;
top:6px;
left:6px;
}
.media-gallery md-checkbox .md-icon{
border-radius:50% !important;
}

/**contact-info-end**/

/**group-info**/
.sidenav-group-info .group-info-nav{
    background: #009dd6; /* #c1edfd */
    padding: 5px 30px 5px;
display: block;
float: left;
width: 100%;
}
.sidenav-group-info .group-info-detail{
padding: 0px;
min-height: calc(100% - 58px);
max-height: calc(100% - 58px);
overflow-y: auto;
float: left;
width: 100%;
}
.sidenav-group-info .group-info-detail .group-img
{
display:block;
}
.sidenav-group-info .group-info-detail .group-img img {
    min-width: 200px;
    max-width: 200px;
    min-height: 200px;
    max-height: 200px;
    margin-bottom: 35px;
}
.sidenav-group-info .group-info-nav h5{
font-size:20px;
display:block;
float:left;
width:100%;
}
.sidenav-group-info .group-info-nav h5 a{
float:left;
padding-top: 10px;
}
.sidenav-group-info .group-info-nav .group-overview{
font-size:15px;
float:left;
padding: 3px 0 0;
color: #ffffff;
}
.sidenav-group-info .group-info-nav .group-overview .group-created-info{
display:block;
margin-top:5px;
font-size:13px;
}
.sidenav-group-info .group-info-nav h5 i{
margin-right:20px;
}
.sidenav-group-info .group-info-detail .media-wrap{
    background: #fff;
padding: 20px 30px 5px;
margin-bottom: 10px;
box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.group-info-detail .media-wrap h5, .group-info-detail .participants-wrap h5{
    margin-top: 0;
    /*border-bottom: 1px solid #eaeaea;*/
    padding-bottom: 5px;
    color: #7c8b92;
	font-size:15px;
}
.group-info-detail .media-wrap h5 i{
font-size: 20px;
    margin-top: -3px;
	}
.group-info-detail .media-wrap .no-media{
    border-bottom: 0px;
	padding-bottom: 15px;
    padding-top: 5px;
    color: #4b4b4b;
    margin: 5px auto;
}
.group-info-detail .group-name-wrap {
    background: #fff;
    padding: 0px;
    margin-bottom:0px;
}
.group-info-detail .group-name-wrap .emoji-input-wrap {
font-weight:bold;
font-size: 18px;
}
.group-info-detail .group-name-wrap .group-created-info{
font-size: 14px;
opacity: 0.7;
}
 .group-info-detail .group-name-wrap h5{
    margin-top: 0;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
    color: #7c8b92;
}
.group-info-detail .group-name-wrap .group-name{
    border-bottom: 0px;
    padding-bottom: 5px;
    color: #4b4b4b;
    margin: 5px auto;
    font-weight: 600;
}
.group-avatar-wrap {
    background: #ffffff;
    padding: 30px 30px 20px;
    margin-bottom: 10px;
    box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.group-info-detail .participants-wrap {
     background: #fff;
padding: 15px 0px 0px;
margin-bottom: 10px;
box-shadow: 0 2px 3px rgba(0,0,0,.1);
}
.group-info-detail .participants-wrap h5 {
   margin-bottom: 15px;
    padding:0 30px;
	}
.participants-block .media{
padding: 10px 5px 0 30px;
margin-top:0;
overflow: visible;
}
.participants-block .media:hover {
background:#ecf9fd; 
}
.participants-block .media.active {
background:#c1edfd; 
}
.participants-block .media-body{
vertical-align:middle;
}
.participants-block .media .clickable{
display:flex;
opacity:1 !important;
cursor:pointer;
cursor:hand;
}
.participants-block .media-left{
padding-right: 15px;
}
.participants-block .media-left img{
max-height:50px;
min-height:50px;
max-width:50px;
min-width:50px;
border-radius: 50%;
margin-bottom: 0;
}
.participants-block .media-body{
overflow: visible;
border-bottom: 1px solid #eaeaea;
padding-right:10px;
-webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	}
.participants-block .media-body h4{
font-size:16px;
/* max-width: 190px; */
text-align:left;
}
.participants-block .media-body h4.media-heading{
display:flex;
	}
.participants-block .media-body .group-admin{
    color: #4caf50;
    border: 1px solid #4caf50;
	display: inline-block!important;
    font-size: 11px;
    line-height: 16px;
    padding: 1px 5px 0;
    border-radius: 3px;
	float: right;
	-webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
}
/*.participants-block .media-body .last-text{
font-size:12px;
color:#888;
margin-bottom:15px;
display: flex;
overflow-x:hidden;
overflow: visible;
}*/
.participants-block .media-body .participants-status{
font-weight: 400;
    color: rgba(0,0,0,.6);
    white-space: nowrap;
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
    text-align: left;
}
.participants-block .media-body .participants-name{
font-weight: 400;
    color: rgba(0,0,0,.6);
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: left;
}
.participants-block .media-body .option-arrow{
display:none;
position:relative;
padding: 0 5px;
    overflow: hidden;
}
.participants-block .media .clickable:hover  .media-body .option-arrow , .participants-block .media .clickable.hover  .media-body .option-arrow{
display:inline-flex;
padding: 0 5px;
    overflow: hidden;
}


.participants-block .media-body .left{
display:inline-block;
float:left;
padding-top:4px;
width:100%;
}
.group-name-wrap .form-group{
margin-bottom:0;
}
.group-info-detail .btn-chat {
    position: relative;
    font-size: 14px;
    font-weight: 300;
    text-align: left;
    padding: 20px 30px;
    color: #4b4b4b !important;
    display: block;
    opacity: 1 !important;
    text-transform: uppercase;
    cursor: pointer;
    cursor: hand;
}
.group-btn img{
max-height:50px !important;
min-height:50px !important;
max-width:50px !important;
min-width:50px !important;
    margin-top: 30px;
}
.ok-btn-wrap img{
max-height:50px !important;
min-height:50px !important;
max-width:50px !important;
min-width:50px !important;
    margin-top: 0px;
    margin-bottom:0 !important;
    
}
.ok-btn-wrap
{
    display: block;
    position: relative;
    float: left;
    width: 100%;
    background:#f5f5f5;
    padding: 10px 0;
    min-height:70px;
}


.options>ul>li>a{
padding-top: 8px;
    display: block;
    border-radius: 50%;
    float: left;
    width: 37px;
    height: 37px;
    text-align: center;
	opacity:1 !important;
}	
.options>ul>li.highlighted>a:hover, .options>ul>li.highlighted>a:focus{
    background: #ddd;
	opacity:1;
}	

.sidenav-search-messages .contact-block{
    height: calc(100% - 113px) !important;
}

.matched-message-wrap{
    position: relative;
    cursor: pointer;
    /* background: #fbfbfb; */
    border-top: 1px solid #ddd;
    padding: 20px 15px 10px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	}
	
.matched-message-wrap:hover {
    background: #ecf9fd;
}
.matched-msg-date{
color: rgba(0,0,0,.4);
    font-size: 12px;
	line-height: 14px;
    margin-top: 4px;
    text-transform: capitalize;
	margin:0; 
    display: block;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    text-align: left;
	}
.matched-msg{
color: rgba(0, 0, 0, 0.5);
     margin:5px 0 0; 
    font-size: 13px;
    line-height: 19px;
margin-top: 3px;
    min-height: 20px;
	display: block;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}
.matched-txt{
color:#01a9e5 !important;
}
.searching-message-wrap{
padding: 40px 30px;
text-align:center;
}
.searching-message-wrap .searching-message-status{
font-size: 14px;
    color: #929fa6;
    line-height: 20px;
}
/**rightpanel**/
   .show-panel{
   display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
	opacity:1;
	}
.sliding-left-panel {
    background-color: #ecf9fd;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: auto;
	 -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
	width:100%;
}
.sliding-left-panel.active {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
}

.sliding-left-panel-body {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 1;
	min-height:auto !important;
	max-height:100% !important;
}
.sliding-left-panel-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;	
    background-color: #009dd6;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
    color: #4b4b4b;
    height: 112px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
	 padding-right: 20px;
    padding-left: 25px;
}

.sliding-left-panel-header .panel-arrow-back svg{
float:left;
margin-top:3px;
}

.sliding-left-panel-header-small {
   display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;    
    background-color: #ecf9fd;
    color: #4b4b4b;
    height: 58px;
	border: 0px;
	    padding-right: 20px;
    padding-left: 25px;
}
.sliding-left-panel-header .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	height: 60px;
}	
.sliding-left-panel-header .options ul{
margin-bottom:0;
}
.sliding-left-panel-header-small .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.sliding-left-panel-header .title .sliding-left-panel-control{
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
	margin-right: 20px;
	font-size: 20px;
}
.sliding-left-panel-header .title .sliding-left-panel-control a{
opacity: 1 !important;
}

.sliding-left-panel-header .title .content{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
	font-size: 20px;
	color:#fff;
}
.sliding-left-panel-body .contact-block{
height:100% !important;
}
.sliding-left-panel-body .newchat-detail{
height:100% !important;
max-height:100% !important;
}


/**starred msg**/
/* .starred-msg-panel .sliding-left-panel-body {
    background-color: #eee;
}
.starred-msg-wrap{
    cursor: pointer;
    padding: 13px 7px 7px 13px;
    position: relative;
    box-sizing: border-box;
    z-index: 1;
}
.starred-msg-wrap:before {
    content: '';
    position: absolute;
    top: 0;
    left: 42px;
    height: 1px;
    background-color: #e0e0e0;
    width: 100%;
}
.starred-msg-title {
    margin-bottom: 7px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 26px;    
    font-weight: 400;
    font-size: 14px;
	} */
	
	/**starred msg**/
.starred-msg-panel .sliding-left-panel-body {
    background-color: #eee;
}
.starred-msg-wrap{
    cursor: pointer;
    padding: 13px 7px 7px 13px;
    position: relative;
    box-sizing: border-box;
    z-index: 1;
}
.starred-msg-wrap:before {
    content: '';
    position: absolute;
    top: 0;
    left: 42px;
    height: 1px;
    background-color: #e0e0e0;
    width: 100%;
}
.starred-msg-title {
    margin-bottom: 7px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 26px;    
    font-weight: 400;
    font-size: 14px;
	}
.starred-msg-wrap {
    cursor: pointer;
    padding: 13px 7px 13px 13px;
    position: relative;
    box-sizing: border-box;
    z-index: 1;
}	
.starred-msg-wrap:before {
    content: '';
    position: absolute;
    top: 0;
    left: 42px;
    height: 1px;
    background-color: #e0e0e0;
    width: 100%;
}
.starred-msg-head {
    margin-bottom: 7px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 26px;
    font-weight: 400;
    font-size: 14px;
}
.starred-head-main {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.starred-msg-head .avatar {
    width: 26px;
    height: 26px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 6px;
}
.starred-msg-head .avatar-image {
    min-width: 26px;
    min-height: 26px;
	max-width: 26px;
    max-height: 26px;
	opacity:1;
}
.starred-msg-author {
    margin-right: 3px;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
}
.starred-head-divider {
    width: 8px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    position: relative;
}
.starred-head-divider:before {
    content: '\25B8';
    font-size: 12px;
    line-height: 26px;
    color: #797979;
}
.starred-msg-chat-name{
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin-left: 3px;
}
.starred-head-meta {
    color: rgba(0,0,0,.4);
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-top: 7px;
    margin-left: 6px;
    font-size: 12px;
    line-height: 14px;
    vertical-align: baseline;
}
.starred-msg-wrap .icon-right-arrow {
    margin-left: 6px;
    opacity: .7;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
	font-size: 20px;
}
.starred-msg-wrap .msg-screen{
width:100%;
height:auto ;
min-height:auto ;
position:relative ;
background-image: none;
background-color: unset;
border: 0;
}
.starred-msg-wrap .msg-screen .datetodisplay{
margin-top:0 !important;
}
.starred-msg-wrap .msg-screen .datetodisplay .msg-txt{
max-width:none;
float: left !important;
}
.starred-msg-wrap .msg-screen .datetodisplay .msg-txt .arrow-right{
right:initial !important;
left:-10px;
}

/**end-starred msg**/


/**settings**/
.settings-panel .sliding-left-panel-body {
    background-color: #eee;
}
.settings-panel .contact-block .media{
padding-top:0;
}
.settings-panel .contact-block .media:hover{
    background: rgba(0, 0, 0, 0.06);
}
.settings-panel .contact-block .media .settings-profile-detail{
    height: auto !important;
    padding: 10px 0;
}
.settings-panel .contact-block .media-body{
vertical-align:middle;
border-bottom: 1px solid transparent;
}
.settings-panel .contact-block .media-left {
    padding-right: 25px;
    padding: 15px 25px 15px 0;
}
.settings-panel .contact-block .media-left img {
    max-height: 80px;
    min-height: 80px;
    max-width: 80px;
    min-width: 80px;
    border-radius: 50%;
}

.settings-panel .contact-block .settings-list .media-left {
    padding-right: 25px;
    padding: 20px 25px 20px 10px;
}

.settings-panel .contact-block .settings-list .media-left img {
    max-height: 24px;
    min-height: 24px;
    max-width: 24px;
    min-width: 24px;
	opacity:0.5;
}
.settings-panel .contact-block .settings-list .media-body{
border-top: 1px solid #eaeaea;
}

/**end-settings**/

/**notifications**/
.notifications-panel .sliding-left-panel-body {
    background-color: #eee;
}
.notifications-panel .notifications-wrap{
padding-left:15px;
}
.notifications-panel .notifications-wrap md-list-item:nth-child(3) .md-list-item-text p:first-child{
margin-bottom:0;
margin-top:10px;
}
.notifications-panel .notifications-wrap md-list-item:nth-child(3) .md-list-item-text p:last-child{
margin-bottom:0;
opacity:0.5;
}
.notifications-panel .notifications-wrap md-select{
min-width:100%;
}
md-select.md-default-theme:not([disabled]):focus .md-select-value, md-select:not([disabled]):focus .md-select-value {
    border-bottom-color: rgb(0, 157, 214);
}
md-list-item .md-list-item-inner>md-checkbox, md-list-item>md-checkbox{
margin-right:5px !important;
}
md-select.md-default-theme .md-select-value.md-select-placeholder, md-select .md-select-value.md-select-placeholder{
color:#4b4b4b !important;
}

/**end-notifications**/


/**chat-wallpaper-panel**/
.chat-wallpaper-panel .sliding-left-panel-body {
    background-color: #eee;
}
.chat-wallpaper-panel .wallpaper-color-canvas-wrap{
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
	-webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    padding-top: 30px;
    padding-left: 15px;
    padding-right: 30px;
}
.chat-wallpaper-panel .wallpaper-color-canvas{
display: -webkit-flex;
display: flex;
width:80px;
height:80px;
    margin-bottom: 15px;
    margin-left: 15px;
    border: 3px solid transparent;
    box-sizing: border-box;
    text-align: center;
    font-size: 13px;
	float:left;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
	background-color:#000;
	cursor:pointer;
}
.chat-wallpaper-panel .wallpaper-color-canvas:hover{
border: 4px solid #fff;
}
.chat-wallpaper-panel .wallpaper-color-canvas.active{
border: 4px solid #009dd6;
}
.wallpaper-color-canvas-empty {
    width: 82px;
    height: 0;
    margin-left: 15px;
}

/**end-chat-wallpaper-panel**/

/**blocked-contacts-panel**/
.blocked-contacts-panel .sliding-left-panel-body {
    background-color: #eee;
}
.blocked-contacts-panel .contact-block .media{
padding-top:0;
padding-left:25px !important;
}
.blocked-contacts-panel .contact-block .media-body{
vertical-align:middle;
}
.blocked-contacts-panel .contact-block .media-left {
    padding-right: 25px;
    padding: 10px 25px 10px 0;
}
.blocked-contacts-panel .contact-block .media-body h4{
    display: inline-block;
}	
.blocked-contacts-panel .contact-block .media-body .left{
	width:100%;
}	
.blocked-contacts-panel .contact-block .cancel-icon{
float:right;
opacity:.5;
}
.blocked-contacts-panel .contact-block .contact-add-icon{
 max-height: 24px;
    min-height: 24px;
    max-width: 24px;
    min-width: 24px;
	opacity:.5;
}
.blocked-contacts-panel .contact-block .media.add-btn{
border-bottom: 1px solid #eaeaea;
}
.blocked-contacts-panel .contact-block .media.add-btn .media-left{
	padding:15px 40px 15px 10px
}	
.blocked-contacts-panel .contact-block .add-btn .media-body{
border-bottom: 1px solid transparent;
}
/**end-blocked-contacts-panel**/



/**help-panel**/
.help-panel .sliding-left-panel-body {
    background-color: #eee;
}
.help-panel .contact-block .media{
padding-top:0;
padding-left: 25px !important;
background: #ffffff;
}
.help-panel .contact-block .media:hover,.help-panel .contact-block .media.active{
background: #f1f1f1;
}
.help-panel .contact-block .media-body{
vertical-align:middle;
padding:15px 0;
}
.help-panel .version-wrap{
    display: flex;
    flex-direction: column;
	 -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}	
.version-doodle{
    width: 258px;
    height: 258px;
    -webkit-align-self: center;
    -ms-grid-row-align: center;
    align-self: center;	
	background-image: url(../images/version-doodle2.png);
    margin: 32px 0px;
    background-size: 1600% auto;
    background-repeat: no-repeat;
    overflow: hidden;
    -webkit-animation: loop 1s steps(15) infinite;
    animation: loop 1s steps(15) infinite;
}
@-webkit-keyframes loop {
    100% {
        background-position-x: 100%
    }
}

@keyframes loop {
    100% {
        background-position-x: 100%
    }	
}



/**end-help-panel**/


/**endleftpanel**/


/**rightpanel**/
   .show-panel{
   display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
	opacity:1;
	}
.sliding-right-panel {
    background-color: #f7f7f7; /* #ecf9fd */
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: auto;
	 -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
	width:100%;
}
.sliding-right-panel.active {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
}

.sliding-right-panel-body {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 1;
	min-height:auto !important;
	max-height:100% !important;
}
.sliding-right-panel-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;	
    background-color: #009dd6; /* #00bfa5 */
	border: 0px;
    color: #fff;
    height: 108px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
.sliding-right-panel-header-small {
   display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;    
    background-color: #009dd6 ; /* #ecf9fd */
    color: #4b4b4b;
    height: 58px;
	border: 0px;
	    padding-right: 20px;
    padding-left: 25px;
}
.sliding-right-panel-header .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.sliding-right-panel-header .title .sliding-right-panel-control{
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
	margin-right: 20px;
	font-size: 20px;
	color:#fff;
}
.sliding-right-panel-header .title .sliding-right-panel-control a{
/* opacity: 1 !important; */
}
.sliding-right-panel-header .title .content{
   color:#ffffff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
	font-size: 20px;
}


.sliding-right-panel .msginfo-wrap {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    max-height: 35%;
    overflow-y: auto;
    overflow-x: hidden;
}
.participants-block.msginfo-bodywrap{
padding: 0 30px 15px;
}
.sliding-right-panel .msginfo-wrap .media-frwd-left {
    left: -30px;
}
.sliding-right-panel .msginfo-detail{
    padding: 0px;
	float:left;
	width:100%;
    position: relative;
    background: #ede9e4;
    background: -webkit-linear-gradient(top,#ede9e4 0%,#ede9e4 20%);
    background: linear-gradient(to bottom,#ede9e4 0%,#ede9e4 20%);
}
.sliding-right-panel .msginfo-detail .msg-screen{
min-height: auto !important; 
    background-size: initial !important;
position: relative!important; 
}
.sliding-left-panel .starred-msg-wrap .msg-screen .msg-wrap{
padding-left:15px !important;
padding-right:15px !important;
}
.sliding-left-panel .starred-msg-wrap .msg-screen .msg-wrap .msg-txt{
max-width:100% !important;
}
.sliding-right-panel .msginfo-detail .msg-screen .msg-wrap{
padding-left:15px !important;
padding-right:15px !important;
}
.sliding-right-panel .msginfo-detail .msg-screen .msg-wrap .msg-txt{
max-width:100% !important;
}
.col-2-shrink .msg-screen .sender .msg-txt{
max-width:75% !important;
}
.sliding-right-panel .msginfo-detail .msg-screen .receiver, .sliding-right-panel .msginfo-detail .msg-screen .sender {
    margin: 15px 0;
	}
.sliding-right-panel-body .read-by{
margin-bottom: 10px !important;
}
.sliding-right-panel-body .single-chat.read-by{
margin-bottom: 30px !important;
padding: 0 0 0 30px;
}
.delieverd-to .participants-block .media:last-of-type  .media-body, .read-by .participants-block .media:last-of-type  .media-body{
    border-bottom: 0px !important;
}
.delieverd-to.participants-wrap h5, .read-by.participants-wrap h5 { 
    border-bottom: 0px !important;
    font-size: 13px !important;
}
.single-chat .participants-block .media-body h4.media-heading img{
margin-right:5px ;
}

.delieverd-to .participants-block .media:hover, .read-by .participants-block .media:hover {
    background: transparent !important;
	cursor: auto !important;
}
.delieverd-to .participants-block .clickable, .read-by .participants-block .clickable {
cursor: auto !important;
}
/**endrightpanel**/


@media (min-width: 768px)
{
.dropdown-menu.moreoptions li {
margin-left:0 !important;
}
.dropdown-menu.moreoptions li a {
padding: 10px 65px 10px 25px !important;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #ecf9fd !important;
	background-image: none !important;
	color:#000 !important;
	opacity:1;
}
.dropdown-menu.moreoptions{
    right: 0px;
    left: auto;
    top: 37px;
    min-width: 150px;
	}
.dropdown.open .dropdown-menu{
 opacity:1;
 transform-origin:top right;
 transform:scale(1);
}
.dropdown-menu.moreoptions{
 opacity:1;
 -moz-transition:    all .5s ease;
    -webkit-transition: all .3s ease;
    -o-transition:      all .3s ease;
    -ms-transition:     all .3s ease;
    transition:         all .3s ease;
display:block;
 transform-origin:top right;
 transform:scale(0);
}
}



/**end-chat.html**/



/**chat-color**/
.txt-green{
color:green;
}
.txt-red{
color:red;
}
.txt-blue{
color:blue;
}
.txt-white{
color:white;
}
.txt-yellow{
color:yellow;
}
.txt-aqua{
color:aqua;
}
.txt-black{
color:black;
}
.txt-fuchsia{
color:fuchsia;
}
.txt-gray{
color:gray;
}
.txt-lime{
color:lime;
}
.txt-maroon{
color:maroon;
}
.txt-navy{
color:navy;
}
.txt-olive{
color:olive;
}
.txt-orange{
color:orange;
}
.txt-purple{
color:purple;
}
.txt-silver{
color:silver;
}
.txt-teal{
color:teal;
}

/**backgound-color**/
.bg-theme{
background-color:#01a9e5;
}
.bg-green{
background-color:green;
}
.bg-red{
background-color:red;
}
.bg-blue{
background-color:blue;
}
.bg-white{
background-color:white;
}
.sender .bg-darktheme{
background-color: #276980 !important;
}
.sender .reply-msg-color-bar{
background-color: #bfeeff !important;
}
.bg-lite{
background-color:#f1f1f1 !important;
}
.bg-yellow{
background-color:yellow;
}
.bg-aqua{
background-color:aqua;
}
.bg-black{
background-color:black;
}
.bg-fuchsia{
background-color:fuchsia;
}
.bg-gray{
background-color:gray;
}
.bg-lime{
background-color:lime;
}
.bg-maroon{
background-color:maroon;
}
.bg-navy{
background-color:navy;
}
.bg-olive{
background-color:olive;
}
.bg-orange{
background-color:orange;
}
.bg-purple{
background-color:purple;
}
.bg-silver{
background-color:silver;
}
.bg-teal{
background-color:teal;
}
/**loader**/
.loader-container{
display:block;
padding:5px;
background:#fff;
border-radius:50%;
margin:0 auto;
width:40px;
}
.loader {
 
  border: 4px solid #f3f3f3;
  border-radius: 50%;
  border-top: 4px solid #3498db;
  width: 30px;
  height: 30px;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*--------- Style by V ----------*/


.sidenav-newgroup-addcontacts
{
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #f4f4f4; /* #fff */  /* ecf9fd */
    overflow-x: hidden;
    transition: 0.5s;
	overflow:hidden;
	transition-timing-function: cubic-bezier(.02,.09,0,1);
	-webkit-transition: all .5s; /* Safari */
    transition: all .5s;
	-webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
}

.sidenav-newgroup-addcontacts .search_contact_for
{
width:100%;
border:0px;
padding:15px;
background:transparent;
border-bottom:1px solid #ddd;
}

.sidenav-newgroup-addcontacts .search_contact_for:focus
{
outline:none;
}

.add_contact_for_group
{
margin-left:25px;
max-height: 131px;
    overflow-y: auto;
}


.selected_contact_for_group
{
    padding: 10px 0px;
    margin: 0px;
	    float: left;
    width: 100%;
}
.selected_contact_for_group li
{
display: block;
    list-style-type: none;
    width: 100%;
    float: left;
    padding: 5px 0px;
}
.selected_contact_for_group li .contact_wrap
{
background-color: #e8e8e8;
    border-radius: 16px;
	float: left;
}	
.selected_contact_for_group li span.contact_avator,.selected_contact_for_group li span.contact_name,.selected_contact_for_group li span.contact_close
{
float:left;
}
.selected_contact_for_group li span.contact_name{
padding-top: 3px;
line-height: 17px;
margin:0 5px;
}
.selected_contact_for_group li span.contact_avator img
{
width:25px;
height:25px;
border-radius:50%;
}
.selected_contact_for_group li span.contact_name p
{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	max-width: 200px;
	float:left;
	padding: 2px 10px 0px;
	margin:0;
}

.selected_contact_for_group li span.contact_close a
{
color:#4b4b4b;
padding-top: 2px;
    float: left;
    padding-right: 6px;
    font-size: 15px;
	opacity:1;
}
.sort-label{
padding: 30px 0 20px 30px;
margin:0;
}

.search_contact_inner .media-left img {
     min-width: 50px !important; 
     max-width: 50px !important; 
     min-height: 50px !important; 
     max-height: 50px !important; 
     margin-bottom: 0px !important; 
}

.sidenav-newgroup-addcontacts .newgroup-detail .contact-block{
height: 100% ;
overflow-y:auto;
}
.sidenav-newgroup-addcontacts .add_contact_for_group.search-active ~ .newgroup-detail{
    min-height: calc(100% - 333px);
	max-height: calc(100% - 333px);
    margin-top: 20px;
}
.sidenav-newgroup-addcontacts .newgroup-detail {
    min-height: calc(100% - 273px);
    max-height: calc(100% - 273px);
    margin-top: 20px;
}	
.img-upload{  
	text-align:center;
margin-bottom:30px ;
}
.img-upload p{
margin:0 !important;
	 padding: 9px 12px !important;
	display:inline-block;
background-color: #35474c; 
    border-radius: 2px;
    font-size: 13px;
    color: #fff !important;
	
}
.img-upload a{
margin-left:10px;
color:#01a9e5 !important;
font-weight:600;
opacity:1;
}







/**dropdown-menu**/
.dropdown-menu.attachments {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
	min-width:1px !important;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
     background-color: transparent;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 0; 
    border-radius: 4px;
     box-shadow: none;
	 
}
.open .dropdown-menu.attachments {
-webkit-transition: -webkit-transform .05s ease-out;
    transition: transform .05s ease-out;
    transform-origin: left top 0px;
}
.dropdown-menu.attachments li{
margin-left:0 !important;
padding: 25px 0 0;
}
.dropdown-menu.attachments li a{
padding: 0 !important;
margin:0;
background: transparent !important;
-webkit-transform-origin: top center;
    transform-origin: top center;
opacity:0;	
transform: translateY(0px) scaleX(0) scaleY(0);
}
.open .dropdown-menu.attachments li a {
opacity:1;	
transform: translateY(0px) scaleX(1) scaleY(1);
}
.open .dropdown-menu.attachments li a img{
max-height:50px !important;
max-width:50px !important;
-webkit-transition: -webkit-transform .05s ease-out;
    transition: transform .05s ease-out
    box-shadow: 0 1px 2px rgba(0,0,0,.17),0 6px 8px rgba(0,0,0,.29);
	border-radius: 50%;
}

.moreinfo .dropdown-menu.moreoptions li a {
    padding: 10px 65px 10px 25px !important;
    font-size: 14px;
}
.moreinfo .dropdown-menu{
    right: 0px;
    left: auto;
    top: 17px;
    min-width: 150px;
	}
.dropdown.moreinfo.open .dropdown-menu{
 opacity:1;
 transform-origin:top right;
 transform:scale(1);
}
.moreinfo .dropdown-menu{
 opacity:1;
 -moz-transition:    all .5s ease;
    -webkit-transition: all .3s ease;
    -o-transition:      all .3s ease;
    -ms-transition:     all .3s ease;
    transition:         all .3s ease;
display:block;
 transform-origin:top right;
 transform:scale(0);
}
.msgmoreinfo{
    position: absolute;
    top: 0;
    right: 3px;
    background: rgba(255, 255, 255, 0.92);
    padding: 5px 7px;
    cursor: pointer;
	display:none;
}
.msgmoreinfo.hover, .msg-txt:hover .msgmoreinfo{
display:block;
}
.sender .msg-txt .msgmoreinfo{
    background: rgba(1, 169, 229, 0.87) !important;
	z-index:999;
}
.receiver .msg-txt .dropdown-menu.moreoptions{
	transform-origin: top left !important;
    transform: scale(0);
	right: auto;
    left: 0;
    top: 25px;
    min-width: 1px;
}
.receiver .msg-txt .dropdown-menu.moreoptions li a, .sender .msg-txt .dropdown-menu.moreoptions li a {
    padding: 10px 25px 10px 25px !important;
}
.receiver .msg-txt .dropdown.open .dropdown-menu{
 opacity:1;
 transform-origin:top left !important;
 transform:scale(1);
}








/**btns**/
.name-box{
display: flex;
border-bottom: 1px solid #ccc !important;
    border: 0;
}
.name-box.active {
border-bottom: 1px solid #01a9e5 !important;
    border: 0;
}
.name-box-input .transparent-input{
height:26px;
padding:0;
float: left;
    border: 0 !important;
}
.name-box-input  {
flex:1;
display:inline-block;
}
.name-box-btns {
display:inline-block;
}
.name-box-btns a{
font-size:18px;
display:block;
margin-left:10px;
float:right;
color: #7c8b92 !important;
opacity:1;
}
.search-box{
display: flex;
    border: 0;
	margin-bottom:30px;
	    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 0, 0, 0.25);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 0, 0, 0.1);
    padding: 0 10px;
    border-radius: 3px;
}
.search-box.active {
    border: 0;
}
.search-box-input .transparent-input{
height:26px;
padding:0;
float: left;
    border: 0 !important;
}
.search-box-input  {
flex:1;
display:inline-block;
}
.search-box-input  .form-control{
 border: 0; 
 box-shadow:none; 
}
.search-box-btns-left, .search-box-btns-right {
display:inline-block;
}
.search-box-btns-left a, .search-box-btns-right a{
font-size:18px;
display:block;
color: #7c8b92 !important;
opacity:1;
}
.search-box-btns-left{
float:left;
margin-right: 15px;
    padding-top: 5px;
}
 .search-box-btns-right{
float:right;
margin-left: 15px;
    padding-top: 5px;
 }
 .btn-cancel{
     background-color: #fff !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.4);
    -webkit-transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    border: 0;
    margin-top: 25px;
	margin-bottom: 35px;
	margin-right:15px;
	display: inline-block !important;
	}
 .btn-confirm, .btn-exit{
    color: #fff !important;
     background-color: #01a9e5 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.4);
    -webkit-transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    border: 0;
    margin-bottom: 25px;
	margin-top: 25px;
	display: inline-block !important;
	}
.btn-confirm:hover, .btn-cancel:hover, .btn-exit:hover{	
	box-shadow: 0 3px 12px rgba(0,0,0,.4);
	}
	


	/**modal-popups**/
 
 .modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: .85;
    background-color: transparent;
} 
.modal-wrapper{
position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,.85);
    z-index: 10000;
	display: table;
}
.modal-wrapper:after, .modal-wrapper:before {
    content: '';
    display: table-cell;
    width: 50%;
}
.modal-dialog{
max-height:inherit !important;
    display: initial;
    vertical-align: middle;
}
.modal-outer-wrap{ 
 display: table-cell;
    vertical-align: middle;
}	
	
	.modal-inner-wrap{
    max-height: calc(100vh - 30vh);
    width: 390px;
	margin: auto;
	overflow: hidden;
	display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
	background: #fff;
	    box-shadow: 0 17px 50px 0 rgba(0,0,0,.19),0 12px 15px 0 rgba(0,0,0,.24);
	border-radius:3px;	
		}
		.modal-body {
	 max-height: calc(100vh - 100px);
    overflow-y: auto;
    padding:0;
	width: 100%;
    }
	
	
	.modal-header {
    padding: 15px 25px;
    border-bottom: 0;
    background: #01a9e5;
    color: #fff;
    }
	.modal-title {
    margin: 0;
    line-height: auto;
    }
    .modal-title .close {
    margin: 0 30px 0 0 ;
	float:left; 
	    color: #fff;
		    opacity: 1;
	}
.confirm-popup .modal-header {
    padding: 15px 25px;
    border-bottom: 0;
    background: #fff;
    color: #01a9e5;
    }
.add-participants-confirm .modal-header .modal-title{
	font-size: 15px;
    color:#4b4b4b !important;	
	}
 .exit-group-confirm .modal-header .modal-title, .trying-to-reach-phone .modal-header .modal-title{
	font-size: 17px;
	font-weight:600;
    color:#4b4b4b !important;
}
.exit-group-confirm .modal-header .modal-sub-title, .trying-to-reach-phone .modal-header .modal-sub-title{
	font-size: 14px;
	color:#4b4b4b !important;
}
.add-participants-confirm .modal-body, .exit-group-confirm .modal-body, .trying-to-reach-phone .modal-body{
text-align:center;
}
.modal-sub-title span{
    word-break: break-all;
    line-height: 20px;
}	
.trying-to-reach-phone .note-box{
margin-top:20px;
padding-top:10px;
border-top:1px solid #ddd;
width:100%;
display:block;
    color: #4b4b4b !important;
}

.contact-us-popup{
max-height: calc(100vh - 20vh);
}
.confirm-popup.contact-us-popup .modal-header {
    padding: 15px 25px;
	margin-bottom:15px;
    border-bottom: 0;
    background: #01a9e5;
    color: #fff;
}
.contact-us-popup .input-wrap{
width: 100%;
padding: 0 25px;
}
.contact-us-popup md-input-container{
    display: block;
    width: 100%;
}
.contact-us-popup .input-wrap .btn-chat{
float:right;
}
/**animations**/
.bgblink-sender{
    background-color: #01a9e5;
    -webkit-animation-name: bgblink-sender; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
    animation-name: bgblink-sender;
    animation-duration: 2s;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes bgblink-sender {
    0% {background-color: #01a9e5;}
    50% {background-color: #428298;}
    100% {background-color: #01a9e5;}
}
/* Standard syntax */
@keyframes bgblink-sender {
    0% {background-color: #01a9e5;}
    50% {background-color: #428298;}
    100% {background-color: #01a9e5;}
}
.bgblink-reciever{
    background-color: #fff;
    -webkit-animation-name: bgblink-reciever; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
    animation-name: bgblink-reciever;
    animation-duration: 2s;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes bgblink-reciever {
    0% {background-color: #fff;}
    50% {background-color: #428298;}
    100% {background-color: #fff;}
}
/* Standard syntax */
@keyframes bgblink-reciever {
    0% {background-color: #fff;}
    50% {background-color: #428298;}
    100% {background-color: #fff;}
}

/**vj 30-11-16**/


.input_for_frwd
{
float:left;
/* margin-right:20px; */
display:none;
}

.input_for_frwd .select_for_frwd
{
    height: 15px;
    width: 15px;
}
.frwd-msg-wrap {
     /* min-height: calc(100vh - 100px) !important; */
	 /* max-height: calc(100vh - 100px) !important; */
	 }
.frwd-msg-wrap .contact-block{
background:transparent !important;
}
.frwd-msg-wrap .listing-title {
    height: 69px;
    box-sizing: border-box;
    font-weight: 300;
    font-size: 19px;
    padding: 25px 0 15px 20px;
    color: #01a9e5;
    text-transform: uppercase;
    background-color: #fff;
}

.frwd-msg-wrap .search-status{
padding: 60px 0 30px 20px;
    color: #000;
	opacity:0.7;
	text-align:center;
	font-size: 14px;
}

.msg-input.remove_selected
{
position:absolute;
z-index: 99;
bottom:0px;
display:none;
}

.selected_msg_frwd a
{
padding:0px 10px;
}

.selected_msg_frwd a, .selected_number
{
font-size:20px;
color:#4b4b4b;
}

.selected_number_count
{
    padding: 0px 5px 0px 20px;
    font-size: 16px;
}

.selected_number_static
{
font-size:16px;
}

.selected_number
{
margin-left:30px;
}

.checkboxdemoSelectAll .demo-legend {
  color: #3F51B5; }

.checkboxdemoSelectAll .demo-fieldset {
  border-style: solid;
  border-width: 1px;
  height: 100%; }

.checkboxdemoSelectAll .demo-select-all-checkboxes {
  padding-left: 30px; }

  
  /**angular-items**/
  md-menu-item {
  min-height:35px !important;
  height:35px !important;
  }
  

@-moz-keyframes flash2 {  
    0% { 
   background:#0e72a4; 
   }
    50% { 
	background:#fff; 
	}
    100% {
   background:#0e72a4; 
   }
}

@-webkit-keyframes flash2 {  
    0% { 
   background:#0e72a4;
   }
    50% { 
	background:#fff; }
    100% {
   background:#0e72a4; 
   }
}

@keyframes flash2 {  
    0% { 
   background:#0e72a4; 
   }
    50% { 
	background:#fff; 
	}
    100% {    background:#0e72a4;
	}
}

.flash2 {
 -webkit-animation-name: flash2;
    -webkit-animation-duration: 2s;
    -webkit-animation-timing-function: linear;

    -moz-animation-name: flash2;
    -moz-animation-duration: 2s;
    -moz-animation-timing-function: linear;

    animation-name: flash2;
    animation-duration: 2s;
    animation-timing-function: linear;
  
}

@-moz-keyframes flash3 {  
    0% { 
   background:#0e72a4; 
   }
    50% { 
	background:#01a9e5; 
	}
    100% {
   background:#0e72a4; 
   }
}

@-webkit-keyframes flash3 {  
    0% { 
   background:#0e72a4;
   }
    50% { 
	background:#01a9e5; }
    100% {
   background:#0e72a4; 
   }
}

@keyframes flash3 {  
    0% { 
   background:#0e72a4; 
   }
    50% { 
	background:#01a9e5; 
	}
    100% {    background:#0e72a4;
	}
}

.flash3 {
 -webkit-animation-name: flash3;
    -webkit-animation-duration: 2s;
    -webkit-animation-timing-function: linear;

    -moz-animation-name: flash3;
    -moz-animation-duration: 2s;
    -moz-animation-timing-function: linear;

    animation-name: flash3;
    animation-duration: 2s;
    animation-timing-function: linear;
  
}


/**faq**/
   
   
	.form-control::-webkit-input-placeholder,
	.form-control:-moz-placeholder,
	.form-control::-moz-placeholder,
	.form-control:-ms-input-placeholder{
	color:#C3C3C3 !important;
	}
	
    .faq .bg-inner{
	background-image: url(../images/bg-inner.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
	background-color: #f8f8f8;
    height: 368px;
	text-align:center;
	padding:50px;
	}
	
	.faq .faq-welcome-title{
	margin:0;
	color:#01a9e5;
	font-weight:normal;
	}	
	.faq .faq-search-box-wrap{
	max-width:70%;
	margin-top:50px;
	position:relative;
	}
	.faq .faq-search-box-wrap .faq-search-box{
	font-size: 22px;
    padding: 10px 25px;
    height: 55px;
	outline:none;
	border-radius:10px;
	border:0;
	box-shadow:none !important;
	box-sizing:border-box;
	}
	.faq .faq-search-box-wrap .faq-search-box-results{
	position:absolute;
	left:0;
	right:0;
	top:58px;
	border-radius:5px;
	background:#fff;
	padding: 20px 36px;
	box-shadow: 0 5px 10px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);
	overflow-x:hidden;
	overflow-y:auto;
	z-index: 9999;
	display:none;	
	min-height: 0px;
	max-height: 0px;
	 -moz-transition:    height 2s ease;
    -webkit-transition: height 2s ease;
    -o-transition:      height 2s ease;
    -ms-transition:     height 2s ease;
    transition:         height 2s ease;
	}
	.faq .faq-search-box-wrap .faq-search-box-results.open{
	-moz-transition:    height 2s ease;
    -webkit-transition: height 2s ease;
    -o-transition:      height 2s ease;
    -ms-transition:     height 2s ease;
    transition:         height 2s ease;
	display:block;	
	min-height: 350px;
	max-height: 350px;
	}
	
	.faq .faq-search-box-wrap .faq-search-list{
	list-style:none;
	padding:0;
	}
	.faq .faq-search-box-wrap .faq-search-item{
	margin-bottom:20px;
	text-align:left !important;
	}
	.faq .faq-search-box-wrap .faq-search-item:last-child{
	margin-bottom:0px;
	}
	.faq .faq-search-box-wrap .faq-search-item a{
	opacity:1!important;
	color:initial;
	}
   .faq .faq-search-box-wrap .faq-cat-name{
	font-size: 14px;
    color: #b4b8b7;
    margin-top: 5px;
    margin-bottom: 5px;
	}
    .faq .faq-search-box-wrap .faq-que{
    color: #01a9e5;
    margin:5px 0 10px ;
    font-size:18px;	
    }	
    .faq .faq-search-box-wrap .faq-ans{
	font-size: 14px;
    line-height: 21px;
    color: #444;
    margin-top: 5px;
    margin-bottom: 5px;
	overflow: hidden;
}

.faq-bg{
    background: #f8f8f8;
}
.faq-bg .container{
background:#fff;
padding: 70px;
}	
.faq-overview .title h2{
font-size: 25px;
margin:0 0 30px;
}
.faq-overview .title h3{
font-size: 25px;
margin:0 0 15px;
}
.faq-overview .search-results
{
padding: 50px 40px 50px 0;
}
.faq-overview .search-results ul{
    list-style-type: none;
}
.faq-overview .search-results li{
    margin-bottom:30px;
}
.faq-overview .search-results li h5{
    font-size: 14px;
    font-weight: 500;
    color: #b4b8b7;
    border-radius: 4px;
    margin:0 0 5px;;
}
.faq-overview .search-results li h2{
color: #01a9e5;
margin:0;
margin-bottom: 10px;
font-size: 20px;
}
.faq-overview .search-results li p{
    font-size: 14px;
    font-weight: 500;
    color: #555;
    border-radius: 4px;
    margin-top: 7px;
    margin-bottom: 2px;
}
.faq-overview .faq-cat-name{
	font-size: 24px;
    color: #01a9e5;
    margin-top: 5px;
    margin-bottom: 20px;
	}
.faq-overview .faq-que{
    color: #5b5f62;
    margin:5px 0 10px ;
    font-size:14px;	
    }	
.faq-overview .faq-que:hover,.viewll-btn:hover{
text-decoration:underline !important;
}
.viewll-btn{
   font-size: 14px;
    color: #b4b8b7 !important;
    margin-top: 5px;
    margin-bottom: 10px;
	opacity:1 !important;
	cursor:pointer;
}
.mb30{
margin-bottom:30px !important;
}

/**faq-inner**/

.faq-inner-wrap .faq-inner .container{
background:#fff;
padding: 0px 70px;
}
.faq-inner-header{
border-bottom:1px solid #ddd;
padding:30px 0;
}
.breadcrum{
line-height: 33px;
}
.breadcrumb-path:after {
    content: '→';
    color: #b4b8b7;
    font-size: 20px;
    margin:0 5px;
}
.faq-inner .faq .faq-search-box-wrap{
margin:0;
float:right;
width:100%;
max-width:100%;
}
.faq-inner .faq .faq-search-box-wrap .faq-search-box{
font-size: 15px;
    padding: 5px;
    height: 25px;
background:#f8f8f8;
font-size: 15px;
    padding: 5px 15px;
    height: 35px;
    background: #f8f8f8;
   border-radius:25px;
width:60%;
text-align:center;   
float:right;
transition: width .3s ease-in-out;
}
.faq-inner .faq .faq-search-box-wrap .faq-search-box.search-active,.faq-inner .faq .faq-search-box-wrap .faq-search-box:focus {
text-align:left;
width:100%;
transition: width .3s ease-in-out;
}
.faq-inner .faq .faq-search-box-wrap .faq-search-box-results{
top:40px;
}

.faq-inner .faq-inner-content{
padding:40px 80px;
}
.faq-inner .faq-inner-content .title{
font-size: 25px !important;
    margin: 0 0 30px !important;
}
.faq-inner .faq-inner-content p,.faq-inner .faq-inner-content div{
    font-size: 16px !important;
    line-height: 26px !important;
    color: #5b5f62 !important;
}
.faq-inner .faq-inner-content h3{ 
    padding: 0 !important;
    margin-bottom: 30px !important;
    font-size: 21px !important;
    line-height: 26px !important;
    font-weight: normal !important;
    color: #01a9e5 !important;
}	
.faq-inner .faq-inner-content ul, .faq-inner .faq-inner-content ol{ 
margin-left: 40px !important;
margin-bottom:25px !important;
padding:0;
}
.faq-inner .faq-inner-content li{
margin-bottom:10px !important;
font-size: 16px !important;
    line-height: 26px !important;
    color: #5b5f62 !important;
}
.faq-inner .faq-inner-content a{
color: #01a9e5 !important;
opacity:1!important;
}


.error-page-not-found{
padding:80px 100px;
min-height:560px;
}
.error-page-not-found .error-title{
    font-size: 26px;
    line-height: 31px;
    font-weight: 300;
    color: #32373b;
	margin:0 0 30px;
	}
.error-page-not-found .error-desc{	
	    font-size: 18px;
        line-height: 30px;
	    color: #5b5f62;
		}
.btn-go-home {
    background: #01a9e5;
    color: #fff !important;
	opacity:1!important;
    border: 2px solid #01a9e5;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 15px;
    border-radius: 30px;
    margin: 20px auto;
    transition: all 0.5s ease;
}
.btn-go-home:hover{
color: #01a9e5 !important;
border: 2px solid #01a9e5;
background:transparent;
transition: all 0.5s ease;
}	
.error-page-not-found .error-title.web-status-failed{
color: #f15050;
margin: 30px 0;
}
.error-page-not-found .error-title.web-status-success{
color: #32a51f;
margin: 30px 0;
}

/**media**/
.msg-screen .sender .msg-txt.media-img-wrap,.msg-screen .receiver .media-img-wrap.msg-txt{
padding:3px !important;
}
.msg-screen .sender .media-img-wrap.msg-txt::after, .msg-screen .receiver .media-img-wrap.msg-txt::after{
content:"" !important;
}
.msg-screen .sender .media-plus-txt.msg-txt::after, .msg-screen .receiver .media-plus-txt.msg-txt::after{
    content: " \00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0" !important;
}
.msg-screen .sender .msg-txt.media-img-wrap.media-plus-txt .msg-time-wrap, .msg-screen .receiver .msg-txt.media-img-wrap.media-plus-txt .msg-time-wrap {
    bottom: 5px ;
    right: 8px ; 
}
.msg-screen .receiver .msg-txt.media-img-wrap .msg-time-wrap {
color:#fff;
}
.sender .message-txt a{
color:#fff !important;
}
.msg-screen .msg-txt.media-img-wrap.media-plus-txt .shade{
display:none;
}
.msg-screen .msg-txt.media-img-wrap.media-plus-txt{
max-width:336px !important;
}
.msg-screen .msg-txt.media-reply .reply-msg-status{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
	}
.media-img-wrap .message-txt-wrap{
padding:10px;
}	
.msg-screen .sender .msg-txt.media-img-wrap .shade,.msg-screen .receiver .msg-txt.media-img-wrap .shade {
    position: absolute;
    bottom: 3px;
	left:3px;
	right:3px;
    height: 45px;
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7),transparent);
    background: linear-gradient(to top,rgba(0,0,0,.7),transparent);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
	z-index: 999;
}
.msg-screen .msg-txt.media-img-wrap{
max-width:90% !important;
}
.chat-media-img-wrap {
    overflow: hidden;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
     -webkit-box-pack: center;
    -ms-flex-pack: center;
     justify-content: center; 
    position: relative;
	background: #fff;
}
.msg-screen .msg-txt.media-img-wrap .media-img {
	-webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    -webkit-transition: -webkit-filter .16s linear;
    border-radius:5px;
}
.msg-screen  .msg-txt.media-img-wrap .chat-media-img-wrap .media-img.overlay{
filter:blur(5px);
-webkit-filter:blur(5px);
-moz-filter:blur(5px);
-o-filter:blur(5px);
}
.media-loader-wrap{
position: absolute;
    cursor: pointer;
    /* height: 100%; */
    margin: auto !important;
    top: 42%;
	left:0;
	right:0;	
	z-index:999;
}
.media-frwd{   
    position: absolute;
    cursor: pointer;
    width: 28px;
    height: 28px;
    margin: auto !important;
    top: 42%;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.17);
    padding: 0;
}
.media-frwd-right{ 
    right: -40px;
}
.media-frwd-left{ 
    left: -40px;
}
.media-frwd img{
    min-width: 25px;
	min-height: 25px;
    max-width: 25px;
	max-height: 25px;
}
 .msg-txt.media-img-wrap .msgmoreinfo-wrap
{  
    position: absolute;
    cursor: pointer;
    display: none;
    width: 50%;
	height: 45px;
    right:3px;
    top: 3px !important;
    background: -webkit-linear-gradient(20deg,transparent 0%,transparent 45%,rgba(0,0,0,.25)70%,rgba(0,0,0,.5)100%) !important;
    background: linear-gradient(20deg,transparent 0%,transparent 45%,rgba(0,0,0,.25)70%,rgba(0,0,0,.5)100%) !important;
}
 .msg-txt.media-img-wrap .msgmoreinfo{
background:transparent !important;
}	
 .msg-txt.media-img-wrap:hover .msgmoreinfo-wrap{
display:block;
}

.media-loader-wrap{
position: absolute;
    cursor: pointer;
    /* height: 100%; */
	left:0;
	right:0;
    margin: auto !important;
    top: 42%;
}
.media-loader-wrap .loader-container {
    background: rgba(0, 0, 0, 0.38) !important;
    width: 35px !important;
    height: 35px !important;
	padding: 0px !important;
}
.media-loader-wrap .loader-container .media-cancel-btn{
min-width:25px;
max-width:25px;
min-height:25px;
max-height:25px;
position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    margin-top: 5px;
}
.media-loader-wrap .loader {
    border: 2px solid #f3f3f3;
    border-radius: 50%;
    border-top: 2px solid #3498db;
    width: 35px;
    height: 35px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}

.media-loader-wrap .media-download-container {
    width: 100%;
    padding: 0px !important;
    display: inline-block;
    text-align: center;
}
.media-loader-wrap .media-download-container .media-download{
background: rgba(0, 0, 0, 0.38) !important;
padding: 5px 15px;
display:inline-block;
border-radius:25px;
position: relative;
    margin: 0 auto;
}
.media-loader-wrap .media-download-container .media-download img{
min-width:30px;
max-width:30px;
min-height:30px;
max-height:30px;
}
.media-loader-wrap .media-download-container .media-download .file-size{
color:#fff;
}

.media-upload-container {
    height: calc(100% - 58px);
    top: 58px;
	transform: translateY(100%);
	position: absolute;
    left: 0;
    width: 100%;	
	z-index: 5;
	-moz-transition:    all .7s ease;
    -webkit-transition: all .7s ease;
    -o-transition:      all .7s ease;
    -ms-transition:     all .7s ease;
    transition:         all .7s ease ;
}
.media-upload-pane{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f7f7f7;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: auto;
}

.media-upload-nav {
    background-color: #41cdff;
    color: #fff;
    height: 49px;
    padding: 0 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.media-upload-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.media-upload-cancel-btn img{
width:25px;
height:25px;
}
.media-upload-title-content{
font-size:18px;
color:#fff;
line-height: 25px;
margin-left:15px;
font-weight: 600;
}
.media-upload-detail-wrap {
    position: relative;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
	  -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
}
.media-upload-detail{
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
}
.media-upload-detail-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.media-element-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    width: 100%;
    opacity: 1;
    transform: translateX(0px);
}
.media-element {
    position: absolute;
    width: calc(100% - 40px);
    height: calc(100% - 30px);
    top: 20px;
    left: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.element-scaledown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: visible;
}
.element-fit {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}
.media-img-viewer{
    z-index: 2;
    height: auto;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    width: 100%;
}
.media-video-viewer {
    z-index: 999;
    height: 100%;
    width: 100%;
}
.media-caption {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 75%;
    font-family: inherit;
    position: relative;
    opacity: 1;
}
.media-multi {
    margin-top: 30px;
    height: 120px;
    background-color: #f1f1f1;
    box-sizing: border-box;
    padding: 0 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.media-thumb {
    max-width: 100px;
    height: 100px;
    overflow: hidden;
    margin-right: 8px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: flex!important;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	    -webkit-transition: -webkit-transform 75ms ease-out;
    transition: transform 75ms ease-out;
	    opacity: 1;
    transform: scaleX(1) scaleY(1);
    transform-origin: 50% 50% 0px;
}
.media-thumb:hover .media-thumb-remove{
    display: inline-block;
}
.media-thumb .media-thumb-remove{
    display:none;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 5px;
    right: 5px;
	z-index: 99;
	background:rgba(0,0,0,0.3);
}
.media-thumb .media-thumb-remove img{
max-width:100%;
}	
.media-thumb.active .media-thumb-content {
    -webkit-transform: scale(.94);
    transform: scale(.94);
    border: 3px solid #fff;
}
.media-thumb-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-transition: -webkit-transform .1s ease-out;
    transition: transform .1s ease-out;
    z-index: 1;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	overflow:hidden;
}
.media-thumb-content img{
min-height:100px;
max-height:100px
}
.media-thumb-content .btn-delete-media-wrap{
    position: absolute;
    cursor: pointer;
    display: none;
    width: 50%;
    height: 45px;
    right: 3px;
    top: 3px !important;
    background: -webkit-linear-gradient(20deg,transparent 0%,transparent 45%,rgba(0,0,0,.25)70%,rgba(0,0,0,.5)100%) !important;
    background: linear-gradient(20deg,transparent 0%,transparent 45%,rgba(0,0,0,.25)70%,rgba(0,0,0,.5)100%) !important;
}
.msgmoreinfo{
    position: absolute;
    top: 0;
    right: 3px;
    background: rgba(255, 255, 255, 0.92);
    padding: 5px 7px;
    cursor: pointer;
	display:none;
    z-index: 999;
}
.msgmoreinfo.hover, .msg-txt:hover .msgmoreinfo{
display:block;
}
.btn-fill {
    width: 100%;
    height: 100%;
    background-color: #fff;
    color: #00a5f4;
    font-size: 12px;
    padding: 10px;
	 border: 0;
    padding: 0;
    margin: 0;
    outline: none;
    cursor: pointer;
}
.media-upload-controls{
    opacity: 1;
    transform: scale(1);
    position: absolute;
    margin: 0;
    padding: 0;
    bottom: 92px;
    right: 40px;
    z-index: 2;
    text-align: center;
}
.btn-media-send{
    padding: 10px;
    border-radius: 50%;
    border:0;
	background-color: #01a9e5;
    box-shadow: 0 1px 3px rgba(0,0,0,.4);
    -webkit-transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    transition: box-shadow .08s cubic-bezier(.4,0,.2,1);
    cursor: pointer;
}
.btn-media-send img{
max-height:30px;
max-width:30px;
}	


.reply-media-image {
    min-width: 100%;
    min-height: 100%;
    max-height: 90px;
    background-size: cover;
    background-position: center;
    border-top-right-radius: 6.5px;
    border-bottom-right-radius: 6.5px;
}
.chat-reply-media-image {
    width: auto;
    min-width: 55px;
    min-height: 55px;
    max-height: 90px;
    background-size: cover;
    background-position: center;
    border-top-right-radius: 6.5px;
    border-bottom-right-radius: 6.5px;
}
.cam-black{
max-height:15px;
max-width:15px;
}
.link-share-wrap {
    border-radius: 6px;
    margin: -3px -4px 5px -6px;
    overflow: hidden;
    cursor: pointer;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #e9ecec;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.link-share-img{
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 90px;
}
.link-share-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-height: 90px;
    padding: 6px 10px;
    line-height: 19px;
    box-sizing: border-box;
}
.link-share-title {
     -webkit-box-flex: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    color: #000;
    margin-bottom: 2px;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.link-share-desc {
    -ms-flex: 0 999 auto;
    flex: 0 999 auto;
    font-size: 12px;
    color: rgba(0,0,0,.6);
    -webkit-box-flex: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.link-share-src {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    font-size: 12px;
    color: rgba(0,0,0,.8);
    padding-top: 1px;
}
.reply-box .link-share-wrap{
margin: initial;
flex:1;
-ms-flex: 1;
}
.reply-box .link-share-img {
    width: 67px;
    height: 67px;
    min-height: 67px;
    min-width: 67px;
}
.reply-box .link-share-content {
    max-width: 60%;
    padding: 3px 3px 3px 8px;
}







/* 

 .bubble-audio .wrapper {
    min-height: 50px!important
}

 .bubble-audio .contents {
    margin-left: 64px
}

 .bubble-audio .quoted-msg {
    margin-bottom: 8px
}

 .bubble-audio .wrapper {
    min-height: 53px!important
}

 .bubble-audio .contents {
    margin-right: 64px
}

 .bubble-audio .message-meta {
    right: 80px
}

 .bubble-audio .quoted-msg {
    margin-bottom: 5px
}

.bubble-audio .preview {
    width: 60px;
    height: 60px
}

.audio {
    height: 34px
}

.audio-controls {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 12px
}

.audio-body {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.btn-audio {
    width: 34px;
    height: 34px;
    position: relative
}

.meta-audio {
    position: absolute
}

 .audio {
    margin-left: 8px;
    margin-right: 7px;
    padding-top: 8px
}

 .audio {
    margin-left: 7px;
    margin-right: 8px;
    padding-top: 11px
}

.meta-audio {
    color: #596351!important;
    font-size: 11.5px!important
}

.audio-status {
    width: 19px;
    height: 26px;
    position: absolute
}

.audio-track-container {
    position: relative;
    display: inline-block;
    width: 100%
}

.audio-track {
    height: 21px;
    width: 100%;
    box-sizing: border-box;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent!important;
    outline: none;
    border: none;
    position: relative
}

.audio-track::-webkit-slider-runnable-track {
    height: 3px
}

 .audio-track::-webkit-slider-runnable-track {
    background-color: #93999c
}

 .audio-track::-webkit-slider-runnable-track {
    background-color: #e6e6e6
}

.audio-track::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    margin-top: -5px;
    border-radius: 50%;
    background: #01a9e5;
    border: none;
    -webkit-transition: all .1s ease;
    transition: all .1s ease
}

.audio-track:active::-webkit-slider-thumb {
    width: 15px;
    height: 15px;
    margin-top: -6px
}

.audio-track:disabled::-webkit-slider-thumb {
    display: none
}

.audio-track::-moz-range-track {
    height: 3px
}

 .audio-track::-moz-range-track {
    background-color: #93999c
}

 .audio-track::-moz-range-track {
    background-color: #e6e6e6
}

.audio-track::-moz-range-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    margin-top: -5px;
    border-radius: 50%;
    background: #01a9e5;
    border: none;
    transition: all .1s ease
}

.audio-track::-moz-focus-outer {
    border: 0
}

.audio-track:active::-moz-range-thumb {
    width: 15px;
    height: 15px;
    margin-top: -6px
}

.audio-track:disabled::-moz-range-thumb {
    display: none
}

.audio-track::-ms-track {
    height: 3px;
    border: none
}

 .audio-track::-ms-track {
    background-color: #93999c
}

 .audio-track::-ms-track {
    background-color: #e6e6e6
}

.audio-track::-ms-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    margin-top: 0;
    border-radius: 50%;
    background: #01a9e5
}

.audio-track:active::-ms-thumb {
    width: 15px;
    height: 15px;
    margin-top: -1px
}

.audio-track:disabled::-ms-thumb {
    display: none
}

.audio-progress {
    position: absolute;
    left: 0;
    top: 9px;
    height: 3px;
    width: 0;
    background-color: #01a9e5;
    pointer-events: none;
    z-index: 10
}

.btn-audio .spinner-container,
.btn-audio .progress-container {
    position: absolute;
    top: -2px;
    left: -2px
}

.btn-audio .spinner-container .path {
    stroke: #888e92
}

.btn-audio .progress-container .path {
    stroke: #29b6f6
}

.btn-audio-cancel-noborder:before {
    content: '';
    position: absolute;
    width: 32px;
    height: 32px;
    top: -1px;
    left: -1px;
    border: 2px solid rgba(0, 0, 0, .1);
    border-radius: 50%
}

 .audio-state-default .audio-progress {
    background-color: #849982!important
}

 .audio-state-default .audio-track::-webkit-slider-thumb {
    background-color: #849982!important
}

 .audio-state-default .audio-track::-moz-range-thumb {
    background-color: #849982!important
}

 .audio-state-played .audio-progress {
    background-color: #29b6f6!important
}

 .audio-state-played .audio-track::-webkit-slider-thumb {
    background-color: #29b6f6!important
}

 .audio-state-played .audio-track::-moz-range-thumb {
    background-color: #29b6f6!important
}

 .audio-status {
    left: 54px;
    bottom: 3px
}

 .bubble-attach .meta-audio {
    bottom: 2px!important;
    left: 125px!important;
    right: auto
}

 .audio-state-default .audio-progress {
    background-color: #09d261!important
}

 .audio-state-default .audio-track::-webkit-slider-thumb {
    background-color: #09d261!important
}

 .audio-state-default .audio-track::-moz-range-thumb {
    background-color: #09d261!important
}

 .audio-state-played .audio-progress {
    background-color: #29b6f6!important
}

 .audio-state-played .audio-track::-webkit-slider-thumb {
    background-color: #29b6f6!important
}

 .audio-state-played .audio-track::-moz-range-thumb {
    background-color: #29b6f6!important
}

 .audio-status {
    right: 54px;
    bottom: 3px
}

 .bubble-attach .meta-audio {
    bottom: 2px!important;
    right: 247px!important;
    left: auto
}

  .bubble-audio .preview {
    width: 70px;
    height: 70px;
    top: 3px!important
}

  .bubble-audio .quoted-msg-bubble-ptt {
    top: auto!important
}

  .bubble-audio .wrapper {
    min-height: 63px!important
}

  .bubble-audio .message-author {
    position: absolute;
    top: 0;
    left: 0;
    border: none;
    width: 100%
}

  .bubble-audio .quoted-msg-bubble-ptt-author {
    position: relative
}

  .bubble-audio .wrapper>.contents {
    margin-right: 74px;
    position: relative
}

  .bubble-audio .message-meta {
    right: 90px
}

  .bubble-audio .audio-status {
    right: 64px
}

  .bubble-audio .audio {
    padding-top: 21px
}
 */
 .bubble-attach {
    padding-top: 8px;
    min-height: 0;
    box-sizing: border-box;
    width: 336px;
    padding: 6px 0 8px 0;
    padding-left: 9px;
    padding-right: 7px;
	position: relative;
	background:#ffffff;
}
.bubble-audio .wrapper {
    min-height: 51px !important;
}
.bubble-audio .preview {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    top: 6px;
    left: 6px;
    right: auto;
    position: absolute;
    -webkit-flex: none;
    background-size: cover;
}
.preview-image {
    background-size: contain;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.bubble-attach .meta-audio {
    bottom: 2px !important;
    left: 118px !important;
    right: auto;
    color: #596351 !important;
    font-size: 11.5px !important;
    position: absolute;
}
 .audio-status {
    left: 53px;
    bottom: 5px;
    width: 19px;
    height: 26px;
    position: absolute;
    z-index: 100;
    background-image: url("svg.svg");
	 background-position: -3136px -3155px;
    background-size: 4390px 4427px;
}
.bubble-audio .contents {
    margin-left: 60px;
}
 .bubble-audio .audio {
    margin-left: 8px;
    margin-right: 7px;
    padding-top: 8px;
    height: 34px;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}
.bubble-audio .audio-controls {
    -webkit-flex: none;
    flex: none;
    margin-right: 12px;
}
.btn-audio {
    width: 34px;
    height: 34px;
    position: relative;
    background-image: url("svg.svg");
}
.icon-audio-play {
    background-position: -490px -490px;
     background-size: 4390px 4427px; 
}
.icon-audio-pause {
    background-position: -455px -455px;
     background-size: 4390px 4427px; 
}
button {
    border: 0;
    padding: 0;
    margin: 0;
    background: none;
    outline: none;
    cursor: pointer;
    font-family: inherit;
}
.audio-body {
    -webkit-flex: 1;
    flex: 1;
}
.audio-track-container {
    position: relative;
    display: inline-block;
    width: 100%;
}
.audio-progress {
    position: absolute;
    left: 0px;
    top: 9px;
    height: 3px;
    width: 0px;
    background-color: #01a9e5;
    pointer-events: none;
    z-index: 10;
}
 .audio-state-default .audio-progress {
    background-color: #849982 !important;
}
.audio-track {
    height: 21px;
    width: 100%;
    box-sizing: border-box;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent !important;
    outline: none;
    border: none;
    position: relative;
}
.audio-state-default .audio-progress {
    background-color: #01a9e5 !important
}
/* .audio-state-default .audio-progress {
    background-color: #16FC00!important
} */
input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #01a9e5;
    border: none;
    -webkit-transition: all .1s ease;
    transition: all .1s ease;
    margin-top:-5px;	
	z-index:9999;
}

input[type=range]:active::-webkit-slider-thumb {
    width: 15px;
    height: 15px;
	margin-top:-5px;
	z-index:9999;
}

input[type=range]:disabled::-webkit-slider-thumb {
    display: none;
	margin-top:-5px;
	z-index:9999;
}
input[type=range]::-ms-track {
    background-color: #93999c;
	height: 3px;
}
input[type=range]::-webkit-slider-runnable-track {
    background-color: #93999c;
	height: 3px;
}

/**--Document attach--**/
.document-container {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    width: 250px;
    margin: -3px 0 14px 0;
    margin-left: -6px;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    box-sizing: border-box;
    border: 1px solid rgba(75,89,97,0.1);
}
.document-body {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 19px;
    padding-right: 19px;
    min-height: 34px;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
	font-size: 13.6px;
    line-height: 19px;
    font-family: 'Open Sans', sans-serif;
    word-wrap: break-word;
    color: #262626;
	background: #fff;
}
.document-icon {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-top: -1px;
}
.icon-doc {
    width: 26px;
    height: 30px;
    background-repeat: no-repeat;
    background-size: contain;
}
.icon-doc-pdf{
    background-image: url(../images/pdf.png);
}
.icon-doc-txt{
    background-image: url(../images/txt.png);
}
.icon-doc-plain{
    background-image: url(../images/plain.png);
}
.document-text {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: 0 10px;
    overflow: hidden;
    top: -2px;
    position: relative;
}
.document-text .ellipsify, .document-text .starred-title-main {
    display: block;
}
.doc-state {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    position: relative;
    -webkit-flex: none;
    flex: none;
    width: 34px;
    height: 34px;
}
.doc-state-icon {
    width: 34px;
    height: 34px;
}
.document-meta {
    position: absolute;
    bottom: 3px;
    left: 8px;
    right: auto;
    font-size: 11px;
    height: 15px;
    line-height: 15px;
    color: rgba(0,0,0,0.45);
}
.msg-screen  .chat-doc.msg-txt::after{
content:"" !important;
}

/**--contact-card--**/

.msg-screen  .chat-contact-card.msg-txt::after{
content:"" !important;
}
.chat-contact-card .msg-time-wrap {
    
    top: 60px;
    right: 5px;
    color: #434343 !important;
    z-index: 999;
}
.bubble-vcard {
    box-sizing: border-box;
    width: 336px;
    padding-top: 6px;
	background: #fff;
}
.wrapper-vcard {
    min-height: unset !important;
    position: relative;
    padding-left: 8px;
    padding-right: 8px;
}
.vcard {
    height: 60px;
    cursor: pointer;
	    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}
.vcard-avatar {
    margin-right: 15px;
    -webkit-flex: none;
    flex: none;
    height: 49px;
    width: 49px;
}
.avatar {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    border-radius: 50%;
    overflow: hidden;
}
.avatar-body {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.avatar-image.is-loaded {
    opacity: 1;
}
.avatar-image {
    border-radius: 50%;
    overflow: hidden;
    width: 100%;
    opacity: 0;
    transition: opacity .18s ease-out;
    display: block;
}
.vcard-body {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    overflow: hidden;
}
.vcard-name-single {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.vcard-name {
    font-size: 14px;
    line-height: 22px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #262626;
}
.selectable-text {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}
.bubble-actions {
    border-top: 1px solid #f2f2f2;
    width: 100%;
    margin-top: 8px;
    border-top: 1px solid rgba(0,0,0,0.1);
	display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}
.bubble-btn {
    -webkit-flex: 1;
    flex: 1;
    padding: 10px 14px 4px 14px;
    text-align: center;
    cursor: pointer;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color: #00a5f4;
}
.bubble-vcard .message-meta {
    top: 56px;
    bottom: unset;
    right: 7px;
    left: unset;
}



 
  
  md-progress-circular.md-default-theme .md-inner .md-left .md-half-circle, md-progress-circular .md-inner .md-left .md-half-circle {
    border-left-color: rgb(1, 169, 229);
}
md-progress-circular.md-default-theme .md-inner .md-left .md-half-circle, md-progress-circular .md-inner .md-left .md-half-circle, md-progress-circular.md-default-theme .md-inner .md-right .md-half-circle, md-progress-circular .md-inner .md-right .md-half-circle {
    border-top-color: rgb(1, 169, 229);
}
md-progress-circular.md-default-theme .md-inner .md-right .md-half-circle, md-progress-circular .md-inner .md-right .md-half-circle {
    border-right-color: rgb(1, 169, 229);
}
md-progress-circular.md-default-theme .md-inner .md-left .md-half-circle, md-progress-circular .md-inner .md-left .md-half-circle, md-progress-circular.md-default-theme .md-inner .md-right .md-half-circle, md-progress-circular .md-inner .md-right .md-half-circle {
    border-top-color: rgb(1, 169, 229);
}
.profile-detail-img-wrap .change-profile-pic{
font-size:15px;
color:#fff;
text-align:center;
background:rgba(0, 0, 0, 0.45);
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
display:none;
}
.profile-detail-img-wrap:hover .change-profile-pic{
display: -webkit-flex;
    display: flex;
	flex-direction:column;
	-webkit-flex-direction:column;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}	
.profile-detail-img-wrap .change-profile-pic img{
max-height: 30px !important;
    max-width: 30px !important;
    min-width: initial !important;
    min-height: initial !important;
    margin-bottom: 10px !important;
}
.profile-detail-img-wrap{
position:relative;
min-width: 200px;
    max-width: 200px;
    min-height: 200px;
    max-height: 200px;
    margin-bottom: 35px;
    display: block;
    margin-right: auto;
    margin-left: auto;
    border-radius: 50%;
	overflow:hidden;
}
.profile-detail-img-wrap.active::after{
    content: "";
    background: rgba(255, 255, 255, 0.75);
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
    border-radius: 50%;
}	
.profile-detail-img-wrap .pro-pic-loader{
position:absolute;
top:30%;
left:0;
right:0;
margin:0 auto;
}

.msg-sync-loader-container.top{
position:fixed;
top:10vh;
left:0;
right:0;
z-index:9999;
}
.msg-sync-loader-container.bottom{
position:fixed;
bottom:10vh;
left:0;
right:0;
z-index:9999;
}
.msg-sync-loader{
margin:10px auto;
background:#fff !important;
width:30px;
height:30px;
border-radius:50%;
}
.full-scr-preloader-wrap{
position:absolute;
top:0;
left:0;
right:0;
height:100%;
}
.full-scr-preloader-wrap-inner{
display: -webkit-flex;
display: flex;
justify-content: center;
align-items: center;
width:100%;
height:100%;  
background:#f6f6f6;
}

.site-icon-holder{
    /* padding-top: 2px!important; */
	padding-top: 9px!important;
	cursor:pointer;
}
.site-icon-holder svg image{
width: 28px ;
height: 34px ;
}

.panel-arrow-back{
padding-top: 0px!important;
}

.panel-arrow-back svg image{
width: 24px ;
height: 24px ;
}
.closebtn{
    display: block;
    float: left;
    width: 28px;
    height: 28px;
    text-align: center;
    opacity: 1 !important;
	margin-right:15px;
}



/**tab**/
.gallery-tab-wrap{
overflow:initial !important;
}
.gallery-tab md-pagination-wrapper{
width:100% !important;
background: #009dd6;
}
.gallery-tab md-pagination-wrapper md-tab-item{
width:33.333% !important;
padding:10px 5px !important;
color:#fff !important;
}
md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-bar {
    color: rgb(255, 255, 255);
    background: rgb(255, 255, 255);
}
.gallery-tab md-content{
background:transparent!important;
max-height:553px;
overflow:auto !important;
}
.docs-tab .starred-msg-wrap .msg-screen .datetodisplay .msg-txt{
width:100%;
}
.docs-tab .starred-msg-wrap .msg-screen .datetodisplay .msg-txt .document-container{
width: calc(100% + 10px) !important;
margin-left:-6px !important;
}
.docs-tab .starred-msg-wrap{
float:left;
width:100%;
}
.docs-tab .starred-msg-wrap:first-of-type::before{
display:none;
}
.media-tab .media-gallery{
 padding:20px ;
 margin-bottom: 0px;
 float: left;
    width: 100%;
}
.media-gallery md-checkbox .md-icon{
background:rgba(255,255,255,0.7);
}
.media-gallery md-checkbox.md-checked .md-icon{
    background-color: rgb(1, 169, 229);
	}
	
.docs-tab .msg-wrap md-checkbox{
    position: absolute;
    left: 0;
    top: 35px;
}	
.gallery-tab{
flex:1;
}
.gallery-tab .starred-msg-wrap md-checkbox ,.media-tab .starred-msg-wrap md-checkbox,.media-tab .gallery-img-wrapper  md-checkbox{
display:none;
z-index:9999;
}
.gallery-tab .starred-msg-wrap md-checkbox .md-container,.media-tab .starred-msg-wrap md-checkbox .md-container,.media-tab .gallery-img-wrapper  md-checkbox .md-container{
left: 6px !important;
    top: calc(50% + 1px) !important;
}
.gallery-tab .starred-msg-wrap:hover md-checkbox , .gallery-tab .starred-msg-wrap.checkbox-active md-checkbox ,.media-tab .gallery-img-wrapper:hover md-checkbox,.media-tab .gallery-img-wrapper.checkbox-active md-checkbox{
display:block;
}
.gallery-tab .starred-msg-wrap:hover{
background:#ebebeb;
}

.modal-gallery-wrap{
display:flex !important;
}
.modal-gallery-wrap .media-upload-nav,.modal-gallery-wrap .media-upload-pane, .modal-gallery-wrap .media-upload-detail-wrap{
background-color: transparent !important;
}
.modal-gallery-wrap .media-upload-pane{
}
.modal-gallery-wrap::before,.modal-gallery-wrap::after{
display:none !important;
}
.modal-gallery-wrap-inner{
flex:1;
}
.modal-gallery-wrap-inner .media-upload-container {
    height:100%;
    top: 0;
	background-color: rgba(255,255,255,.95) !important;
}
.modal-gallery-wrap-inner .media-multi{
    height: 90px;
	border-top:1px solid #d2d2d2;
	background:transparent;
}
.modal-gallery-wrap-inner .media-multi .media-thumb{
     -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 5%;
    max-width: 70px;
    min-width: 50px;
    max-height: 70px;
}
.modal-gallery-wrap-inner .media-multi .media-thumb-content img{
min-height: 70px;
    max-height: 70px;
}

.modal-gallery-wrap-inner .media-upload-controls.prev-btn{
top:38%;
bottom: initial;
left: 40px;
right:initial;
}
.modal-gallery-wrap-inner .media-upload-controls.next-btn{
top:38%;
bottom: initial;
right: 40px;
}
.media-upload-title .chat-details{
    flex:1;
	display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    color:#000;
}
.media-upload-title .profile-image{
    cursor: pointer;
    cursor: hand;
    min-height: 37px !important;
    max-height: 37px !important;
    min-width: 37px !important;
    max-width: 37px !important;
    border-radius: 50% !important;
}
.media-upload-title .chat-details-inner{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
	margin-left: 15px;
}
.media-upload-title .chat-details-inner .chat-name{
font-weight:600;
}
.modal-gallery-wrap-inner .media-upload-nav {
    height: 60px;
    padding: 9px 24px;
}	
.modal-gallery-wrap-inner .media-upload-menu{
display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: center;
    justify-content: center;
}
.modal-gallery-wrap-inner .media-upload-menu ul{
margin-bottom:0;
padding-top: 6px;
}
.modal-gallery-wrap-inner .media-upload-menu ul li{
margin-left: 20px;
}
.modal-gallery-wrap-inner .media-upload-menu ul .site-icon-holder{
display:block;
}
.modal-gallery-wrap-inner .media-upload-menu ul .site-icon-holder img{
width:25px;
height:25px;
}
.media-thumb2.empty-fill{
cursor:default;
min-width:50% !important;
min-height:1px;
}
.media-thumb.empty-fill2{
cursor:default;
}
.modal-gallery-wrap-inner .element-scaledown>div{
/* min-width:700px;
max-width:700px; */
height:auto;
}
.modal-gallery-wrap-inner .media-img-viewer{
   /*  -webkit-transform-origin: inherit;
    transform-origin: inherit; */
	cursor: -webkit-zoom-in;
    cursor: zoom-in;
}
.modal-gallery-wrap-inner .media-multi{
overflow-x:scroll;
margin-bottom:5px;
justify-content: initial !important;
}	
.media-info-loader-wrap{
position:absolute;
top:0;
left:0;
bottom:0;
right:0;
display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: center;
    justify-content: center;
	align-items: center;
}
.docs-tab-loader{
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	width:100%;
}
.zoom-in-active .element-fit{
overflow:visible !important;
}
.zoom-in-active .media-multi-wrap{
visibility:hidden;
}
.zoom-in-active .media-upload-nav{
visibility:hidden;
}
.zoom-in-active .media-upload-controls{
visibility:hidden;
}
.scroll-new-text-count-wrap{
position:relative;
width:100%;
height:100%;
}
.scroll-new-text-count-wrap .scroll-new-text-count{
    display:inline-block;
	width:auto;
	min-width: 20px;
    height: 20px;
    background: #01a9e5;
    color: #fff;
    position: absolute;
    top: -5px;
    left: -5px;
    font-size: 12px;
    line-height: 0;
    border-radius: 50%;
	line-height: 12px;
    padding-top: 4px;
	padding-bottom:0;
}
.scroll-new-text-count-wrap{
text-align:center;
}
.icon-dim{
opacity:0.5 !important;
}
.select-disabled{
opacity:0.5;
cursor:default;
}
.select-disabled a{
cursor:default;
}
md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused md-icon, md-input-container:not(.md-input-invalid).md-input-focused md-icon {
    color: #009dd6;
}
md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused .md-input, md-input-container:not(.md-input-invalid).md-input-focused .md-input {
    border-color: #009dd6;
}
md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused label, md-input-container:not(.md-input-invalid).md-input-focused label {
    color: #009dd6;
}
md-toast {
    min-width: initial!important;
}
md-toast .md-toast-content{
border-radius: 7px !important;
}

.toast-holder{
position:fixed;
left:0;
bottom:0;
z-index: 9999;
display: flex;
    flex-direction: column;
    justify-content: flex-end;
width:initial;	
}
md-toast {
position: relative !important;
bottom:initial!important;
top:initial!important;
left:initial!important;
right:initial!important;
display: inline-flex;
transition:all ease 5s;
}

md-toast .md-button{
max-width:initial!important;
max-height:initial!important;
min-width:40px !important;
min-height:40px !important;
}
md-toast .md-toast-content .md-toast-text{
padding-left:12px !important;
padding-right:12px !important;
}
md-toast .md-toast-content .toast-undo{
color:#f0ff01!important;
}
md-toast .md-toast-content{
padding-left:0 !important;
padding-right:0 !important;
}
.toaster-animate-wrap.active{
position: relative !important;
display:block;
height:48px;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.toaster-animate-wrap{
height:0px;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}



.incognito-timer-count{
border-radius: 50%;
    text-align: center;
    background: #fff;
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 20px;
    height: 20px;
    line-height: 21px;
    font-size: 9px;
    color: #000;
}
.incognito-chat .media-left{
position:relative;
}
.incognito-active{
display:none;
}
.incognito-chat .media-left .incognito-active{
    display: block;
    background-color: rgba(0, 0, 0, 0.40);
    position: absolute;
    /*top: 0;
    left: 0;*/
    padding: 10px;
    
}

.incognito-timer-container{
    margin-right: -13.5%;
    margin-left: -13%;
}
.col-2-shrink .incognito-timer-container {
    margin-right: -15%;
    margin-left: -14.5%;
}
.incognito-timer-msg{
    display: block;
    width: 100%;
    float: left;
    margin:10px auto;
	text-align:center;
    padding:10px 0px;
	background:rgba(255,255,255,0.75);
	-webkit-box-shadow: 0px 0px 17px -2px rgba(150,150,150,1);
	-moz-box-shadow: 0px 0px 17px -2px rgba(150,150,150,1);
	box-shadow: 0px 0px 17px -2px rgba(150,150,150,1);
	}
.incognito-timer-msg p{
background:transparent;
color:#767676;
border-radius:25px;
padding: 6px 25px 8px;
display:inline-block;
margin:0;
}	


/**recovery mail**/
.recovery-mail .page-title{
background:#f5f5f5;
padding:20px 0;
}
.recovery-mail .page-title h4{
margin:0;
color:#01a9e5;
font-size: 20px;
}
.recovery-mail .page-content{
background:#fff;
padding:25px 0;
min-height:450px;
}
.recovery-mail .page-content p{
    font-size: 16px;
	margin-bottom:35px;
}
.recovery-mail .page-content .email-card {
padding:20px 15px;
background:#fff;
    display: block;
    float: left;
    width: 100%;   
	box-shadow: 0 2px 5px 1px rgba(0,0,0,0.26);

}
.recovery-mail .page-content .email-card .email-holder{
display:inline-block;
width:calc(100% - 34px);
float: left;
}
.recovery-mail .page-content .email-card .option-holder{
width:34px;
height:34px;
float: left;
display:inline-block;
padding-top:7px;
opacity:0.7;
}
.recovery-mail .page-content .email-card .option-holder a{
display:none;
opacity:0.7 !important;
}	
.recovery-mail .page-content .email-card .option-holder a.active{
display:block;
}	
.recovery-mail .page-content .email-card .email-holder .form-control{
border:1px solid transparent;
box-shadow:none;
outline:0!important;
font-size: 18px;
background:#fff !important;
}
.recovery-mail-popup .modal-body{
padding: 0 25px;
}
.recovery-mail-popup .form-control{
border:1px solid transparent;
border-bottom:1px solid #ddd;
box-shadow:none;
outline:0!important;
font-size: 18px;
margin-top:35px;
margin-bottom:20px;
padding-left:0;
background:#fff !important;
}
.recovery-mail-popup .form-control:active,.recovery-mail-popup .form-control:focus{
border-bottom:2px solid #01a9e5;
}
.recovery-mail-popup .modal-header {
    background: #01a9e5;
    color: #fff;
}	
#myModal{
    z-index: 9999;
}

.update-email-settings-popup .modal-header{
  background: #01a9e5;
}
.update-email-settings-popup .modal-header .modal-title{
    color: #fff !important;
}
.update-email-settings-popup .modal-body{
padding:25px;
}
.update-email-settings-popup .modal-body input[readonly="readonly"]{
  max-width:100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
 } 
.update-email-settings-popup .modal-body md-input-container{
 margin:25px auto 5px;
 }
 .update-email-settings-popup .modal-body md-input-container md-icon{
 opacity:0.5;
 }
 .update-email-settings-popup .modal-body p{
 margin-bottom:0;
 font-size:12px;
 text-align:left;
 }
 .mute-options{
 margin-top:20px;
 float:left;
 width:100%;
 padding:0;
 list-style-type:none;
 }
 .mute-options li{
 margin-bottom:10px;
 }
 .mute-options li input{
 margin-right:5px;
 }
 
 .email-settings-wrap {
    padding: 30px !important;
}
.email-settings-wrap md-input-container.md-icon-left {
    padding-left: 36px;
    padding-right: 0;
}
.email-settings-wrap md-input-container.change-user-credential {
text-align:center;
}
.email-settings-wrap md-input-container.change-user-credential a{
    color: #fff;
    background-color: #009dd6;
    display: inline-block;
    padding: 10px 25px;
    margin: 15px 0 20px -36px;
    font-size: 14px;
    border-radius: 3px;
}
.email-settings-wrap md-input-container label:not(.md-container-ignore) {
left:unset !important;
}
.email-settings-wrap p{
padding-bottom:10px;
}
input:-webkit-autofill{
background:transparent !important;
}



/**emoji**/
.emoji-positioning-container {
    position: absolute;
    top: 0;
    width: 100%;
	/* display:none; */
    }
.emoji-positioning-container.active{
/* display:block; */
}
.emoji-overlay-container {
    position: absolute;
    bottom: 100%;
    width: 100%;
    box-sizing: border-box;
	 transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
	 -webkit-transform: translateY(150%);
    -moz-transform: translateY(150%);
    -ms-transform: translateY(150%);
    -o-transform: translateY(150%);
    transform: translateY(150%);
}
.emoji-wrap {
    margin: 0;
    width: 100%;
    float: left;
    box-shadow: none;
    background-color: #ecf9fd;
    
	}
/* .emoji-positioning-container.active  .emoji-wrap{   	
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);	
	} */
	.emoji-positioning-container.active  .emoji-overlay-container{   	
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);	
	 transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
	}
	
	
	
	.emoji-head {
    background: #fff;
    float: left;
    width: 100%;
    position: relative;
    display: block;
	z-index: 15;
    }
	.emoji-menu {
	text-align:center;
	float: left;
    width: 100%;
	margin:0;
	}
	.emoji-menu li{
	width:10%;
	text-align:center;
    float:left;
	padding: 0;
	}
	.emoji-menu li a{
	display:block;
    padding: 15px 0;
	border-bottom: 4px solid transparent;
	}
	.emoji-menu li a.active{
	    border-bottom: 4px solid #01a9e5;
	}	
	.emoji-menu img{
	max-height:20px;
	margin:0 auto;
	}
	.emoji-body-wrap{
	position: relative;
	float: left;
	overflow: hidden;
	}
	.emoji-body{
	background-color: #f0f0f0;
	overflow-y: scroll;
    height: 270px;
    position: relative;
    padding-top: 50px;
	float: left;
    width: 100%;
	}
	.emoji-body-inner{
	float: left;
    width: 100%;	
	}
	.emoji-search-wrap{
	border-bottom: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 0 5px rgba(0,0,0,0.05);
	position: absolute;
    top: 0;
    left: 0;
    right: 0px;
    padding: 6px 12px;
    background-color: #f0f0f0;
	z-index: 9;
	}
	.emoji-search-wrap.is-hidden {
  opacity: 0;
  -webkit-transform: translate(0, -60px);
  -webkit-transition: -webkit-transform .4s , opacity 0.4s;
	}
	.emoji-search-wrap.is-visible {
	  opacity: 1;
	  -webkit-transform: translate(0, 0);
	  -webkit-transition: -webkit-transform .4s, opacity .4s;
	}
	.emoji-search-wrap .form-control{   
	height: auto;
    padding: 8px 12px;
    font-size: 16px;
	background-color: #dcdcdc;
	color:#2e2e2e;
	border:none !important;
	box-shadow:none !important;
	outline:none !important;
	}
	.emoji-icons-wrap{
	 float: left;
     width: 100%;
	 padding:10px 15px;
	 }
	.emoji-icons-wrap .emoji-category{
	 float: left;
     width: 100%;
	}
	.emoji-icons-wrap .emoji-icons{
	float: left;
    width: 100%;
    display: block;    
	}
	.emoji-icons-wrap .emoji-icons a{
	margin: 6px 6.5px;
    cursor: pointer;
    border-radius: 3px;
	display: block;
    float: left;
	}
	.emoji-icons-wrap .emoji-icons .emoji img{
	max-width:32px;
	}
	
	.emoji-input,
	.emoji-collection{
		display: inline-block;
		vertical-align: top;
		zoom: 1;
		border: 0
	}
	.emoji-input {
		    width: 20px !important;
    height: 20px !important;
    max-width: inherit !important;
    min-width: inherit !important;
    min-height: inherit !important;
    max-height: inherit !important;
	}
	.emoji-collection {
		width: 32px;
		height: 32px
	}
	.emoji-search-wrap-outer{
	position:fixed;top: 0px;
    left: 0;
    width: 100%;
    height:100%;
    padding-top:54px;	
    background: #f0f0f0;
	}
	.emoji-search-wrap-outer .emoji-search-wrap{ 
	position:relative;
	z-index:9999;
	}
	.emoji-search-wrap-outer .emoji-icons-wrap{	
	 overflow-y: scroll;
    height: 220px;
	}
	
	.hieght-filler-emoji.active{
	height: 322px;
    transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .2s;
    transition: all .2s;
	}
	
	.msg-screen .big-emoji-txt .msg-txt::after{
	content:"";
	display:none;
	}
	
	.msg-screen .big-emoji-txt .msg-txt .message-txt-wrap{
	padding-top: 5px;
    padding-right: 35px;
    padding-bottom: 15px;
    display: block;
	}
	.msg-screen .big-emoji-txt.one-emoji .message-txt .emoji-input{
	width: 50px !important;
    height: 50px !important;
	background-image:none !important;
	}
    .msg-screen .big-emoji-txt.two-emoji .message-txt .emoji-input{
	width: 38px !important;
    height: 38px !important;
	background-image:none !important;
	}	
	.msg-screen .big-emoji-txt.three-emoji .message-txt .emoji-input{
	width: 30px;
    height: 30px;
	background-image:none !important;
	}	
	#myList1{
	overflow:hidden;
	padding: 5px 0 20px;
	}
	#myList1.active p{
	 -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);	
	 transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all 1s;
    transition: all 1s;
	}
	#myList1 p{
	 -webkit-transform: translateY(-250%);
    -moz-transform: translateY(-250%);
    -ms-transform: translateY(-250%);
    -o-transform: translateY(-250%);
    transform: translateY(-250%);	
	 transition-timing-function: cubic-bezier(.02,.09,0,1);
    -webkit-transition: all .5s;
    transition: all .5s;
	}
	
	
	
	
	.emoji-collection.smiley{
		background-image: url(../images/emoji/category/smileys_and_people.png);
	}
	.emoji-collection.animals{
		background-image: url(../images/emoji/category/animals_and_nature.png);
	}
	.emoji-collection.food{
		background-image: url(../images/emoji/category/food_and_drinks.png);
	}
	.emoji-collection.activity{
		background-image: url(../images/emoji/category/activity.png);
	}
	.emoji-collection.travel{
		background-image: url(../images/emoji/category/travel_and_places.png);
	}
	.emoji-collection.objects{
		background-image: url(../images/emoji/category/objects.png);
	}
	.emoji-collection.symbols{
		background-image: url(../images/emoji/category/symbols.png);
	}
	.emoji-collection.flags{
		background-image: url(../images/emoji/category/flags.png);
	}
	
	
	
	/**New app Login**/

.app-logo{
float:left;
width:100%;
margin:50px auto 35px ;
}
.app-logo img{
max-width:100%;
margin:0;
height:auto;
max-height: 130px;
}
.app-login-back{
    position: absolute;
    top: -20px;
    left: 20px;
    font-size: 17px;
	padding: 5px;
	color:#2e394b !important;	
}
.app-user-avatar{
float:left;
width:100%;
margin:40px auto 30px;
    position: relative;
}
.app-user-avatar.mail-active{
margin-bottom:10px;
}
.app-user-avatar img{
max-width:100%;
margin:0;
height:auto;
max-height: 85px;
border-radius:50%;
}
.app-user-name{
font-weight:bold;
margin-bottom:5px;
float: left;
    width: 100%;
}
.app-user-mail{
font-size:13px;
margin-bottom:15px;
float: left;
    width: 100%;
}
.app-login-wrap a{
color:#2e394b;
opacity:1!important;
}
.app-login-wrap a:hover,.app-login-back:hover{
color:#01aae5 !important;
}
.app-login-wrap{
    height: 100%;
    width: 100%;
    position: fixed;
    background:#fff;
	}
.app-login-outer-wrap{
position:relative;
width:100%;
height:100%;
overflow:auto;
z-index: 9;
}
.app-login-inner-wrap{
position: absolute;
    z-index: 9;
    margin: 0 auto;
    width: 320px;
    left: 0;
    right: 0;
    top: 0;	
    text-align: center;
	color:#2e394b!important;
}

.app-login-content{
	background: #f7f7f7;
	float:left;
	width:100%;	
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}

.app-login-form{
float:left;
width:100%;
text-align:center;
color:#2e394b!important;
}
.app-login-form .app-username,.app-login-form .app-password{
    max-width: 280px;
    margin: 0 auto 15px;
	padding-left:45px;
    border-bottom: 1px solid #929292;
	    position: relative;
}	
.app-login-form .app-username img,.app-login-form .app-password img{
   position: absolute;
    left: 0;
    right: 0;
    top: 0px;
    width: 30px;
}
.app-login-form .app-username input,.app-login-form .app-password input{
width:100%;
background:transparent!important;
border:none;
min-height:35px;
color: #2e394b;
padding:0;
font-size: 15px;
}
.app-login-form-footer{
float:left;
width:100%;
padding:20px 0;
text-align:center;
background: #fff;
margin-top:15px;
}
.app-login-form-footer p{
margin-bottom:0;
}
.app-login-form .login_btn{
    margin: 0px auto 20px;
    display: block;
    font-size: 18px;
    background: #01aae5;
    color: #fff;
    border-radius: 25px;
    border: none;
    padding: 6px 50px;
	float: none;
	transition:all linear 0.2s
}
.app-login-form .login_btn:hover{
background: #2e394b;
    color: #fff;
	padding: 6px 40px;
	transition:all linear 0.5s
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
	-webkit-text-fill-color: #2e394b !important;
	color: #2e394b !important;
}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
color: #2e394b !important;
}





@media(max-width:767px){

.app-login-inner-wrap{
top:0;
margin:25% auto;
}
.app-login-inner-wrap{
max-width:250px;
}
.faq-bg .container{
	padding: 20px 30px;
}
.faq-inner .faq-inner-content {
    padding: 0;
}
.faq-inner-wrap .faq-inner .container {
    background: #fff;
    padding: 0px 30px;
}


}


.settings-panel .contact-block .media-body h4,.help-panel .contact-block .media-body h4{
color:#444444;
}

.settings-panel .contact-block{
background: #ffffff;
}


/**new 8-6-17**/
.emoji-input-wrap{
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
-webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    word-wrap: break-word;
    line-height: 23px;
    padding-bottom: 5px;
    border-bottom: 2px solid transparent;
}
.emoji-input-wrap.active{
    border-bottom: 2px solid #424561;
   } 
.emoji-input-box{
    -webkit-flex: 1;
    flex: 1;
    display: -webkit-flex;
    display: flex;
    padding-right: 5px;
    position: relative;
}
.emoji-input-box .input {
    word-wrap: break-word;
    white-space: pre-wrap;
    padding: 0 2px 0 0;
    min-height: 20px;
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: rgba(255,255,255,0);
    border-left: .1px solid transparent;
    position: relative;
    z-index: 1;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    line-height: 20px;
    font-size: 15px;
    border: none;
    width: 100%;
    outline: none;
}

.emoji-input-box-controls {
    -webkit-flex: none;
    flex: none;
    position: relative;
        margin-top: -3px;
}
.emoji-input-box-controls .name-box-btns {
    display: block;    
}
.emoji-input-box-controls .name-box-btns span,.emoji-input-box-controls .name-box-btns img{
    min-width: 20px;
    max-width: 20px;
    min-height: 20px;
    max-height: 20px;
    margin-bottom: 0px;
    text-align: center;    
    display: inline-block;
    opacity: 0.7;
    float: left;
    font-size: 20px;
   } 
   
   .emojidropdown{
   position:fixed;
   width:400px;
   height:320px;
   z-index:10005 !important;
   display:none;
   transform-origin: left bottom 0px;
    transform: scale(1);
	box-shadow: 0px 0px 15px 0 rgba(0, 0, 0, 0.24);
	border-radius: 4px;
   }
   .emojidropdown::after{
   content: "";
    width: 15px;
    height: 15px;
    bottom: -7.5px;
    left: 15px;
    position: absolute;
    display: block;
    transform: rotate(45deg);
    background: #f0f0f0;
    z-index: -1;
	box-shadow: 0px 0px 15px 0 rgba(0, 0, 0, 0.24);
   }
   .emojidropdown-inner{
   position:relative;
   width:100%;
   height:100%;
   }
  .emojidropdown  .emoji-positioning-container.active  .emoji-overlay-container{
     -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
   }
   .emojidropdown .emoji-wrap{
   -webkit-transform: translateZ(0);
    transform: translateZ(0);
    height: 320px;
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    overflow: hidden;	
	border-radius: 4px;
	}
   .user-name-wrap .emoji-input,.user-status-wrap .emoji-input,.group-subj .emoji-input,.group-name-wrap .emoji-input{
    width: 20px !important;
    height: 20px !important;
	min-width:initial !important;
	min-height:initial !important;
	margin-bottom:0 !important;
    }
	.img-upload-menu{
	position:absolute;
	width:initial;
	height:auto;
    transform-origin: top left !important;	
	opacity:0;
	-moz-transition: all 0.10s ease;
    -webkit-transition: all 0.10s ease;
    -o-transition: all 0.10s ease;
    -ms-transition: all 0.10s ease;
    transition: all 0.10s ease !important;
	}
	.img-upload-wrap-outer{
	position:relative;
	}
	.img-upload-wrap-outer .modal-body{
	max-height: calc(100% - 55px);
	}
	.img-crop-popup{
	width: 500px;
    height: 500px;
	max-height: calc(100vh - 26vh);
	}
	.img-crop{
	position:relative;
	height:360px;
	float: left;
    width: 100%;
    overflow: hidden;
	}
	.imgCropper-controls{
	position: absolute;
    left: 0;
    bottom: 0;
	top:0;
	right:0;
    width: initial;
    color: #fff;
	z-index:99;
	 pointer-events: none;
	}
	.imgCropper-controls .imgCropper-zoomIn{
	position: absolute;
    right: 20px;
    bottom: 0;
	top:calc(50% - 20px);
    background: #fff;
    color: #777777;
    text-align: center;
    width: 26px;
    height: 33px;
	padding-bottom: 6px;
    font-size: 14px;
    border-top-left-radius: 3px !important;
    border-top-right-radius: 3px !important;
	pointer-events: auto;
   }
   .imgCropper-controls .imgCropper-zoomOut{
	position: absolute;
    right: 20px;
    bottom: 0;
	top:50%;
    background: #fff;
    color: #777777;
    text-align: center;
    width: 26px;
    height: 33px;
	padding-top: 6px;
    font-size: 14px;
    border-bottom-left-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
	pointer-events: auto;
   }   
   .imgCropper-crop {
    visibility:hidden;
    pointer-events: auto;	
    }
	.imgCropper-crop-trigger{
	position: absolute;
    right: 30px;
    top: -35px;
    background: #5d6182;
    color: #777777;
    text-align: center;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    padding-top: 13px;
    pointer-events: auto;	
	}
	.imgCropper-crop-trigger img{
	max-height: 40px;	
	}
	.img-crop-footer{
	position: relative;
    float: left;
    display: block;
    width: 100%;
    height: 75px;
    background: #eaeaea;
	}
   .imgCropper-rotateLeft,.imgCropper-rotateRight,.imgCropper-fit{
   display:none;
   }
	.svg-mask{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    viewBox: 0 0 100% 100%;
    pointer-events: none;
    }
	
	.imgCropper-wrapper{
	display: block !important;
    position: absolute !important;
    overflow: visible !important;
    border-radius: 50% !important;
    left: 82px !important;
    height: auto !important;
    width: 337px !important;
    height: 0 !important;
    padding-top: 337px !important;
    margin-top: 12px !important;
	}
    .last-text img{
	max-height:17px;
	margin-right:5px;
	}
	.media-dropzone{
	position:absolute;
	background-color: rgba(255, 255, 255, 0.70);
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:999;	 
	padding:30px;
	}
	.media-dropzone span{
	color: #828282;
	font-size:35px;
	width:100%;
	height:100%;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	border: 5px dashed #828282;
	}
/**newly added 17-8-17***/
    .contact-block .media{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    position: relative;
    padding:0 !important;
    }
     .participants-block .media{
    padding: 0 !important;
    }
    .contact-block .media a,.media .clickable{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    position: relative;
    cursor: pointer;
    height: 70px;
    }
    .media-left{
    -webkit-flex: none;
    flex: none;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    margin-top: -1px;
    padding: 0 15px 0 13px !important;
    }
    .media-body{
        -webkit-flex-grow: 1;
    flex-grow: 1;
    min-width: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    padding-right: 15px;
    }
    .media-chat-main{
        -webkit-align-items: baseline;
    align-items: baseline;
    line-height: normal;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    text-align: left;
    margin-top: -1px;
    display: -webkit-flex;
    display: flex;
    }
    .participants-block .media-chat-title,.participants-block .media-chat-lastmsg, .participants-block .media-chat-sub {
    color: #4b4b4b;
    }
    .participants-block .media-chat-details{
        color: rgba(0,0,0,.50);
    }
    .frwd-msg-wrap .media-chat-title,.frwd-msg-wrap .media-chat-lastmsg, .frwd-msg-wrap .media-chat-sub {
    color: #4b4b4b;
    }
    .frwd-msg-wrap .media-chat-details{
        color: rgba(0,0,0,.50);
    }
    .frwd-msg-wrap .media-body {
    border-bottom: 1px solid #eaeaea;
    }
    .media-chat-title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: normal;
    font-size: 15px;
    line-height: 20px;
    color: #2b2b2b;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    display: -webkit-flex;
    display: flex;  
    }   
    .media-chat-details{    
    -webkit-flex: none;
    flex: none;
    color: #2b2b2b;
    margin-left: 6px;
    font-size: 12px;
    line-height: 20px;
    }
    .last-msg-time{
    text-transform: capitalize;
    }
    .media-chat-sub{
    font-size: 14px;
    line-height: 19px;
    margin-top: 5px;
    min-height: 20px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    color: #2b2b2b;
    }
    .media-chat-lastmsg{
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color:#818181;
    white-space: nowrap;
    -webkit-flex: 1;
    flex: 1;
    text-align: left;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
    }
    .contact-block .media-chat-lastmsg a{
      color: #4e4e4e !important;
      display: block!important;
      height: auto!important;
      pointer-events: none!important;
    }
    .media-thumb:hover .media-thumb-remove{
    display:block;
    }
    .media-thumb-remove{
    z-index: 999;
    position: absolute;
    top: 7px;
    right: 7px;
    width: 20px;
    height: 20px;
    display:none;
    }
    .media-thumb-remove img{    
    width: 20px;
    height: 20px;
    }
    .emoji-input{
    margin:0 !important;
    }
    .emoji-gipy-wrap .emoji-gipy{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 5px;
     } 
     .emoji-gipy-wrap .emoji-gipy-inner{
         position: relative;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 1;
    flex-shrink: 1;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    -webkit-justify-content: center;
    justify-content: center;
    cursor: pointer;
    height: 130px;
    overflow-x: hidden;
    overflow-y: hidden;
    margin-right: 6px;
    background-color: #e9ebeb;
    flex-basis: 230px;
    }
    .emoji-gipy-wrap .emoji-gipy-inner>div {
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    }
    .emoji-gipy-wrap .emoji-gipy-inner>div>div {
    position: relative;
    width: 100%;
    }
    .emoji-gipy-wrap .emoji-gipy-inner video{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    }
    .emoji-gipy-blank {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-shrink: 100;
    flex-shrink: 100;
}

.newgroup-detail-wrap{
    -webkit-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    opacity: 1;
}
.newgroup-detail-wrap .add_contact_for_group{
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}
.newgroup-detail-wrap .newgroup-detail{
    -webkit-flex: 1;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
    background-color: #fff; 
}
.newgroup-detail-wrap .ok-btn-wrap{
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
} 


/**bugfix 16-9-17**/
.sliding-right-panel .msginfo-detail .msg-screen .msg-wrap {
    padding-left: 15px !important;
    padding-right: 15px !important;
}
.sliding-right-panel .msginfo-detail .msg-screen .msg-wrap .msg-txt {
    max-width: 100% !important;
}
/**bugfix 16-9-17**/

.sidenav-search-messages .contact-search{
box-shadow: 0 2px 14px -3px rgba(99, 99, 99, 0.66);
    z-index: 9;
}
.sidenav-search-messages .contact-search .form-group{
background: #fff;
border:none; 
}
.sidenav-search-messages .contact-search .form-group .form-control{
 border:none!important;
 box-shadow: none!important;
 outline: none!important;
}
.receiver .chat-doc.msg-txt{
padding: 2px 3px 8px 9px !important;
}
.receiver .chat-doc.msg-txt .msg-username{
margin-bottom: 3px;
}
.sender .document-meta{
  color:#fff !important;
}
.chat-map-location{
position:relative;
}
.chat-map-location .shade{
position: absolute;
    bottom: 3px;
    left: 3px;
    right: 3px;
    height: 45px;
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7),transparent);
    background: linear-gradient(to top,rgba(0,0,0,.7),transparent);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    z-index: 999;
}
.chat-map-location::after {
    display: none !important;
}

/**login media**/
 .loginpage-media-wrap .media{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    position: relative;
    padding:0 !important;
    }
    .loginpage-media-wrap .media > a{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    position: relative;
    cursor: pointer;
    height: 70px;
	opacity:1!important;
    }
    .loginpage-media-wrap .media-left{
    -webkit-flex: none;
    flex: none;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    margin-top: -1px;
    padding: 0 15px 0 13px !important;
    }
    .loginpage-media-wrap .media-body{
        -webkit-flex-grow: 1;
    flex-grow: 1;
    min-width: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    padding-right: 15px;
    }
    .loginpage-media-wrap .media-chat-main{
        -webkit-align-items: baseline;
    align-items: baseline;
    line-height: normal;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    text-align: left;
    margin-top: -1px;
    display: -webkit-flex;
    display: flex;
    }
    .loginpage-media-wrap .media-chat-title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: normal;
    font-size: 15px;
    line-height: 20px;
    /* color: #01a9e5; */
	    color: #8051f9;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    display: -webkit-flex;
    display: flex;  
    }   
	.loginpage-media-wrap .media-chat-lastmsg {
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    color: #777;
    white-space: nowrap;
    -webkit-flex: 1;
    flex: 1;
    text-align: left;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
    }
	
/**login media end**/
.faq .faq-search-box-wrap .faq-search-box-results{
padding: 0px;
}
.faq .faq-search-box-wrap .faq-search-box-results ul{
margin-bottom: 0;
}
.faq .faq-search-box-wrap .faq-search-item:first-child{
 padding-top: 15px
}
.faq .faq-search-box-wrap .faq-search-item:last-child{
 padding-bottom: 15px
}
.faq .faq-search-box-wrap .faq-search-item{
  padding: 5px 36px;
  transition: all ease 0.6s;
  margin-bottom:0;
}
.faq .faq-search-box-wrap .faq-ans *{
margin:0;
padding:0;
}
.faq .faq-search-box-wrap .faq-search-item:hover,.faq .faq-search-box-wrap .faq-search-item:focus,.faq .faq-search-box-wrap .faq-search-item:active,.faq .faq-search-box-wrap .faq-search-item.active{ 
  background:#f1f1f1;
  transition: all ease 0.4s;
}
.faq-search-box-results ul{ 
overflow-y:auto;
max-height: inherit;
}
/**Faq Search highlight**/


/** Status Start **/
.status-wrap{	
	position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10000;
    box-sizing: border-box;
    display: none;
    -webkit-flex-direction: column;
    flex-direction: column;
	background-color: black;
}
.status-wrap.active{
    display: -webkit-flex;
	display: flex;
}
.status-wrap-inner {
    position: relative;
    width: 100%;
    height: 100%;
    color: white;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}
.status-wrap-left {
	position: absolute;
	left: 0;
    top: 0;
	width: 25%;
    height: 100%;
	background-color: #141414;
}
.status-wrap-right {
	position: absolute;
	left: 25%;
    top: 0;
	width: 75%;
    height: 100%;
}
.status-wrap-list{
	max-height:calc(100% - 155px);
	overflow-y:auto;
}
.status-container{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 65px;
	padding: 0 10px;
	cursor:pointer;
}
.status-wrap-list .status-container:hover{
	background:#232323;
}
.status-container.mystatus{
    margin-top: 30px;
	height: 85px;
}
.user-status-avatar{
	width: 50px;
    display: -webkit-flex;
    display: flex;
	margin-right:10px;
	position:relative;
}
.user-status-avatar svg{
	z-index:8;
}
.user-status-avatar-img{
	background-image: url(/app/site/public/images/profilepic.jpg);
    position: absolute;
    top: 4px;
    left: 4px;
    width: 42px;
    height: 42px;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    z-index: 2;
}	
.user-status-detail{
	display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
	max-width:calc(100% - 60px);
}
.user-status-detail h3{
	font-size: 17px;
    margin-bottom: 5px;
    margin-top: 0;
	overflow:hidden;
	max-width:100%;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.user-status-detail h4{
	font-size: 13px;
    margin-bottom: 0;
    margin-top: 0;
	overflow:hidden;
	max-width:100%;	
	text-overflow:ellipsis;
	white-space:nowrap;
	color: #afafaf;
}
.mystatus-updates{
	padding: 0 10px;
}
.mystatus-updates p{
	font-size: 13px;
    color: #b1b1b1;
    margin: 10px 0 10px;
}
.mystatus-updates hr{	
	color: #ffffff;
    opacity: 0.2;
    width: 100%;
    margin: 0;
}	
.status-new{
	stroke: #009588;
}
.status-old{
	stroke: #c5c5c5;
}
.status-wrap-right-inner{
	display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
	width: 100%;
    height: 100%;
	position: relative;
}
.status-wrap-right-inner .status-close-btn{
	position:absolute;
	top:15px;
	right:15px;
    max-height: 35px;
    transform: translateZ(0);
	cursor:pointer;
}
.status-wrap-right-inner > h2{
	font-size:25px;
	margin-top:30px;
	margin-bottom:50px;
	width:100%;
	text-align: center;
    padding: 0 20px;
}
.your-status-wrap-list{
	width: 100%;
	max-height:calc(100% - 100px);
	overflow-y:auto;
	display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
	-webkit-flex-wrap: wrap; /* Safari 6.1+ */
    flex-wrap: wrap;
}
.your-status-wrap-list .status-container{
	-webkit-flex-direction: column;
    flex-direction: column;
	height:auto;
	width:20%;
	margin-bottom: 30px;	
	cursor:default;
}
.your-status-wrap-list .user-status-avatar{
	width: 70px;
    height: 70px;
}
.your-status-wrap-list .user-status-avatar-img{
	width: 70px;
    height: 70px;
	top: 0;
    left: 0;	
	cursor:pointer;
}
.your-status-wrap-list .user-status-detail{
	text-align: center;
	margin-top:15px;
	max-width:100%;
}
.your-status-wrap-list .status-viewed-by span{
	line-height: 24px;
    display: inline-block;
    vertical-align: top;
}
.empty-mystatus .your-status-wrap-list{
	-webkit-flex-direction: column;
    flex-direction: column;
	opacity: 0.65;
}
.empty-mystatus .your-status-wrap-list img{
    transform: translateZ(0);
    max-height: 90px;
    margin-bottom: 50px;
}
.empty-mystatus .your-status-wrap-list p{	
    font-size: 16px;
}	
/** Status End **/

/** Status Gallery Start **/
.statusgallery-wrap{	
	position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10000;
    box-sizing: border-box;
    display: none;
	background-color: black;
}
.statusgallery-wrap.active{
	display:block;
}
.statusgallery-wrap-inner{
	position: relative;
    width: 100%;
    height: 100%;    
}
.statusgallery-back-btn{
	position:absolute;
	top:20px;
	left:15px;
    max-height: 25px;
    transform: translateZ(0);
	cursor:pointer;
	z-index: 99;
}
.statusgallery-close-btn{
	position:absolute;
	top:20px;
	right:15px;
    max-height: 25px;
    transform: translateZ(0);
	cursor:pointer;
	z-index: 99;
}
.statusgallery-header{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	padding: 5px 40px;
	color:#fff;
	z-index: 3;
}
.statusgallery-header-backdrop{
	position: absolute;
	top:0;
	left:0;
    width: 100%;
    height: 100px;
    z-index: 3;
    background-image: linear-gradient(rgba(0, 0, 0, 0.65), transparent);
}
.statusgallery-header .status-container{
	height:50px;
}
.statusgallery-header .user-status-avatar {
    width: 50px;
    height: 50px;
}	
.statusgallery-loader-wrap{
	display: -webkit-flex;
    display: flex;
    position: absolute;
    width: 360px;
    height: 7px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    z-index: 1;
	top:0;
    left: 0;
    right: 0;
    direction: ltr;
}
.statusgallery-loader{
	position: relative;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
    margin-left: 2px;
    margin-right: 2px;
	border-radius:25px;
	overflow: hidden;
}
.statusgallery-loader::before{
	content:"";
	position: absolute;
    top: 0;
    left: 0;
	width:100%;
	height:100%;
	background:#fff;
	opacity:0.5;
}	
.statusgallery-loader-fill{
	background:#fff;
	width:100%;
	height: 100%;
	transform:translateX(-100%);
	
}
.statusgallery-wrap .media-upload-controls.prev-btn{
	top: 50%;
	bottom:initial;
	left: 40px;
	right: initial;
	transform:translateY(-50%);
	z-index: 99;
}
.statusgallery-wrap .media-upload-controls.next-btn{
	top: 50%;
	bottom:initial;
	right: 40px;
	transform:translateY(-50%);
	z-index: 99;
}
.statusgallery-wrap .btn-media-send{
    background-color: rgba(255, 255, 255, 0.05);
}	
.status-bg{
	position:relative;
	z-index:1;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}
.status-bg.status-img{
	opacity: 0.2;
    -webkit-filter: blur(15px);
    filter: blur(15px);
}
.statusgallery-thumb{
	min-width:450px;
    -webkit-filter: blur(5px);
    filter: blur(5px);
}
.statusgallery-body{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
	z-index: 2;
}
.statusgallery-body img{
	max-width:95%;
	max-height:95%;
	width:auto;
	height:auto;
	
}
.statusgallery-body video{	
	width: 100%;
    height: 100%;
}	
.statusgallery-reply .msg-input ul .msg-box .input{
	color:#fff;
}
.statusgallery-reply .msg-input ul .msg-box{
	background:rgba(0,0,0,0.5);
	border-color:rgba(0,0,0,0.5);
}
.statusgallery-reply{
	position: absolute;
    bottom: 30px;
    left: 0;
    width: 100%;
	z-index:99;
}
.statusgallery-reply .msg-input{
	width: 70%;
    margin: auto;
    border-radius: 5px;
    background: none;
}
.statusgallery-reply .msg-box{
	position:relative;
}
.statusgallery-reply .reply-cancel-btn{
	border-left:1px solid #b3b3b3;
}
.statusgallery-reply .reply-box{
	border-radius: 7.5px;
	padding:0;
	background-color: #ffffff;
}
.statusgallery-reply .reply-msg-color-bar{
	background:#01a9e5;
}
.statusgallery-reply .reply-box .reply-msg{
	margin-left:0;
}
.statusgallery-reply .reply-box-positioning-container{
	top:-5px;
	left:0px;
}
/** Status Gallery End **/

.message-txt.disabled{
    opacity: 0.75;
}

.web_scimbo ul{
margin-left:0px;
padding-left:20px;
margin-top:10px;
margin-bottom:10px;
list-style-type: decimal;
}
.web_scimbo ul li {
    font-size:18px;
    color:#777;
    line-height:35px;
}
.menu-cons{
    width: 18px;
    height: 24px;
    background-color: #ece8e8;
    position: relative;
    top: 13px;
    border-radius: 2px;
}
.menu-cons img {
      width: 14px;
    height: 14px;
    margin-top: 6px;
    margin-left: 2px;
}
.web-logos{
    margin-top:20px;
}
/** New changes 24-08-2018 **/
.top-sections {
    float:left;
    width:100%;
}
    .new-medias {
        float:left;
        width:100%;
        padding-top: 20px;
        padding-bottom: 20px;
        background: #fff;
        cursor: pointer;
    }
    .new-medias .media-left {
   width: 90px;
   float: left;
}
.new-medias .media-body {
   width: 70%;
   float: left;
}
.new-medias p {
   font-size: 12px;
   line-height: 16px;
    cursor:pointer;
        word-break: break-all;
}
.under-content {
    float:left;
    width:100%;
    padding: 19px 17px 11px 15px;
    background: #f4f5f5;
}
.under-content p {
   line-height: 16px;
   font-size: 12px;
}
.panel-links {
    float:left;
    width:100%;
    padding-left: 0px;
   padding-right: 0px;
}
.panel-links .panel.panel-default {
   border: none;
   cursor: pointer;
   margin-bottom: 0px;
    height: 60px;
}
.panel-links span {
   float: left;
   width: 35px;
}
.panel-links .panel-body {
   font-size: 15px;
   color: #3a3737;
   font-weight: 400;
   line-height: 20px;
    text-transform:capitalize;
}
.panel-links img {
   width: 20px;
}
.new-medias .media-heading {
   color: #000;
   font-size: 20px;
}
.new-medias-img {
    height: 60px;
   width: 60px;
   border-radius: 50px;
   object-fit: cover;
}
.panel-links .panel.panel-default:hover {
   background: #f4f5f5;
}
.new-medias:hover {
   background: #f4f5f5;
}

/* web text status start */

.txt-updates {
	max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
	color:#fff;
	padding:20px;
	text-align:center;
	position:relative;
}
.inner-txt-updates {
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%);
	left:50%;
	width: 30%;
    padding: 20px;
	line-height:1.4em;
	word-break: break-all;
	font-size:60px;
	text-align:left;
}
.txt-updates-list {
	max-width: 100%;
    max-height: 100%;
    width: 100px;
    height: 100px;
	color:#fff;
	padding:20px;
	border-radius:50px;
	overflow: hidden;
    text-align: center;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: normal;
	cursor: pointer;
}

.txt-updates-side-list {
	max-width: 100%;
    max-height: 100%;
    width: 100px;
    height: 100px;
    color: #fff;
    padding: 10px;
    border-radius: 50px;
    overflow: hidden;
    text-align: center;
    font-size: 5px;
    text-overflow: ellipsis;
    white-space: normal;
    cursor: pointer;
}
.single-images img{
	width:48px !important;
	height:48px !important;
}

/* web text status end */


/*** dynamic text size ***/
	.default {
		font-size:60px;   
		line-height:1.4em;     /*** 0 -60 ***/
		text-align:center;
	}
	.min-lgt {
		font-size:36px;
		line-height:1.3em;     /*** 61 -240 ***/
		text-align:center;
		
	}
	.max-lgt {
		font-size:16px;
		line-height:1.5em;      /*** 241 - above ***/
		text-align:center;
	}
	
	.themefont2 {
        font-family: 'DroidSerifRegular';
    }
    .themefont3 {
        font-family: 'NoricanRegular';
    }
    .themefont4 {
        font-family: 'BryndanWrite';
    }
    .themefont5 {
        font-family: 'OswaldHeavy';
    }
	
	.current-single-images img{
		width:7px !important;
		height:7px !important;
	}
	.current-list-single-images img{
		width:12px !important;
		height:12px !important;
	}

/*** dynamic text size Ended ***/

/** New changes 24-08-2018 **/

img.img-responsive.missed-icons {
    width: 21px;
    display: inline-block;
    padding-right: 5px;
}

.user-status-avatar svg {
    z-index: 8;
    transform: rotate(274deg);
}