<?php
include 'views/_header.tpl.php'; ?>

<script type="text/javascript" src="/static/js/jQuery/js/jquery.lightbox.js" defer></script>
<link rel="stylesheet" type="text/css" href="/static/js/jQuery/css/jquery.lightbox.css" media="screen" defer />
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&key=AIzaSyCSsor1E1STB_jcqIGYc2ljfGBya5z5ULA"></script>

<style type="text/css">
	body, html {
		background: #000;
	}
	body { 
	    color:#333; 
	    -moz-osx-font-smoothing: grayscale; 
	    text-rendering: optimizeLegibility;
	    -webkit-font-smoothing: antialiased;
		background:none !important;
		background: #000 url('/static/video/vidbg.jpg') no-repeat;
		background-size:cover;
	}
	#wrapper { background:none !important; }
	div.spacer { padding-top:53.7px; }
	span, a, a:active, a:hover {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;	
	}
	#header { border-bottom: 0px solid #d4d4d4 !important; }
	#header .wrap-top-menu { z-index: 99999999999999 !important; }
/*	#header .wrap-top-menu {
		background: rgba(0,0,0,.7);
		padding: 9px 0 9px 0;
	}*/
	a, a:active, a:link, a:visited { color:#14E06E; text-shadow:none; } /* was 0072C4 */ 
	a.loginpop.introlinks, a.loginpop.introlinks:active, a.loginpop.introlinks:link, a.loginpop.introlinks:visited { 
		color:#fff; text-shadow:0px -1px 0px rgba(0,0,0,.3); 
		/* color:#294E68; text-shadow:0px 1px 0px rgba(255,255,255,.3); */ /* was 0072C4; */ 
	}
	a.loginpop.introlinks:hover { color:#fff; text-shadow:0px -1px 0px rgba(0,0,0,.3); }
	a:hover { color:#54ff82; }
	a[href^=tel] {
		color:#0194fb; 
		text-shadow:0px -1px 0px rgba(0,0,0,.3);
	}
	a.sqlinks { margin-top:5px; margin-bottom:10px; color:#ccc; font-weight:500; text-transform:uppercase; text-shadow: 0px -1px 1px rgba(0,0,0,.3); display:inline-block;
	background: rgba(255,255,255,.1); border-radius: 50px ; -moz-border-radius:50px; -webkit-border-radius:50px; padding: 5px 15px; }
	a.sqlinks:hover { color:#fff; }
	.darklinks a, .topbanner_content a { color: #03b5ff; }
	.darklinks a:hover, .topbanner_content a:hover {
		color: #fff;
	}
/*	.btn-o, .btn-o a, .btn-o a:link, .btn-o a:active, .btn-o a:visited, .btn-oo a { 
		border:3px solid #29baff; 
		background-color: #8b248d;
    	background-image: linear-gradient(45deg, #8b248d, #099bf2); 
		text-shadow:-1px -1px -1px rgba(0,0,0,.5); 
		margin:10px 15px;
		padding:15px 20px; 
		width:150px; 
		height:20px;
	     line-height:20px;
		display:inline-block; 
		font-family: 'Open Sans', Montserrat,Arial,sans-serif; 
		font-weight:300;
		font-size:15px;
		color:#fff; 
		-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; 
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
	}
	
	.btn-o:active, .btn-o:hover, .btn-oo a:hover, .btn-oo a:active { 
		border:3px solid #fff; 
		background-color: #099bf2;
    	background-image: linear-gradient(45deg, #099bf2, #8b248d); text-shadow:-1px -1px -1px rgba(0,0,0,.5); 
	}	*/	
	.browsebutton a {
		background-color: #8b248d;
		background-image: linear-gradient(45deg, #8b248d, #099bf2); 
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
		color:#fff;
		border:3px solid #eee;
		padding: 7px 20px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		text-shadow: 1px 1px 1px rgba(0,0,0,.2);
		border-radius: 50px; -moz-border-radius:50px; -webkit-border-radius:50px;
	}
	.browsebutton a:hover {
		border:3px solid #fff;
		background-color: #099bf2;
		background-image: linear-gradient(45deg, #099bf2, #8b248d); text-shadow:-1px -1px -1px rgba(0,0,0,.5);
		color:#fff; 
		text-shadow: 0px 0px 0px #fff;
	}
	a.browse { color:#bbb;}
	a.browse:hover { color:#14E06E;}
	.fancybox-close {
	    top: -10px;
		right:-12px;
	}
	div.fancybox-skin {
	    top: 0px;
	}
	.fancybox-skin { padding:7px !important; background:rgba(0,0,0,.4); }
	.fancybox-outer, .fancybox-inner { }
	
	h1.mission, h1 .animate-charcter, h2.mission { font-weight:400; font-size:32px; line-height:38px; }
	.mainslogan { font-size:22px; line-height:32px; }
	.featcontainer { padding-top:0px; }
	
	h2.author-byline {
	    background: url('/static/images/byline.png');
	    text-transform: uppercase;
		font-family: 'Open Sans',Futura, sans-serif;
	    font-weight: 600;
	    font-size: 0.8rem;
	    letter-spacing: 2px;
	    margin: 0 0 3rem 0;
	    font-size: 15px;
	}
	span.author-byline-inside {
	    padding: 3px 20px 3px 0;
	    background: white;
	}
	
	/*.maintagline, .animate-charcter { font-size:42px; line-height:52px; }*/
	.maintagline, .animate-charcter { font-size:22px; line-height:32px; }
	
	/* ######################## */
	/* ### SQUARE BRANDING ### */
	/* ######################## */
	/** border:3px solid rgba(255,255,255,.17); **/
	
	.logoslogan { font-size:16px; }
	a.subsloganlink, a.subsloganlink:link, a.subsloganlink:visited { color:#aaa; font-size:20px; }
	.subslogan { font-size:19px; line-height: 24px; color:#aaa; border:3px solid rgba(255,255,255,.17); }
	.subslogan:hover {  color:#fff; border:3px solid #03b5ff; }
	.subslogan a { display:block; color:#eee; font-size:15px; }
	.subslogan a:hover { display:block; color:#03b5ff; }
	div#squarelogo.content.grid_5 { max-width:auto !important; }
	div#animateddiv.content.grid_5  { max-width:auto !important; }

	/* ####################### */

	.fancybox-next span {
	  right: 5px;
	  position:fixed;
	}
	.fancybox-prev span {
	  left: 5px;
	  position:fixed;
	}
	.fancybox-nav span {
	    visibility:visible;
	}
	a.fancybox-nav.fancybox-next { 
		position:fixed;
		right:0px;	
		width:25px;
	}
	a.fancybox-nav.fancybox-prev { 
		position:fixed;
		left:0px;	
		width:25px;
	}
	#igmsg a  { color:#1583bf; }
	#igmsg a:hover { color:#fff; }
	#helpmsg a  {
		font-size:15px;
		color: #65d06f; /* color: #00D315; */
		background: #fff;
	}
	#helpmsg a:hover {
		color: #fff;
		background: #00D315;
	}
	.videoWrapper {
		position: relative;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 0px;
		height: 0;
	}
	.videoWrapper iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* ####################### */
	/* ### NEW TYPING TEXT  ### */
	/* ####################### */

	/* ####################### */
	/* ### CENTERED BYLINE ### */

	h2.author-byliner {
	    background: url('/static/images/byline.png');
	    text-transform: uppercase;
		font-family: 'Open Sans',Futura, sans-serif;	
	    font-weight: 600;
	    font-size: 0.8rem;
	    letter-spacing: 2px;
	    margin: 0 3%;
		margin-bottom:10px;
	    font-size:15px;
	    display:block;
	    text-align:center;
		width:94%;
	}
	span.author-byline-insider {
	    padding: 3px 10px 3px 10px;
	    background: white;
	    margin:0 auto;
	    display:inline-block;
	}
	.light a { 
		border-radius: 50px ;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		background:#f7f7f7;
		padding:7px 20px;
	}
	.rounded2 a { 
		background:#00AF14;
		color:#fff;
		border-radius: 30px ; 
		-moz-border-radius: 30px; 
		-webkit-border-radius: 30px;
		padding:15px 70px;
		font-size:16px;
		display:inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
	}
	.rounded2 a:hover { 
		color:#fff;
		background:#00355B;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}
	.rounded a { 
		background:#eee;
		border-radius:25px ; -moz-border-radius:25px; -webkit-border-radius:25px;
		padding:15px 20px;
		font-size:15px;
		display:inline-block;
	}
	.rounded a:hover { 
		color:#fff;
		background:#00355B;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}
	#mmen { display:none; }
	#loading_image {
		display:none;
		height: 100%;
		width: 100%;
		position:fixed;
		top: 0; 
		right:0;
		bottom:0;
		left: 0;
		z-index: 999999999 !important;
		background: #1A87C5 url(/static/images/blue-loader.gif) no-repeat center center;
		background-size: 400px auto;
		/* rgba(255,255,255,.80) rgba(0,0,0,.85) */
	}
	.no-js #loader { display: none;  }
	.js #loader { display: block; position: absolute; left: 100px; top: 0; }
	span.processing { 
		color:#fff;
		/* GREEN color:#00D315; */
		/* text-shadow:0px 1px 0px rgba(255,255,255,.55); */
		text-shadow:0px -1px 0px rgba(0,0,0,.3); 
		text-align:center;
		font-size:22px;
		font-family: 'Open Sans',Futura, sans-serif;
		font-weight:500;
		position:absolute; 
		width:100%; 
		top:37%; 
		display:block; 
	}
	.featureslist a, .featureslist a:active, .featureslist a:visited, .featureslist a:hover { font-weight:bold; }
	h1 { 
		/*text-shadow:0px 1px 0px rgba(255,255,255,.6); */
		color:#5c666b; 
		padding:10px 0; 
		font-weight:500; 
		font-size:42px; 
		line-height:48px; 
	}
	h1, h2, h3, h4, h5, h1 span, h2 span, h3 span, h4 span, h5 span {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;	
	}
	h1, h2 { text-align:center; }
	h2 { line-height:28px; }
	h1.mobileh1 { margin-top:15px; font-weight:100; }
	h3 { font-weight:500; font-size:17px; line-height:25px; margin-bottom:5px; }
	h4 { font-size:28px; line-height:37px; margin-bottom:11px; }
	span.opening { font-size:26px; font-weight:300; line-height:34px; }
	/* padding:15px 30px 10px; margin-bottom:7px; margin-top:20px; font-family:'Open Sans',Futura,'Arial Black',sans-serif; font-weight:300; font-size:20px; color:#fff; text-shadow:0px -1px 1px rgba(0,0,0,.3); */
	.btn-o , .btn-oo a { border:1px solid #fff; padding:15px 0; width:94%; margin:0 3%; display:inline-block; 
	font-family: 'Open Sans', Montserrat,Arial,sans-serif; background: #42B54C; font-size:18px; text-align:center;
	color:#fff; text-shadow:0px -1px 1px rgba(0,0,0,.3); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; 
	}
	.btn-o:active, .btn-o:hover, .btn-oo a:hover, .btn-oo a:active { border:1px solid #fff; background: #00D315; }

	.loginborders { border:1px solid rgba(255,255,255,.3); }
	a.coolblue { color:#00A1FE; }
	a.coolblue:hover { color:#00a4ff; }
	.lightblue a { color:#0072C4; text-shadow:0px -1px 1px rgba(0,0,0,.4); }
	.lightblue a:hover { color:#eee; }
	span.tip { display:none; }
	button {
		height:42px;
		padding:1px 12px;
		border:0px;
		color:#fff;
		background:#00AF14; 
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;	
		border-radius:4px ; -moz-border-radius:4px; -webkit-border-radius:4px;
	}
	button:hover {
		background:#00355B;
	}
	#footer { padding-top:0px; }	
	.main-footer { display:none; }	
	hr {
	 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%;
	}
	.vr {
	  padding: 30px;
	  width: 250px;
	  float: left;
	  border: 1.5px solid;
	  border-top: 0;
	  border-bottom: 0;
	  border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(226, 226, 226, 1) 48%, rgba(255, 255, 255, 0) 100%);
	  border-image-slice: 1;
	}
	.rednote { margin-top:15px; }

	.squareoverlay { background:rgba(0,0,0,.85); }

	.featurestext {
		font-weight: 500;
		font-size:14px; 
		line-height:19px; 
		color:#aaa;
	}

	/* ##################################### */
	/* ############### SLIDER ############## */

		#slider {
		  width:268px;
		  height:477px;
		  position: relative;
		  overflow: hidden;
		  margin:85px 0 0 2px;
		  background:red;
		}
		#slider ul { 
			width:268px;
			height:477px;
			position: relative;
			margin: 0;
			background:blue;
			padding: 0;
			list-style: none;
		}
		#slider ul li {
			width:268px;
			height:477px;
			position: relative;
			display: block;
			float: left;
			margin: 0;
			padding: 0;
		}
	a.control_prev, a.control_next {
		  position: absolute;
		  top: 35%;
		  z-index: 999;
		  display: block;
		  padding: 3% 3%;
		  width: auto;
		  height: auto;
		  background: #2a2a2a;
		  color: #fff;
		  text-decoration: none;
		  font-weight: 600;
		  font-size: 18px;
		  opacity: 0.3;
		  cursor: pointer;
		  font-family:'Times New Roman',Arial,sans-serif;
	}

	a.control_prev:hover, a.control_next:hover {
	    opacity: 1;
	    transition: all 0.3s ease;
	    -o-transition: all 0.3s ease;
	    -ms-transition: all 0.3s ease;
	    -moz-transition: all 0.3s ease;
	    -webkit-transition: all 0.3s ease; 
	}

	a.control_prev {
	  border-radius: 0 4px 4px 0;
	}

	a.control_next {
	  right: 0;
	  border-radius: 4px 0 0 4px;
	}

	.bottomicons, .bottomtray { display:none; }

	/* ############### SLIDER ENDS ############## */
	/* ########################################## */


	/* ########################################## */
	/* ############# BOUNCING ARROW ############# */
	
	.downArrow{
		position: relative;
		margin: 0 auto;
		text-align: center;
		width: 70px;
		height: 70px;
	}

	.bounce {
		-moz-animation: bounce 3s infinite;
		-webkit-animation: bounce 3s infinite;
		animation: bounce 3s infinite;
	}

	@-moz-keyframes bounce {
		0%, 20%, 50%, 80%, 100% {
			-moz-transform: translateY(0);
			transform: translateY(0);
		}
		40% {
			-moz-transform: translateY(-30px);
			transform: translateY(-30px);
		}
		60% {
			-moz-transform: translateY(-15px);
			transform: translateY(-15px);
		}
	}
	@-webkit-keyframes bounce {
		0%, 20%, 50%, 80%, 100% {
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}
		40% {
			-webkit-transform: translateY(-30px);
			transform: translateY(-30px);
		}
		60% {
			-webkit-transform: translateY(-15px);
			transform: translateY(-15px);
		}
	}
	@keyframes bounce {
		0%, 20%, 50%, 80%, 100% {
			-moz-transform: translateY(0);
			-ms-transform: translateY(0);
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}
		40% {
			-moz-transform: translateY(-30px);
			-ms-transform: translateY(-30px);
			-webkit-transform: translateY(-30px);
			transform: translateY(-30px);
		}
		60% {
			-moz-transform: translateY(-15px);
			-ms-transform: translateY(-15px);
			-webkit-transform: translateY(-15px);
			transform: translateY(-15px);
		}
	}

	/* #############  BOUNCING ARROW  ############# */
	/* ############################################ */

	img.guarimg { width:70px; }
	.speakwith { margin-bottom:55px; }

	.iframevid { width:560px; height:315px; }

	/* SCROLL BARS */
	.fancybox-inner {
	    -webkit-overflow-scrolling: touch !important;
		background:#fff;
	}

	.col1icon { margin-right:0px; margin-left:10px; }
	.leftcol1, .rightcol3 { padding-top:55px; }

	button.greensubmit{ display:block; width:100%; }

	.squishtext { padding:0 200px; }

	.productdiv { margin-bottom:25px; }
	.productdiv img:hover { }

	div.producttitle {
	    position: absolute;
	    margin: auto;
	    top: 43%;
	    left:0;
	    right:0;
	    bottom:0;
	    font-size:48px; 
		font-weight:200;
		text-align:center; 
		color:#fff; 
		width:100%; 
		height:auto;
		text-shadow:0px -1px 0px rgba(0,0,0,.4); font-family: Open Sans,Montserrat;
	}

	/* Shine */
	.hover14 figure {
		position: relative;
	}
	.hover14 figure::before {
		position: absolute;
		top: 0;
		left: -100%;
		z-index: 2;
		display: block;
		content: '';
		width: 50%;
		height: 100%;
		background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
		background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
		-webkit-transform: skewX(-25deg);
		transform: skewX(-25deg);
	}
	.hover14 figure:hover::before {
		-webkit-animation: shine .75s;
		animation: shine .75s;
	}
	@-webkit-keyframes shine {
		100% {
			left: 125%;
		}
	}
	@keyframes shine {
		100% {
			left: 125%;
		}
	}

	img.appicon { width:80px; height:80px; border:0px solid #fff; margin:5px; }
	img.appicon:hover { width:90px; height:90px; border:0px solid #ddd; margin:0px; }

	#cta { padding:50px; }

	.appscreenshot { width:24%; margin-right:.625%; height:auto; display:inline; max-width:250px; float:left; }
	.touchicon { display:none; }

	.gridcontent { padding:0 150px; }

	.col1text { color:#fff; text-shadow:0px -1px 1px rgba(0,0,0,.4); }

	#devicecontainer { }
	
	#coolborderright {
		border-right: 1.5px solid;
		border-top: 0;
		width:1px;
		border-bottom: 0;
		border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(226, 226, 226, 1) 70%, rgba(255, 255, 255, 0) 100%);
		border-image-slice: 1;
	}

/* ############################################# */
/* ################ TOP SECTION ################ */
/* ############################################# */

	/*#lpcontainer { margin-top: -55px;}*/

    .topbanner { padding-top:90px; min-height:100px; }
    h1.topbanner_title { color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,.5); font-weight:300; font-size:44px; 
    line-height:49px; background:none; margin:0px; padding:0px; font-family: 'Open Sans', Montserrat,Arial,sans-serif; }
    
   .topbanner_subtitle { text-transform:uppercase; text-align:center; font-size:16px; color:#00CE00; font-weight:500; 
   letter-spacing:2px; line-height: 25px; background:none; margin-bottom:20px; 
   -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

	h1.topbanner_title {
		color: #fff;
		text-shadow: 1px 1px 1px rgb(0 0 0 / 50%);
		font-weight: 300;
		font-size: 70px;
		line-height: 77px;
		background: none;
		margin: 0px;
		padding: 0px;
		font-family: 'Open Sans', Montserrat,Arial,sans-serif;
	}
	.topbanner_content {
		text-align: center;
		color: #fff;
		width: 90%;
		max-width: 1224px;
		margin: 0 auto;
		padding: 0 15px;
		font-family: 'Open Sans', Montserrat,Arial,sans-serif;
		font-size: 26px;
		line-height: 34px;
		font-weight: 300;
	}
	.supercharge {
		background-color: #fd8737;
		background-image: linear-gradient(45deg, #fd8737, #ef1013);
		background-size: 100%;
		-webkit-background-clip: text;
		-moz-background-clip: text;
		-webkit-text-fill-color: transparent;
		-moz-text-fill-color: transparent;
		font-weight: bold;	
	}
	
	/**********************************************/
	/*******            VIDEO BG            *******/
	/**********************************************/
	
	.bg_video {
		display: table;
		height: 500px;
		vertical-align: middle;
		width: 100%;
	}
	.fullscreen-bg {
		/*background: url('static/images/bgmount2.jpg') center center / cover no-repeat;*/
		background: url('static/video/vidbg.jpg') center center / cover no-repeat;
		min-height: 500px;
		background: rgba(0,0,0,.77);
		background-size: cover;
		height: 500px;
		width: 100%;
		display: table-cell;
		vertical-align: middle;
		height: inherit;
	}
	p.vidpar {
		font-family: Montserrat,'Open Sans',sans-serif;
		display: block;
		margin-block-start: 0em;
		margin-block-end: 0em;
		margin-inline-start: 0px;
		margin-inline-end: 0px;
		padding: 0 25px;
		font-size:25px;
		line-height:35px;
		text-align: center;
		color:#fff;
		max-width:1100px;
		width:85%;
		margin:0 auto;
		text-shadow: 2px 2px 2px rgba(0,0,0,.5);
	}	
	.devenhanced {
		font-size: 35px;
	}
	/** FROM HERE TO... **/
	section {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	#banner {
		/*margin-top:-100px !important;*/
		position: relative;
		height: 400px;
		width: 100%;
		overflow: hidden;
	}
	
	#videobcg {
		margin-top:-100px !important;
		position: absolute;
		top: 0;
		left: 0;
		min-width: 100%;
		min-height: 150%;
		height: auto;
		width: auto;
		z-index: -100;
	}

	#videobcg, #alternative {
		margin-top:-100px !important;
		width: 100%;
		height: 140vh;
		object-fit: cover;
		position: fixed;
		left: 0px;
		top: 0px;
		/*z-index: 1;*/
	}	
	/** HERE IS THE PROBLEM WITH THE MOBILE HEADER **/
	.btn-rounded {
		background:none;
		height:50px;
		width:auto;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;	
		max-width:200px;	
		text-align: center;
		margin:30px auto 0;
		border: 5px solid rgba(255,255,255,.2) !important; 
	}	
	
	.btn-rounded a, .btn-rounded a:active, .btn-rounded a:visited, .btn-rounded a:link {
		width: 100%;
		height: 50px;
		line-height: 50px;
		font-family: Montserrat,'Open Sans',sans-serif;
		font-size: 17px;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		background: #00BA49;
		color: #fff;
		margin: 0 !important;
		font-weight: 700;
		text-shadow: 0px -1px 0px rgba(0,0,0,.4);
		display: block;
		/*border: 2px solid rgba(0,186,73,.3) !important;*/
	}
	.btn-rounded a:hover {
		background: #22a36b;
	}	
	
	.thirdss {
		width: 32%;
		margin:.5%;
		display:inline-block;
		background:#000;
	}
	.input_sub {
		width:38%; display:inline-block; margin-right:1%;
	}
	.input_subb {
		width:20%; display:inline-block;
	}	
	.btn-reddish {
		margin-top:20px;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		background:#f11303;
		border: 5px solid #fc938a;	
		font-size:17px;
		height:27px;
		min-width:150px;
		line-height:27px;
		color:#fff;
		padding:10px 15px;	
	}
	.btn-reddish a {
		font-size:17px;
		color:#fff;
	}
	.btn-reddish:hover {
		background:#f03a44;
		border: 5px solid #ff6f6c;	
		/*border: 5px solid rgba(255,255,255,.3) !important;*/
	}
	.btn-black {
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		background:none;
		border: 5px solid rgba(255,255,255,.2) !important;
	}
	.btn-black:hover {
		/*border: 5px solid rgba(255,255,255,.3) !important;*/
	}
	input#subscribe.btn-black {
		/*background:rgba(0,0,0,.3);*/
		background:rgba(0,186,73,.3) !important;
		/*background:red !important;*/
		height:59px !important;
	}
	input#subscribe.btn-black:hover {
		/*background:rgba(0,0,0,.3);*/
		background: rgba(0,186,73,.5) !important;
	}
	.btn-black a {
		width: 100%;
		height: 49px;
		line-height: 49px;
		font-family: Montserrat,'Open Sans',sans-serif;
		font-size: 17px;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		background: #00BA49;
		color: #fff;
		margin: 0 !important;
		font-weight: 700;
		text-shadow: 0px -1px 0px rgba(0,0,0,.4);
		display: inline-block;
	}
	.btn-outline a {
		width: 100%;
		height: 49px;
		line-height: 49px;
		font-family: Montserrat,'Open Sans',sans-serif;
		font-size: 16px;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		border: 1px solid #326bb9;
		color: #FFF;
		background: #4392ec;
		background: -moz-linear-gradient(top, #4392ec 0%, #377ae8 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4392ec), color-stop(100%,#377ae8));
		background: -webkit-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: -o-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: -ms-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: linear-gradient(top, #4392ec 0%,#377ae8 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4392ec', endColorstr='#377ae8',GradientType=0 );
		/*border:2px solid #0373a6;
		background: #00a3ec;*/
		margin: 0 !important;
		font-weight: 300;
		display: inline-block;
	}
	.btn-outline a:hover {
		border: 1px solid #326bb9;
		color: #FFF;
		background: #449afc;
		background: -moz-linear-gradient(top, #377ae8 0%, #4392ec 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#377ae8), color-stop(100%,#4392ec));
		background: -webkit-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: -o-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: -ms-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: linear-gradient(top, #377ae8 0%,#4392ec 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4392ec', endColorstr='#4392ec',GradientType=0 );
	
	}
	.btn-black a:hover {
		background: #00e65c;
	}
	
	.topsection { margin-top:0px; }
	
	.quickpostform ::-webkit-input-placeholder {
		/* Edge */
		color: #bbb;
	}

	.quickpostform :-ms-input-placeholder {
		/* Internet Explorer 10-11 */
		color: #bbb;
	}

	.quickpostform ::placeholder {
		color: #bbb;
	}
	
	input.btn-flat {
		padding: 10px;
		font-weight: 300;
		font-size: 15px;
		border: 1px solid #326bb9;
		color: #FFF;
		background: #4392ec;
		background: -moz-linear-gradient(top, #4392ec 0%, #377ae8 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4392ec), color-stop(100%,#377ae8));
		background: -webkit-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: -o-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: -ms-linear-gradient(top, #4392ec 0%,#377ae8 100%);
		background: linear-gradient(top, #4392ec 0%,#377ae8 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4392ec', endColorstr='#377ae8',GradientType=0 );
		-moz-transition: all 0.3s ease 0s;
		-webkit-transition: all 0.3s ease 0s;
		-o-transition: all 0.3s ease 0s;
		-ms-transition: all 0.3s ease 0s;
		transition: all 0.3s ease 0s;
		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;
		box-shadow: 0 3px 10px rgb(0 0 0 / 20%);
	}
	input.btn-flat:hover {
		border: 1px solid #326bb9;
		color: #FFF;
		background: #449afc;
		background: -moz-linear-gradient(top, #377ae8 0%, #4392ec 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#377ae8), color-stop(100%,#4392ec));
		background: -webkit-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: -o-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: -ms-linear-gradient(top, #377ae8 0%,#4392ec 100%);
		background: linear-gradient(top, #377ae8 0%,#4392ec 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4392ec', endColorstr='#4392ec',GradientType=0 );
	}
	
	.fa-chevron-down{
		transform: rotate(0deg);
		transition: transform .3s linear;
	}

	.fa-chevron-down.open{
		transform: rotate(180deg);
		transition: transform .3s linear;
	}
	
	a.btn-o, a.btn-o:active, a.btn-o:visited, a.btn-o:link {
		color:#eee !important;
	}
	a.btn-o:hover {
		color: #fff !important;
	}	
	.btn-o, .btn-o a, .btn-o a:link, .btn-o a:active, .btn-o a:visited, .btn-oo a {
		border: 3px solid #29baff;
		background-color: #8b248d;
		background-image: linear-gradient(45deg, #8b248d, #099bf2);
		text-shadow: -1px -1px -1px rgba(0,0,0,.5);
		padding: 10px 15px;
		width: 150px;
		height: 20px;
		line-height: 20px;
		display: inline-block;
		font-family: 'Open Sans', Montserrat,Arial,sans-serif;
		font-weight: 300;
		font-size: 15px;
		color: #fff;
		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
	}

	.btn-o:active, .btn-o:hover, .btn-oo a:hover, .btn-oo a:active {
		border: 3px solid #fff;
		/*background: #82be55; */
		background-color: #099bf2;
		background-image: linear-gradient(45deg, #099bf2, #8b248d);
		text-shadow: -1px -1px -1px rgba(0,0,0,.5);
	}
	
	a.socialmediaicon {
		font-size:20px;
		padding: 5px 5px 5px 5px;
		margin-right: 10px;
		width: 50px;
		height: 50px;
		text-align: center;
		line-height: 50px;
		display: inline-block;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
		border-radius: 50%;
		border: 1px solid transparent;
		-moz-box-shadow: 0px 0px 4px #888;
		-webkit-box-shadow: 0px 0px 4px #888;
		box-shadow: 0px 0px 4px #888;
		color: #14E06E;
	}
	a.socialmediaicon:hover {
		color: #fff;
		border: 1px solid #fff;
		-moz-box-shadow: 0px 0px 2px #888;
		-webkit-box-shadow: 0px 0px 2px #888;
		box-shadow: 0px 0px 2px #888;
	}
	/* Around LINE 1250 */
	.sbdivs { 
		padding:20px 0 20px 0;
	}
	.sbdivs a {
		color: #000;
	}
	.serviceboxes { 
		font-size:16px;
		background:none; text-align:center; min-height:30px; line-height:23px;
		-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
		border:1px solid #ddd;
		padding:10px 0;
		border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
		font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana,sans-serif;
	}
	.serviceboxes a, .serviceboxes a:link, .serviceboxes a:active, .serviceboxes a:visited { 
		color:#000;
		display:block;
	}
	.serviceboxes a:hover {
		color:#fff;
		display:block;
	}
	.serviceboxes small {
		color: #aaa;
	}	
	.serviceboxes:hover { 
		background:#005493;
		color:#fff;
		border:1px solid #00b0f7; /*border:1px solid #0098d1;*/
	}
	.serviceboxes:hover small {
		color: #00b0f7;
	}
	
	#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);
	}
	
	.morearrow { position:fixed; bottom:69px; border:0;/*border-top:1px solid rgba(255,255,255,.2); border-bottom:0px;*/ 
    left:0; width:40px; height:30px; background:rgba(0,0,0,.7); text-align:center; line-height:30px; 
	z-index:9999999999999999999999999999; }
    
	.scrollup {
		bottom: 79px;
	}

	.animate-charcter {
		background-image: linear-gradient(
		-225deg,
		#cace00 0%,
		#ff7a00 29%,
		#ff166c 67%,
		#fff800 100%
		);
		background-size: auto auto;
		background-clip: border-box;
		background-size: 200% auto;
		color: #fff;
		background-clip: text;
		text-fill-color: transparent;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		animation: textclip 3s linear infinite;
		display: inline-block;
	}

	@keyframes textclip {
	  to {
	    background-position: 200% center;
	  }
	}
	
	.containerfluids {
		margin-top: -80px !important; padding-bottom:70px;
	}
	svg {
		display: block;
		font: 10.5em 'Montserrat';
		width: 100%;
		height: 300px;
		margin: 0 auto;
	}
	
	.brandingslogan { font-size: 32px; line-height:42px; font-weight:300; }
	
	.accordionhalfl { width: 55%; }
	.accordionhalfr {width: 45%; }
	
	@use postcss-preset-env {
		stage: 0;
	}

	:root {
		--color-background: #000119;
		--stroke-width: calc(1em / 16);
		/*--font-size: 30vmin;*/
		--font-weight: 600;
		--letter-spacing: calc(1em / 8);
	}

/*	body {
		background-color: var(--color-background);
		display: grid;
		font-family: Poppins, sans-serif;
		margin: 0;
		min-block-size: 100vh;
		place-items: center;
		padding: 5vmin;
	}*/
	.stroke, .stroke a {
		color: #000 !important;
	}
	.stroke {
		font-family: Poppins, sans-serif;
		color:#000;
		/*font-size:28px;*/
		background-clip: text;
		background-image: linear-gradient(to right, #09f1b8, #00a2ff, #ff00d2, #fed90f);
		color: var(--color-background);
		font-size: var(--font-size);
		font-weight: var(--font-weight);
		letter-spacing: var(--letter-spacing);
		padding: calc(--stroke-width / 2);
		-webkit-text-stroke-color: transparent;
		-webkit-text-stroke-width: var(--stroke-width);
	}

/* ########################################################################## */
/* #####################         MOBILE STYLING         ##################### */
/* ########################################################################## */

	@media screen and (min-device-width: 1920px), screen and (max-width: 4399px) {
		.spacer { padding-top:54px; }
		.topbanner { padding-top:90px; min-height:100px; padding-bottom:10px; }
		.topsection { background-size:cover;  }
		#animateddiv { 
	          float: left;
	          border-left: 1.5px solid;
	          border-top: 0;
	          border-bottom: 0;
	          border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(226, 226, 226, 1) 70%, rgba(255, 255, 255, 0) 100%);
	          border-image-slice: 1;	    
		 }
	}

/******************************************************************************/
/***************        LARGE DESKTOP DISPLAY SCREENS         *****************/
/******************************************************************************/

	@media screen and (min-device-width: 1367px), screen and (max-width: 1919px) {
		.spacer { padding-top:54px; }
		.newhdrlogo { display:none; }
		.topbanner { padding-top:90px; min-height:100px; padding-bottom:10px; }
		.topsection { background-size:cover;  }
		#animateddiv { 
	          float: left;
	          border-left: 1.5px solid;
	          border-top: 0;
	          border-bottom: 0;
	          border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(226, 226, 226, 1) 70%, rgba(255, 255, 255, 0) 100%);
	          border-image-slice: 1;	    
		 }
	}

/******************************************************************************/
/***************      SMALLER THAN FULL SCREEN MACBOOK        *****************/
/******************************************************************************/
 
	@media screen and (min-device-width: 1025px), screen and (max-width: 1366px) {
		#header {
			/*height: 53.25px;*/
			/*overflow:hidden;*/
		}
		#header .wrap-top-menu {
			height: 38.50px;
			/*overflow:hidden;*/
		}
		div.spacer { padding-top:53.25px; }
		.newhdrlogo { display:none; }
		.topbanner { padding-top:70px; min-height:100px; padding-bottom:25px; }
		.topsection { background-size:cover;  }
		#animateddiv { 
	          float: left;
	          border-left: 1.5px solid;
	          border-top: 0;
	          border-bottom: 0;
	          border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(226, 226, 226, 1) 70%, rgba(255, 255, 255, 0) 100%);
	          border-image-slice: 1;	    
		 }
	}
	
/******************************************************************************/
/***************            iPads & Small Screens             *****************/
/******************************************************************************/
	 
	@media (max-width: 1024px) {
		.spacer { padding-top:46px !important; }
		.newhdrlogo { display:none; }
		#animateddiv { border-left:1px solid #eee; }
		.topbanner { padding-top:60px; min-height:100px; }
		.topbanner_content { font-size:27px; line-height:33px;} 
	}
	/* ########################## */
	@media (max-width: 1023px) {
		.spacer { padding-top:37px !important; }
		.newhdrlogo { display:none; }
		.layout-2cols { width:100%; }
		.grid_4, .grid_3, .blockit { width:100%; display:block; }
		#rightsidecol { background: #ccc url(/static/images/bgmount.jpg) no-repeat top center; padding-bottom:50px; width:100%; margin-left:0px; margin-right:0px; }		
		.leftcol1, .rightcol3 { width:312px; margin:0 auto; }
		.leftcol1 { padding:0; margin-bottom:25px; }
		div.rounded { padding-bottom:20px; }
		#animateddiv { border-left:1px solid #eee; }
	}
	/* ########################## */
	/* 768px is iPad Portrait */
	@media (max-width: 768px) {
		.spacer { padding-top:47px !important; }
		h1.mission, h1 .animate-charcter, h2.mission { font-weight:400; font-size:26px; line-height:32px; }
		.mainslogan { font-size:20px; line-height:28px; }
		.featcontainer { padding-top:15px; max-height:330px; }
		
		.newhdrlogo { display:none; }
		.layout-2cols { width:100%; }
		.blockit { width:47%; float:left; }
		#rightsidecol { background: #ccc url(/static/images/bgmount.jpg) no-repeat top center; 
		padding-bottom:50px; width:100%; margin-left:0px; margin-right:0px; }		
		h1 { font-size: 26px; line-height:34px; }
		.featurestext {
			font-weight: 400; 
			color:#aaa; 
			font-size:13px;
			line-height:17px; 
		}
		.leftcol1, .rightcol3 { width:312px; margin:0 auto; }
		.leftcol1 { padding:0; margin-bottom:25px; }
		div.rounded { padding-bottom:20px; }
		
		.accordionhalfl { display:block; width: 100%; height:650px; }
		.accordionhalfr { display:block; width: 100%; }
		
		.squareoverlay { background:rgba(0,0,0,.75); }
		.logoslogan { font-size:15px; }
		div.text-js.slogan { font-size:23px !important; line-height:28px !important; }
		.subslogan { font-size:17px; line-height: 22px; }
		#squarelogo { max-width:100% !important; }
		#animateddiv { border-left:0px solid #eee; max-width:100% !important; width:100% !important; background:none !important; }
		
	}

	/* ########################## */
	@media (max-width: 586px) {
/*		#header {
			height: 53.25px;
		}
		#header .wrap-top-menu {
			height: 38.50px;
		}
		.spacer {
			padding-top: 53.25px;
		}*/
		#header .wrap-top-menu {
			/*height: 38.50px;*/
			/*overflow:hidden;*/
		}
		div.spacer {
			/*padding-top: 53.25px;*/
		}
		.topsection { margin-top:4.5px; }
		.blockit {
			display: block;
			width:100%;
			overflow:hidden;
		}
		.maintagline, .animate-charcter { font-size:22px; line-height:32px; } /* 28/38 */
		.containerfluids { margin-top:-20px !important; padding-bottom:10px; }
		svg {
			display: block;
			font: 13.5em 'Montserrat';
			width: 100%;
			height: 200px;
			margin: 0 auto;
		}
		.input_sub {
			margin-left:5%;
			margin-right:5%;
			margin-bottom:15px;
			width:90%;
		}
		.input_subb {
			margin-left: 5%;
			margin-right: 5%;
			margin-bottom: 15px;
			width: 90%;
		}		
		.topbanner { padding-top:50px; }
		.topbanner_content { font-size:24px; line-height:31px;} 
		.topbanner_subtitle { padding:10px 5px 10px; line-height: 21px;}
		.sbdivs {
			padding: 5px 0 20px 0;
		}
		.serviceboxes {
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box; box-sizing: border-box;
			margin-bottom:5px;
			width:98%;
		}
		.bg_video {
			height: 750px;
		}	
		.fullscreen-bg {
			height: 750px;
		}
		p.vidpar	{
			font-size: 21px; line-height:30px;
		}
		.brandingslogan { font-size: 20px; line-height:30px; font-weight:300; }	
		.devenhanced {
			font-size: 27px;
		}
		a.socialmediaicon {
			font-size: 20px;
			padding: 5px 5px 5px 5px;
			margin-left:15px;
			margin-right: 15px;
			margin-bottom:20px;
			width: 50px;
			height: 50px;
			text-align: center;
			line-height: 50px;
			display: inline-block;
			-moz-border-radius: 50%;
			-webkit-border-radius: 50%;
			border-radius: 50%;
			border: 1px solid transparent;
			-moz-box-shadow: 0px 0px 4px #888;
			-webkit-box-shadow: 0px 0px 4px #888;
			box-shadow: 0px 0px 4px #888;
			color: #14E06E;
		}
		a.subsloganlink, a.subsloganlink:link, a.subsloganlink:visited { font-size:17px; line-height:20px; }
		.subslogan a { font-size:13px; }
		.subslogan a:hover { }
	}
	
	/* ########################## */
	@media (max-width: 480px) {
		.topsection { margin-top:4.5px; }
		h1 { font-size: 26px; line-height:34px; }
		.topbanner { padding-top:50px; padding-bottom:0px; }
		.topbanner_content { font-size:24px; line-height:31px;} 
		.topbanner_subtitle { padding:10px 5px 10px; line-height: 21px;}
		.intro2cols { padding-bottom:0px; }
		.touchicon { display:block; }
	    .appsolutions a { display:inline-block; width:50%; float:left; padding:10px 0px; background:#eee; color:#222; 
	    font-size:12px; font-weight:300; text-shadow:0px 1px 0px rgba(255,255,255,.5); margin-bottom:6px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box; margin-left:0px; margin-right:0px; }	
	   .appsolutions a:nth-child(odd) { border-right:5px solid #fff; }
	   .browsebutton { margin-top:5px;}
	   #animateddiv { border-left:0px; }
	   .brandingslogan { font-size: 17px; line-height:27px; font-weight:300; }
	   .hidebullet { display:none; }
	   .squareoverlay { background:rgba(0,0,0,.75); }   
	}
</style>

<!--RED  INSTAGRAM BANNER  -->
<div id="igmsg" style="display:none; background:#dd0000; text-align:center; padding:10px 0; color:#fff; margin-top:-1px">
	<a href="/iglive" style="font-weight:700; text-shadow:0px 1px 1px rgba(0,0,0,.5); 
	background:rgba(0,0,0,.3); border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding:5px 10px">Click here</a> 
	to view our Instagram LiveStream Info page <!--(happening right now)--> for our Instagram 
	page <a href="https://www.instagram.com/thinapp/" style="font-weight:700; text-shadow:0px 1px 1px rgba(0,0,0,.5);">@thinapp</a>
</div>

<div id="helpmsg"  style="display:none; background:#dd0000; text-align:center; padding:15px 15px; color:#fff; margin-top:-1px; letter-spacing: normal; font-size:16px; line-height: 27px; font-weight:600; font-smooth: always;">
    <!--<a href="https://getpreorder.com/iglive" style="font-weight:700; border-radius:50px; -moz-border-radius:50px; -webkit-border-radius:50px; padding:3px 10px">Click here</a> -->
	08/10/2022 - Pre-Launch: The first 1400 Members will become SSU Founding Members 
	&amp; split 75% of the profits.
	
	<a href="/founding-members" title="Learn more about Founding Members" 
	style="background:none; font-weight:800; text-shadow:1px 2px 1px rgba(0,0,0,.1);">Learn more &rsaquo;</a> &nbsp;
	
	<!--Join today for a $49 one-time payment &amp; get a Lifetime Premium Membership 
	(for you &amp; a friend) + a
	$100 VISA Giftcard.--> <!-- with a built-in SSU Dashboard that helps instantly install SSU-created Square features. -->
	
	<!--<a href="/pricing" style="font-weight:700; text-shadow:0px 0px 0px rgba(255,255,255,0);
		border-radius:50px; -moz-border-radius:50px; -webkit-border-radius:50px; 
		padding:3px 10px 3px 15px;">Join now &rsaquo;</a> -->
    
    <!--We&rsquo;re happy to announce the BETA launch of <a href="/features" title="View the Square Wish List" style="font-weight:600;">Square Wish List</a> 
    &amp; <a href="/" title="Visit Square Sellers United" style="font-weight:600;">Square Sellers United</a> - communities
    we&rsquo;ve created to empower businesses who use Square.-->
    
</div>

<!--<div style="height:50px; margin-top:-100px; 
position:absolute; top:0; right:0; left:0; width:100%; background:red;">
	&nbsp;
</div>-->

<!-- TOP PAGE CONTAINER BEGINS -->

<div id="lpcontainer" class="topsection" style="background:#fff; overflow:hidden; font-family: Montserrat, 'Open Sans',Helvetica, 'Helvetica Neue', Verdana, Arial,sans-serif; border-bottom:0px solid #ff0000;">
	<div id="helpmsg" style="background:#eee; text-align:center; padding:15px 15px; color:#000; 
	text-shadow:0px 1px 0px #fff; margin-top:40px; font-size:17px; line-height: 27px; display:none;">
		...
	</div>
	<!-- #000 url(static/client/coding.jpg) no-repeat -->
	<div class="topbanner" style="background:none; background-size:cover; margin-top:15px;">
		<!--<div class="floatingnext" style="display:none;">
		<a href="/ip" style="color:#fff;">View IP &raquo;</a></div> -->
		<center>
			<a href="/"><img src="/static/client/flipmob_horizontal_logo_black.png"
			alt="Flip Mob" style="width:80%; max-width:480px; margin-top:-57px"></a>
			<style>
				.waviy span {
				  position: relative;
				  display: inline-block;
				  text-transform: uppercase;
				  /*animation: flip 2.5s infinite;*/
				  animation: flip 6s infinite 0s;
				  animation-delay: calc(.25s * var(--i))
				  /*animation: fadeEffect 15s linear infinite 0s;*/
				}
				@keyframes flip {
				  0%,80% {
				    transform: rotateY(360deg) 
				  }
				}
			</style>
<!--			<div class="waviy">
				<span style="--i:1">M</span>
				<span style="--i:2">O</span>
				<span style="--i:3">B</span>
				<span style="">&nbsp;</span>
				<span style="--i:4">K</span>
				<span style="--i:5">N</span>
				<span style="--i:6">O</span>
				<span style="--i:7">W</span>
				<span style="--i:8">S</span>
				<span style="">&nbsp;</span>
				<span style="--i:9">B</span>
				<span style="--i:10">E</span>
				<span style="--i:11">S</span>
				<span style="--i:12">T</span>
			</div>-->
			
			<div class="waviy" style="width:250px; background:#f11303 url(/static/client/sloganbg.png); 
			margin-top:0px; color:#fff; 
				font-size:18px; letter-spacing: -1px; padding:8px 12px 7px;
				text-transform: uppercase; font-weight:500; 
				border-radius: 50px; -moz-border-radius:50px; -webkit-border-radius:50px;">
				<!--MOB KNOWS BΞST-->
				<span style="--i:1">M</span>
				<span style="--i:2">O</span>
				<span style="--i:3">B</span>
				<span style="">&nbsp;</span>
				<span style="--i:4">K</span>
				<span style="--i:5">N</span>
				<span style="--i:6">O</span>
				<span style="--i:7">W</span>
				<span style="--i:8">S</span>
				<span style="">&nbsp;</span>
				<span style="--i:9">B</span>
				<span style="--i:10">E</span>
				<span style="--i:11">S</span>
				<span style="--i:12">T</span>
			</div>
			
			<h1 class="mission" style="margin:15px auto 15px; padding-bottom:5px; width:60%;
				font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif; color:#222">
				MAKE <span class="animate-charcter"
					style="font-weight:600">MONΞY</span> OUT OF THIN AIR 
				<!--<span style="color:#00D315; font-weight:400">57</span> SECONDS-->
			</h1>
			 
			<div class="mainslogan" style="color:#222; max-width:1000px; margin:0 auto;
			font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif; padding:0 20px">

				<!--It takes money to make money, but it also takes <i>people</i> to make money - -->
				FlipMob helps connect people everywhere + use crowd-power to "flip" life's most
				common, everyday items and <span style="font-weight:600">opp</span>ortunities into instant savings
				<i>and</i> profits. <a href="/about" class="coolblue" 
				style="font-weight:600;">Learn more <i class="fa fa-angle-right" aria-hidden="true"></i></a>
				
				<!--FlipMob helps regular, everyday people connect and combine their efforts + 
				money to &ldquo;flip&rdquo; tons of everyday opportunities (ie. opps) into 
				profits. <a href="/about" class="coolblue" style="font-weight:600;">Learn more <i 
						class="fa fa-angle-right" aria-hidden="true"></i></a>-->
				
				<div style="border-top:2px solid #ccc; height:2px; 
				width:70px; margin:20px auto 10px;">&nbsp;</div>
				
				<div style="display:nonex; text-transform: uppercase; color:#777; font-size:15px;">
					The ultimate listings engine - with a crowd twist
					<!--<a href="#save" class="loginpop"><img
						src="/static/images/icons/info-icon-gray.png" alt="i" style="height:20px; margin-top:-2px"
						width="20" height="20" align="absmiddle" /></a>-->
				</div>	
				
				<div style="display:none; text-transform: uppercase; color:#777; font-size:15px;">
					Earn/Save 10-50% Buying, Selling + Splitting BOGOs, Bulk Deals, Rewards &amp; more. 
					<a href="#save" class="loginpop"><img 
					src="/static/images/icons/info-icon-gray.png" alt="i" style="height:20px; margin-top:-2px"
					width="20" height="20" align="absmiddle" /></a>
				</div>	 
			</div>

<!--			<div style="display:none; font-size:22px; line-height:32px; max-width:1000px; 
				margin:0 auto; padding:0 20px;">
				Connect with others to crowd-power or crowd-fund
				<a href="#you99" class="loginpop animate-charcter" style="font-weight:600;"
				title="Find synergies that help you earn more, save more and grow more."><span
					class="animate-characterbg">anything</span></a>.
				Some of the best financial opportunities to create wealth in this world require
				significant upfront capital. FlipMob was created to give regular, every day people 
				those very same opportunities for as little as $5/each.
			</div>-->
		</center>

		<div class="clear"></div>
	</div>
	<div class="clear"></div>
</div>

<!-- HIDDEN FOR NOW removed this from lpcontainer background-size:initial; -->
<div id="lpcontainer" class="topsection" style="display:none; background: rgba(0,0,0,.85); overflow:hidden; font-family: Montserrat, 'Open Sans',Helvetica, 'Helvetica Neue', Verdana, Arial,sans-serif;">
    <div id="helpmsg" style="background:#eee; text-align:center; padding:15px 15px; color:#000; text-shadow:0px 1px 0px #fff; margin-top:40px; font-size:17px; line-height: 27px; display:none;">
        ...
    </div>
	<!-- #000 url(static/client/coding.jpg) no-repeat -->
	<div class="topbanner" style="background:none; background-size:cover;">
		<!--<div class="floatingnext" style="display:none;">
		<a href="/ip" style="color:#fff;">View IP &raquo;</a></div> -->
		<center>
			<img src="/static/client/flipmob_horizontal_logo.png"   
			alt="Flip Mob" style="width:80%; max-width:480px; margin-top:-57px">
			<div style="margin-top:0px; color:#fff; font-size:18px; letter-spacing: 2px; 
			text-transform: uppercase;">
				FLIP ANYTHING TO MONΞY
			</div>
		</center>
		<br />
		
		<!--<h1 class="topbanner_title" style="">
			<span style="font-weight:800">VIP</span> PROGRAM
		</h1>-->

		<div class="topbanner_content" style="margin-top:10px;"> 
			
			<!--Join thousands, save thousands + make thousands.-->
			<!--Save thousands of dollars on all your Dev, Tech &amp; Creative needs by splitting
			costs with others who have similar projects &amp; needs. -->
			
			<div class="maintagline" style="font-weight:600; margin:0 auto 15px; max-width:1100px;
				font-family: Montserrat, 'Open Sans',Helvetica, 'Helvetica Neue', Verdana, Arial,sans-serif;">
				<!--FlipMob helps <a href="#you99" class="loginpop" title="Who are you?">you</a> find, 
				connect &amp; split costs with others who have similar tech, dev + design needs.-->
				<!--Global Networking with a <a href="#you99" class="loginpop" title="Who are you?">purpose</a> + 
				actual <a href="#you99" class="loginpop" title="Who are you?">synergy tools</a>. 
				Create a free Profile <a href="/join" style=""
				title="Create a free Profile now">now</a> <i 
				class="fa fa-angle-right" aria-hidden="true"></i>-->
				<!--Join the FlipMob online global network where we&rsquo;ve created tools + services
				that help you -->
				
				<span style="color:#f87f88; font-weight:400">BETA</span> - Earn more <a href="#save" 
				class="stroke loginpop" style=""
				title="FlipMob helps you make more money...">money</a> by using crowd-power to
				<a href="#you99" class="loginpop animate-charcter"
				title="Find synergies that help you earn more, save more and grow more."><span
					class="animate-characterbg">flip anything</span></a>, anywhere. <!--<a href="/listings">Browse 
					flipmob$ <i class="fa fa-angle-right" aria-hidden="true"></i></a>-->
					<!--  &amp; creating
					<a href="#devshares" class="loginpop" style="color:#fff;"
					title="What dev$hares?">&ldquo;dev$hares&rdquo;</a> (collaboratives). -->
					
				<br />
				
				<div style="display:nonex; font-size:17px; line-height:23px; font-weight:500; 
					margin:10px 0; color:#bbb;
					font-family:Montserrat,'Open Sans',Helvetica,'Helvetica Neue',Verdana,Arial,sans-serif;">
					Estimated Soft-launch Feb 26, 2024 - <a href="/auth/join" 
					title="Join free now">Join free now!</a>
				</div>

				<div style="display:nonex; max-width:670px; margin:0 auto; background:none; 
				margin-top:15px; font-weight:400;
					box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;">
					<div class="subslogan" style="width:48%; line-height:28px;
					text-shadow:1px -1px 1px rgba(0,0,0,.7); padding:15px 10px 15px;
					display:inline-block; float:left; margin:1%;
					box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;">
						<a href="/listings" class="subsloganlink" style="display:block;">BROWSE FLIPS</a>

						<!--<a href="/project/addnew"><img src="/static/client/animated_plus.gif"
							style="height:15px; margin-top:-3px" alt="+"> Post a dev$hare
							<i class="fa fa-angle-right" aria-hidden="true"></i></a>-->
					</div>
					<!-- background:rgba(0,0,0,.5); --> 
					<div class="subslogan" style="width:48%; line-height:28px;
					text-shadow:1px -1px 1px rgba(0,0,0,.7); padding:15px 10px 15px; 
					display:inline-block; float:left; margin:1%;
					box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;">
						<a href="/project/adddeal" class="subsloganlink" style="display:block;">POST A FLIP</a>

						<!--<a href="/auth/join">Create a profile <i 
						class="fa fa-angle-right" aria-hidden="true"></i></a>-->
					</div>
					<div class="clear"></div>
				</div>	
				<div class="clear"></div>
				
				<div class="subslogan" style="display:none; margin-top:10px; font-weight:400;">
					Powered by our collaborative,
					group-funding style member-based networking + features.
				</div>  
				<!--<a href="/members"
				title="Member Networking"></a>-->
				<!--<a href="#save" class="neongreen loginpop" style=""
				title="FlipMob helps you earn more...">Earn</a> more,
				<a href="#save" class="neongreen loginpop"
				style="" title="FlipMob helps you save more...">save</a> more +
				<a href="#save" class="neongreen loginpop" style="" 
				title="FlipMob helps you grow more...">grow</a> more by finding
				<a href="#you99" class="loginpop animate-charcter" 
				title="Find synergies that help you earn more, save more and grow more."><span 
				class="animate-characterbg">synergies</span></a> with others, splitting costs
				and crowd-funding new projects + hires. 
				Create a free profile <a href="/join" 
				title="Sign up free to create a profile now">now <i 
				class="fa fa-angle-right" aria-hidden="true"></i></a>-->
			</div>
 
 			<div style="display:none; font-size:17px; line-height:23px; font-weight:500; 
				text-transform: uppercase; margin-bottom:10px; color:#bbb;
				font-family: Montserrat, 'Open Sans',Helvetica, 'Helvetica Neue', Verdana, Arial,sans-serif;">
				<!--Get Projects + Hiring done at a fraction of the cost.-->
				100% member-owned. What are <i>you</i> looking for?<a href="/project/adddeal" style=""
				title="Create a flip mob free now" class="neongreen" id="rotate"><img 
				src="/static/client/icon_circle_dots.png"
				style="height:24px; margin:-3px 2px 0">Post it <i class="fa fa-angle-right" 
				aria-hidden="true"></i></a>
				<!-- Plus, we also offer affordable, on-demand specialized services.-->
			</div>	
			
<!--			<a href="/project/addnew" style="" 
				title="Post a new Job/Project free now!" class="neongreen"> <img 
				src="/static/client/plus_sign_icon_green.png" style="height:25px; margin-top:-6px; margin-right:3px" 
				alt="+">Post a Job</a> now for a chance to get it done for 
				<span style="font-weight:500;">free!</span> &bull; <a href="/how-it-works" 
			style="" title="How It Works" class="neongreen">How It Works <i class="fa fa-angle-right" 
			aria-hidden="true"></i></a> -->
			
			<!--<br />-->
			<hr style="border-top:1px solid #fff; width:70px; margin:0 auto; margin-top:20px; margin-bottom:5px" />
					
			<h1 style="display:nonex; margin:0; background:none; color:#fff; font-size:27px; line-height:37px;
				text-shadow:0px -1px 0px rgba(0,0,0,.4);">Find others to &ldquo;flip mobs&rdquo;
			<span class="txt-rotate" data-period="250" style="color:#14E06E;"
				  data-rotate='[ "any BOGO (buy-one-get-one) deals.", "spend X, get X credit deals.", "any bulk-discount deals.", "giftcard bonus deals.", "and any other deals!" ]'></span>
            </h1>
            
           <!--<br />-->
		
			<hr style="border-top:1px solid #fff; width:70px; margin:0 auto; margin-top:10px;" />
			<!--<br />-->
			
			<div style="display:none; font-size:19px; line-height:29px; margin-top:20px; margin-bottom:15px;">
				
				Join our member-owned community of <a href="#ourapproach" class="loginpop neongreen" 
				title="Made for Entrepreneurs - by Entrepreneurs">entrepreneurs</a> who 
				vote on which tech we create + receive monthly profit-sharing payouts.
				
				<a href="/about" style="" title="Learn more" class="neongreen">Learn more
					<i class="fa fa-angle-right" aria-hidden="true"></i></a>
				
				<!--we create (or get created) and then get unlimited access to that new tech + a percentage
				of the profits when we re-sell it to others who might also need it.-->
				
			</div>
			<!-- NEON #14E06E --> 
			<!--<span style="font-family:Enhanced; font-size:35px; color:#00d803; font-weight:600">-->
			<div class="topbanner_subtitle" style="margin-top:7px; font-size:15px; letter-spacing: 1px">
				
				<div id="coolborderrightxxx" style="display:nonex; max-width:700px; margin:0 auto; font-size:17px;"> 
					<div style="padding:0 10px; color:#fff; font-weight:600; line-height:10px !important">
						<a href="#rdp" title="RDP-friendly" class="loginpop"><img 
						src="/static/client/rdp_icon.png" alt="RDP" 
						align="absmiddle" style="height:40px;" /></a> <span 
						style="font-size:20px; font-family:Enhanced;"></span><span 
						class="animatednumber" data-number="79999" 
							style="color:#14E06E; font-weight:600; font-size:20px; 
							font-family:Enhanced;">5000006</span>+
							
							<div style="display:inline; color:#fff; font-size:15px; line-height:20px !important">
								<a href="/listings" style="font-weight:700;" id="rotate"><img
								src="/static/client/icon_circle_dots.png" 
								style="height:24px; margin:-3px 2px 0;">flip$
									<i class="fa fa-angle-right" aria-hidden="true"></i></a>
							</div>
							<div class="clear"></div>	
							<div style="margin-top:8px; font-weight:300; font-size:12px; text-transform: none;">
								<i>*not 5M yet - we just liked the effect!</i>
							</div>
					</div>
					<!--<a href="/founding-members" title="Learn more">Become an Owner &raquo;</a>-->
				</div>
				<!--CrowdKode is 100% Community Owned.-->
				
				<!--PLUS, OUR COMMUNITY GETS TO VOTE ON WHICH TECH WE IMPROVE &amp; CREATE EACH MONTH-->
			</div>
			<!--Want to get a monthly share of profits + own part of a growing Tech company with a $5M+
			<a href="/ip" style="color:#00CE00;" title="Learn more">IP Portfolio</a>?
			We&rsquo;re giving 75% of the company&rsquo;s equity &amp; revenue to 5,000 new
			&ldquo;fractional&rdquo; partners.-->
		</div>
		<div class="clear"></div>
	</div>
	<div class="clear"></div>    
</div>
<div class="clear"></div> 
<!-- TOP PAGE CONTAINER ENDS -->

<!-- ################################################################ -->
<!-- ##################    SERVICE AREAS SECTION   ################## -->
<!-- ################################################################ -->

<div class="sbdivs" style="display:none; background:#fff; height:auto; width:100%; 
	overflow:hidden; position:relative; -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; box-sizing: border-box;">
	
	<a href="/members" style="display:block;">
	<div class="grid_4 serviceboxes" style="font-weight:500;">
		<!--OPEN A NEW SERVICE REQUEST<br />-->
		BROWSE MEMBER PROFILES<br />
		<small>Find, Connect + Synergize with Others</small>
	</div></a>

	<?php if ($_SESSION['loggedin']) { ?>
		<a href="/project/addnew" style="display:block;">
		<div class="grid_4 serviceboxes" style="font-weight:500;">
			<!--CO-FUND PROJECTS, JOBS &amp; HIRES<br />-->
			FIND HELP + SYNERGIES ANYWHERE<br />
			<small>With Our Collaborative Listings Tool</small>
			<!-- Share/Split Project or Worker Costs with Others -->
		</div></a>
	<?php } else { ?>
		<a href="/listings" style="display:block;">
		<div class="grid_4 serviceboxes" style="font-weight:500;">
			<!--CO-FUND PROJECTS, JOBS &amp; HIRES<br />-->
			FIND HELP + SYNERGIES ANYWHERE<br />
			<small>With Our Collaborative Listings Tool</small>
			<!-- Share/Split Project or Worker Costs with Others -->
		</div></a>
	<?php } ?>

	<a href="/listings" style="display:block;">
	<div class="grid_4 serviceboxes" style="font-weight:500;">
		<!--BID ON PROJECTS / APPLY TO JOBS<br />-->
		FIND PROJECTS, JOBS + MORE<br />
		<small>Bid on Projects - or - Apply to Jobs</small>
		<!-- FlipMob helps increase overall budgets -->
	</div></a>

	<a href="/managed-services" style="display:block;"><div class="grid_4 serviceboxes" style="display:none; 
	font-weight:500;">
		<!--OPEN A NEW SERVICE REQUEST<br />-->
		GET TECH SUPPORT<br />
		<small>Affordable, On-Demand Services + Support</small>
	</div></a>
	<!--	<a href="/shared-staff" style="display:block;"><div class="grid_3 serviceboxes" style="font-weight:500;">
	SHARE FRACTIONAL WORKERS<br />
	<small>Need Just 5-10 hrs/week? No problem.</small>
	</div></a>-->
	<div class="clear"></div>
</div>

<!-- ################################################################ -->
<!-- ##################   RECENT MEMBERS SECTION   ################## -->
<!-- ################################################################ -->

<div style="display:nonex; padding:35px 0 0; background:#fff; height:460px; width:100%; overflow:hidden; position:relative;">

	<div style="text-transform:uppercase; color:#bbb; font-size:28px; margin-bottom:5px; text-align:center;
		font-weight:600; font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif;">
		<a href="/members" style="color:#bbb;"><img src="/static/client/devshares_synergy_icon_black.png"
			style="height:40px; margin-top:-5px;" alt="<+>" /> RECENT MΞMBERS</a>
	</div>
	<br />
	<?php include 'views/includes/featuredmembers.tpl.php'; ?>
</div>

<!-- ################################################################ -->
<!-- ##################   RECENT MEMBERS SECTION   ################## -->
<!-- ################################################################ -->

<div style="padding:5px 0 30px; background:#fff; height:auto; width:100%; overflow:hidden; 
position:relative;">

<!-- ################################################################ -->
<!-- ##################        FEATURED MOB$       ################## -->
<!-- ################################################################ -->

	<div class="featcontainer" style="display:nonex; max-width:90%; min-height:350px;
		padding-bottom:0px; overflow:hidden; margin:0 auto 0px;">
		<?php include 'views/includes/featureddeals.tpl.php'; ?>
		<!--		<div style="width:20%; margin:5px; background:#fff; text-align:center; line-height:200px;">
		Featured Listing
		</div>-->
	</div>
	<div class="clear"></div>
	<div class="btn-reddish" style="width:70%; max-width:220px; margin:0 auto; 
		height:30px; margin-bottom:30px; text-align:center;">
		<a href="/category/all" title="Browse Opps" 
			style="font-weight:300; text-align:center; display:block;">Browse Opps</a>
	</div>
	<div class="featureddown" style="text-align:center; padding-bottom:15px;">
		<img src="/static/images/down_arrow.png" alt="scroll down" style="height:20px;" />
	</div>
	<div class="clear"></div>


	<center style="text-transform:uppercase; color:#bbb; font-size:14px; margin-bottom:5px;
		font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif;">
		RECENT MEMBERS:
	</center>
	<br />
	<?php include 'views/includes/recentmembers.tpl.php'; ?>
	<!--<div style="height:30px; width:35px; position:absolute; right:7px; top:60px; background:none; float:right">
		<a href="/members"><img src="static/images/icons/right_arrow_green.png" alt=">" 
		style="height:30px;" align="right" /></a>
	</div>-->
<!--	<br /><br />
	<hr style="border-bottom:2px solid #eee; max-width:200px; margin:10px auto 0;" />
	<br /><br />-->
</div>

<!-- ################################################################ -->
<!-- ####################   LONG WHITE SECTION   #################### -->
<!-- ################################################################ -->

<!--- THIS DIV GOES ALL THE WAY TO THE BOTTOM -->
<div style="background:none; width:100%; padding-top:0px; padding-bottom:0px; margin-top:0px;">
	
	<!-- GOES ALL THE WAY DOWN BELOW THE COOL DEVSHARES AREA -->
	<div style="background:#fff;">
	
		<!-- ################################################################ -->
		<!-- ####################   QUICK POST SECTION   #################### -->
		<!-- ################################################################ -->	
	
		<div style="font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana,sans-serif;
			font-size:20px; line-height: 32px; text-align: center; padding:10px 20px 0;">
			
			<h2 style="display:none; font-size:36px; line-height:46px; margin-top:0px; padding-top:0px;
				font-weight:600; font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana,sans-serif;">
				FLIP <span class="animate-charcter" 
					style="font-size:36px; line-height:46px;">ANYTHING</span> WITH OTHERS
					<!-- &#8457; &#x2109; ◎--> <!--DΞALSANYWHERE.-->
			</h2>
			
<!--			<?php if ($_SESSION['loggedin']) { ?>
				<div style="font-weight:500; color:#000; margin-bottom:10px;">
					Post what you <span style="font-weight:700;">need</span> done and if 
					others show <span style="font-weight:700;">interest</span> (in <a href="#cofunding" 
						class="loginpop" style="font-weight:700;"
					title="What is Co-Funding?">co-funding</a> with you),
					you&rsquo;ll receive a <span style="font-weight:700;">notification</span>.
				</div>
			<?php } else { ?>
				<div style="font-weight:500; color:#000; margin-bottom:10px;">
					<a href="#login" class="loginpop" style="font-weight:700;">Login</a> + post what you 
					<span style="font-weight:700;">need</span> done and if others 
					show <span style="font-weight:700;">interest</span> (in <a href="#cofunding" 
						class="loginpop" style="font-weight:700;"
					title="What is Co-Funding?">co-funding</a> with you), 
					you&rsquo;ll receive a <span style="font-weight:700;">notification</span>.
				</div>
			<?php } ?>-->
		
			<div class="clear"></div> 
		</div>
		<!-- QUICK POST SECTION ENDS HERE -->
	
	 	<div class="clear"></div> 
	 	
		<!-- ################################################################ -->
		<!-- ####################     RECENT LISTINGS    #################### -->
		<!-- ################################################################ -->
	 	
<!--		<div style="padding:0 15px;">
			<?php include 'views/includes/recent.tpl.php'; ?>
		</div>-->

<!--		<div class="btn-outline" style="max-width:250px; margin:0 auto;">
			<a href="/listings/quickmatch" class="" style="text-align:center; 
			font-weight:300;">View Quick-Ma+ches <i class="fa fa-angle-right" aria-hidden="true"></i></a>
		</div>
		<div class="clear"></div>
		<br />		-->
		
		<!--<hr style="border-top:2px solid #ccc; max-width:200px; margin:10px auto 0;" />-->
	 	
	 	<!--<hr class="custom" />-->
 	
	<style>
/*		svg {
			display: block;
			font: 10.5em 'Montserrat';
			width: 960px;
			height: 300px;
			margin: 0 auto;
		}*/

		.text-copy {
			fill: none;
			stroke: white;
			stroke-dasharray: 6% 29%;
			stroke-width: 5px;
			stroke-dashoffset: 0%;
			animation: stroke-offset 5.5s infinite linear;
		}

		.text-copy:nth-child(1){
			stroke: #F11303;
			animation-delay: -1;
		}

		.text-copy:nth-child(2){
			stroke: #F11303;
			animation-delay: -2s;
		}

		.text-copy:nth-child(3){
			stroke: #ffffff;
			animation-delay: -3s;
		}

		.text-copy:nth-child(4){
			stroke: #ff4048;
			animation-delay: -4s;
		}

		.text-copy:nth-child(5){
			stroke: #ffffff;
			animation-delay: -5s;
		}

		@keyframes stroke-offset{
			100% {
				stroke-dashoffset: -35%;
			}
		}
 	</style>
	 <!-- https://freefrontend.com/css-text-animations/page/4/ 
	 https://codepen.io/ClaireLarsen/pen/XmVyVX/ -->
	 <div style="width:100%; background:rgba(0,0,0,.8) url(static/client/teamwork.jpg) no-repeat; 
		 background-size:cover; background-position:center center; height:300px; display: flex; 
		 align-items: center;">
		 <div class="containerfluids" style="position:relative; text-align:center; background:none; 
			 margin:0 auto; display: flex; width:95%;">
		 	<svg viewBox="0 0 1160 300">
		 		<symbol id="s-text">
					 <text text-anchor="middle" x="50%" y="90%">FLIPMOB</text>
		 		</symbol>

		 		<g class="g-ants">
		 			<use xlink:href="#s-text" class="text-copy"></use>
		 			<use xlink:href="#s-text" class="text-copy"></use>
		 			<use xlink:href="#s-text" class="text-copy"></use>
		 			<use xlink:href="#s-text" class="text-copy"></use>
		 			<use xlink:href="#s-text" class="text-copy"></use>
		 		</g>
		 	</svg>
			 <!--<div class="brandingslogan" style="padding-top:75px; position:absolute; bottom:50px; background:none; 
				 height:30px; width:100%; color:#fff;
			 	font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana,sans-serif;">
				 FIND + MONETIZE DΞAL$ ANYWHERE.
		 	</div>-->
		 </div>
 	</div>
 	
	</div>	
	<!-- JUST BELOW THE COOL DEVSHARES AREA -->

<!-- ######################################################################## -->
<!-- ########################       WHITE AREA       ######################## -->
<!-- ######################################################################## -->
				
<!--- THIS DIV GOES ALL THE WAY TO THE BOTTOM -->
<div style="background:#fff; width:100%; padding-top:0px; padding-bottom:0px;">

	<div class="accordionhalfl" style="display:none; float:left; min-height:500px; background:#fff; overflow:hidden;">
		<div style="padding:0 15px;">
			<br />
			<h3 style="font-weight:300; font-size:28px; line-height:36px; text-align:center;
			margin-bottom:7px; margin-top:15px">
				Did you know these interesting facts?
			</h3>
			<br />
			<?php include 'views/includes/accordion.tpl.php'; ?>
		</div>
	</div>
	
	<div class="accordionhalfr" style="display:none; float:left; height:500px; background:none;">
		<br />

		<h3 style="font-weight:300; font-size:28px; line-height:36px; text-align:center;
		margin-bottom:7px; margin-top:15px">
			How FlipMob Works in <span style="color:#00cb00; font-weight:500;">60</span> seconds
		</h3>

		<div class="downArrow bounce">
			<img width="40" height="40" alt="" style="margin:0 auto;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiBoZWlnaHQ9IjMycHgiIGlkPSLQodC70L7QuV8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik0yNC4yODUsMTEuMjg0TDE2LDE5LjU3MWwtOC4yODUtOC4yODhjLTAuMzk1LTAuMzk1LTEuMDM0LTAuMzk1LTEuNDI5LDAgIGMtMC4zOTQsMC4zOTUtMC4zOTQsMS4wMzUsMCwxLjQzbDguOTk5LDkuMDAybDAsMGwwLDBjMC4zOTQsMC4zOTUsMS4wMzQsMC4zOTUsMS40MjgsMGw4Ljk5OS05LjAwMiAgYzAuMzk0LTAuMzk1LDAuMzk0LTEuMDM2LDAtMS40MzFDMjUuMzE5LDEwLjg4OSwyNC42NzksMTAuODg5LDI0LjI4NSwxMS4yODR6IiBmaWxsPSIjMTIxMzEzIiBpZD0iRXhwYW5kX01vcmUiLz48Zy8+PGcvPjxnLz48Zy8+PGcvPjxnLz48L3N2Zz4=" />
		</div>
		<div class="clear"></div>

		<div style="max-width:950px; max-height:350px; margin:0 auto; font-size:15px; color:#555; font-weight:300;
		text-align:center; overflow:hidden; padding:0 15px;">
			<!--  SUB TEXT WAS HERE -->

			<!-- ######################################################################## -->
			<!-- ########################       VIDEO PROMO      ######################## -->
			<!-- ######################################################################## -->

			<!-- CK VIDEO PROMO https://www.youtube.com/embed/p6jEgEKsoUE-->
			<!-- OFFICIAL DEV SHARES VIDEO PROMO: https://youtu.be/uPYB3F2QMIQ -->
			<!-- K-ROCK'S VIDEO: https://www.youtube.com/embed/8NPvZ-RyN60 -->
			<center>
				<div class="videoWrapper" style="text-align:center; max-width:560px; max-height:315px; overflow:hidden;">
					<iframe width="560" height="315" src="https://www.youtube.com/embed/uPYB3F2QMIQ"
				title="FlipMob Video Promo" frameborder="0"
	            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
				style="border:1px solid #ddd; padding:10px; -webkit-box-sizing: border-box;
				-moz-box-sizing: border-box; max-height:315px;
				box-sizing: border-box;" class="videoiframe"
	            allowfullscreen></iframe>
				</div>
			</center>

		</div>
		<br /><br />
	</div>

	<!-- ######################################################################## -->
	<!-- ########################        REFERRALS       ######################## -->
	<!-- ######################################################################## -->		
	<!-- 
	https://devshares.com//static/images/blurred_strip.png
	background: #444 url(/static/images/referralsbg.jpg) no-repeat center center; 
	-->
	<div style="width:100%; height:auto; padding:50px 20px 60px; margin-bottom:0px; font-size:20px;
		line-height:30px; color:#fff; background:#fff; background-size:cover;
		overflow:hidden; text-align:center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; 
		box-sizing: border-box; font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif;">
		
		<div id="referralsimg" class="blockithalf" style="text-align:center;">
			<img src="/static/client/referrals_pictorial.png" alt="Referrals" style="height:auto; width:100%;" />
		</div>
		
		<div class="blockithalf" style="text-align:left;">
			<center><img src="/static/images/icons/megaphone_white.png" alt="Refer" style="height:100px;" /></center>
			<br />
			<div class="referralstext" style="margin:0 auto; color:#000;">
				Earn cash for life when you <span style="font-weight:600;">refer</span> others to FlipMob.
				You&rsquo;ll earn commissions every single time they escrow and spend money to 
				join or host a flipmob.
				<!--Simply share any flip/opportunity using the Share Links or
				built-in referral links - and we&rsquo;ll pay you 25%+ commissions 
				on every flip your referrals buy-into for life.-->
				<br /><br />
				Join free now to create your own unique Referral Link/Code
				- <a href="/auth/join" style="font-weight:600;">Sign Up
					<i class="fa fa-angle-right" aria-hidden="true"></i></a>
				<br /><br />	
				<!--<div style="font-size:15px; line-height:23px">
					75% of FlipMob Equity/Ownership is going to its Members, so please tell
					everyone you know, because it&rsquo;s truly a platform made for the people. 
					<a href="https://flipmob.com/ownership">Learn more
						<i class="fa fa-angle-right" aria-hidden="true"></i></a>
				</div>-->
			</div>
		</div>
		
	</div>
	<div class="clear"></div>	
</div>  	

<!-- /* ########################################################################## */ -->
<!-- /*                             BG VIDEO SECTION                               */ -->
<!-- /* ########################################################################## */ -->

<div class="bg_video" style="">

	<div class="fullscreen-bg" style="display:nonex;">
		<!-- poster="static/images/bgmount2.jpg" -->
		<video preload="auto" playsinline autoplay muted volume="0" loop poster="static/video/vidbg.jpg"
		id="videobcg" class="fullscreen-bg__video">

			<source src="static/video/vid.mp4" type="video/mp4">
			<source src="static/video/vid.mp4" type="video/webm">Sorry, your browser does not support HTML5 video.
		</video>
		<p class="vidpar">
			<!--<span style="font-weight:600;"></span>-->
			<img src="/static/client/flipmob_vip.png" alt="FlipMob VIP"
			style="max-width:450px; width:95%; margin-bottom:15px;" /><!--<span 
				style="font-size:38px; color:#14E06E;">VIP</span>--><br />
		  
			  Pay one low monthly price to pay zero fees for unlimited flips + get
			  early access to high-return flips each month.
		  
		  <!--, <a href="/managed-services"
		  title="On-Demand Managed Services"><span class="devenhanced"
		 	style="font-family:Enhanced; color:#14E06E; font-weight:500">on-demand</span></a> 
		 	Tech Services. Starting at $4.99/mo. (paygo) - <a href="/managed-services" 
		 	title="On-Demand Managed Services">View All Managed 
		 	Services <i class="fa fa-angle-right" aria-hidden="true"></i></a>-->
		 	<br /><br />
		 	
			 <a href="#video" class="loginpop" rel="group1"
			style="font-weight:400;"><img src="/static/client/play_button.png"
			 	style="height:85px;" /></a>
		 	<!--Share/Split &nbsp;<span class="devenhanced" style="font-family:Enhanced; color:#14E06E; 
			font-weight:500">development</span> costs with others, get affordable On-demand Project 
			Management + QA Testing for all your projects at a 
			&nbsp;<span class="devenhanced" style="font-family:Enhanced; color:#14E06E;
			font-weight:500">discounted</span> rate.-->
				
			<!--AppWrapr was designed specifically to offer all the best mobile app-based features
			that websites don&rsquo;t have - like real-time
			messaging and chat, real-time GPS and geo-fencing, Rich Push Notifications, incredible fast
			loading speed, extremely easy accessibility and more.-->
			<br />
			
			<div class="" style="text-align:center; height:auto; font-size:17px; padding:0px;
			margin-bottom:0px; line-height:25px; text-align:left;">
				<br />
				<form id="subscribeform" class="" target="_self" action="/auth/subscribe" method="post" 
					style="max-width:900px; with:90%; margin:0 auto; text-align:center;">
	
					<div class="input_sub blockit" style="">
						<input id="subemail" name="subemail" placeholder="Your Email*" style="width:100%;
						background: none !important; color:#eee; font-size:17px; border:3px solid rgba(255,255,255,.3); 
						padding:15px; border-radius: 50px; -moz-border-radius:50px; -webkit-border-radius:50px;
						-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">				
					</div>
					<div class="input_sub blockit" style="">
						<input id="phone" name="phone" placeholder="Ph: ###-###-####" style="width:100%;
						background: none !important; color:#eee; font-size:17px; border:3px solid rgba(255,255,255,.3); 
						padding:15px; border-radius: 50px; -moz-border-radius:50px; -webkit-border-radius:50px;
						-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">
					</div>
					<div class="input_subb blockit" style="">
<!--						<div class="btn-black" style="">
							<a href="#rsvp" style="">RSVP
								<i class="fa fa-angle-right" aria-hidden="true"></i></a>
						</div>-->
						
						<input id="subscribe" type="submit" value="RSVP &rtrif;" class="btn-black"
						style="margin-top:8px !important; width:200px; display:inline; height:90px;
						border:3px solid rgba(255,255,255,.3);">
						
						<input type="hidden" id="interestedin" name="interestedin" placeholder="vip" value="vip">
					</div>
					
					<!--<input id="subscribe" type="submit" value="RSVP &rtrif;" class="btn-black" 
					style="margin-top:10px !important; width:200px; display:inline; height:55px; 
					border:3px solid rgba(255,255,255,.3);">-->
					<br /><br />
					<div style="color:#eee;">

						<span style="text-shadow:0px -1px 0px rgba(0,0,0,.4);">
						&nbsp;&nbsp;<span id="totalsubs"
						style="color:#00E21A; background:none; font-weight:300"><?= $total_subscribers ?></span>
						<span style="color:#eee;">reserved</span> -
						<span id="totalspots" style="font-weight:300; color:#00E21A;"><?= $total_spotsleft ?></span>
						spots left&nbsp;&nbsp;
							
						<span id="result" style="display:none; color:#00E21A; font-weight:300;">You&rsquo;re RSVP&rsquo;d. 
						We&rsquo;ll send you an email just before we launch the BETA version.</span>
					</span>
					</div>
				</form>

				<!--<center><a class="rounded2" href="/auth/join" style="font-weight:600;">Try it free &rsaquo;</a></center>-->
				<!--<center><a class="rounded2" href="/case-studies"
				style="font-weight:600;">View Case Studies <i class="fa fa-angle-right" aria-hidden="true"></i></a></center>	-->
			</div>
			
<!--			<br />
			<div class="btn-rounded" style="">
				<a href="/auth/register" style="" title="RSVP">RSVP &raquo;</a>
			</div>-->
		</p>
	</div>

</div>		
 	
<!-- ######################################################################## -->
<!-- ######################       SIGNUP SECTION       ###################### -->
<!-- ######################################################################## -->	

<!-- #1 FULL WIDTH CONTAINER STARTS HERE -->
<div style="width:100%; height:auto; background:#fff;">
	<br />
	<div style="padding:20px 15px 15px; text-align:center; font-size:25px; line-height:44px; font-weight:300; 
	text-align:center; margin: 0 auto; max-width:1250px">
		
		<!--We aren&rsquo;t just creating another passive community. We&rsquo;ve created very deliberate features that both
		<span style="font-weight:600; color:#00D315">quantify</span> <i>and</i> <span style="font-weight:600; color:#00D315">verify</span>
		our numbers and intent.--><!-- cool blue: color:#00D315 -->
		<!--A <span style="font-weight:600;">Community</span> with a 
		<span style="font-weight:600;">purpose</span> -
		<i>and</i> cool <span style="font-weight:600;">technology</span>. 
		Join now &amp; <span style="font-weight:600;">get paid</span> monthly.-->
		
		<!--FlipMob uses crowd-power, crowd-funding and secure, nearby gps to connect members who
		might want to share a deal together in order to unlock BOGO (buy-one-get-one) deals, 
		discount deals, bonus credit deals and any other deals where it might take one or more
		people to trigger bonus value of some kind.--> 
		
		<h2 style="font-size:36px; line-height:46px; margin-top:0px; padding-top:0px;
				font-weight:600; font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana,sans-serif;">
			GOT AN IDEA OR AN OPPORTUNITY YOU NEED HELP WITH?
			<span class="animate-charcter" style="font-size:36px; line-height:46px;">CREATE A MOB</span>, 
			THEN FLIP IT...
		</h2>
		
		<div style="">
			<?php include 'views/includes/quickform.tpl.php'; ?>
		</div>
		<div class="clear"></div>
		
		<div class="qmtextX" style="display:none;">

			<img src="/static/client/deals/presentation_man.png" alt="man" style="height:190px" />

			<img src="/static/client/deals/promo_codes.png" alt="promo code" style="height:100px" />

			<img src="/static/client/deals/lady.png" alt="lady" style="height:180px" />

			<img src="/static/client/deals/delivery_man.png" alt="delivery man" style="margin-left:50px;
			height:180px" />

			<img src="/static/client/deals/idea_girl.png" alt="girl with idea" style="height:200px" />

			<a href="#dealoppsoverview" class="loginpop" style="font-weight:400;"><img 
				src="/static/client/deals/how-it-works.png" alt="How it works" 
				style="max-width:40px; width:20%; margin-bottom:0px" /> How it works
				<i class="fa fa-angle-right" aria-hidden="true"></i></a> |

			<a href="/chat" style="font-weight:400;"><img src="/static/system/comment_icon.png"
				alt="Chat" style="max-width:35px; width:20%; margin-bottom:0px" /> Chat/Tips+Tricks
				<i class="fa fa-angle-right" aria-hidden="true"></i></a>

			<!--There are currently <strong>33M+ active small businesses</strong> in the US alone.
			<br /><br />
			80% of those are 1 person businesses. That&rsquo;s
			<strong>26M+ 1 person micro-businesses</strong> who could probably use a little more
			tech help or even a fractional employee.
			<br /><br />
			DevShares makes it easy to <span style="color:#00A1FE; font-weight:700">find + split creative
			and technology costs with others</span> who have similar needs - whether it&rsquo;s
			a project, an idea or a position you need to hire for.
			<br /><br />
			Post whatever you need (above) and how much you&rsquo;re willing to pay for it! -->

			<!--<br /><br /><br /><br />-->
		</div>
		<div class="clear"></div>
		<!--<br />
		Need another person to help take advantage of a deal? FlipMob uses secure, nearby gps to help
		connect members, so they can unlock the many bonus perks offered by various deals. <a href="/how-it-works" 
			class="" title="How It Works" style="font-weight:400;">Learn more
			<i class="fa fa-angle-right" aria-hidden="true"></i></a>-->
		
		<!--Crowd-fund the <span style="font-family:Enhanced; font-size:35px; color:#00d803; 
		font-weight:600">Dev+Creative</span> help
		you need - and save <span style="font-family:Enhanced; font-size:35px; 
			color:#00d803; font-weight:600">thousands</span>. With FlipMob, there&rsquo;s no expert or
			specialist in the world you can&rsquo;t afford.-->
		
		<!--<span class="supercharge">Super-charge</span> your business!-->
		<!--There&rsquo;s <span style="font-weight:600; color:#00D315">power</span> in 
		<span style="font-weight:600;">numbers</span>. -->
		<!--<span style="font-size:15px; color:#dd1000; font-weight:600;">Call us at -->
		<!--1 (844) THINAPP  (1-844-844-6277) &bull; 312-857-3511 (local) or 
		    email us at <a href="mailto:contact@getpreorder.com">contact@getpreorder.com</a></span>-->
	</div>
	<div class="clear"></div>
	<br />
	<div class="rounded2" style="text-align:center; height:auto; font-size:17px; padding:0px; margin-bottom:0px; 
	line-height:25px; text-align:left;">
		<center>
			<a class="rounded2" href="/auth/join" style="font-weight:600;">Join free now &rsaquo;</a>
		</center>	
	</div>	
	<div class="clear"></div>
	<br /><br />
	<!--<br />
	<center><a href="/auth/register" style="font-size:15px;" class="browse">Or, Join free 
	<i class="fa fa-angle-right" aria-hidden="true"></i></a></center>-->
	
<!--	<br /><br /><br />
	
	<div style="padding:20px 15px 15px; text-align:center; font-size:22px; line-height:30px; font-weight:300;
	text-align:center; margin: 0 auto; max-width:1050px">
		Connect with others, to hack <span style="font-weight:600">any deal</span>, for any brand, promotion or offer
		<span style="font-weight:600">anywhere</span>.
	</div>-->

	<div style="display:none; text-align:center; padding:0;">
		<img src="/static/client/logos/square.png" alt="Square"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/stripe.png" alt="Stripe"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/ionic.png" alt="Ionic"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/react.png" alt="React"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/aws.png" alt="AWS"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/godaddy.png" alt="GoDaddy"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/github.png" alt="GitHub"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
		
		<img src="/static/client/logos/wordpress.png" alt="Wordpress"
		style="max-width:150px; width:25%; margin-bottom:10px;" />
	</div>
	<br />
	
<!--	<br /><br /><br />
	<div class="lightgraylink" style="text-align: center; font-size:15px;">
		<center><img src="/static/images/square/square-logo-black.png" alt="Official Square Partner"
			style="max-width:220px; width:70%; margin-bottom:10px;" />
			<h2 style="text-transform:uppercase; font-size:13px; font-weight:800; letter-spacing:2px; color:#279bd1; margin-top:0px">
				Official Square Partner
			</h2>
		</center> 
	</div>
	<div class="clear"></div>
	<br />-->
	
	<!--
	<br /><br />
	<hr style="height:1px; margin-bottom:15px;" />-->
    <!--<center style="color:#333; font-size:16px; line-height:22px; padding:0 22px;">  
    <a href="/how-it-works" 
    style="font-weight:400;"><i class="fa fa-info-circle"></i> How It Works <i class="fa fa-angle-right" aria-hidden="true"></i></a> &nbsp; 
    <a href="#video" class="loginpop" rel="group1" 
    style="font-weight:400;">Watch the video (41s) <i class="fa fa-play-circle"></i></a>
    <!-- It can be used out of the box or quickly customized to match even the most complex ideas and needs. -->
    <!--</center>	-->
		 
	<div class="mobileh1" style="display:none; font-weight:200; font-family: 'Open Sans',sans-serif; margin:0px; 
	font-size:28px; padding:0 20px 5px; text-align:center; line-height:36px; margin-top:25px">		
		<img src="/static/images/guarantee.png" alt="Guarantee" class="guarimg" style="height:auto;" 
		width="50" height="50" />
		Want to speak with someone about your idea or project? We&rsquo;d love to hear from you. <a href="tel:1-312-857-3511" 
		style="color:#0072C4; text-shadow:0px 0px 0px">1-312-857-3511</a> or contact@getpreorder.com
	</div>
	<!-- <div class="clear"></div> -->	
</div>
<div class="clear"></div>   
<!-- PAGE CONTAINER END -->

    <!-- ######################################################################## -->
    <!-- ######################       BOTTOM SECTION       ###################### -->
    <!-- ######################################################################## -->
    
    <!-- Bluish Color 2996cc -->
    <!-- video_section_bg -->    
	<div style="background:#000 url(static/client/ipbg.jpg) no-repeat; background-size:cover; color:#fff;
	 text-align:center;">
        
        <div class="darklinks" style="background:rgba(0,0,0,0); color:#fff; text-align:center; padding:20px;">           
        	<br />
            <h2 class="mission" style="font-weight:400; margin-bottom:15px; padding-bottom:5px;
				font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif;">
				MAKE MONEY FLIPPING WITH OTHΞRS
				<!--<span style="color:#00D315; font-weight:400">57</span> SECONDS-->
            </h2>
			
			<div style="font-size:20px; color:#ddd; max-width:900px; margin:0 auto; line-height:29px;
			font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif;">
			 
			 	It takes money to make money - FlipMob helps regular, everyday people
			 	connect and combine their efforts + money to achieve almost any goal.
			 	
			</div>
			<!--<span style="font-size:17px;">$25 ONE-TIME PAYMENT + $25/MO. - <a href="https://ssuplans.square.site/" title="Click here to join now">JOIN NOW &rsaquo;</a></span>-->
            <br /><br />  
            
			<center>Apps Coming Soon</center>
            <br />
            
			<a href="#" target="_blank"><img 
				src="/static/images/btn_app_store.png" alt="Download FlipMob on the App Store" 
				style="max-width:210px; width:40%; margin:5px 7px 5px; border:1px solid #555; border-radius:8px;
				-moz-border-radius:8px; -webkit-border-radius:8px; box-shadow: 0 3px 10px rgb(0 0 0 / 30%);"></a>
			
			<a href="#" target="_blank"><img 
			src="/static/images/btn_app_store.png" alt="Download FlipMob on Google Play" 
			style="max-width:210px; width:40%; margin:5px 7px 5px; border:1px solid #555; border-radius:8px;
			-moz-border-radius:8px; -webkit-border-radius:8px; box-shadow: 0 3px 10px rgb(0 0 0 / 30%);"></a>
            
			<!--<a href="#video" class="loginpop" rel="group1"
			style="font-weight:400;"><img src="/static/client/play_button.png" 
            style="height:85px;" /></a>-->
            <br /><br /><br />
			<div style="font-size:20px; line-height:30px; 
			font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif;"><a 
				href="/auth/join" class="neongreen">Join free now</a> to create your mob and post a opportunity
				<i class="fa fa-angle-right" aria-hidden="true"></i>
			</div>  
			<br /><br />
			
			<div class="socialmedia" style="padding:5px;">
				<a href="https://www.facebook.com/flipmobs" class="socialmediaicon">
					<i class="fa fa-facebook-f"></i></a>
				<a href="https://twitter.com/flipmobs" class="socialmediaicon">
					<i class="fa fa-twitter"></i></a>
					<a href="https://www.linkedin.com/company/flipmobs" class="socialmediaicon">
					<i class="fa fa-linkedin"></i></a>
					<a href="https://instagram.com/flipmobs" class="socialmediaicon">
					<i class="fa fa-instagram"></i></a>
				<a href="mailto:contact@flipmob.com?subject=FlipMob.com Inquiry" class="socialmediaicon">
					<i class="fa fa-envelope"></i></a>
			</div>
			
<!--			<i class="fa fa-facebook" aria-hidden="true"></i>
			
			<i class="fa fa-instagram" aria-hidden="true"></i>-->
			
			<br /><br />
        </div>
        <div class="clear"></div>
    </div>
    
	<!-- ################################################################## -->
	<!-- ##################    MORE DIV AREA AT BOTTOM   ################## -->
	<!-- ################################################################## -->
    
    <!--<div class="morearrow" style="">
		<span class="more" style="color:#ccc; font-weight:300;"><i class="fa fa-chevron-up" 
		aria-hidden="true"></i></span>
		<span class="more" style="color:#ccc; font-weight:300;"><i class="fa fa-chevron-down" 
		aria-hidden="true"></i></span>
	</div>-->
<!--	display:none; position:fixed; left:0; bottom:0; z-index:9999999999999999; font-size:18px;
	line-height:22px; border-top:1px solid #417bff; width:100%;
	background:rgba(0,0,0,.80); color:#aaa; vertical-align: middle;
	text-shadow:0px -1px 0px rgba(0,0,0,.4); padding:8px 0 12px; min-height:50px; text-align:center;-->
    
	<div id="moredivarea" class="moredivxx" style="display:none; 
	position:fixed; left:0; bottom:0; z-index:9999999999999999; font-size:18px;
	line-height:22px; border-top:1px solid #417bff; width:100%;
	background:rgba(0,0,0,.80); color:#aaa; vertical-align: middle;
	text-shadow:0px -1px 0px rgba(0,0,0,.4); padding:6px 0 10px; min-height:50px; text-align:center;">

		<div style="position:relative; height:50px; max-width:330px; margin:0 auto;
			background:none; vertical-align: middle; background:none;">

			<div style="float:left; margin:2px 0px 0 0px; display: table; height:50px;
					text-align:left; font-weight:500; color:#fff; padding:0 7px 0px 10px;">

					<span style="display: inline-block; display: table-cell; font-size:14px;
					vertical-align: middle; line-height: normal;">Get 250 Equity Shares free</span>

			</div>
			<div style="position:absolute; right:0; bottom:0; float:right; margin-right:10px">
				<?php if ($_SESSION['loggedin']) { ?>
				<a class="btn-o" href="/founding" style="margin-bottom:4px; color:#fff; text-align:center; 
				max-width:90px; padding: 5px 15px;"
					title="Get 250 Equity Shares">Learn more &rsaquo;</a>
				<?php } else { ?>
				<a class="btn-o" href="/auth/join" style="margin-bottom:4px; color:#fff; text-align:center; 
				max-width:90px; padding: 5px 15px;" title="Sign up free now and get complimentary 
				Equity Shares in FlipMob">Sign up free &rsaquo;</a>
				<?php } ?>
			</div>

		</div>

	</div>
    
    <!-- ################################################################## -->
    <!-- ################################################################## -->
    <!-- ################################################################## -->    

<?php include 'views/_footer.tpl.php'; ?>

	<!-- ################################################################## -->
	<!-- ################################################################## -->
	<!-- ################################################################## -->


<script type="text/javascript" defer>
  var href = $(this).attr("action");
$(function() {
	$('#gallery a').lightBox();
});  
</script>

<script type="text/javascript">
$(document).ready(function(){
	
	$("#loginfirst,#pleaselogin").click(function() {
		// $("#entercode").keyup(function(e){
		//$("#apply-ref").click(function(e){
		alert('Please login to post a new listing...');
	}); 
    
    /* Refresh the page */
    setTimeout(function(){
       getSubscribers();
     },7000); // milliseconds   
     
    $('#subscribeform').submit(function (e) {
        e.preventDefault();
        var subemail = $('#subemail').val().toLowerCase(); 
        var frm = this;
        $.ajax({
            type: 'POST',
            url: '/auth/checkEmail',
            data: {
                subemail: subemail
            },
            success: function (result) {
                //alert(subemail);
                //alert(result);
                if (result == 0) {
                    //$('#subscribeform').submit();
                    submitForm();
                } else {
                    alert('The e-mail address entered is not valid or has already been registered.');
                }           
            }
        });
    });  
    
    function submitForm(){
        // Initiate Variables With Form Content
        var email = $("#subemail").val().toLowerCase(); 
        var interestedin = $("#interestedin").val();
        
        $.ajax({
            type: "POST",
            url: "/auth/subscribe",
            //data: "email=" + email,
            //data: "data1="+myindex+"&data2="+selValue,
            data: { email: email, interestedin: interestedin },
            success : function(result){
                $("#result").show();
                $("#totalsubs").load(" #totalsubs");
                $("#totalspots").load(" #totalspots");
                $("#subemail").val("");
            }
        });
    }
    
    function getSubscriberz() { 
        $.ajax({        
          url: "/plans/checkCount",
          type: "POST",
          data: data,
          success: function(d) {    
            if (d) {    
              var result = $.parseJSON(d);
              var referrer = result.referrer;
              //alert(d); 
              $("#totalsubs").html(d);
              $("#totalsubs").css("background", "#29CE29");
              $("#reserr").hide();        
              $("#result").show();
              $("#referrer_id").val(d);
              //alert(d);
            } else {
              $("#entercode").css("background", "#ff0000");
              $("#result").hide();
              $("#reserr").show();
            } 
            //return false;
          },
          error: console.log("it did not work"),
        });
    }
    
    // QUICK POST FORM VALIDATION 
	$("#quickpost").click(function(e) {
		//		if (! $("#check_terms").is(":checked")) {
		//			e.preventDefault();
		//			var confirm_box = confirm('You must check the Terms checkbox.');
		//			return false;
		//		}

		if (! $("#quicktitle").val().length) {
			e.preventDefault();
			alert('You must enter Feature Title/Name.');
			return false;
		}

		if (! $("#quickcat").val().length) {
			e.preventDefault();
			alert('You must choose a Category/Type.');
			return false;
		}
		
		if (! $("#budget").val().length) {
			e.preventDefault();
			alert('You must enter a rough budget.');
			return false;
		}

//		if (! $("#descrip").val().length) {
//			e.preventDefault();
//			alert('You must enter quick, simple description.');
//			return false;
//		}

		return true;
	});
	
	// SCROLL CODE
	$(window).scroll(function(e) {
		var $el = $('.newhdrlogo');

		var standalone = window.navigator.standalone,
		userAgent = window.navigator.userAgent.toLowerCase(),
		safari = /safari/.test( userAgent ),
		ios = /iphone|ipod|ipad/.test( userAgent );

		if ($(this).scrollTop() > 60) {
			if ($(window).width() >= 1025 || $(window).width() <= 586) {
				$el.css({'display': 'inline-block'});
			}
		} else {
			$el.css({'display': 'none'});
		}

	});
	// SCROLL CODE ENDS 
	     
});
</script>

<!-- ################################################# -->
<!-- ###########  LIGHT BOXES START HERE   ########### -->
<!-- ################################################# -->

<!-- 1. YOU - the 99% -->
<div style="display:none;">
	<div id="you99" style="max-width:560px;">
		<div class="overlay-bl-bg"></div>
		<div class="container_6 pop-contentXXXX" style="background:none !important;">
			<div class="" style="background:none !important;">
				<div class="formXXX login-formXXX">
					<!-- CONTENT CONTAINER STARTS HERE -->
					<div class="box-white" style="border:0px; max-height:300px;
					height:auto; padding:0px; background:none !important; margin-top:-30px !important;">
						
						<div style="background:#fff; float:left; padding:25px; color:#444; font-size:16px; font-weight:300;
						text-align:left; font-family: Montserrat,'Open Sans',sans-serif;
						font-weight:normal; line-height:24px;">
							
							<h2 style="text-align:center; margin:0 auto 10px; line-height:25px; font-size:17px;
								font-family: Montserrat,'Open Sans',sans-serif; font-weight:700; max-width:450px;">
								<!--If you aren&rsquo;t part of the 1%, then FlipMob was made for YOU-->
								FlipMob helps you find, create, unlock + monetize valuable synergies 
								<i>anywhere</i> on earth
							</h2>
							FlipMob is an online platform that features real, immediate, collaborative
							features and tools that help both people <i>and</i> businesses everywhere find
							and creative partner-like synergies.
							<br /><br />
							- from co-funding technology projects, to sharing the costs of new hires and 
							contractors to co-funding the creation of new business ventures and opportunities.
							<span style="font-weight:600;">Our goal is to help people and businesses create 
							and generate new revenue streams by working together - and co-funding together.</span>
							
							<!--There are 33M+ small businesses in the US &amp; 334M+ globally that 
							create half the jobs in both America - and the world.
							If we simply worked together smarter, there&rsquo;s almost nothing
							we could accomplish. 
							<br /><br />
							FlipMob features simple, well-thought out tools,
							features + services that help you find + create synergies with others - 
							from splitting/sharing project costs - like making a new website or app
							to sharing the cost of a new employee/worker.-->
								
							<!--No matter who you are - business owner, entrepreneur, hobbyist, 
							side gigger, etc. <span style="font-weight:500;">if <i>you</i> could get 
								<i>any</i> type of technology made</span> or support or part-time employees for a 
							<span style="font-weight:500;">fraction of the cost</span> - 
							simply by connecting with others who are just like you - or have similar needs. 
							<span style="font-weight:500;">Imagine what <i>you</i> could do - and how much you 
							could grow <i>whatever</i> you&rsquo;re doing.</span>
							<br /><br />
							FlipMob is simply a smarter way of synergizing with others to pay for 
							the type of tech, support and help that big companies have no problem
							shelling out millions for.-->
						</div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
	</div>
</div>
</div>


<!-- 2. VIDEO -->
<div style="display:none;">
<div id="video" style="max-width:560px;"> 
    <div class="overlay-bl-bg"></div>
    <div class="container_6 pop-contentXXXX" style="background:none !important;">
        <div class="" style="background:none !important;">
            <div class="formXXX login-formXXX">                    
                    <!-- CONTENT CONTAINER STARTS HERE -->
                    <div class="box-whitexxx" style="border:0px; max-height:315px; height:auto; padding:0px;">
                    	<div class="iframevid" style="background:none; padding:0px; color:#222; font-size:15px;
							text-align:left; font-family: 'Open Sans',sans-serif; font-weight:normal; line-height:22px;">						<!-- https://youtu.be/8NPvZ-RyN60 -->
							<div class="videoWrapper">
							 	<iframe width="560" height="315" 
									 src="https://www.youtube-nocookie.com/embed/8NPvZ-RyN60?rel=0&amp;showinfo=0" 
                            	frameborder="0" allowfullscreen></iframe>
                            	<!-- VIMEO EXAMPLE -->
							    <!-- <iframe width="560" height="315" 
							    src="https://player.vimeo.com/video/281583099?title=1&byline=1&portrait=0&color=39b54a" 
                            	frameborder="0" allowfullscreen></iframe>-->
							</div>
                        </div>
                    </div>
            </div>
        </div>
    </div>
</div>
</div>

<!-- 3. VIDEO APP LAUNCH VIDEO -->
<div style="display:none;">
<div id="videograze" style="max-width:560px;">
    <div class="overlay-bl-bg"></div>
    <div class="container_6 pop-contentXXXX" style="background:none !important;">
        <div class="" style="background:none !important;">
            <div class="formXXX login-formXXX">                    
                    <!-- CONTENT CONTAINER STARTS HERE -->
                    <div class="box-whitexxx" style="border:0px; max-height:315px; height:auto; padding:0px;">
                        <div class="iframevid" style="background:none; padding:0px; color:#222; font-size:15px;
                            text-align:left; font-family: 'Open Sans',sans-serif; font-weight:normal; line-height:22px;">                   
                            <div class="videoWrapper">
                                <!--<iframe width="560" height="315" src="https://player.vimeo.com/video/281583099?title=1&byline=1&portrait=0&color=39b54a" 
                            frameborder="0" allowfullscreen></iframe>-->
                               <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/p6jEgEKsoUE?rel=0&amp;showinfo=0" 
                            frameborder="0" allowfullscreen></iframe>
                            </div>
                        </div>
                    </div>
            </div>
        </div>
    </div>
</div>
</div>

<!-- 5. SAVE -->
<div style="display:none;">
	<div id="save" style="max-width:560px;">
		<div class="overlay-bl-bg"></div>
		<div class="container_6 pop-contentXXXX" style="background:none !important;">
			<div class="" style="background:none !important;">
				<div class="formXXX login-formXXX">
					<!-- CONTENT CONTAINER STARTS HERE -->
					<div class="box-white" style="border:0px; max-height:300px;
					height:auto; padding:0px; background:none !important; margin-top:-30px !important;">
						
						<div style="background:#fff; float:left; padding:25px; color:#444; font-size:16px; font-weight:300;
						text-align:left; font-family: Montserrat,'Open Sans',sans-serif;
						font-weight:normal; line-height:24px;">
							
							<h2 style="text-align:center; margin:0 auto 10px; line-height:25px; font-size:17px;
								font-family: Montserrat,'Open Sans',sans-serif; font-weight:700; max-width:400px;">
								<!--If you aren&rsquo;t part of the 1%, then FlipMob was made for YOU-->
								FlipMob Helps You Earn &amp; Save 10-50%
							</h2>
							
							Every day we all get bombarded with deals, promos, offers &amp; more,
							which amount to billions of dollars in unrealized value.

							<br /><br />

							FlipMob helps connect people looking to buy, sell or split those
							opportunities (and more), turning (ie. flipping) them into instant
							savings <i>and</i> profits.
							
							<br />

							<!--No matter who you are - business owner, entrepreneur, hobbyist, 
							side gigger, etc. <span style="font-weight:500;">if <i>you</i> could get 
								<i>any</i> type of technology made</span> or support or part-time employees for a 
							<span style="font-weight:500;">fraction of the cost</span> - 
							simply by connecting with others who are just like you - or have similar needs. 
							<span style="font-weight:500;">Imagine what <i>you</i> could do - and how much you 
							could grow <i>whatever</i> you&rsquo;re doing.</span>
							<br /><br />
							FlipMob is simply a smarter way of synergizing with others to pay for 
							the type of tech, support and help that big companies have no problem
							shelling out millions for.-->
						</div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
	</div>
</div>
</div>

<!-- #################################################### -->
<!-- ###############  SCRIPTS START HERE  ###############  -->
<!-- #################################################### -->

 <script type="text/javascript">
$(document).ready(function() {  
	//$(".more").click(function () {
		//$(".morediv").slideToggle(500);
		//$('.morediv').toggle();
//		$('.morediv').slideToggle({
//			direction: "down"
//		}, 300);
	//});	 
	
	$('#chevron_ppp').click(function () {
		alert('Clicked');
		//$("#chevron_pp").toggleClass('fa-chevron-down fa-chevron-down open');
		//$("#pp_inputs").toggle();
	});
	
	$('.morearrow').click(function () {
		//$("#p9a").toggleClass('fa-chevron-down fa-chevron-down open');
		$('#moredivarea').slideToggle({
			direction: "up"
		}, 500);
	});
    // NEW TEXT FEATURE    
    var TxtRotate = function(el, toRotate, period) {
      this.toRotate = toRotate;
      this.el = el;
      this.loopNum = 0;
      this.period = parseInt(period, 10) || 250;
      this.txt = '';
      this.tick();
      this.isDeleting = false;
    };
    
    TxtRotate.prototype.tick = function() {
      var i = this.loopNum % this.toRotate.length;
      var fullTxt = this.toRotate[i];
    
      if (this.isDeleting) {
        this.txt = fullTxt.substring(0, this.txt.length - 1);
      } else {
        this.txt = fullTxt.substring(0, this.txt.length + 1);
      }
    
      this.el.innerHTML = '<span class="wrap">'+this.txt+'</span>';
    
      var that = this;
      var delta = 200 - Math.random() * 100;
    
      if (this.isDeleting) { delta /= 2; }
    
      if (!this.isDeleting && this.txt === fullTxt) {
        delta = this.period;
        this.isDeleting = true;
      } else if (this.isDeleting && this.txt === '') {
        this.isDeleting = false;
        this.loopNum++;
        delta = 100;
      }
    
      setTimeout(function() {
        that.tick();
      }, delta);
    };
    
    window.onload = function() {
      var elements = document.getElementsByClassName('txt-rotate');
      for (var i=0; i<elements.length; i++) {
        var toRotate = elements[i].getAttribute('data-rotate');
        var period = elements[i].getAttribute('data-period');
        if (toRotate) {
          new TxtRotate(elements[i], JSON.parse(toRotate), period);
        }
      }
      // INJECT CSS
      var css = document.createElement("style");
      css.type = "text/css";
      css.innerHTML = ".txt-rotate > .wrap { border-right: 0.08em solid #666 }";
      document.body.appendChild(css);
    };
    
    
    // AUTO-TYPE FEATURE      
     function autoType(elementClass, typingSpeed){
      var thhis = $(elementClass);
      thhis.css({
        "position": "relative",
        "display": "block",
        "text-align": "center"
      });
      thhis.prepend('<div class="cursor" style="right: initial; text-align:center !important;"></div>');
      thhis = thhis.find(".text-js");
      var text = thhis.text().trim().split('');
      var amntOfChars = text.length;
      var newString = "";
      thhis.text("|");
      setTimeout(function(){
        thhis.css("opacity",1);
        thhis.prev().removeAttr("style");
        thhis.text("");
        for(var i = 0; i < amntOfChars; i++){
          (function(i,char){
            setTimeout(function() {        
              newString += char;
              thhis.text(newString);
            },i*typingSpeed);
          })(i+1,text[i]);
        }
      },200);
    }         
          
    // THIS IS FOR THE CURSOR AUTO-TYPING FEATURE
    autoType(".type-js",50);
    
	/////////////////////////////////

//	$('#chevron_pp').click(function () {
//		$("#chevron_pp").toggleClass('fa-chevron-down fa-chevron-down open');
//		$("#pp_inputs").toggle();
//	});

//	$('#chevron_pp2').click(function () {
//		$("#chevron_pp2").toggleClass('fa-chevron-down fa-chevron-down open');
//		$("#pp_inputs2").toggle();
//		//$(".giveawayinputs").toggle();
//	});  
});
// DOCUMENT READY ENDS 	
</script>

 <script type="text/javascript" defer>
    // COUNTER FUNCTION  
    $({ Counter: 0 }).animate({
      Counter: $('.animatednumber').text()
    }, {
      duration: 7000,
      easing: 'swing',
      step: function() {
        $('.animatednumber').text(commaSeparateNumber(Math.ceil(this.Counter)));
      }
    });
    
    // COMMA SEPARATED FUNCTION
    function commaSeparateNumber(val){
        while (/(\d+)(\d{3})/.test(val.toString())){
          val = val.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
        }
        return val;
    }  
    
    // EMAIL AND PHONE VALIDATION 
//	function validateEmail($email){
//		var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
//		return emailReg.test( $email );
//	}	
	
	function validateEmail($email){
		var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
		return emailReg.test( $email );
	}	
	
	function checkEmail(){
		var email = $("#email").val();
		//alert('Email: ' + email);
		if ( !validateEmail(email)) {
			alert(email + ' does not appear to be a valid Email Address. Please double-check it...');
			return false;
		} else {
			if (/\.(com|net)\/?$/i.test(email)) {
				//alert('Email entered: ' + email);
			} else {
				alert('FYI - Your email did not end in .com. If your email is correct, ignore this message.');
			}
		}
	}		
	
	// SIMPLER PHONE FORMATTING // USE maxlength="12" in the input tag
	$('#phone').keydown(function(e){
	             var key = e.charCode || e.keyCode || 0;
	             $text = $(this); 
	             if (key !== 8 && key !== 9) {
	                 if ($text.val().length === 3) {
	                     $text.val($text.val() + '-');
	                 }
	                 if ($text.val().length === 7) {
	                     $text.val($text.val() + '-');
	                 }
	             }
	             return (key == 8 || key == 9 || key == 46 || (key >= 48 && key <= 57) || (key >= 96 && key <= 105));
	});

	// FORMAT PHONE NUMBERS
	function formatPhoneNumber() {
	  	var phone = $("#phone").val();
		var cleaned = ('' + phone).replace(/\D/g, ''); // 3125551234
		//alert(cleaned.length);

		if(cleaned.length < 10) {
	        alert('Looks like you entered ' + cleaned.length + ' digits, instead of 10. Please enter your phone number like ###-###-####');
	    } 
		return null;
	}    
</script>

<?php if($_SESSION['loggedin']) : ?>

	<?php if ($website_options['enable_homepage_nearby']) : ?>
	    <script src='/static/js/googlemaps/getlocation-noconflict.js'></script>
	<?php else : ?>
	    <script src='/static/js/googlemaps/getlocation.js'></script>
	<?php endif; ?>

<?php endif; ?>