:root{
    --text: #fff2da;
    --bg: #302018;
    --accent: #80c84f;
    --light-bg: #4e3427;
}

body{
    background-color: var(--bg);
    color: var(--text);
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    max-width:1000px;
    margin: auto;
}

a, a:visited{
    color: var(--accent);
}

/* Header */
#header-banner{
    height: 7em;
    background: var(--accent);
    color: var(--bg);
    align-content: center;
    text-align: center;
    margin-bottom: 1em;
}
nav a{
    border: 1px solid var(--accent);
    background: var(--light-bg);
    margin: 2px 0; 
    color: var(--text) !important;
    display: inline-block;
    padding: .5em;
    text-decoration: none;
    vertical-align:top;
    transition: .3s;
}
nav a:hover{
    color: var(--bg) !important;
    background: var(--accent);
}
#userLogged{
    float: right;
    img{
        height: 2.2em;
        margin: -.5em;
        margin-right: .5em;
        margin-bottom: -.7em;
    }
}

/* Tables */
table{
    border-collapse: collapse;
    text-align: left;
    width: 100%;
    text-align: center;
}
table th{
    background-color: var(--light-bg);
    border: 1px solid var(--text);
}
table th, table td{
    padding: 10px 20px;
}
tr:nth-child(even) {
    background-color: var(--light-bg);
}
tr:hover{
    box-shadow: 0 0 100px 100px #ffffff11 inset;
}

/* Page specific */
.users-table img{
    width: 3em;
}
.users-table td{
    padding: .5em;
}