:root {
    --cor-fundo: rgb(34, 41, 37);
    --cor-hover: rgb(118, 180, 145);
    --cor-primaria: rgb(231, 241, 236);
}

.dp-menu ul {
    list-style-type: none;
    padding: 0;
}

.dp-menu ul {
    background-color: var(--cor-fundo);
}

.dp-menu ul li {
    display: inline;
    position: relative;
}

.dp-menu ul li a {
    color: var(--cor-primaria);
    text-decoration: none;
    display: inline-block;
    padding: 10px;
    transition: background .3s;
}

.dp-menu ul li a:hover {
    background-color: var(--cor-hover);
}

/*sub menu*/
.dp-menu ul ul {
    display: none;
    left: 0;
    position: absolute;
}

.dp-menu ul li:hover ul {
    display: block;
}

.dp-menu ul ul {
    width: 150px
}

.dp-menu ul ul li a {
    display: block;
}