.p-b-10 {  padding-bottom: 10px !important;  }

/*Right sidebar*/
.navbar-top-links > li.right-side-toggle a:focus {
    background: #4F5467;
}
.right-sidebar {
    position: fixed;
    right: -240px;
    width: 240px;
    display: none;
    z-index: 9999;
    background: #ffffff;
    top: 0px;
    height: 100%;
    box-shadow: 5px 1px 40px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}
.right-sidebar .rpanel-title {
    display: block;
    padding: 21px;
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    background: #ff6849;
}
.right-sidebar .rpanel-title span {
    float: right;
    cursor: pointer;
    font-size: 11px;
}
.right-sidebar .rpanel-title span:hover {
    color: #2b2b2b;
}
.right-sidebar .r-panel-body {
    padding: 20px;
}
.right-sidebar .r-panel-body ul {
    margin: 0px;
    padding: 0px;
}
.right-sidebar .r-panel-body ul li {
    list-style: none;
    padding: 5px 0;
}
.shw-rside {
    right: 0px;
    width: 240px;
    display: block;
}

/*Style switcher*/
ul#themecolors {
    display: block;
}
ul#themecolors li {
    display: inline-block;
}
ul#themecolors li:first-child {
    display: block;
}
#themecolors li a {
    width: 50px;
    height: 50px;
    display: inline-block;
    margin: 5px;
    color: transparent;
    position: relative;
}
#themecolors li a.working:before {
    content: "\f00c";
    font-family: "FontAwesome";
    font-size: 18px;
    line-height: 50px;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    text-align: center;
}
.default-theme {
    background: #fb9678;
}
.green-theme {
    background: #00c292;
}
.yellow-theme {
    background: #a0aec4;
}
.blue-theme {
    background: #03a9f3;
}
.purple-theme {
    background: #9675ce;
}
.megna-theme {
    background: #01c0c8;
}
.default-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #fb9678 23%, #fb9678 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #fb9678 23%, #fb9678 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #fb9678 23%, #fb9678 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='#fb9678', GradientType=1);
    /* IE6-9 */
}
.green-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #00c292 23%, #00c292 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #00c292 23%, #00c292 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #00c292 23%, #00c292 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='#00c292', GradientType=1);
    /* IE6-9 */
}
.yellow-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #a0aec4 23%, #a0aec4 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #a0aec4 23%, #a0aec4 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #a0aec4 23%, #a0aec4 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='#a0aec4', GradientType=1);
    /* IE6-9 */
}
.blue-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #03a9f3 23%, #03a9f3 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #03a9f3 23%, #03a9f3 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #03a9f3 23%, #03a9f3 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='@info', GradientType=1);
    /* IE6-9 */
}
.purple-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #9675ce 23%, #9675ce 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #9675ce 23%, #9675ce 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #9675ce 23%, #9675ce 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='@purple', GradientType=1);
    /* IE6-9 */
}
.megna-dark-theme {
    background: #4f5467;
    /* Old browsers */
    background: -moz-linear-gradient(left, #4f5467 0%, #4f5467 23%, #01c0c8 23%, #01c0c8 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #4f5467 0%, #4f5467 23%, #01c0c8 23%, #01c0c8 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #4f5467 0%, #4f5467 23%, #01c0c8 23%, #01c0c8 99%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4f5467', endColorstr='@megna', GradientType=1);
    /* IE6-9 */
}

/*Style Switcher*/
/*custom tab2*/
.customtab2 {
    border-bottom: 1px solid #f7fafc;
    border-top: 1px solid #f7fafc;
    padding: 10px 0;
    background:#f9f9f9;
}
.customtab2 li.active a,
.customtab2 li.active a:hover,
.customtab2 li.active a:focus {
    background: #ff6849;
    border: 1px solid #ff6849;
    color: #ffffff;
}
.customtab2 li a,
.customtab2 li a:hover,
.customtab2 li a:focus {
    border: 0px;
}
.customtab2 > li > a {
    border-radius: 0px;
    color: #2b2b2b;
}
/*custom tab2*/
/* Chat widget */

.chat-list {
    list-style: none;
    max-height: 350px;
    padding: 0px 20px;
}
.chat-list li {
    margin-bottom: 24px;
    overflow: auto;
}
.chat-list .chat-image {
    display: inline-block;
    float: left;
    text-align: center;
    width: 50px;
}
.chat-list .chat-image img {
    border-radius: 100%;
    width: 100%;
}
.chat-list .chat-text {
    background: #f7fafc;
    border-radius: 0px;
    display: inline-block;
    padding: 15px;
    position: relative;
}
.chat-list .chat-text h4 {
    color: #1a2942;
    display: block;
    font-size: 12px;
    font-style: normal;
    font-weight: bold;
    margin: 0;
    line-height: 15px;
    position: relative;
}
.chat-list .chat-text p {
    margin: 0px;
    padding-top: 3px;
}
.chat-list .chat-text b {
    font-size: 10px;
    opacity: 0.8;
}
.chat-list .chat-body {
    display: inline-block;
    float: left;
    font-size: 12px;
    margin-left: 12px;
    width: 65%;
}
.chat-list .odd .chat-image {
    float: right !important;
}
.chat-list .odd .chat-body {
    float: right !important;
    margin-right: 12px;
    text-align: right;
    color: #ffffff;
}
.chat-list .odd .chat-text {
    background: #ff6849;
}
.chat-list .odd .chat-text h4 {
    color: #ffffff;
}
.chat-send {
    padding-left: 0px;
    padding-right: 30px;
}
.chat-send button {
    width: 100%;
}
.chat {
    margin: 0;
    padding: 0;
    list-style: none;
}
.chat li {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dotted rgba(120, 130, 140, 0.13);
}
.chat li.left .chat-body {
    margin-left: 60px;
}
.chat li.right .chat-body {
    margin-right: 60px;
}
.chat li .chat-body p {
    margin: 0;
}
.panel .slidedown .glyphicon,
.chat .glyphicon {
    margin-right: 5px;
}
.chat-panel .panel-body {
    height: 350px;
    overflow-y: scroll;
}

.chat-main-box {
    position: relative;
    background: #ffffff;
    overflow: hidden;
}
.chatboxblink{ background: #353c48;}

.chat-main-box .chat-left-aside {
    position: absolute;
    width: 250px;
    z-index: 9;
    top: 0px;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
}
.chat-main-box .chat-left-aside .open-panel {
    display: none;
    cursor: pointer;
    position: absolute;
    left: 100%;
    top: 50%;
    z-index: 100;
    background-color: #fff;
    -webkit-box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    border-radius: 0 100px 100px 0;
    line-height: 1;
    padding: 15px 8px 15px 4px;
}
.chat-main-box .chat-left-aside .open-panel{    background-color: #353c48 !important; color: #fff;}
.chat-main-box .chat-left-aside .chat-left-inner .form-control {
    height: 60px;
}
.chat-main-box .chat-left-aside .chat-left-inner .style-none {
    padding: 0px;
    height: 540px;
}
.chat-main-box .chat-left-aside .chat-left-inner .style-none li {
    list-style: none;
    overflow: hidden;
}
.chat-main-box .chat-left-aside .chat-left-inner .style-none li a {
    padding: 13px 25px;
}
.wchat .chat-left-aside .chat-left-inner .style-none li a:hover,
.wchat .chat-left-aside .chat-left-inner .style-none li a.active {
    background: #f7fafc;
}
.chat-main-box .chat-right-aside {
    margin-left: 250px;
}
.chat-main-box .chat-right-aside .chat-list {
    max-height: none;
    height: 100%;
    padding-top: 40px;
}
.chat-main-box .chat-right-aside .chat-list .chat-text {
    border-radius: 6px;
}
.chat-main-box .chat-right-aside .send-chat-box {
    position: relative;
}

.chat-main-box .chat-right-aside .send-chat-box .form-control {
    border: none;
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    resize: none;
    height: 80px;
    padding-right: 95px;
}
.chat-main-box .chat-right-aside .send-chat-box .form-control:focus {
    border-color: rgba(120, 130, 140, 0.13);
}
.chat-main-box .chat-right-aside .send-chat-box .custom-send {
    position: absolute;
    right: 10px;
    top: 10px;
}
.chat-main-box .chat-right-aside .send-chat-box .custom-send .cst-icon {
    color: #686868;
    margin-right: 10px;
}
/*Chat online*/
.chatonline img {
    margin-right: 10px;

    width: 40px;
}
.chatonline li a {
    padding: 15px 0;
    float: left;
    width: 100%;
}

.chatboxhead small {
    display: block;
    font-size: 10px;
}
.mega-dropdown-menu {
    height: 340px;
    overflow: auto;
}
.left-aside {
    position: relative;
    width: 100%;
    border: 0px;
}
.right-aside {
    margin-left: 0px;
}
.chat-main-box .chat-left-aside {
    left: -250px;
    transition: 0.5s ease-in;
    background: #ffffff;
}
.chat-main-box .chat-left-aside.open-pnl {
    left: 0px;
}
.chat-main-box .chat-left-aside .open-panel {
    display: block;
}
.chat-main-box .chat-right-aside {
    margin: 0px;
}
.chat-right-aside.right{ width: 100%;padding-right: 0px;}

/*******************light-dark COLOR CSS*************/

.wchat {
    background-color: #fff;
}
.wchat-header {
    background-color: #fff !important;
}
.wchat-chat {
    background-color: #fff;
}
.wchat .chat-left-aside {
    background: #fff;
}
.incoming-msgs {
    background-color: #353c48 !important;
    color: #fff;
}
.wchat .chat-left-aside .open-panel {
    background-color: #353c48 !important;
    color: #fff;
}
.block-wchat {
    background-color: #f9f9f9;
}
.block-wchat .input-container {
    background-color: #fff;
}
.drawer {
    background-color: #fff;
}
/*******************light-dark  COLOR CSS*************/
#wchat {
    font-family: 'Roboto', sans-serif !important;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern";
    -webkit-font-feature-settings: "kern";
    -moz-font-feature-settings: "kern=1";
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

	height: 100%;
    width: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
}
#wchat {
	position: absolute;top: 0;left: 0;
}
.wchat {
	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);background-position: top left;background-repeat: repeat-x;display: -webkit-box;display: -ms-flexbox;display: flex;
}
.wchat-wrapper {
	width: 100%;height: 100%;overflow: hidden;
}



@media screen and (max-height: 500px){
    .wchat {
        /*min-height: 500px;*/
    }
    .wchat-wrapper {
        overflow-y: auto;
    }
}
@media screen and (max-width: 500px){
    .max-profile-picture {
        width: 40px !important;
        height: 40px !important;
        margin-right: 0px !important;
    }
    .max-profile-picture img {
        min-height: 40px !important;
    }
    .chat-list .chat-text {
        padding: 10px !important;
    }
    .chat-list {
        padding: 0 !important;
    }
    .wchat .chat-left-aside {
        transition: 0.5s ease-in;position: absolute;transition: 0.5s ease-in;
        width: 265px !important;
        left: -265px;
    }

}
@media screen and (max-width: 648px){
    .wchat {
        min-width: 100%;
    }
    .three .wchat-three {
        position: absolute;left: 0% !important;width: 100% !important;
    }
    .three .wchat-two {
        position: absolute;/*left: 40%;*/width: 100% !important;
    }
}
@media screen and (max-width: 900px) {
    .two .wchat-one {
        width: 40%;
    }
    .two .wchat-two {
        width: 60% !important;
    }

    .three .wchat-one {
        width: 40% !important;
    }
    .three .wchat-two {
        width: 60% !important;
    }
    .three .wchat-three {
        position: absolute;left: 40%;width: 60%;
    }
}
@media screen and (min-width: 901px) and (max-width: 1024px) {
    .two .wchat-one {
        width: 35% !important;
    }
    .two .wchat-two {
        width: 65% !important;
    }

    .three .wchat-one {
        width: 35% !important;
    }
    .three .wchat-two {
        width: 65% !important;
    }
    .three .wchat-three {
        position: absolute;left: 35%;width: 65% !important;
    }
}
@media screen and (min-width: 1025px) and (max-width: 1300px) {
    .two .wchat-one {
        width: 35% !important;
    }
    .two .wchat-two {
        width: 65% !important;
    }

    .three .wchat-one {
        width: 30% !important;
    }
    .three .wchat-two {
        width: 40% !important;
    }
    .three .wchat-three {
        width: 30% !important;
    }
}
@media screen and (max-width: 1199px) {
    .wchat {
        width: 100%;height: 100%;border-radius: 0;top: 0
    }
}
@media screen and (min-width: 1200px){
    .wchat-wrapper-web .wchat {
        width: 1118px;height: calc(100% - 38px);margin: 0 auto;top: 19px;border-radius: 3px;
    }
}
@media screen and (min-width: 1301px) {
    .two .wchat-one {
        width: 30% !important;
    }
    .two .wchat-two {
        width: 70% !important;
    }

    .three .wchat-one {
        width: 25% !important;
    }
    .three .wchat-two {
        width: 45% !important;
    }
    .three .wchat-three {
        width: 30% !important;
    }
}
@media screen and (min-width: 1320px){
    .wchat-wrapper-web .wchat {
        width: 1276px;
    }
}


.wchat-chat-tile-container {
	position: relative;order: 2;-webkit-flex: 1 1 auto !important;-ms-flex: 1 1 auto !important;flex: 1 1 auto !important;-webkit-flex-wrap: nowrap !important;-ms-flex-wrap: nowrap !important;flex-wrap: nowrap !important;
}
/*Chat-box*/
.wchat .chat-left-aside.open-pnl {
	left: 0px !important;
}
.wchat .contact-list{
	padding: 0 20px;
}
.wchat .contact-drawer{
    position: absolute;
    width: 100%;
    display: -webkit-box;
    height: calc(100% - 100px);
    top: 100px;
}

.wchat .chat-left-aside .open-panel {
    display: none;
    cursor: pointer;
    position: absolute;
    left: 100%;
    top: 50%;
    z-index: 100;
    background-color: #fff;
    -webkit-box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    border-radius: 0 100px 100px 0;
    line-height: 1;
    padding: 15px 8px 15px 4px;
}
@media screen and (min-width: 501px) and (max-width: 767px){
    .wchat .chat-left-aside {
        transition: 0.5s ease-in;
        position: absolute;
        transition: 0.5s ease-in;
        left: -265px;
    }
}
@media (max-width: 767px){

    .wchat .chat-right-aside {
        margin-left: 0px !important;left: 0px !important;
    }
    .wchat .chat-left-aside .open-panel {
        display: block;
    }
    .two .wchat-one {
        width: auto;
    }
    .two .wchat-two {
        width: 100% !important;
    }
    .three .wchat-three {
        width: 100% !important;
    }


    .chat-main-box .chat-left-aside.open-pnl {
        left: 0px;
    }
    .chat-main-box .chat-left-aside {
        left: -265px;
        transition: 0.5s ease-in;
        background: #ffffff;
    }
    .chat-main-box .chat-left-aside .open-panel {
        display: block;
    }
}

@media (min-width: 767px){
	.wchat .chat-left-aside {
        position: relative;
        z-index: 9;top: 0px;border-right: 1px solid rgba(120, 130, 140, 0.13);
    }
    .wchat .chat-right-aside {
        margin-left: 0px;
    }
    .wchat .right {
        position: relative;float: left;width: 75%;height: 100%;padding-right: 0px;
    }

}
@media (min-width: 768px){
	.wchat .chat-left-aside {
        position: relative !important;
        width: 40% !important;
        z-index: 9;
        top: 0px;
        border-right: 1px solid rgba(120, 130, 140, 0.13);
    }
    .wchat .chat-right-aside {
        margin-left: 0px !important;
    }
    .wchat .right {
        position: relative;float: left;/*width: 66% !important;*/height: 100%;padding-right: 0px;
    }
}
@media (min-width: 1200px){
	.wchat .chat-left-aside {
        position: relative !important;
        width: 30% !important;
        z-index: 9;top: 0px;border-right: 1px solid rgba(120, 130, 140, 0.13);
    }
    .wchat .chat-right-aside {
        margin-left: 0px;
    }
    .wchat .right {
        position: relative;float: left;width: 74%;height: 100%;padding-right: 0px;
    }
}
.wchat .chat-left-aside {
    position: absolute;
    width: 265px;
    z-index: 9;
    top: 0px;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
}
.wchat .chat-left-aside .chat-left-inner .form-control {
	/*height: 60px;*/
}
.wchat .chat-left-aside .chat-left-inner .style-none {
	padding: 0px;height: 540px;
}
.wchat .chat-left-aside .chat-left-inner .style-none li {
	list-style: none;overflow: hidden;
}
.wchat .chat-left-aside .chat-left-inner .style-none li a {
	padding: 13px 25px;
}
.wchat .chat-right-aside {
	margin-left: 250px;
}
.wchat .chat-right-aside .chat-list {
	max-height: none;height: 100%;padding-top: 40px;
}
.wchat .chat-right-aside .chat-list .chat-text {
	border-radius: 6px;
}
#startup,#initial_startup {
	width: 100%;height: 100%;position: fixed;background-color: #f2f2f2;-moz-user-select: none;-webkit-user-select: none;display: flex;align-items: center;justify-content: center;display: -webkit-box;display: -webkit-flex;-webkit-align-items: center;-webkit-justify-content: center;flex-direction: column;-webkit-flex-direction: column;
}
.spinner-container {
	-webkit-animation: rotate 2s linear infinite;animation: rotate 2s linear infinite;z-index: 2;
}
.spinner-container .path {
	stroke-dasharray: 1, 150;stroke-dashoffset: 0;stroke: rgba(27, 154, 89, 0.7);stroke-linecap: round;-webkit-animation: dash 1.5s ease-in-out infinite;animation: dash 1.5s ease-in-out infinite;
}
#startup .spinner-container .path,#initial_startup .spinner-container .path {
	stroke: #acb9bf;
}
@keyframes rotate {
	100% {
	transform: rotate(360deg);
}

}
@-webkit-keyframes rotate {
	100% {
	-webkit-transform: rotate(360deg);
}

}
@keyframes dash {
	0% {
	stroke-dasharray: 1, 150;stroke-dashoffset: 0;
}
50% {
	stroke-dasharray: 90, 150;stroke-dashoffset: -35;
}
100% {
	stroke-dasharray: 90, 150;stroke-dashoffset: -124;
}

}
@-webkit-keyframes dash {
	0% {
	stroke-dasharray: 1, 150;stroke-dashoffset: 0;
}
50% {
	stroke-dasharray: 90, 150;stroke-dashoffset: -35;
}
100% {
	stroke-dasharray: 90, 150;stroke-dashoffset: -124;
}

}
.progress-container {
	width: 360px;position: fixed;padding-top: 120px;top: 50%;left: 50%;margin-left: -180px;
}
@keyframes appear {
	0% {
	opacity: 0.5;transform: scaleY(0);
}
100% {
	opacity: 1;transform: scaleY(1);
}

}
@-webkit-keyframes appear {
	0% {
	opacity: 0.5;transform: scaleY(0);
}
100% {
	opacity: 1;transform: scaleY(1);
}

}
progress {
	-webkit-appearance: none;appearance: none;width: 100%;height: 3px;border: none;margin: 0;opacity: 0;animation: appear .3s ease-out forwards;animation-delay: .2s;-webkit-animation: appear .3s ease-out forwards;-webkit-animation-delay: .2s;color: #02d1a4;background-color: #e0e4e5;
}
progress[value]::-webkit-progress-bar {
	background-color: #e0e4e5;
}
progress[value]::-webkit-progress-value {
	background-color: #02d1a4;
}
progress[value]::-moz-progress-bar {
	background-color: #02d1a4;
}
.btn-plain:hover, .wchat-wrapper-web .wchat, .scroll-down, .btn-more, #window {
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .06), 0 2px 5px 0 rgba(0, 0, 0, .2);
}
.drawer {
	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;
}
.drawer {
	position: absolute;top: 0;left: 0;width: 100%;height: 100%;
}
.drawer-manager, .pane {
	display: -webkit-box;display: -ms-flexbox;display: flex;overflow: hidden;
}
.drawer-manager {
	z-index: 9;pointer-events: none;
}
#refreshPage{pointer-events: visible !important;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
.header-close {
	margin-left: 4px;margin-right: 20px;
}
button {
	border: 0;padding: 0;margin: 0;background: 0 0;outline: none;cursor: pointer;font-family: inherit;
}

.drawer-info .chat-avatar, .drawer-info .chat-body, .drawer-info .header-body {
	padding-left: 0;
}
.chat-body, .header-body {
	-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;min-width: 0;-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;
}
.chat-avatar, .chat-body, .header-body {
	display: -webkit-box;display: -ms-flexbox;display: flex;
}
.drawer-info .chat-main, .drawer-info .header-main {
	-webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.chat-main, .header-main {
	line-height: normal;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;text-align: left;margin-top: -1px;
}
.flow-drawer-container {
	overflow: hidden;
}
.icon-user-default:after, .icon-group-default:after, .icon-broadcast-default:after, .icon-psa-default:after, .drawer-manager, .avatar-body, .flow-drawer-container, .starred-title-divider:before {
	position: absolute;top: 0;left: 0;width: 100%;height: 100%;
}
.header-title {
	margin-top: 0;
}
.drawer-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;
}
.drawer-info .drawer-body {
	padding-bottom: 32px;
}
div[data-list-scroll-container] {
	-webkit-transform: translateZ(0);transform: translateZ(0);
}

.wchat-header, .row-body, .chat-main, .header-main, .chat-secondary, .header-secondary {
	display: -webkit-box;display: -ms-flexbox;display: flex;
}
.wchat-header, .row-body {
	-webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.row-main {
	-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;
}
.row-side {
    -webkit-box-flex: 0;-ms-flex: none;flex: none;margin-left: 10px;
}
.wchatellips, .starred-title-main {
	position: relative;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;
}
.wchatellips {
	-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;
}

.drawer-section-title .icon-chevron-right-alt {
	height: 21px;
}
.media-gallery, .media-gallery .more {
	display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;
}
.media-gallery {
	-ms-flex-flow: row wrap;flex-flow: row wrap;padding-top: 6px;overflow-y: hidden;margin-right: -8px;
}
.media-canvas-component {
	width: 29%;position: relative;margin-bottom: 8px;margin-right: 8px;
}
.media-canvas {
	position: absolute;top: 0;left: 0;bottom: 0;right: 0;box-sizing: border-box;outline: 4px solid #fff;background-size: cover;background-position: center;
}
.media-canvas~.shade {
	position: absolute;bottom: 0;left: 0;width: 100%;height: 20px;background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), transparent);background: linear-gradient(to top, rgba(0, 0, 0, .5), transparent);pointer-events: none;
}
@media only screen and (-webkit-max-device-pixel-ratio: 1), not all, only screen and (max-resolution: 1dppx){
	.icon-s.icon-msg-gif-light {
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiP…ksNC45aC0yLjZ2MS4zaDIuM3YxaC0yLjN2MkgxM1YzLjloMy45VjQuOXoiLz4KPC9zdmc+Cg==);background-size: 21px 20px;background-position: 0 0;
}

}
.media-canvas~.icon-s {
	position: absolute;bottom: -1px;left: 4px;pointer-events: none;
}
.media-canvas-empty {
	width: 29%;height: 0;position: relative;margin-right: 8px;
}

.well {
	padding: 14px 30px 10px;
}
.well, .well-simple {
	background-color: #FFF;box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}
.well, pre {
	background: #ffffff;border-radius: 0px;
}
.well {
	min-height: 20px;padding: 19px;margin-bottom: 20px;background-color: #f5f5f5;border: 1px solid #e3e3e3;border-radius: 4px;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}
.animate-enter2 {
    -webkit-animation: well-animation2 1s cubic-bezier(.1, .82, .25, 1);animation: well-animation2 1s cubic-bezier(.1, .82, .25, 1);
}


.drawer-section-body {
    line-height: 23px;
}
.drawer-section-body {
    -webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;word-wrap: break-word;
}

.drawer-section {
    -webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;
}
.drawer-section.well-simple-body {
    background-color: #FFF;padding: 0;
}
.drawer-info .drawer-section {
    margin-top: 10px;
}
.drawer-section, .drawer-section-expand {
    margin-top: 26px;
}
.drawer-section.well-simple-body .drawer-section-title {
	padding: 14px 30px 6px;margin-bottom: 6px;
}
.drawer-section-title {
	-webkit-box-flex: 0;-ms-flex: none;flex: none;margin-bottom: 16px;font-size: 14px;line-height: normal;color: #128C7E;
}
.drawer-button .contents .secondary, .drawer-section-title, .intro-title, .row-control-label, .entry-title, .entry-subtitle {
	font-weight: 300;
}
.drawer-section-photo {
    margin-top: 32px;margin-bottom: 6px;
}
.drawer-info .drawer-section-photo {
    margin-top: 32px;margin-bottom: 20px;
}
.drawer-section:first-of-type, .drawer-section-expand:first-of-type {
    margin-top: 32px;
}



.drawer-scale {
    -webkit-transform-origin: center center;transform-origin: center center;-webkit-animation: drawer-scale 750ms cubic-bezier(.1, .82, .25, 1);animation: drawer-scale 750ms cubic-bezier(.1, .82, .25, 1);
}
.drawer-section-photo .avatar {
    margin-left: auto;
    margin-right: auto;
}
.avatar {
    background-size: contain;background-repeat: no-repeat;background-position: center center;position: relative;border-radius: 50%;overflow: hidden;
}
.avatar-body {  z-index: 1;  }
.avatar-body img {  width: 100%;  }
.avatar-image.is-loaded {  opacity: 1;  }
.avatar-image {
    border-radius: 50%;overflow: hidden;width: 100%;opacity: 0;-webkit-transition: opacity .18s ease-out;transition: opacity .18s ease-out;display: block;
}


.clickable {
    cursor: pointer;
}
.drawer-button .contents .secondary, .drawer-section-title, .intro-title, .row-control-label, .entry-title, .entry-subtitle {
    font-weight: 300;
}






.row-drawer-item {
	padding-left: 30px;
}
.row {
	margin-right: -7.5px;margin-left: -7.5px;
}
.row-drawer-item .row-body {
	border-bottom: 1px solid #f2f2f2;padding-right: 30px;
}
.row-drawer-item .row-main {
	padding-top: 19px;padding-bottom: 19px;
}
.selectable-text {
	-webkit-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;
}
.title {
	font-weight: 400;font-size: 16px;line-height: 21px;color: #000;
}
/*Left Side Panel*//*Left Side Panel*//*Right Side Panel*/

.pane {
	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;
}
.drawer-manager, .pane {
	display: -webkit-box;display: -ms-flexbox;display: flex;overflow: hidden;
}
.wchat-chat-tile {
	position: absolute;top: 0;left: 0;height: 100%;width: 100%;opacity: .06;background-repeat: repeat repeat;
}
.wchat-chat-header {
	-webkit-box-ordinal-group: 2;-ms-flex-order: 1;order: 1;position: relative;padding-left: 16px;padding-right: 15px;display: -webkit-box;display: -ms-flexbox;display: flex;box-sizing: border-box;border-left: 1px solid rgba(0, 0, 0, .08);
}
.wchat-header, .wchat-subheader {
	-webkit-box-flex: 0;-ms-flex: none;flex: none;box-sizing: border-box;padding: 10px;position: relative;    border-bottom: 1px solid rgba(0, 0, 0, .08);
}
.wchat-header {
	height: 59px;width: 100%;z-index: 1000;
}
.wchat-header, .row-body, .chat-main, .header-main, .chat-secondary, .header-secondary {
	display: -webkit-box;display: -ms-flexbox;display: flex;
}
.wchat-header, .row-body {
	-webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.wchat-chat-header .chat-avatar:not(.chat-psa) {
	cursor: pointer;
}
.wchat-chat-header .chat-avatar {
	margin-right: 15px;
}
.chat-avatar, .chat-body, .header-body {
	display: -webkit-box;display: -ms-flexbox;display: flex;
}
.chat-avatar {
	-webkit-box-flex: 0;-ms-flex: none;flex: none;-webkit-box-align: center;-ms-flex-align: center;align-items: center;margin-top: -1px;
}

.wchat-chat-header .chat-body:not(.chat-psa), .wchat-chat-header .header-body:not(.chat-psa) {
	cursor: pointer;min-width: 0;
}
.chat-body, .header-body {
	-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;min-width: 0;-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;
}
.chat-avatar, .chat-body, .header-body {
	display: -webkit-box;display: -ms-flexbox;display: flex;
}
.chat-main, .header-main {
	line-height: normal;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;text-align: left;margin-top: -1px;
}

.chat-title{
	margin: 0;
}
.chat-title, .header-title {
	overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight: 400;font-size: 16px;line-height: 21px;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;display: -webkit-box;display: -ms-flexbox;display: flex;
}
.chat-title .emojitext, .header-title .emojitext {
	text-align: left;
}

.wchat-chat-header .chat-status, .wchat-chat-header .header-secondary, .header-secondary {
	font-size: 13px;line-height: 18px;
}
.chat-status, .header-secondary {
	font-weight: 400;white-space: nowrap;-webkit-box-flex: 1;-ms-flex: 1;flex: 1;text-align: left;
}
.chat-status {
	font-size: 14px;line-height: 20px;
}
.wchat-chat-controls, .more {
	-webkit-box-flex: 0;-ms-flex: none;flex: none;
}
.wchat-chat-controls {
	/*margin-left: 20px;*/
}
.wchat-chat-header:after, .subheader-search:after {
	position: absolute;content: '';width: 100%;height: 1px;left: 0;bottom: -1px;background-color: rgba(255,255,255,.14);border-bottom: 1px solid rgba(0,0,0,.08);
}
.bubble-actions, .menu-horizontal, .menu-horizontal>span, .menu-tabs, .menu-pills, .audio, .media-panel-header, .list-action {
	display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.wchat-chat-tile-container {
	position: relative;order: 2;-webkit-flex: 1 1 auto !important;-ms-flex: 1 1 auto !important;flex: 1 1 auto !important;-webkit-flex-wrap: nowrap !important;-ms-flex-wrap: nowrap !important;flex-wrap: nowrap !important;
}
.wchat-chat-tile-container {
	-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;
}
.wchat-body {
	-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;z-index: 1;
}
.wchat-chat-body {
	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);-webkit-transition: background .3s ease-out .1s;transition: background .3s ease-out .1s;background-color: transparent;
}
.wchat-chat-msgs {
	width: 100%;height: 100%;position: absolute;
}
.wchat-chat-body, .wchat-chat-footer {
	-webkit-transform: translateZ(0);transform: translateZ(0);
}
.wchat-chat-body {
	-webkit-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;
}
.wchat-chat-empty {
	-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;min-height: 12px;
}
.message-list {
	-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;padding-bottom: 8px;-webkit-transition: padding .3s cubic-bezier(.69, 0, .79, .14);transition: padding .3s cubic-bezier(.69, 0, .79, .14);padding-left: 0;
}
.wchat-filler {
	-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;-webkit-box-ordinal-group: 3;-ms-flex-order: 2;order: 2;
}
.wchat-chat-footer {
	padding: 0;box-sizing: border-box;min-height: 62px;
}
.wchat-chat-footer {
	-webkit-box-ordinal-group: 4;-ms-flex-order: 3;order: 3;position: relative;
}
.wchat-chat-body, .wchat-chat-footer {
	-webkit-transform: translateZ(0);transform: translateZ(0);
}
.wchat-footer {
	-webkit-box-flex: 0;-ms-flex: none;flex: none;width: 100%;box-sizing: border-box;padding: 0px;z-index: 1;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;outline: none;
}
.block-wchat {
	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;padding: 10px 19px;max-width: 100%;box-sizing: border-box;position: relative;z-index: 2;
}
.block-wchat .btn-emoji {
	margin-right: 20px;margin-bottom: 7px;
}
.block-wchat .send-container, .block-wchat .ptt-container, .block-wchat .btn-emoji {
	-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;
}
.block-wchat .input-container {
	border-radius: 5px;background-clip: padding-box;width: inherit;-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;
}
.input, .block-wchat .input-container, .input-line {
	font-weight: 400;
}
.input-container {
	-webkit-transition: height .18s ease-in-out;transition: height .18s ease-in-out;
}
.input-emoji {
	position: relative;
}
.block-wchat .input-placeholder {
	top: 0;margin-left: 2px;
}
.block-wchat .input-container .input, .block-wchat .input-container .input-container {
	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;
}
.input, .block-wchat .input-container {
	-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;
}
.input-placeholder {
	-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;position: absolute;top: 6px;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;
}
.empty-text, .intro-text, .hint, .btn, .input-placeholder, .empty-title, .bubble-btn, .dropdown .menu-item a, .menu-shortcut>.shortcut, .link-preview-title, .drawer-title, .drawer-section-footer, .intro-body, .list-invite .chat-status, .list-invite .header-secondary, .entry-text, #platforms {
	-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
}
.block-wchat .send-container, .block-wchat .ptt-container, .block-wchat .btn-emoji {
	-webkit-box-flex: 0;-ms-flex: 0 0 auto;flex: 0 0 auto;
}
.block-wchat{
    padding: 10px 15px !important;
}
.block-wchat .btn-emoji {
    margin-right: 10px !important;
}
.block-wchat .icon-send {
    margin-left: 10px !important;
}
.block-wchat .icon-send {
    opacity: .9;margin-left: 20px;margin-bottom: 8px;
}
.icon-send {
	background-position: -3451px -3512px;
}
.wchat-box-items-positioning-container {
	position: absolute;top: 0;width: 100%;
}
.wchat-box-items-overlay-container {
	position: absolute;bottom: 0;width: 100%;box-sizing: border-box;
}
.mentions-positioning-container {
	position: absolute;top: 0;width: 100%;
}
*::-webkit-scrollbar {
	width: 6px!important;height: 6px!important
}
*::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, .2)
}
*::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, .08)
}
.wchat-wrapper-main::-webkit-scrollbar-track {
	background-color: #dfdfdf
}
*::-webkit-input-placeholder {
	color: #ccc;font-size: 15px
}
*::-moz-placeholder {
    color: #ccc;font-size: 15px
}
input[type="email"], input[type="password"], input[type="text"]
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 40px;
    padding: 0 20px;
}
.scroll-down {
	position: absolute;right: 11px;bottom: 17px;z-index: 200;width: 42px;height: 42px;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;border-radius: 50%;cursor: pointer;
}

.wchat-chat-body,.wchat-chat-footer {
	-webkit-transform: translateZ(0);transform: translateZ(0)
}


.smiley-panel {
    height: 225px;-webkit-transform: translateZ(0);transform: translateZ(0);-webkit-transform-origin: bottom;transform-origin: bottom;overflow: hidden
}
.smiley-panel-body {
	height: 190px;position: absolute;opacity: 1;overflow-y: scroll;overflow-x: hidden;padding: 8px 0 10px;width: 100%;box-sizing: border-box
}
.smiley-panel-body>* {
	direction: ltr;margin: 0 12px
}
.smiley-panel .e1 {
    margin: 6px;
    cursor: pointer;
    border-radius: 3px;
}
.e1 {
    width: 32px;
    height: 32px;
    background-size: 1502px 1467px;
}
.emojione {
    width: 20px;
    height: 20px;
    /*background-size: 860px 840px;*/
}
.emojione, .e1 {
    display: inline-block;
    vertical-align: top;
    zoom: 1;
    border: 0;
}
.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 0px;
}

.menu-tabs-emoji {
    position: relative;height: 50px;background-color: #fff;-webkit-box-flex: 0;-ms-flex: none;flex: none
}
.menu-tabs-emoji .menu-item {
    height: 50px
}
.menu-tabs-emoji .icon {
    vertical-align: middle
}
.menu-tabs-marker {
    position: absolute;bottom: 0;left: 0;-webkit-transition: -webkit-transform .3s cubic-bezier(.1, .82, .25, 1);transition: transform .3s cubic-bezier(.1, .82, .25, 1);height: 4px;background-color: #009688
}
.menu-tabs>.menu-item, .menu-pills>.menu-item {
    -webkit-box-flex: 1;  -ms-flex: 1;  flex: 1;  text-align: center;
}
.menu-item {
    cursor: pointer;
}

.emoji-panel .e1 {
    margin: 6px;
    cursor: pointer;
    border-radius: 3px;
}
.e1 {
    width: 32px;
    height: 32px;
    background-size: 1502px 1467px;
}
.emoji, .e1 {
    display: inline-block;
    vertical-align: top;
    zoom: 1;
    border: 0;
}

.avatar-spinner-container {
    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;
    height: 100%;
    width: 100%;
    background-color: rgba(140,140,140,.85);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
    border-radius: 50%;
}


.drawer-header {
    background-color: #00bfa5;
    color: #fff;
    height: 108px;
    -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;
}
.drawer-header, .drawer-header-small, .drawer-header-offset, .drawer-header-popup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    box-sizing: border-box;
}
.drawer-header, .drawer-header-small {
    padding-right: 20px;
    padding-left: 25px;
}
.drawer-header .drawer-title {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
}
.drawer-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}


.menu-icons {
    position: absolute;top: 49px;right: -17px;padding: 0 10px 30px;width: 51px;box-sizing: content-box;z-index: 1000;overflow: visible;
}
.menu-shortcut {
    position: relative;
}
.menu-item {
    cursor: pointer;
}
.menu-icons-item {
    height: 51px;margin-top: 17px;cursor: pointer;-webkit-transform-origin: top center;transform-origin: top center;border-radius: 50%;overflow: hidden;opacity: 0;
}
.menu-icons-item .icon-xl {
    width: 51px;height: 51px;-webkit-transition: -webkit-transform .05s ease-out;transition: transform .05s ease-out;
}
.menu-icons .menu-icons-item:after {
    position: absolute;top: 0;left: 0;width: 51px;height: 51px;border-radius: 50%;content: "";-webkit-transition: box-shadow .07s ease-out;transition: box-shadow .07s ease-out;box-shadow: 0 1px 2px rgba(0,0,0,.17), 0 6px 8px rgba(0,0,0,.29);
}
.menu-horizontal>.menu-item, .menu-horizontal>span>.menu-item,.menu-horizontal>.mega-dropdown, .menu-horizontal>span>.mega-dropdown {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 10px;
    position: relative;
    padding: 8px;
    border-radius: 50%;
    -webkit-transition: background-color .18s ease;
    transition: background-color .18s ease;
}
.menu-horizontal>.menu-item, .menu-horizontal>span>.menu-item {
    height: auto;
}
.menu-horizontal>.menu-item.open, .menu-horizontal>span>.menu-item.open,.menu-horizontal>.mega-dropdown.open, .menu-horizontal>span>.mega-dropdown.open {
    background-color: rgba(0,0,0,.1);
}

@media screen and (max-width: 500px){
    .menu-horizontal>.menu-item, .menu-horizontal>span>.menu-item,.menu-horizontal>.mega-dropdown, .menu-horizontal>span>.mega-dropdown {
        margin-right: 0px !important;
        padding: 5px !important;
    }
    .mega-dropdown-menu {
        right: -44px !important;
    }
}

.white-box {
    width: 50px;
    margin-bottom: 15px;
    border-radius: 50%;
    height: 50px;
    padding: 15px 0 0 0 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.17), 0 6px 8px rgba(0,0,0,.29);
}

a.download-link:before{
    content: url('../../plugins/images/extension/blank.png');
    margin-right: 6px;
    vertical-align: middle;
}
a.download-link[href$='.doc']:before,
a.download-link[href$='.rtf']:before,
a.download-link[href$='.txt']:before  {
    content: url('../../plugins/images/extension/doc.png');
}
a.download-link[href$='.docx']:before {
    content: url('../../plugins/images/extension/docx.png');
}
a.download-link[href$='.zip']:before{
    content: url('../../plugins/images/extension/zip.png');
}
a.download-link[href$='.rar']:before{
    content: url('../../plugins/images/extension/rar.png');
}
a.download-link[href$='.mp3']:before{
    content: url('../../plugins/images/extension/mp3.png');
}
a.download-link[href$='.mp4']:before,
a.download-link[href$='.MP4']:before{
    content: url('../../plugins/images/extension/mp4.png');
}
a.download-link[href$='.pdf']:before{
    content: url('../../plugins/images/extension/pdf.png');
}
a.download-link[href$='.ppt']:before{
    content: url('../../plugins/images/extension/ppt.png');
}
a.download-link[href$='.psd']:before{
    content: url('../../plugins/images/extension/psd.png');
}
a.download-link[href$='.xls']:before {
    content: url('../../plugins/images/extension/xls.png');
}
a.download-link[href$='.xlsx']:before  {
    content: url('../../plugins/images/extension/xlsx.png');
}
a.download-link[href$='.xml']:before{
    content: url('../../plugins/images/extension/xml.png');
}


.msg-status{
    margin-left: 5px;}




/*
*
**********   Screen css Start   *************
*
*/
.light-theme{background-color: #edecec !important;}
.dark-theme{background-color: #4F5467 !important;}

ul#themecolors, ul#mainthemecolors {
    display: block
}
ul#themecolors li, ul#mainthemecolors li {
    display: inline-block
}
ul#themecolors li:first-child, ul#mainthemecolors li:first-child {
    display: block
}
#themecolors li a, #mainthemecolors li a {
    width: 50px;
    height: 50px;
    display: inline-block;
    margin: 5px;
    color: transparent;
    position: relative
}
#themecolors li a.working:before, #mainthemecolors li a.working:before {
    content: "\f00c";
    font-family: "FontAwesome";
    font-size: 18px;
    line-height: 50px;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    text-align: center
}
.profile-picture {
    float: left;
    border-radius: 50%;
    overflow: hidden;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}
.min-profile-picture {
    width: 40px;
    height: 40px;
    margin-right: 10px;
}

.min-profile-picture img {
    min-height: 40px;
}

.max-profile-picture {
    width: 50px;
    height: 50px;
    margin-right: 10px;
}
.max-profile-picture img {
    min-height: 50px;
}
.m-r-5 { margin-right: 5px !important;}
.p-4 { padding: 4px !important;}
.p-5 { padding: 5px !important;}
.p-lr-20{padding: 0 20px !important;}
ol, ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.font-19{font-size: 19px !important;}
.font-20{font-size: 20px !important;}
.font-24{font-size: 24px !important;}
.icon, .icon-close-panel {
    width: 26px;
    height: 24px;
}
/*@media (max-width: 767px){
.chat-main-header .dropdown{padding: 0 !important;}
}*/
.unread-count {
    background-color: #09d261;
    color: #fff !important;
    font-weight: 500;
    font-size: 12px!important;
    padding: 0 5px;
    border-radius: 12px;
    text-align: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 19px;
    min-width: 19px;
    box-sizing: border-box;
    line-height: normal;
}
.chatonline li a span.Online { color: #00c292; !important;}
.chatonline li a span.Offline { color: #aaaaaa; !important;}

.chat-head .Online { color: #00c292; !important;}
.chat-head .Offline { color: #aaaaaa; !important;}
.chat-head{
    cursor: pointer;
}
@media (max-width: 767px){
    .chat-head .personName {
        white-space: nowrap;
        width: auto;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
    }
}

.email {
    white-space: nowrap;
    width: 149px;
    overflow: hidden;
    text-overflow: ellipsis;
}
#loadmsg{
    display: none;  width: 62px;
}
.chatonline li a {color: #686868; }
.chatonline li.chatboxblink a{color: #FFFFFF;}
.chatonline li.chatboxblink a:hover{  color: #686868 !important;}



.chat-text img{ border-radius: 2px !important; max-width: 330px;}
.chat-text a{color:#323232;}
.chat-text a:hover{color:#ddd;}
.chat-head img{
    width: 40px;
}
/*.userimage{padding-left: 10px;}*/
.userfiles{cursor: pointer;width: 100%;}

.chat-text p{word-break: break-word;overflow: hidden;  max-height: 330px;}

.sendIcon {
    -ms-transform: rotate(110deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
.chat-head h3 {
    float: left;
    margin-left: 12px;
    display: inline-block;
}
.chat-head .personStatus {
    float: left; margin-left: 10px;display: inline-block;line-height: 50px;
}

.write-link {
    display: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    width: 50px;
    height: 50px;
    content: '';
    overflow: hidden;
    margin-top: -65px;
    position: absolute;
    margin-left: 0px;
}
.write-link > input[type="file"] {
    cursor: pointer;
    opacity: 0;
    padding: 14px;
}
#resultchat {
    /*overflow-y: scroll;
    max-height: 425px;
    min-height: 425px;
    overflow-x: hidden;
    margin-bottom: 0px;*/
}
#userScroll{
    overflow-y: scroll;
    max-height: 540px;
    min-height: 540px;
    overflow-x: hidden;
    margin-bottom: 0px;
}
.left {
    float: left;
    height: 100%;
}
.right {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
    padding-right: 250px;
}
.right .chat {
    position: relative;
    display: none;
}
.right .chat.active-chat {
    display: block;
}
.embtn {
    width: 25px;
}
.emoji-panel-body {
    height: 100px;
    /* position: relative; */
    opacity: 1;
    /* width: 60.5%; */
    overflow-y: auto;
    box-sizing: border-box;
    background-color: transparent;
    padding: 7px;
    /* bottom: 71px; */
}
.emoji-panel-body .embtn {
    width: 32px;
    margin: 6px;
    cursor: pointer;
}


/*light box for popup image in chat*/
#lightbox {
    position:fixed; /* keeps the lightbox window in the current viewport */
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color: rgba(0, 0, 0, 0.82);
    text-align:center;    z-index: 10000;
}
#lightbox p {
    text-align:right;
    color:#fff;
    margin-right:20px;
    font-size:12px;
}
#lightbox #content{
    vertical-align: middle;
    padding-left: 20%;
    padding-right: 20%;
}
#lightbox #content img {
    box-shadow:0 0 25px #111;
    -webkit-box-shadow:0 0 25px #111;
    -moz-box-shadow:0 0 25px #111;
    max-width:100%;
    max-height: 550px;
    border: 10px solid #95d9cc;
    border-radius: 10px;
}
/*light box for popup image in chat*/


.byMsg {
    border: 2px solid #7d7d7d;
    border-radius: 4px;
    margin-bottom: 24px;
    padding: 10px 10px 10px 25px;
    position: relative;
    font-size: 13px;
}
.byMsgError {
    border: 2px solid #d50000 !important;
    color: #d50000;
}

/*
*
**********   Screen css End   *************
*
*/



.wchat-two .flow-drawer-container {
    height: calc(100% - 59px);
    top: 59px;transition: 0.5s ease-in;position: absolute;transition: 0.5s ease-in;
}
.flow-drawer-container {
    overflow: hidden;
}
.pane-intro {
    background-color: #f7f9fa;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    box-sizing: border-box;
    border-left: 1px solid rgba(0,0,0,0.08);
    position: relative;
}
@media screen and (max-width: 800px){
    .intro-body {
        width: 80%;
    }
}
.intro-body {
    text-align: center;
    margin-top: -20px;
    width: auto;
}

