.pa-header{background:transparent;-webkit-transition:background-color 2s ease-out;-moz-transition:background-color 2s ease-out;-o-transition:background-color 2s ease-out;transition:background-color 2s ease-out}.pa-fixed-header{background-color:#001654!important;-webkit-transition:background-color 2s ease-out;-moz-transition:background-color 2s ease-out;-o-transition:background-color 2s ease-out;transition:background-color 2s ease-out}.dd-desktop-menu nav ul li li a{width:260px}.dd-desktop-menu nav ul li ul.sub-menu{width:260px!important}#main-header .nav li ul{left:50%!important;right:auto!important;text-align:center!important;transform:translate(-50%,0)!important}.dp_preloader .dp_loader_icon{transform:translate(-50%,-20%)}@media (max-width:767px){.dp_preloader .dp_loader_icon{scale:0.50}.dp_preloader .dp_loader_icon{transform:translate(-80%,-50%)}}#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,.et_pb_module.et_pb_menu .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before{content:'\4d'}ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,ul.et_mobile_menu li.page_item_has_children .mobile-toggle,.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle{width:44px;height:100%;padding:0px!important;max-height:44px;border:none;position:absolute;right:0px;top:0px;z-index:999;background-color:transparent}ul.et_mobile_menu>li.menu-item-has-children,ul.et_mobile_menu>li.page_item_has_children,ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children{position:relative}.et_mobile_menu .menu-item-has-children>a,.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a{background-color:transparent}ul.et_mobile_menu .menu-item-has-children .sub-menu,#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu{display:none!important;visibility:hidden!important}ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible{display:block!important;visibility:visible!important}ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle{text-align:center;opacity:1}ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after{top:10px;position:relative;font-family:"ETModules";content:'\33';color:#00d263;background:#f0f3f6;border-radius:50%;padding:3px}ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after{content:'\32'}.et_pb_menu_0.et_pb_menu .et_mobile_menu:after{position:absolute;right:5%;margin-left:-20px;top:-14px;width:0;height:0;content:'';border-left:20px solid transparent;border-right:20px solid transparent;border-bottom:20px solid #ffffff}.mobile_menu_bar{position:relative;display:block;bottom:10px;line-height:0}.et_pb_menu_0.et_pb_menu .et_mobile_menu,.et_pb_menu_0.et_pb_menu .et_mobile_menu ul{background-color:#001654!important;border-radius:10px}As you can see,each of the snippets are labeled. This does a good job of explaining what each one does. As always,feel free to customize anything like colors and sizes. Option:Use Parent Menu Item As Toggle For Submenu
This seems to be a big question in the comment section,so I am adding the answer here. If you want to essentially remove the parent menu item link and use it as the same toggle mechanism as the dropdown icon. Instead of linking to that page,it will be used only as placeholder text and a toggle.
.et_mobile_menu .menu-item-has-children .sub-menu{display:none!important}.pa-block{display:block!important;height:fit-content!important;padding-top:0!important;margin-top:0!important;padding:5%!important;margin-bottom:0!important;margin-top:0!important}.et_mobile_menu .menu-item-has-children .pa-submenu{display:block!important}.opened .et_mobile_menu{height:fit-content!important;padding:5%!important}ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle{text-align:right;width:100%}.dd-desktop-menu .et-menu-nav>ul>li.current-menu-item>a{border-bottom:2px solid orange!important}body .et_pb_scroll_top:after{content:"Top"!important;font-family:Open Sans,sans-serif!important;line-height:10px!important;font-size:12px!important;position:relative;top:-2px;margin-left:0px!important}body .et_pb_scroll_top{background-color:rgb(12,113,195)!important;color:rgb(237,240,0)!important;padding:10px 20px 10px 10px!important;right:-15px!important;bottom:75px!important;border-radius:50px!important}.et_pb_bottom_inside_divider{bottom:-1px!important}.et_pb_top_inside_divider{top:-1px!important}