* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font-text);
}

@font-face {
    font-family: Poppins;
    src: url('./fuentes/Poppins-SemiBold.ttf');
}
@font-face {
    font-family: Roboto;
    src: url('./fuentes/Roboto-Regular.ttf');
}

:root {
    --primary-color: #659800;
    --secondary-color: #595859;
    --font-title: Poppins, sans-serif;
    --font-text: Roboto, sans-serif;
}

html {
    scroll-behavior: smooth;
}


header {
    position: fixed;
    width: 100%;
    border-bottom: 5px solid var(--secondary-color);
    background-color: white;
    z-index: 1;
}

.header__menu {
    display: flex;
    width: 90%;
    height: 50px;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
}

.header__menu > ul {
    margin: 15px 0;
    list-style: none;
}

.header__menu > ul > li {
    display: inline;
    margin: 15px;
    font-family: var(--font-title);
}
a {
    font-family: var(--font-title);
    text-decoration: none;
}
.header__menu > ul > li > a, .header__menu > ul > li > a:active {
    color: black;
}

.active {
    border-bottom: 3px solid var(--primary-color);
}



main {
    padding-top: 55px;
}



footer {
    display: flex;
    padding: 10px 0;
    justify-content: center;
    border-top: 5px solid var(--secondary-color);
    background-color: white;
}

.footer__logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.footer__logo > img {
    width: min-content;
}