Common Overlay Slider CSS styles to customize

The following CSS styles are commonly customized manually by developers. For convenience, we have included a text box field under Options, where you can add custom styles.


  • .tbmndefault .overlaymenubutton button – Default button array in page corner.
  • .overlaymenubutton button:hover, .overlaymenubutton input[type=”button”]:hover – Controls button style on hover.
  • .float-button .overlaymenubutton button – Controls buttons applied through shortcodes within page content.
  • button.sdbar – Controls buttons embedded within a sidebar using the Overlay Slider Button widget.
  • button.btnsz – Controls buttons located in the default button array, usually in the corner of your page.


  • .overlay – Change color and opacity of overlay background.
  • .liquid-slider.tbmn, span.menslide .ls-nav a:hover, span.menslide .ls-nav .current a – Change background color of the slider.


  • .liquid-slider.tbmn ul li:nth-child(even) – Styles background color on every other item in a list.
  • .liquid-slider.tbmn ul, .liquid-slider.tbmn ol, .liquid-slider.tbmn ul a, .liquid-slider.tbmn ol a – Change color of text on lists.
  • span.menslide – Change color on most other text on your slider.
Explore More...