/* html,body {
background-color:#43362a;
font-family:"Maven Pro", sans-serif;
padding:2rem 1rem;
} */

.wrap-drop {
background:#e7ded5;
box-shadow:3px 3px 3px rgba(0,0,0,.2);
cursor:pointer;
margin:0 auto;
max-width:225px;
padding:1rem;
position:relative;
width:75%;
z-index:3;
}

.wrap-drop::after {
border-color:#695d52 transparent;
border-style:solid;
border-width:10px 10px 0;
content:"";
height:0;
margin-top:-4px;
position:absolute;
right:1rem;
top:50%;
width:0;
}

.wrap-drop .drop {
background:#e7ded5;
box-shadow:3px 3px 3px rgba(0,0,0,.2);
display:none;
left:0;
list-style:none;
margin-top:0;
opacity:0;
padding-left:0;
pointer-events:none;
position:absolute;
right:0;
top:100%;
z-index:2;
}

.wrap-drop .drop li a {
color:#695d52;
display:block;
padding:1rem;
text-decoration:none;
}

.wrap-drop span {
color:#928579;
}

.wrap-drop .drop li:hover a {
background-color:#695d52;
color:#e7ded5;
}

.wrap-drop.active::after {
border-width:0 10px 10px;
}

.wrap-drop.active .drop {
display:block;
opacity:1;
pointer-events:auto;
}