/*@import "uikit/uikit.min.css";*/

/*
#######################################
############### GENERAL ###############
#######################################
*/

:root {
    --navbar-bg-color: rgb(23, 23, 23);
    --navbar-text-color: rgb(152, 152, 152);
    --navbar-text-color-active: rgb(255, 255, 255);
    --main-text-color: rgb(255, 255, 255);
    --main-bg-color: rgb(30, 30, 30);
}

body {
    font-family: 'Roboto', sans-serif;
    margin: 0;
}

/*
######################################
############### NAVBAR ###############
######################################
*/

#navbar {
    background-color: var(--navbar-bg-color);
    display: flex;
    flex-direction: row;
    height: 3.125rem;
    padding: 0.938rem 0.938rem 0.938rem 0.938rem;
}

#navbar-logo-container {
    align-items: center;
    display: inherit;
    /*margin-left: 15px;*/
}

#navbar-logo {
    /*border: 0.156rem solid var(--navbar-text-color-active);*/
    /*border-radius: 50%;*/
    max-width: 50px;
}

#navbar-nav {
    margin: auto;
}

#navbar-nav-items {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    height: 2.5rem;
}

.navbar-nav-item {
    display: inherit;
    justify-content: center;
    width: 9.375rem;
}

.navbar-nav-item>a {
    color: var(--navbar-text-color);
    text-decoration: none;
    transition: font-size ease 150ms;
}

.navbar-nav-item>a:hover {
    font-size: 1.15rem;
}

.active a {
    color: var(--navbar-text-color-active);
    font-size: 1.15rem;
    font-weight: bold;
}

/*
####################################
############### MAIN ###############
####################################
*/

main {
    background-color: var(--main-bg-color);
    color: var(--main-text-color);
    display: flex;
    flex-direction: column;
    height: 100vh;
}

#content {
    padding: 1.25rem 20% 0;
}

/*
######################################
############### FOOTER ###############
######################################
*/