a:focus { outline: none; } 

/* WebKit, Blink, Edge */

::-webkit-input-placeholder {color:#CCCCCC;}

/* Mozilla Firefox 4 to 18 */

:-moz-placeholder {color:#CCCCCC;opacity:1;}

/* Mozilla Firefox 19+ */

::-moz-placeholder {color:#CCCCCC;opacity:1;}

/* Internet Explorer 10-11 */

:-ms-input-placeholder {color:#CCCCCC;opacity:0.6;}

/* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */

:placeholder-shown {color:#CCCCCC;}



input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }

input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }



/*vewport mobile*/

@-webkit-viewport{

    width: device-width;

}

@-moz-viewport{

    width: device-width;

}

@-ms-viewport{

    width: device-width;

}

@-o-viewport{

    width: device-width;

}

@viewport{

    width: device-width;

}

input,

textarea,

button,

select,

div,

img,

a {

  -webkit-tap-highlight-color: rgba(0,0,0,0);

}

[contenteditable=true]:focus {

outline: none;

}

[contentEditable=true]:empty:not(:focus):before{

content:attr(data-text);

 }

[contentEditable=true]:not([data-text='']):empty:before {

content: attr(data-text);

}

[contentEditable=true]:empty:before {

content: attr(data-text);

}

[contentEditable=true]::-webkit-caps-lock-indicator {

    content: none;

}

div[contenteditable] {

    white-space: pre-wrap;

    word-break: break-all;

    word-wrap: break-word;

}

[data-loader]{margin:1px 4px 2px 4px;}[data-loader='circle']{margin-left:auto;margin-right:auto;width:14px;height:14px;-webkit-animation:circle infinite .75s linear;-moz-animation:circle infinite .75s linear;-o-animation:circle infinite .75s linear;animation:circle infinite .75s linear;border:2px solid #fff;border-top-color:transparent;border-radius:100%;}}[data-loader='circle-side']{position:relative;width:18px;height:18px;-webkit-animation:circle infinite .75s linear;-moz-animation:circle infinite .75s linear;-o-animation:circle infinite .75s linear;animation:circle infinite .75s linear;border:2px solid #fff;border-top-color:rgba(0,0,0,.2);border-right-color:rgba(0,0,0,.2);border-bottom-color:rgba(0,0,0,.2);border-radius:100%;}@-webkit-keyframes circle{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);}}@-moz-keyframes circle{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);}}@-o-keyframes circle{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);}}
@keyframes circle{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);}}

.cWAl11z{top:0px;}
.bRBd34B{width:600px;}
.a1b2c3d{position:relative;margin:0px;overflow-x:hidden;max-width:100%;background-color:#FFFFFF;}
.e4f5g6h{position:relative;width:600px;margin:0px auto 0px auto;padding:0px 0px 170px 0px;}

.bDCd01x * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}
body {
    background-color: #f8f9fa;
    color: #333;
}
h1 {
      color: #000;
      font-size: 24px;
      margin-top: 60px;
      text-align: center;
    }
.header {
    text-align: center;
    background-color: #fff;
    padding: 10px;
    font-size: 14px;
    color: #666;
    border-bottom: 1px solid #ddd;
}

.chat-list {
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
}

.chat-item {
    display: flex;
    align-items: center;
    padding: 10px;
	cursor:pointer;
}

.chat-item img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-right: 10px;
	cursor:pointer;
}

.chat-info {
    flex: 1;
	cursor:pointer;
	 user-select: none;
}

.chat-header {
    justify-content: space-between;
    align-items: center;
}
.eYHe28t{	
	width: 40px;
	height: 40px;
	background-color:#62809B;
	color: #FFF;
	text-align: center;
	line-height: 40px;
	border:0px solid transparent;
	border-radius: 50%;
	font-size: 16px;
	font-weight:500;
	font-family: "Roboto", sans-serif;
	margin-right:10px;
	cursor:pointer;
}
.name {
    font-weight: bold;
    color: #000;
	margin-bottom:1px;
}

.time {
    color: #aaa;
    font-size: 12px;
	padding-bottom:3px;
}

.message {
    white-space: nowrap;
    justify-content: space-between;
    color: #666;
    font-size: 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	width:140px;
}

.text {
    flex: 1;
}

.notification {
    display: flex;
    align-items: center;
    min-width: 20px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}
.time-notification {
    padding:5px 0px 0px 0px;
	position:absolute;
	right:10px;
	margin-top:-20px;
	pointer-events: none;
}
.new-messages {
	float: right;
	background-color:#00D900;
    color:#FFFFFF;
	font-size: 10px;
	text-align:center;
	padding:2px 6px 2px 6px;
	border-radius:10px;
	display:inline-block;
}

.likes {
	float: right;
    color: #ff5e5e;
}

.chat-checkbox {
    width: 20px;
    height: 20px;
    cursor: pointer;
    margin: 3px 0px 0px 10px;
}


.separator {
    /*border-bottom:1px solid #ddd;*/
	width:calc(100% - 70px);
}
.fBDb40J{
position:relative;display:block;font-size:18px;color:#C0C0C0;font-family:Helvetica,sans-serif;font-weight:500;
text-decoration:none;margin:10px auto 20px auto;width:calc(100% - 20px);max-width:600px;height:47px;line-height:47px;cursor:pointer;text-align:center;background-color:#F8F8F8; border:0px solid transparent;border-radius:2px;
}

.bZJa09B1{position:fixed;padding-bottom:5px;bottom:0px;width:100%;min-height:40px;background-color:#FFFFFF;z-index:999999;display:none;}
.cA1Da09V{position:relative;display:block;font-size:18px;color:#FFFFFF;font-family:Helvetica,sans-serif;font-weight:500;display:none;
text-decoration:none;margin-left:auto;margin-right:auto;width:calc(100% - 20px);max-width:600px;height:47px;line-height:47px;cursor:pointer;text-align:center;background-color:#62809B; border:0px solid transparent;border-radius:2px;}
.cA1Da09V:hover{-moz-opacity: 0.9;opacity: .90;filter: alpha(opacity=90);}
.fADk13c{position:relative;display:block;font-size:18px;color:#FFFFFF;font-family:Helvetica,sans-serif;font-weight:500;display:none;
text-decoration:none;margin-left:auto;margin-right:auto;width:calc(100% - 20px);max-width:600px;height:47px;line-height:47px;cursor:pointer;text-align:center;background-color:#C0C0C0; border:0px solid transparent;border-radius:2px;}
.fADk13c:hover{-moz-opacity: 0.9;opacity: .90;filter: alpha(opacity=90);}

.dAHj41x{position:relative;display:none;}
.cNLk22f{position:relative;padding-right:7px;padding-bottom:5px;}
.bB1Hl15a{position:relative;padding-right:7px;padding-bottom:5px;display:none;}
.bB1Hl15b1{position:relative;font-size:16px;line-height:20px;font-family:Helvetica,Arial,sans-serif;color:#AAAAAA;text-decoration:none;display:table-cell;vertical-align:middle;cursor:pointer;border:1px solid #CCCCCC;border-radius:2px;background-color:#FFFFFF;text-align:center;padding:5px;}
.bB1Hl15b1:hover{-moz-opacity: 0.9;opacity: .90;filter: alpha(opacity=90);text-decoration:underline;}
.bB1Hl16T{position:relative;padding-top:20px;padding-bottom:50px;margin-left:auto;margin-right:auto;max-width:100%;}
.bB1Hl16h{position:relative;margin-left:auto;margin-right:auto;max-width:calc(100% - 20px);}

.eA1Hi10O{margin:20px auto 20px auto;}

@media screen and (max-width : 800px){
.e4f5g6h{max-width:100%;}
.bRBd34B{width:calc(100% - 10px);margin-left:5px;}
.a1b2c3d{
        padding-left: 15px;
        padding-right: 15px;
      }
.cLLa28R{padding-left:10px;}
.bZJa09B1{left:0px}
.message-bubble {max-width: calc(100% - 50px);}
.button-container {max-width: calc(100% - 20px);}
.chat-container {max-width: 800px;}
.time-notification {
	right:18px;
}
}


@media screen and (max-width : 480px){
.e4f5g6h{width:100%;max-width:100%;}
.chat-container {max-width:100%;margin:0;}
.cLLa28R{padding-left:0px;}
h1 {
        font-size: 20px;
    }
.time-notification {
	right:18px;
}
.message {width:140px;}
}