You will just need to change the CSS Class to: icon-tabs
Paste this code in the custom CSS:
.et_pb_tabs.icon-tabs {
border: none;
}
.icon-tabs ul {
margin-bottom: 30px;
}
.icon-tabs .et_pb_tabs_controls li {
border-right: none;
}
.icon-tabs ul.et_pb_tabs_controls {
background-color: white;
}
.icon-tabs img.alignleft {
margin-right: 70px;
}
.icon-tabs .et_pb_all_tabs {
border-top: none;
}
.icon-tabs .et_pb_tabs_controls {
padding: 0 10% !important;
}
.icon-tabs .et_pb_tabs_controls li {
width: 50% !important;
}
.icon-tabs .et_pb_tabs_controls li a {
width: 100% !important;
text-align:center;
color: #a3a3a3;
text-transform: uppercase;
letter-spacing:2px;
font-weight: 600 !important;
}
.icon-tabs .et_pb_tab_active a {
color: #0b83a1 !important;
}
.icon-tabs .et_pb_tab h2 {
line-height: 1.5em;
color: #0b83a1;
font-weight: 600 !important;
font-size: 24px;
}
.icon-tabs .et_pb_tab p {
font-weight: 600 !important;
}
.icon-tabs .et_pb_tabs_controls li a:before {
display:block;
font-size:40px;
color: #a3a3a3;
margin-bottom: 15px;
font-weight: 600 !important;
}
.icon-tabs .et_pb_tabs_controls li.et_pb_tab_active a:before {
color: #0b83a1;
}
ul.et_pb_tabs_controls::after {
border-top: none !important;
}
.et_pb_tabs .et_pb_all_tabs .et_pb_tab {
padding-top: 1em;
}
/*
* === Mobile Styles ===
*/
@media (max-width: 768px) {
.icon-tabs .et_pb_tabs_controls li {
width: 100% !important;
}
.icon-tabs .et_pb_tabs_controls {
padding: 0 !important;
}
.icon-tabs .et_pb_tabs_controls li {
margin-bottom: 35px;
}
}
0 Comments