﻿div.Form {
    display: none;
}

    div.Form a.button {
        padding: 1rem;
    }

fieldset.CS {
    font-size: 0.8rem;
    min-height: 20vh;
}

    fieldset.CS legend {
        font-size: 1rem;
    }

    fieldset.CS div {
        width: 100%;
        word-break: break-word;
    }

    fieldset.CS textarea {
        margin-top: 0.5rem;
    }

div.CustomerService {
    width: 100%;
    padding: 1rem;
    position: relative;
}

div.MessageBox {
    display: flex;
    flex-direction: column;
    position: relative;
    margin: 0 !important;
}

    div.MessageBox ul.MessageList {
        flex-grow: 1;
        background-color: #D9EEEE;
        list-style-type: none;
        height: 70vh;
        margin: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

        div.MessageBox ul.MessageList li {
            background-color: #FFFFFF;
            border-radius: 0.75rem;
            margin: 1rem 1rem 1.5rem;
            padding: 0.5rem;
            position: relative;
            width: 80%;
        }

            div.MessageBox ul.MessageList li.Welcome {
                width: auto !important;
            }

            div .MessageBox ul.MessageList li label.Message {
                display: block;
                width: fit-content;
            }

            div.MessageBox ul.MessageList li div.Reply {
                background-color: #DDDDDD;
                border-radius: 0.5rem;
                font-size: 0.8em;
                margin-bottom: 0.4rem;
                padding: 0.4rem;
                position: relative;
            }

                div.MessageBox ul.MessageList li div.Reply label.Message.Red {
                    color: red;
                }

            div.MessageBox ul.MessageList li label {
                font-size: 0.75rem;
            }

                div.MessageBox ul.MessageList li label.Time {
                    color: #868686;
                    position: absolute;
                    bottom: -1.2rem;
                    padding-right: 1rem;
                    text-align: right;
                    width: 100%;
                }

            div.MessageBox ul.MessageList li.Customer {
                position: relative;
                left: 13%;
            }

            div.MessageBox ul.MessageList li.End {
                margin-top: 0.1rem;
            }

            div.MessageBox ul.MessageList li.Customer label.Message,
            div.MessageBox ul.MessageList li div.Reply label.Message {
                /*margin-left: auto;*/
            }

    div.MessageBox textarea {
        resize: none;
        height: 4rem;
        margin: 0;
        padding-right: 5.5rem;
    }

    div.MessageBox input.button {
        height: 4rem;
        margin: 0;
        padding: 1rem 0;
        position: absolute;
        bottom: 0;
        right: 0;
        width: 5rem;
    }
