<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="iso-8859-1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<title>Loteca - Placar e pesquisa de bolões - Loterias IA</title>
    <style>
	.blink_text
{
    animation:1s blinker linear infinite;
    -webkit-animation:1s blinker linear infinite;
    -moz-animation:1s blinker linear infinite;
    color: red;
}

@-moz-keyframes blinker
{  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker
{  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@keyframes blinker
{  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
 }
 
	.modal2 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 2000; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

}
.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


		.modal-table-container {
    flex: 1;                /* Faz o container ocupar o espaço disponível */
    overflow-y: auto;       /* Ativa o scroll vertical quando o conteúdo exceder a altura */
    overflow-x: auto;       /* Ativa o scroll horizontal se a tabela for muito larga */
    -webkit-overflow-scrolling: touch; /* Melhora o scroll em dispositivos iOS */
    max-height: 70vh;       /* Define uma altura máxima baseada na tela para garantir o scroll */
}

.modal-table {
    width: 100%;
    border-collapse: collapse;
}

        * { margin: 0; padding: 0; box-sizing: border-box; }
        html, body { min-height: 100%; background-color: #d1d8e0; font-family: 'Segoe UI', sans-serif; overflow-y: auto; }

        /* Topo */
        .header-top { width: 100%; max-width: 1600px; margin: 0 auto; padding: 8px 20px 0 20px; display: flex; justify-content: space-between; align-items: center; }
        .trophy-container { display: flex; gap: 15px; align-items: center; }
        .trophy-item { display: flex; flex-direction: column; align-items: center; gap: 2px; cursor: pointer; }
        .trophy-default { font-size: 20px; }
        .jogos-link, .trophy-label { font-weight: 800; font-size: 10px; text-transform: uppercase; color: #000; cursor: pointer; text-align: center; }

        /* Auth */
        .auth-container { display: flex; align-items: center; gap: 12px; }
        .promo-text { color: #a0522d; font-weight: 800; font-size: 9px; text-transform: uppercase; letter-spacing: 0.5px; }
        .btn-assinar { background: #27ae60; color: white; border: none; padding: 4px 10px; border-radius: 4px; font-weight: 800; font-size: 10px; text-transform: uppercase; cursor: pointer; }
        .login-link { color: #000; font-weight: 800; text-transform: uppercase; cursor: pointer; font-size: 10px; }
        .user-info-box { display: flex; flex-direction: column; align-items: center; gap: 2px; }
        .user-logged { font-weight: 800; font-size: 10px; text-transform: uppercase; color: #2980b9; cursor: pointer; }
        .days-left { font-weight: 800; font-size: 10px; text-transform: uppercase; color: #000; }

        @media (min-width: 1100px) {
            .promo-text { font-size: 12px; }
            .btn-assinar, .login-link, .jogos-link, .trophy-label, .user-logged, .days-left { font-size: 14px; }
            .trophy-default { font-size: 28px; }
        }

        /* MODAIS */
        .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); display: none; z-index: 1000; justify-content: center; align-items: center; }
        .modal-content { width: 90%; max-width: 400px; background: #fff; border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; padding-bottom: 20px; }
        .modal-content.full { height: 85%; max-width: 90%; }
        .modal-header { padding: 15px; display: flex; justify-content: space-between; align-items: center; background: #f1f1f1; font-weight: 800; text-transform: uppercase; font-size: 12px; }
        .modal-body { flex: 1; display: flex; flex-direction: column; padding: 20px; gap: 12px; overflow-y: auto; }
        .btn-close { background: #666; color: white; border: none; padding: 5px 15px; border-radius: 5px; cursor: pointer; font-weight: 800; }
        .modal-textarea-full { flex: 1; width: 100%; height: 100%; padding: 20px; border: none; resize: none; font-family: monospace; font-size: 16px; outline: none; background: #fff; }
        
        .input-form { width: 100%; padding: 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; outline: none; }
        .password-container { position: relative; width: 100%; }
        .toggle-password { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer; font-size: 18px; user-select: none; }
        .instruction-text { font-size: 9px; font-weight: 800; color: #e67e22; text-transform: uppercase; margin-bottom: -10px; }
        .optional-text { font-size: 9px; font-weight: 800; color: #7f8c8d; text-transform: uppercase; margin-bottom: -10px; line-height: 1.2; }
        .form-link { font-size: 11px; font-weight: 800; text-transform: uppercase; color: #2980b9; cursor: pointer; text-align: center; margin-top: 5px; }

        /* Layout Principal */
        .page-wrapper { display: flex; flex-direction: row; gap: 20px; padding: 10px 20px; width: 100%; max-width: 1600px; margin: 0 auto; }
        .main-container, .side-container { background: #fff; border-radius: 12px; box-shadow: 0 15px 30px rgba(0,0,0,0.2); border: 1px solid rgba(0,0,0,0.1); }
        .main-container { width: 100%; max-width: 900px; display: flex; flex-direction: column; }
        .side-container { width: 380px; flex-shrink: 0; align-self: flex-start; padding-bottom: 15px; }

        @media (max-width: 1100px) {
            .page-wrapper { flex-direction: column; align-items: center; }
            .side-container { width: 100%; max-width: 800px; }
        }

        /* Tabelas */
        .main-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
        .main-table thead { background: linear-gradient(180deg, #444, #111); color: #fff; }
        .main-table th { padding: 12px 5px; font-size: 10px; text-transform: uppercase; font-weight: 800; }
        .main-table td { padding: 8px 8px; vertical-align: middle; border-bottom: 1px solid rgba(0,0,0,0.05); }
        .main-table tr:nth-child(even) { background: #f9f9f9; }
        .team-text, .vs-text { font-weight: 800; font-size: 11px; text-transform: uppercase; color: #222; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
     /* .team-text, .vs-text { font-weight: 800; font-size: 12px; text-transform: uppercase; color: #222; cursor: pointer; user-select: none; } */
        .goal-info { display: flex; align-items: center; gap: 4px; margin-top: 4px; }
        .goal-icon { width: 14px; height: 14px; object-fit: contain; }
        .goal-text { font-size: 12px; font-weight: 700; color: #444; text-transform: lowercase; }

        .circle { flex-shrink: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0,0,0,0.15); transition: 0.2s; }
        .num-circle { width: 17px; height: 17px; background: #000; color: white; font-weight: 900; font-size: 9px; }
        .select-circle { width: 15px; height: 15px; background: #eee; border: 1px solid #bbb; cursor: pointer; }
        .select-circle.active-blue { background: radial-gradient(circle, #3399ff, #004085); border-color: #002752; transform: scale(1.1); }
        .select-circle.active-yellow { background: radial-gradient(circle, #ffff00, #ccac00); border-color: #998000; transform: scale(1.1); }
        
        .side-table { width: 100%; border-collapse: collapse; }
        .side-table td { padding: 15px 12px; border-bottom: 1px solid #eee; }
        .label-cell { font-weight: 800; font-size: 11px; text-transform: uppercase; color: #333; }
        .btn-group { display: flex; gap: 6px; justify-content: flex-end; }
        .btn-opt { width: 34px; height: 34px; border-radius: 5px; border: 1px solid #ccc; cursor: pointer; font-weight: 800; background: #fff; }
        .btn-opt.active { background: #007bff; color: #fff; }
        .btn-blue { width: 100%; padding: 12px; border: none; border-radius: 8px; background: linear-gradient(180deg, #3399ff, #004085); color: white; font-weight: 800; cursor: pointer; text-transform: uppercase; }
        .input-pesquisa { width: 100%; padding: 10px; border-radius: 6px; border: 1px solid #ccc; font-size: 13px; outline: none; }
        .hidden { display: none !important; }
		
		.team-text { 
    display: block;           /* Força o elemento a respeitar a largura */
    max-width: 140px;         /* Valor ideal para desktop (900px total) */
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    font-weight: 800; 
    font-size: 11px; 
    text-transform: uppercase; 
    color: #222; 
    line-height: 1.1;
}


/* Ajuste para telas menores (Celulares) */
@media (max-width: 600px) {
    /* Faz a tabela ocupar a largura total da tela */
    .main-table {
        width: 100% !important;
        table-layout: auto;
    }

    /* Reduz a fonte de todos os textos dentro da tabela (exceto o header da página) */
    .main-table td, 
    .main-table th,
    .goal-text,
    .num-circle {
        font-size: 9px !important;
    }

    /* Aumenta a largura dos nomes dos times mantendo o "..." */
    .team-text {
        max-width: 60px; 
        font-size: 9px !important; /* Garante os 9px aqui também */
        display: inline-block;
        vertical-align: middle;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Ajuste de respiro lateral para não cortar a tabela na borda da tela */
    .page-wrapper {
        padding: 10px 5px;
    }
	
	.modal-textarea-full {
		min-width: 500px; 
		font-size: 13px;
	}
}
}

    </style>
</head>
<body onload="Vfy()">
<!-- MODAL SUPORTE -->
<div id="modalSuporte" class="modal-overlay">
    <div class="modal-content"  style="max-width: 900px;">
        <div class="modal-header">Suporte <button class="btn-close" onclick="toggleModal('modalSuporte')">X</button></div>
        <div class="modal-body">
            <p class="optional-text" style="margin-bottom: 5px;">suporte</p>
            <!-- Textarea com rolagem automática se o texto for grande -->
            <textarea class="input-form" style="height: 350px; width: 100%; resize: none; overflow-y: auto; font-size: 16px;" readonly>o processamento do pagamento é realizado pela PagBank.
Caso tenha pago por boleto, o processamento poderá levar até 3 dias úteis.

Caso tenha pago por Cartão de crédito e o liberamento não foi realizado em até 30 minutos,
O pagamento poderá estar em análise pelo PagBank.

Pagamentos por pix são processado em menos de 10 minutos.
Caso precise entrar em contato, envie um email para PedroLfreire2@hotmail.com, informando no campo de assunto 'pagamento não realizado',
e no email, informe seu cpf e o método de pagamento.

Após isso, seu atendimento poderá ser realizado em 48horas.

você pode procurar pelo meu canal no youtube 'lotecaemalta' e enviar uma mensagem para qualquer um dos vídeos informando que seu email foi enviado.

por favor, não informe cpf ou nenhum dado via youtube.
obrigado.</textarea>
            
        </div>
    </div>
</div>

<div id="myModal2" class="modal2">
		<div style="background-color: rgba(0,0,0,0.0);margin: auto;padding: 20px;border: 1px solid #888;width: 12%;">
			<div class="loader">
			</div>
		</div>
		</div>
	  </div>
	  
<header class="header-top">
    <div class="trophy-container">
    <div class="trophy-item" onclick="ranking1();"><span class="trophy-default">🏆</span><span class="trophy-label">Secos</span></div>
    <div class="trophy-item" onclick="ranking2();"><span class="trophy-default">🏆</span><span class="trophy-label">Totais</span></div>
    <!-- Novo botão de suporte -->
    <div id = "btnSuporte" style= "display:none" class="trophy-item" onclick="toggleModal('modalSuporte')">
        <span class="trophy-default">💬</span>
        <span  id="suporte" class="trophy-label">Suporte | Processamento não realizado</span>
    </div>
	</div>
	
    <div class="auth-container">
		<div id="tema-wrapper" onclick="AlternarTema()" style="display: flex; flex-direction: column; align-items: center; cursor: pointer; margin-right: 15px;">
        <span id="tema-toggle" style="font-size: 28px; line-height: 1;">🌙</span>
        <span id="tema-texto" style="font-weight: 800; font-size: 10px; text-transform: uppercase; color: #000;">Modo Noite</span>
    </div>
	
		<span class="promo-text auth-logged-out">Cadastre ou logue para assinar</span>
        <button class="btn-assinar auth-logged-out" onclick="ExibirPlano(this);">Promoção apenas R$25,00/mês</button>
        <span class="login-link auth-logged-out" onclick="toggleModal('modalLogin')">Login</span>
        <div class="user-info-box auth-logged-in hidden">
            <span class="user-logged" onclick="deslog()">Olá, Usuário (Sair)</span>
            <span class="days-left">0</span>
        </div>
    </div>
</header>

<div class="page-wrapper">
    <main class="main-container">
        <table class="main-table">
            <thead><tr><th width="40">Nº</th><th >Mandante</th><th >Empate</th><th>Visitante</th><th width="60" >Dia</th></tr></thead>
            <tbody id="table-body"></tbody>
        </table>
		<div class="legenda-container" style="padding: 10px; border-top: 1px solid rgba(0,0,0,0.1);">
    <div style="display: flex; align-items: center; gap: 8px; margin-bottom: 5px;">
        <span class="circle select-circle active-blue" style="width: 15px; height: 15px;"></span>
        <span class="legenda-text" style="font-size: 11px; font-weight: 800; text-transform: uppercase;">Clique na bolinha para marcação seca</span>
    </div>
    <div style="display: flex; align-items: center; gap: 8px;">
        <span class="circle select-circle active-yellow" style="width: 15px; height: 15px;"></span>
        <span class="legenda-text" style="font-size: 11px; font-weight: 800; text-transform: uppercase;">Clique no nome para marcação passível de estar cercada na pesquisa</span>
    </div>
</div>
    </main>
    <aside class="side-container">
        <table class="side-table">
            <tbody>
                <tr><td class="label-cell">Triplos que pode errar</td><td><div class="btn-group">
                    <button class="btn-opt active" onclick="selectBtnTriplos(this,0)">0</button>
                    <button class="btn-opt" onclick="selectBtnTriplos(this,1)">1</button>
                    <button class="btn-opt" onclick="selectBtnTriplos(this,2)">2</button>
                    <button class="btn-opt" onclick="selectBtnTriplos(this,3)">3</button>
                    <button class="btn-opt" onclick="selectBtnTriplos(this,4)">4</button>
                </div></td></tr>
                <tr><td class="label-cell">Amarelos que pode errar</td><td><div class="btn-group">
                    <button class="btn-opt active" onclick="selectBtnAmarelos(this,0)">0</button>
                    <button class="btn-opt" onclick="selectBtnAmarelos(this,1)">1</button>
                    <button class="btn-opt" onclick="selectBtnAmarelos(this,2)">2</button>
                    <button class="btn-opt" onclick="selectBtnAmarelos(this,3)">3</button>
                    <button class="btn-opt" onclick="selectBtnAmarelos(this,4)">4</button>
                </div></td></tr>
                <tr><td colspan="2"><button class="btn-blue" onclick="pesquisar()">Pesquisar Bolões</button></td></tr>
            </tbody>
        </table>
        <table  class="side-table" style="margin-top: 40px; background: #fcfcfc;">
            <tbody >
                <tr><td class="label-cell" style="border:none;">pesquise pelo código</td></tr>
                <tr><td style="border:none;"><input type="text" class="input-pesquisa" placeholder="código ou nome"></td></tr>
                <tr><td style="border:none;"><button class="btn-blue" onclick="pesquisarCodigo()">Pesquisar Bolões</button></td></tr>
            </tbody>
        </table>
    </aside>
</div>

<!-- MODAL CADASTRO -->
<div id="modalCadastro" class="modal-overlay">
    <div class="modal-content">
        <div class="modal-header">Cadastro <button class="btn-close" onclick="toggleModal('modalCadastro')">X</button></div>
        <div class="modal-body">
            <input id = "nomecompleto" type="text" class="input-form" placeholder="Nome Completo" maxlength="30">
            <span class="instruction-text">Somente números, sem pontos</span>
            <input type="text" id="cad-cpf" class="input-form" placeholder="CPF" maxlength="11" oninput="this.value = this.value.replace(/[^0-9]/g, '')">
            
            <span class="instruction-text">senha deve ter entre 3 a 20 caracteres</span>
            <div class="password-container">
                <input type="password" id="cad-senha" class="input-form" placeholder="Senha" maxlength="20">
                <span class="toggle-password" onclick="togglePasswordVisibility('cad-senha')">👁️</span>
            </div>

            <span class="optional-text">A resposta abaixo é obrigatória e é a única forma de recuperação de senha.</span>
            <input id = "perguntaSeg" type="text" class="input-form" placeholder="dica da resposta" maxlength="100">
            <input id = "respostaSeg" type="text" class="input-form" placeholder="resposta de segurança" maxlength="50">
            <button class="btn-blue" onclick="validarCadastro()">Finalizar</button>
        </div>
    </div>
</div>

<!-- MODAL LOGIN -->
<div id="modalLogin" class="modal-overlay">
    <div class="modal-content">
        <div class="modal-header">Acessar Conta <button class="btn-close" onclick="toggleModal('modalLogin')">X</button></div>
        <div class="modal-body">
            <input id = "cpfAcss" type="text" class="input-form" placeholder="CPF" maxlength="11" oninput="this.value = this.value.replace(/[^0-9]/g, '')" >
            <input id = "senhaAcss" type="password" class="input-form" placeholder="Senha">
            <button class="btn-blue" onclick="Logar()")">Entrar</button>
            <span class="form-link" onclick="toggleModal('modalLogin'); toggleModal('modalCadastro')">Cadastrar</span>
            <span class="form-link" onclick="toggleModal('modalLogin'); toggleModal('modalRecuperar')">Esqueci a senha</span>
        </div>
    </div>
</div>

<!-- OUTROS MODAIS -->
<div id="modalRecuperar" class="modal-overlay"><div class="modal-content"><div class="modal-header">Recuperar <button class="btn-close" onclick="toggleModal('modalRecuperar')">X</button></div><div class="modal-body"><input type="text" id="cpfEsq" class="input-form" placeholder="CPF" maxlength="11"><span id = "dica" class="label-form" onclick= "PegarDica(this.innerText);">Mostrar dica da senha</span><input id = "suaresp" type="text" class="input-form" placeholder="Resposta de Segurança"><input id = "suasen" type="password" class="input-form" placeholder="Nova Senha"><button class="btn-blue" onclick="recuperar();">Alterar Senha</button></div></div></div>
<div id="modalAssinar" class="modal-overlay"><div class="modal-content"><div class="modal-header">Assinatura <button class="btn-close" onclick="toggleModal('modalAssinar')">X</button></div><div class="modal-body"><p style="font-size: 14px;">O valor da assinatura é de apenas 24,99 reais, pelo periodo de 30 dias.<br>
Não há recorrência e nem obrigatoriedade de continuar.<br>
<br>
Ao continuar, você será redirecionado para a página segura do PagBank, Pagseguro Internet Instituição De Pagamento S.A, para prosseguir com a aquisição.<br>
Pagamentos via pix e cartão de crédito/débito pode levar até 30 minutos.<br>
Pagamento por Boleto pode levar até 3 dias úteis<br>
Será aberta uma nova aba, e o PagBank irá gerênciar toda a transação. Nenhuma informação fica de posse, armazenada ou salva neste software.<br>
<br>
Caso haja problemas com o pagamento, clique na aba 'dúvidas' e siga as instruções para entrar em contato.</p></div><div class="modal-footer"><button class="btn-blue" style="width: 80%;" onclick="PegarLinkAssin();">Continuar</button></div></div></div>
<div id="modalSecos" class="modal-overlay"><div class="modal-content full"><div class="modal-header">Ranking das Lotéricas<button class="btn-close" onclick="toggleModal('modalSecos')">X</button></div><div class="modal-body"><textarea class="modal-textarea-full" readonly><b>Conteúdo...</b></textarea></div></div></div>
<div id="modalTotais" class="modal-overlay"><div class="modal-content full"><div class="modal-header">Ranking das Lotéricas<button class="btn-close" onclick="toggleModal('modalTotais')">X</button></div><div class="modal-body"><textarea class="modal-textarea-full" readonly>Conteúdo...</textarea></div></div></div>
<div id="modalJogos" class="modal-overlay"><div class="modal-content full"><div class="modal-header"><span id="lmj" >Meus Jogos</span> <button class="btn-close" onclick="toggleModal('modalJogos')">X</button></div><div class="modal-table-container"><table class="modal-table"><tbody id="lista-jogos-body"></tbody></table></div></div></div>
<div id="modalTextoJogo" class="modal-overlay"><div class="modal-content full"><div class="modal-header">Detalhes <button class="btn-close" onclick="voltarParaLista()">Voltar</button></div><div class="modal-body"><textarea id="texto-detalhe-jogo" class="modal-textarea-full" readonly></textarea></div></div></div>
<script type="text/javascript" src="js/novo.js"></script>
    
	
	
<div data-role="page" data-url="/" tabindex="0" class="ui-page ui-page-theme-a ui-page-active" style="">
  
      <div style="all: initial !important"></div><!-- Trigger/Open The Modal -->
      <!-- The Modal -->
	  
	  
	  
	  
	  
	  
	  
      
      <!--painel -->
      
      <div class="ui-panel-wrapper"><div class="ui-content">
	  
      
		
		 
		 <span><b>Pesquise pelos Bolões oficiais da Loteca da Caixa Econômica </b></span>
		 <span id="autor2" style="font-size: 14px;float: right;">2025 (c) Pedro de Lima Freire
      </span></div></div>
      <span style="width: auto;
	  overflow:auto;
	  display: flex;
	  justify-content: left;
  align-items: left;
	  border: 1px solid black;
	  padding-left: 1%;
	  margin-left: 5px;
  height: auto;
  background-color: rgb(206,206,255);
  box-shadow: 10px 10px lightgray;
  border-radius: 25px;"><b><br>Procure por bolões oficiais da loteca que se encaixem em sua matriz.<br>
  Colunas secas, cercadas, duplos e triplos.<br>
  O site permite o uso gratuito de alguns recursos, para que você possa testar antes de adquirir.<br>
  As principais funções incluem, dentre outras:<br>
  - pesquisa de bolões;<br>
  - pesquisa de bolões por nome, código e estado (versões do site e pra PC);<br>
  - pesquisa pelos filtros da matriz;<br>
  - verifica bolões elegíveis para 14 e 13 pontos;<br>
  - personalização de cores (somente a versão para PC).<br><br></b>
  </span>
  <br>
  <div style="width: 40%;
	  display: flex;
	  justify-content: left;
  align-items: left;
	  border: 0px solid black;
	  padding-left: 10%;
	  margin-left: 80px;
  height: auto;
  background-color: white;
  box-shadow: 10px 10px lightgray;
  border-radius: 0px;"><b>
  Além de usar pelo site, é possível acessar via software (windows) e app android
  Os valores da licença são:<br>
  R$ 24,99/mês para pc; <br>
  R$ 14,99/mês para celular.
  <br>
  </b></div><b>
  <table>
         <tbody><tr>
			
			
			<td id="pn5" style="display:none" width="20%">
			<span id="">Site em Versão beta</span>
			</td>
			
			<!-- <td id = "pn3" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">assinar</td> -->
			<td id="pn3" style="font-size: 10px;"> 
			 <div style="display: flex;justify-content: center">
				<img src="/img/android.png" width="20%">
				<a style="font-size: 12px" href="concursosApp.apk" target="_blank" rel="external" class="ui-link">Instalar APP Android</a>
			</div>
			</td>
			<td id="pn4" style="display:none"> 
			 <div style="display: flex;justify-content: center">
				<img src="/web/img/ios.png" width="20%">
				<a style="font-size: 12px" href="https://apps.apple.com/us/app/concursos-app/id6739955906" target="_blank" rel="external" class="ui-link">Instalar APP IOS</a>
			</div>
			</td>
			<td id="pnSoft" style=""> 
			 <div style="display: flex;justify-content: center">
				<img src="/img/pc.png" width="5%">
				<a style="font-size: 12px" href="loteriasIA.zip" target="_blank" rel="external" class="ui-link">Baixar pra PC ( possui mais funcionalidades que android)</a>
			</div>
			</td>
			<td id="pn4" style="display:none" class="ui-btn ui-btn-inline ui-corner-all ui-shadow" onclick="document.getElementById('myModal3').style.display = 'block' ">logar</td>
		 </tr>
		
		 </tbody></table>
  <table>
  <tbody><tr>
	<td>
	<img width="100%" src="tela1.png">
	</td><td>
	</td><td width="5%">
	&nbsp;
	</td><td>
	</td><td>
	<img width="70%" src="cel1.png">
	</td><td>
  </td></tr>
  </tbody></table>
   


</b></div>
</body>
</html>