Elementor CSS Column Nav

Note, this was based on a tutorial here: https://www.prowebdesign.ro/wordpress-sub-menu-items-split-in-2-columns-the-easy-way/

I had adapt this to only apply to a single menu item so that not ALL dropdowns had mutli-columns

/* Navigation */
body .sub-menu-columns ul.sub-menu li {
display: inline-block !important;
float: left !important;
width: 200px !important;
}
body .sub-menu-columns ul.sub-menu .elementor-nav-menu–dropdown li:nth-child(odd) {
float: left !important;
margin-right: 10px;
}

body .sub-menu-columns ul.sub-menu .elementor-nav-menu–dropdown li:nth-child(even) {
float: right !important;
}

.elementor-element-e7a174b .elementor-nav-menu li.menu-item-664 {
position: unset;
}

I had to specify exactly what menu item I was styling

@media (max-width: 768px) { .elementor-element-e7a174b .elementor-nav-menu li {
position: relative;
}
body .sub-menu-columns ul.sub-menu li {
float: none !important;
}
}

I had to turn this position and float off so that it worked properly in mobile