body, h1, h2, h3, h4, h5, h6 {
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	letter-spacing: 0;
}

p {
	font-size: 1.2em;
}

a {
	-webkit-transition: .15s all linear;
	-moz-transition: .15s all linear;
	-o-transition: .15s all linear;
	transition: .15s all linear;
	color: rgb(15,168,196);
}

a:hover {
	color: #666;
}


.button, .button.is-secondary, .button.is-small,
.button:active, .button.is-secondary:active, .button.is-small:active,
.button:focus, .button.is-secondary:focus, .button.is-small:focus {
	border-radius: 50px;
	border: 0 none;
	background-color: rgb(15,168,196);
}

.button:hover, .button.is-secondary:hover, .button.is-small:hover {
	background-color: #bca332;
}

.button.is-big, .button.is-big:active, .button.is-big:focus {
	border: 0 none;
	border-radius: 50px;
	padding: 1.6em 2.8em;
	font-size: 1em;
	font-weight: 900;
	letter-spacing: .2em;
	text-transform: uppercase;
	background-color: #fff;
	color: rgb(15,168,196);
}

.button.is-secondary {
	color: #fff;
	background-color: rgb(15,168,196);
}

.button.is-big:hover {
	color: #fff;
	background-color: #bca332;
}

#four-o-four .content {
	max-width: 900px; 
	padding-bottom: 100px;
}

#four-o-four h2 {
	font-size: 4.5em;
	font-weight: bold;
	font-style: italic;
}

header {
	padding: 28px 0 20px;
	background-color: #fff;
}

.is-navbar-container {
	padding: 0 5%;
}

header h1, header b {
	margin-top: 0 !important;
}

body.landing header h1, body.support-page header h1, body.error header h1 {
	display: block;
	width: 170px;
	height: 0;
	padding-top: 35px;
	overflow: hidden;
	background: url("../img/TRAC-logo-black.png") no-repeat left top;
	background-size: auto 100%;
}

nav.is-push-right ul li {
	margin-left: 16px;
}

nav.is-push-right ul li {
	padding-right: 16px;
	border-right: 1px solid #e6e6e6;
}

nav.is-push-right ul li a:first-child {
	padding-right: 0;
}

nav.is-push-right ul li.last,
nav.is-push-right ul li:last-child {
	border: 0 none;
}

nav.is-push-right ul li.last a,
nav.is-push-right ul li:last-child {
	padding-right: 0;
}

nav.is-push-right ul li:last-child {
	margin-left: 20px;
}

.is-brand, .is-brand a, nav.is-push-right ul li a {
	font-size: 11.5px;
	font-weight: 900;
	color: #9e9e9e;
	letter-spacing: .11em;
	text-transform: uppercase;
	text-decoration: none;
}

nav.is-push-right ul li a {
	text-decoration: none;
	border-bottom: 1px dotted #9e9e9e;
}

nav.is-push-right ul li a:hover {
	color: #bca332;
	border-bottom: 1px solid #fff;
}

nav.is-push-right .button {
	padding: 14px 32px 14px 30px;
	border-radius: 30px;
	border-bottom: 0;
	background-color: #bca332;
	font-size: 11.5px;
	font-weight: 900;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: #fff;
}

nav.is-push-right .button:hover {
	background-color: rgb(15,168,196);
}

nav.is-push-right .button span.icon-kube-menu {
	font-size: 22px;
	margin-top: -2px;
	padding-left: 5px;
}

#offcanvas-menu {
	padding-top: 100px;
	background-color: #157cc0;
}

#offcanvas-menu ul {
	padding-bottom: 25px;
}

#offcanvas-menu ul li {
	list-style: none;
	margin-bottom: 8px;
	font-size: 1.1em;
}

#offcanvas-menu ul li a {
	text-decoration: none;
}

a.page-nav {
	max-width: 275px;
	display: block;
	margin: 20px auto;
	padding-bottom: 70px;
	text-transform: uppercase;
	font-size: .85em;
	font-weight: 900;
	letter-spacing: .12em;
	text-align: center;
	text-decoration: none;
	color: #838383;
	background: url("../img/arrow-gray.png") no-repeat bottom center;
	background-size: auto 50px;
}

a.page-nav:hover {
	color: rgb(15,168,196);
}

section a.page-nav {
	font-size: .71em;
}

.alert.is-error {
    margin: 10px 0 0;
}

/* INDIVIDUALS LANDING PAGE
====================================== */

#hero-wrapper a.page-nav {
	position: absolute;
	bottom: 1%;
	left: 50%;
    transform: translateX(-50%);
	color: rgba(255,255,255,.6);
	background-image: url("../img/arrow-white.png");
}

#hero-wrapper a.page-nav:hover {
	color: #fff;
}

#hero-wrapper {
	height: 65vh;
	min-height: 600px;
	position: relative;
	padding: 0;
	background: rgb(15,168,196) url("../img/hero-bkg.jpg") no-repeat center;
	background-size: cover;
}

#hero {
	width: 100%;
	text-align: center;
	color: #fff;
    position: absolute;
	padding: 0 25px;
    top: 50%;
	left: 50%;
     -ms-transform: translate(-50%, -55%);
     -webkit-transform: translate(-50%, -55%);
     -moz-transform: translate(-50%, -55%);
	 -o-transform: translate(-50%, -55%);
	 transform: translate(-50%, -55%);
}

#hero h2 {
	width: 100%;
	max-width: 700px;
	margin: 0 auto .6em;
	font-size: 3em;
	letter-spacing: -.02em;
}

#hero h3 {
	width: 100%;
	max-width: 670px;
	margin: 0 auto 2em;
	font-size: 1.55em;
	line-height: 1.45em;
}

span.br {
	display: block;
}

#hero h3 span.underline {
	text-decoration: underline;
}


section, footer {
	padding-top: 100px;
	background: url("../img/color-bars.png") no-repeat center 40px;
	background-size: 100% 34px;
}

section .content {
	max-width: 1200px;
	padding: 60px 5%;
	margin: 0 auto;
}

section .content h3 {
	margin-bottom: 20px;
	font-size: 2.2em;
	line-height: 1.3em;
}

section .content p {
	font-size: 1.2em;
}

section .content h4, .step h4 {
	margin-bottom: 18px;
	text-align: center;
	font-weight: 900;
	color: rgb(15,168,196);
}

section .content h4.icon, .step h4.icon {
	width: 70px;
	height: 0;
	margin: 0 auto;
	padding-top: 70px;
	overflow: hidden;
	background-color: rgb(15,168,196);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40px auto;
	font-size: 36px;
	font-weight: 900;
	text-align: center;
	line-height: 68px;
	color: #fff;
	border-radius: 50%;
}

.icon-t {
	background-image: url("../img/icon-t.png");
}

.icon-r {
	background-image: url("../img/icon-r.png");
}

.icon-a {
	background-image: url("../img/icon-a.png");
}

.icon-c {
	background-image: url("../img/icon-c.png");
}

.icon-1 {
	background-image: url("../img/icon-1.png");
}

.icon-2 {
	background-image: url("../img/icon-2.png");
}

.icon-3 {
	background-image: url("../img/icon-3.png");
}

section .content p.is-big {
	font-size: 1.35em;
}

#content-top-1 {
	max-width: 1100px;
}

#content-bottom-1 {
	padding-top: 80px;
	padding-bottom: 0;
	text-align: center;
}

#content-bottom-1 h3 {
	margin-bottom: 50px;
}

#content-bottom-1 h3 sup {
	font-size: .35em;
	font-weight: 400;
	bottom: -.5em;
}

.footnote small {
	font-size: .8em;
	font-weight: 400;
	line-height: 1.8em;
	color: #999;
}

section#How-TRAC-Works {
	padding-top: 70px;
	padding-bottom: 10px;
	background-image: url("../img/color-bars.png"), url("../img/bkg-track.jpg");
	background-repeat: no-repeat;
	background-size: 100% 34px, contain;
	background-position: center 10px, right 10px;
}

#content-top-2 h3 span.br {
	display: inline;
}

#content-top-2, .step {
	max-width: 1250px;
	padding-bottom: 30px;
	text-align: center;
}

.step {
	max-width: 860px;
	margin: 0 auto 30px;
	padding-bottom: 50px;
	background: url("../img/arrow-gray.png") no-repeat bottom center;
	background-size: auto 50px;
}

.step.last {
	padding-bottom: 0;
	background-image: none;
	margin-bottom: 60px;
}

section#How-TRAC-Works #cta {
	text-align: center;
}

section#How-TRAC-Works #cta .button {
	font-size: .85em;
}

section#Pricing .content {
	max-width: 900px;
	text-align: center;
}

section#Pricing #content-top-3 {
	padding-bottom: 36px;
}

section#Pricing .is-row {
	max-width: 840px;
	margin: 0 auto;
}

#Pricing.is-row {
	max-width: 800px;
	margin: 0 auto;
	padding-top: 40px;
	border-top: 1px solid #eee;
}

.pricing-table {
	padding: 0 8% 10%;
	background: #f7f7f7;
	text-align: center;
}

.pricing-table h3 {
	display: inline-block;
	margin-bottom: 41.5px;
	padding: 8px 20px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .2em;
	color: #fff;
	background-color: #bca332;
}

.pricing-table h4 {
	margin-bottom: 24px;
	font-weight: 900;
	color: rgb(15,168,196);
}

#Summary-Report {
	padding-top: 80px;
}

#Full-Report {
	border-left: 2px solid #e9e9e9;
}

.pricing-table p.price {
	margin: 30px auto 0;
	font-size: 2.6em;
	letter-spacing: -.05em;
}

.pricing-table p.price strong {
	font-weight: 300;
}

.pricing-table p.price-note {
	margin-bottom: 50px;
	font-size: 1.3em;
	color: #878787;	
}

.pricing-table p.price-note span {
	text-transform: uppercase;
	font-size: .75em;
	font-weight: bold;
}

.pricing-table .download {
	margin: 30px auto;
}

.pricing-table .download a {
	font-size: .7em;
	font-weight: 900;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #878787;
}

.pricing-table .download a:hover, .pricing-table .download a:focus {
	color: rgb(15, 168, 196);
	text-decoration: none;
}

.pricing-table .button {
	text-transform: uppercase;
	letter-spacing: .04em;
}

.pricing-table .footnote {
	margin-top: 24px;
	font-size: 1em;
	line-height: .8em;
}

section#Pricing #guarantee {
	padding-top: 36px;
}

#footnote-1, #footnote-2 {
	max-width: 770px;
	margin: 0 auto;
	padding: 40px 0 70px;
}

#footnote-2 {
	text-align: center;
	padding: 0 0 50px;

}

.parallaxie {
	height: 250px;
	background: #eee;
}

.parallaxie .parallax-bkg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

#divider-1.parallaxie {
	background-image: url("../img/divider-1.jpg");
}

#divider-2.parallaxie {
	background-image: url("../img/divider-2.jpg");
}

footer {
	text-align: center;
}

#top-footer {
	padding: 120px 5% 150px;
	background-color: rgb(15,168,196);
	color: #fff;
}

#top-footer div {
	max-width: 820px;
	margin: 0 auto;
}

#top-footer p:last-child {
	margin-bottom: 0;
}

#top-footer a {
	color: #fff;
}

#top-footer a:hover {
	text-decoration: none;
}

#lb-logo {
	display: block;
	max-width: 220px;
	height: auto;
	margin: 0 auto 40px;
}

#bottom-footer {
	padding: 30px 5% 80px;
	font-weight: 400;
	font-size: .75em;
	color: #999;
}

#bottom-footer span.br {
	display: inline;
}

#bottom-footer a {
	color: #999;
	text-decoration: none;
}

#bottom-footer a:hover, #site-credit:hover a {
	color: #666;
}

#bottom-footer a.kwd {
	width: 20px;
	height: 0;
	overflow: hidden;
	margin-left: 3px;
	padding-top: 20px;
	line-height: 20px;
	vertical-align: bottom;
	display: inline-block;
	background: url("../img/kwd-logo.png") no-repeat top center;
	background-size: auto auto;
	background-size: cover;
	opacity: .7;
}

#bottom-footer a.kwd:hover, #bottom-footer #site-credit:hover a.kwd {
	opacity: 1;
}

/* RETURNING LOGIN
====================================== */

.login .alert {
	max-width: 600px;
	margin-right: auto;
	margin-left: auto;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	
}

.login .alert.is-focus {
	border-color: rgba(15,168,196,.3);
	background-color: rgba(15,168,196,.07);
	color: rgb(15, 168, 196);
	text-align: center;
}

/* TAKE AGAIN
====================================== */

.take-again {
	max-width: 800px;
	margin: 0 auto;
	padding: 0 20px;
}

.take-again h3 {
	margin-bottom: 20px;
	font-size: 2.2em;
	line-height: 1.3em;
}

.take-again button {
	margin: 20px 0 40px;
}


/* ADMIN INVITE FORM
====================================== */

body.invite textarea {
	padding: 8px;
	resize: none;
	height: 38px;
}


/* SIGNUP FORM & PAGES
====================================== */

body.survey #top-footer, body.account #top-footer {
	padding-bottom: 100px;
}

#app {
	margin: 0 auto;
	padding-top: 100px;
	padding-bottom: 60px;
	background: url("../img/color-bars.png") no-repeat center top;
	background-size: 100% 34px;
}

#login-headline {
	width: 100%;
	max-width: 400px;
	text-align: center;
	margin: 0 auto;
}

#login-headline h3 {
	font-size: 2.2em;
	line-height: 1.3em;
	margin-bottom: 20px;
}

#login-headline p {
	margin-bottom: 20px;
	line-height: 1.6em;
}

#login_nav {
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
	padding-bottom: 40px;
	border-bottom: 1px solid #eee;
	text-align: center;
}

#login_nav a {
	width: auto;
	height: 44px;
	line-height: 44px;
	display: inline-block;
	text-align: center;
	margin: 0 8% 0 0;
	padding: 0;
	border: 0 none;
	border-left: 1px solid #fff;
	font-size: .9em;
	font-weight: 700;
	color: #9e9e9e;
	letter-spacing: .03em;
	text-decoration: none;
}

#login_nav a:last-child {
	margin-right: 0;
}

#login_nav a.selected {
	color: #0FA8C4;
}

#login_nav a.selected span {
	background-color: #0FA8C4;
}

#login_nav a span {
	position: relative;
	display: inline-block;
	height: 0;
	overflow: hidden;
	margin: 0 5px 0 0;
	padding-top: 44px;
	width: 44px;
	top: 15px;
	line-height: 44px;
	border-radius: 50%;
	background: url("../img/icon-1.png") no-repeat center;
	background-size: auto 23px;
	background-color: #9e9e9e;
}

#login_nav a#step-two span {
	background-image: url("../img/icon-2.png");
}

#login_nav a#step-three span {
	background-image: url("../img/icon-3.png");
}

#login_nav .already-have-account a {
	font-size: .8em;
	font-weight: 400;
}

#login_nav .already-have-account a:hover {
	color: #0FA8C4;
}

p#help-link, form#form_start small {
	text-align: center;
	font-size: .95em;
	font-weight: 400;
	font-style: italic;
	line-height: 1.3em;
}

p#help-link a {
	color: #9e9e9e;
	text-decoration: none;
}

p#help-link a:hover {
	color: #0FA8C4;
}

form#form_start {
	max-width: 500px;
	margin: 40px auto;
}

form #step_paying_for, form #step_account_type {
	text-align: center;
}
form #step_account_type p {
    font-size: 1.5em;
}
form #step_account_type p a {
	font-size: 1em;
    margin-bottom: 30px;
    font-style: italic;
}

form #step_paying_for p {
	font-size: 1.5em;
	margin-bottom: 30px;
}

form#form_start input[type="radio"] + label, form#form_start button {
	border-radius: 50px;
	background-color: #9e9e9e;
	border: 0 none;
	border-radius: 50px;
	margin-bottom: 15px;
	margin-right: 5px;
	padding: 1.6em 2.8em;
	font-size: .9em;
	font-weight: 900;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #fff;
	cursor: pointer;
	-webkit-transition: .15s all linear;
	-moz-transition: .15s all linear;
	-o-transition: .15s all linear;
	transition: .15s all linear;
}

form#form_start input[type="radio"] + label:hover, form#form_start input[type="radio"]:checked + label {
	background-color: #0FA8C4;
}

input[type="radio"]:checked + label {
	background-color: #0FA8C4;
}

form#form_start button {
	display: block;
	margin: 40px auto 0;
	background-color: #0FA8C4;
}

form#form_start button:hover, form#form_start button:focus, form#form_start button:active {
	background-color: #bca332;
}

form#form_start input[type="text"] {
	height: auto;
	border: 0 none;
	border-radius: 0;
	border-bottom: 1px solid #eee;
	margin-bottom: 12px;
	padding: 16px;
	font-size: 1.1em;
}

input:focus, select:focus, textarea:focus {
    -moz-transition: all linear .2s;
    transition: all linear .2s;
    outline: 0;
    color: #212121;
    background-color: #eee;
    border: 0 none;
    box-shadow: none;
}

form#form_start input[type="text"]:focus {
	border-radius: 4px;
	border-bottom: 1px solid #fff;
}

#login_first_name, #login_last_name {
	width: 49%;
	display: inline-block;
}

#login_first_name {
	margin-right: 1%;
}

form#form_start small, form#form_start small a {
	display: block;
	padding: 10px 0 0;
	color: #999;
}

form#form_start #age-wrapper, form#form_start #coach-wrapper {
	padding: 36px 0 0;
	text-align: center;
}

form#form_start label.is-big {
	margin-bottom: 15px;
	font-size: 1.5em;
	font-weight: 300;
}

form#form_start #age-wrapper input[type="radio"] + label,
form#form_start #coach-wrapper input[type="radio"] + label {
	display: inline-block;
	padding: 1.2em 2em;
}

form#form_start #coach-wrapper {
	padding: 24px 0;
}

#terms-window {
	height: 180px;
	width: 90%;
	margin: 30px auto;
	padding: 15px;
	overflow: scroll;
	font-size: .7em;
	font-weight: 400;
	color: #9e9e9e;
	border: 1px solid #ccc;
	border-radius: 3px;
	background: #eae8eb;
}

#terms-window h4 {
	font-weight: 400;
	color: #666;
}

form#form_start small.pricing_link, form#form_start small.pricing_link a {
    padding: 0 0 15px;
    text-decoration: none;
    -webkit-transition: .15s all linear;
    -moz-transition: .15s all linear;
    -o-transition: .15s all linear;
    transition: .15s all linear;
}

form#form_start small.pricing_link a:hover {
    color: rgb(15,168,196);
}

body.survey #pricing {
    max-width: 840px;
    margin: 0 auto;
    padding-top: 30px;
}

body.survey #pricing h4 {
    margin-bottom: 24px;
    text-align: center;
    color: rgb(15,168,196);
}

body.survey #pricing .button.is-secondary {
    background-color: rgb(15,168,196);
}

body.survey #pricing .button.is-secondary:hover {
    background-color: #bca332;
}

body.survey #pricing #guarantee {
    padding-top: 36px;
    text-align: center;
}

.modal .close:hover {
    background-color: #eae8eb;
}

.modal-header {
    padding: 42px 24px 15px;
    font-size: 1.95rem;
    font-weight: 100;
    text-align: center;
}

.modal-body {
    padding: 0px 24px 24px;
    text-align: center;
}

.modal-body p {
    margin-bottom: 22px;
}

.dropdown a.is-separator, .modal-header {
    border-bottom: 0 none;
}

#stripe_upgrade {
    margin: 0 auto;
    padding: 1.6em 2.8em;
    font-size: .85em;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .13em;
    background-color: rgb(15,168,196);
}

#stripe_upgrade:hover {
    background-color: #bca332;
}

body.summary #hero p {
    max-width: 450px !important;
}

#btn_show_upgrade {
    font-size: .78em;
    font-weight: 500;
    font-style: italic;
    letter-spacing: .03em;
    text-decoration: none;
}

#large_upgrade {
    max-width: 470px;
    margin: 0 auto 50px;
    display: block !important;
    text-align:center;
}


/* PRE-SURVEY PAGE
====================================== */

#pre-survey {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	
}

#pre-survey h3 {
	margin-bottom: 16px;
	font-size: 1.8em;
}

#pre-survey .button {
	margin: 30px auto 0;
	padding: 1.6em 2em;
	font-size: .8em;
	font-weight: 900;
	letter-spacing: .15em;
	text-transform: uppercase;
}


/* SURVEY QUESTIONS
====================================== */

form .question {
	width: auto !important;
	max-width: 630px;
	margin: 0 auto;
	padding: 0;
	border: 0 none !important;
	text-align: center;
}

.prompt {
	padding-bottom: 16px;
	font-size: 1.4em;
}

.prompt.range {
	display: block;
	font-size: 1.2em;
}

.prompt strong {
	display: inline-block;
	font-weight: 900;
	color: rgb(15,168,196);
}

.prompt em {
	display: inline-block;
	margin-bottom: 14px;
	font-size: .75em;
	font-weight: 400;
	letter-spacing: .02em;
	color: #9e9e9e;
}

.prompt em.instructions {
	font-size: .65em;
}

form .question .tr, form .question .td {
	vertical-align: middle;
}

form .question .tr {
	padding-bottom: .5em;
	display: flex;
	flex-direction row;
	justify-content: flex-start;
	align-items: center;
}

form .question input {
	margin-top: 0;
	text-align: center !important;
}

form .question input[type="range"] {
	padding-left: 0;
	padding-right: 0;
	border: 0 none;
}

form .question input[type="range"]:hover,
form .question input[type="range"]:focus,
form .question input[type="range"]:active {
	background-color: transparent;
}

form button.button, form button.button:focus, form button.button:active {
	margin-top: 30px;
	padding-top: 1em;
	padding-bottom: 1em;
	font-size: .85em;
	font-weight: 900;
	letter-spacing: .15em;
	text-transform: uppercase;
	background-color: #9e9e9e;
}

form button.is-big {
	background-color: rgb(15,168,196) !important;
}

form button.is-big:hover {
	background-color: #bca332 !important;
}

form .question option {
	font-size: .8em;
	font-weight: 700;
	color: #212121;
	display: none;
}

form .question datalist {
	padding-top: 26px;
	background-image: url("../img/label-strongly-agree.png"), url("../img/label-mildly-agree.png"), url("../img/label-strongly-disagree.png");
	background-repeat: no-repeat;
	background-position: left top, center top, right top;
	background-size: auto 26px;
}



/* DASHBOARD / ACCOUNT PAGE
====================================== */

body.account h1 {
	display: block;
	width: 160px;
	height: 0;
	padding-top: 35px;
	overflow: hidden;
	background: url("../img/TRAC-logo-black.png") no-repeat left top;
	background-size: auto 100%;
}

body.account .button.is-secondary {
	background-color: #9e9e9e;
}

body.account .button.is-secondary:hover {
	background-color: #bca332;
}

body.account h4 {
	text-align: left;
	margin-bottom: 0;
	color: #212121;
}

body.account #hero-wrapper .page-nav {
	width: 50px;
}

body.account #hero h3 {
	margin-bottom: 14px;
	font-size: 2em;
}

body.account #hero p {
	width: 100%;
	max-width: 540px;
	margin: 0 auto 1.8em;
	font-size: 1.3em;
}

body.account #hero p a {
	color: #fff;
}

body.account #hero p a:hover {
	opacity: .7;	
}

body.account #hero .button.is-big {
	font-size: .9em;
}

#results h3 {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}

#results h3 em {
	font-weight: 600;
}

#results-box-wrapper {
	margin: 40px auto 30px;
}
 
.result-box {
	width: 98%;
	margin: 0 auto 8px;
	padding: 20px 35px 25px 0;
	font-size: .9em;
	background: #eae8eb;
}

.result-box p {
	margin-bottom: 0;
}

.result-box .score h3 {
	margin-bottom: 0;
	font-size: 4.2em;
	font-weight: 300;
	text-align: center;
}

.result-box .score h3 span {
	display: inline-block;
	width: 56px;
	height: 0;
	overflow: hidden;
	padding-top: 60px;
	vertical-align: text-bottom;
	background-repeat: no-repeat;
	background-position: center 4px;
	background-size: auto 45px;
	opacity: .4;
}

#trajectory.result-box .score h3 span {
	background-image: url("../img/icon-dark-t.png");
}

#replenishment.result-box .score h3 span {
	background-image: url("../img/icon-dark-r.png");
}

#awareness.result-box .score h3 span {
	background-image: url("../img/icon-dark-a.png");
}

#choices.result-box .score h3 span {
	background-image: url("../img/icon-dark-c.png");
}

#results .high-score {
	background-color: #0FA8C4;
	color: #fff;
}

#results .high-score h4 {
	color: #fff;
}

#detailed-results .content {
	padding-bottom: 80px;
}

#graph-key {
	margin: 50px 0 25px;
	font-size: .9em;
	font-weight: 400;
}

#graph-key span.core-need {
	margin-right: 60px;
	line-height: 20px;
}

#graph-key span:before {
	content: '';
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-right: 8px;
	margin-top: -3px;
	vertical-align: middle;
	background-color: rgb(15,168,196);
}

#graph-key span.critical-issue:before {
	background-color: #9e9e9e;
}

#graph {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
}

#graph-score-overlay {
	position: relative;
	padding: 0 3.4% 0 6%;
	top: -40px;
	z-index: 1000;
	text-align: left;
}

#graph-score-overlay h4 {
	width: 19.3%;
	display: inline-block;
	margin: 0 7% 0 0;
	text-align: center;
	vertical-align: bottom;
	font-weight: 300;
	font-size: 38px;
	line-height: 38px;
	color: #fff;
}

#graph-score-overlay h4.choices {
	margin: 0;
}

#graph-score-overlay h4 span {
	display: inline-block;
	width: 38px;
	height: 0;
	overflow: hidden;
	padding-top: 38px;
	vertical-align: text-bottom;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto 33px;
	opacity: .4;
}

#graph-score-overlay h4.trajectory span {
	background-image: url("../img/icon-t.png");
}

#graph-score-overlay h4.replenishment span {
	background-image: url("../img/icon-r.png");
}

#graph-score-overlay h4.awareness span {
	background-image: url("../img/icon-a.png");
}

#graph-score-overlay h4.choices span {
	background-image: url("../img/icon-c.png");
}

#graph-labels {
	margin-top: -30px;
	padding: 0 3.4% 0 6%;
	text-align: left;
}

#graph-labels h5 {
	width: 19.3%;
	display: inline-block;
	margin: 0 7% 0 0;
	text-align: center;
	font-weight: 600;
}

#graph-labels h5:last-child {
	margin-right: 0;
}

#graph-labels h5 span {
	display: block;
	font-weight: 400;
	font-size: .85em;
	color: #9e9e9e;
}

#detailed-results .button-wrap {
	margin-top: 40px;
}

section#reading-results {
	padding: 0px;
	background: rgb(15,168,196) url("../img/reading-results-bkg.jpg") no-repeat left center;
	background-size: auto 150%;
	color: #fff;
}

section#reading-results .is-push-right {
	max-width: 640px;
}

section#reading-results .content h4 {
	margin-bottom: 20px;
	font-weight: 300;
	font-size: 1.8em;
	color: #fff;
}

section#interpreting-your-results .content h4 {
	font-weight: 300;
	font-size: 1.45em;
	margin-top: 30px;
}

#next-steps .button-wrap {
	margin-top: 20px;
}

section#critical-issue-videos .content {
	padding-bottom: 0;
}

section#critical-issue-videos #critical-issue-expanded p {
	font-size: 1em;
}

section#critical-issue-videos .video-wrap {
	margin-top: 20px;
}

section#coaching-videos {
	padding-top: 0;
	background-image: none;
}

section#coaching-videos p.is-big {
	margin-bottom: 30px;
}

.video-title {
	margin-top: 20px;
	padding: 0 5px;
}

.video-title h5 {
	margin-bottom:0;
	font-weight: 500;
	color: rgb(15,168,196);
}

.video-desc {
	margin: 5px auto 35px;
	padding: 0 5px;
	font-size: .85em;
}

.video-thumb {
	background: #000;
}

/* ACCOUNT EDIT
====================================== */

.get-coaching-link {
	padding-top: 20px;
	text-align: center;
	font-weight: 400;
	font-size: .9em;
	font-style: italic;
}

/* ABOUT PAGE
====================================== */

body.support-page a.is-big {
	margin-top: 40px;
}

#sample-download {
	padding-bottom: 0;
	background-image: none;
}

#starting-blocks h4 {
	margin-bottom: 10px;
	padding-top: 20px;
	text-align: left;
}

#testimonials {
	margin: 50px 0;
}

#testimonials .testimonial-photo {
	width: 100px;
	height: 100px;
	overflow: hidden;
	border-radius: 50px;
	margin: 0 auto;
}

#testimonials p, #testimonials .cite {
	font-size: 1em;
	padding: 15px 15px 0;
	text-align: center;
}

#testimonials .cite {
	padding-top: 0;
	font-size: .9em;
	font-weight: 400;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgb(15,168,196);
}

#testimonials .cite em {
	display: block;
	text-transform: none;
	font-weight: 300;
	letter-spacing: 0;
	color: #212121;
}


/* ABOUT LB
====================================== */

#about-lb h4 {
	padding-top: 20px;
	text-align: left;
}

/* PRIVACY POLICY
====================================== */

#privacy-statement {
	max-width: 850px;
}

#privacy-statement h3 {
	margin-bottom: 50px;
	text-align: center;
}

#privacy-statement h4 {
	padding-top: 20px;
}

#privacy-statement p {
	font-size: 1em;
}


/* FAQs
====================================== */

body.support-page .is-brand h1 {
	display: block !important;
	width: 160px;
	height: 0;
	padding-top: 35px;
	overflow: hidden;
	background: url("../img/TRAC-logo-black.png") no-repeat left top;
	background-size: auto 100%;
}

body.support-page .is-brand .is-logo {
	display: none;
}

section.no-padding {
	padding-top: 60px;
	background-position: center top;
}

#faq-wrapper {
	max-width: 850px;
	margin: 0 auto;
	text-align: left;
}

#faq-wrapper h4 {
	margin-bottom: 20px;
	text-align: left;
	font-weight: 400;
}

#faq-wrapper a.question {
	text-decoration:  none;
	cursor: pointer;
}

#faq-wrapper a.question:hover {
	opacity: .7;
}

#faq-wrapper .answer {
	margin-bottom: 40px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}

#faq-wrapper .answer {
	margin-bottom: 40px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}

#faq-wrapper .faq-section {
	display: block;
	margin-top: 60px;
}


/* RESPONSIVE
====================================== */

@media only screen and (max-width: 900px) {
	nav.is-push-right ul li {
		margin-left: 10px;
	}

	nav.is-push-right ul li:first-child {
		padding-right: 10px;
	}
	
	nav.is-push-right ul li:last-child {
		margin-left: 25px;
	}

	#content-bottom-1 .is-row > .is-col {
		min-width: 300px;
		margin-bottom: 30px;
		padding: 0 15px;
	}
	
	#content-top-2 h3 em {
		display: block;
	}
	
	.step {
		padding-left: 30px;
		padding-right: 30px;
	}
}

@media only screen and (max-width: 767px) {
	.is-navbar-box:not(.is-scrollable), .is-navbar-box:not(.is-scrollable) .is-navbar, 
	.is-navbar-box:not(.is-scrollable) .is-navbar ul, .is-navbar-container:not(.is-scrollable), 
	.is-navbar-container:not(.is-scrollable) .is-navbar, .is-navbar-container:not(.is-scrollable) 
	.is-navbar ul {
		display: flex  !important;
		align-items: center;
	}
	
	.is-navbar-box, .is-navbar-container {
	    flex-direction: row;
	}
	
	.is-navbar {
		align-items: flex-end !important;
	}
	
	#results h3 {
		text-align: center;
	}
	
	.result-box {
		padding-left: 35px;
		text-align: center;
	}
	
	body.account .result-box h4 {
		text-align: center;
	}
	
	#results-buttons .button {
		margin-bottom: 10px;
	}
	
	#graph-score-overlay {
		padding: 0 3% 0 7.5%;
		top: -33px;
	}

	#graph-score-overlay h4 {
		width: 19.2%;
		font-size: 30px;
		line-height: 30px;		
	}

	#graph-score-overlay h4 span {
		width: 30px;
		padding-top: 30px;
		background-size: auto 25px;
	}
	
	#graph-labels h5 {
		font-size: .9em;
	}
	
	section#reading-results {
		background-image: none;	
	}
	
	#Full-Report {
		border-left: 0 none;
		border-top: 2px solid #e9e9e9;
	}
}

@media only screen and (max-width: 640px) {
	.button.is-big, .button.is-big:active, .button.is-big:focus {
		padding: 1.5em 2.4em;
		font-size: .9em;
	}
	
	.parallaxie {
		height: 190px;
	}
	
	#hero-wrapper {
		background-position: -100px top;
		min-height: 570px;
	}
	
	#hero {
	     -ms-transform: translate(-50%, -58%);
	     -webkit-transform: translate(-50%, -58%);
	     -moz-transform: translate(-50%, -58%);
		 -o-transform: translate(-50%, -58%);
		 transform: translate(-50%, -58%);
	}
	
	#hero h2 {
		font-size: 2.4em;
	}

	#hero h3 {
		font-size: 1.3em;
	}
	
	section .content h3 {
		font-size: 1.9em;
		line-height: 1.3em;
	}
	
	section .content p {
		font-size: 1.1em;
	}
	
	p.is-big {
		font-size: 1.25em !important;
	}
	
	#graph-labels {
		padding: 0 3% 0 7.5%;
	}
	
	#graph-labels h5 {
		width: 19%;
	}
	
	#app {
		padding-left: 25px;
		padding-right: 25px;
	}
	
	#login_nav a {
		height: 28px;
		line-height: 28px;
		margin: 0 14px 0 0;
		font-size: .9em;
	}

	#login_nav a span {
		padding-top: 28px;
		width: 28px;
		top: 8px;
		line-height: 28px;
		background-size: auto 18px;
	}
}

@media only screen and (max-width: 555px) {
	#login_nav a {
		display: none;
	}
}

@media only screen and (max-width: 540px) {
	
	body.landing header b, body.support-page header b, body.error header b {
		display: none;
	}
	
	section#How-TRAC-Works {
		background-image: url("../img/color-bars.png"), none;
		background-position: center 10px, 10000% 10px;
	}
	
	#content-bottom-1.content h3 {
		font-size: 1.6em;
	}
	
	#content-top-2 h3 span.br {
		display: block;
	}
	
	#results .is-col.is-text-right {
		text-align: center;
	}
	
	#graph-score-overlay {
		padding: 0 3.2% 0 8.1%;
		top: -28px;
	}

	#graph-score-overlay h4 {
		width: 19%;
		font-size: 24px;
		line-height: 24px;
		margin-right: 7%;
	}

	#graph-score-overlay h4 span {
		width: 24px;
		padding-top: 24px;
		background-size: auto 21px;
	}
	
	#graph-labels {
		padding: 0 3.2% 0 8.1%;
		margin-top: 0;
	}

	#graph-labels h5 {
		transform: rotate(315deg);
		text-align: right !important;
		font-size: .8em;
	}
}

@media only screen and (max-width: 490px) {
	#hero-wrapper {
		min-height: 500px;
	}
	
	#hero h2 {
		font-size: 2em;
	}
	
	#hero h3 {
		font-size: 1.1em;
	}
	
	span.br {
		display: inline;
	}
	
	a.page-nav {
		width: 100%;
		padding-bottom: 55px;
		text-transform: uppercase;
		font-size: .75em;
		background: url("../img/arrow-gray.png") no-repeat bottom center;
		background-size: auto 40px;
	}
	
	#bottom-footer span.br {
		display: block;
	}
	
	body.account #hero {
		padding-top: 60px;
	}
	
	#graph-key span.core-need {
		margin-right: 30px;
	}
	
	#pre-survey h3 {
		font-size: 1.5em;
	}
	
	.prompt {
		font-size: 1.2em;
	}
	
	#large_upgrade {
	    margin-left: 20px;
	    margin-right: 20px;
	}
	
}

@media only screen and (max-width: 390px) {
	#graph-score-overlay {
		padding: 0 2.8% 0 10%;
		top: -26px;
	}

	#graph-score-overlay h4 {
		font-size: 20px;
		line-height: 20px;
		margin-right: 6.3%;
	}

	#graph-score-overlay h4 span {
		width: 20px;
		padding-top: 20px;
		background-size: auto 17px;
	}
	
	#graph-labels {
		padding: 0;
	}
}

body.survey nav.is-push-right .button {
	visibility: hidden;
}

body.survey .is-navbar {
	display: none;
}

body.survey .is-navbar-container {
	justify-content: center;
}