5 CSS Tricks for Elementor Accordions

Add to Custom CSS: .accordx .elementor-tab-title.elementor-active{background-color: #ff0000;font-size: 2REM;} .accordx .elementor-tab-title{background-color: #D0D0CE;font-size: 1.1REM;} .accordx .elementor-accordion > div:first-of-type { display:none;} /The bit below adds the top border back in/.accordx .elementor-accordion {border-top-style: solid;border-top-width: 0px;border-top-color: #ff0000;} .accordx .elementor-tab-title {border-radius: 25px;}.elementor-tab-content.elementor-clearfix {margin-top: 8px;border-radius: 25px;}

Elementor – Add Interchangeable Icons to Tabs

First add this Code into each Tab Title <span class=”custom-font-sec-h”><i style=”color: #000000; margin-right: 10px; font-size: 20px;” class=”fas fa-minus custom-font-h”></i><i style=”color: #FF0000; margin-right: 10px; font-size: 20px;” class=”fas fa-plus custom-font-h”></i><span/> Tab #1 Then Add this into the Advanced CSS for the Tabs .elementor-active .custom-font-h:nth-child(1){     opacity: 1;     transition: all 0.3s ease;     background: […]