<div>
Could it be behind the blue box? Also, could CSS later in the code be overwritting? Can you inspect the element w/ your browser and post a screenshot of the settings?
</div>


<div>
Here you go...<br><br>element.style {<br>}<br><br>styles.css:2597<br>.text-primary {<br>&nbsp;/* color: #007AFF !important; */<ol><li>&nbsp; &nbsp; color: #0297d7 !important;</li></ol>}<br><br>font-awesome.min.css:4<br>.fa-stack-2x {<br>&nbsp; &nbsp; font-size: 2em;<br>}<br><br>font-awesome.min.css:4<br>.fa-stack-1x, .fa-stack-2x {<br>&nbsp; &nbsp; position: absolute;<ol><li>&nbsp; &nbsp; left: 0;</li><li>&nbsp; &nbsp; width: 100%;</li><li>&nbsp; &nbsp; text-align: center;</li></ol>}<br><br>font-awesome.min.css:4<br>.fa {<br>&nbsp; &nbsp; display: inline-block;<ol><li>&nbsp; &nbsp; font: normal normal normal 14px/1 FontAwesome;</li><li>&nbsp; &nbsp; font-size: inherit;</li><li>&nbsp; &nbsp; text-rendering: auto;</li><li>&nbsp; &nbsp; -webkit-font-smoothing: antialiased;</li><li>&nbsp; &nbsp; -moz-osx-font-smoothing: grayscale;</li><li>&nbsp; &nbsp; transform: translate(0, 0);</li></ol>}<br><br>bootstrap.min.css:5<br>.text-primary {<br>&nbsp; &nbsp; color: #337ab7;<br>}<br>bootstrap.min.css:5<br>* {<br>&nbsp; &nbsp; -webkit-box-sizing: border-box;<ol><li>&nbsp; &nbsp; -moz-box-sizing: border-box;</li><li>&nbsp; &nbsp; box-sizing: border-box;</li></ol>}<br><br>user agent stylesheet<br>i {<br>&nbsp; &nbsp; font-style: italic;<br>}<br><br>Inherited from span.fa-stack.fa-2x<br>font-awesome.min.css:4<br>.fa-stack {<br>&nbsp; &nbsp; position: relative;<ol><li>&nbsp; &nbsp; display: inline-block;</li><li>&nbsp; &nbsp; width: 2em;</li><li>&nbsp; &nbsp; height: 2em;</li><li>&nbsp; &nbsp; line-height: 2em;</li><li>&nbsp; &nbsp; vertical-align: middle;</li></ol>}<br><br>font-awesome.min.css:4<br>.fa-2x {<br>&nbsp; &nbsp; font-size: 2em;<br>}<br><br>Inherited from div.panel.panel-white.no-radius.text-center<br>styles.css:3843<br><br>
</div>


Developer & Coffee Roaster

Scott Fell

<div>
That code does not help.<br><br>The easiest way to help you would be to provide a link to this page on your site. If this is generated dynamically, run it in the same manner as you have to create the screenshot. Then Save your rendered HTML browser as an HTML file. Finally upload the file as is to your server and provide the link for us.<br><br>The &nbsp;next option would be for you to set up a test case. &nbsp;I started here <a href="https://codepen.io/padas/pen/oNWoogE" rel="ugc">https://codepen.io/padas/pen/oNWoogE</a> I have added both iconify and font-awsome but you should double check. &nbsp;You will need to add the appropriate css to recreate this test case.<br><br>Otherwise, on your own, you can right click on the area and select, "Inspect". Review the console for any errors and then look in the elements tab (this is where right clicking on the element comes in handy). &nbsp;You will be able to see computed styles either to the side or bottom depending on how your browser tools are set up.<br><br>It looks like you must have got that far because of the way you copy and pasted your css, but hopefully you can also see that the css you pasted does not help to recreate a test case to identify the issue.<br><br>Once you can recreate this, we can better help identify the issue.
</div>


<div>
Thank you.&nbsp; I figured it out.&nbsp; Working Solution above. Have a great day.
</div>


The Fa Fa in the blue square (Invoice) is not showing,

   <div class="col-sm-4">
   <div class="panel panel-white no-radius text-center">
   <div class="panel-body">
   <span class="fa-stack fa-2x">
   <i class="fa fa-square fa-stack-2x text-primary"></i>
    <i class="iconify" data-icon="fa-solid:file-invoice-dollar fa-stack-1x fa-inverse"></i>
    </span>
   <h2 class="StepTitle">Invoices</h2>
   <p class="links-cl-effect-1">
   <a href="">Print Therapist Invoices</a>
   </p>
   </div>
   </div>
   </div>

Fa Fa not showing.

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.