
* {
 margin: 0;
 padding: 0;
}

body, html{
font-family: 'Plus Jakarta Sans', sans-serif;
margin: 0;
padding: 0;
background: #000;
color: #fff;
-webkit-tap-highlight-color: transparent;
user-select: none;
font-size: 16px;
justify-content: center;
display: flex;
align-items: bottom;
height: 100vh;
}
      /* Estilo para tornar o vídeo em tela cheia */
      iframe {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          object-fit: cover;
      }

    
      /* Estilos para centralizar o conteúdo de texto */
      .centered-content {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          text-align: center;
          color: white;
          font-size: 24px;
      }

      /* Estilos para o rodapé */
      .footer {
          position: absolute;
          bottom: 60px;
          left: 50%;
          transform: translateX(-50%);
          text-align: left;
          font-size: 16px;
          width: 100%;
      }

      /* Estilos para a div superior */
      .logo {
          position: fixed;
          top: 7px;
          left: 7px;
          z-index: 2;
      }

      .top-content {
          position: absolute;
          top: 20px;
          margin-left: 150px;
          transform: translateX(-50%);
          text-align: left;
          font-weight: 600;
          color: #fff;
      }

      .marquee-container {
          overflow: hidden;
          white-space: nowrap;
          color: #fff;
      }

      .marquee-content {
          display: inline-block;
          animation: marquee 30s linear infinite;
          font-size: 1.8rem;
          width: 100%;
      }

      @keyframes marquee {
          from {
              transform: translateX(100%);
          }

          to {
              transform: translateX(-100%);
          }
      }

      h1 {
          font-size: 19px;
          text-align: left;
          vertical-align: top;
          font-family: 'Plus Jakarta Sans', sans-serif;
          font-weight: 600;
      }

      .logo-popup {
          display: flex;
          align-items: center;
      }

      .logo-popup img {
          margin-right: 10px;
          text-align: left;
          height: 60px;
          width: 60px;
          border-radius: 10px;
      }

      .banner-header {
          width: 250px;
          height: 120px;
      }

      @keyframes pulse {
          0% {
              transform: scale(1);
              opacity: 1;
          }

          50% {
              transform: scale(1.1);
              opacity: 0.7;
          }

          100% {
              transform: scale(1);
              opacity: 1;
          }
      }

      .copyright {
          display: flex;
          justify-content: center;
          align-items: center;
          position: fixed;
          width: 100%;
          height: 20px;
          letter-spacing: 1px;
          color: #ffffff;
          font-size: 0.7rem;
          text-align: center;
          bottom: 0;
          font-weight: 300;
          opacity: 0.5;
      }

      /*POPUP DOAÇÃO*/
      .popup {
          display: none;
          position: fixed;
          bottom: 0;
          left: 0;
          width: 100%;
          background-color: rgba(0, 0, 0, 0.9);
          border-top: 1px solid #00FFBF;
          overflow: hidden;
          color: #fff;
          z-index: 2;
          -webkit-border-top-left-radius: 15px;
          -webkit-border-top-right-radius: 15px;
          -moz-border-radius-topleft: 15px;
          -moz-border-radius-topright: 15px;
          border-top-left-radius: 15px;
          border-top-right-radius: 15px;
          animation: slideUp 0.5s ease-out forwards;
      }

      .popup h1 {
          color: #fff;
      }

      @keyframes slideUp {
          from {
              transform: translateY(100%);
          }

          to {
              transform: translateY(0);
          }
      }

      @keyframes slideDown {
          from {
              transform: translateY(0);
          }

          to {
              transform: translateY(100%);
          }
      }

      .popup-content {
          font-family: 'Plus Jakarta Sans', sans-serif;
          padding: 20px;
          background: #726232;
          background: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.5)), url('bg.jpg') no-repeat center center fixed;
          background-size: cover;
      }

      .qrcode {
          margin: 15px 0px;
      }

      .btn {
          margin: 15px 0px;
          align-items: center;
          display: flex;
          justify-content: space-between;
      }

      .key1 {
          padding: 10px 20px;
          background: rgba(0, 0, 0, 0.2);
          border: 2px solid #00FFBF;
          color: #00FFBF;
          border-radius: 20px;
          font-size: 1rem;
          font-weight: 500;
          cursor: pointer;
          font-family: 'Plus Jakarta Sans', sans-serif;
      }

      .key2 {
          padding: 10px 20px;
          background: rgba(0, 0, 0, 0.4);
          border: 2px solid #f765d5;
          color: #f765d5;
          border-radius: 20px;
          font-size: 1rem;
          font-weight: 500;
          cursor: pointer;
          font-family: 'Plus Jakarta Sans', sans-serif;
      }

      .close-button {
          font-weight: 500;
          width: 100%;
          height: 40px;
          background: rgba(0, 0, 0, 0.4);
          color: #fff;
          cursor: pointer;
          font-size: 1rem;
          border: none;
          border-radius: 7px;
          margin-top: 10px;
          font-family: 'Plus Jakarta Sans', sans-serif;
      }

      input {
          display: none;
      }

      .chave {
          display: none;
      }

      /* Adicione as classes CSS para personalizar o estilo do SweetAlert */
      .swal-title-custom {
          color: #252E48 !important;
          font-size: 26px !important;
      }

      .swal-text-custom {
          font-weight: 500 !important;
          font-size: 16px;
          color: #252E48 !important;
      }

      /*anime icon*/
      .swal2-header {
          padding: 0 !important;
      }

      .swal2-success-line-tip {
          background: orange !important;
      }

      .swal2-success-line-long {
          background: orange !important;
      }

      .swal2-icon.swal2-success .swal2-success-ring {
          position: absolute;
          z-index: 2;
          top: -0.25em;
          left: -0.25em;
          box-sizing: content-box;
          width: 100%;
          height: 100%;
          border: 0.25em solid orange !important;
          border-radius: 50%;
      }

      .swal2-popup .swal2-styled.swal2-confirm {
          border: 0;
          border-radius: 2em !important;
          background-color: #f29200 !important;
          color: #fff !important;
          font-size: 1.0625em !important;
      }

      /*ANIME ARROW UP*/
      .div-time {
          position: absolute;
          top: 65px;
          right: 48px;
      }

      .animar-imagem {
          animation: moverCimaBaixo 1s ease-in-out infinite;
          /* Animar por 2 segundos, repetir infinitamente */
      }

      @keyframes moverCimaBaixo {
          0%, 100% {
              transform: translateY(0);
              /* Posição inicial e final */
          }

          50% {
              transform: translateY(-20px);
              /* Posição no meio da animação */
          }
      }

      /*END ANIME ARROW UP*/
      ion-icon {
          font-size: 28px;
          color: #fff;
      }

      .icons-name p, a {
          color: #fff;
          font-size: 14px;
          text-decoration: none;
      }

      .botoes {
              position: absolute;
              z-index: 1;
              display: flex;
              text-align: center;
              border-radius: 5px;
              align-items: center;
              padding: 7px;
              justify-content: space-between;
              gap: 25px;
              background: rgba(0,0,0,0.1);
              bottom: 60;
      }

      .pulsing-icon {
          animation: pulse 2s infinite;
          
      }
