#menu{background-color: var(--background); border-bottom: solid 1px #eee;}

.menu > li > a{padding:10px; display: block;}
.menu > li > a span{display: flex; gap: 10px;}
.menu a{color: var(--texto);}

.header_menu{}
.menu{position: absolute; top: 81%; left: 0; width: 100%; overflow: auto; background-color: #fff; display: none !important; z-index: 0; padding: 40px; padding-bottom: 40px !important;}
.header_menu:hover .menu{column-count: 4; column-gap: 12px; display: block !important;}
.menu > li{width: 250px;}

.submenu2{position: absolute; left: 250px; top: 100%; height: 50vh; overflow: auto; background-color: #fff; min-width: calc(100% - 250px); display: none; border-radius: 0 20px 20px 0; z-index: 1; padding: 20px;}
.submenu2 a{padding: 10px; display:block;}
.submenu2 a:hover{padding-left: 20px; color: var(--secondary);}
.submenu2 .dropdown-inner{min-width: 250px;}

.menu > li > a:hover{background-color: #efefef;}
.menu > li.dropdown{position: static;}
.menu > li.dropdown:hover .submenu2{display: flex;}

.menu.menu-mobile{position: relative; display: block;}
.menu-mobile a{color: var(--texto); padding: 10px; display: block; width: 100%;}
.menu-mobile {list-style: none; padding:0; margin:0;}
.menu-mobile > li > a{font-size: 18px;}
.menu-mobile .submenu-mobile{padding-left: 10px;}
.menu-mobile .grandchild{color: #777; padding-left: 20px;}

#menu-topo{display: flex; justify-content: center; gap: 30px;}
#menu-topo > a, #menu-topo .button-menu{padding: 15px 0;}
#menu-topo > a:hover, #menu-topo .button-menu:hover{color: var(--secondary);}

.menu-category-image{ padding:0 30px; position: sticky; top: 0;}


@media(max-width:991px){
	#menu-topo{display: none !important;}
	.menu {display: block !important;}
	#menu {border: none !important;}
}
