/*
Theme Name: Float 2015
Theme URI: http://www.floatapp.com/
Description: A custom theme for float
Version: 1.0
Author: James Cant
Author URI: http://www.day6studio.com/
*/

html, body{
    height: 100%;
    box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

body{
	font-family: 'fs_melight';
	font-size:14px;
	color: #868b95;
}

a {color: #46a0de; text-decoration:none; cursor: pointer; }
a:visited {color:#46a0de;}
a:hover {color: #66c0e4;}
a:active { color:#46a0de;}

h1, h2, h3, h4, h5, h6{ padding: 15px 0; line-height: 130%;}
h1,h2{font-size:30px; color:#4a4f5a; }
h3{font-size:16px; color:#868b95; }
h4{ font-size:22px; color:#4a4f5a; }
h5,h6{ font-size:18px; }

p{ padding: 7px 0; line-height: 170%; }

strong{ font-family: 'fs_mebold'; }
em{ font-style: italic; }
small{ font-size: 11px; }

ul,ol{ margin:10px 0; line-height: 150%; }

.full-width{ width: 100%; }
img.first{ padding-top: 15px; }

blockquote{
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:18px;
	font-weight:lighter;
	line-height: 150%;
	letter-spacing: 1px;
	background-repeat: no-repeat;
	background-size: 25px auto;

}
blockquote.wide{ margin: 0 5%; font-size: 22px; }
blockquote > div{
	font-family: 'fs_meheavy';
	font-size: 14px;
	display:block;
	margin-top:20px;
	letter-spacing: 0;
}
blockquote.quote-alt{
	font-family: 'fs_melight';
	font-size:14px;
	color: #868b95;
	line-height: 120%;
	background-repeat: no-repeat;
	background-size: 25px auto;
	letter-spacing: 0;
}
blockquote.quote-alt > div{
	margin:10px 0;
	line-height: 150%;
	color: #333;
}
blockquote.quote-alt > div span{ font-family: 'fs_melight'; font-size:16px; }

blockquote.quote-grey{ background-image: url('ims/quote-grey.png'); padding:0 25px; }
blockquote.quote-white{ background-image: url('ims/quote-white.png'); padding:0 25px; }

hr{ border:none; height:2px; background-color:#ebebeb; }
hr.blue{ border:none; height:2px; background-color:#46a0de; }
hr.thin{ border:none; height:1px; background-color:#66C0E4; width:70%; }

ul.numbers{ margin-left:0 !important; }
ul.numbers li{
	background-size: 25px;
	background-repeat: no-repeat;
	padding: 2px 0 2px 36px;
	margin: 8px 0;
}

li.number-1{ background-image: url('ims/1.png'); }
li.number-2{ background-image: url('ims/2.png'); }
li.number-3{ background-image: url('ims/3.png'); }
li.number-4{ background-image: url('ims/4.png'); }
li.number-5{ background-image: url('ims/5.png'); }
li.number-6{ background-image: url('ims/6.png'); }

ul.numbers li, ul.tick li, ul.question li, ul.cross li, ul.divot li{
	list-style-type: none;
}

ul.tick li{ 
	background-image: url('ims/tick.png');
	background-size: 24px;
	background-repeat: no-repeat;
	padding: 2px 0 0px 38px;
	margin: 8px 0;
}

ul.question li{ 
	background-image: url('ims/question.png');
	background-size: 24px;
	background-repeat: no-repeat;
	padding: 2px 0 0px 38px;
	margin: 8px 0;
}

ul.cross li{ 
	background-image: url('ims/cross.png');
	background-size: 24px;
	background-repeat: no-repeat;
	padding: 2px 0 0px 38px;
	margin: 8px 0;
}

ul.feature li{
	background-image: url('ims/feature.png');
	background-size: 25px;
	background-repeat: no-repeat;
	padding: 2px 0 2px 36px;
	margin: 8px 0;
}

ul.divot li{
	background-image: url('ims/divot-grey.png');
	background-size: 25px;
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 30px 0 30px 36px;
	margin: 8px 0;
}

ul.divot-right li{
	background-image: url('ims/divot-grey-right.png');
	background-size: 25px;
	background-repeat: no-repeat;
	background-position: 100%;
	padding: 30px 36px 30px 0;
	margin: 8px 0;
	text-align:right;
}


/* Global styles */

.desktop-only{ display:none; }

.no-spacing{ padding:0; margin:0; }
.increased-line-height{ line-height:200%; }

.text-center{ text-align: center; }
.text-left{ text-align: left; }
.text-right{ text-align: right; }

.grey{ color: #ebebeb; }
.dark-grey{ color: #4a4f5a; }
.blue{ color: #46a0de; }
.green{ color: #53be6f; }
.red{ color:#ef4b3b; }
.white{ color: #ffffff; }

.bg-grey{ background-color: #ebebeb; }
.bg-blue{ background-color: #46a0de; color:#fff; }
.bg-green{ background-color: #53be6f; color: #fff; }
.bg-white{ background-color: #fff; color: #333; }

.scroll{ cursor: pointer; }

.price{ font-size: 68px; }

.bg-quote-1{
	color:#fff;
	/* text-shadow: 2px 2px 2px #195c8a; */
	background-image: url('ims/quote-bg1.png');
	background-size: cover;
	position:relative;
	padding-top: 80px;
	padding-bottom:80px;
}
.bg-quote-1 h1{ color: #fff; }
.bg-quote-1 .container > span{ display: table-cell; vertical-align:middle; width: 960px; }

.overlay{
	position:absolute;
	width:100%;
	background-position: center;
	background-repeat: no-repeat;
}
.overlay-top{ top:0; left:0; background-image: url('ims/overlays/768-top.png'); background-size:768px auto; height:25px; }
.overlay-bottom{ bottom:0; left:0; background-image: url('ims/overlays/768-bottom.png'); background-size:768px auto; height:42px; }

.bg-quote-2{
	color:#fff;  
	background-image: url('ims/quote-bg2.png');
	background-size: cover;
}
.bg-quote-2 h1{ color: #fff; }
.bg-quote-2{ text-align: center; }
.bg-quote-2 .container > span{ display: table-cell; vertical-align:middle; width: 960px; }

.button{
	display: inline-block;
	padding: 6px 11px;
	margin:5px 0;
	border-radius: 3px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:13px;
	font-weight:bold;
	text-shadow: none;
	border:none;
	cursor: pointer;
}
header .button, footer .button{ margin:0; }
.button, .button:hover, .button:active, .button:visited{ color: #fff; }

.button, .button:hover, input[type=submit].button{
	-webkit-transition: background-color 150ms linear;
    -moz-transition: background-color 150ms linear;
    -o-transition: background-color 150ms linear;
    -ms-transition: background-color 150ms linear;
    transition: background-color 150ms linear;
}

.button.bg-grey:hover{ background-color: #999; }
.button.bg-blue:hover{ background-color: #328fcf; /*46a0de;*/ }
.button.bg-green:hover{ background-color: #42a053; }

.button-large{ padding: 15px 20px; font-size:14px; }
.button-wide{ padding:15px 35px; }

.rounded{ border-radius: 3px; }
.rounded-more{ border-radius: 10px; }

.content ul{ list-style-type: disc; margin-left:20px; }
.content ol{ list-style-type: decimal; margin-left:20px; }
.content hr{ margin:30px 0; }

.icon{ padding-left: 19px; background-size: 12px; background-repeat: no-repeat; }

.icon-padlock{ background-image: url('ims/padlock.png'); }
.icon-quote{ width:50px; }

.icons img{ width:24px; margin: 0 2px; }

.star{ display:none; }

.form-container{ padding:20px; margin:20px; }
form input[type=text], form input[type=email]{ width:100%; padding:8px; border-radius:5px; border:1px solid #ccc; margin:7px 0; }

/* Mobile first layout */
section{ padding:20px; }
#home-banner .container{ padding:0 20px; }

header, .page, footer{
	width: 100%;
	clear: both;
}

header{
	color: #868b95;
	position: fixed;
	top: 0;
	height: 60px;
	background-color: #FFF;
	-webkit-box-shadow: 0px 1px 15px 0px rgba(50, 50, 50, 0.2);
	-moz-box-shadow: 0px 1px 15px 0px rgba(50, 50, 50, 0.2);
	box-shadow: 0px 1px 15px 0px rgba(50, 50, 50, 0.2);
	z-index: 99;
}
header a{ font-weight:bold; color: #46a0de; }

header section{ padding:0; }
header .container{ position: relative; }

#home-navigation{ font-size: 16px; position: absolute; right: 0; top: 39px; display:none; }
#home-navigation a{ color: #fff; }
#main-navigation, #login{ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; display:none; }

h1.headline{ margin-top:40px; }

footer{
	background-color:#2b303e;
	color:#868b95;
	text-align: center;
}
footer .container{ padding:20px; font-size:13px; }
footer span{ margin-top: 10px; display: inline-block; line-height: 140%; }
footer .button{ margin:25px 0 10px; }
footer .headline{ font-size:22px; color:#fff; }
footer h3{ color: #fff; }
footer a, footer a:active, footer a:hover, footer a:visited{ color:#868b95; }
footer a:hover{ color: #999; }
footer p{ line-height: 140%; }
footer .no-spacing{ padding:0 0 15px; }

h1.subtitle, h2.subtitle{ padding-bottom:0; }
h1.subtitle + p, h2.subtitle + p{ padding-top:0; font-size:16px; color:#868b95; }
h1.subtitle + h4{ padding-top:0; }

h1.subtitle + p.text-center, h2.subtitle + p.text-center{ margin-bottom:40px; }

.container{ max-width:960px; margin:0 auto; }

#menu-icon, #menu-icon-white{ z-index:99; position:absolute; right:20px; top:20px; width:25px; cursor: pointer; }
#mobile-navigation{
	color:#fff;
	display:none;
	background-color:#46a0de;
	position: fixed;
	height: 150%;
	width: 100%;
	z-index: 999;
	text-align: center;
}
#mobile-navigation h2{ color: #fff; padding-bottom:0; }
#mobile-navigation a{ color: #fff; }
#mobile-navigation p{ font-family: 'fs_melight'; font-size: 14px; padding-top:5px; }
#mobile-navigation div{ margin:15px 0;}
#mobile-navigation .button{ padding:12px 28px; font-size: 16px; }
.homepage{ margin-top: 60px; }

#logo-home{ width:120px; margin-top:19px; }
#logo{ width:120px; margin-left:20px; margin-top:19px; }

#home-banner{
	height:100%;
	color:#fff;
	background-image: url('ims/home-banner.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
div#home-banner.a{ background-image: url('ims/home-banner-a.jpg'); }
div#home-banner.b{ background-image: url('ims/home-banner-b.jpg'); }
div#home-banner.c{ background-image: url('ims/home-banner-c.jpg'); }
#home-banner h1, #home-banner h4{ color:#fff; text-shadow: 0 0 10px rgba(0,0,0,.5); }
#home-banner .container{ position: relative; }
#home-banner .button{ margin-top: 20px; }

.features img{ width: 140px; margin:15px 0 20px; }

.features-home img{ width: 70px; }
.features-home p{ margin-bottom:10px; }
.features-home h3{ padding:30px 0 5px; }

.feature-boxes > .grid__col{ margin-bottom:45px; position:relative; }
.feature-box{ border-width: 2px; border-style: solid; padding:10px 25px 15px 80px; font-size: 12px; background-position: 30px 50%; background-repeat:no-repeat; background-size: 26px auto; }
.feature-box h3{ padding-bottom:0; }

.feature-box.feature-box-green{ border-color: #53be6f; background-image: url('ims/arrow-green.png');  }
.feature-box.feature-box-red{ border-color: #ef4b3b; background-image: url('ims/arrow-red.png');  }

.divot-down{ position:absolute; height:31px; width:13px; background-size: 13px 31px; background-repeat: no-repeat; margin-left:6px; left:50%; }
.divot-red{ background-image: url('ims/divot-red.png'); }
.divot-green{ background-image: url('ims/divot-green.png'); }

.quote-boxes > .grid__col{ margin-bottom:110px; position:relative; }
.quote-box{
	color: #868b95;
	background-color:#fff;
	padding:17px 20px;
	font-size: 13px;
	text-align: left;
	line-height:160%;
	-webkit-box-shadow: 0px 2px 5px 0px rgba(51,51,51,0.75);
	-moz-box-shadow: 0px 2px 5px 0px rgba(51,51,51,0.75);
	box-shadow: 0px 2px 5px 0px rgba(51,51,51,0.75);
	margin:0 30px;
}
.quote-box div{ font-size: 12px; font-weight:bold; margin-top:10px; }
.grid__col--1-of-3 .quote-box{ margin:0 !important; }

.testimonials img{ width:150px; margin:40px 0 0; }

.chevron-down{ position:absolute; background-image: url('ims/chevron.png'); height:15px; width:20px; background-size: 20px 15px; background-repeat: no-repeat; left:50%; }

.pricing-boxes{ margin: 40px 0 10px -20px; }
.pricing-boxes > .grid__col{ margin-bottom:20px; }
.pricing-box{ border: 2px solid #cdcdcd; padding:17px 30px 17px 30px; position:relative; }
.pricing-box.standard{ padding-top: 50px; }
.pricing-box ul{ padding:10px 0; }
.pricing-box ul.tick li{ padding-left:30px; }
.pricing-box .ribbon{
	position: absolute;
	background-image: url('ims/ribbon.png');
	background-size: 110px auto;
	background-repeat: no-repeat;
	width:110px;
	height:110px;
	top:-2px;
	right:-2px;
	/* background-size: 120px auto;
	color:#fff;
	font-size:18px;
	background-color: #46a0de;
	background-repeat: no-repeat;
	width: calc(100% + 5px);
	padding-top: 15px;
	height: 30px;
	top: -2px;
	left: -2px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	-webkit-box-shadow: 0 4px 5px -2px #bbb;
   -moz-box-shadow: 0 4px 5px -2px #bbb;
    box-shadow: 0 4px 5px -2px #bbb;
    text-transform: uppercase; */
}

.price{ position:relative; }
.price div{
	position: absolute;
    font-size: 40%;
	left: -15px;
	top: 14px;
}

.screen{ padding:30px 0 40px; }
.screen-more{ padding: 50px 0 40px; }
.screen-width{ padding-left:30px; padding-right:30px; }

.hero-image{ color:#fff; padding:20px 0 30px; margin-top:70px; position:relative; background-size: cover; background-position: center; }
.hero-image h1{ color:#fff; }
.hero-image .container{ padding:0 20px; }

.hero-image-xero-award{ background-image: url(ims/xero-award.jpg); }

#xero-winner-logo{ display:block; max-width: 300px; margin:0 auto; }
#logo-freeagent{ display: block; max-width: 350px; margin: 0 auto;}

.headshot{
	max-width: 60px;
	position: absolute;
	left: 50%;
	margin-left: -20px;
	margin-top: 25px;
}

/* SimpleModal styles */

.simplemodal-data{
	display:block;	
	background-color: #fff;
	width:80%;
	height:150%;
	padding:10% 10%;
	position: fixed;
	left: 0;
}
#modal h2{ margin-bottom: 20px; }
#modal-freeagent { 
  width: 125px; 
  height: 125px;
}
#modal-xero { 
  width: 125px; 
  height: 125px;
}
#modal-qbo {
  width: 125px; 
  height: 125px;
}


/* Quickbooks landing page - July 2015 */

#quickbooks-landing-header{
	padding-top: 24px;
	background-image:url(ims/macbook-bg.jpg);
	background-size:cover;
	background-position:center center;
	padding-bottom:20px;
}
#quickbooks-landing-header .container{ padding:0 20px; }
#quickbooks-landing-footer{
	background-image:url(ims/macbook-bg-2.jpg);
	background-size:cover;
	background-position:center center;
}
#quickbooks-landing .form-container{ margin-left: 70px; }
#quickbooks-landing-logo-quickbooks{
	width:150px;
	margin-top: 19px;
	margin-left:30px
}
/* Signup success mesage */
div.mc4wp-success { font-size: 20px; }
#quickbooks-landing-footer{ position: relative; height:150px; }
#quickbooks-landing-footer span{ display: block; margin: 10px 0; line-height: 150%; }
#quickbooks-landing-footer .container{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
}
#quickbooks-landing-footer .button{ margin-left:20px; }

@media screen and (min-width: 320px){
	#home-banner h1.headline{ font-size: 22px; }
	#home-banner h4{ font-size: 14px; }
}


@media screen and (min-width: 480px){
	#home-banner h1.headline{ font-size: 30px; }
	#home-banner h4{ font-size: 22px; }
}

@media screen and (min-width: 600px){

}

@media screen and (min-width: 768px){

	blockquote.wide{ margin: 0 15%; }

	section{ padding:55px 20px; }

	#menu-icon, #menu-icon-white{ display:none; }
	#home-navigation, #main-navigation, #login{ display:inline-block; }
	header #login{ border-left:1px solid #e0e0e0; position: absolute; right:20px; top:0; height:52px; padding:18px 0 0 15px; }
	header{ height:70px; }

	#home-banner{ height:600px; }
	#home-banner .container{ padding-top:24px; }

	#logo-home{ width:138px; }
	#logo{ width:138px; }

	#main-navigation{ width:auto; background:none; display:block; position: absolute; top: 15px; right: 310px; }
	#home-navigation li, #main-navigation li{ display:inline; width:auto; margin-left:10px; }
	#home-navigation li:last-child{
		border:1px solid #fff;
		padding: 3px 15px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		border-radius: 20px;
	}

	#home-banner h1.headline{ font-size: 48px; margin-top:80px; }

	.button{ padding: 9px 17px; margin:5px 10px 5px 0; }

	footer{ height:100px; text-align: left; }
	footer .container{ padding:30px 20px; }
	footer span{ margin-top: 5px; }
	footer .button{ float:right; margin-top:0; }

	.bg-quote-1{ padding-top: 120px; padding-bottom:120px;}
	.bg-quote-1 .container > span{ height:400px; }

	.overlay-top{ top:0; background-image: url('ims/overlays/1024-top.png'); background-size:1024px 100%; }
	.overlay-bottom{ bottom:0; background-image: url('ims/overlays/1024-bottom.png'); background-size:1024px 100%; }

	.screen{ padding:0; }
	.feature-boxes > .grid__col{ margin-bottom:15px; }

	.quote-box{ margin:0 50px; }

	.testimonials img{ margin:20px 0; }

	.pricing-box{ padding:17px 10px 17px 5px; }

	#tour-graph{
		position:relative;
		background: url('ims/line-graph-full.png') no-repeat;
		background-size:100%;
		height:450px;
		background-position: 0 40px;
	}
	#tour-graph > div:first-child{ position:absolute; top:0; left:0; width:400px; }
	#tour-graph-feature-box-1{ position: absolute; top: 8.5%; left: 51.5%; width: 144px; height: 80px; font-size: 10px; }
	#tour-graph-feature-box-2{ position:absolute; top: 53.9%; left: 66.5%; width: 144px; height: 80px; font-size: 10px; }
	.tour-graph-feature-box p{ line-height: 120%; }

	#budgeting-chart{ width: 108%; margin: 0 -4%; }

	.simplemodal-overlay{ background-color: #fff; opacity:0.8 !important; }
	.simplemodal-data{
		-webkit-box-shadow: 10px 11px 15px -12px rgba(0,0,0,0.75);
		-moz-box-shadow: 10px 11px 15px -12px rgba(0,0,0,0.75);
		box-shadow: 10px 11px 15px -12px rgba(0,0,0,0.75);
		display:block;
		position: static;
		border-radius: 3px;
		border:1px solid #dfdfdf;
		background-color: #fff;
		width:450px;
		height:auto;
		padding:25px 50px;
	}
	#modal h2{ margin-bottom: 20px; }
	

	#simplemodal-container a.modalCloseImg {
		background:url('ims/x.png') no-repeat; /* adjust url as required */
		width:25px;
		height:29px;
		display:inline;
		z-index:3200;
		position:absolute;
		top:-15px;
		right:-18px;
		cursor:pointer;
	}

	.contact-middle-column{ border-left:1px solid #ccc; border-right:1px solid #ccc;}

	.hero-image{ padding:100px 0 120px; }
	.hero-image .container{ padding:0; }

	#quickbooks-landing-header{ height:600px; }
	#quickbooks-landing-logo-quickbooks{
		width:165px;
		margin-left:38px
	}
	#quickbooks-landing-footer{ height:380px; }
	#quickbooks-landing-footer span{ display: inline; }
	#quickbooks-landing .form-container{ margin-left: 70px; margin-top:20px; }

}

@media screen and (min-width: 1024px){

	.desktop-only{ display:block; }
	.mobile-only{ display:none; }

	section{ padding:55px 0; }

	footer .container{ padding:30px 0; }

	#logo{ margin-left:0; }

	header #login{ right:0; padding:18px 0 0 30px; }

	#home-navigation li, #main-navigation li{ margin-left: 30px; }

	.pricing-boxes{ margin-left:50px; margin-right:50px; }
	.pricing-box{ padding:17px 10px 17px 15px;}

	.overlay-top{ top:0; background-image: url('ims/overlays/1400-top.png'); background-size:1400px; }
	.overlay-bottom{ bottom:0; background-image: url('ims/overlays/1400-bottom.png'); background-size:1400px; }

	#quickbooks-landing-header .container{ padding:0px; }

}

@media screen and (min-width: 1382px){
	.overlay-top{ top:0; background-image: url('ims/overlays/1400-top.png'); background-size:100%; }
	.overlay-bottom{ bottom:0; background-image: url('ims/overlays/1400-bottom.png'); background-size:100%; }
}

.ninja-forms-form-wrap{ width:100%; margin-top: 30px; }
.field-wrap{ margin-bottom:20px; }
.ninja-forms-form-wrap input[type=text], .ninja-forms-form-wrap textarea{
	width:100%;
	border:none;
	background-color: #ebebeb;
	padding:8px 10px;
}
.ninja-forms-form-wrap select{
	border:none;
	background-color: #EFEFEF;
	border: 1px solid #DFDFDF;
}
.ninja-forms-form-wrap input[type=submit]{
	 color:#FFF;
	 font-size:15px;
	 font-weight:bold;
	 padding:10px 20px;
	 margin:10px 0;
	 border:none;
}
.ninja-forms-form-wrap  .ninja-forms-form .list-checkbox-wrap ul{
	margin:15px 0 30px;
}
.ninja-forms-form-wrap  .ninja-forms-form .list-checkbox-wrap ul li{
	float: none;
}
.ninja-forms-req-symbol{ color: #FF4500 !important; }

.ninja-forms-error-msg{
	padding:10px 13px;
	margin-bottom: 30px;
	background-color: #FF4500;
	color: #FFF;
}

.ninja-forms-field-error{ display:none; }

.ninja-forms-form-wrap label{ color: #46a0de; font-weight: bold !important;}

ul.list-answer { list-style:none; }
.mc4wp-form span.req { font-size: 20px; }
.mc4wp-form-132 label { color: #4a4f5a; }
