.btn-chat {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border-color: #b68a35;
    border-width: 2px;
    border-style: solid;
    background-color: white;
    cursor: pointer;
    background-image: url(../img/headset.svg);
    background-repeat: no-repeat;
    background-size: 50px;
    background-position-x: 10px;
    background-position-y: 10px;
}
.btn-chat:hover {
    background-image: url(../img/headset-white.svg);
    background-color: #b68a35;
}
.btn-chat .chatHint{
    display: none;
    width: 330px;
    height: 100px;
    background-color: #f0edf7;
    top: -115px;
    left: -290px;
    position: absolute;
    border: solid #b68a35;
    border-radius: 25px;
    animation: getBigger .5s step-end infinite alternate;
    background-image: url(../img/hamda.gif);
    background-size: contain;
    background-repeat: no-repeat;
}
.btn-chat .chatHint .hintText{
    float: right;
    text-align: center;
    margin-right: 15px;
}
.btn-chat .chatHint .hintText h6{
    font-size: 0.95em;
    direction: ltr;
}
.btn-chat .chatHint .hintText h5{
    font-size: 0.95em;
    direction: ltr;
}

@keyframes getBigger { 
    0% { box-shadow: 0px 0px 1px 1px #b68a35; } 
    10% { box-shadow: 0px 0px 2px 2px #b68a35; } 
    20% { box-shadow: 0px 0px 3px 3px #b68a35; } 
    30% { box-shadow: 0px 0px 4px 4px #b68a35; } 
    40% { box-shadow: 0px 0px 5px 5px #b68a35; } 
    50% { box-shadow: 0px 0px 6px 6px #b68a35; } 
    60% { box-shadow: 0px 0px 7px 7px #b68a35; } 
    70% { box-shadow: 0px 0px 8px 8px #b68a35; } 
    80% { box-shadow: 0px 0px 9px 9px #b68a35; } 
    90% { box-shadow: 0px 0px 10px 10px #b68a35; } 
    100% { box-shadow: 0px 0px 11px 11px #b68a35; } 
 }
.chat-window{
    display: none;
    position: fixed;
    background-color: white;
    bottom: 0px;
    width: 430px;
    max-width: 90%;
    height: 600px;
    right: 40px;
    overflow: hidden;
    visibility: visible;
    z-index: 99999;
    border: 0px;
    transition: transform 0.2s ease-in-out 0s;
    backface-visibility: hidden;
    transform: translateY(0%);
    opacity: 1;
    overflow: visible;
    margin: 40px;
}
.chat-window::before{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    right: 30px;
    bottom: -48px;
    border: 20px solid;
    border-color: #B78A35 #B78A35 transparent transparent;
}
.chat-window::after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    right: 38px;
    left: auto;
    top: auto;
    bottom: -24px;
    border: 12px solid;
    border-color: white white transparent transparent;
}
.chat-round{
    border-radius: 0 30px 0 30px;
}

.chat-border {
    border: 8px solid #B78A35!important;
}

.chat-iframe{
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0 20px 0 20px;
}

.chat-min-icon{
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border-color: #b68a35;
    border-width: 2px;
    border-style: solid;
    background-color: white;
    cursor: pointer;
    background-image: url(../img/minus-white.svg);
    background-repeat: no-repeat;
    top: -30px;
    left: -25px;
    box-shadow: rgb(0 0 0 / 40%) 2px 3px 2px;
}
.chat-close-icon{
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border-color: #b68a35;
    border-width: 2px;
    border-style: solid;
    background-color: white;
    cursor: pointer;
    background-image: url(../img/close-white.svg);
    background-repeat: no-repeat;
    top: -15px;
    left: -15px;
    box-shadow: rgb(0 0 0 / 40%) 2px 3px 2px;
}
.chat-min-icon:hover{
    background-image: url(../img/minus.svg);
}