oceanwp top bar customization

/**replacing the default oceanwp top bar section with this**/

<div class="topbar">
<div class="topbar-content">
<div class="topbar-links">
<div class="top-contact-links">

<a href="https://wa.me/yourmobile" class="whatsapp-icon"><i class="fa fa-whatsapp" aria-hidden="true"></i></a>
<a href="tel:+yourmobile"><i class="fa fa-volume-control-phone" aria-hidden="true"></i>+yourmobile</a>
<a href="You Link" target="_blank"><i class="fa fa-map-marker" aria-hidden="true"></i><span>Flagship</span>Your Text</a>
<a href="You Link" target="_blank"><i class="fa fa-map-marker" aria-hidden="true"></i><span>New</span>You Text (New)</a>
</div>
<?php 
if(!is_user_logged_in()){ ?>
<div class="user-links logged-in-links">
<a href="#opl-login-form" class="opl-link"><i class="fa fa-sign-in" aria-hidden="true"></i>Login</a>

</div>
<?php } ?>
<?php 
if(is_user_logged_in()){ ?>
<div class="user-links logged-out-links">

<a href="/wp-login.php?action=logout"><i class="fa fa-sign-out" aria-hidden="true"></i>Logout</a>
</div>
<?php } ?>
</div>
</div>
</div>