CSS list-style with Font-Awesome toolkit
Properly formatted CSS can make your styles vastly more readable, helping you find bugs as well as making it easier to work with. 

This:


ul.long_arrow_right_red,ul.long_arrow_right_gold     {list-style: none;}
ul.long_arrow_right_gold li:before {content:"\f178"; font-family: FontAwesome;display: block;float: left;width: 1.5em;color:gold;}
ul.long_arrow_right_red  li:before {content:"\f178"; font-family: FontAwesome;display: block;float: left;width: 1.5em;color:red;}



Should instead be something like this:

ul.long_arrow_right_red,
ul.long_arrow_right_gold {
    list-style: none;
}

ul.long_arrow_right_gold li:before {
    content: "\f178"; 
    font-family: FontAwesome;
    display: block;
    float: left;
    width: 1.5em;
    color: gold;
}

ul.long_arrow_right_red li:before {
    content: "\f178"; 
    font-family: FontAwesome;
    display: block;
    float: left;
    width: 1.5em;
    color: red;
}


If you want to have the code "minified" then do that before you deploy it, source code should aim for readability and maintainability, rather than length / character count.