body{
    font-family: Microsoft JhengHei,Helvetica Neue,Helvetica,Arial,sans-serif;
}
.header{
    background-color: #4b367c;
}
.lavender{
    font-size: 14px;
    color: #d3cae8;
}
.lavender:hover{
    color: white;
}
.dropdown-style{
    font-size: 12px;
    width: 90%;
    padding: 5px 0px;
}
.dropdown-style:hover{
    background-color: #7a5ab4;
    color: white;
}
.input-group-text{
    background-color: white;
    padding: 0px 8px;
    font-size: 13px;
}
.nav-right{
    font-size: 18px;
}
.context-right{
    background-color: #19171c;
    color: #d3cae8;
}
.context-right>span{
    font-size: 14px;
}
.bg-lavender{
    background-color: #4b367c;
}
.sm-icon{
    font-size: 5px;
    color: red
}
.media-style:hover{
    text-decoration: none;
    background-color: #2a223d;
}
.context-center-header{
    padding: 10px;
    height: 50px;
    border-bottom: 1px solid;
    border-bottom-color: #c1c1c1;
}
.context-header-style{
    color: black;
}
.context-header-style:hover{
    color: #7a5ab4;
    text-decoration: none;
}
.btn-purple{
    background-color: #6246a2;
    font-size: 12px;
    color: white;
}
.btn-purple:hover{
    background-color: #7a5ab4;
}
.btn-purple-online{
    color: #7a5ab4;
    border: 1px solid #7a5ab4;
    padding: 5px 12px;
    background-color: white;
}
.btn-purple-online:hover{
    background-color: #d3cae8;
}
.context-right-header{
    padding: 15px;
    height: 50px;
    border-bottom: 1px solid;
    border-bottom-color: #c1c1c1;
    font-size: 13px;
}
.purple{
    color: #6246a2;
}
.chat{
    position: absolute;
    bottom: 1px;
    right: 10px;
    background-color: #e9e9e9;
    padding: 8px 10px;;
    font-size: 15px;
    color: #fff;
}