Newer
Older
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.2/tailwind.min.css" rel="stylesheet" />
<script src="https://cdn.tailwindcss.com"></script>
<header class="pt-12 mb-0 flex flex-col items-center justify-center h-[80vh] bg-black sticky top-[calc(-80vh+60px)] z-10">
<svg class="absolute top-0 left-0 w-full h-full bg-fundo box-shadow-fundo opacity-50">
<rect width="1" height="1" fill="url(#background)" />
<lineargradient id="background">
<stop offset="0%" style="stop-color: rgb(5, 141, 89); stop-opacity: 0.5" />
<stop offset="50%" style="stop-color: rgb(103, 38, 255); stop-opacity: 0.8" />
<stop offset="100%" style="stop-color: rgb(14, 2, 29); stop-opacity: 0.8" />
</lineargradient>
<linearGradient id="vertex" x1="0%" y1="0%" x2="100%" y2="0%">
<stop
offset="0%"
style="stop-color: rgb(103, 38, 255); stop-opacity: 0.8"
/>
<stop
offset="100%"
style="stop-color: rgb(0, 185, 117); stop-opacity: 0.8"
/>
</linearGradient>
<g stroke-width="0.00125"></g>
</svg>
<div class="w-full z-10 flex flex-col items-center justify-center px-5 text-center">
<h1
class="glitch items-center flex mb-4 text-4xl font-bold text-white md:text-5xl"
>
<span>
<img
fill-rule="evenodd"
class="w-28 pr-2 fill-black-500"
alt="S"
/>
</span>
<span
style="z-index: 5"
class="text-9xl font-light stacker-font text-transparent bg-clip-text bg-gradient-to-r from-purple-500 to-green-200"
>ABER</span
>
</h1>
<p style="z-index: 5" class="mb-8 text-lg text-white md:text-xl">
<span
class="stacker-font text-5xl font-light text-transparent bg-clip-text bg-white"
>
SEMANA ABERTA DE INFORMÁTICA
</span>
</p>
</div>
class="pt-1 pb-2 z-10 sticky top-0 flex h-[5vh] items-center justify-center bg-fixed bg-center bg-cover text-sm font-medium text-center text-gray-500 dark:text-gray-400 flex-wrap"
class="z-20 borda-colorida inline-block py-3 px-4 text-white rounded-lg active"
aria-current="page"
>
O que é
</a>
<a
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
href="#programacao"
class="inline-block py-3 px-4 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 dark:hover:text-white"
<img
style="z-index: -99; position: absolute; left: 0"
src="assets/img/circuit.svg"
></img>
<section class="container px-5 py-5 mt-20 mx-auto text-xl max-w-5xl" id="oquee">
<div class="w-full mb-8 lg:w-1/2">
<h1 class="mb-2 text-2xl font-medium text-gray-900 title-font">
O que é
</h1>
<div class="h-1 w-20 bg-blue-500 rounded"></div>
</div>
<div class="flex flex-wrap w-full mb-20">
<p class="w-full leading-relaxed text-gray-500">
A SABER (Semana Aberta de Informática) é um evento organizado pelos alunos de Ciência da Computação e Informática Biomédica da Universidade Federal do Paraná (UFPR).
</p>
<p class="w-full leading-relaxed text-gray-500">
É um espaço para discussões, debates e para a troca de experiências - incentivar a ciência produzida na universidade! Esse processo enriquece o conhecimento passado em sala de aula e fortalece nossos alunos na busca pela formação.
</p>
<p class="w-full leading-relaxed text-gray-500">
A SABER 2022 mistura várias palestras sobre carreira, debates sobre politica estudantil e democratização da informação, e várias oficinas de programação focadas em várias áreas diferentes da computação. Além disso, nesta edição teremos duas maratonas de programação: A tradicional feita presencialmente e a de Alto Desempenho que será feita online onde o objetivo é utilizar todos os recursos computacionais da forma mais eficiente possível para obter mais velocidade! Nestas competições, as equipes serão de até 3 pessoas.
</section>
<section class="container px-5 py-5 mx-auto text-xl max-w-5xl" id="atividades">
<div class="w-full mb-8 lg:w-1/2">
<h1 class="mb-2 text-2xl font-medium text-gray-900 title-font">
Atividades
</h1>
<div class="h-1 w-20 bg-blue-500 rounded"></div>
</div>
<div class="flex flex-wrap -m-4 justify-center">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Segurança em Redes de Internet das Coisas
</h1>
<p class="leading-relaxed">Carlos Pedroso</p>
<p class="leading-relaxed text-sm mb-3">Mestrando do NR2</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/carlos-pedroso.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Introdução à Programação de Embarcados com Arduino
</h1>
<p class="leading-relaxed">Eduardo Todt</p>
<p class="leading-relaxed text-sm mb-3">Professor do DINF</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/eduardo-todt.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Empregando Estruturas de Redes Oportunistas em Ambientes Urbanos Externos para Apoiar Pessoas em Situação Emergencial de Saúde
</h1>
<p class="leading-relaxed">Agnaldo de Souza Batista</p>
<p class="leading-relaxed text-sm mb-3">Doutorando do NR2</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/agnaldo-batista.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Técnicas de Programação Competitiva
</h1>
<p class="leading-relaxed">
Fernando Kiotheka
</p>
<p class="leading-relaxed text-sm mb-3">Mestrando do LarSiS</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/fernando-kiotheka.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Meninas++
</h1>
<div class="flex-1"></div>
<p class="leading-relaxed">Rachel Carlos Duque Reis</p>
<p class="leading-relaxed text-sm mb-3">Professora do DINF</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/rachel-reis.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">Carreiras Além do Desenvolvimento</h1>
<div class="flex-1"></div>
<p class="leading-relaxed">Lara Clink</p>
<p class="leading-relaxed text-sm mb-3">DevOps da Voxy, Graduada</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/lara-clink.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Paralelização usando OpenMP e OpenACC em CPU e GPU
</h1>
<div class="flex-1"></div>
<p class="leading-relaxed">Odair Mario Dutkin Jr</p>
<p class="leading-relaxed text-sm mb-3">Mestrando do LarSiS</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/odair-dutkin.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Introdução à Vue.js
</h1>
<div class="flex-1"></div>
<p class="leading-relaxed">Bryan Fellipe Santos da Costa</p>
<p class="leading-relaxed text-sm mb-3">Graduando</p>
<div class="h-104 object-cover aspect-square object-center"></div>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Oficina de Pixel Art
</h1>
<div class="flex-1"></div>
<p class="leading-relaxed">Victor "Crowno" Moura</p>
<p class="leading-relaxed text-sm mb-3">Diretor de Arte do Terraria/Re-Logic</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/victor-moura.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
<div class="flex-1"></div>
<p class="leading-relaxed">Mario Souto <br>"Dev Soutinho"</p>
<p class="leading-relaxed text-sm mb-3">YouTuber</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/mario-souto.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Roda de Conversa</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Conversa sobre a Batalha do Politécnico
<p class="leading-relaxed text-sm mb-3">
No dia 12 de maio de 1968, o Centro Politécnico foi palco de uma combativa manifestação estudantil contra o fim da gratuidade do Ensino Superior público que almejou ser implantado pelo Ministro da Educação do Golpe Militar de 1964 e então reitor da UFPR, Flávio Suplicy de Lacerda.
</p>
<img class="h-104 object-cover aspect-square object-center" src="assets/img/batalha-politecnico.jpg"></img>
</div>
</div>
<div class="p-4 lg:w-1/3">
<div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col coverflow-hidden text-center relative">
<h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Roda de Conversa</h2>
<h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">
Cine Debate: O Menino da Internet
</h1>
<p class="leading-relaxed text-sm mb-3">
A história do ativista de internet e pioneiro de programação Aaron Swartz a partir de sua adolescencia, seu envolvimento com o RSS, a fundação do Reddit, e seu crescente interesse na defesa política relacionada a Cultura Livre. O filme ainda explora sua prisão, as táticas da acusação a fundamentar seus supostos crimes.
<img class="h-104 w-104 object-fill" src="assets/img/internet-own-boy.jpg"></img>
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
<section class="container px-5 py-5 mx-auto text-xl max-w-5xl" id="maratonas">
<div class="w-full mb-8 lg:w-1/2">
<h1 class="mb-2 text-2xl font-medium text-gray-900 title-font">
Maratonas
</h1>
<div class="h-1 w-20 bg-blue-500 rounded"></div>
</div>
<div class="flex flex-wrap w-full mb-20">
<p class="w-full leading-relaxed text-gray-500">
Nesta edição, teremos duas maratonas:
</p>
<p class="w-full leading-relaxed text-gray-500">
A primeira é tradicional, estilo ICPC, feita de forma presencial.
Os times de até três pessoas serão formados um pouco antes ou durante
a realização da prova. Nesta prova, o objetivo é codificar
programas para resolver problemas computacionais propostos. Os times
que resolverem mais problemas em 5h, com desempate sendo a penalidade,
ganham a competição.
</p>
<p class="w-full leading-relaxed text-gray-500">
A segunda maratona é de alto desempenho. Inspirada pela maratona
de programação paralela, nesta maratona o seu objetivo é obter
a maior soma de speedups possível. Cada problema computacional proposto
possui um código-fonte que deve ser otimizado e/ou paralelizado. O speedup
é dado pela proporção de tempo de execução do código sequencial sobre o
código otimizado. Os times também são formados de até 3 pessoas porém
esta prova será realizada de maneira online, sendo aceitas submissões
durante as 30h da sua duração.
</p>
</div>
</section>
<section class="container px-5 py-5 mx-auto text-xl max-w-5xl" id="programacao">
<div class="w-full mb-8 lg:w-1/2">
<h1 class="mb-2 text-2xl font-medium text-gray-900 title-font">
Programação Preliminar (sujeito a mudanças)
</h1>
<div class="h-1 w-20 bg-blue-500 rounded"></div>
</div>
<div class="py-5">
<h3 class="text-xl">Quarta-feira (30/11)</h3>
<div class="flex items-center">
<div class="m-1 bg-green-200 w-5 h-5"></div>
<span class="p-1">Palestra</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-blue-200 w-5 h-5"></div>
<span class="p-1">Oficina</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-yellow-200 w-5 h-5"></div>
<span class="p-1">Roda de Conversa</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-pink-200 w-5 h-5"></div>
<span class="p-1">Alimentação</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-purple-200 w-5 h-5"></div>
<span class="p-1">Maratona</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-orange-200 w-5 h-5"></div>
<span class="p-1">Copa</span>
</div>
</div>
<div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2">
<div class="bg-white text-center font-bold">Horário</div>
<div class="bg-white text-center font-bold">Hall DINF</div>
<div class="bg-white text-center font-bold">Auditório DINF</div>
<div class="bg-white text-center font-bold">Lab 1-2</div>
<div class="bg-white col-start-3 bg-green-200 text-center flex justify-center items-center row-span-3">
Segurança em Redes IoT
</div>
<div class="bg-white text-center col-start-1">10h00</div>
<div class="bg-white text-center col-start-1">10h30</div>
<div class="bg-white text-center col-start-1">11h00</div>
<div class="bg-white text-center col-start-1">11h30</div>
<div class="bg-white col-span-3 row-span-4 bg-pink-200 text-center flex justify-center items-center">
Almoço
</div>
<div class="bg-white text-center col-start-1">12h00</div>
<div class="bg-white text-center col-start-1">12h30</div>
<div class="bg-white text-center col-start-1">13h00</div>
<div class="bg-white text-center col-start-1">13h30</div>
<div class="col-start-4 flex justify-center items-center text-center bg-blue-200 row-span-4">
Técnicas de Programação Competitiva
</div>
<div class="col-start-3 flex justify-center items-center text-center bg-green-200 row-span-3">
Empregando Estruturas de Redes Oportunistas em Ambientes Urbanos Externos para Apoiar Pessoas em Situação Emergencial de Saúde
</div>
<div class="bg-white text-center col-start-1">14h30</div>
<div class="bg-white text-center col-start-1">15h00</div>
<div class="col-start-2 flex justify-center items-center text-center bg-pink-200 row-span-2">
Coffee Break
</div>
<div class="bg-white text-center col-start-1">15h30</div>
<div class="bg-white text-center col-start-1">16h00</div>
<div class="col-start-3 flex justify-center items-center text-center bg-yellow-200 row-span-2">
<div class="bg-white text-center col-start-1">16h30</div>
<div class="bg-white text-center col-start-1">17h00</div>
<div class="col-start-3 flex justify-center items-center text-center bg-yellow-200 row-span-4">
<div class="bg-white text-center col-start-1">17h30</div>
<div class="bg-white text-center col-start-1">18h00</div>
<div class="bg-white text-center col-start-1">18h30</div>
</div>
</div>
<div class="py-5">
<h3 class="text-xl">Quinta-feira (01/12)</h3>
<div class="flex items-center">
<div class="m-1 bg-green-200 w-5 h-5"></div>
<span class="p-1">Palestra</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-blue-200 w-5 h-5"></div>
<span class="p-1">Oficina</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-yellow-200 w-5 h-5"></div>
<span class="p-1">Roda de Conversa</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-pink-200 w-5 h-5"></div>
<span class="p-1">Alimentação</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-purple-200 w-5 h-5"></div>
<span class="p-1">Maratona</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-orange-200 w-5 h-5"></div>
<span class="p-1">Copa</span>
</div>
</div>
<div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2">
<div class="bg-white text-center font-bold">Horário</div>
<div class="bg-white text-center font-bold">Hall DINF</div>
<div class="bg-white text-center font-bold">Auditório DINF</div>
<div class="bg-white text-center font-bold">Lab 1-2</div>
<div class="bg-white col-start-4 bg-blue-200 text-center flex justify-center items-center row-span-4">
Paralelização usando OpenMP e OpenACC em CPU e GPU
</div>
<div class="bg-white text-center col-start-1">10h00</div>
<div class="bg-white text-center col-start-1">10h30</div>
<div class="bg-white text-center col-start-1">11h00</div>
<div class="bg-white text-center col-start-1">11h30</div>
<div class="bg-white col-span-3 row-span-4 bg-pink-200 text-center flex justify-center items-center">
Almoço
</div>
<div class="bg-white text-center col-start-1">12h00</div>
<div class="bg-white text-center col-start-1">12h30</div>
<div class="bg-white text-center col-start-1">13h00</div>
<div class="bg-white text-center col-start-1">13h30</div>
<div class="col-start-3 flex justify-center items-center text-center bg-green-200 row-span-3">
Meninas++
</div>
<div class="bg-white text-center col-start-1">14h00</div>
<div class="bg-white text-center col-start-1">14h30</div>
<div class="bg-white text-center col-start-1">15h00</div>
<div class="col-start-2 flex justify-center items-center text-center bg-pink-200 row-span-2">
Coffee Break
</div>
<div class="bg-white text-center col-start-1">15h30</div>
<div class="bg-white text-center col-start-1">16h00</div>
<div class="col-start-4 flex justify-center items-center text-center bg-blue-200 row-span-4">
Introdução à Programação de Embarcados com Arduino
<div class="bg-white text-center col-start-1">16h30</div>
<div class="bg-white text-center col-start-1">17h00</div>
<div class="bg-white text-center col-start-1">17h30</div>
<div class="col-start-3 flex justify-center items-center text-center bg-green-200 row-span-3">
Carreiras Além do Desenvolvimento com Lara Clink
<div class="bg-white text-center col-start-1">18h00</div>
<div class="bg-white text-center col-start-1">18h30</div>
</div>
</div>
<div class="py-5">
<h3 class="text-xl">Sexta-feira (02/12)</h3>
<div class="flex items-center">
<div class="m-1 bg-green-200 w-5 h-5"></div>
<span class="p-1">Palestra</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-blue-200 w-5 h-5"></div>
<span class="p-1">Oficina</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-yellow-200 w-5 h-5"></div>
<span class="p-1">Roda de Conversa</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-pink-200 w-5 h-5"></div>
<span class="p-1">Alimentação</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-purple-200 w-5 h-5"></div>
<span class="p-1">Maratona</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-orange-200 w-5 h-5"></div>
<span class="p-1">Copa</span>
</div>
</div>
<div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2">
<div class="bg-white text-center font-bold">Horário</div>
<div class="bg-white text-center font-bold">Hall DINF</div>
<div class="bg-white text-center font-bold">Auditório DINF</div>
<div class="bg-white text-center font-bold">Lab 1-2</div>
<div class="bg-white col-start-4 bg-blue-200 text-center flex justify-center items-center row-span-4">
Introdução à Vue.js
</div>
<div class="bg-white text-center col-start-1">10h00</div>
<div class="bg-white text-center col-start-1">10h30</div>
<div class="bg-white text-center col-start-1">11h00</div>
<div class="bg-white text-center col-start-1">11h30</div>
<div class="bg-white col-span-3 row-span-4 bg-pink-200 text-center flex justify-center items-center">
Almoço
</div>
<div class="bg-white text-center col-start-1">12h00</div>
<div class="bg-white text-center col-start-1">12h30</div>
<div class="bg-white text-center col-start-1">13h00</div>
<div class="bg-white text-center col-start-1">13h30</div>
<div class="col-start-4 flex justify-center items-center text-center bg-purple-200 row-[span_10]">
<div class="bg-white text-center col-start-1">14h00</div>
<div class="bg-white text-center col-start-1">14h30</div>
<div class="bg-white text-center col-start-1">15h00</div>
<div class="col-start-2 flex justify-center items-center text-center bg-pink-200 row-span-2">
Coffee Break
</div>
<div class="bg-white text-center col-start-1">15h30</div>
<div class="bg-white text-center col-start-1">16h00</div>
<div class="col-start-5 flex justify-center items-center text-center bg-orange-200 row-span-5">
<div class="bg-white text-center col-start-1">16h30</div>
<div class="bg-white text-center col-start-1">17h00</div>
<div class="bg-white text-center col-start-1">17h30</div>
<div class="bg-white text-center col-start-1">18h00</div>
<div class="bg-white text-center col-start-1">18h30</div>
</div>
</div>
<div class="py-5">
<h3 class="text-xl">Sábado (03/12)</h3>
<div class="flex items-center">
<div class="m-1 bg-green-200 w-5 h-5"></div>
<span class="p-1">Palestra</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-blue-200 w-5 h-5"></div>
<span class="p-1">Oficina</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-yellow-200 w-5 h-5"></div>
<span class="p-1">Roda de Conversa</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-pink-200 w-5 h-5"></div>
<span class="p-1">Alimentação</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-purple-200 w-5 h-5"></div>
<span class="p-1">Maratona</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-orange-200 w-5 h-5"></div>
<span class="p-1">Copa</span>
</div>
<div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2" style="grid-template-columns: 5rem 1fr 1fr">
<div class="bg-white text-center font-bold">Maratona</div>
<div class="bg-white text-center font-bold">Sala Virtual</div>
<div class="bg-white text-center col-start-1">00h00</div>
<div class="bg-white text-center col-start-1">09h30</div>
<div class="bg-white text-center col-start-1">10h00</div>
<div class="bg-white text-center col-start-1">10h30</div>
<div class="bg-white text-center col-start-1">11h00</div>
<div class="bg-white text-center col-start-1">11h30</div>
<div class="bg-white text-center col-start-1">12h00</div>
<div class="bg-white text-center col-start-1">12h30</div>
<div class="bg-white text-center col-start-1">13h00</div>
<div class="bg-white text-center col-start-1">13h30</div>
<div class="col-start-2 flex justify-center items-center text-center bg-purple-200 row-[span_12]">
<div class="col-start-3 flex justify-center items-center text-center bg-blue-200 row-span-4">
<div class="bg-white text-center col-start-1">14h30</div>
<div class="bg-white text-center col-start-1">15h00</div>
<div class="bg-white text-center col-start-1">15h30</div>
<div class="bg-white text-center col-start-1">16h00</div>
<div class="bg-white text-center col-start-1">16h30</div>
<div class="bg-white text-center col-start-1">17h00</div>
<div class="bg-white text-center col-start-1">17h30</div>
<div class="bg-white text-center col-start-1">18h00</div>
<div class="bg-white text-center col-start-1">18h30</div>
<div class="bg-white text-center col-start-1">19h00</div>
</div>
</div>
<div class="py-5">
<h3 class="text-xl">Domingo (04/12)</h3>
<div class="flex items-center">
<div class="m-1 bg-green-200 w-5 h-5"></div>
<span class="p-1">Palestra</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-blue-200 w-5 h-5"></div>
<span class="p-1">Oficina</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-yellow-200 w-5 h-5"></div>
<span class="p-1">Roda de Conversa</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-pink-200 w-5 h-5"></div>
<span class="p-1">Alimentação</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-purple-200 w-5 h-5"></div>
<span class="p-1">Maratona</span>
</div>
<div class="flex items-center">
<div class="m-1 bg-orange-200 w-5 h-5"></div>
<span class="p-1">Copa</span>
</div>
<div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2" style="grid-template-columns: 5rem 1fr 1fr">
<div class="bg-white text-center font-bold">Maratona</div>
<div class="bg-white text-center font-bold">Sala Virtual</div>
<div class="col-start-2 flex justify-center items-center text-center bg-purple-200 row-[span_20]">
<div class="bg-white text-center col-start-1">09h30</div>
<div class="bg-white text-center col-start-1">10h00</div>
<div class="bg-white text-center col-start-1">10h30</div>
<div class="bg-white text-center col-start-1">11h00</div>
<div class="bg-white text-center col-start-1">11h30</div>
<div class="bg-white text-center col-start-1">12h00</div>
<div class="bg-white text-center col-start-1">12h30</div>
<div class="bg-white text-center col-start-1">13h00</div>
<div class="bg-white text-center col-start-1">13h30</div>
<div class="bg-white text-center col-start-1">14h00</div>
<div class="bg-white text-center col-start-1">14h30</div>
<div class="bg-white text-center col-start-1">15h00</div>
<div class="bg-white text-center col-start-1">15h30</div>
<div class="bg-white text-center col-start-1">16h00</div>
<div class="bg-white text-center col-start-1">16h30</div>
<div class="bg-white text-center col-start-1">17h00</div>
<div class="col-start-3 flex justify-center items-center text-center bg-green-200 row-span-2">
Carreiras na Computação com Dev Soutinho
</div>
<div class="bg-white text-center col-start-1">17h30</div>
<div class="bg-white text-center col-start-1">18h00</div>
<div class="bg-white text-center col-start-1">18h30</div>
<div class="bg-white text-center col-start-1">19h00</div>