.skype-button {
  font-family: "Segoe UI Local", "Segoe WP", "Segoe UI Web", "Segoe UI Arabic Web", "Segoe UI Cyrillic Web", "Segoe UI Greek Web", "Segoe UI Hebrew Web", Tahoma, "Helvetica Neue", Helvetica, "Meiryo UI", Meiryo, Arial Unicode MS, sans-serif;
  cursor: pointer; }
  .skype-button.icononly .lwc-button-text {
    display: inherit; }
  .skype-button.textonly .lwc-button-icon {
    display: none; }
  .skype-button.textonly.icononly {
    display: inherit;
    display: inherit; }

.lwc-chat-button {
  border-radius: 0;
  background-color: #00AFF0;
  display: inline-flex;
  font-size: 12px;
  padding: 4px 12px;
  text-align: center;
  line-height: 26px;
  cursor: pointer;
  color: white;
  fill: transparent;
  align-items: center;
  box-sizing: content-box;
  z-index: 2147483647; }
  .lwc-chat-button #message-icon {
    fill: #FEFEFE; }
  .lwc-chat-button #circle {
    fill: transparent; }
  .lwc-chat-button.theme-black #circle {
    fill: #1f1f1f; }

.lwc-button-icon {
  box-sizing: content-box;
  margin-right: 8px;
  align-items: center;
  width: 20px;
  display: flex; }

.lwc-button-text {
  letter-spacing: 0px;
  margin-left: 0px;
  margin-bottom: 0px;
  font-size: 15px; }

.bubble .lwc-chat-button {
  position: fixed;
  padding: 0;
  width: 60px;
  height: 60px;
  border-radius: 30px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
  right: 20px;
  bottom: 50px; }

.bubble .lwc-button-icon {
  padding: 14px;
  margin-right: 0;
  width: 32px;
  display: flex;
  align-items: center; }

.bubble .lwc-button-text {
  opacity: 0;
  max-width: 0; }

.rounded .lwc-chat-button {
  border-radius: 30px; }

.lwc-chat:hover {
  border-color: #B6B6B6;
  background-color: #EEE; }

.lwc-chat-frame {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 370px;
  max-height: 590px;
  height: calc(100vh - 75px);
  border-radius: 10px;
  overflow: hidden;
  transition: max-height .2s, width .2s, height .2s, bottom .2s, right .2s;
  box-shadow: 0 0 0 0;
  z-index: 2147483647;
  background: #fff;
  box-shadow: 0px 0px 7px 1px #ababab; }
  .lwc-chat-frame.collapsed {
    height: 75px; }

.fullscreen .lwc-chat-frame {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 100%;
  border-radius: 0; }

.inline .lwc-chat-frame {
  position: relative;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  right: 0;
  left: 0;
  max-height: none;
  border-radius: 0; }

.sidebar.right .lwc-chat-frame {
  right: 0; }

.sidebar.left .lwc-chat-frame {
  left: 0; }

.sidebar .lwc-chat-frame {
  position: absolute;
  top: 0;
  bottom: 0;
  height: 100%;
  max-height: none;
  border-radius: 0; }

@media screen and (max-width: 1200px) {
  .lwc-chat-frame {
    width: 330px;
    max-height: 490px; } }

@media screen and (max-width: 470px) {
  .lwc-chat-frame {
    bottom: 0;
    right: 0;
    max-height: 100vh;
    height: 100%;
    width: 100%;
    border-radius: 0; } }

.open-bubble {
  animation: open-bubble-anim 400ms cubic-bezier(0, 0, 0, 1) both; }

.close-bubble {
  animation: close-bubble-anim 400ms 360ms cubic-bezier(0, 0, 0, 1) both; }

@keyframes open-bubble-anim {
  0% {
    opacity: 1;
    transform: translateY(0) scale(1) rotate(0); }
  99% {
    opacity: 0;
    transform: translateY(20px) scale(0.6) rotate(45deg);
    display: auto; }
  100% {
    display: none;
    opacity: 0; } }

@keyframes close-bubble-anim {
  0% {
    display: none;
    opacity: 0; }
  1% {
    opacity: 0;
    transform: translateY(20px) scale(0.6) rotate(45deg);
    display: auto; }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1) rotate(0); } }

.open-chat {
  transform-origin: bottom right;
  animation: open-chat-anim 460ms 200ms cubic-bezier(0, 0, 0, 1) both; }

.close-chat {
  transform-origin: bottom right;
  animation: close-chat-anim 460ms cubic-bezier(0, 0, 0, 1) both; }

@keyframes open-chat-anim {
  0% {
    display: none;
    opacity: 0;
    visibility: visible; }
  1% {
    display: auto;
    transform: scale(0.8);
    opacity: 0;
    box-shadow: 0 6px 20px transparent; }
  100% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2); } }

@keyframes close-chat-anim {
  0% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    display: auto; }
  99% {
    transform: scale(0.8);
    opacity: 0;
    box-shadow: 0 6px 20px transparent;
    display: auto; }
  100% {
    display: none;
    opacity: 0;
    visibility: collapse; } }
