<style>
    .sfsi-footer-container {
        margin: 0 auto;
        text-align: center;
        width: 75%;
    }

    .sfsi-footer-pointing-to-premium-plugin {
        float: left;
        background: #fff;
        padding: 33px 0px;
        color: #414951 !important;
    }

    .sfsi-footer-pointing-heading {
        margin-top: 40px;
        text-align: center;
        padding-bottom: 15px;
    }

    .sfsi-footer-pointing-heading p {
        font-size: 23px;
        font-weight: 600;
    }

    .sfsi-footer-pointing-heading .sfsi-green-heading {
        color: #12a252;
    }

    .sfsi-footer-pointing-content {
        background: #fff;
    }

    .sfsi-footer-left-section {
        width: 57%;
        position: relative;
        min-height: 1px;
        float: left;
        padding-right: 15px;
        padding-left: 15px;
        margin-left: 15px;
    }

    .sfsi-footer-right-section {
        width: 34%;
        position: relative;
        min-height: 1px;
        float: left;
        padding-right: 15px;
        padding-left: 15px;
        text-align: center;
    }

    .sfsi-equal-col-md-6 {
        width: 50%;
        position: relative;
        min-height: 1px;
        float: left;
    }

    .sfsi-left-image-section {
        width: 52px;
        display: inline-block;
        text-align: center;
        height: 43px;
        vertical-align: middle;
    }

    .sfsi-li-right-content {
        text-align: left;
        padding-left: 25px;
        font-size: 16px;
        font-weight: 600;
        vertical-align: middle;
        width: calc(100% - 95px);
        display: inline-block;
    }

    .sfsi-footer-left-section ul li:not(:last-child) {
        margin-bottom: 20px;
    }

    .sfsi-checkout-premium-plugin-button {
        font-size: 18px;
        text-align: center;
        background: #12a252;
        color: #FFF !important;
        padding: 11px 30px;
        text-decoration: none;
        display: inline-block;
        margin-top: 15px;
        font-weight: 700;
    }

    .so-much-more {
        float: left;
        width: 100%;
        text-align: center;
        font-size: 17px;
        margin-top: 28px !important;
        font-weight: 700 !important;
    }

    .so-much-more a {
        color: #12a252;
    }

    .sfsi-footer-bottom-text {
        float: left;
        width: 99%;
        text-align: center;
        color: #414951 !important;
        padding-top: 15px !important;
    }

    .sfsi-footer-bottom-text p {
        font-size: 18px;
    }

    @media(min-width: 320px) and (max-width: 480px) {
        .sfsi-footer-container {
            width: 100% !important;
        }

        .sfsi-footer-bottom-text {
            display: inline-block;
            float: left !important;
            width: 100% !important;
        }
    }

    @media (min-width: 320px) and (max-width: 767px) {
        .sfsi-equal-col-xs-12 {
            width: 100%;
        }

        .sfsi-footer-left-section {
            width: 76%;
        }

        .sfsi-footer-right-section {
            width: 88%;
            padding-top: 30px;
        }

        .sfsi-right-video iframe {
            height: 125px;
        }

        .sfsi-checkout-premium-plugin-button {
            font-size: 16px;
        }

        .sfsi-footer-bottom-text {
            float: unset !important;
            width: 65%;
            margin-left: auto;
            margin-right: auto;
        }
    }

    @media(min-width: 768px) and (max-width: 1023px) {
        .sfsi-footer-container {
            width: 100%;
        }

        .sfsi-footer-left-section {
            width: 95%;
        }

        .sfsi-footer-right-section {
            width: 95%;
            margin-top: 20px;
        }

        .sfsi-footer-pointing-heading p {
            font-size: 20px;
        }
    }

    @media(min-width: 1024px) and (max-width: 1032px) {
        .sfsi-footer-container {
            width: 100%;
        }

        .sfsi-footer-left-section {
            width: 56%;
            margin-left: 0px !important;
        }

        .sfsi-footer-right-section {
            width: 34%;
        }
    }

    @media(min-width: 1033px) and (max-width: 1050px) {
        .sfsi-footer-left-section {
            width: 56%;
        }

        .sfsi-footer-right-section {
            width: 35%;
        }
    }

    @media(min-width: 1051px) and (max-width: 1115px) {
        .sfsi-footer-left-section {
            width: 52%;
        }

        .sfsi-footer-right-section {
            width: 39%;
        }
    }

    @media(min-width: 1116px) and (max-width: 1223px) {
        .sfsi-footer-left-section {
            width: 52%;
        }

        .sfsi-footer-right-section {
            width: 40%;
        }
    }

    @media(min-width: 1224px) and (max-width: 1347px) {
        .sfsi-footer-left-section {
            width: 50%;
        }

        .sfsi-footer-right-section {
            width: 43%;
        }
    }

    @media(min-width: 1348px) and (max-width: 2300px) {
        .sfsi-footer-left-section {
            width: 51%;
        }

        .sfsi-footer-right-section {
            width: 40%;
        }
    }
</style>

<!-- Footer banner STARTS -->
<div class="sfsi-footer-pointing-heading">
    <p>
        <span class="sfsi-green-heading">Like the free plugin?</span>
        <span class="sfsi-black-heading">See what the Premium Plugin has to offer...</span>
    </p>
</div>

<div class="sfsi-footer-container" style="display: inline-flex;justify-content: center;width: 100% !important;">

    <div class="sfsi-footer-pointing-to-premium-plugin" style="width:75%">
        <div class="sfsi-footer-pointing-content clearfix">
            <div class="sfsi-footer-left-section">
                <div class="row">
                    <div class="sfsi-equal-col-md-6 sfsi-equal-col-xs-12">
                        <ul>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/more_likes_shares.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    More Likes & Shares
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/more_icon_designs.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    More icon designs
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/themed_icons.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    Themed icons
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/better_icon_placement.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    Better icon placement
                                </span>
                            </li>
                        </ul>
                    </div>
                    <div class="sfsi-equal-col-md-6 sfsi-equal-col-xs-12">
                        <ul>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/mobile_optimization.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    Mobile optimization
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/faster_loading.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    Faster loading
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/friendly_support.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    Friendly support
                                </span>
                            </li>
                            <li>
                                <span class="sfsi-left-image-section">
                                    <img src="<?php echo SFSI_PLUGURL ?>images/footer_banner/more_platforms.png" alt='error'>
                                </span>
                                <span class="sfsi-li-right-content">
                                    More platforms
                                </span>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <p class="so-much-more">...and <a target="_blank" href="https://www.ultimatelysocial.com/usm-premium/?utm_source=usmi_settings_page&utm_campaign=new_bottom_banner_to_checkout&utm_medium=banner">so much more</a></p>
                    </div>
                </div>
            </div>
            <div class="sfsi-footer-right-section">
                <span class="sfsi-right-video">
                    <div style="position:relative;padding-top:56.25%;">
                        <iframe src="https://video.inchev.com/videos/embed/c952d896-34be-45bc-8142-ba14694c1bd0" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" style="position:absolute;top:0;left:0;width:100%;height:100%;"></iframe>
                    </div>
                </span>
                <a target="_blank" href="https://www.ultimatelysocial.com/usm-premium/?utm_source=usmi_settings_page&utm_campaign=new_bottom_banner_to_checkout&utm_medium=banner" class="sfsi-checkout-premium-plugin-button">Check out the Premium Plugin >></a>
            </div>
        </div>
    </div>

</div>

<div class="sfsi-footer-bottom-text">
    <p>..only 29.98 USD (includes support and updates for six months, and after that it will not be deactivated, so you can just keep using it!)</p>
</div>

<!-- Footer banner CLOSES -->


<!-- <div style="clear:both">
    <?php // $noncea = wp_create_nonce("sfsi_installDate"); ?>
    <label style="font-size: 17px;">Installed date: </label>
    <input type="text" name="sfsi_installDate" placeholder="date" value="<?php //  echo get_option("sfsi_installDate"); ?>">
    <button type="button" id="sfsi_installDate" data-nonce="<?php // echo $noncea; ?>"> click</button>
</div> -->

<!-- <div style="clear:both">
    <?php  // $noncec = wp_create_nonce("sfsi_currentDate"); ?>
    <label style="font-size: 17px;">Current date: </label>
    <input type="text" name="sfsi_currentDate" placeholder="date" value="<?php // echo get_option("sfsi_currentDate"); ?>">
    <button type="button" id="sfsi_currentDate" data-nonce="<?php // echo $noncec; ?>"> click</button>
</div> -->
<!-- <div style="clear:both">
    <?php // $noncec = wp_create_nonce("sfsi_showNextBannerDate"); ?>
    <label style="font-size: 17px;">show next banner in (ex: 1 seconds,1 minute,1 hour,1 day ): </label>
    <input type="text" name="sfsi_showNextBannerDate" placeholder="no of days" value="<?php // echo get_option("sfsi_showNextBannerDate"); ?>">
    <button type="button" id="sfsi_showNextBannerDate" data-nonce="<?php // echo $noncec; ?>"> click</button>
</div>
<div style="clear:both">
    <?php // $noncec = wp_create_nonce("sfsi_cycleDate"); ?>
    <label style="font-size: 17px;">Cycle in (ex: 1 seconds,1 minute,1 hour,1 day ): </label>
    <input type="text" name="sfsi_cycleDate" placeholder="no of days" value="<?php // echo get_option("sfsi_cycleDate"); ?>">
    <button type="button" id="sfsi_cycleDate" data-nonce="<?php // echo $noncec; ?>"> click</button>
</div>
<div style="clear:both">
    <?php // $noncec = wp_create_nonce("sfsi_loyaltyDate"); ?>
    <label style="font-size: 17px;">Loyalty in (ex: 1 seconds,1 minute,1 hour,1 day ): </label>
    <input type="text" name="sfsi_loyaltyDate" placeholder="no of days" value="<?php // echo get_option("sfsi_loyaltyDate"); ?>">
    <button type="button" id="sfsi_loyaltyDate" data-nonce="<?php // echo $noncec; ?>"> click</button>
</div>
<?php //
// $sfsi_banner_global_firsttime_offer = unserialize(get_option('sfsi_banner_global_firsttime_offer', false));
// $sfsi_banner_global_pinterest = unserialize(get_option('sfsi_banner_global_pinterest', false));
// $sfsi_banner_global_social = unserialize(get_option('sfsi_banner_global_social', false));
// $sfsi_banner_global_load_faster = unserialize(get_option('sfsi_banner_global_load_faster', false));
// $sfsi_banner_global_shares = unserialize(get_option('sfsi_banner_global_shares', false));
// $sfsi_banner_global_gdpr = unserialize(get_option('sfsi_banner_global_gdpr', false));
// $sfsi_banner_global_http = unserialize(get_option('sfsi_banner_global_http', false));
// $sfsi_banner_global_upgrade = unserialize(get_option('sfsi_banner_global_upgrade', false));
?>-->
<!-- 
<div style="clear:both">
    <?php // $noncef = wp_create_nonce("sfsi_banner_global_firsttime_offer"); ?>
    <label style="font-size: 17px;">Dismiss Firsttime offer time:</label>
    <input type="text" name="sfsi_banner_global_firsttime_offer" placeholder="date" value="<?php // echo $sfsi_banner_global_firsttime_offer['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_firsttime_offer" data-nonce="<?php // echo $noncef; ?>"style="display: <?php // echo $sfsi_banner_global_firsttime_offer['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div> -->

<!--
<div style="clear:both">
    <?php // $noncep = wp_create_nonce("sfsi_banner_global_pinterest"); ?>
    <label style="font-size: 17px;">Dismiss Pinterest time: </label>
    <input type="text" name="sfsi_banner_global_pinterest" placeholder="date" value="<?php // echo $sfsi_banner_global_pinterest['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_pinterest" data-nonce="<?php // echo $noncep; ?>" style="display: <?php // echo $sfsi_banner_global_pinterest['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $noncem = wp_create_nonce("sfsi_banner_global_social"); ?>
    <label style="font-size: 17px;">Dismiss Mobile time: </label>
    <input type="text" name="sfsi_banner_global_social" placeholder="date" value="<?php // echo $sfsi_banner_global_social['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_social" data-nonce="<?php // echo $noncem; ?>" style="display: <?php // echo $sfsi_banner_global_social['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $noncel = wp_create_nonce("sfsi_banner_global_load_faster"); ?>
    <label style="font-size: 17px;">Dismiss Load faster time: </label>
    <input type="text" name="sfsi_banner_global_load_faster" placeholder="date" value="<?php // echo $sfsi_banner_global_load_faster['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_load_faster" data-nonce="<?php // echo $noncel; ?>" style="display: <?php // echo $sfsi_banner_global_load_faster['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $nonces = wp_create_nonce("sfsi_banner_global_shares"); ?>
    <label style="font-size: 17px;">Dismiss Shares time: </label>
    <input type="text" name="sfsi_banner_global_shares" placeholder="date" value="<?php // echo $sfsi_banner_global_shares['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_shares" data-nonce="<?php // echo $nonces; ?>" style="display: <?php // echo $sfsi_banner_global_shares['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $nonceg = wp_create_nonce("sfsi_banner_global_gdpr"); ?>
    <label style="font-size: 17px;">Dismiss Gdpr time: </label>
    <input type="text" name="sfsi_banner_global_gdpr" placeholder="date" value="<?php // echo $sfsi_banner_global_gdpr['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_gdpr" data-nonce="<?php // echo $nonceg; ?>" style="display: <?php // echo $sfsi_banner_global_gdpr['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $nonceh = wp_create_nonce("sfsi_banner_global_http"); ?>
    <label style="font-size: 17px;">Dismiss Http time: </label>
    <input type="text" name="sfsi_banner_global_http" placeholder="date" value="<?php // echo $sfsi_banner_global_http['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_http" data-nonce="<?php // echo $nonceh; ?>" style="display: <?php // echo $sfsi_banner_global_http['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div>

<div style="clear:both">
    <?php // $nonceu = wp_create_nonce("sfsi_banner_global_upgrade"); ?>
    <label style="font-size: 17px;">Dismiss Loyalty time: </label>
    <input type="text" name="sfsi_banner_global_upgrade" placeholder="date" value="<?php // echo $sfsi_banner_global_upgrade['timestamp'] ?>">
    <button type="button" id="sfsi_banner_global_upgrade" data-nonce="<?php // echo $nonceu; ?>" style="display: <?php // echo $sfsi_banner_global_upgrade['is_active'] == "yes" ? "inline-block": "none" ?>;"> This banner will appear</button>
</div> -->
