if I put it into the extra css section at the Theme Options Section, the arrows/bullets simply disappear. Is there another place where I can put the code in?
Each css need to be put under Theme options > Custom CSS & JS > Custom CSS section. We are sorry but we noticed that we forgot about !important declaration for the last "background" attribute. So please add it to your css and the circle would appear.
Comments
yes, it is possible. You can do it using the following extra css:
.menu-arrow-bottom #Top_bar .menu > li > a::after {border-radius: 50%;
height: 10px;
width: 10px;
border: none;
background: #000 !important;
}