:root {
  --sdk-launcher-bgk-color: #088888;
  --sdk-launcher-position: 0 20px 20px 0;
  --sdk-animation-position: 0 20px 20px 0;
  --sdk-animation-width: 0px;
  --sdk-animation-height: 0px;
  --mdn-widget-height: 65vh;
  --mdn-widget-width: auto;
  --mdn-icon-height: 50px;
  --mdn-icon-width: 50px;
  --mdn-img-button-size: 15px;
}

.rctw-launcher {
  -webkit-animation-delay: 0;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: slide-in;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: 0.5s;
  -moz-animation-name: slide-in;
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: 0.5s;
  animation-name: slide-in;
  animation-fill-mode: forwards;
  align-self: flex-end;
  background-color: var(--sdk-launcher-bgk-color);
  border: 0;
  border-radius: 50%;
  box-shadow: #26394d 0 15px 25px -5px;
  margin-top: 10px;
  cursor: pointer;
  height: var(--mdn-icon-height);
  width: var(--mdn-icon-width);
  padding: 0 0 0 0;
}

.rctw-launcher:hover {
  box-shadow: rgba(0, 0, 0, 0.56) 0 10px 30px 4px;
}

.rctw-launcher:focus {
  outline: none;
}

.rctw-widget-open-launcher {
  width: 70%;
  height: 70%;
  -webkit-animation-delay: 0;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: rotation-rl;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: 0.5s;
  -moz-animation-name: rotation-rl;
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: 0.5s;
  animation-name: rotation-rl;
  animation-fill-mode: forwards;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.rctw-widget-close-launcher {
  width: 70%;
  height: 70%;
  -webkit-animation-delay: 0;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: rotation-lr;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: 0.5s;
  -moz-animation-name: rotation-lr;
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: 0.5s;
  animation-name: rotation-lr;
  animation-fill-mode: forwards;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.hidden-widget-launcher {
  display: none;
}

#mdn-chat-widget {
  bottom: 0;
  position: fixed;
  right: 0;
  margin: var(--sdk-launcher-position);
  width: var(--mdn-widget-width);
  display: flex;
  flex-direction: column;
  z-index: 2147483647;
}

#mdn-chat-widget .show {
  border: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  max-width: 100vw;
  min-width: 370px;
  right: 0;
  height: var(--mdn-widget-height);
  z-index: 2147483647;
  position: relative;
  width: 100%;
  box-shadow: rgba(0, 0, 0, 0.4) 0 30px 90px;
  border-radius: 10px;
}

#mondo-chat-widget-iframe {
  display: none;
}

.mdn-show-chat-widget .show {
  -webkit-animation-delay: 0;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: open-widget-web;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: 0.5s;
  -moz-animation-name: open-widget-web;
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: 0.5s;
  animation-name: open-widget-web;
  animation-fill-mode: forwards;
  width: var(--mdn-widget-width);
}

.rctw-launcher .rctw-badge {
  position: absolute;
  top: -1px;
  right: -5px;
  background-color: red;
  color: white;
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  border-radius: 50%;
  z-index: 9;
}

.rctw-hide-badge {
  display: none;
}

#mdn-chat-widget .offline {
  background-color: var(--sdk-launcher-bgk-color);
}

.rctw-launcher {
  -webkit-animation: scale-up-center 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) backwards;
  animation: scale-up-center 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) backwards;
}

@media screen and (max-width: 800px) {
  #mdn-chat-widget {
    margin: 0;
    max-width: none;
  }
  .mdn-show-chat-widget {
    height: 100%;
    width: 100%;
  }
  #mdn-chat-widget .show {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-width: none;
    width: 100%;
    border-radius: 0 0 0 0;
  }
  .rctw-launcher {
    bottom: 0;
    margin: var(--sdk-launcher-position);
    position: fixed;
    right: 0;
  }
  .launcher-rctw-sm-btn {
    display: none;
  }
}
@-webkit-keyframes rotation-rl {
  0% {
    transform: rotate(90deg);
  }
  to {
    transform: rotate(0);
  }
}
@keyframes rotation-rl {
  0% {
    transform: rotate(90deg);
  }
  to {
    transform: rotate(0);
  }
}
@-webkit-keyframes rotation-lr {
  0% {
    transform: rotate(-90deg);
  }
  to {
    transform: rotate(0);
  }
}
@keyframes rotation-lr {
  0% {
    transform: rotate(-90deg);
  }
  to {
    transform: rotate(0);
  }
}
@keyframes open-widget-web {
  0% {
    opacity: 0;
    transform: translateY(45px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@-webkit-keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
/* Widget animation style*/
.mdn-widget-animation-img.hide-animation {
  display: none !important;
}

.mdn-widget-animation-img {
  bottom: 0;
  position: fixed;
  right: 0;
  margin: var(--sdk-animation-position);
  z-index: 2147483647;
  width: var(--sdk-animation-width) !important;
  height: var(--sdk-animation-height) !important;
}

@-webkit-keyframes rotate-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(2) rotateZ(180deg);
    transform: scale(2) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@keyframes rotate-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(2) rotateZ(180deg);
    transform: scale(2) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@-webkit-keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  100% {
    -webkit-transform: translateZ(160px);
    transform: translateZ(160px);
  }
}
@keyframes slide-fwd-center {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  100% {
    -webkit-transform: translateZ(160px);
    transform: translateZ(160px);
  }
}
@-webkit-keyframes slide-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
  }
}
@keyframes slide-left {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
  }
}
.hide-animation {
  display: none !important;
}

@-webkit-keyframes slide-fwd-bottom-in-animation {
  from {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@-moz-keyframes slide-fwd-bottom-in-animation {
  from {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slide-fwd-bottom-in-animation {
  from {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@-webkit-keyframes slide-fwd-bottom-out-animation {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
}
@-moz-keyframes slide-fwd-bottom-out-animation {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
}
@keyframes slide-fwd-bottom-out-animation {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(var(--multiple-launcher-height, 50px));
  }
}
@-webkit-keyframes slide-in-fwd-center {
  from {
    opacity: 0;
    transform: translateZ(0);
  }
  to {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
}
@-moz-keyframes slide-in-fwd-center {
  from {
    opacity: 0;
    transform: translateZ(0);
  }
  to {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
}
@keyframes slide-in-fwd-center {
  from {
    opacity: 0;
    transform: translateZ(0);
  }
  to {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
}
@-webkit-keyframes slide-out-fwd-center {
  from {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 0;
    transform: translateZ(0);
  }
}
@-moz-keyframes slide-out-fwd-center {
  from {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 0;
    transform: translateZ(0);
  }
}
@keyframes slide-out-fwd-center {
  from {
    opacity: 1;
    transform: translateZ(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 0;
    transform: translateZ(0);
  }
}
@-webkit-keyframes slide-in-fwd-left {
  from {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
}
@-moz-keyframes slide-in-fwd-left {
  from {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
}
@keyframes slide-in-fwd-left {
  from {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
  to {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
}
@-webkit-keyframes slide-out-fwd-left {
  from {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
  to {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
}
@-moz-keyframes slide-out-fwd-left {
  from {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
  to {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
}
@keyframes slide-out-fwd-left {
  from {
    opacity: 1;
    transform: translateZ(0px) translateX(0px);
  }
  to {
    opacity: 0;
    transform: translateX(var(--multiple-launcher-height, 50px));
  }
}
@-webkit-keyframes rotation-in {
  from {
    opacity: 0;
    transform: rotate(90deg);
  }
  to {
    opacity: 1;
    transform: rotate(0);
  }
}
@-moz-keyframes rotation-in {
  from {
    opacity: 0;
    transform: rotate(90deg);
  }
  to {
    opacity: 1;
    transform: rotate(0);
  }
}
@keyframes rotation-in {
  from {
    opacity: 0;
    transform: rotate(90deg);
  }
  to {
    opacity: 1;
    transform: rotate(0);
  }
}
@-webkit-keyframes rotation-out {
  from {
    opacity: 1;
    transform: rotate(0);
  }
  to {
    opacity: 0;
    transform: rotate(90deg);
  }
}
@-moz-keyframes rotation-out {
  from {
    opacity: 1;
    transform: rotate(0);
  }
  to {
    opacity: 0;
    transform: rotate(90deg);
  }
}
@keyframes rotation-out {
  from {
    opacity: 1;
    transform: rotate(0);
  }
  to {
    opacity: 0;
    transform: rotate(90deg);
  }
}
@-webkit-keyframes rotate-in-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@-moz-keyframes rotate-in-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@keyframes rotate-in-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@-webkit-keyframes rotate-out-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(0) rotateZ(360deg);
    transform: scale(0) rotateZ(360deg);
  }
}
@-moz-keyframes rotate-out-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(0) rotateZ(360deg);
    transform: scale(0) rotateZ(360deg);
  }
}
@keyframes rotate-out-scale-up {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(1.4) rotateZ(80deg);
    transform: scale(1.4) rotateZ(80deg);
  }
  100% {
    -webkit-transform: scale(0) rotateZ(360deg);
    transform: scale(0) rotateZ(360deg);
  }
}
.launcher-span {
  align-self: flex-end;
}

.mdn-widget-animation-img.in {
  -webkit-animation-delay: 0;
  -webkit-animation-duration: var(--sdk-widget-animation-in-time, 500ms);
  -webkit-animation-name: var(--sdk-widget-animation-in-animation, slide-in);
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: var(--sdk-widget-animation-in-time, 500ms);
  -moz-animation-name: var(--sdk-widget-animation-in-animation, slide-in);
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: var(--sdk-widget-animation-in-time, 500ms);
  animation-name: var(--sdk-widget-animation-in-animation, slide-in);
  animation-fill-mode: forwards;
}
.mdn-widget-animation-img.out {
  -webkit-animation-delay: 0;
  -webkit-animation-duration: var(--sdk-widget-animation-out-time, 500ms);
  -webkit-animation-name: var(--sdk-widget-animation-out-animation, slide-out);
  -webkit-animation-fill-mode: forwards;
  -moz-animation-delay: 0;
  -moz-animation-duration: var(--sdk-widget-animation-out-time, 500ms);
  -moz-animation-name: var(--sdk-widget-animation-out-animation, slide-out);
  -moz-animation-fill-mode: forwards;
  animation-delay: 0;
  animation-duration: var(--sdk-widget-animation-out-time, 500ms);
  animation-name: var(--sdk-widget-animation-out-animation, slide-out);
  animation-fill-mode: forwards;
}

.btn-access__content {
  cursor: pointer !important;
}

/* Fixing the Safari bug for `<button>`s overflow */
.btn-access__content {
  position: relative !important;
}

.focus-access:focus > .btn-access__content {
  box-shadow: 0 0 2px 2px black !important;
}

/* Removing default outline only after we've added our custom one */
.focus-access:focus,
.btn-access__content:focus {
  outline: none !important;
}

.visuallyhidden {
  position: absolute;
  left: 0;
  top: -500px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}