@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");

@import url("css/buttons.css");
@import url("css/cards.css");
@import url("css/inputs.css");
@import url("css/layout.css");
@import url("css/navbar.css");
@import url("css/spacing.css");
@import url("css/tables.css");
@import url("css/typography.css");

@font-face {
    font-family: "RadionB";
    src: url("fonts/radionb.ttf") format("truetype");
    font-weight: semi-bold;
    font-style: normal;
}

:root {
    --primary: #00bcd4;
    --primary-100: #b2ebf2;
    --primary-200: #e0f7fa;
    --primary-300: rgba(224, 247, 250, 0.5);
    --header-font: "RadionB", sans-serif;
}

body {
    font-family: "Outfit", sans-serif;
}

section {
    padding: 2% 0;
}

.primary {
    background-color: var(--primary);
}

.primary.lighten-1 {
    background-color: var(--primary-100);
}

.primary.lighten-2 {
    background-color: var(--primary-200);
}

.primary.lighten-3 {
    background-color: var(--primary-300);
}

.full-width {
    width: 100%;
}

footer.page-footer {
    background-color: var(--primary-300);
}

footer.page-footer > .row {
    padding: 0 2%;
}

footer.page-footer > .row p {
    color: #212121;
}

footer.page-footer > .row a {
    color: #616161;
}

footer.page-footer > .row a:hover {
    text-decoration: underline;
}