<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/css/stylecadastro.css">
    <title>Adicione à Lista</title>
</head>
<body>
    <nav>
        <a class="logo" href="/">Home</a>
        <a class="logo" href="/quemsomos">Quem Somos</a>
        <a class="logo" href="/sobre">Sobre</a>
        <a class="logo" href="/cadastro">Cadastrar</a>
    </nav>
    
    <header>
        <h1>Aqui você pode adicionar um país à lista</h1>               
    </header>


    <section id="cadastro">
        <h2>Cadastre mais um país</h2>        
        <form action="/cadastro" method="POST">                       
            
            <div>                
                <label for="bandeira">Bandeira: </label>                
                <input type="text" name="bandeira" id="bandeira" placeholder="Insira o link para a imagem da bandeira" required>            
            </div>
            <div>                
                <label for="nome">Nome: </label>                
                <input type="text" name="nome" id="nome" placeholder="Digite o nome do país" required>            
            </div>                      
            <div>                
                <label for="capital">Capital: </label>                
                <input type="text" name="capital" id="capital" placeholder="Digite a capital" required>            
            </div>
            <div>                
                <label for="regiao">Região: </label>                
                <input type="text" name="regiao" id="regiao" placeholder="Informe a região do país" required>            
            </div>
            <div>                
                <label for="extensao">Extensão: </label>                
                <input type="text" name="extensao" id="extensao" placeholder="Informe a extensão" required>            
            </div>
            <div>                
                <label for="populacao">População: </label>                
                <input type="text" name="populacao" id="populacao" placeholder="Informe a população" required>            
            </div>
                <label for="lingua_oficial">Lingua Oficial: </label>                
                <input type="text" name="lingua_oficial" id="lingua_oficial" placeholder="Informe a lingua" required>            
            </div>
            <div> 
                <label for="moeda">Moeda Oficial: </label>                
                <input type="text" name="moeda" id="moeda" placeholder="Informe a moeda oficial" required>            
            </div>  
            <div>                
                <label for="informacoes">Informações: </label>                
                <input type="text" name="informacoes" id="informacoes" placeholder="Adicione informações extra sobre o país" required>            
            </div> 
            <div id= "botao">                    
            <button type="submit">Cadastrar</button>   
            </div>      
        </form>    
    </section>
    <script src="/js/script.js"></script>
</body>
</html>