.az-box-chat { position: fixed; bottom: 20px; right: 0; z-index: 100;}
.float-hotline { position: fixed; bottom: 20px; right: 10px; z-index: 9999; }
.float-hotline .hotline { background: #49842d !important; border-radius: 20px; color: #fff; padding: 13px; display: block; margin-bottom: 6px; }
.hotline a { font-size: 17px; color: #fff; text-decoration: none; font-weight: 400; text-transform: none; line-height: 0; display: inline-block; }
.zalo-chat { top: 26px; left: 27px; z-index: 2; position: absolute; width: 40px; -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; }
.facebook-ring-wrap { }
@media (max-width:768px) {
  body { overflow-x: hidden; }
  .hotline-phone-ring-wrap { right: 0 !important; }
  .hotline-phone-ring { bottom: 0 !important; }
  .facebook-ring-wrap { left: unset !important; }
  .hotline-phone-ring-wrap.az-holine .hotline-phone-ring { width: 220px; }
  .hotline-bar { padding-left: 10px; }
}
.hotline-phone-ring-wrap { }
.hotline-phone-ring { position: relative; visibility: visible; background-color: transparent; width: 110px; height: 110px; cursor: pointer; z-index: 11; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); transition: visibility .5s; left: 0; bottom: 0; display: block; }
.hotline-phone-ring-circle { width: 90px; height: 90px; background-color: transparent; border-radius: 100%; border: 2px solid #1564a7; -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; transition: all .5s; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; opacity: 0.5; }
.hotline-phone-ring-circle-fill { width: 60px; height: 60px; background-color: rgba(103, 185, 255, 0.7); border-radius: 100%; border: 2px solid transparent; -webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out; animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out; transition: all .5s; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.hotline-phone-ring-img-circle { background-color: #1564a7; width: 50px; height: 50px; top: 20px; left: 20px; position: absolute; background-size: 20px; border-radius: 100%; border: 2px solid transparent; -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; justify-content: center; }
.hotline-phone-ring-img-circle .pps-btn-img { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
.hotline-phone-ring-img-circle .pps-btn-img img { width: 33px; height: 33px; }
.hotline-bar { position: absolute; background: #1564a7; height: 45px; line-height: 40px; border-radius: 3px; padding: 0 10px; background-size: 100%; cursor: pointer; transition: all 0.8s; -webkit-transition: all 0.8s; z-index: 9; border-radius: 50px !important; right: 60px; bottom: 10px; padding-right: 40px; }
.hotline-bar>a { color: #fff; text-decoration: none; font-size: 16px; font-weight: bold; text-indent: 15px; letter-spacing: 1px; display: block; line-height: 45px; font-family: Arial; }
.hotline-bar>a:hover, .hotline-bar>a:active { color: #fff; }
@-webkit-keyframes phonering-alo-circle-anim {
  0% { -webkit-transform: rotate(0) scale(0.5) skew(1deg); -webkit-opacity: 0.1; }
  30% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); -webkit-opacity: 0.5; }
  100% { -webkit-transform: rotate(0) scale(1) skew(1deg); -webkit-opacity: 0.1; }
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
  0% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.6; }
  50% { -webkit-transform: rotate(0) scale(1) skew(1deg); opacity: 0.6; }
  100% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.6; }
}
@-webkit-keyframes phonering-alo-circle-img-anim {
  0% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
  10% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg); }
  20% { -webkit-transform: rotate(25deg) scale(1) skew(1deg); }
  30% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg); }
  40% { -webkit-transform: rotate(25deg) scale(1) skew(1deg); }
  50% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
  100% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
}
.facebook-ring-wrap { height: 95px; position: relative; width: 100px; }
.chat-face-ring { }
.facebook-chat-circle { width: 90px; height: 90px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid #1564a7; -webkit-animation: face-chat-circle-anim 1.2s infinite ease-in-out; animation: face-chat-circle-anim 1.2s infinite ease-in-out; transition: all .5s; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; opacity: 0.5; }
.chat-face-circle-fill { width: 60px; position: absolute; top: 15px; left: 15px; height: 60px; background-color: rgba(103, 185, 255, 0.7); border-radius: 100%; border: 2px solid transparent; -webkit-animation: facechat-circle-fill-anim 2.3s infinite ease-in-out; animation: facechat-circle-fill-anim 2.3s infinite ease-in-out; transition: all .5s; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }
.chat-face-img-circle { width: 45px; position: absolute; top: 24px; left: 22px; z-index: 2; height: 45px; background-size: 20px; border-radius: 100%; border: 2px solid transparent; -webkit-animation: face-chat-circle-img-anim 1s infinite ease-in-out; animation: face-chat-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; justify-content: center; }
.chat-face-img-circle .fct-btn-img img { width: 50px; height: 50px; }
@-webkit-keyframes face-chat-circle-anim {
  0% { -webkit-transform: rotate(0) scale(0.5) skew(1deg); -webkit-opacity: 0.1; }
  30% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); -webkit-opacity: 0.5; }
  100% { -webkit-transform: rotate(0) scale(1) skew(1deg); -webkit-opacity: 0.1; }
}
@-webkit-keyframes facechat-circle-fill-anim {
  0% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.6; }
  50% { -webkit-transform: rotate(0) scale(1) skew(1deg); opacity: 0.6; }
  100% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.6; }
}
.hotline-phone-ring-wrap.az-holine { }
.hotline-phone-ring-wrap.az-holine .hotline-phone-ring { height: 80px }
.hotline-phone-ring-wrap.az-holine .hotline-phone-ring-circle-fill { top: 27px; left: 26px }
.hotline-phone-ring-wrap.az-holine .hotline-phone-ring-circle { top: inherit; bottom: -23px; left: 12px; }