/*@font-face {
	font-family: 'the-prblem-with-microsoft-is-that-it-just-has-no-taste';
	src: url('fonts/HelveticaNeue.eot');
	src: url('fonts/HelveticaNeue.ttf') format('woff');
	}*/

	/*** HTML & Body ***/

	input::-webkit-input-placeholder { 
		/* WebKit browsers */ 
		color: #fff;
	} 

	input:-moz-placeholder { 
		/* Mozilla Firefox 4 to 18 */ 
		color: #fff;
	} 

	input::-moz-placeholder { 
		/* Mozilla Firefox 19+ */ 
		color: #fff;
	}


	.hurry input::-webkit-input-placeholder { 
		/* WebKit browsers */ 
		color: #ccc;
	} 

	.hurry input:-moz-placeholder { 
		/* Mozilla Firefox 4 to 18 */ 
		color: #ccc;
	} 

	.hurry input::-moz-placeholder { 
		/* Mozilla Firefox 19+ */ 
		color: #ccc;
	}

	#mfPreviewBar {
		opacity: 0!important;
		display: none!important;
	}

	html {
		text-align:center;
	}

	body{    
		margin:0;    
		padding:0;
		font-family: "Helvetica Neue 45 Light", "Helvetica Neue", Arial, sans-serif;
		text-align:center;
		font-weight: 300;
	}  

	h1, h2, h3, li {
		font-family: "Helvetica Neue 25 UltraLight", "Helvetica Neue";
	}

	img {
		pointer-events: none;
	}

	.smooth {
		transition: .3s;
		-o-transition: .3s;
		-ms-transition: .3s;
		-moz-transition: .3s;
		-webkit-transition: .3s;
		-webkit-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}

	body .clockContainer {
		/*	opacity: 0;*/
		width: 150px;
	}

	.clock {
		border-color: #6b87bc!important;

	}

	.clock *, .clock:before {
		background-color: #6b87bc!important;
	}
	/*** End HTML & Body ***/


	/***************** Blur Header *****************/

	header{
		background: rgba(255,255,255,0.95);
		height: 120px;
		position: fixed;
		width: 100%;
		top: 0;
		font-weight: 100;
		border-bottom: 1px solid rgba(164,164,164,0.7);
		z-index: 10000000000;
	}

	header {
		text-align: center;
		display: none;
	}

	.blurheader{
		background: rgba(245,247,250,0.7);
		height: 120px;
		position: fixed;
		width: 100%;	
		top: 0;
		border-bottom:1px solid rgba(164,164,164,0.7);
		z-index: 10000000000;
	}

	.blurheader{
		background: transparent;
		overflow: hidden;
		z-index: 10000;
		background: #fff;	
	}

	/*************** End Blur ******************/

	/***********  Slide to Download Animation *******/

	.slide-container {
		position: absolute;
		bottom: 100px;
		color:#ffffff;
		font-size: 45px;
		width: 100%;
		text-align: center;
	}


	.slide {
		display: block;
		width: 100%;
		background: -webkit-gradient(linear,left top,right top,color-stop(0, rgba(255,255,255,.5)),color-stop(0.4, rgba(255,255,255,.8)),color-stop(0.5, rgba(255,255,255,1)),color-stop(0.6, rgba(255,255,255,.5)),color-stop(1, rgba(255,255,255,.5)));
		-moz-background-clip: text;
		-webkit-background-clip: text;
		-moz-text-fill-color: transparent;
		-webkit-text-fill-color: transparent;
		-webkit-animation: slidetounlock 4s infinite linear;
		background-position: -600px;

	}

	@-webkit-keyframes slidetounlock {
		0% {
			background-position: -600px 0;
		}
		100%{
			background-position: 600px 0;
		}
	}


	/***********  End Slide to Download Animation *******/

	/**** Header Image *****/

	#headerImage {
		border-bottom:1px solid rgba(164,164,164,0.7);
	}

	/**** End Header Image ****/

	/**** Nav Bar Postioning ***/

	#title {	
		color:#4c9ad6; /*6b87bc; */
		font-size: 85px;
		vertical-align: middle;
	}

	.subtitle {
		color:#ffffff;
		font-size: 25px;
	}
	
	
	ul#navbar  {
		text-align: center;
		padding: 0;
		width: 942px;
		margin: 0 auto;
	}

	#navbar li{
		display: block;
		margin: 37px 0 0;
		float: left;
		list-style-type: none;
	}
	

	#navbar li#title {
		margin: -16px 35px 0 0
	}
	
	#navbar li#dropdown {
		margin: 0px 0 0;
		padding-bottom: 5px;
	}

	#navbar li.app-store {
		margin: 38px 0 0 0px;
		float: right;
	}

	#navbar li.app-store a {
		padding-right: 0;
		margin-right: 0;
	}

	#navbar li#title a {
		padding: 0;
		margin: 13px 0 0;
	}

	#navbar li a {
		padding: 10px 10px 0;
		margin: 0 10px;
		border-bottom: 1px solid transparent;
		display: block;
		color: #4c9ad6; /* 6b87bc; */
	}

	#navbar li.subtitle a:hover {
		border-bottom: 1px solid;
	}

	.delayNavBar {
		animation-delay: .3s; /* W3C and Opera */
		-moz-animation-delay: .3s; /* Firefox */
		-webkit-animation-delay: .3s; /* Safari and Chrome */
	}
	
	#navbar li ul {
		display: none; 
		width: 10em; /* Width to help Opera out */
		background-color: #fff;
		margin: 5px 0 0; 
	}
	
	#navbar li:hover ul {
		display: block;
		position: absolute;
		margin: 0;
		padding: 0;
		
	}
	
	#navbar li:hover li {
		float: none; 
	}
		
	#navbar li:hover li a {
		background-color: #fff;
		border-bottom: 1px solid #fff;
		color: #4c9ad6; 
		}
	#navbar li li a:hover {
		background-color: #4c9ad6;
		color: #fff;
	}

	/**** End Nav Bar Postioning ***/

	/**** App Store Buttons ****/

	.itunes {
		border-radius: 0;
		display: inline-block;
		padding: 0;
		text-decoration: none;
		margin: 0;
		text-indent: -9999px;
		background: url(../allowance/images/Available_on_the_App_Store.png) no-repeat;
		background-size: 100% auto;
		width: 140px;
		height: 50px;
	}

	.itunes.bigappstorebutton {
		width: 230px;
		height: 100px;
	}

	.appstorebutton:active {
		position:relative;
		top:1px;
	}

	/****** Play Button *******/

	.the-rest {
		width: 100%;
		height: 495px;
		background: url(../allowance/images/HeaderImage.jpg) no-repeat center;
		background-size: cover;
	}
	.image-play-wrap {
		position: relative;
		margin-top: 120px;
		overflow: hidden;
	}

	.image-play-wrap.playing {
		background: #1a1a1a;
	}

	.image-play-wrap .circle {
		background: rgba(255,255,255,.6);
		position: absolute;
		top: 50%;
		display: block;
		margin: 0 auto;
		width: 200px;
		left: 50%;
		margin-left: -100px;
		margin-top: -100px;
		text-indent: -9999px;

		border-radius: 50%;
		height: 200px;
		z-index: 99;
		background: rgba(255,255,255,.5);
	}

	.image-play-wrap .circle:hover {
		background: rgba(255,255,255,.8);
	}

	.image-play-wrap .triangle {
		width: 0;
		height: 0;
		display: block;
		margin: 61px 0 0 59px;

		width: 100px;
		height: 100px;
		background: url(../allowance/images/Triangle.png) no-repeat top;
		background-size: auto 80%;
	}

	.video-wrap {
		max-width: 880px;
		margin: 0 auto;
	}

	.playing .video-responsive{
		overflow:hidden;
		padding-bottom:56.25%;
		position:relative;
		height:0;
	}
	.playing .video-responsive iframe{
		left:0;
		top:0;
		height:100%;
		width:100%;
		position:absolute;
	}

	/****** Links *******/

	a, a:hover {
		text-decoration:none; 
		color:#6b87bc;
	}

	/****** End Links *****/

	/***** Boxes *****/

	.Box {
		text-decoration:none;
		padding: 20px 11px;
		max-width:1000px;
	}

	.row {
		padding-top:20px;
		padding-bottom:20px;
	}

	.tweet-p {
		max-width: 520px;
		margin: 20px auto 40px
	}

	.boxBody, p, blockquote, .format-me, .p {
		color:#909090;
		font-size: 18px;
		vertical-align: middle;
		line-height: 28px;
		font-weight: 300;
	}

	.tweet {
		margin: 0 auto 60px;
		max-width: 540px;
		overflow: hidden;
	}


	.tweet > span {
		padding: 10px 0 0;
		display: block;
		margin: 0px;
		float: left;
	}

	.tweet a {
		border-radius: 20px;
		padding: 20px;
		color: #199eda;
		font-size: 24px;
		max-width: 520px;
		display: block;
		margin: 0 auto;
		overflow: hidden;
		color: white;
		background: #199eda;
	}

	.bird {
		background: url(../allowance/images/twitter-hover.png) no-repeat 0 8px;
		background-size: 100% auto;
		width: 80px;
		height: 83px;
		display: block;
		float: left;
		margin: 0px 0px 0 43px
	}

	.tweet .text {
		display: inline-block;
		display: inherit;
		margin: 28px 0 0 46px;
		max-width: 260px;
		text-align: center;
		float: left;
	}

	.tweet a:hover {
		background: #1790c7;
	}

	.inline {
		float: left;
		margin: 7px 0 0 10px;
		max-width: 480px;
	}

	blockquote:before {
		content: "\"";
		font-size: 80px;
		color: #ddd;
		display: block;
		float: left;
	}

	blockquote:after {
		content: "\"";
		font-size: 80px;
		color: #ddd;
		display: block;
		float: right;
	}

	blockquote {
		border-left: none;
	}
	.boxline {
		margin-top: -5px; 
		height: 1px;
		background: -webkit-linear-gradient(left, white, #e5e5e5, white); /* For Safari */
		background: -o-linear-gradient(right, white, #e5e5e5, white); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(right, white, #e5e5e5, white); /* For Firefox 3.6 to 15 */
		background: linear-gradient(to right, white, #e5e5e5, white); /* Standard syntax */
		position: relative;
		z-index: 102;
	}

	.row.special {
		margin: -35px 0 50px;
	}

	.special.no-negative {
		margin: 25px 0 25px;
	}

	.row.special.not-so-much {
		margin-bottom: 0;
	}

	.mobileiPhone {
		width: 505px;
	}

	h1, h2 {
		color:#6b87bc;
		color: #000;
		font-size: 45px;
		vertical-align: middle;
		margin:0 0 30px;
	}

	#timelinewrapper {
		width: 500px;
		height: 70px;
	}

	#timelinecontainer-img {
		z-index: 101;
		position: absolute;
		background-color: #ffffff;
		width: 320px;
		height: 80px;
		overflow-x: hidden;
		top: 204px;
		left: 100px;
	}

	.movetimer {
		position:relative;
		margin-top: -1px;
		animation:movetimer 8s infinite;
		-webkit-animation:movetimer 8s infinite; /*Safari and Chrome*/
		-o-animation: movetimer 8s infinite;
		-ms-animation: movetimer 8s infinite;
		width: 806px;

	}

	.left.first {
		margin-top: 97px;
	}

	.right.first {
		position: relative;
	}

	.right {
		float: right;
	}

	.left {
		float: left;
	}

	.left.image {
		padding-left: 0;
	}

	.second.text {
		margin: 79px 0 0;
	}

	.third.text {
		margin: 152px 0 0;
	}

	.fourth.text {
		margin: 50px 0 0;
	}

	.shell-wrap {
		overflow: hidden;
		width: 436px;
		position: relative;
	}

	.shell-wrap img {
		position: relative;
		width: 505px;
	}

	video {
		position: absolute;
		top: 141px;
		left: -29px;
	}

	video.second {
		left: -23px;
	}

	@keyframes movetimer
	{

		0%   {left:-470px;}
		50%  {left:0px;}
		100% {left:-470px;}

	}

	@-webkit-keyframes movetimer /*Safari and Chrome*/
	{

		0%   {left:-470px;}
		50%  {left:0px;}
		100% {left:-470px;}

	}

	@-moz-keyframes movetimer /*Firefox*/
	{

		0%   {left:-470px;}
		50%  {left:0px;}
		100% {left:-470px;}

	}

	@-o-keyframes movetimer /*Opera*/
	{

		0%   {left:-470px;}
		50%  {left:0px;}
		100% {left:-470px;}

	}

	/***** Timers are a thing of beauty animation *****/
	.left.second {
		position: relative;
	}

	.timer-wrap {
		background: white;
		width: 123px;
		height: 46px;
		position: absolute;
		top: 138px;
		left:260px;
	}

	.timer-wrap .circle {
		background: #b7b7b7 url(http://s3.amazonaws.com/tapity_public/hours/ClockIcon@2x.png) no-repeat 47% 47%;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		position: absolute;
		right: 0;
		background-size: 70%;
		-o-transition: .15s;
		-ms-transition: .15s;
		-moz-transition: .15s;
		-webkit-transition: .15s;
		-webkit-transition: all .15s ease-in-out;
		transition: all .15s ease-in-out;
	}

	.timer-wrap.active .circle, .timer-wrap .rectangle {
		background-color: #6a8dcf;
	}

	.timer-wrap.bigpulse .circle {
		width: 36px;
		height: 36px;
		right: 4px;
		top: 4px;
	}

	.timer-wrap.smallpulse .circle {
		width: 42px;
		height: 42px;
		right: 1px;
		top: 1px;
	}

	.timer-wrap .rectangle {
		height: 28px;
		position: absolute;
		top: 9px;
		border-radius: 5px;
		right: 10px;
		width: 0;
	}

	.timer-wrap .rectangle .wrap {
		color: #fff;
		text-align: left;
		padding: 3px 0 0 9px;
	}

	/***** End Boxes *****/

	/***** Footer ****/

	#finalLine {
		color:#909090;
		font-size: 15px;
		text-decoration: none ;
		
	}

	.footer {
		margin-top: 30px;
		margin-bottom: 30px;

	}

	.bull {
		padding: 0 6px;
	}

	body .clock i {
		padding: 60px 3px 0;
	}

	.clockContainer {
		margin: 30px auto 0px;
	}

	.featurez {
		text-align: left;
	}

	.featurez h2 {
		text-align: left;
		margin: 0 0 10px;
		padding: 0 0 0 60px;
	}

	.featurez h2 {
		padding: 0 0 0 58px;
		background-size: 40px;
		background-position: 0 center;
		background-repeat: no-repeat;
	}

	.featurez .smartsnap {
		background-image: url(../allowance/images/SmartSnap.png);
	}
	
	.featurez .children {
		background-image: url(../allowance/images/ChildrenIcon.png);
	}
	
	.featurez .banks {
		background-image: url(../allowance/images/BanksIcon.png);
	}
	
	.featurez .currency {
		background-image: url(../allowance/images/CurrencyIcon.png);
	}
	
	.featurez .parentalcontrols {
		background-image: url(../allowance/images/ParentalControlsIcon.png);
	}
	
	.featurez .print {
		background-image: url(../allowance/images/PrintIcon.png);
	}
	
	.featurez .star {
		background-image: url(../allowance/images/StarIcon.png);
	}
	
	.featurez .currencyplus {
		background-image: url(../allowance/images/CurrencyPlusIcon.png);
	}
	
	.featurez .marginplus {
		background-image: url(../allowance/images/MarginPlusIcon.png);
	}

	.logoz .image > a {
		float: left;
		background: url(../allowance/images/logos.jpg) no-repeat 0 0;
		height: 66px;
		display: block;
		background-size: auto 65px;
		text-indent: -9999px;
		margin: 0 22px 15px;
	}

	.logoz .image .forbes {
		width: 168px;
	}

	.logoz .image .nineto5 {
		width: 255px;
		background-position: -225px 0;
	}

	.logoz .image .tnw {
		background-position: -533px 0;
		width: 135px;
	}

	.logoz .image .tuaw {
		background-position: -725px 0;
		width: 117px;
	}

	.logoz .image .techcrunch {
		background-position: -1077px 0;
		width: 85px;		
	}

	.logoz .image .macstories {
		background-position: -869px 0;
		width: 198px;
	}

	.greyscale {
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
		filter: gray;
		filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
	}

	input[type="email"] {
		border: 1px solid #fff;
		color: #fff;
		font-size: inherit;
		font-weight: inherit;
		border-radius: 12px;
		background: transparent;
		padding: 10px 15px;
		font-size: 20px;
		border-radius: 9px;
		outline: none;
	}

	label { 
		font-weight: inherit;
		color: #fff;
	}

	input[type="submit"] {
		font-size: 20px;
		background: #fff;
		border: none;
		border-radius: 50px;
		color: #4c9ad6;
		font-weight: inherit;
		margin: 0 0 60px 0;
		padding: 16px 81px;
		outline: none;
	}

	input[type="checkbox"] {
		margin: 0 9px 0 0;
	}

	.blue-box {
		background: #4c9ad6 url(../allowance/images/Glyphs.png) no-repeat center 98px;
		color: white;
		background-size: 990px;
		overflow: hidden;
		margin: 0px 0 20px;
		padding: 0 20px;
	}

	.blue-box p {
		font-size: 22px;
		max-width: 380px;
		line-height: 31px;
		margin: 0 auto 180px;
		color: #fff;
	}

	.blue-box h2 {
		padding: 53px 0 0;
		color: #fff;
	}

	.format-me {
		text-align: center;
		max-width: 400px;
		margin: 30px auto;
	}

	.hurry input[type="email"] {
		border: 1px solid #ddd;
		color: #000;
		margin: 0 0 20px 0;
	}

	.hurry input[type="submit"] {
		background: #6c88ba;
		color: #fff;
	}

	.row.special.pre-tweet {
		margin: 15px 0 50px;
	}

	/**** End Footer ****/

	@media all and (min-width: 992px)
	{
		.hurry input[type="email"] {
			margin: 0 -20px 0 0;
			border-top-left-radius: 50px;
			border-bottom-left-radius: 50px;
		}

		.hurry input[type="submit"] {
			padding: 11px 30px;
			border-top-left-radius: 0;
			border-bottom-left-radius: 0;
		}
		.right.text {
			padding-right: 55px;
		}

		.left.text {
			padding-left: 55px;
		}

		.featurez .col-md-6 {
			width: 48%;
		}


		.logoz .col-md-12 {
			padding: 0 60px;
		}


		.logoz .image {
			width: 887px;
			margin: 0 auto;
			overflow: hidden;
		}

		input[type="email"] {
			width: 410px;
		}
	}

/* Silly bootstrap does a min-width 992 query. 
So we have to be one less for it to be 100% seamless */
@media all and (max-width: 991px)
{

	.itunes.bigappstorebutton {
		height: 85px;
	}

	p.more-padding {
		padding: 0 0 20px;
	}

	.left.fourth img.showme, header {
		display: block!important;
	}

	ul#navbar {
		max-width: 100%;
		min-width: 1px;
	}

	h1, h2 {
		font-size: 40px;
	}

	.row.special {
		margin-bottom: 30px;
	}
	
	.bull {
		display: block;
		text-indent: -9999px;
		height: 7px;
	}

	.row, .image-play-wrap, .col-md-6.right, .col-md-6.left {
		margin: 0;
	}

	.featurez {
		padding: 0;
	}

	.featurez .col-md-6 {
		margin: 0 0 30px;
	}

	.Box {
		width: auto;
		padding: 0;
		overflow: hidden;
	}

	header {
		position: static;
		height: auto;
	}

	#navbar li, .blurheader, .left.fourth img.extra {
		display: none;
	}

	#navbar li#title a {
		margin: 0;
		padding: 10px 0;
	}

	#navbar li#title {
		display: block;
		float: none;
		margin: 0;
		text-align: center;
		font-size: 60px;
	}

	body img {
		max-width: 100%;
		height: auto;
	}

	body .col-md-6.right, .col-md-6.left {
		float: none;
	}

	.right.image, .left.image {
		padding: 0;
		margin: 0 auto;
		width: 320px;
		overflow: hidden;
	}

	#timelinewrapper {
		height: auto;
	}

	.mobileiPhone {
		width: 320px!important;
		margin-left: 5px;
	}

	#timelinecontainer-img {
		width: 202px;
		height: 49px;
		top: 130px;
		left: 59px;
	}

	.timer-wrap {
		width: 85px;
		height: 32px;
		top: 87px;
		left: 171px;
	}

	body .clockContainer {
		width: 100px;
		margin: 20px auto 0;
		opacity: 1;
		padding-bottom: 0px;
	}

	.clock {
		width: 100px;
		height: 100px;
		border-width: 5px;
	}

	.clock:before {
		width: 12px;
		height: 12px;
		margin: -6px 0 0 -6px;
	}

	body .clock i {
		padding: 60px 2px 0;
		margin: -42px -2px 0;
		padding: 41px 2px 0;
	}

	.clock p {
		padding: 31px 3px 0;
		top: 56px;
		left: 47px;
	}

	.logoz .image {
		background: none;
		height: auto;
	}

	.logoz .image > a {
		float: none;
		margin: 0 auto;
	}

	@keyframes movetimer
	{

		0%   {left:-300px;}
		50%  {left:0px;}
		100% {left:-300px;}

	}

	@-webkit-keyframes movetimer /*Safari and Chrome*/
	{

		0%   {left:-300px;}
		50%  {left:0px;}
		100% {left:-300px;}

	}

	@-moz-keyframes movetimer /*Firefox*/
	{

		0%   {left:-300px;}
		50%  {left:0px;}
		100% {left:-300px;}

	}

	@-o-keyframes movetimer /*Opera*/
	{

		0%   {left:-300px;}
		50%  {left:0px;}
		100% {left:-300px;}

	}

	video {
		display: none;
	}

	.shell-wrap {
		width: auto;
	}
}

@media all and (max-width: 880px)
{
	body .the-rest img {
		max-width: none!important;
		width: auto!important;
	}
	.blue-box {
		background-position: center 163px;
		background-size: 534px;
	}
	.blue-box p {
		margin-bottom: 30px;
	}

	.tweet > span {
		float: none;
		margin: 0px auto;
	}
}

@media all and (max-width: 660px)
{
	.image-play-wrap .circle {
		width: 100px;
		height: 100px;
		margin-left: -50px;
		margin-top: -50px;
	}

	.image-play-wrap .triangle {
		background-size: auto 40%;
		margin: 31px 0 0 7px;
	}

	.tweet .text {
		max-width: 100%;
		float: none;
		margin: 0;
	}
	.bird {
		float: none;
		margin: 0 auto 20px;
	}
}

@media all and (max-width: 320px )
{


}

/*** End Mobile ***/








/* Localized */