<?php
// Last updated 07/03/2024 11:03am - fixing social share banner + App Icon and App Store button
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: #00A1FE;
	text-shadow: none;
	} /* was 0072C4 Neon Green: 14E06E */
	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: #00b9ff;
	} /** 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.scrollertext {
		font-size: 28px;
		line-height: 36px;
	}
	h1.mission {
		display: none;
		font-size: 24px;
		line-height: 32px;
		font-weight: 600;
	}
	h1.animate-charcter, h2.mission {
		font-weight: 400;
		font-size: 32px;
		line-height: 38px;
	}
	.mainslogan, .mainslogan .animate-charcter {
		font-size: 35px;
		line-height: 47px;
		font-weight: 600;
	}
	.mainslogan a, .mainslogan a:link, .mainslogan a:active, .mainslogan a:visited {
		color: #bbb;
	}
	.mainslogan a:hover {
		color: #559af0;
	}
	.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; }*/
	.animate-charcter {
		font-size: 22px;
		line-height: 32px;
	}
	.maintagline {
		font-size:32px; 
		line-height:40px;
	}
	::-webkit-scrollbar {
		/*width: 12px; */              /* width of the entire scrollbar */
		background: #333 !important;
	}

	::-webkit-scrollbar-track {
		background: #333 !important;        /* color of the tracking area */
	}

	::-webkit-scrollbar-thumb {
		background-color: #000 !important;    /* color of the scroll thumb */
		border-radius: 20px;       /* roundness of the scroll thumb */
		border: 3px solid #333 !important;  /* creates padding around scroll thumb */
	}

	::-webkit-scrollbar:horizontal{
		height: 8px;
		background-color: #000 !important;
	}
	::-webkit-scrollbar-thumb:horizontal{
		background: #000 !important;
		border-radius: 10px;
	}
	/* ######################## */
	/* ### 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;
	}
	h2.referralheader {
		font-size: 48px;
		line-height: 58px;
		text-align: center;
		margin: 0 auto 20px;
	}
	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: 0px;
		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: 300px;
		background: rgba(0,0,0,.77);
		background-size: cover;
		height: 300px;
		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: #00355B;
		border: 5px solid #005aa8;
		font-size: 17px;
		height: 27px;
		min-width: 150px;
		line-height: 27px;
		color: #fff;
		padding: 10px 15px;
		box-shadow: 0 3px 10px rgb(0 0 0 / 40%);
	}
	.btn-reddish a {
		font-size: 17px;
		color: #fff;
	}
	.btn-reddish:hover {
		background: #004479;
		border: 5px solid #0074d4;
		/*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: rgba(40,176,255,.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;*/
		background: rgba(40,176,255,.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: #80d6fc; /** neon green 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-charcters {
		background-image: linear-gradient(
		-225deg,
		#43a5cf 0%,
		#9DFFF8 29%,
		#4BB2FF 67%,
		#73f3ff 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;
	}

	.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);
	}

	.quotes {
		display: none;
	}

	/*	.calculator input {
	padding: 10px;
	height: 30px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	border: 1px solid #aaa;
	} */
	input.calc {
		background: #fff;
		font-size: 17px;
		margin-bottom: 10px;
		padding: 10px;
		border: 1px solid #eee;
		border-radius: 6px;
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px;
		width: 98%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	.vcenter {
		height: 400px;
		position: relative;
		/*background:yellow;*/
	}

	.vcenter p {
		font-size: 22px;
	line-height: 30px;
		margin: 0;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.vcentermobile {
		display: none;
	}
	.calcdiv {
		padding: 35px 0px 10px;
	}

	.services {
		color: #222;
	}
	.services:hover {
		/*background:#c2eaff;*/
	}

	/*	.services:hover {
	background:rgba(0,0,0,.5);
	}	*/

	.overlay {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: 100%;
		width: 100%;
		opacity: 0;
		transition: .5s ease;
		background-color: rgba(0,0,0,.85); /* was 008CBA */
	}

	/*a.thumb-imgxx:hover .overlay*/
	.services .overlay:hover {
		opacity: 1 !important;
	}
	.text h3 {
		font-size: 28px;
		line-height: 38px;
		font-family: Montserrat, 'Open Sans', Verdana, sans-serif;
	}
	.text p {
		font-size: 17px;
		line-height: 23px;
	}
	.text {
		position: relative;
		padding: 25px;
		text-align: left;
		color: #fff;
		font-size: 17px;
		line-height: 25px;
		font-family: 'Open Sans', Montserrat, sans-serif;
		font-weight: 300;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		text-align: center;
	}

	.fms {
		font-size: 14px;
		line-height: 24px;
		font-weight: 500;
	}
	.bottomrotator {
		height: 38px;
	}

	.scroll-text {
	  width: 800px;
	  height: 1.5em;
	  line-height:1.3em;
	  overflow: hidden;
	}
	.scroll-text ul {
	  display: inline;
	  width: 800px;
	  height: 100px;
	  text-align:center;
	  overflow: hidden;
	  margin: 0;
	  position: relative;
	  top: -1.1em;
	  margin:10px auto;
	}

	.scroll-text ul li {
	  height: 1.5em;
	  text-align:center;
	}
	img.mainlogo {
		margin-top: -100px;
	}
	
	#footer {
		border-top: 0px solid #eee;
		background: #000 !important;
	}
	#footer .copyright {
		background: #000 !important;
	}
	#footer .term-privacy a, #footer .site-copyright a {
		color: #ccc;
		font-size: 15px;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
	}
	#footer .site-copyright, #footer .site-copyright a {
		color: #aaa;
		font-weight: 300;
		font-size: 15px;
		background: #000 !important;
	}

	/* ########################################################################## */
	/* #####################         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: 0px;
		}
		.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;
		}
	}
	.newhdrlogo { display:none; }
 	/******************************************************************************/
	/***************        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 {
			font-weight: 600;
			font-size: 26px;
			line-height: 32px;
		}
		h1 .animate-charcter, h2.mission {
			font-weight: 400;
			font-size: 26px;
			line-height: 32px;
		}
		.mainslogan, .mainslogan .animate-charcter {
			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;*/
		}
		img.mainlogo {
			margin-top: -60px;
		}
		.newhdrlogo {
			display:none;
			/*display: inline-block !important;*/
		}
		h1.scrollertext {
			font-size: 25px;
			line-height: 33px;
		}
		.scroll-text ul {
			display: inline;
			width: 800px;
			height: 100px;
			text-align: center;
			overflow: hidden;
			margin: 0;
			position: relative;
			top: -1.1em;
			margin: 0px auto;
		}

		.scroll-text ul li {
			height: 1.5em;
			text-align: center;
		}
		.scrollertext li {
			font-size: 22px;
		}
		h1.mission {
			display: none;
			font-size: 17px;
			line-height: 25px;
			font-weight: 700;
		}
		h2.referralheader {
			font-size: 28px;
			line-height: 38px;
			text-align: center;
			margin: 0 auto 20px;
		}
		.lowfees {
			max-width: 350px;
		}
		.topsection {
			margin-top: 4.5px;
		}
		.blockit {
			display: block;
			width: 100%;
			overflow: hidden;
		}
		.animate-charcter {
			font-size: 22px;
			line-height: 32px;
		}
		.maintagline {
			font-size: 28px;
			line-height: 36px;
		}
		 /* 28/38 */
		.containerfluids {
			margin-top: -20px !important;
			padding-bottom: 10px;
		}
		.vcenter {
			display: none;
		}
		.vcentermobile {
			display: block;
			width: auto;
			padding: 0 25px;
			font-size: 22px;
			line-height: 30px;
		}
		.calcdiv {
			padding: 30px 0px 25px;
		}
		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: 0px;
		}
		.fullscreen-bg {
			height: 300px;
		}
		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;
		}
		a.subsloganlink, a.subsloganlink:link, a.subsloganlink:visited {
			font-size: 17px;
			line-height: 20px;
		}
		.subslogan a {
			font-size: 13px;
		}
		.subslogan a:hover {
		}
		.fms {
			font-size: 17px;
			line-height: 27px;
			font-weight: 500;
		}
		.bottomrotator {
			height: 70px;
		}
	}

	/* ########################## */
	@media (max-width: 480px) {
		.topsection {
			margin-top: 4.5px;
		}
		.waviy span {
			font-size: 13px !important;
		}
		.maintagline {
			font-size: 23px;
			line-height: 31px;
		}
		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);
		}
	}
	/* ########################## */
	@media (max-width: 375px) {
		.maintagline {
			font-size: 22px;
			line-height: 29px;
		}
	}	
</style>

<div id="igmsg" style="display:none; background:#cc0000; text-align:center; padding:10px; color:#fff; 
margin-top:0px; font-family:Montserrat,'Open Sans',Helvetica,Verdana,Arial,sans-serif;
font-size:17px; line-height:22px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">
<!--<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 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>-->
	FantasyTrivia is 80% member-owned <a href="/partners" 
	title="Learn more about Fractional-Member Ownership"><img 
	src="/static/images/icons/info_icon_white.png" alt="i" 
	style="height:20px; margin-top:-3px;" /></a> | <a href="/ownership" 
	style="color:#fff; font-weight:600" title="Learn more about Fractional-Ownership">Become 
	a Fractional-Owner for as little $5 <span style="font-weight:400;">(and it could turn into 
	$20k)</span> <i class="fa fa-angle-right" aria-hidden="true"></i></a>
	
	<!--Help us blow FantasyTrivia up &amp; <i>if</i> 
	we become a $1B company we&rsquo;ll give 1 lucky User $100M! <a href="/100m" 
	title="1 User could receive $100M" 
	style="color:#fff; font-weight:600"><img src="/static/images/icons/info_icon_white.png" alt="i" 
	style="height:20px; margin-top:-3px;" /> Learn how <i class="fa fa-angle-right" 
	aria-hidden="true"></i></a>-->
	
	<!--<a href="#1B" class="loginpop" title="1 User could receive $100M"><img
	src="/static/images/icons/info_icon_white.png" alt="i" style="height:20px;" /></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>
&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;
</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   #################### -->
<!-- ################################################################ -->

<div id="lpcontainer" class="topsection" style="background:none; overflow:hidden; font-family: Montserrat,'Open Sans',Helvetica,'Helvetica Neue',Verdana,Arial,sans-serif; border-bottom:0px solid #ff0000;
	margin-top:0px; min-height:100vh">
	<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/logo_horizontal.png" class="mainlogo"
			alt="Fantasy Trivia" style="width:90%; max-width:800px;"></a> 
			
			<!--<a href="/"><img src="/static/client/sayabcs_logo.mp4" alt="Say ABCs" 
				style="width:80%; max-width:600px; margin-top:-57px; margin-bottom:5px;"></a>-->

		<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/client/space.png" id="videobcg" class="fullscreen-bg__video">

					<source src="static/client/space.mp4" type="video/mp4">
					<source src="static/client/space.mp4" type="video/webm">Sorry, your browser 
					does not support HTML5 video.
				</video>
			<!--</div>-->
		</div>
		
			<style>
				span.atm {
					font-weight:700;
				}
				.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>
			<!--<br />-->
			<div class="waviy" style="display:none; max-width:350px; width:80%; background:none; 
				position:relative; z-index:999; font-weight:500; margin-bottom:-35px;
				/*background:#f11303 url(/static/client/sloganbg.png);*/ margin-top:-45px; color:#eee;
				font-size:18px; letter-spacing: -1px; padding:8px 12px 7px; text-transform: uppercase;
				border-radius: 50px; -moz-border-radius:50px; -webkit-border-radius:50px;">
				<!--MOB KNOWS BΞST-->
				<span style="--i:1">1</span>
				<span style="--i:2"></span>
				<span style="--i:3">Q</span>
				<span style="--i:4">U</span>
				<span style="--i:5">E</span>
				<span style="--i:6">$</span>
				<span style="--i:7">T</span>
				<span style="--i:8">I</span>
				<span style="--i:9">O</span>
				<span style="--i:10">N</span>
				<span style="--i:11">,</span>
				<span style="--i:12"></span>
				<span class="atm" style="--i:13">A</span>
				<span class="atm" style="--i:14">L</span>
				<span class="atm" style="--i:15">L</span>
				<span style="--i:16"></span>
				<span style="--i:17">T</span>
				<span style="--i:18">H</span>
				<span style="--i:19">E</span>
				<span style="--i:20"></span>
				<span style="--i:21">M</span>
				<span style="--i:22">A</span>
				<span style="--i:23">R</span>
				<span style="--i:24">B</span>
				<span style="--i:25">L</span>
				<span style="--i:26">E</span>
				<span style="--i:27">S</span>
				<!--
				<span style="--i:1">V</span>
				<span style="--i:2">O</span>
				<span style="--i:3">I</span>
				<span style="--i:4">C</span>
				<span style="--i:5">Ξ</span>
				<span style="">-</span>
				<span style="--i:6">A</span>
				<span style="--i:7">C</span>
				<span style="--i:8">T</span>
				<span style="--i:9">I</span>
				<span style="--i:10">V</span>	
				<span style="--i:11">A</span>
				<span style="--i:12">T</span>
				<span style="--i:13">E</span>
				<span style="--i:14">D</span>
				-->
			</div>

			<div class="clear"></div>
			
			<div class="maintagline" style="background:none; text-align:center; padding:0; color:#fff;
			 margin:15px auto 10px; width:96%; max-width:800px; 
			 font-family:Montserrat,'Open Sans',Helvetica,Verdana,Arial,sans-serif; font-weight:500;
			-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
			border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;">
				<!--Win Cash Answering Trivia Questions &amp; Earn Cash By Creating + Sharing Them-->
				Win Cash playing <span class="animate-charcters" 
				style="font-weight:600">1-Question</span> Trivia Challenges or earn it by 
				creating + sharing them
				<div style="text-align:center; padding:5px 10px; color:#ddd;
				font-size:12px; line-height:22px;
				font-family:Montserrat,'Open Sans',Helvetica,Verdana,Arial,sans-serif;">
					pays instantly via Zelle, Paypal, Venmo &amp; Cash App
				</div>
			</div>
			<br />
			
			<div style="display:none; max-width:1200px; margin:0px auto 0; padding:0 0px;">	
				<h1 class="scrollertext" style="margin-top:20px; padding-top:0; margin-bottom:0px;
				font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif;">
				<div style="color:#ccc; font-size:17px; margin-bottom:-7px">
					FantasyTrivia features...
				</div> 
					<div id="scrolltext" class="scroll-text" style="color: #F88817;
						text-align:center; background:none; width:100%;">
						<ul class="scrollertext" style="text-align:center; max-width:500px;">
							<li><span class="animate-charcters"
								style="font-weight:600">Sports Trivia, Pop Culture...</span></li>
							<li><span class="animate-charcters"
								style="font-weight:600">Politics, Movies, Celebs...</span></li>	
							<li><span class="animate-charcters"
								style="font-weight:600">Academia + more. Plus...</span></li>		
							<li><span class="animate-charcters"
								style="font-weight:600">Voice-Activated Trivia</span></li>
							<li><span class="animate-charcters"
								style="font-weight:600">Monetized Trivia Questions</span></li>	
							<li><span class="animate-charcters"
								style="font-weight:600">Cash-Prize Challenges</span></li>
							<li><span class="animate-charcters"
								style="font-weight:600">Profit-Sharing for Creators</span></li>
							<li><span class="animate-charcters"
								style="font-weight:600">Unlimited Trivia Topics</span></li>	
							<li><span class="animate-charcters"
								style="font-weight:600">Same-Day Cash-outs</span></li>	
						</ul>
					</div>
					<div style="padding:0 15px; display:none;">
						for know-it-alls and people who just want to have some good fun and
						maybe win (or make) some <a href="/trivia-challenges"
						style="color:#00C617; font-weight:600">cash</a>.
					</div>
				</h1>
			</div>

			<a class="btn-o" href="/ft" style="margin:10px 0 4px; color:#fff; text-align:center;
				max-width:140px; padding: 15px 15px; font-size:20px" 
				title="Play now">Play now ›</a>
			
			<br /><br /><br />
			<div style="color:#aaa; font-size:17px; line-height:25px; text-align:center;
				max-width:700px; margin:0 auto">
				
				<div style="margin-bottom:20px; color:#fff; 
				text-shadow:-1px 1px 1px rgba(0,0,0,.4);">
					<img src="/static/images/icons/playersonline.gif" alt="i@" 
					style="height:20px; margin-top:-3px;"> <?= $playersonline ?>+ Players 
					online <span style="font-weight:300; 
					color:#ccc;">&nbsp;|&nbsp;</span> <a href="/vip" style="color:#fff;"><span 
					style="color:#13d64e; font-size:20px;">
					<i class="fa-solid fa-sack-dollar"></i></span> Win $10 or $10k</a>
				</div>
				<!--or, Create your own Trivia Questions with 
				Cash Prizes and make some easy cash <br /><br />-->
				<a href="/leaderboard" title="Go to Leaderboard" style="outline:none"><i 
				class="fa fa-trophy" aria-hidden="true" style=""></i> <span 
					style="color:#fff;">LΞADERBOARD</span></a> <span 
					style="font-weight:300; color:#ccc;">&nbsp;|&nbsp;</span>
					
				<a href="#howitworks" class="loginpop" title="How It Works" 
				style="outline:none"><i 
				class="fa fa-question-circle" aria-hidden="true" style=""></i> <span 
					style="color:#fff;">How It Works</span></a> 
			</div>
			<div class="clear"></div>
			
			<div style="width:55px; margin:15px auto; border-top:1px solid #ccc"></div>
			<!--<i class="fa-solid fa-vault"></i> -->
			<a href="/cats" style="color:#ccc; font-size:16px" 
			title="View Cash Trivia Challenges"><span style="color:#13d64e; font-size:20px;"><i 
			class="fa-solid fa-sack-dollar"></i></span> WIN CASH WITH THESE CHALLENGES</a>
				
			<div style="margin-top:-10px;">
				<?php include 'views/includes/hcarousel.tpl.php'; ?>
			</div>
			 
			<div style="/*background:rgba(0,0,0,.5);*/ display:none; text-align:center; 
			padding:5px 10px; color:#bbb; margin:0 auto; width:90%; max-width:600px; 
			font-size:17px; line-height:25px;
			font-family:Montserrat,'Open Sans',Helvetica,Verdana,Arial,sans-serif;
			-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
			border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;">
				
				FantasyTrivia is 80% member-owned <a href="/partners" 
				title="Learn more about Fractional-Member Ownership"><img 
				src="/static/images/icons/info_icon_white.png" alt="i" 
				style="height:20px; margin-top:-3px;"></a> |
				<a href="/ownership" style="color:#fff; font-weight:600" 
				title="Learn more about Fractional-Ownership">Become
				a Fractional-Owner for as little $5 <span 
				style="font-weight:400;">(and it could turn into
				$20k)</span> <i class="fa fa-angle-right" aria-hidden="true"></i></a>
			</div>
			
			<!-- FADING IN/OUT TEXT -->
			<div style="height:38px; line-height:38px; width:100%; background:none; overflow:hidden;
				margin:30px auto 5px; display:none;">
				<h1 class="mission" style="margin:0; padding:0px; width:100%;
					font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif; color:#ccc;">
					<!--THERE&rsquo;S <span class="animate-charcter"
					style="font-weight:600">MONΞY</span> IN NUMBERS-->
					<!--<span style="color:#00D315; font-weight:400">57</span> SECONDS-->
					MONΞTIZE ANY GROUP OR AUDIENCE
				</h1>

				<h1 class="mission" style="margin:0; padding:0px; width:100%;
					font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif; color:#ccc;">
					<!--THERE&rsquo;S <span class="animate-charcter"
					style="font-weight:600">MONΞY</span> IN NUMBERS-->
					<!--<span style="color:#00D315; font-weight:400">57</span> SECONDS-->
					HARNΞSS THE POWER OF CROWDS
					<!--SΞND BULK-NOTIFICATIONS FREE-->
				</h1>

				<h1 class="mission" style="margin:0; padding:0px; width:100%;
					font-family:Montserrat,Raleway,Helvetica,Verdana, sans-serif; color:#ccc;">
					<!--THERE&rsquo;S <span class="animate-charcter"
					style="font-weight:600">MONΞY</span> IN NUMBERS-->
					<!--<span style="color:#00D315; font-weight:400">57</span> SECONDS-->
					THERE&rsquo;S POWER IN NUMBERS
				</h1>
			</div>
			
			<div class="clear"></div>
			
<!--			<div style="color:#222; max-width:900px; margin:0 auto; padding:0 10px;
			font-family:Montserrat,Raleway,'Open Sans',Helvetica,Verdana, sans-serif;">
				<div class="grid_6" style="background:#f4f4f4; margin-top:0px; font-size:17px;
						border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;">
					<a href="/trivia-challenges" style="color:#000;">
						<div style="padding:15px 15px 15px; line-height:24px">
							<span style="font-weight:600">CREATORS</span>
							<div style="font-size:15px; line-height:19px; text-align:center;">
								Create your own Trivia Contests + get paid $$$
							</div>
						</div></a>
				</div>
				<div class="grid_6" style="background:#f4f4f4; margin-top:0px; font-size:17px;
					border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;">
					<a href="/auth/join" style="color:#000;">
						<div style="padding:15px 15px 15px; line-height:24px">
							<span style="font-weight:600">JOIN BETA</span>
							<div style="font-size:15px; line-height:19px; text-align:center;">
								Help us test, win real cash + get free equity shares
							</div>
						</div></a>
				</div>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>-->
			<br />
			
			<!--<br /><br />-->
			<!-- TEXT UNDER THE PHONE IMAGE -->

		</center>

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

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

<!--- THIS DIV GOES ALL THE WAY TO THE BOTTOM -->
<div style="background:none; width:100%; padding-top:0px !important; padding-bottom:0px;
margin-top:0px !important; overflow:hidden;">

	<!-- ######################################################################## -->
	<!-- ########################       WHITE AREA       ######################## -->
	<!-- ######################################################################## -->

	<div style="background:#fff; width:100%; padding-top:0px; padding-bottom:0px;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">
	
	<!-- ################################################################## -->
	<!-- ##################    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:355px; 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 1k Equity Shares free ($50)</span>

			</div>
			<div style="position:absolute; right:0; bottom:0; float:right; margin-right:10px">
				<?php
				if ($_SESSION['loggedin']) { ?>
				<a class="btn-o" href="/beta" style="margin-bottom:4px; color:#fff; 
				text-align:center; max-width:90px; padding: 5px 15px;"
				title="Get 1,000 Equity Shares free (worth $50)">Join BETA &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="Get 1,000 Equity Shares free (worth $50)">Join BETA &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() {
			
			$("#sayabcsmedia").delay(7000).fadeOut(1000);

			$("#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="howitworks" 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;">
									HOW IT WORKS
								</h2>
								
								There are 2 types of Trivia Questions/Challenges. Anytime
								and Tournament-Style. 
								<br /><br />
								You can breeze through answering Anytime Questions
								to try to win their PrizePot(s) - while earning
								100 Fantasy Points for each Question answered (which increases
								your chances of winning Daily Consolation Prizes).
								<br /><br />
								Or, you can come online when a Tournament-Style Challenge
								is about to go-live and see and answer that Question 
								at the same time as a large group of other players. 
								In both cases, <span style="font-weight:600;">the fastest, 
								correct answer wins.</span> <a href="/how-it-works" 
								style="font-weight:600;">Learn more <i class="fa fa-angle-right" 
								aria-hidden="true"></i></a>

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

<!--<iframe width="560" height="315" src="https://www.youtube.com/embed/KZHZrMC_zHU?si=aB6VvRfkYrao5UBX" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>-->

<!-- 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/KZHZrMC_zHU?si=aB6VvRfkYrao5UBX?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>

<!-- MORE ON THE 1B -->
<div style="display:none;">
	<div id="1B" 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; max-width:400px;
					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; font-weight:normal; line-height:24px;
						text-align:left; font-family: Montserrat,'Open Sans',sans-serif;">

							<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;">
								$100M Offer (No Joke)
							</h2>
							Sign up for Fantasy Trivia (it&rsquo;s free), then download the Fantasy
							Trivia App (also free) and try one Trivia Set (under the Single-Elimination
							option/style) and that alone will make you eligible to win Equity worth 
							$100M or $100M cash (if we blow up and reach a $1B valuation and/or get 
							acquired for $1B).
							<br /><br />
							<i>Note: We&rsquo;ll also honor this offer for $500k if we reach a 
							minimum of $5M in Net Income.</i> <a href="/100m" class="coolblue"
							style="font-weight:600;">Learn more <i class="fa fa-angle-right" 
							aria-hidden="true"></i></a>
							
							<!--Download the Fantasy Trivia App from the App Store (no account is needed 
							for the App) and sign up for Fantasy Trivia (it&rsquo;s free)
							<br /><br />
							<i>Note: We will soon be releasing a publicly accessible contract between
							our LLC and the general public that states this.</i>-->

							<br />
							<!--<span style="font-weight:500;"></span>-->
						</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);
		//});
		
		$(function () {
			$('#scrolltext').scrollbox({delay: 2.0});
			$('#slide1').width($(window).width()).height($(window).height());
			$('#slide2').width($(window).width()).height($(window).height());
			$('#slide3').width($(window).width()).height($(window).height());
			$('#slide4').width($(window).width()).height($(window).height());
		});

		$('#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();
		//	});
	});

	///////////////////////////////////////
	// TESTIMONIALS
	var quotes = $(".mission");
	var quoteIndex = -1;

	function showNextQuote()
	{
		++quoteIndex;
		quotes.eq(quoteIndex % quotes.length)
		.fadeIn(2000)
		.delay(2000)
		.fadeOut(2000, showNextQuote);
	}

	showNextQuote();
	///////////////////////////////////////
	// 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>

<script type="text/javascript" src="/static/js/jquery.scrollbox.js" defer> </script>

<script>
	var editor = CKEDITOR.replace( 'statusUpdate' );
	// COMPOUNDING CALCULATOR
	var principal = $("#principal").val();
	if (!principal) {
		principal = 5;
		$("#principal").val(5);
	}

	var interest = $("#interest").val();
	if (!interest) {
		interest = .15;
		$("#interest").val(.15);
	}

	var periods = $("#periods").val();
	if (!periods) {
		periods = 5;
		$("#periods").val(5);
	}

	var total_earnings = principal * Math.pow((1+interest), periods);
	var total_earnings_formatted = parseFloat(total_earnings.toFixed(2));
	$("#earnings").html(total_earnings_formatted.toLocaleString("en"));

	var returnmult = (total_earnings/principal);
	var returnmult_formatted = parseFloat(returnmult.toFixed(0));
	$("#returnval").html(returnmult_formatted.toLocaleString("en"));

	function clearIt1(el)
	{
		var principal = $("#principal").val();

		if (principal == 0) {
			$("#principal").val('');
		}
	}
	function clearIt2(el)
	{
		var interest = $("#interest").val();

		if (interest == 0) {
			$("#interest").val('');
		}
	}
	function clearIt3(el)
	{
		var periods = $("#periods").val();

		if (periods == 0) {
			$("#periods").val('');
		}
	}

	// COMPOUNDING CALCULATOR
	function getVal(el)
	{
		var principal = $("#principal").val();
		var interest = $("#interest").val();
		var periods = $("#periods").val();
		//alert('Principal: ' + principal + ' Int%: ' + interest + ' P: ' + periods);
		//if (principal) {}
		//[P (1 + i)n] – P
		var total_earnings = principal * Math.pow((1+interest), periods);
		var total_earnings_formatted = parseFloat(total_earnings.toFixed(2));
		$("#earnings").html(total_earnings_formatted.toLocaleString("en"));

		var returnmult = (total_earnings/principal);
		var returnmult_formatted = parseFloat(returnmult.toFixed(0));
		$("#returnval").html(returnmult_formatted.toLocaleString("en"));

		//}
	}   // END OF FORM #2
	
</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; ?>