html,
body
{
	font-family: wf_SegoeUI, "Segoe UI", "Segoe WP", Tahoma, Verdana, Arial, sans-serif;
	font-size: 20px;
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	max-width: 100%;
	-webkit-font-smoothing: antialiased;
	min-width: 320px;
}

html.overlayShown
{
	overflow-y: hidden;
}

body
{
	overflow: hidden;
}

.center
{
	text-align: center;
}

.title
{
	font-family: "Segoe UI Light","Helvetica Neue UltraLight","Open Sans",arial,sans-serif;
	font-weight: 300;
	font-size: 1.75em;
}

a
{
	color: #0080e0;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

/* Buttons
 */

a .button
{
	text-decoration: none;
}

.button
{
	background: #0080e0;
	padding: 15px 30px;
	line-height: 30px;
	color: white;

	display: inline-block;

	cursor: pointer;

	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.button:hover
{
	background: #008ffa;
}

.button:active
{
	background: #0071c7;
}

/* Header
 */

.header
{
	height: 85px;
	font-size: 16px;
}

.header .logo
{
	position: absolute;
	left: 0px;
}

.header .buttons
{
	position: absolute;
	right: 0px;
}

.header .buttons a
{
	margin-left: 30px;
	text-decoration: none;
	color: white;
	padding: 10px 20px;
}

.header .buttons a.active,
.header .buttons a:hover
{
	text-decoration: none;
	background: rgba(255,255,255,0.2);
	padding: 5px 20px;
}

/* Footer
 */

.footer 
{
	margin-top: 10px;
	font-size: 16px;
	color: #666;
	min-height: 72px;
	line-height: 72px;
}

.footer .content
{
	padding: 0px;
}

.footer .links 
{
	position: absolute;
	right: 0px;
}

.footer .links a 
{
	text-decoration: none;
	margin-left: 15px;
	color: #666;
}

/* Content
 */

.content
{
	position: relative;
	width: 1000px;
	left: 50%;
	margin-left: -500px;
	padding: 30px 0px;
}

.content .left
{
	display: inline-block;
	width: 480px;
	vertical-align: top;
	margin-right: 20px;
}

.content .right
{
	display: inline-block;
	width: 450px;
}

.content .triple
{
	display: inline-block;
	width: 320px;
	vertical-align: top;
	margin-right: 30px;
	text-align: center;
}

.content .triple:first-child
{
	width: 300px;
}

.content .triple:last-child
{
	width: 300px;
	margin-right: 0px;
}

.content .title
{
	padding-bottom: 16px;
	white-space: nowrap;
}

.content .description
{
	line-height: 40px;
	color: #666;
	margin-bottom: 20px;
}

.content .quote
{
	line-height: 40px;
	color: #666;
	font-style: italic;
}

.content .name b,
.content .quote b
{
	color: #555;
}

.content .name 
{
	margin-top: 10px;
	line-height: 48px;
	color: #666;
}

.alt 
{
	background: #fafafa;
}

.content.aboard .left
{
	margin-top: 240px;
	padding-right: 26px;
}

.content.mobile .right 
{
	margin-top: 220px;
	margin-left: 20px;
}

.content.admin .left
{
	width: 300px;
}

.content.admin .learn
{
	padding-bottom: 50px;
}

.content.admin .left.features
{
	margin-top: 20px;
	padding-right: 26px;
}

.content .features .title
{
	font-size: 24px;
	padding-top: 0px;
	font-weight: normal;
}

.content .features .description
{
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 40px;
	padding-bottom: 0px;
}

.content .features .description:last-child
{
	margin-bottom: 0px;
}

.content .left img
{
	width: 550px;
	text-align: right;
	position: absolute;
	right: 0px;
	margin-right: -40px;
	clip: rect(0px, 900px, 700px, 0px);
}

.content.mobile .left
{
	position: relative;
	height: 670px;
}

.right .screenshot img
{
	width: 1076px;
}


/* Homepage
 */

.homepage 
{
	width: 100%;
	height: 100%;
	background: #0080e0;
	overflow: hidden;
}

.homepage .left
{
	position: absolute;
	left: 0px;
	top: 0px;
	bottom: 0px;
	width: 50%;
	background: #ffffff;
	color: #333;
}

.homepage .right
{
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	width: 50%;
	color: white;

	background: url("/shared/images/business/hero.stars.jpg") no-repeat scroll center center;
	background-size: cover;
}

.homepage .footer
{
	position: absolute;
	bottom: 0px;
	width: 100%;
}

.homepage .footer .copyright
{
	position: absolute;
	right: 0px;
	width: 50%;
	text-align: center;

	color: white;
	color: rgba(255,255,255,0.9);
}

.homepage .footer .links
{
	width: 50%;
	text-align: center;
	left: 0px;
}

.homepage .footer .links a:hover
{
	text-decoration: underline;
}

.homepage .right .darken
{
	height: 100%;
}

.homepage .buttons
{
	margin-top: 40px;
}

.homepage .business
{
	position: absolute;
	width: 500px;

	left: 50%;
	margin-left: -250px;

	top: 50%;
	margin-top: -126px;
}

.homepage .business .title
{
	line-height: 57px; 
	margin-bottom: 40px;
}

.homepage .personal
{
	position: absolute;
	width: 500px;

	left: 50%;
	margin-left: -250px;

	top: 50%;
	margin-top: -126px;
}

.homepage .personal .buttons
{
	width: 500px;
}

.homepage .ticker
{
	font-size: 16px;
	margin-top: 40px;
}

.homepage .personal .ticker a
{
	color: #666;
}

.homepage .business .ticker a 
{
	color: white;
}

.homepage .business .ticker a b
{
	color: #809eb6;
}

.homepage .signin
{
	position: absolute;
	top: 30px;
	right: 30px;
	font-size: 16px;
}

.homepage .signin a
{
	color: white;
	color: rgba(255,255,255,0.9);
	padding: 5px 20px;
}

.homepage .signin a:hover,
.homepage .signin a:active
{
	color: white;
	text-decoration: none;
	background: rgba(255,255,255,0.2);
}

.homepage .left .logo img
{
	width: 300px;
	height: 57px;
	margin-bottom: 40px;
}

.homepage .left .button
{
	margin: 0px 10px;
	width: 160px;
}

.homepage .left .button.pro
{
	background: #00c080;
}

.homepage .left .button.pro:hover
{
	background: #00da91;
}

.homepage .left .button.pro:active
{
	background: #00a76f;
}

.homepage .right .button
{
	background: #fafafa;
	color: #0080e0;

	width: 400px;
}

.homepage .right .button:hover
{
	background: white;
}

/* Business hero shot
 */

.hero
{
	background: url("/shared/images/business/hero.stars.jpg") no-repeat scroll center center;

	background-size: cover;
	height: 440px;
	color: white;
	text-align: center;
}

.darken
{
	background: rgba(0,84,148,0.7);
	width: 100%;
	height: 440px;
	position: absolute;
	top: 0px;
}

.hero.shorter,
.hero.shorter .darken
{
	height: 84px;
}

.hero .title
{
	font-size: 2.375em;
	padding-bottom: 32px;
}

.hero .slogan
{
	padding-bottom: 32px;
}

.hero .blurb
{
	position: relative;
	margin-top: 0px;
	margin-left: -300px;
	left: 50%;
	width: 600px;
	font-size: 20px;
	line-height: 30px;
}

.hero .signup 
{
	width: 900px;
	margin-left: -150px;
	position: relative;
}

.signup input
{
	height: 56px;
	vertical-align: top;
	margin-right: 10px;
	width: 268px;
	font-size: 20px;
	padding-left: 20px;
	border: 1px solid #dadada;
}

.signup .status,
.signup .warning
{
	background: #f7ca18;
	color: #333;
	position: relative;
	text-align: center;
	left: 15px;
	width: 870px;
	top: -10px;
	font-size: 16px;
	line-height: 30px;
	padding: 5px 0px;

	display: none;
}

.signup .warning a
{
	color: #0040a0;
}

.alt .signup .status,
.alt .signup .warning
{
	position: relative;
	top: 0px;
	margin-bottom: 10px;
	left: 64px;
}

.signup .status
{
	background: #71c700;
}

.button.disabled,
.button.disabled:hover,
.button.disabled:active
{
	background: #005494;
	cursor: default;
	color: #809eb6;
}

.signup input.error
{
	background: #ffe2e3;
}

.signup_instructions
{
	margin-top: 10px;
	font-size: 16px;
	line-height: 24px;
}

.hero .signup_instructions
{
	color: #809eb6;
}

.alt .signup_instructions
{
	color: #999;
}


.hero .signup_instructions a
{
	color: white;
}

/* Learn more 
 */

.learn
{
	color: #0080e0;
	cursor: pointer;
	display: inline-block;
}

.learn:hover .text
{
	text-decoration: underline;
}

.learn:hover .arrow
{
	text-decoration: none;
}

.overlay
{
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.98);
	display: none;

	text-align: center;
}

.overlay .overlay_container
{
	display: table;

	position: absolute;
	margin: 0px 40px;
	height: 100%;
}

.overlay .overlay_content
{
	display: table-cell;
	vertical-align: middle;
	height: 100%;
	margin: 20px;
}

.overlay .close
{
	position: fixed;
	right: 50px;
	top: 20px;
	font-size: 60px;
	
	cursor: pointer;
}

.overlay .close:hover
{
	color: #0080e0;
}

.overlay .question
{
	font-family: "Segoe UI Light","Helvetica Neue UltraLight","Open Sans",arial,sans-serif;
	font-weight: bold;
	text-align: left;
	margin-top: 30px;
}

.overlay .question:first-child
{
	margin-top: 0px;
}

.overlay .answer
{
	color: #666;
	text-align: left;
	margin-top: 20px;
	line-height: 30px;
}

/* Pricing
 */

.form
{
	border: 1px solid #dadada;
	margin-top: 20px;
	font-size: 16px;
	padding-bottom: 120px;
	display: inline-block;
	width: 500px;
	position: relative;
}

.form .price
{
	position: relative;
	background: #fafafa;
	padding: 20px 30px;
	border-bottom: 1px solid #dadada;
	margin-bottom: 20px;
}

.form .price .value
{
	font-size: 40px;
	font-family: "Segoe UI Light","Helvetica Neue UltraLight","Open Sans",arial,sans-serif;
	font-weight: 300;
	line-height: 80px;
}

.form .price .units
{
	margin-left: 10px;
	font-family: "Segoe UI Light","Helvetica Neue UltraLight","Open Sans",arial,sans-serif;
	font-weight: 300;
	font-size: 30px;
}

.form .item
{
	padding-bottom: 10px;
}

.form .label
{
	padding: 0px 30px;
	min-width: 200px;
	display: block;
	line-height: 40px;
}

.form select,
.form input[type=text],
.form textarea
{
	height: 34px;
	margin: 0px 30px;
	padding: 0px 10px;
	width: 420px;
	border: 1px solid #dadada;
	font-size: 16px;
	font-family: "Segoe UI", "Helvetica Neue", "Open Sans", arial, sans-serif;
}

.form input.error
{
	background: #ffe2e3;
}

.form select
{
	width: 442px;
}

input[type=checkbox] 
{
	display: none;
}

ul
{
	padding: 0px 20px;
	margin: 0px 0px 20px 0px;
}

li
{
	margin-bottom: 10px;
}

.form textarea
{
	height: 80px;
	padding: 10px 10px;
}

.form .button
{
	margin: 30px;
	position: absolute;
	right: 0px;
}

.form .status
{
	position: absolute;
	margin: 30px;
}

.information
{
	display: inline-block;
	width: 460px;
	padding: 70px 0px 0px 30px;
	vertical-align: top;
	font-size: 16px;
}

@media (max-width: 1080px)
{
	.homepage 
	{
		font-size: 18px;
	}

	.homepage .buttons
	{
		margin-top: 36px;
	}

	.homepage .business
	{
		width: 450px;
		margin-left: -225px;
		margin-top: -113px;
		font-size: 18px;
	}

	.homepage .personal
	{
		width: 450px;
		margin-left: -225px;
		margin-top: -113px;
	}

	.homepage .personal .buttons
	{
		width: 450px;
	}

	.homepage .ticker
	{
		font-size: 14px;
		margin-top: 36px;
	}

	.homepage .signin
	{
		top: 27px;
		right: 27px;
		font-size: 14px;
	}

	.homepage .signin a
	{
		padding: 4px 18px;
	}

	.homepage .footer 
	{
		min-height: 65px;
		line-height: 65px;
		font-size: 14px;
	}

	.homepage .left .logo img
	{
		width: 270px;
		height: 51px;
		margin-bottom: 36px;
	}

	.homepage .left .button
	{
		margin: 0px 9px;
		width: 144px;
		line-height: 27px;
		padding: 13px 27px;
	}

	.homepage .right .button
	{
		width: 360px;
		line-height: 27px;
		padding: 13px 27px;
	}

	.homepage .right .title
	{
		font-size: 1.575em;
		line-height: 51px;
		margin-bottom: 36px;
	}

	.inhouse .content,
	.business .content
	{
		width: 800px;
		margin-left: -400px;
		padding: 24px 0px;
	}

	.inhouse,
	.business 
	{
		font-size: 16px;
	}

	.business .hero .blurb .slogan
	{
		padding-bottom: 25px;
		white-space: nowrap;
	}

	.inhouse.footer,
	.business.footer
	{
		font-size: 13px;
		line-height: 60px;
	}

	.business.footer .content,
	.inhouse.footer .content
	{
		padding: 0px;
	}

	.business .hero,
	.business .darken
	{
		height: 352px;
	}

	.inhouse .header,
	.business .header
	{
		font-size: 13px;
		height: 68px;
	}

	.inhouse .header .logo img,
	.business .header .logo img
	{
		width: 124px;
		height: 24px;
	}

	.business .hero .title
	{
		font-size: 1.9em;
		padding-bottom: 25px;
	}

	.business .hero .blurb
	{
		font-size: 16px;
		line-height: 24px;
	}

	.inhouse .button,
	.business .button
	{
		line-height: 24px;
		padding: 12px 24px;
	}

	.business .title
	{
		font-size: 1.4em;
	}

	.business .content .left
	{
		width: 384px;
	}

	.business .content .right
	{
		width: 360px;
	}

	.business .content .description
	{
		line-height: 32px;
	}

	.business .right .screenshot img
	{
		width: 860px;
	}

	.business .content.mobile .left
	{
		height: 536px;
	}

	.business .content.mobile .right
	{
		margin-top: 176px;
		margin-left: 16px;
	}

	.business .content.admin .left
	{
		width: 307px;
		padding-right: 21px;
	}

	.business .content .features .title
	{
		font-size: 19px;
	}
	
	.business .content .features .description
	{
		line-height: 19px;
		font-size: 14px;
	}

	.business .left img
	{
		width: 440px;
		margin-right: 0px;
		clip: rect(0px, 720px, 560px, 0px);
	}

	.overlay .question
	{
		font-size: 16px;
		margin-top: 24px;
	}

	.overlay .answer
	{
		font-size: 16px;
		line-height: 24px;
		margin-top: 16px;
	}

	.inhouse .hero.shorter,
	.inhouse .hero.shorter .darken
	{
		height: 67px;
	}

	.inhouse .form
	{
		width: 400px;
		margin-top: 16px;
		font-size: 13px;
		padding-bottom: 0px;
	}

	.inhouse .form .price
	{
		padding: 16px 24px;
		margin-bottom: 16px;	
	}

	.inhouse .form .price .value
	{
		font-size: 32px;
		line-height: 64px;
	}
	
	.inhouse .form .price .units
	{
		margin-left: 8px;
	}

	.inhouse .form .item
	{
		padding-bottom: 8px;
	}

	.inhouse .form .label
	{
		padding: 0px 24px;
		min-width: 160px;
		line-height: 32px;
		font-size: 13px;
	}

	.inhouse .form select,
	.inhouse .form input[type=text],
	.inhouse .form textarea
	{
		height: 27px;
		margin: 0px 24px;
		padding: 0px 8px;
		width: 336px;
		font-size: 13px;
	}

	.inhouse .form select
	{
		width: 353px;
	}

	.inhouse .form textarea
	{
		height: 64px;
	}

	.inhouse .form .status,	
	.inhouse .form .button	
	{
		margin: 24px;
		position: relative;
		right: auto;
	}

	.inhouse .information
	{
		width: 368px;
		padding: 56px 0px 0px 24px;
		font-size: 13px;
	}

	.inhouse .content .title
	{
		padding-bottom: 13px;
		font-size: 1.4em;
	}

	.business .hero .signup 
	{
		width: 720px;
		margin-left: -40px;
	}

	.business .signup input
	{
		height: 44px;
		margin-right: 8px;
		width: 214px;
		font-size: 16px;
		padding-left: 16px;
	}

	.business .signup_instructions
	{
		margin-top: 8px;
		font-size: 13px;
		line-height: 19px;
	}

	.signup .status,
	.signup .warning
	{
		left: 12px;
		width: 696px;
		top: -8px;
		font-size: 13px;
		line-height: 24px;
		padding: 4px 0px;
	}

	.alt .signup .status,
	.alt .signup .warning
	{
		margin-bottom: 8px;
		left: 51px;
	}
}

@media (max-width: 880px)
{
	.homepage 
	{
		font-size: 16px;
	}

	.homepage .buttons
	{
		margin-top: 32px;
	}

	.homepage .business
	{
		width: 400px;
		margin-left: -200px;
		margin-top: -100px;
		font-size: 16px;
	}

	.homepage .personal
	{
		width: 400px;
		margin-left: -200px;
		margin-top: -100px;
	}

	.homepage .ticker
	{
		font-size: 13px;
		margin-top: 32px;
	}

	.homepage .personal .buttons
	{
		width: 400px;
	}

	.homepage .signin
	{
		top: 24px;
		right: 24px;
		font-size: 13px;
	}

	.homepage .signin a
	{
		padding: 4px 16px;
	}

	.homepage .footer 
	{
		min-height: 58px;
		line-height: 58px;
		font-size: 13px;
	}

	.homepage .left .logo img
	{
		width: 240px;
		height: 46px;
		margin-bottom: 32px;
	}

	.homepage .left .button
	{
		margin: 0px 8px;
		width: 128px;
		line-height: 24px;
		padding: 12px 24px;
	}

	.homepage .right .button
	{
		width: 320px;
		line-height: 24px;
		padding: 12px 24px;
	}

	.homepage .right .title
	{
		font-size: 1.4em;
		line-height: 46px;
		margin-bottom: 32px;
	}

	.inhouse .header .logo,
	.business .header .logo
	{
		left: 20px;
	}

	.inhouse .content,
	.business .hero .blurb,
	.business .content
	{
		width: 100%;
		left: 0px;
		margin-left: 0px;
	}

	.business .hero .blurb .slogan 
	{
		margin-left: 20px;
		margin-right: 20px;
	}

	.business .hero,
	.business .darken
	{
		height: 452px;
	}

	.business .content .title
	{
		white-space: normal;
		text-align: center;
		margin-left: 20px;
		margin-right: 20px;
	}

	.business .content .description,
	.business .content .learn
	{
		text-align: center;
		margin-left: 20px;
		margin-right: 20px;
		display: block;
	}

	.business .content .right,
	.business .content .left
	{
		display: inline-block;
		width: 100%;
	}

	.business .content.aboard .left,
	.business .content.mobile .left,
	.business .content.mobile .right
	{
		padding-right: 0px;
		margin-top: 0px;
		margin-bottom: 20px;
		margin-left: 0px;
		margin-right: 0px;
	}

	.business .content.mobile .right
	{
		margin-bottom: 0px;
	}

	.business .content .features
	{
		display: none;
	}

	.business .content.mobile .left
	{
		height: 556px;
	}

	.business .content .left img
	{
		right: auto;
		margin-left: -220px;
		left: 50%;
		text-align: center;
	}

	.inhouse.footer .links,
	.business.footer .links,
	.inhouse.footer .copyright,
	.business.footer .copyright
	{
		font-size: 14px;
		text-align: center;
		display: block;
		position: relative;
		right: auto;
		line-height: 50px;
	}

	.overlay
	{
		position: fixed;
		z-index: 9999;
	}
	
	.overlay .close
	{
		position: relative;
		text-align: right;
		top: 0px;
	}

	.overlay .overlay_container
	{
		display: block;
		margin: 0px;
		position: absolute;
		top: 80px;
		bottom: 0px;
		overflow-y: scroll;
		height: auto;
	}

	.overlay .overlay_content
	{
		display: block;
		height: auto;
		vertical-align: top;
	}

	.business .hero .signup 
	{
		width: 100%;
		margin: 0px;
		text-align: center;
	}

	.business .hero .signup .status,
	.business .hero .signup .warning
	{
		left: 0px;
		width: 100%;
		top: -8px;
	}

	.business .alt .signup .status,
	.business .alt .signup .warning
	{
		left: 0px;
		width: 100%;
	}

	.business .signup .input
	{
		display: block;
		margin: 0px;
		margin-bottom: 10px;	
	}

	.business .signup input
	{
		margin-right: 0px;
		width: 196px;
	}
	
	.inhouse .form
        {
		display: block;
		width: auto;
		margin: 30px;
		padding: 0px;
		text-align: center;
	}

	.inhouse .information
        {
		display: block;
		width: auto;
		margin: 30px;
		padding: 0px;
	}

	.inhouse .content .title
        {
		text-align: center;
	}

	.inhouse .form .price .value
	{
		font-size: 30px;
		line-height: 50px;
	}

	.inhouse .form textarea,
	.inhouse .form input[type=text]
	{
		width: 296px;
	}

	.inhouse .form select
	{
		width: 318px;
	}

	.inhouse ul
	{
		text-align: center;
	}	
}

@media (max-width: 820px)
{
	.homepage .footer .copyright,
	.homepage .footer .links,
	.homepage .right, 
	.homepage .left 
	{
		width: 410px;
	}

	.homepage .signin
	{
		width: 790px;
		text-align: right;
		left: 0px;
	}

	.footer .links,
	.homepage .right
	{
		left: 410px;
	}
}

@media (max-width: 500px)
{
	.business .hero .blurb .slogan 
	{
		font-size: 12px;
	}

	.homepage .left
	{
		width: 100%;
	}

	.homepage .signin,
	.homepage .right
	{
		display: none;
	}
}

