#wrapper-chat-col{ position: fixed; bottom: 0px; left: 0px; min-height: 0px; z-index: 999; transform: scale(0.6); }
#open-chat-btn { background-color: transparent; border-color: transparent; box-shadow: none; margin-top: 0px; height: 100px; width: 120px; padding: 0px; margin-bottom: 30px; z-index: 55; animation: up-down 7.5s infinite ease-in-out; }
@keyframes up-down {
    0% { transform: translate(0);}
    12.5% { transform: translate(0, 12%);}
    25% { transform: translate(0);}
    37.5% { transform: translate(0, 12%);}
    50% { transform: translate(0);}
    62.5% { transform: translate(0, 12%);}
    75% { transform: translate(0);}
    87.5% { transform: translate(0, 12%);}
    100% { transform: translate(0);}
}
@keyframes up-down {
    0% { transform: translate(0);}
    12.5% { transform: translate(0, 2%);}
    25% { transform: translate(0);}
    37.5% { transform: translate(0, 2%);}
    50% { transform: translate(0);}
    62.5% { transform: translate(0, 2%);}
    75% { transform: translate(0);}
    87.5% { transform: translate(0, 2%);}
    100% { transform: translate(0);}
}
.bingo-container #chatbot { margin: auto; position: absolute; bottom: 0; left: 0; top: 0; right: 0; width: 116px; height: 69px; box-shadow: 0px 6px #daa8a8; border: 10px solid #a11212; border-radius: 5rem; background-color: #fff;}
.bingo-container .dot { height: 12.5px !important; width: 13.5px; margin: auto; position: absolute; bottom: 0; left: 0; top: 0; right: 0; left: -65px; background-color: #a11212; border-radius: 50%; animation: pulse-outer 7.5s infinite ease-in-out; }
.bingo-container .dot:nth-child(2) { left: 0; animation: pulse-inner 7.5s infinite ease-in-out; animation-delay: 0.2s; }
.bingo-container .dot:nth-child(3) { left: 65px; animation: pulse-outer 7.5s infinite ease-in-out; animation-delay: 0.4s; }
@keyframes pulse-inner {
    0% { transform: scale(1);}
    7.5% { transform: scale(1.5);}
    15% { transform: scale(1);}
    22.5% { transform: scale(1.5);}
    30% { transform: scale(1);}
    37.5% { transform: scale(1.5);}
    45% { top: 0; transform: scale(1); height: 17.5px; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; transform: rotate(-370deg); }
    50% { top: 22.5px; height: 10px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 3rem;border-bottom-right-radius: 3rem; transform: rotate(10deg);}
    55% { transform: rotate(-10deg);}
    60% { transform: rotate(10deg);}
    65% { transform: rotate(-10deg);}
    65% {transform: rotate(0deg);}
    85% { top: 22.5px; height: 10px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 3rem; border-bottom-right-radius: 3rem; transform: rotate(0deg); }
    92.5% {top: 22.5px; height: 10px; border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 2.5rem; border-bottom-right-radius: 2.5rem; transform: rotate(0deg); }
    100% { top: 0; height: 17.5px; border-radius: 50%; transform: rotate(-360deg); }
}
@keyframes pulse-outer {
    0% { transform: scale(1);}
    7.5% { transform: scale(1.5);}
    15% { transform: scale(1);}
    22.5% { transform: scale(1.5);}
    30% { transform: scale(1);}
    37.5% { transform: scale(1.5);}
    45% { transform: scale(1); height: 17.5px;}
    55% { tranform: scale(1); height: 5px;}
    60% { height: 17.5px;}
    75% { height: 17.5px;}
    80% { tranform: scale(1); height: 5px;}
    85% { height: 17.5px;}
    100% { height: 17.5px;}
}
.chatbot-text{ font-size: 16px; white-space: nowrap; color: #a11212; font-weight: bolder; margin-top: 75%; text-align: center; }
.bingo-container #antenna { margin: auto; position: absolute; bottom: 0; left: 0; top: 0; right: 0; top: -158px; height: 20px; margin-top: 121px; width: 9px; background-color: #a11212; animation: antenna-appear 7.5s infinite ease-in-out; }
.bingo-container #antenna #beam { position: absolute; top: -12.5px; left: -5px; height: 20px; width: 20px; border-radius: 50%; background-color: #a11212; animation: beam-appear 7.5s infinite ease-in-out; }
.bingo-container #antenna #beam-pulsar { position: absolute; top: -12.5px; left: -5px; height: 20px; width: 20px; border-radius: 50%; background-color: #a11212; animation: beam-pulsar-appear 7.5s infinite ease-in-out; }
@keyframes antenna-appear {
    0% { visibility: hidden; top: -100px; height: 0;}
    50% { visibility: hidden; top: -100px;  height: 0;}
    55% { visibility: visible; top: -125px; height: 20px;}
    95% { visibility: visible; top: -125px; height: 20px;}
    100% { top: -100px; height: 0;}
}
@keyframes beam-appear {
    0% { visibility: hidden; top: -12.5px; height: 0;}
    50% { visibility: hidden; top: -12.5px; height: 0;}
    55% { visibility: visible; top: -12.5px; height: 20px; width: 20px;}
    100% { visibility: visible; top: -12.5px; height: 20px; width: 20px;}
}
@keyframes beam-pulsar-appear {
    0% { visibility: hidden; top: -12.5px; height: 0;}
    50% { visibility: hidden; top: -12.5px; height: 0;}
    55% { visibility: visible; top: -12.5px; left: -5px; height: 20px; width: 20px; opacity: 1;}
    65% { top: -25px; left: -15px; height: 40px; width: 40px; opacity: 0; visibility: visible;}
    74% { visibility: hidden; opacity: 0;}
    75% { visibility: visible; top: -12.5px; left: -5px; height: 20px; width: 20px; opacity: 1;}
    85% { top: -25px; left: -15px; height: 40px; width: 40px; opacity: 0; visibility: visible;}
    94% { visibility: hidden; opacity: 0;}
    100% { visibility: hidden; opacity: 0;}
}
.card.alrt-card { background-color: #ffffff; width: 100%; padding: 10px; position: fixed; left: 130px; border-color: darkgray; bottom: 54px; box-shadow: 0 6px 8px 0px rgb(0 0 0 / 20%); display:none;}
.btn.close-alrt-btn{ line-height: 0px; position: absolute; font-size: 10px; color: white; cursor: pointer; background: #a11212; width: 15px; height: 15px; text-align: center; border-radius: 50%; box-shadow: 0 0 0 0; padding: 0px !important; right: -3% !important; top: -7px; }
.btn.close-alrt-btn i{ font-size: 7px; }
.btn.close-alrt-btn:hover{ color: #fff; }
.bingo-iframe-box{ position: relative;}
#chatiframe { top: 0vh; left: 2vw; width: 436px; margin-bottom: 0px !important; height: 100vh; border-width: 0px !important; z-index: 9999; position: fixed;}

@media screen and (max-device-width: 768px) {
    #chatiframe { position: fixed; top: 0px !important; left: 0px; bottom: 0px; right: 0px; width: 100vw !important; height: 100vh; height: calc(var(--vh, 1vh) * 100) !important; border: none; margin: 0; padding: 0; overflow: hidden; z-index: 999999;}
}


@media (max-width:767px){
	#wrapper-chat-col{ right: 0px; left: inherit; bottom: 40px;}
}