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

.user-bg {

    margin: -25px;

    height: 230px;

    overflow: hidden;

    position: relative;

}

.user-bg .overlay-box {

    background: #9675ce;

    opacity: 0.9;

    position: absolute;

    top: 0px;

    left: 0px;

    right: 0px;

    height: 100%;

    text-align: center;

}

.user-bg .overlay-box .user-content {

    padding: 15px;

    margin-top: 30px;

}

.thumb-lg {

    height: 88px;

    width: 88px;

}

.text-white {

    color: #ffffff;

}

/*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{

    overflow-y: scroll !important;

    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: #f0f0f0; background-color: #0b9bae; border-radius: 5px; padding: 2px; ;}

.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;

}