i.material-icons{position:relative;top:4px;left:-2px;padding:0px;margin:0px;}
.db-title{display:inline-block;font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400;font-size:24px;line-height:40px;margin:10px 20px;}
div#user-container{display:inline-block;}
a#sign-in{border:none;max-width:80px;padding:0px;box-shadow:none;background-color:#32baf7;font-size:12px;line-height:26px;}
a#sign-out{width:74px;padding:0px;border:none;box-shadow:none;background-color:#32baf7;font-size:12px;}
#user-container #user-pic{top:-3px;position:relative;display:inline-block;background-image:url('profile_placeholder.png');background-repeat:no-repeat;width:40px;height:40px;background-size:40px;border-radius:20px;vertical-align:middle;}
div#user-name{display:inline-block;}
button#sign-out{display:inline-block;}
form#image-form{display:inline-block;}
#image-form #submitImage{display:inline-block;width:auto;padding:0 6px 0 1px;min-width:0;border:none;background-color:transparent;color:white;}
#image-form #submitImage .material-icons{top:-6px;}
.message img{max-width:300px;max-height:200px;}
#mediaCapture{display:none;}
header{background-color:#f3f3f3!important;}
.page-footer{padding:0px 0px 10px 0px!important;color:#020202!important;background-color:#d8d8d8!important;position:fixed!important;bottom:0px!important;width:100%!important;}
#messages{position:absolute;overflow-x:hidden;overflow-y:auto;margin-bottom:0px;width:100%;height:calc(100% - 124px);}
.message-body{display:inline;padding:0px 10px;word-break:break-all;}
.message{border-radius:5px;display:inline-block;padding:14px 10px;position:relative;vertical-align:top;width:100%;min-height:20px;border-bottom:1px solid #eaeaea;margin:0px!important;}
.message::before{}
.you-msg{float:left;margin:0px;}
.you-msg::before{left:-9px;}
.my-msg{margin:0px;}
.my-msg::before{right:-9px;}
img.pic{max-width:16px;display:inline-block;height:auto;position:relative;border-radius:100px;top:3px;left:-4px;}
.private-msg{color:rgb(0,0,0);background-color:rgb(159,255,138);font-size:14px;border-radius:12px;margin-right:2px;}
.username{float:left;font-weight:700;overflow:hidden;padding-right:15px;text-align:right;font-size:16px;background-color:white;border-radius:8px;padding-left:10px;margin-right:10px;border:1px solid rgb(216,216,216);}
.input-field-header{position:relative;margin-top:1rem;padding:4px 10px 0px;width:100%;display:inline-block;}
.input-field-footer{position:relative;margin-top:4px;padding:0px 10px;width:calc(100% - 80px);display:inline-block;}
.inputMessage{}
a#submit{width:64px;padding:0px;padding:0px;box-shadow:none;background-color:#ffffff;color:black;font-size:12px;bottom:6px;}
#submitImage i.material-icons{font-size:48px;vertical-align:middle;}
.btn-file{position:relative;overflow:hidden;}
.btn-file input[type=file]{position:absolute;top:0;right:0;min-width:100%;min-height:100%;font-size:100px;text-align:right;filter:alpha(opacity=0);opacity:0;outline:none;background:white;cursor:inherit;display:block;}
textarea.materialize-textarea{overflow-y:hidden;padding:0px;resize:none;min-height:10px;margin:0px;position:relative;top:10px;}
.row{margin-left:auto;margin-right:auto;margin-bottom:0px;}
.name{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;background-color:#4dc8ff;color:white;padding:2px 8px;border-radius:16px 16px 16px 0;}
textarea.materialize-textarea:focus:not([readonly]){border-bottom:1px solid #000000;-webkit-box-shadow:none;box-shadow:none;}
div#myChatNameTitle{font-size:22px;padding:10px;box-sizing:border-box;}
label.db-input-label{margin-left:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:96%;}
input#myChatName{background-color:white;padding:2px;box-sizing:border-box;}
input:not([type]):focus:not([readonly]),input[type=text]:not(.browser-default):focus:not([readonly]),input[type=password]:not(.browser-default):focus:not([readonly]),input[type=email]:not(.browser-default):focus:not([readonly]),input[type=url]:not(.browser-default):focus:not([readonly]),input[type=time]:not(.browser-default):focus:not([readonly]),input[type=date]:not(.browser-default):focus:not([readonly]),input[type=datetime]:not(.browser-default):focus:not([readonly]),input[type=datetime-local]:not(.browser-default):focus:not([readonly]),input[type=tel]:not(.browser-default):focus:not([readonly]),input[type=number]:not(.browser-default):focus:not([readonly]),input[type=search]:not(.browser-default):focus:not([readonly]),textarea.materialize-textarea:focus:not([readonly]){border-bottom:1px solid #03a9f4;-webkit-box-shadow:0 1px 0 0 #03a9f4;box-shadow:0 1px 0 0 #03a9f4;}
.name-my{background-color:#00d449;}
textarea#message{background-color:#e3e3e3;border-bottom:1px solid #7a8184;padding:2px 2px 0px;box-sizing:border-box;}
div#signInForm{display:block;position:relative;margin-top:-53px;z-index:9999;background-color:#f1f1f1;padding:2px;box-sizing:border-box;}
div#date-bot .message-body{font-size:12px;color:#b1b1b1;}
div#date-bot i.material-icons{font-size:16px;}
.log-msg{width:100%;text-align:center;}
.toast{background-color:#f65858;box-shadow:none;}
@media only screen and (max-width:992px) and (min-width:601px){.toast{left:0px;width:100%;border-radius:0;position:fixed;margin-top:0px;background-color:#f65858;box-shadow:none;}}
@media only screen and (max-width:600px){.toast{width:100%;border-radius:0;position:fixed;margin-top:0px;background-color:#f65858;box-shadow:none;}}
a#cancelChatBtn,a#startChatBtn{padding:0px;}
#signInForm .row{position:relative;top:-10px;}
.db-page-chat{width:100%;max-width:768px;margin:0 auto;}
div#messages{max-width:768px;border-left:1px solid #e3e3e3;border-right:1px solid #e3e3e3;}
footer.page-footer{width:100%;max-width:768px;}
i.material-icons.db-msg-menu{float:right;position:relative;top:-10px;left:5px;cursor:pointer;color:#ffffff;font-size:14px;}

