.pb {
    border: 1px solid #fff;
    border-radius: 4px;
    position: fixed;
    right: -68px;
    bottom: 20%;
    color: #fff;
    padding: 5px 10px;
    background: #ff1b7b;
    font-size: 18px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    cursor: pointer;
    letter-spacing: 3px
}

.pb .trigon {
    border: 10px solid transparent;
    border-bottom: 15px solid #fff;
    position: absolute;
    top: -25px;
    margin: auto;
    left: 0;
    right: 0;
    width: 1px
}

.pb-chat {
    transition-duration: .5s;
    position: fixed;
    bottom: -385px;
    right: 0;
    background: #eaf2f2;
    width: 400px;
    max-width: 100%
}

.pb-chat .title-line {
    cursor: pointer;
    background: #ff1b7b;
    text-align: right;
    padding: 10px;
    color: #fff;
    font-size: 20px
}

.pb-chat .title-line .title {
    float: left;
    font-size: 16px !important;
    color: #fff !important;
}

.pb-chat .title-line .buttons button {
    background: inherit;
    border: 0;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
    transition-duration: .5s;
    outline: none
}

.pb-chat .title-line .buttons button:hover {
    color: #ff1b7b;
    outline: none
}

.pb-chat .title-line .buttons button:focus,.pb-chat .title-line .buttons button:active {
    outline: none
}

.pb-chat .title-line .buttons button::-moz-focus-inner {
    border: 0
}

.pb-chat .title-line .buttons button i {
    transition-duration: .5s
}

.pb-chat .chat-dialog {
    height: 300px;
    max-height: 100%;
    overflow-y: scroll
}

.pb-chat .chat-dialog::-webkit-scrollbar {
    width: 7px;
    height: 7px
}

.pb-chat .chat-dialog::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

.pb-chat .chat-dialog::-webkit-scrollbar-thumb {
    background: #ff1b7b;
    border: 0 none #fff;
    border-radius: 61px
}

.pb-chat .chat-dialog::-webkit-scrollbar-thumb:hover {
    background: #508413
}

.pb-chat .chat-dialog::-webkit-scrollbar-thumb:active {
    background: #6cb31c
}

.pb-chat .chat-dialog::-webkit-scrollbar-track {
    background: #c1c1c1;
    border: 0 none #fff;
    border-radius: 50px
}

.pb-chat .chat-dialog::-webkit-scrollbar-track:hover {
    background: #adadad
}

.pb-chat .chat-dialog::-webkit-scrollbar-track:active {
    background: #e0e0e0
}

.pb-chat .chat-dialog::-webkit-scrollbar-corner {
    background: transparent
}

.pb-chat .chat-dialog .chat-dialog-el {
    transition-duration: .5s;
    padding: 10px;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 30px;
    border-radius: 10px;
    background: #fff;
    width: 70%;
    color: #3b3b3b;
    position: relative
}

.pb-chat .chat-dialog .chat-dialog-el .chat-dialog-name {
    color: #7f80b0;
    font-size: 14px;
    margin-bottom: 5px
}

.pb-chat .chat-dialog .chat-dialog-el .chat-dialog-mess {
    color: #3b3b3b;
    font-size: 13px
}

.pb-chat .chat-dialog .chat-dialog-el .chat-dialog-el-time {
    position: absolute;
    right: 0;
    bottom: -20px;
    font-size: 13px;
    color: #898792
}

.pb-chat .chat-dialog .answer {
    margin-left: 20%
}

.pb-chat .input {
    /*height: 76px;
    background: #fff;*/
    padding: 0px;
}

.pb-chat .input input {
    width: 100%;
    border: 0;
    border-bottom: 2px solid #ff1b7b;
    margin: auto;
    display: block;
    padding: 5px;
    color: #3b3b3b
}

.pb-chat .input .buttons button {
    background: inherit;
    border: 0;
    font-size: 20px;
    color: #ff1b7b;
    cursor: pointer;
    transition-duration: .5s;
    font-size: 30px;
    padding: 15px 5px 0 0
}

.pb-chat .input .buttons button:hover {
    color: #898792
}

.pb-chat .input .buttons button:last-child {
    float: right;
    opacity: 0;
    padding-left: 100px
}

.chat-show {
    bottom: 0!important
}

.transform-rotate {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media(max-width: 700px) {
    .pb-chat .input .buttons button:last-child {
        opacity: 1
    }
}