body {
    background-color: transparent;
}


.accesskey_U {
    color: #ffffff;
}


.EditorZone {
    border-top: 1px solid #337ab7;
}


.RichMenuZone {
    height: 45px;
    padding: 5px 15px 0px 15px;
    background-color: #ffffff;
    border-top: 1px solid #337ab7;
}


#ToolZone {
    background: transparent;
}


.ChatMessageRight .ChatMessageContent {
    border: 1px solid #337ab7;
    background-color: #337ab7;
    color: #ffffff;
}

.ChatMessageRight .ChatMessageContent:hover {
    border: 1px solid #337ab7;
    background-color: #337ab7;
    color: #ffffff;
}


.ChatMessageLeft .ChatMessageContent {
    border: 1px solid #e8f3f7;
    background-color: #e8f3f7;
}

.ChatMessageLeft .ChatMessageContent:hover {
    border: 1px solid #e8f3f7;
    background-color: #e8f3f7;
}


.ChatMessageContent {
    border-radius: 15px;
}


.ChatMessage.ChatMessageRight .ChatMessageFileContentInfo {
    color: #fff;
}


.ChatMessage.ChatMessageRight .Link[href] {
    color: #fff;
}

.ChatMessage.ChatMessageRight .link-text {
    color: #fff !important;
}


.ChatMessage.ChatMessageRight label[action] {
    color: #fff;
}


.QuickreplySlide {
    padding: 0px !important;
    height: 30px !important;
    font-size: 0.58rem;
    background-color: #337ab7;
    color: #fff;
}

#ToolZone>.swiper-container>.QuickReply_Vertical>.QuickreplySlide {
    background: #337ab7 !important;
    border: 1px solid #337ab7 !important;
}


.bg-color {
    background-color: #ffffff !important;
    height: 45px;
}


.font-color {
    color: #337ab7 !important;
}


.cardsSlide {
    background-color: white;
}


.dynamic_tab {
    border-top: solid #337ab7 1px;
}


.avatar_box .potrait .avatar_pic {
    background-color: white;
}


.avatar_box .potrait .avatar_pic .avatar_pic_icon {
    background: url(../../image/01/camera.svg) no-repeat center center;
}


.modal-header button {
    color: #fff !important;
}

.modal-header button:hover {
    color: #aadaff !important;
    text-shadow: 4px 4px 3px rgba(20%, 20%, 40%, 0.5) !important;
}


.modal-header div {
    color: white;
}


.modal-header {
    background-color: #337ab7;
}


.modal-footer div>button {
    background-color: #337ab7 !important;
    color: white !important;
}


#dropdown-menu {
    background-color: white;
}


#dropdown-menu>li>span {
    color: #337ab7;
}


.dropdown-menu .divider {
    /* Dropdown Menu  Divider */
    background-color: #337ab7;
}


#forgetPasswordlink {
    background-color: #337ab7 !important;
    color: white !important;
    font-weight: bold;
}


#registerAcount {
    font-weight: bold;
    background-color: #337ab7 !important;
    color: white !important;
}


#loginbtn {
    font-weight: bold;
    background-color: #337ab7 !important;
    color: white !important;
}


.fullwidthBtn:hover {
    box-shadow: 4px 4px 3px rgba(20%, 20%, 40%, 0.5);
}

.btn {
    background-color: #337ab7 !important;
    color: white !important;
}

/* 個人資訊 - 修改暱稱按鈕 */
.avatar_nickname_edit {
    color: #337ab7;
}

/* 新增服務紀錄 - 送出按鈕 */
#s_submit {
    background: transparent;
    border: solid 2px #337ab7;
    font-weight: bold;
    color: #337ab7;
}


#webmakecallbtn {
    color: #337ab7;
}

#webmakecallbtn:hover {
    color: #3db9ea;
}


.rightZoneHeader {
    border-bottom: solid 2px #337ab7;
}


#MessageList {
    bottom: 45px;
    padding: 5px 10px;
    border-top: 2px solid #337ab7;
    background-image: url(../../image/01/back.jpg);
}


#ChatZone {
    top: 45px;
    background-image: url(../../image/01/back.jpg);
}


.leave-chat {
    background: url(../../image/01/close.svg) no-repeat center center;
}

.leave-chat:hover {
    background: url(../../image/01/close-hover.svg) no-repeat center center;
}


#ChangeEditorButton {
    background: url(../../image/01/keyboard.svg) no-repeat center center;
}

#ChangeEditorButton:hover {
    background: url(../../image/01/keyboard-hover.svg) no-repeat center center;
}


#ChangeRichMenuButton {
    background: url(../../image/01/richmenu.png) no-repeat center center;
    background-size: contain;
}

#ChangeRichMenuButton:hover {
    background: url(../../image/01/richmenu-hover.png) no-repeat center center;
    background-size: contain;
}


#SendButton {
    background: url(../../image/01/sendIcon1.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}

#SendButton:hover {
    background: url(../../image/01/sendIcon3.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}

#SendButton.active {
    background: url(../../image/01/sendIcon2.svg);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
}

#audio-wave {
    background: url(../../image/01/audio-wave.gif);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#SpeechToTextBtn {
    background: url(../../image/01/mic.png);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#SpeechToTextEndBtn {
    background: url(../../image/01/mic-animate.png);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#play-tts-btn {
    background: url(../../image/01/speaker.png);
    background-size: contain;
    height: 20px !important;
    width: 20px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#DefaultStartTTSBtn {
    background: url(../../image/01/speaker-on.png);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


#DefaultCloseTTSBtn {
    background: url(../../image/01/speaker-mute.png);
    background-size: contain;
    height: 26px !important;
    background-repeat: no-repeat;
    margin-left: 5px;
}


.collapseRightZone {
    background: url(../../image/01/angle-left-solid.svg) no-repeat center center;
}

.collapseRightZone:hover {
    background: url(../../image/01/angle-left-solid-hover.svg) no-repeat center center;
}


#ApplyAgentButton {
    background: url(../../image/01/chat.svg) no-repeat center center;
    background-size: contain;
}

#ApplyAgentButton:hover {
    background: url(../../image/01/chat-hover.svg) no-repeat center center;
    background-size: contain;
}


#AttachmentButton {
    background: url(../../image/01/attachment.svg) no-repeat center center;
    background-size: contain;
}

#AttachmentButton:hover {
    background: url(../../image/01/attachment-hover.svg) no-repeat center center;
    background-size: contain;
}


#ImageButton {
    background: url(../../image/01/image2.png) no-repeat center center;
    background-size: contain;
}

#ImageButton:hover {
    background: url(../../image/01/image2-hover.png) no-repeat center center;
    background-size: contain;
}


#EmojiButton {
    background: url(../../image/01/emoji-happy.svg) no-repeat center center;
    background-size: contain;
}

#EmojiButton:hover {
    background: url(../../image/01/emoji-happy-hover.svg) no-repeat center center;
    background-size: contain;
}


#hamburger-menu {
    background: url(../../image/01/list.svg) no-repeat center center;
    background-size: contain;
}

#hamburger-menu:hover {
    background: url(../../image/01/list-hover.svg) no-repeat center center;
    background-size: contain;
}


.dynamic_cont {
    background-image: url(../../image/01/back.jpg);
}


.member .dynamic_tab_icon {
    background: url(../../image/01/people_setup.svg) no-repeat center center;
    background-size: contain;
}

.member.active .dynamic_tab_icon {
    background: url(../../image/01/people_setup-active.svg) no-repeat center center;
    background-size: contain;
}


.addservicerecord .dynamic_tab_icon {
    background: url(../../image/01/servicecase.png) no-repeat center center;
    background-size: contain;
}

.addservicerecord.active .dynamic_tab_icon {
    background: url(../../image/01/servicecase-active.png) no-repeat center center;
    background-size: contain;
}


.servicerecord .dynamic_tab_icon {
    background: url(../../image/01/list.png) no-repeat center center;
    background-size: contain;
}

.servicerecord.active .dynamic_tab_icon {
    background: url(../../image/01/list-active.png) no-repeat center center;
    background-size: contain;
}


.swiper-button-next {
    background-image: url("../../image/01/swiper_arrow_next.png");
}

.swiper-button-prev {
    background-image: url("../../image/01/swiper_arrow_prev.png");
}


#LoginButton {
    background: url(../../image/01/user-solid.svg) no-repeat center center;
    background-size: contain;
}

#LoginButton:hover {
    background: url(../../image/01/user-solid-hover.svg) no-repeat center center;
    background-size: contain;
}


#Editor {
    border: 1px solid #337ab7;
}


.btn_box button {
    background: #337ab7;
    color: #fff;
}


.btn_box div {
    background: #337ab7;
    color: #fff;
}


.service-group-item {
    background: #aadaff;
}


.service-group-item:hover {
    background: #337ab7;
    color: #fff;
}


.hotTopic-item {
    background: #aadaff;
}


.hotTopic-item:hover {
    background: #337ab7;
    color: #fff;
}


#openvidubtn {
    color: #337ab7;
}

#openvidubtn:hover {
    color: #3db9ea;
}