i found this: `.iconlist-char:hover {
color: violet;
}

.iconbox_icon.heading-color.avia-font-entypo-fontello:hover {
color: green;
}`

but im not sure how to apply it to only certain icons or icons on icon boxes or icon lists, i turned on the custom class as suggested, but i can’t find the “custom class” option on any of the elements, i closed the browser and also did a hard reset

Hey Rikard,
me again with a part of the Output (this time for page: http://www.anbosa.de/pflegefachkraft-email/).
Obviously shortcode will output at a fifferent location than plain text. If you please have a look on the code below, I think this is not a problem of the plugin-code, but of the theme-code.
I’ve marked the two points where the shortcode and the text are output (OUTPUT SHORTCODE and OUTPUT TEXT).

<div class='stretch_full container_wrap alternate_color light_bg_color title_container'>
    <div class='container'>
    <h1 class='main-title entry-title'>
        <a href='http://www.anbosa.localhost/pflegefachkraft-email/' rel='bookmark' title='Permanenter Link zu: Pflegefachkraft – E-Mail'  itemprop="headline" >Pflegefachkraft – E-Mail</a>
    </h1>
    <div class="breadcrumb breadcrumbs avia-breadcrumbs">
        <div class="breadcrumb-trail" xmlns:v="http://rdf.data-vocabulary.org/#">
        <span class="trail-before">
            <span class="breadcrumb-title">Sie befinden sich hier:</span>
        </span>
        <a href="http://www.anbosa.localhost" title="anbosa" rel="home" class="trail-begin">Startseite</a>
        <span class="sep">/</span>
        <span class="trail-end">Pflegefachkraft – E-Mail</span>
        </div>
    </div>
    </div>
</div>
OUTPUT SHORTCODE
<div id='pfk-section' class='avia-section main_color avia-section-small avia-no-border-styling avia-bg-style-scroll avia-builder-el-0  el_before_av_section  avia-builder-el-first container_wrap sidebar_right'   >
    <div class='container' >
    <main  role="main" itemprop="mainContentOfPage" class='template-page content  av-content-small alpha units'>
        <div class='post-entry post-entry-type-page post-entry-4495'>
        <div class='entry-content-wrapper clearfix'>
            <div class="flex_column av_one_third first avia-builder-el-1  el_before_av_one_third  avia-builder-el-first ">
            <section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork" >
                <div class='avia_textblock '   itemprop="text" >
                <h3>E-Mail</h3>
                </div>
            </section>
            </div>
            <div class="flex_column av_one_third avia-builder-el-3  el_after_av_one_third  el_before_av_one_third ">
            <section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork" >
                <div class='avia_textblock '   itemprop="text" >
                <div class='avia-button-wrap avia-button-center avia-builder-el-5  avia-builder-el-no-sibling '>
                    <a href='http://www.anbosa.localhost/pflegefachkraft-persoenlicher-bereich/' class='avia-button  avia-icon_select-no avia-color-custom avia-size-large avia-position-center ' style='background-color:#ffffff; border-color:#ffffff; color:#FF5D4C; ' >
                    <span class='avia_iconbox_title' >Zurück</span>
                    </a>
                </div>
                </div>
            </section>
            </div>
            <div class="flex_column av_one_third avia-builder-el-6  el_after_av_one_third  avia-builder-el-last ">
            <section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork" >
                <div class='avia_textblock '   itemprop="text" >
                <p style="text-align: right;">Edouard Simon</p>
                </div>
            </section>
            </div>
        </div>
        </div>
    </main><!-- close content main element -->
    </div>
</div>
<div id='av_section_2' class='avia-section main_color avia-section-default avia-no-shadow avia-bg-style-scroll avia-builder-el-8  el_after_av_section  el_before_av_section container_wrap sidebar_right'   >
    <div class='container' >
    <div class='template-page content  av-content-small alpha units'>
        <div class='post-entry post-entry-type-page post-entry-4495'>
        <div class='entry-content-wrapper clearfix'>
            <section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork" >
            <div class='avia_textblock '   itemprop="text" >
               <p>OUTPUT TEXT</p>
            </div>
            </section> 

I swear I don’t, unless it’s in the parent – which I haven’t edited.

Here’s the custom CSS from the child in its’ entirety:

.logo { display: none !important; }

body {
  font-size: 14px;
}

@media only screen and (min-width: 767px) {
    div#header_main > .container {
        display: none;
    }
    .html_header_top.html_header_sticky.html_large.html_bottom_nav_header #main {
        padding-top: 37px;
    }
}

@media only screen and (max-width: 767px) {
    #advanced_menu_toggle{
        top: 55px;
    }
    #top .avia-builder-el-first {
        width: 80%;
    }
}

.image-overlay-inside, .image-overlay.overlay-type-extern {
display: none;
}

a.markerly-share-btn.markerly-share-markerly {
display: none;
}

h1, h2, h3, h4, h5, h1 strong, h2 strong, h3 strong, h4 strong, h5 strong  {
color: #F48132 !important;
text-transform: none !important;
letter-spacing: 0px !important;
}

i {
font-style: italic;
}

.main_color .av-masonry {
    background-color: #ffffff !important;
}

.content, .sidebar, .header_color div, .alternate_color, .main_color { border: none!important; }

.bottom_nav_header.social_header .main_menu ul:first-child>li a {
border: none;
}

.av-masonry-date {
display: none !important;
}

.av-masonry-entry .av-masonry-entry-title + .av-masonry-entry-content,  .av-masonry-entry-title {
text-align: center !important;
}

.slide-content {
background-color: #ffffff !important;
}

div#av-layout-grid-1, div#av-layout-grid-2 {
background-color: none !important;
}

#footer.container_wrap.footer_color {
border: 4px solid #ACACAC !important;
}

.widgettitle {
    font-weight: 800;
    text-transform: none;
    font-size: 18px;
}

#top .flex_column .template-blog .post-title {
    font-size: 22px;
}

.av-masonry-entry .av-masonry-entry-title {
    line-height: 1.3em;
    margin: 0px;
    font-size: 18px;
}

.av-masonry-entry  {
    line-height: 1.3em;
    margin: 0px;
    font-size: 13px !important;
}

.main_menu ul:first-child > li > a { font-size: 14px !important; }

.widget_recent_entries li a {
    font-family: "open sans" !important;
font-size: 14px !important;
font-style: normal !important;
font-weight: bold;
}

.main_menu{
background-color:#FFF;
}

.footerbig {
font-weight: normal !important;
font-size: 15px !important;
}

.avia-slideshow {
    position: relative;
    margin: 20px 0px !important;
    width: 100%;
    clear: both;
    overflow: hidden;
}

.content, .sidebar {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    box-sizing: content-box;
    min-height: 1px;
    z-index: 1;
}

.big-preview {
padding: 0 !important;
margin-top: 20px;
}

.iconbox {
border: 2px solid #666 !important;
padding: 5px !important;
}

.iconbox .iconbox_content .iconbox_content_title {
    border: medium none;
    padding: 2px 0px 0px;
    position: relative;
    margin: 0px 0px 16px;
    clear: none;
    overflow: hidden;
    letter-spacing: 1px;
    text-transform: none;
    font-size: 18px;
}

#top .news-thumb img {
display: none !important;
}

.news-thumb {
display: none !important;
}

.main_color div .news-headline {
color: #f47f32 !important;
font-size: 14px !important;
}

.avia-post-nav {
display: none !important;
}

.main_menu .menu ul { width: 215px !important; }

h1 {
    font-size: 28px;
    line-height: 1.1em;
    margin-bottom: 14px;
}

#tribe-events-pg-template {
    max-width: 100%;
    padding-top: 30px !important;
}
.gform_footer input.button, .gform_wrapper .gform_footer input[type="submit"] {
    font-size: 1.5em;
font-weight: bold;
text-transform: uppercase;
border-radius: 9px 9px 9px 9px;
-moz-border-radius: 9px 9px 9px 9px;
-webkit-border-radius: 9px 9px 9px 9px;
border: 3px solid #666666;
}

.social-icons-widget ul li {
    float: none !important;
    margin: 0px 2px 2px 0px !important;
    display: inline-block !important;
}

blockquote {
    border-left-style: solid;
    border-left-width: 14px;
    padding: 5px 5px 5px 20px;
    margin-bottom: 1em;
    margin-right: 0em;
    font-size: 18px;
    line-height: 1.5em;
color: #ffffff !important;
font-weight: 800;
background-color: #BBBBBB;
}

body .column-top-margin {
    margin-top: 10px;
}
/* Front Page Submit Field */
#gform_widget-2 {
    top: 20px !important;
}
#gform_1 #gform_submit_button_1 {
    float: right;
    position: absolute;
    top: 0;
    left: 220px;
}
#gform_1 #gform_submit_button_1 {
    margin-left: -32px;
}
#gform_1 #input_1_2 {
    width: 190px;
    margin-left: -10px;
}
/* End submit field */
.added_to_cart_notification { 
display: none !important; 
}

#footer .container {
padding-top: 0px;
padding-bottom: 0px;
}

#footer .widget { padding: 0px 0 0px 0; }

.comment-count, .comment-text  {
display: none;
}

div.related_posts {
display: none!important;
}

.template-blog .post_delimiter {
    margin: 0px 0px 10px;
    padding: 10px 0px 0px;
    clear: both;
}

.avia-button, .main_color input[type="submit"] {
-webkit-box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
-moz-box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
}

.boxGoodness {
-webkit-box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
-moz-box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
box-shadow: 7px 7px 5px -6px rgba(0,0,0,0.75);
}

.newlist {
    list-style-type: none !important;
    padding: 0px;
    margin: 0px;
}

.newlist {
    background-image: url(https://143.95.43.131/~jimmycar/wp-content/uploads/2015/03/jimmycheck.png);
    background-repeat: no-repeat;
    background-position: 0px center;
    padding-left: 35px !important;
}

span.wpcf7-list-item {
margin-left: 0.5em !important;
display: block !important;
}

#newsbox-4 {
    padding-top: 40px !important;
}

.avia-testimonial-wrapper {
    display: table;
    margin: 15px 0px !important;
    clear: both;
}

#top .av-large-testimonial-slider .avia-testimonial-content {
    border: medium none;
    padding: 0px;
    background: none repeat scroll 0% 0% transparent;
    font-size: 1.6em !important;
    line-height: 1.65em !important;
font-weight: bold !important;
color: #F47F32 !important;
}

#top .av-large-testimonial-slider .avia-testimonial-name {
    font-size: 1.6em;
    margin-top: .25em !important;
}

Hi Andy
It’s not the background that Elliot changed for me but the icon. And that worked fine on an iconbox but I cannot seem to get it to work on a iconlist. I wanted to place a custom icon in the list replacing the Fontello icons.

This is the original code that Elliott gave me was to change the icon in the iconbox to a custom icon (not a fontello font) see code below:-

.custom-iconbox .iconbox_icon.heading-color {
background-image: url(https://.........mywebsite url.........)!important;
background-size: contain;
background-repeat: no-repeat;
background-position: 50% 50%;
}
.custom-iconbox .iconbox_icon.heading-color:before {
display: none; 
}

I changed the iconbox to iconlist thinking that would change the icons in the iconlist as well but it didn’t.
Where I am going wrong??
Regards
Richard