* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, Helvetica, sans-serif;
}

.autocomplete-suggestions {
  width: 400px;
  background-color: #ffffff;
  border: 1px solid #007bff;
  border-radius: 5px;
  color: #111111;
  padding: 10px 10px;
  overflow: auto;
}

.autocomplete-suggestion {
  padding: 2px 5px;
  white-space: nowrap;
  overflow: hidden;
}

.autocomplete-selected {
  background: #007bff;
}

.autocomplete-suggestions strong {
  font-weight: bold;
  color: #000000;
}

.django-msg {
    
}

/* LOGIN */

.card-container {
    width: fit-content;
    height: auto;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

input[type=text], input[type=password], select {
    background-color: #fff;
    border: 1px solid #dadada;

    width: 300px;
    height: 30px;

    outline: none;
}

#login-btn {
    margin: 10px 0;
}

#id_username, #id_password {
    display: block;
    margin: 10px 0;
}

label {
    margin-left: 5px;
}

/* .btn {
    background-color: #c0262e;
    color: #fff;
    font-weight: 600;

    width: 50px;
    height: 30px;
    margin: 10px auto;
    display: block;

    outline: none;
    border: none;
    cursor: pointer;
} */

.btn.criar-conta {
    width: 80px;
}

a {
    text-decoration: none;
}

#id_programa {
    display: block;
}

#id_senha {
    display: block;
}

#message_login {
    text-align: center;
    margin-top: 50px;
}

/* INCLUIR PROFESSOR */

#id_nome, #id_email, #id_url_lattes, #id_url_google_scholar {
    display: block;
}

input#id_nome, input#id_email, input#id_url_lattes {
    margin-bottom: 0.5rem;
}

#incluir-professor-text {
    margin: 0 0 30px 0;
    text-align: center;
}

.btn.possui-conta {
    width: 150px;
}

/* PAINEL */

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

.header {
    background-color: #eee;
    height: 40px;
    padding: 0 10%;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header a {
    color: #000;
}

#scriptLattes-header {
    font-size: 1.2em;
    font-weight: 600;
}

#header-btn {
    width: 100px;
    height: 30px;

    cursor: pointer;
}

.options-btn {
    width: fit-content;
    height: 40px;
    margin: 10px 10px 0 0;
    padding: 0 10px;

    font-size: 1em;
    
    cursor: pointer;
}

/* GERAR RELATORIO */

.container-relatorio {
    width: 60%;
    margin: 0 auto;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#gerar-relatorio {
    margin: 10px 0;
}

.relatorio-opcoes-text {
    margin: 16px 0;
}

#ano_incio, #ano_fim {
    margin-left: 5px;
}

#relatorio-btn {
    margin-top: 20px;
}

/* CRIAR GRUPO */

select#id_grande_area, select#id_area_avaliacao {
    margin-bottom: 0.5rem;
}

#btn-criar-grupo {
    margin-bottom: 50px;
}

/* GERENCIAR PROFESSOR */

.vincular-btn {
    float: left;
}

.gerenciar-title {
    text-align: center;
    margin-top: 40px;
}

/* RELATÓRIOS ANTERIORES */

.relatorios-anteriores {
    text-align: center;
}

.relatorios-anteriores-title {
    margin-top: 40px;
}

.lista-relatorios-anteriores {
    margin-bottom: 50px;
}

.relatorios-pagination {
    margin: 20px 0 40px 0;
    text-align: center;
    font-size: 1.1rem;
}

/* CRIAR USUARIO */

#id_username, #id_password1, #id_password2 {
    display: block;
}

#btn-criar-usuario {
    margin: 10px 0;
}

/* FOOTER */

footer#footer {
    width: 100%;
    height: 30px;

    background-color: #007bff;
    color: #eee;
    font-size: 1em;
    text-align: center;
    line-height: 30px;

    position: fixed;
    bottom: 0;
}

@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 

    .tabela-gerenciar-professor, 
    .tabela-gerenciar-grupos,
    .lista-relatorios-anteriores
     {   
        margin-left: 200px;
    }

    table.relatorios-table {
        width: 70%;
        margin: 0 auto;
    }
}