button {
            font-size: 24px;
            padding: 10px 20px;
            cursor: pointer;
        }
    /* Creating overlay */
    .overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.5); /* trasparency */
      display: none; /* not showed by default */
      z-index: 9999; /* overlaps other elements */
    }

    /* Loading animation */
    @keyframes spin {
      0% {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(360deg);
      }
    }

    .spinner {
      border: 5px solid #f3f3f3;
      border-top: 5px solid #3498db;
      border-radius: 50%;
      width: 50px;
      height: 50px;
      animation: spin 1s linear infinite;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -25px;
      margin-left: -25px;
    }

    /* Waiting massage */
    .message {
      color: white;
      font-size: 24px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
      width: 80%;
    }
  
[data-legacy-style="legacy-style-1"] {font-size: 1rem;}
[data-legacy-style="legacy-style-2"] {border: 2px solid #ababab; padding: 10px; border-radius: 10px; margin: 5px;}
[data-legacy-style="legacy-style-3"] {text-align:center}
[data-legacy-style="legacy-style-4"] {border: 2px dotted #ababab; padding: 10px; margin: 0 auto; display: block; text-align: center;}
[data-legacy-style="legacy-style-5"] {width: 80%; margin: 0 auto; display: block;}
[data-legacy-style="legacy-style-6"] {font-size:75%;}