Copy

<style>
    .btn-primary {
        border: none !important;
        border-radius: 6px;
        font-size: 1rem;
        padding: 8px 24px;
        background: #013757 !important;
        transition: all 0.3s ease;
        text-transform: uppercase !important;
        font-weight: 600;
    }

    .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus, .btn-primary:hover, .btn-primary:active {
        box-shadow: none !important;
        background: #00549F !important;
    }

    .btn-ghost, .hero-ghost-btn {
        background: transparent;
        border: 1px solid #fff;
        border-radius: 6px;
        color: #fff;
        text-transform: uppercase !important;
        padding: 12px 31px;
        font-weight: 600;
        transition: all 0.3s ease;
    }

    .btn-ghost:focus, .hero-ghost-btn:focus, .btn-ghost:active, .hero-ghost-btn:active, .btn-ghost:active:focus, .hero-ghost-btn:active:focus, .btn-ghost:hover, .hero-ghost-btn:hover, .btn-ghost:active, .hero-ghost-btn:active{
        box-shadow: none;
        background: #fff;
        color: #013757;
    }
</style>

<a href="#" class="fade-in fade-in-visible"><button class="btn-primary px-5 py-3">Button</button></a>

Copy

<style>
    .btn-ghost {
    background: transparent;
    border: 1px solid #fff;
    border-radius: 6px;
    color: #fff;
    text-transform: uppercase !important;
    padding: 12px 31px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-ghost:focus, .btn-ghost:active, .btn-ghost:active:focus, .btn-ghost:hover, .btn-ghost:active {
    box-shadow: none;
    background: #fff;
    color: #013757;
}
</style>

<a class="mt-4 mt-lg-0" href="#"><button class="btn-ghost px-5 py-3">Button</button></a>

Copy

<style>
    .btn-primary {
        border: none !important;
        border-radius: 6px;
        font-size: 1rem;
        padding: 8px 24px;
        background: #013757 !important;
        transition: all 0.3s ease;
        text-transform: uppercase !important;
        font-weight: 600;
    }

    .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus, .btn-primary:hover, .btn-primary:active {
        box-shadow: none !important;
        background: #00549F !important;
    }
</style>

<!-- Link for the Wista Video Button -->
<script src="https://fast.wistia.com/embed/medias/wdn7dswmz2.jsonp" async></script>
<script src="https://fast.wistia.com/assets/external/E-v1.js" async></script>
<span class="wistia_embed wistia_async_wdn7dswmz2 popover=true popoverContent=link videoFoam=false" style="display:inline-block;height:84;position:relative;width:150">
    <a ><button class="btn-primary px-5 py-3 fade-in">Watch How</button> </a>
</span>