/* Adicione estilos CSS para exibir a palavra em diferentes fontes */
body {
   margin: 0;
   padding: 0;
   font-family: Arial, sans-serif;
}

.container {
   width: 80%;
   margin: 0 auto;
}

header {
   text-align: center;
   padding: 20px 0;
}

header img {
   max-width: 200px;
}

/* Estilos para o rodapé */
footer {
   text-align: center;
   padding: 20px 0;
   background-color: #f2f2f2;
   width: 100%;
}

/* Estilos para a div que contém a tabela */
.table-container {
   margin-bottom: 160px;
}

/* Estilos para a tabela */
.font-preview {
   margin-bottom: 20px;
}

table {
   border-collapse: collapse;
   width: 100%;
}

th,
td {
   border: 1px solid black;
   padding: 8px;
   text-align: left;
}

th {
   background-color: #f2f2f2;
}

/* Ajuste para que a coluna "Ação" ocupe apenas 10% da largura da tabela */
th:nth-child(3),
td:nth-child(3) {
   width: 10%;
}

/* Ajuste para que as outras colunas ocupem o restante do espaço igualmente */
th:nth-child(1),
td:nth-child(1),
th:nth-child(2),
td:nth-child(2) {
   width: 45%;
}

/* Ajuste o tamanho da imagem para 64px */
img {
   max-width: 32px;
   height: auto;
}
@font-face {
   font-family: 'Autography';
   src: url('./fonts/Autography.otf') format('opentype');
}

@font-face {
   font-family: 'Ananda';
   src: url('./fonts/Ananda.ttf') format('truetype');
}

@font-face {
   font-family: 'Billion Dreams';
   src: url('./fonts/Billion_Dreams.ttf') format('truetype');
}

@font-face {
   font-family: 'Catalish Huntera';
   src: url('./fonts/Catalish_Huntera.ttf') format('truetype');
}

@font-face {
   font-family: 'Cascadia Code';
   src: url('./fonts/Cascadia_Code.ttf') format('truetype');
}

@font-face {
   font-family: 'Cooper Black';
   src: url('./fonts/Cooper_Black.ttf') format('truetype');
}

@font-face {
   font-family: 'Harlow Solid Italic';
   src: url('./fonts/Harlow_Solid_Italic.ttf') format('truetype');
}

@font-face {
   font-family: 'Magneto';
   src: url('./fonts/Magneto.ttf') format('truetype');
}

@font-face {
   font-family: 'Montserrat';
   src: url('./fonts/Montserrat-Regular.ttf') format('truetype');
}

@font-face {
   font-family: 'Monotype Corsiva';
   src: url('./fonts/Monotype_Corsiva.ttf') format('truetype');
}

@font-face {
   font-family: 'Nasalization Rg';
   src: url('./fonts/Nasalization_Rg.otf') format('opentype');
}

@font-face {
   font-family: 'Segoe UI';
   src: url('./fonts/Segoe_UI.ttf') format('truetype');
}
/* Centraliza o texto da tag h2 */
h3 {
   text-align: center;
}

/* Centraliza o formulário */
form {
   text-align: center;
   /* Centraliza o formulário */
   margin-bottom: 20px;
   /* Adiciona espaço entre o formulário e a próxima seção */
}

form input[type="text"],
form button {
   display: inline-block;
   /* Permite que os elementos fiquem na mesma linha */
   vertical-align: middle;
   /* Alinha os elementos verticalmente */
}