Text popup and overlay [Shortcode]

[segment tag="section" style="1" spacing="large" class="categorybox"]
[row class="flex-box flex-wrap"]


[column span="4" class="item healthcare relative"]
<div class="overlay"></div>
<div class="inner">
[icon type="heartbeat" size="2x" color="default"]
<h3>Healthcare</h3>
<div class="popin">
<p>Our experienced specialists monitor and maintain your IT systems 24/7/365 and keep you compliant with regulatory requirements</p></div>
<a href="#" class="accent2 bold" target="_blank" rel="noopener noreferrer">Learn more [icon type="long-arrow-right" color="default"]</a>
</div>
[/column]

[column span="4" class="item legal relative"]
<div class="overlay"></div>
<div class="inner">
[icon type="balance-scale" size="2x" color="default"]
<h3>Legal</h3>
<div class="popin">
<p>Prevent data theft, ransomware, and other disastrous scenarios with our industry-specific IT solutions</p></div>
<a href="#" class="accent2 bold" target="_blank" rel="noopener noreferrer">Learn more [icon type="long-arrow-right" color="default"]</a>
</div>
[/column]

[column span="4" class="item finance relative"]
<div class="overlay"></div>
<div class="inner">
[icon type="money" size="2x" color="default"]
<h3>Finance</h3>
<div class="popin"><p>Get IT solutions that enable more automation, saving you time and energy and keeping you secure</p></div>
<a href="#" class="accent2 bold" target="_blank" rel="noopener noreferrer">Learn more [icon type="long-arrow-right" color="default"]</a>
</div>
[/column]

[column span="4" class="item accounting relative"]
<div class="overlay"></div>
<div class="inner">
<i class="fas fa-chart-line fa-2x"></i>
<h3>Accounting</h3>
<div class="popin"><p>Streamline your IT processes and implement cost-effective IT solutions that your bookkeepers need to do their job well</p></div>
<a href="#" class="accent2 bold" target="_blank" rel="noopener noreferrer">Learn more [icon type="long-arrow-right" color="default"]</a>
</div>
[/column]

[column span="4" class="item non-profit relative"]
<div class="overlay"></div>
<div class="inner">
[icon type="handshake-o" size="2x" color="default"]
<h3>Non-Profit</h3>
<div class="popin"><p>Get the affordable IT infrastructure you need to run your activities efficiently, keep your stakeholders informed, and accomplish your mission</p></div>
<a href="#" class="accent2 bold" target="_blank" rel="noopener noreferrer">Learn more [icon type="long-arrow-right" color="default"]</a>
</div>
[/column]


[/row]

[/segment]