<?php
if (!isset($_SESSION)) {
	@session_start();
}
global $website_options;
ob_start();
if (!isset($_COOKIE['firstvisit'])) {
	$cookieLifetime = 1 * 1 * 2 * 60; // 31 days 31 * 24 * 60 * 60
	setcookie("firstvisit", "alreadyvisited", time() + $cookieLifetime);
} else {
	if (!isset($_COOKIE['addappicon'])) {
		$cookieLife = 1 * 1 * 1 * 60; // 31 days 31 * 24 * 60 * 60
		setcookie("addappicon", "alreadyadded", time() + $cookieLife);
	}
}
ob_end_flush(); 
$website_title = !empty($website_title) ? $website_title : "BASE Pages";
$website_description = !empty($website_description) ? $website_description : $website_options['website_description'];
$website_image = !empty($website_image) ? $website_image : "https://basepages.com/share_base.png";
ini_set('display_errors', 'Off');	
?>
<!DOCTYPE html>
<html lang="en">
<head>

    <title><?= $website_title ?></title>
    <meta charset="utf-8">
    
    <meta name="google-site-verification" content="" />
    <meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale=5.0, viewport-fit=cover" />
    <meta name="apple-touch-fullscreen" content="yes">
 
 	<!-- new stuff --> 
	<link rel="manifest" href="manifest.json">
	<meta name="mobile-web-app-capable" content="yes">
	<script src="/static/js/stay_standalone.js" type="text/javascript"> </script>
	<meta name="application-name" content="BASE">
	<meta name="apple-mobile-web-app-title" content="BASE">
	<meta name="msapplication-starturl" content="https://basepages.com">  	
	<!-- new stuff ends -->   
    
	<!--<meta name="theme-color" content="#000" />-->
	<meta name="theme-color" content="#111518" />
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
	<meta name="apple-mobile-web-app-title" content="<?= $website_options['short_title'] ?>">

	<meta name="keywords" content="<?= $website_options['website_keywords'] ?>" />
	<meta name="description" content="<?= $website_options['website_description'] ?>" />
	
	<?php if($_SESSION['user']['id']) : ?>
	<meta property="og:url" content="<?php echo 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>/r/<?= $_SESSION['user']['ref'] ?>" />
	<?php else : ?>
		<meta property="og:url" content="<?php echo 'https://' . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>" />
	<?php endif; ?>
	
    <meta property="og:type"          content="website" />
	<meta property="og:title"         content="<?= $website_title ?>" />
	<meta property="og:description"   content="<?= $website_description ?>" />
	<meta property="og:image"         content="<?= $website_image ?>" />
	<meta property="og:image:url"	  content="<?= $website_image ?>" />
	<meta property="og:image:alt"	  content="BASE" />
	<meta property="fb:app_id" 		  content="343621772671036" />
	
	<link rel="preload" href="/static/css/normalize.css" as="style" 
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/css/normalize.css"></noscript>
	<link rel="preload" href="/static/css/jquery.sidr.light.css" as="style"
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/css/jquery.sidr.light.css"></noscript>
	<link rel="preload" href="/static/css/animate.min.css" as="style"
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/css/animate.min.css"></noscript>
	<link rel="preload" href="/static/css/style.css" as="style"
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/css/style.css"></noscript>
	<link rel="preload" href="/static/css/responsive.css" as="style"
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/css/responsive.css"></noscript>
		
	<link rel="icon" type="image/png" href="/favicon.png" sizes="32x32" />
	<link rel="shortcut icon" href="<?= $website_options['website_favicon'] ?>" type="image/x-icon" />
	<link rel="apple-touch-icon" sizes="57x57" href="/<?= $website_options['mobile_logo_57x57'] ?>" />
	<link rel="apple-touch-icon" sizes="72x72" href="/<?= $website_options['mobile_logo_72x72'] ?>" />
	<link rel="apple-touch-icon" sizes="76x76" href="/<?= $website_options['mobile_logo_76x76'] ?>" />
	<link rel="apple-touch-icon" sizes="114x114" href="/<?= $website_options['mobile_logo_114x114'] ?>" />
	<link rel="apple-touch-icon" sizes="120x120" href="/<?= $website_options['mobile_logo_120x120'] ?>" />
	<link rel="apple-touch-icon" sizes="144x144" href="/<?= $website_options['mobile_logo_144x144'] ?>" />
	<link rel="apple-touch-icon" sizes="152x152" href="/<?= $website_options['mobile_logo_152x152'] ?>" />
	<script rel="preload" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
   type="text/javascript"> </script>
   <script type="text/javascript" src="/static/js/script.js"> </script>
   <!--<script>var jQuery = $.noConflict(true); </script>
   jQuery.noConflict();-->
   <!--<script type="text/javascript" 
	   src="//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js" defer></script>-->

    <!--[if lt IE 9]>
    <script type="text/javascript" src="/static/js/html5.js"></script>
    <![endif]-->
    
	<link rel="preload" href="/static/js/addtohomescreen.css" as="style"
	onload="this.onload=null;this.rel='stylesheet'">
	<noscript><link rel="stylesheet" href="/static/js/addtohomescreen.css" type="text/css"></noscript>

	<script src="/static/js/addtohomescreen.js?<?php echo rand(); ?>"> </script>
	<script type="application/javascript">
	addToHomescreen();
	</script>
		
	<script type="text/javascript">
		$(document).ready(function() {
			//jQuery.noConflict();
			//alert('Doc Ready detection works');
			// App Mode Detection
			var standalone = window.navigator.standalone,
			userAgent = window.navigator.userAgent.toLowerCase(),
			safari = /safari/.test( userAgent ),
			ios = /iphone|ipod|ipad/.test( userAgent );
			android = (window.matchMedia('(display-mode: standalone)').matches); // isInWebAppChrome
			
		//	if (android == true) {
		//		$('.wrap-top-menu').css('padding-top',6);
		//		$('.header-content').css('padding-top',38);
		//		$('.spacer').css('padding-top',57);
		//	}

			if (window.navigator.standalone == true) {
				//alert("You're using our PWA/Hybrid App!");
		//		$('.spacer').css('padding-top',85);
		//		$('#homepage').css('padding-top',40);
		//		$('.wrap-top-menu').css('padding-top',43);
		//		$('.topsection').css('margin-top',40);
		//		$('.hybridlogo').css('top',38);
		//		$('.header-content').css('padding-top',53);
		//		$('.btn-toogle-menu').css('margin-top',0);
		//		$('.bottomtray').css('padding-bottom',15);
		//		$('#fixed-btm-btn').css('padding-bottom',80);
		//		$('.scrollup').css('bottom',80);
		//		$('.modalhdr').css('margin-top',90);
		//		$('.updatebutton').css('padding-bottom',90);
		//		$('.invtxt').css('margin-bottom',20);
		//		$('.support').css('margin-top',5);
				//$('.webapptop').css('padding-top',12);
				// Super small phones
				if ($(window).width() <= 375) {
					//alert("iPhone SEs etc");
					$('.bottomtray').css('padding-bottom',0);
					$('#fixed-btm-btn').css('padding-bottom',0);
				}
				// 393px is the cutoff
				if ($(window).width() <= 393) {
					$('.spacer').css('padding-top',72);
					$('#lpcontainer').css('padding-top',25);
					$('#featurelist').css('margin-top',18);
					//alert("iPhone 15 Pros etc");
				}
				if ($(window).width() <= 586) {
					//alert('iPhone 15 Pros + similar');
					$('.wrap-top-menu').css('padding-top',73);
					$('.home-feature-category').css('padding-top',48);
		//			$('.tophdrimg').css('padding-top',0);
		//			$('.qrfixedbottom').css('padding-bottom',30);
		//			$('.floatingqr').css('top',100);
		//			$('.timelinedetailsspacer').css('display','block');
		//			$('.logintext').css('padding-top',40); // load page only
		//			$('#moredivarea').css('padding-bottom',25);
		//			$('.scrollup').css('bottom',90);
				}

				// iPad Portrait
				if ($(window).width() == 768) {
					$('.updatebutton').css('padding-bottom',60);
					$('.invtxt').css('margin-bottom',0);
					$('.scrollup').css('bottom',57);
					//$('.spacer').css('padding-top',25);
					//$('.wrap-top-menu').css('padding-top',17);
					//alert("You're using our Hybrid App!");
				}
				if ($(window).width() >= 1024) {
					$('.spacer').css('padding-top',77);
					$('.wrap-top-menu').css('padding-top',27);
					//$('.btn-toogle-menu').css('margin-top',2);
					$('.updatebutton').css('padding-bottom',60);
					$('.invtxt').css('margin-bottom',0);
					$('.scrollup').css('bottom',60);
					//alert("You're using our Hybrid App and this is probably an iPad!");
				}
			} else {
				if ( ios ) {
					//alert("iOS");
					if ( !standalone && !safari ) {
						// THESE ARE MEANT FOR APPWRAPPER PAGES
						//alert("You're using the Native App");
					};
					if ( !standalone && safari ) {
						// MOBILE SAFARI
						//alert("You're using the regular Mobile Website");
					};
				} else {
					// NOT iOS, so maybe this is Android. We need to test some more.
					// Note: the window.navigator.standalone doesn't work with Androids
				}
				
				// You can also display a message this way:
		//		alert("This is a Hybrid App, please add the App Icon to your Home screen & open it from there to access all features.");
		//		document.write('<p>Tap the + button and choose "Add to Home Screen"</p>');
		//		document.write('<link rel="apple-touch-icon" href="/static/images/icon@2x.png"/>');
		//		$('#addtheapp').show();
			}   	

			if (window.navigator.standalone == true) {
				//alert('Stand-Alone');
			} else {
				//alert('NOT Stand-Alone');
				if ($(window).width() <= 587) {

					var id = 'dialog';
					var x = getCookie('addappicon');

					if (x) {
						//alert('Do nothing for PWA...');
						//alert('Set the cookie');
						//setCookie('addappicon','alreadyadded',1);
					} else {
						//setCookie('addappicon','alreadyadded',1);
						//alert('NO Cookie, so show our Splash');
						//transition effect
						$('#mask').fadeIn(0);
						$('#mask').fadeTo("fast",0.90);

						//transition effect
						$('#'+id).fadeIn(0);

						//if close button is clicked
						$('.window .close').click(function (e) {
							//Cancel the link behavior
							e.preventDefault();

							$('#mask').hide();
							$('.window').hide();
						});

						//if mask is clicked
						$('#mask').click(function () {
							$(this).hide();
							$('.window').hide();
						});

						//enter buttons opens overlay
						$('#ol').click(function () {
							//transition effect
							$('#mask').fadeIn(1000);
							$('#mask').fadeTo("slow",0.90);

							//transition effect
							$('#'+id).fadeIn(2000);
						});
					}
				} // WINDOW WIDTH CHECK ENDS
			}	
		}); // DOC READY ENDS
		/////////////////////////////////////////////////////////
		
		function setCookie(name,value,days) {
		    var expires = "";
		    if (days) {
		        var date = new Date();
				date.setTime(date.getTime() + (days*1*60)); // days*24*60*60*1000
		        expires = "; expires=" + date.toUTCString();
		    }
		    document.cookie = name + "=" + (value || "")  + expires + "; path=/";
		}
		function getCookie(name) {
		    var nameEQ = name + "=";
		    var ca = document.cookie.split(';');
		    for(var i=0;i < ca.length;i++) {
		        var c = ca[i];
		        while (c.charAt(0)==' ') c = c.substring(1,c.length);
		        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
		    }
		    return null;
		}
		function eraseCookie(name) {   
		    document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
		}
	</script>	

	<style type="text/css">
		#wrapper { overflow: hidden; }
		.wrap-top-menu {
		    padding-top: constant(safe-area-inset-top);
		    margin-top: -constant(safe-area-inset-top);
		}
		#header .top-message a {
			color: #ddd; font-weight: 400 !important;
		}
		#header .top-message a:hover { color:#fff; }
		.backarrowdiv { display:none;}
		a.logoutbtn { color:#ff0000 !important; }
		a.logoutbtn:hover { color:#fff !important; }
		#overlaystyle {
			color: #fff;
			font-family:Montserrat,'Open Sans',Helvetica,sans-serif;
		}
		.btn-toogle-menu { margin-right:15px; }
		.nav-horizontal > li > a {
			font-weight: 400 !important;
			font-size: 14px; text-transform: uppercase;
			font-family:Montserrat,'Open Sans',Helvetica,Verdana,sans-serif !important; 
		}
		hr.sidr-class-custom { 
			border: 0;
			height: 1px;
			background-image: linear-gradient(to right, rgba(128, 128, 128, 0), rgba(128, 128, 128, 0.75), rgba(128, 128, 128, 0));
			width: 85%;
		}
		.button a,.button a:active, .button a:visited {
			-webkit-appearance: none;
			height:auto;
			width:auto;
			padding:20px 25px;
			font-size:20px !important;
			font-weight:normal;
			text-decoration:none;
			background:#6BB130;
			border:1px solid #6BB130;
			border-bottom:0px solid #619E2C !important;
			color:#fff;
			font-family:Montserrat-Light,Futura-Medium,serif !important;
			text-shadow:0px -1px 1px rgba(0,0,0,.3);
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
		}
		.submit, .submit a, .submit a:active, .submit a:visited {
			-webkit-appearance: none;
			height:auto;
			width:auto;
			padding:9px 15px;
			font-size:15px;
			font-weight:normal;
			text-decoration:none;
			background:#6BB130;
			border:1px solid #6BB130;
			border-bottom:0px solid #619E2C !important;
			color:#fff;
			font-family:Montserrat-Light,Futura-Medium,serif !important;
			text-shadow:0px -1px 1px rgba(0,0,0,.3);
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
		}

	/*******************************/
	/**********  WEB APP  **********/
	/*******************************/
	.btn-red {
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
	}
	#mask {
		display: none;
		position: absolute;
		left: 0;
		top: 0;
		right:0;
		bottom: 0;
		z-index: 90000;
		background-size:cover;
		background: url(static/system/diag.png);
		background-color: rgba(0,0,0,.85) !important;
		opacity:1.0 !important;
		width: 100%;
		height: 100vh;
	}
	#boxes .window {
		position: absolute;
		left: 0;
		top: 0;
		right:0;
		bottom: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		display: none;
		z-index: 99999;
		padding: 0;
	}
	#boxes #dialog {
		display: none;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		height: auto;
		width: auto;
		overflow: hidden;
	}

	/*******************************/

		hr.style-two {
			border: 0;
			height: 1px;
			width:90%;
			background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
			background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
			background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
			background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
		}

		.btn-gold {
			border-color: #8E8E63;
			color: #FFF;
			background: #c6c687;
			background: -moz-linear-gradient(top, #AFAF79 0%, #c6c687 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#AFAF79), color-stop(100%,#c6c687));
			background: -webkit-linear-gradient(top, #AFAF79 0%,#c6c687 100%);
			background: -o-linear-gradient(top, #AFAF79 0%,#c6c687 100%);
			background: -ms-linear-gradient(top, #AFAF79 0%,#c6c687 100%);
			background: linear-gradient(top, #AFAF79 0%,#c6c687 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#AFAF79', endColorstr='#c6c687',GradientType=0 );
		}
		.btn-gold:hover {
			background: #D3D394;
			background: -moz-linear-gradient(top, #D3D394 0%, #AFAF79 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#D3D394), color-stop(100%,#AFAF79));
			background: -webkit-linear-gradient(top, #D3D394 0%,#AFAF79 100%);
			background: -o-linear-gradient(top, #D3D394 0%,#AFAF79 100%);
			background: -ms-linear-gradient(top, #D3D394 0%,#AFAF79 100%);
			background: linear-gradient(top, #D3D394 0%,#AFAF79 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D3D394', endColorstr='#AFAF79',GradientType=0 );
		}
		.loginlinks a, .loginlinks a:active, .loginlinks a:visited, .loginlinks a:link {
			color: #14E06E !important;
		}
		.loginlinks a:hover {
			color: #fff !important;
		}
		a.neongreen {
			color: #14E06E !important;
		}
		a.neongreen:hover {
			color: #fff !important;
		}
		a.whitehover:hover {
			/*color:#fff !important;
			text-shadow: 0px -1px 1px rgba(0,0,0,.1) !important;*/
			background: #fff !important;
		}

		/* ################################## */
		/* SCROLL BARS */
		/* ################################## */

		::-webkit-scrollbar {
		    width: 14px;
			background:#eee;
		}
		 
		/* Track */
		::-webkit-scrollbar-track {
		    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0); 
		    -webkit-border-radius: 10px;
		    border-radius: 10px;
		}
		 
		/* Handle */
		::-webkit-scrollbar-thumb {
			border: 3px solid #eee;
			background-clip: padding-box;
		    -webkit-border-radius: 10px;
		    border-radius: 10px;
		    background: rgba(0,0,0,0.1); 
			background-color:#ccc !important;
		    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
		}
		::-webkit-scrollbar-thumb:window-inactive {
			background: rgba(255,0,0,0.3); 
		}

		/* #### TOP MENU NAV #### */
		nav.top-menu { margin-left:10px; }
		ul#main-menu { height:20px; padding:9px; overflow:hidden; }

		nav.top-menu li:hover {
			width:auto;
			color:#fff;
			text-shadow:0px -1px 0px rgba(0,0,0,.4);
			display:block;
		}

		.nav-horizontal > li {
		    float: left;
		    padding: 0 8px;
		}

		/* DROPDOWN MENU EXPANDED */
		nav.top-menu ul li.expanded ul {
			display:none;
		}
		nav.top-menu ul li.expanded:hover ul {
		  display:block;
		  position:absolute;
		  top:43px;
		  left:0;
		  right:0;
		  width:100%;
		  padding:0;
		  height:auto;
		  text-align:left;
		}

		nav.top-menu ul li.expanded ul a {
			font-family: Montserrat,'Open Sans',Helvetica,Verdana,sans-serif;
			background:#ddd;
			color:#000;
			text-shadow: 0px 1px 0px rgba(255,255,255,.4); 
		}

		nav.top-menu ul li.expanded ul a:hover {
			background:#00D315;   /* green lime 00de00 */
			color:#000;
			text-shadow: 0px 1px 0px rgba(255,255,255,.4); 	
			/**color:#fff;
			text-shadow: 1px 1px 1px rgba(0,0,0,.5); **/
		}
		img.hthumb { height:27px; width:27px; border-radius:50%; -moz-border-radius:50%; 
		-webkit-border-radius:50%; margin-top:5px; }

		.loginlinks { display:inline-block; }
		
		#rotate > img {
			-webkit-transition-duration: 0.8s;
			-moz-transition-duration: 0.8s;
			-o-transition-duration: 0.8s;
			transition-duration: 0.8s;
			-webkit-transition-property: -webkit-transform;
			-moz-transition-property: -moz-transform;
			-o-transition-property: -o-transform;
			transition-property: transform;
			overflow: hidden;
		}

		#rotate:hover > img  {
			-webkit-transform: rotate(180deg);
			-moz-transform: rotate(180deg);
			-o-transform: rotate(180deg);
		}
		
	/* ########################################################################## */
	/* #####################         MOBILE STYLING         ##################### */
	/* ########################################################################## */	

	/* ######################################## */
	/* Portrait tablet to landscape and desktop */
		@media (min-width: 1025px) and (max-width: 4399px) {
			#header .top-messagediv { display:inline-block; }
			.newhdrlogo {  }
		}
		
	/* ######################################## */
	/* Portrait tablet to landscape and desktop */

		@media (min-width: 980px) and (max-width: 1024px) {
			#header .top-messagediv { display:inline-block; }
			.newhdrlogo {
				/*display: none;*/
			}
		}

	/* ######################################## */
	/* Portrait tablet to landscape and desktop */

		@media (min-width: 768px) and (max-width: 979px) {
			#header .top-messagediv { display:none; }
			.newhdrlogo {  }
		}
	/* ######################################## */
	/* Landscape phone to portrait tablet */

		@media (max-width: 767px) {
			.loginlinks, .marketplacediv { display:none; }
			#header .top-messagediv { display:none; }
			.newhdrlogo {  }
			.greenplus {
				display: inline;
			}
		}
	/* ######################################## */
	/* Landscape phones and down */

		@media (max-width: 587px) { 
			.loginlinks, nav.top-menu, .marketplacediv { display:none !important; }
			.newhdrlogo { }
			#header .top-messagediv { display:none; }
			.backarrowdiv { display:inline-block;}
			img.sidr-class-LB { margin-top: 50px !important; }
		}
	</style>

  <script type="text/javascript">
	// DOC READY STARTS
	$(document).ready(function () {
		$(".loginpop").fancybox({
			'hideOnOverlayClick':false,
			'hideOnContentClick':false,
			'nextEffect': 'fade',
			'prevEffect': 'fade'
		});
		
		$('.btn-reset-keyword').click(function () {
			//alert('Clicked reset');
			$("#sys_txt_keyword").val('');
			return false;
		});
	    $(window).scroll(function () {
	        if ($(this).scrollTop() > 100) {
	            $('.scrollup').fadeIn();
	        } else {
	            $('.scrollup').fadeOut();
	        }
	    });
	    $('.scrollup').click(function () {
	        $("html, body").animate({
	            scrollTop: 0
	        }, 600);
	        return false;
	    });		
		$(".more").click(function () {
			$(".morediv").slideToggle(500, function () {
			});
		});		
		<?php if (isset($_SESSION['user_id']) || isset($_SESSION['user']['id'])) : ?>
			var lbr = new lbRealtime();
			lbr.init();	
		<?php endif; ?>			
	});
  </script>
  
<!--  <link rel="preload" fetchpriority="high" as="image" href="/static/system/slidethin.webp" type="image/webp">
  <link rel="preload" fetchpriority="high" as="image" href="/static/system/slidemobile.webp" type="image/webp">-->
</head>
<body> 

<!--<div id="mask">
	Enjoy our full screen experience by adding our App Icon to your homescreen!
	<br /><br />
	Simply
</div>-->

<div id="wrapper" style="overflow:hidden;">

<!-- //////////////////////////////////////////////////////// -->
<!-- //////////////////   PWA MASK STARTS  ////////////////// -->
<!-- //////////////////////////////////////////////////////// -->
<div id="boxes">
	<div id="dialog" class="window">
		<div id="overlaystyle" style="font-family:Montserrat, Raleway,sans-serif; font-size:20px; 
		font-weight:normal; padding:0px 10px 10px; color:#fff; text-align:center;">

			<div style="display:table; height:100vh; width:100%;">
			<div class="displaytable" style=" display: table-cell; vertical-align: middle; 
				height:400px;">
				<img src="/<?= $website_options['website_logo'] ?>"
				style="height:auto; width:80%; max-width:250px; 
				margin-top:-50px; margin-bottom:10px" alt="Home" />

				<div style="margin-bottom:10px;">
					Add-to-Home Screen
				</div>

				<div style="font-size:17px; line-height:25px; color:#ccc; width:80%; 
				max-width:550px; margin:0 auto">
					For a full-screen app experience + quick &amp; easy access
					on any device, add our App Icon...
				</div>
				<br />

				<img src="/<?= $website_options['mobile_logo_100x100'] ?>" alt="Icon"
				style="height:auto; width:70px; margin-top:15px;
				border-radius: 12px;
				-moz-border-radius: 12px;
				-webkit-border-radius: 12px;" alt="Home" />
				<br /><br /><br />

				<div style="margin-bottom:15px;">
					<a href="javascript:;" class="btn btn-red close"
						style="font-family:Montserrat, Open Sans, sans-serif; color:#fff;
					font-size:17px; font-weight:600; text-shadow:0px 1px 1px rgba(0,0,0,.3);
					padding:15px 20px;">Or, Enter Site Now</a>
				</div>
				<div class="clear"></div>
				<div style="height:35px; line-height:36px; font-size:14px; color:#bbb;">
					<img src="/static/system/icons/share_icon_white.png" alt="Click Share Icon"
					style="height:auto; width:30px; margin-bottom:6px; margin-right:2px" 
					align="absmiddle" /> iOS - Click the Share icon 
				</div>
				<div style="height:30px; line-height:30px; font-size:14px; color:#bbb;">
					<img src="/static/system/icons/3_dots_white.png" alt="Click 3 dots"
					style="height:auto; width:25px; margin-bottom:2px" 
					align="absmiddle" />Android - Click 3 dots icon 
				</div>
				<div class="clear"></div>
				<div style="position:absolute; bottom:15px; height:35px; width:100%;">
					<img src="/static/system/icons/close_x_white.png" class="close"
					style="height:30px; width:30px;" alt="X" />
				</div>
				<div class="clear"></div>
				<br /><br />
			</div><!-- DISPLAY TABLE -->
			</div>
		</div><!-- OVERLAY -->
	</div><!-- DIALOG -->
	<div id="mask"></div>
</div><!-- BOXES -->
<!-- ######################################################## -->
<!-- ###################   PWA MASK ENDS  ################### -->
<!-- ######################################################## -->

    <header id="header" style="background:none !important;">
		<div class="wrap-top-menu wrap-top-menu-desktop" style="text-align:center;">		
			<a id="btn-toogle-menu" class="btn-toogle-menu" href="#alternate-menu"
			style="float:left; background:none !important;">
				<img src="/static/system/menu_icon.png" alt="Menu" style="height:22px;" />
				<!--<span class="line-bar"></span>
				<span class="line-bar lb2" style="width:15px;"></span>
				<span class="line-bar lb2" style="width:10px;"></span>-->
			</a>	
			<div class="newhdrlogo" style="background:none; overflow:hidden;
				position:absolute; right:0; left:0; bottom:11px; margin:0 auto;
			   	text-align:center; max-width:179px; height:32px;">
			   	<a href="/"><img src="/<?= $website_options['website_logo'] ?>"
				onerror="this.src='/static/system/base_pages_logo.png'"
				style="height:auto; width:179px; background:none" alt="Home" /></a>
			</div>		
			<?php if ($_SESSION['loggedin']) { ?>
            <?php } else { ?>   
			<?php } ?>		
			<!-- ####################################################################### -->
			<!-- ############################# RIGHT MENU ############################## -->
			<!-- ####################################################################### -->
			<div class="loginlinks" style="float:right; width:auto; background:none;
				height:38px; line-height:38px; margin-right:15px; color:#ccc;">
				<?php if ($_SESSION['loggedin']) { ?>
					<a href="/profile/<?= $_SESSION['user']['user_slug'] ?>" class="thumb-leftxxx">
					<?php if (isset($_SESSION['loggedin']) && $_SESSION['user_id']) {
					    echo "<img src='/static/images/users/" . $_SESSION['user']['image'] . "' 
						onerror=\"this.src='/static/system/default_avatar.png'\"
						alt='" . $user['name'] . "' class='hthumb' align='absmiddle' 
						style='margin-top:2px' />";
					}?></a>&nbsp;				
					Welcome, <a href="/profile/edit" 
					style="color:#14E06E;"><?= $_SESSION['user']['name'] ?></a>
					<span style="color:#999;">|</span> <a href="/auth/logout" 
					class="logoutbtn" style="font-weight:500;"><i class="fa fa-power-off" 
					aria-hidden="true"></i> Logout</a>
                <?php } else { ?>
                  	<!--<a href="/profile/registerBusiness" class="btn btn-gold 
                  	business-reg registerbtn">Register Business</a>-->
					<a href="#login" class="loginpop loginbtn" style="font-weight:400; 
					font-family:Montserrat,'Open Sans',Helvetica,Verdana,sans-serif;"><i 
					class="fa fa-power-off" aria-hidden="true"></i> 
					LOGIN <span style="font-family:'Times New Roman';">»</span></a> 
					<span style="color:#999;">|</span>
					<a href="#calltoaction2" class="loginpop" style="font-weight:400; 
					font-family:Montserrat,'Open Sans',Helvetica,Verdana,sans-serif;">SIGN UP!</a>  
				<?php } ?>
			</div>	
						
			<!-- #################################################################### -->
			<!-- ############################ TOP MENU BAR ########################## -->
			<!-- #################################################################### -->
					
			<nav class="top-menu" style="padding-left:0px; display:inline-block; height:38px;">
                <ul id="main-menu" class="nav nav-horizontal clearfix">
                    <li class="active"><a href="/" title="Home">Home</a></li>
                    <?php if ($_SESSION['loggedin'] && $_SESSION['user_id']) : ?>
                    <?php endif; ?>          
                    <li class="sep"></li>
					<li class="activexxx" style="display:nonex;">
						<a href="/about" title="About">About</a>
                    </li>    
					<li class="sep"></li>
					<li class="activexxx" style="display:nonex;">
						<a href="/contact" title="Contact">
						<i class="fa fa-envelop" aria-hidden="true"></i> CONTACT</a>
					</li> 
					<li class="activexxx" style="display:none;">
						<a href="/project/add" title="Add New">
						<img src="/static/client/animated_plus.gif"
						style="height:15px; margin-top:-3px" alt="+" /> NΞW</a>
					</li>  
					<li class="sep"></li> 
                    <li class="activexxx"><a href="/faqs" title="FAQ">FAQ</a></li>
                     
                    <?php if (isset($_SESSION['loggedin']) && $_SESSION['user_id']) : ?> 
                   		
                    <?php else : ?> 
                   		                     
                    <?php endif; ?>                       		                                     
                    
                    <?php if (isset($_SESSION['user']['is_admin']) && $_SESSION['user']['is_admin'] ==1) {
                    ?>
                    <li class="sep"></li>
                    <li>
                    	<a href="/admin/dash" class="nav-title" style="color:#ff0000;">A</a>  
                    </li>
                    <?php } ?>
                </ul>
						
				<!-- ############################################################# -->
				<!-- ######################### SIDE MENU ######################### -->
				<!-- ############################################################# -->

                <div id="left-menu" style="display:none; overflow:hidden !important;"> 
                    <ul class="alternate-menu mlogo">
                        <center><a href="/"><img src="/<?= $website_options['mobile_logo'] ?>" 	
						onerror="this.src='/static/system/crest_base_pages.png'"
                        alt="<?= $website_options['short_title'] ?>" class="BP" /></a>
                        </center>
                    </ul>
                    <ul class="alternate-menu">
                        <?php if (isset($_SESSION['loggedin']) && $_SESSION['user_id']) : ?>
                        	<!-- ################## LOGGED IN / CUSTOMER ################# -->
                            <li><a href="/profile/edit"><img 
                            src="/static/images/users/agency/<?= $_SESSION['user']['image'] ?>"
                            class="pthumb" 
							onerror="this.src='/static/system/default_avatar.png'"
                            align="absmiddle" />&nbsp;<?= $_SESSION['user']['name'] ?></a>
                            </li>
							<li>
								<a href="/?not_mobile" class="home">
									<i
                            	class="fa fa-home"></i> Home</a>
							</li>
                        	<li>
                            	<a href="/profile/edit" class="gears"><i 
									class="fa fa-gears"></i> Edit Account</a>
                            </li>
							<li>
								<a href="/category/all" class="th-list">
									<i class="fa fa-th-list"></i> Categories</a>
							</li>
							<li>
								<a href="/m" class="star">
									<i class="fa fa-star"></i> MOBILΞ</a>
							</li>
							<li>
								<a href="#" class="usd">
									<i class="fa fa-usd"></i> Load Funds</a>
							</li>
							<li>
								<a href="#" class="plus-circle">
									<i class="fa fa-plus-circle"></i>Add NΞW</a>
							</li>
							<li>
								<a href="#" class="video">
									<i class="fa fa-usd"></i> CRΞATORS</a>
							</li>
							<li>
								<a href="#" class="handshake">
									<i class="fa fa-handshake"></i> WORK WITH US</a>
							</li>                                      
                       <?php else : ?> 
                            <li>
                            	<a href="/" class="home">
                            	<i class="fa fa-home"></i> Home</a>
                            </li>
							<li>
								<a href="/category/all" class="th-list">
									<i class="fa fa-th-list"></i> Categories</a>
							</li>
							<li>
								<a href="/m" class="star">
									<i class="fa fa-star"></i> MOBILΞ</a>
							</li>	
							<li>
								<a href="#" class="video">
									<i class="fa fa-usd"></i> CRΞATORS</a>
							</li>
							<li>
								<a href="#" class="handshake">
									<i class="fa fa-handshake"></i> PARTNERS</a>
							</li>	
                            <li><a href="/auth/login" class="sign-out"><i 
                            class="fa fa-sign-out"></i> Login</a></li>
                            <li><a href="/auth/join" class="user"><i 
                            class="fa fa-user"></i> Sign up</a></li>                                
                        <?php endif; ?>
                            	
                        <li><a href="/faqs" class="question-circle"><i 
                        class="fa fa-question-circle"></i> FAQ</a></li>
                        
                    	<?php if ($_SESSION['loggedin'] && $_SESSION['user_id']) : ?>
                        	<li><a href="/auth/logout" class="power-off"><i 
                        	class="fa fa-power-off"></i> Logout</a></li>
                    	<?php endif; ?>
                                
                        <?php if (isset($_SESSION['user']['is_admin'])) { ?>
                            <hr class="custom" style="" />
                            <li><a href="/admin/dash" class="sliders" 
                            style="color:#ff0000 !important;"><i 
                            class="fa fa-sliders"></i> Admin</a></li>
                        <?php } ?>  
                            
                    	<!-- ################################################################ -->
						<!-- ####################### CUSTOM MENU ITEMS ###################### -->
						<!-- ################################################################ -->
                        
                        <?php
                        $custom = json_decode($website_options['menu_custom_items'], 1); 
                        function showSubmenu($menu) {
                            if (gettype($menu) != 'array') {
                                return;
                            }
                            foreach ($menu as $item) {
                                echo "<li><a href='{$item['url']}' class='caret-right'><i class='fa fa-caret-right'></i> {$item['title']}</a></li>";
                                if (isset($item['children'])) {
                                    echo '<ul class="submenu">';
                                    showSubmenu($item['children']);
                                    echo '</ul>';
                                }
                            }
                        }
                        showSubmenu($custom);
                        ?>
                    </ul>
                    
                    <div class="sidr sliv">
						<a href="sms:?&amp;body=Hi. Checkout BASE Pages at https://basepages.com!" 
						title="Click here to share by text" class="texticon"></a>
						<a href="https://www.facebook.com/basepages" title="Like Us on Facebook" 
                        class="facebook"><i class="fa fa-facebook"></i></a>
                        <a href="https://instagram.com/basepages" title="Follow Us on Instagram" 
                        class="instagram"><i class="fa fa-instagram"></i></a>
                        <!--<a href="<?= $website_options['linkedin_url'] ?>" 
                        title="Connect with us on LinkedIn" class="linkedin"><i 
                        class="fa fa-linkedin"></i></a>-->
                        <a href="mailto:<?= $website_options['contact_email'] ?>" 
                        title="Click here to email us" class="emailicon"><i 
                        class="fa fa-envelope-o"></i></a>
                        <a href="javascript:top.frames.location.reload();" class="refresh"><i 
                        class="fa fa-refresh"></i></a>
                    </div>
                    <ul class="alternate-menu copyr">
						<?= $website_options['footer_copyright'] ?><br />
                        Made in Chicago with <a href="/about" class="heart-o"><i 
                        class="fa fa-heart-o"></i></a>
                    </ul>	
                </div>
            </nav>
            <div class="clear"></div>
        </div>
        <!-- end: .wrap-top-menu -->
    </header>
    <!--end: #header -->
    <div class="spacer"></div>