Problems with Form Tab Widget Custom CSS

For those who are familiar with CSS, can you take a look at the following custom CSS entered in the form tabs widget itself, not the Form Styles inject custom CSS?
The .current CSS is not working, and the border-bottom: none is not removing the triangles. Hopefully that will fix the main border not displaying correctly.
Any help is greatly appreciated!

.tabs-list li{
   font-size: 12px;
   font-weight:
   bold; color:#5805ff !important;
}
.tabs-list li{background-color: #bfefff !important;
   border: 2px solid #ff0094;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   padding: 4px;
   width: 100px;
}
.tabs-list .current{background-color: #7fdfff !important;
   border: 2px solid #ff0094;
   -webkit-border-radius: 5px;
   -moz-border-radius:5px;
   border-radius: 5px;
   padding: 4px;
   width: 100px;
}
.tabs-list li:Before {
   border-bottom: none !important;
}
.tabs-list li:after {
   border-bottom: none !important;
}

https://form.jotform.com/53374121039954 

I stumbled onto the following syntax for the triangles on either side. (Capitalization makes a difference too!) 

.tabs-list li .liBefore {
   border-bottom: none !important;
   }
.tabs-list li .liAfter {
   border-bottom: none !important;
  }

Current Tab settings and the top border are not working.

Seems like the basics could be added as settings into the widget...

Finally found a version of CSS that works! Check out http://www.jotform.com/answers/715014-Changing-the-Form-Tabs-color.

.tabs-list.default li {
font-size: 12px !important;
font-weight: bold !important;
color:#5805ff !important;
background: #bfefff !important;
border-top: 2px solid #ff0094 !important;
border: 2px solid #ff0094 !important;
-webkit-border-radius: 5px !important;
-moz-border-radius: 5px !important;
border-radius: 5px !important;
padding: 4px !important;
width: 100px !important;
}
.tabs-list.default li.current {
font-size: 12px !important;
font-weight: bold !important;
color:#5805ff !important;
background: #7fdfff !important;
border-top: 2px solid #ff0094 !important;
border: 2px solid #ff0094 !important;
-webkit-border-radius: 5px !important;
-moz-border-radius: 5px !important;
border-radius: 5px !important;
padding: 4px !important;
width: 100px !important;
}
.tabs-list.default .liAfter, .tabs-list.default .liBefore {
border-bottom: none !important;
}
.tabs-list.default li.current .liAfter, .tabs-list.default li.current .liBefore {
border-bottom: none !important;
}

I'm glad that you already found a working CSS code in one of our threads.

Should you need further assistance on this, please do not hesitate to contact us again.

Cheers!