<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins" />
<h2 class="text-center"><?php esc_attr_e( 'Create a new My Sticky Bar for your website. What can you use it for?', 'mystickymenu' ); ?></h2>
<div class="mystickymenu-new-widget-row">
	<div class="mystickymenu-features new_widget_row">
		<ul>
			<li>
				<div class="mystickymenu-feature">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(MYSTICKYMENU_URL) ?>/images/pro-devices.png" />
					</div>
					<div class="feature-title">Create separate designs for desktop and mobile</div>
					<div class="feature-description">E.g. the mobile version can have a different color and a different position</div>
				</div>
			</li>
			<li>
				<div class="mystickymenu-feature">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(MYSTICKYMENU_URL) ?>/images/pro-language.png" />
					</div>
					<div class="feature-title">Do you have a multi-language website or WPML plugin installed?</div>
					<div class="feature-description">You can show different bars based on URL (E.g. French bar for the French version of your website)</div>
				</div>
			</li>
			<li>
				<div class="mystickymenu-feature">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(esc_url(MYSTICKYMENU_URL)) ?>/images/pro-widget.png" />
					</div>
					<div class="feature-description"><b>Show separate bars for different products on your website</b> (e.g. you can show the bar for products in the https://yourdomain.com/high-end/* category)</div>
				</div>
			</li>
			<li>
				<div class="mystickymenu-feature second">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(MYSTICKYMENU_URL) ?>/images/pro-page.png" />
					</div>
					<div class="feature-title">Display different channels for your landing pages</div>
					<div class="feature-description">This way you can track the results better and have the right bars for your landing pages.</div>
				</div>
			</li>
			<li>
				<div class="mystickymenu-feature second">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(MYSTICKYMENU_URL) ?>/images/pro-support.png" />
					</div>
					<div class="feature-title">Show one bar on your support and contact pages,</div>
					<div class="feature-description"> and a different bar on your sales pages.</div>
				</div>
			</li>
			<li>
				<div class="mystickymenu-feature second">
					<div class="mystickymenu-feature-top">
						<img src="<?php echo esc_url(MYSTICKYMENU_URL) ?>/images/pro-chat.png" />
					</div>
					<div class="feature-title">Display different call-to-action buttons</div>
					<div class="feature-description">for different pages on your website or buttons for mobile and desktop</div>
				</div>
			</li>
		</ul>
		<div class="clear clearfix"></div>
	</div>
	<a href="<?php echo esc_url(admin_url("admin.php?page=my-stickymenu-upgrade")); ?>" class="new-upgrade-button" target="blank">Upgrade to Pro</a>
</div>
