.snackbar {
    visibility: hidden;
    min-width: 250px;
    max-width: 500px;
    text-align: center;
    padding: 16px;
    position: fixed;
    z-index: 1000;
    left: 0px;
    bottom: 0px;
    font-size: large;
  }

  .snackbar.show {
    visibility: visible;
    -webkit-animation: broadcastfadein 0.5s;
    animation: broadcastfadein 0.5s;
  }

  .snackbar.hide {
      visibility: visible;
      -webkit-animation: broadcastfadeout 0.5s;
    animation: broadcastfadeout 0.5s;
  }

  .snackbar-button {
    visibility: hidden;
    display: none !important;
    min-width: 100px;
  }

  .snackbar-button.show {
    visibility: visible;
    display: inline !important;
  }

  #paBroadcastMessage {
    overflow-y: scroll;
    max-height: 200px;
  }


  /* Animations to fade the snackbar in and out */
  @-webkit-keyframes broadcastfadein {
    from {left: -200px; opacity: 0;}
    to {left: 0px; opacity: 1;}
  }

  @keyframes broadcastfadein {
    from {left: -200px; opacity: 0;}
    to {left: 0px; opacity: 1;}
  }

  @-webkit-keyframes broadcastfadeout {
    from {left: 0px; opacity: 1;}
    to {left: -200px; opacity: 0;}
  }

  @keyframes broadcastadeout {
    from {left: 0px; opacity: 1;}
    to {left: -200px; opacity: 0;}
  }