<link rel="stylesheet" type="text/css" href="<?php echo plugins_url('/css/select2.min.css', __FILE__) ?>" />
<link rel="stylesheet" type="text/css" href="<?php echo plugins_url('/css/upgrade-to-pro.css', __FILE__) ?>" />
<script type="text/javascript" src="<?php echo plugins_url('/js/select2.min.js', __FILE__) ?>" ></script>
<?php $pro_url = "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=" ?>
<div class="key-table">
    <div class="modal-upgrade upgrade-block" id="folder-modal">
        <div class="easy-modal-inner">
            <div class="container">
                <div class="pricing-table">
                    <div class="price-title">Unlock All Features</div>
                    <div class="pricing-table-header">
                        <div class="pricing-table-body">
                            <div class="pricing-table-content first active" data-option="1_year">
                                <div class="year-col">1 Year</div>
                                <div class="update-col">Updates &amp; Support</div>
                                <div class="pricing-discount-col"></div>
                            </div>
                            <div class="pricing-table-content second" data-option="2_year">
                                <div class="year-col">2 Years</div>
                                <div class="update-col">Updates &amp; Support</div>
                                <div class="pricing-discount-col"><span>32% off &#128526;</span></div>
                            </div>
                            <div class="pricing-table-content third" data-option="lifetime">
                                <div class="year-col">Lifetime</div>
                                <div class="update-col">Updates &amp; Support</div>
                                <div class="pricing-discount-col"><span>63% off &#129395;</span></div>
                            </div>
                        </div>
                    </div>
                    <div class="price-tables">
                        <div class="row">
                            <div class="col-md-4 col-sm-12">
                                <div class="price-table basic-feature">
                                    <div class="price-table-top">
                                        <div class="price-head">
                                            <div class="plan-name">Basic</div>
                                            <div class="plan-price">$39<span>/year</span></div>
                                        </div>
										<div class="plan-center">
											<div class="price-permonth">Less than <b>$3.5</b>/mo · <b>Billed Annually</b></div>
											<!--div class="price-websites">For small website owners</div-->
											<div class="price-offer">Renewals for 25% off</div>
										</div>
                                    </div>
                                    <div class="price-table-middle">
                                        <ul>
                                            <li><a href="javascript:;" class="cus-tooltip"><b>1 website</b> <span class="has-tooltip">*</span><span class="tooltip__content">Use My Sticky Elements on 1 domain</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Get leads to email <span class="has-tooltip">*</span><span class="tooltip__content">You can get the emails from your contact form directy to your email</span></a></li>											
                                            <li><a href="javascript:;" class="cus-tooltip">Unlimited icons <span class="has-tooltip">*</span><span class="tooltip__content">Show unlimited social icons such as WhatsApp, Facebook, Twitter, Phone and more</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom icons <span class="has-tooltip">*</span><span class="tooltip__content">Upload your own icons for your floating tabs</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom contact form fields <span class="has-tooltip">*</span><span class="tooltip__content">Add custom fields to your contact form including text, text area, dropdowns, file upload, website, date, and number fields</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Contact form integration with MailChimp & MailPoet<span class="has-tooltip">*</span><span class="tooltip__content">Turn on email integration to get leads directly to your MailChimp or MailPoet lists when customers submit their emails through the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Spam protection with Google reCAPTCHA <span class="has-tooltip">*</span><span class="tooltip__content">Integrate Google's reCAPTCHA (supports both V2 or V3) to restrict spammers from abusing the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Custom redirection/thank you page after form submission <span class="has-tooltip">*</span><span class="tooltip__content">Redirect your audience to a separate page or show custom messages as your preference</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Google Analytics<span class="has-tooltip">*</span><span class="tooltip__content">Track which channels are getting the most clicks with GA events</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom CSS style <span class="has-tooltip">*</span><span class="tooltip__content">Add CSS of your own to your form and social tabs</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom height position <span class="has-tooltip">*</span><span class="tooltip__content">Change the height position of the tabs on your website</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Multiple widgets <span class="has-tooltip">*</span><span class="tooltip__content">Create different bars for different pages. Show different icons, form and language based on page targeting rules</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Page targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show/hide the widget on specific pages</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Country targeting <span class="has-tooltip">*</span><span class="tooltip__content">Target your widget to specific countries. You can create different widgets for different countries</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Available days and hours <span class="has-tooltip">*</span><span class="tooltip__content">Display the widget on specific days and hours based on your opening days and hours</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Traffic source targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show the widget only to visitors who come from specific traffic sources including direct traffic, social networks, search engines, Google Ads, or any other traffic source</span></a></li>
                                        </ul>
                                    </div>
                                    <div class="price-table-bottom">
                                        <div class="custom-dd">
                                            <select class="multiple-options">
                                                <option data-option="1_year" data-header="Renewals for 25% off" data-price="39" data-per-month="3.5" value="<?php echo $pro_url ?>22">Updates &amp; support for 1 year</option>
                                                <option data-option="2_year" data-header="For 2 years" data-price="59" data-per-month="2.5" value="<?php echo $pro_url ?>23">Updates &amp; support for 2 years</option>
                                                <option data-option="lifetime" data-header="For lifetime" data-price="119"  data-per-month="" value="<?php echo $pro_url ?>24">Updates &amp; support for lifetime</option>
                                            </select>
                                        </div>
                                        <a class="cart-link" target="_blank" href="<?php echo esc_url($pro_url."22") ?>">Buy now</a>
                                    </div>
									<div class="bottom-position"></div>
                                </div>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <div class="price-table plus-feature">
                                    <div class="price-table-top">
                                        <div class="price-head">
                                            <div class="plan-name">Plus</div>
                                            <div class="plan-price">$89<span>/year</span></div>
                                        </div>
										<div class="plan-center">
											<div class="price-permonth">Less than <b>$7.5</b>/mo · <b>Billed Annually</b></div>
											<!--div class="price-websites">For businesses with multiple websites</div-->
											<div class="price-offer">Renewals for 25% off</div>
										</div>
                                    </div>
                                    <div class="price-table-middle">
                                        <ul>
                                            <li><a href="javascript:;" class="cus-tooltip"><b>5 websites</b> <span class="has-tooltip">*</span><span class="tooltip__content">Use My Sticky Elements on 5 domains</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Get leads to email <span class="has-tooltip">*</span><span class="tooltip__content">You can get the emails from your contact form directy to your email</span></a></li>											
                                            <li><a href="javascript:;" class="cus-tooltip">Unlimited icons <span class="has-tooltip">*</span><span class="tooltip__content">Show unlimited social icons such as WhatsApp, Facebook, Twitter, Phone and more</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom icons <span class="has-tooltip">*</span><span class="tooltip__content">Upload your own icons for your floating tabs</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom contact form fields <span class="has-tooltip">*</span><span class="tooltip__content">Add custom fields to your contact form including text, text area, dropdowns, file upload, website, date, and number fields</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Contact form integration with MailChimp & MailPoet<span class="has-tooltip">*</span><span class="tooltip__content">Turn on email integration to get leads directly to your MailChimp or MailPoet lists when customers submit their emails through the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Spam protection with Google reCAPTCHA <span class="has-tooltip">*</span><span class="tooltip__content">Integrate Google's reCAPTCHA (supports both V2 or V3) to restrict spammers from abusing the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Custom redirection/thank you page after form submission <span class="has-tooltip">*</span><span class="tooltip__content">Redirect your audience to a separate page or show custom messages as your preference</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Google Analytics<span class="has-tooltip">*</span><span class="tooltip__content">Track which channels are getting the most clicks with GA events</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom CSS style <span class="has-tooltip">*</span><span class="tooltip__content">Add CSS of your own to your form and social tabs</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom height position <span class="has-tooltip">*</span><span class="tooltip__content">Change the height position of the tabs on your website</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Multiple widgets <span class="has-tooltip">*</span><span class="tooltip__content">Create different bars for different pages. Show different icons, form and language based on page targeting rules</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Page targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show/hide the widget on specific pages</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Country targeting <span class="has-tooltip">*</span><span class="tooltip__content">Target your widget to specific countries. You can create different widgets for different countries</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Available days and hours <span class="has-tooltip">*</span><span class="tooltip__content">Display the widget on specific days and hours based on your opening days and hours</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Traffic source targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show the widget only to visitors who come from specific traffic sources including direct traffic, social networks, search engines, Google Ads, or any other traffic source</span></a></li>
                                        </ul>
                                    </div>
                                    <div class="price-table-bottom">
                                        <div class="custom-dd">
                                            <select class="multiple-options">
                                                <option data-option="1_year" data-header="Renewals for 25% off" data-price="89" data-per-month="7.5"value="<?php echo $pro_url ?>25">Updates &amp; support for 1 year</option>
                                                <option data-option="2_year" data-header="For 2 years" data-price="139" data-per-month="6.0" value="<?php echo $pro_url ?>26">Updates &amp; support for 2 years</option>
                                                <option data-option="lifetime" data-header="For lifetime" data-price="229" value="<?php echo $pro_url ?>27">Updates &amp; support for lifetime</option>
                                            </select>
                                        </div>
                                        <a class="cart-link" target="_blank" href="<?php echo esc_url($pro_url."25") ?>">Buy now</a>
                                    </div>
									<div class="bottom-position"></div>
                                </div>
                            </div>
                            <div class="col-md-4 col-sm-12">
                                <div class="price-table agency-feature">
                                    <div class="price-table-top">
                                        <div class="price-head">
                                            <div class="plan-name">Agency</div>
                                            <div class="plan-price">$149<span>/year</span></div>
                                        </div>
										<div class="plan-center">
											<div class="price-permonth">Less than <b>$12.5</b>/mo · <b>Billed Annually</b></div>
											<!--div class="price-websites">For agencies who manage clients</div-->
											<div class="price-offer">Renewals for 25% off</div>
										</div>
                                    </div>
                                    <div class="price-table-middle">
                                        <ul>
                                            <li>
                                                <div class="website-package">
                                                    <select class="multiple-web-options">
                                                        <option value="50_websites">50 websites</option>
                                                        <option value="500_websites">500 websites</option>
                                                        <option value="1000_websites">1000 websites</option>
                                                    </select>
                                                </div>
                                            </li>
                                            <li><a href="javascript:;" class="cus-tooltip">Get leads to email <span class="has-tooltip">*</span><span class="tooltip__content">You can get the emails from your contact form directy to your email</span></a></li>											
                                            <li><a href="javascript:;" class="cus-tooltip">Unlimited icons <span class="has-tooltip">*</span><span class="tooltip__content">Show unlimited social icons such as WhatsApp, Facebook, Twitter, Phone and more</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom icons <span class="has-tooltip">*</span><span class="tooltip__content">Upload your own icons for your floating tabs</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom contact form fields <span class="has-tooltip">*</span><span class="tooltip__content">Add custom fields to your contact form including text, text area, dropdowns, file upload, website, date, and number fields</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Contact form integration with MailChimp & MailPoet<span class="has-tooltip">*</span><span class="tooltip__content">Turn on email integration to get leads directly to your MailChimp or MailPoet lists when customers submit their emails through the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Spam protection with Google reCAPTCHA <span class="has-tooltip">*</span><span class="tooltip__content">Integrate Google's reCAPTCHA (supports both V2 or V3) to restrict spammers from abusing the contact form</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Custom redirection/thank you page after form submission <span class="has-tooltip">*</span><span class="tooltip__content">Redirect your audience to a separate page or show custom messages as your preference</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Google Analytics<span class="has-tooltip">*</span><span class="tooltip__content">Track which channels are getting the most clicks with GA events</span></a></li>
                                            <li><a href="javascript:;" class="cus-tooltip">Custom CSS style <span class="has-tooltip">*</span><span class="tooltip__content">Add CSS of your own to your form and social tabs</span></a></li>
											
                                            <li><a href="javascript:;" class="cus-tooltip">Custom height position <span class="has-tooltip">*</span><span class="tooltip__content">Change the height position of the tabs on your website</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Multiple widgets <span class="has-tooltip">*</span><span class="tooltip__content">Create different bars for different pages. Show different icons, form and language based on page targeting rules</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Page targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show/hide the widget on specific pages</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Country targeting <span class="has-tooltip">*</span><span class="tooltip__content">Target your widget to specific countries. You can create different widgets for different countries</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Available days and hours <span class="has-tooltip">*</span><span class="tooltip__content">Display the widget on specific days and hours based on your opening days and hours</span></a></li>
											<li><a href="javascript:;" class="cus-tooltip">Traffic source targeting <span class="has-tooltip">*</span><span class="tooltip__content">Show the widget only to visitors who come from specific traffic sources including direct traffic, social networks, search engines, Google Ads, or any other traffic source</span></a></li>
                                        </ul>
                                    </div>
                                    <div class="price-table-bottom">
                                        <div class="custom-dd">
                                            <select class="multiple-options has-multiple-websites">
                                                <option data-option="1_year" data-header="Renewals for 25% off" data-price="149" value="<?php echo $pro_url ?>28">Updates &amp; support for 1 year</option>
                                                <option data-option="2_year" data-header="For 2 years" data-price="229" value="<?php echo $pro_url ?>29">Updates &amp; support for 2 years</option>
                                                <option data-option="lifetime" data-header="For lifetime" data-price="389" value="<?php echo $pro_url ?>30">Updates &amp; support for lifetime</option>
                                            </select>
                                        </div>
                                        <a class="cart-link" target="_blank" href="<?php echo esc_url($pro_url."28") ?>">Buy now</a>
                                    </div>
									<div class="bottom-position"></div>
                                </div>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
                <div class="text-center price-after">
                    <p class="money-guaranteed"><span class="dashicons dashicons-yes"></span>
                        <?php esc_html_e("30 days money back guaranteed"); ?>
                    </p>
                    <p class="money-guaranteed"><span class="dashicons dashicons-yes"></span>
                        <?php esc_html_e("The plugin will always keep working even if you don't renew your license"); ?>
                    </p>
                    <div class="payments">
                        <img src="<?php echo plugins_url('/images/payment.png', __FILE__) ?>" alt="Payment" class="payment-img" />
                    </div>
                </div>
                <div class="folder-testimonial-list">
                    <div class="folder-testimonial">
                        <div class="testimonial-image"> <img src="<?php echo plugins_url('/images/image.png', __FILE__) ?>"> </div>
                        <div class="testimonial-data">
                            <div class="testimonial-title">Well crafted, beautiful design, furious fast support</div>
                            <div class="testimonial-desc">Well crafted, beautifully designed, with multiple integration options, growing in features with extremely fast and prudent support plugins. Discovering Pro versions has been a blazing amazing experience. Long live and happy development!<br/>
                                Give us more of that high raised bar of quality products like that &#128578;</div>
                            <div class="testimonial-author">- Vitaly Tulyakov</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    (function (factory) {
        "use strict";
        if (typeof define === 'function' && define.amd) {
            define(['jquery'], factory);
        }
        else if(typeof module !== 'undefined' && module.exports) {
            module.exports = factory(require('jquery'));
        }
        else {
            factory(jQuery);
        }
    }(function ($, undefined) {
        var priceOptions = {
            "50_websites": {
                "1_year": {
                    "price": 149,
					"per_month":12.5,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=28"
                },
                "2_year": {
                    "price": 229,
					"per_month":10.0,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=29"
                },
                "lifetime": {
                    "price": 389,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=30"
                }
            },
            "500_websites": {
                "1_year": {
                    "price": 279,
					"per_month":23.5,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=31"
                },
                "2_year": {
                    "price": 419,
					"per_month":17.5,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=32"
                },
                "lifetime": {
                    "price": 699,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=33"
                }
            },
            "1000_websites": {
                "1_year": {
                    "price": 389,
					"per_month":32.5,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=34"
                },
                "2_year": {
                    "price": 585,
					"per_month":24.5,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=35"
                },
                "lifetime": {
                    "price": 959,
                    "link": "https://go.premio.io/?edd_action=add_to_cart&download_id=3432&edd_options[price_id]=36"
                }
            }
        };
        $(document).ready(function(){

            $(document).on("click", ".pricing-table-content", function(){
                if(!$(this).hasClass("active")) {
                    $(".pricing-table-content").removeClass("active");
                    $(this).addClass("active");
                    var datFor = $(this).data("option");
                    $(".multiple-options").each(function(){
                        $(this).find("option").prop("selected", false);
                        $(this).find("option[data-option='"+datFor+"']").prop("selected", true);
                        $(this).trigger("change");
                    })
                }
            });

            if($(".multiple-options").length) {
                $(".multiple-options").select2({
                    minimumResultsForSearch: -1
                });
            }
            if($(".multiple-web-options").length) {
                $(".multiple-web-options").select2({
                    minimumResultsForSearch: -1
                });
            }
            $(document).on("change", ".multiple-options", function(){
                priceText = $(this).find("option:selected").attr("data-header");
                thisValue = $(this).val();
                thisPrice = $(this).find("option:selected").attr("data-price");
                thisperMonth = $(this).find("option:selected").attr("data-per-month");
                if(!$(this).hasClass("has-multiple-websites")) {
                    $(this).closest(".price-table").find("a.cart-link").attr("href", thisValue);
                    $(this).closest(".price-table").find(".plan-price").text("$" + thisPrice);
                } else {
                    var webOption = $(".multiple-web-options").val();
                    var priceSettings = priceOptions[webOption];
                    var yearPlan = $(".multiple-options.has-multiple-websites option:selected").attr("data-option");
                    if(priceSettings[yearPlan] != undefined) {
                        priceSettings = priceSettings[yearPlan];
                        thisValue = priceSettings.link;
                        thisPrice = priceSettings.price;
						thisperMonth = priceSettings.per_month;
                    }
                }
                thisOption = $(this).find("option:selected").attr("data-option");
                if(thisOption == "1_year") {
                    thisPrice = thisPrice+"<span>/year</span>";
					per_month = "Less than <b>$" + thisperMonth + "</b>/mo · <b>Billed Annually</b>";
                    priceText = "Renewals for <b>25% off</b>";
                } else if(thisOption == "2_year") {
                    thisPrice = thisPrice+"<span>/2 years</span>";
					per_month = "Less than <b>$" + thisperMonth + "</b>/mo · <b>Billed Annually</b>";
                    priceText = "Renewals for <b>25% off</b>";
                } else {
                    thisPrice = thisPrice+"<span>/lifetime</span>";
					per_month = "<b>Best value</b>";
                    priceText = "Lifetime feature updates and support";
                }
                $(this).closest(".price-table").find("a.cart-link").attr("href", thisValue);
                $(this).closest(".price-table").find(".plan-price").html("$" + thisPrice);
                $(this).closest(".price-table").find(".price-permonth").html(per_month);
				if ( per_month == '' ) {
					 $(this).closest(".price-table").find(".price-permonth").hide();
				} else {
					 $(this).closest(".price-table").find(".price-permonth").show();
				}
                $(this).closest(".price-table").find(".price-offer").html(priceText);
            });

            $(document).on("change", ".multiple-web-options", function(){
                $(".multiple-options.has-multiple-websites").trigger("change");
            });

            if($(".multiple-options.has-multiple-websites").length) {
                $(".multiple-options.has-multiple-websites").trigger("change");
            }

            checkForPricingPos();
        });

        $(window).on("scroll", function(){
            checkForPricingPos();
        });

        $(window).on("resize", function(){
            checkForPricingPos();
        });

        function checkForPricingPos() {
            $(".bottom-position").each(function(){
                if($(this).offset().top - $(window).scrollTop() - $(window).height() < -3) {
                    $(this).closest(".price-table").removeClass("is-fixed");
                    $(this).closest(".price-table").find(".price-table-bottom").prop("style", "");
                } else {
                    $(this).closest(".price-table").addClass("is-fixed");
                    $(this).closest(".price-table").find(".price-table-bottom").css("top", ($(window).height() - 125 )+"px");
                    $(this).closest(".price-table").find(".price-table-bottom").css("left", $(this).offset().left+"px");
                    $(this).closest(".price-table").find(".price-table-bottom").outerWidth($(this).closest(".price-table").width());
                }
            });
        }
    }));
</script>