:root {
    --azul: #05447b;
    --azulTransparente: #05447b55;
    --branco: #fafafa;
    --dourado: #febe50;

    --margin: 25px;
    --padding: 10px;
}

* {
    box-sizing: border-box;
    vertical-align: middle;
}

html {
    scroll-behavior: smooth;
}

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

a {
    text-decoration: none;

    color: black;
}

h1, h2, h3, h4, h5, h6, ul, li, p, a, label, input, textarea, small {
    font-size: 18px;
}

/* Header */
header {
    background-color: var(--azul);
}

header .header {
    display: flex;

    width: 80%;

    margin: auto;

    padding: 15px 0px;

    vertical-align: baseline;

    align-items: center;
}

header .header .headerMenu {
    vertical-align: baseline;
}

header .header .headerMenu ul {
    display: block;

    clear: both;
    overflow: hidden;
}

header .header .headerMenu ul li {
    float: left;
}

header .header .headerMenu ul li a {
    display: block;

    color: white;
}

header .header .menuEsquerdo ul li a img {
    aspect-ratio: 1/1;

    width: 100px;
}

header .header .menuDireito {
    margin-left: auto;
}

header .header .menuDireito ul li {
    margin-right: 15px;
}

header .header .menuDireito ul li:last-of-type {
    margin-right: 0px;
}

header .header .menuDireito ul li a {
    border-top: 2px solid transparent;

    border-bottom: 2px solid transparent;

    transition: 200ms all ease-in-out;
}

header .header .menuDireito ul li a:hover {
    color: var(--dourado);

    border-bottom-color: var(--dourado);
}

/* Footer */
footer {
    background-color: var(--azul);
}

footer .footer {
    padding: 15px 0px;
    width: 90%;

    margin: auto;
}

footer .footer p {
    width: fit-content;

    margin: auto;

    color: white;

    font-size: 15px;

    line-height: 1.5;
}