Title: Custom CSS
Last modified: August 21, 2016

---

# Custom CSS

 *  [JAYMICHAELIVING](https://wordpress.org/support/users/jaymichaeliving/)
 * (@jaymichaeliving)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/custom-css-38/)
 * I am trying to add some Custom CSS to the toggle bar, so the toggle function 
   fits the theme of my site. Is this possible? I need my title the actual toggle
   bar to be a specific color (i.e., font style, font color, background color, hover
   color, etc.)
 * I brought the following in to Custom CSS, made a few changes, and nothing happened
   on the front-end:
 *     ```
       /*************************************************************** Begin Toggle */
   
       .doptoggle-wrapper{
           margin: 0 0 1.5em 0;
       }
   
       .doptoggle-wrapper .doptoggle{
           background: #414141;
           color: #fff;
           display: block;
       font-family:"Petita", Arial, Helvetica, sans-serif;
       font-weight:normal;
       	font-style:normal;
           font-size: 1em;
           line-height: 2em;
           padding: 0 1em;
           text-decoration: none;
           z-index: 1000;
       }
   
       .doptoggle-wrapper .doptoggle .icon,
       .doptoggle-wrapper .doptoggle .active-icon{
           background: none;
           color: #e2e2e2;
           display: block;
           float: right;
           font-size: 1.5em;
           line-height: 1.35em;
           -webkit-transition: color 300ms linear;
           -moz-transition: color 300ms linear;
           -ms-transition: color 300ms linear;
           -o-transition: color 300ms linear;
           transition: color 300ms linear;
       }
   
       .doptoggle-wrapper.dopactive .doptoggle{
           background: #e2e2e2;
           color: #212121;
           -webkit-transition: background 300ms linear, color 300ms linear;
           -moz-transition: background 300ms linear, color 300ms linear;
           -ms-transition: background 300ms linear, color 300ms linear;
           -o-transition: background 300ms linear, color 300ms linear;
           transition: background 300ms linear, color 300ms linear;
       }
   
       .doptoggle-wrapper.dopactive .doptoggle .icon,
       .doptoggle-wrapper.dopactive .doptoggle .active-icon{
           color: #212121;
           -webkit-transition: color 300ms linear;
           -moz-transition: color 300ms linear;
           -ms-transition: color 300ms linear;
           -o-transition: color 300ms linear;
           transition: color 300ms linear;
       }
   
       .doptoggle-wrapper .doptoggle:hover{
           background: #000000;
           color: #e2e2e2;
           -webkit-transition: background 300ms linear, color 300ms linear;
           -moz-transition: background 300ms linear, color 300ms linear;
           -ms-transition: background 300ms linear, color 300ms linear;
           -o-transition: background 300ms linear, color 300ms linear;
           transition: background 300ms linear, color 300ms linear;
       }
   
       .doptoggle-wrapper .doptoggle:hover .icon,
       .doptoggle-wrapper .doptoggle:hover .active-icon{
           color: #e2e2e2;
           -webkit-transition: color 300ms linear;
           -moz-transition: color 300ms linear;
           -ms-transition: color 300ms linear;
           -o-transition: color 300ms linear;
           transition: color 300ms linear;
       }
   
       .doptoggle-wrapper .doptoggle .icon,
       .doptoggle-wrapper.dopactive .doptoggle .active-icon{
           display: block;
       }
   
       .doptoggle-wrapper.dopactive .doptoggle .icon,
       .doptoggle-wrapper .doptoggle .active-icon{
           display: none;
       }
   
       .doptoggle-wrapper .doptoggle-content{
           border: 1px solid #e2e2e2;
           display: none;
           padding: 1.5em 1em;
       }
       ```
   
 * The site I am working on is [](http://www.cedarstreetco.com)
 * [http://wordpress.org/plugins/dop-shortcodes/](http://wordpress.org/plugins/dop-shortcodes/)

Viewing 1 replies (of 1 total)

 *  Plugin Author [DOTonPAPER](https://wordpress.org/support/users/dotonpaper/)
 * (@dotonpaper)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/custom-css-38/#post-4176389)
 * Hello,
 * Can you please send me a link?
 * Thank you

Viewing 1 replies (of 1 total)

The topic ‘Custom CSS’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/dop-shortcodes_fefffe.svg)
 * [DOP Shortcodes](https://wordpress.org/plugins/dop-shortcodes/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/dop-shortcodes/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/dop-shortcodes/)
 * [Active Topics](https://wordpress.org/support/plugin/dop-shortcodes/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/dop-shortcodes/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/dop-shortcodes/reviews/)

## Tags

 * [changing colors](https://wordpress.org/support/topic-tag/changing-colors/)

 * 1 reply
 * 2 participants
 * Last reply from: [DOTonPAPER](https://wordpress.org/support/users/dotonpaper/)
 * Last activity: [12 years, 6 months ago](https://wordpress.org/support/topic/custom-css-38/#post-4176389)
 * Status: not a support question