svg.cp-icon .cp-icon-bg { fill: transparent; transition: all 1s ease;}
svg.cp-icon .cp-icon-black { fill: black; transition: all 0.5s ease;}
svg.cp-icon .cp-icon-grey { fill: #ccc; transition: all 0.5s ease;}
svg.cp-icon .cp-icon-red { fill: #961b1e; transition: all 0.5s ease;}

/*svg.cp-icon:hover .cp-icon-bg { fill: #961b1e33; }*/
/*svg.cp-icon:hover .cp-icon-black { fill: black; }*/
/*svg.cp-icon:hover .cp-icon-grey { fill: #ccc; }*/
/*svg.cp-icon:hover .cp-icon-red { fill: #961b1e; }*/

svg.cp-icon:hover .cp-icon-bg { fill: black; }
svg.cp-icon:hover .cp-icon-black { fill: #ddd; }
svg.cp-icon:hover .cp-icon-grey { fill: #aaa; }
svg.cp-icon:hover .cp-icon-red { fill: #961b1e; }


/*
svg:hover .cp-icon-bg { fill: orange; }
svg:hover .cp-icon-black { fill: red; }
svg:hover .cp-icon-grey { fill: blue; }
svg:hover .cp-icon-red { fill: green; }
*/


#capability-icon svg.cp-icon .cp-icon-bg, #capability-icon svg.cp-icon:hover .cp-icon-bg { fill: black; }
#capability-icon svg.cp-icon .cp-icon-black, #capability-icon svg.cp-icon:hover .cp-icon-black { fill: #ddd; }
#capability-icon svg.cp-icon .cp-icon-grey, #capability-icon svg.cp-icon:hover .cp-icon-grey { fill: #aaa; }
#capability-icon svg.cp-icon .cp-icon-red, #capability-icon svg.cp-icon:hover .cp-icon-red { fill: #961b1e; }