*{
    font-family:sans-serif;
    margin:0;
    padding:0;
    color:#fff;

    -ms-overflow-style: none;
    scrollbar-width: none;
}
*::-webkit-scrollbar {
    display: none;
}

html, body{
    background:#222;
}

.center{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100vw;
    height:100vh;
    padding-top:140px;
    flex-direction:column;
}
.break{
    flex-basis:100%;
    height:0;
}

#msgBox{
    position:fixed;
    left:40px;
    bottom:40px;
    width:calc(100vw - 80px);
    text-align:center;
}

#msg{
    box-sizing:border-box;
    border:solid;
    border-width:1px;
    border-color:#777;
    border-right:none;
    border-top-left-radius:100px;
    border-bottom-left-radius:100px;
    background:#444;
    color:#fff;
    font-size:16px;
    height:60px;
    padding-left:22px;
    padding-right:22px;
    width:calc(100vw - 80px - 60px);
    max-width:500px;
}

#msg::placeholder{
    color:#aaa;
}

#msg:focus{
    outline:none;
}

#chatBox{
    position:fixed;
    max-height:100vh;
    bottom:0;
    left:0;
    width:100vw;
    padding-bottom:140px;
    overflow-y:scroll;
    font-size:16px;
}

#send{
    width:60px;
    height:60px;
    background:linear-gradient(to right,#444,#4b2461);
    border:solid;
    box-sizing:border-box;
    border-width:1px;
    border-color:#777;
    border-left:none;
    border-top-right-radius:100px;
    border-bottom-right-radius:100px;
    position:relative;
    top:8px;
}

.userMsg{
    background:#444;
    padding:15px;
    width:80vw;
    font-size:16px;
    box-sizing:border-box;
    overflow-wrap:anywhere;
    position:relative;
    border-radius:20px;
    border-bottom-right-radius:0;
    left:calc(20vw - 20px);
    margin-top:20px;
}

.aiProfile{
    display:flex;
    align-content:center;
    margin-left:20px;
    margin-bottom:10px;
    margin-top:20px;
    height:30px;
    box-sizing:content-box;
}