/* Reset de estilos */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Estilos gerais */
body {
    font-family: Arial, sans-serif;
    background-color: #f9f9f9;
}

h1 {
    display: inline-block;
    vertical-align: middle;
}

#logo_sgb {
    vertical-align: top;
}

/* Estilos do cabeçalho */
header {
    background-color: #e6e6e6;
    color: #000000;
    text-align: center;
    padding: 0rem;
}

/* Estilos da navegação */
nav ul {
    list-style: none;
    display: flex;
    justify-content: center;
    background-color: #444;
    padding: 0.5rem;
}

nav li {
    margin-right: 1rem;
}

nav a {
    text-decoration: none;
    color: #fff;
}

/* Estilos do conteúdo principal */
main {
    padding: 1rem;
}

/* Estilos do rodapé */
footer {
    text-align: center;
    background-color: #e6e6e6;
    color: #000000;
    padding: 0rem;
}

.bolinhas {
    display: inline-block;
    border-radius: 50%;
    margin: -3px 5px;
    width: 15px;
    height: 15px;
}

.bolinha_roxa {background-color: #9900ff;}
.bolinha_vermelha {background-color: red;}
.bolinha_laranja {background-color: orange;}
.bolinha_amarela {background-color: #fdd835;}
.bolinha_verde {background-color: green;}
.bolinha_cinza {background-color: #A9A9A9;}