body{background:#20899F; font-family:'Open sans', arial, sans-serif;font-weight: 400;}
html, body {width:100%;height:100%;}
canvas{display:block;vertical-align:bottom;}

section {width:100%; height:100%;position: relative; margin:0; padding:0; display:block;}

#part-one-wrap {width:100%; height:100%;min-height:600px;background:url(../images/connections-home-bg.svg) repeat center center; background-size:30%; position:relative;overflow:hidden;display:none;}
#start {}
#start-inner {width:100%; height:100%; position:relative;}
#svg-wrap {position:absolute; bottom:-5px;left:0;width:100%; height:auto;}
#start svg {}
#headline {position: absolute; top:10%; left:15%; width:70%; text-align:center; display:none;}
#start h6 {position:absolute;bottom:20%;left:40%;}
#circle-button {width:150px; margin:0 auto;background:#3DC5E6;}

#questions-wrap {width:100%; height:100%;position: relative; overflow:hidden;display:none;}
#results-wrap {width:100%; height:100%;position: relative; background-color:#1A5D6C;display:none;}
#counter {width:12%; float:right; text-align:center;color:#999999;display:none;margin-top:50px;}
#counter-horizontal {width:100%;position:absolute;left:0; bottom:5%;height:20px;text-align:center;}
#counter-horizontal i {margin-right:15px; color:#FFFFFF;}

#section-one {}
#section-two {background-color: #1A5D6C; display:none;}

.half {width:50%;padding:0;float:left;}
.half-inner-left {padding:10% 5% 10% 15%;}
.half-inner-right {padding:10% 15% 10% 5%;}
.left {padding:0;}
.right {padding:0;}

.third {width:23.33%; margin:0 5%}
.info-item {width:33.33%; float:left; padding:2%;}
#results-wrap .third {width:33.33%; margin:0;}
.quarter {width:25%; float:left; padding:2%;}

.last {margin-right:0;}

.question-bar {width: 100%;min-height:120px;height:auto;padding: 3% 12%;background-color: rgba(26,93,108,0.50);font-size: 28px;color: #FFFFFF;line-height: 1.1em; text-align:center; display:none;}
.question {width: 100%;height:100%;min-height:500px;margin:0 auto;}
.answer-wrap {width: 65%;margin:7% auto 0 auto; display:none;}
.answer {padding:7% 0;float:left;color:#FFFFFF; text-align:center;cursor:pointer;}
.answer:hover {}

#result {width:100%;height:auto;position:relative;}
.result-title {width:90%; margin:0 auto; font-size: 26px;font-size: 1.8vw;text-transform: uppercase;padding: 15px 0 0 0; color:#4D4D4D;font-family: 'Raleway', 'Open sans', arial, sans-serif;font-weight:700;}

#main-result-title {background-color:#FFFFFF;position:relative;}
#improve {position:absolute; top:25%;right:5%;}

#breakdown {width:100%; height:auto;}

#result .svg-container {width:88%; margin:30px auto 20px auto; display:block;}
#result .half .svg-container, #result .half .svg-container {width:80%; margin:0 auto 40px auto; display:block;}

#result-main-influencer {position:relative;display:block;background:#FFFFFF url(../images/connections-result-bg.svg) repeat center center; background-size:60%; padding:35px 0;}
#result-target {background:#F6F8FB; background-size:30%;padding:30px 0 0 0;}
#result-engagement {background:#F2F4F9; background-size:30%; padding:30px 0 0 0;}

.scale-rating {position:absolute; text-transform:uppercase; font-size:12px; bottom:25px;color:#999999;}
#weak {left:8.5%;}
#strong {right:8%;}

.result-sub-title {margin: 0 auto;width: 80%;font-size: 20px;font-size: 1.5vw;text-transform: uppercase;padding: 15px 0 10px 0;font-family: 'Raleway', 'Open sans', arial, sans-serif;font-weight:700;color:#4D4D4D;}
.improvement {display: block;float: left;padding: 5%;background-color: rgba(0,0,0,0.10);}
#engagement-info .middle, #target-info .middle {background-color: rgba(0,0,0,0.05);width:33.34%;}

.info-block {}
#target-info {background:#3DC5E6;}
#engagement-info {background:#20899F;}

/* section hidden - karl 29112016 */
/* #test-drive {
	display:none !important;
	overflow:hidden;
	background:#1A5D6C url(../images/connections-bg3.svg) no-repeat center left;
	background-size:150%;
	position:relative;
	height:auto;
	-webkit-transition-property: all;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: all;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: all;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: all;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;
	display:none;
} */
#about {height:auto;display:none;}
#contact-form {display:block;padding:25px;width:70%;margin: 5% 15%;height:auto;display:none !important;}
#contact-form-inner {}
#contact-form-inner p {color:#FFFFFF;}

#contact-bar {display:block; width:100%;padding:2% 3% 3% 3%;background-color:#000000;text-align:center;color:#999999;font-size:1.5em;line-height:1.2em;}

.column-half {float:left; text-align:left;width:50%;}
.column-half.left {padding:3% 1% 3% 0;}
.column-half.right {padding:3% 0 3% 1%;}

.column-third {float:left; text-align:left;width:33.33%;}
.column-third.left {padding:3% 1% 3% 0;}
.column-third.middle {padding:3% 0;}
.column-third.right {padding:3% 0 3% 1%;}

.tip {width:100%;height:100%;background:#1A5D6C;display:none;}
.tip-inner {position:relative;width:75%; margin:0 auto;padding-top:100px;}
.tip-inner p {color:#FFFFFF;}
.tip h2, .tip h6 {text-transform:uppercase;}
.tip h2 i {color:#3DC5E6;}

#onalytica-bar {height:120px; background:#FFFFFF url(../images/onalytica-logo.svg) no-repeat center center; background-size:15%;}
.blue-bar {background-color:#F6F8FB;}

#process {}
#process img {width:100%; height:auto;}

#info-container {background:#FFFFFF;width:100%; padding:1% 3% 5% 3%;}

#contact {background:#20899F;height:auto;padding:5% 3% 7% 3%; text-align:center; color:#E1E1E1; display:none;} 

#t-mid, #t-high, #e-mid, #e-high, #e-low, #t-low {color:#20899F; font-weight:300}
#t-mid, #t-high, #e-mid, #e-high {display:none;}
.percentage {color:#20899F;font-family:'Open sans', arial, sans-serif;}

#improve-these {width:100%; height:auto; background-color:#20899F;color:#FFFFFF;}
#improve-these-inner {width:90%; margin:0 auto;padding:25px 0; display:block;}
#improve-these .quarter {width:25%; float:left; padding:1% 0;}
#improve-these .quarter {opacity:0;}
.flagged {font-size:1.5vw;}

#contact-form-improve {width:100%;height:100%;position:fixed;bottom:0;left:0;background:#20899F url(../images/connections-home-bg.svg) repeat center center; background-size:30%;display:none;z-index:999;}
#contact-form-improve-inner {position:relative;width:50%; height:auto; margin:0 auto;}
#contact-form-improve .column-half {float:left; text-align:left;width:50%;padding:3% 2%;}
#contact-form-improve-inner p {color:#FFFFFF;}
.close-button {position:absolute;top:25px; right:25px;color:#FFFFFF;cursor:pointer;}
.close-button:hover {color:#000000;}
#callback {margin-top:50px;}
#callback-result-text {margin-top:15px;}
.hide-break {display:none;}	
/*--------------------------------------------------*/
/*--------------------- HEADER ---------------------*/
/*--------------------------------------------------*/

header {
	text-align: center;
	height: 100px;
	background-color:#FFFFFF;
	overflow: hidden;
    top: 0px;
    left: 0px;
    z-index: 9999;
	position: fixed;
	width: 100%;
	-webkit-transition-property: all;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: all;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: all;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: all;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;
	display:none;
	}
header.sticky {
	position: fixed;
	height: 48px;
	width: 100%;
	background-color: rgba(255,255,255,1);
}
		
header nav {float:right;}

.header-inner {width:92%; margin:0 auto;} 

header #nav-button {
	position: relative;
	outline: none;
	color: #CCCCCC;
	font-size:15px;
	padding: 8px 20px;
	margin-top:22px;
	border:2px solid #CCCCCC;
	text-decoration: none;
	text-transform: uppercase;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: pointer;
 	text-align:center;
	display:block;
	-webkit-transition-property: all;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: all;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: all;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: all;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;
}

header #nav-button:hover, header #nav-button:active, header #nav-button:focus {
  	text-decoration:none;
  	cursor:pointer;
	color: #FFFFFF;
	background: #00ADEE;
	outline: none;
}
header #nav-button:focus {outline: 0 !important;}

header.sticky #nav-button {
	font-size:13px;
	padding: 5px 15px;
	margin-top:8px;
}
.logo {
	float:left;
	width:300px;
	padding:28px 0;
	-webkit-transition-property: width, padding;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: width, padding;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: width, padding;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: width, padding;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;
	top:0;
	left:0;
	margin:0;
	}
	
.logo img, .logo svg {width:100%;height:auto;max-height:56px;}

header.sticky .logo {width:200px;padding:10px 0;}
header.sticky .logo svg {max-height:37px;}

.number {
	padding:40px 0;
	float:right;
	font-size: 28px;
	font-weight:700;
	-webkit-transition-property: all;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: all;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: all;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: all;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;}
header.sticky .number {padding:12px 0;font-size: 18px;}

/*-------------------------------

SVGs

-----------------------------------*/
	.st0{fill:none;stroke:#FFFFFF;stroke-miterlimit:10;}
	.st1{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
	.st2{fill:#20899F;stroke:#FFFFFF;stroke-width:2.5;stroke-miterlimit:10;}
	.st3{fill:#FFFFFF;}
	.st4{fill:#20899F;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
	.st5{fill:#20899F;stroke:#FFFFFF;stroke-miterlimit:10;}
	.st6{fill:#20899F;stroke:#43B1BF;stroke-width:1.5;stroke-miterlimit:10;}
	.st7{fill:#43B1BF;}
	.st8{fill:#20899F;stroke:#43B1BF;stroke-miterlimit:10;}
	.st9{fill:#20899F;stroke:#43B1BF;stroke-width:1.0857;stroke-miterlimit:10;}
	.st10{fill:#20899F;stroke:#FFFFFF;stroke-width:5;stroke-miterlimit:10;}
	.st11{display:none;}
	.st12{display:inline;fill:#3DC5E6;}
	.st13{display:inline;fill:#FFFFFF;}
	.st14{fill:#E3B188;}
	.st15{fill:#3DC5E6;}
	.st16{fill:#1A5D6C;}
	.st17{fill:#F3C6A2;}
	.st18{fill:#F6F8FB;}
	.st19{fill:#CEA280;}
	
	#influencer-group-one, #influencer-group-two, #influencer-group-three, #influencer-group-four, #main-circle-blank, #main-influencer-one, #con-one, #con-two, #con-three, #con-four, #con-five, #con-six, #con-seven, #con-eight, #con-nine, #con-ten, #con-eleven, #question-mark {display:none;}
	
	#influencer-scale {}
	#influencers-bg{display:none;}
	#influencers{display:none;}
	.influencer-bg{fill:#D5D5D5;}
	.influencer{fill:#FFFFFF;}
	
	#influencer-bg-one {}
	#influencer-bg-two {}
	#influencer-bg-three {}
	#influencer-bg-four {}
	#influencer-bg-five {}
	#influencer-bg-six {}
	#influencer-bg-seven {}
	#influencer-bg-eight {}
	#influencer-bg-nine {}
	#influencer-bg-ten {}
	
	#target-group, #target-bg {display:none;}
	.target-bg{fill:#CCCCCC;}
	.target{fill:#FFFFFF;}
	.target-faded{opacity:0.75;fill:#FFFFFF;}
	
	#target-bg-one {}
	#target-bg-two {}
	#target-bg-three {}
	#target-bg-four {}
	#target-bg-five {}
	
	#engagement {}
	#engage-bg{display:none;}
	#engage{display:none;}
	.engage-bg{fill:#CCCCCC;}
	.engage{fill:#FFFFFF;}
	
	#engage-bg-one {}
	#engage-bg-two {}
	#engage-bg-three {}
	#engage-bg-four {}
	#engage-bg-five {}
	
	
/*-------------------------------

text

-----------------------------------*/

a {
	color: #FFFFFF;
	text-decoration: none;
}
a:hover {
	color: #000000;
}
a, img, a img, form, input { 
	border: none;
	outline: none;
}
#contact a:hover {color: #FFFFFF; text-decoration:underline;}
.link-dark {color:#000000;}
.link-dark:hover {color:#FFFFFF;}
p {
	margin: 10px 0;
	padding: 0;
	font-size: 15px;
	line-height: 1.3em;
	color:#5c5c5c;	
	font-weight: 300;
}
#contact-bar p {color:#CCCCCC;}
.info-block p {color:#FFFFFF;font-size: 15px;font-size: 0.9vw;}

h1, h2, h3, h4, h5, h6{
	padding: 0;
	line-height: 1.2em;
	letter-spacing:-0.025em;
	font-weight:600;
	}
#results-wrap h5, #results-wrap h6{
	font-family: 'Raleway', 'Open sans', arial, sans-serif;
	font-weight:700;
	text-transform:uppercase;
	}
h1 {
	font-size: 92px;
	color: #000000;
	padding: 0;
	line-height: 1em;
	margin-bottom: 25px;
}
.text-box-two h1 {color:#EAEAEA;} 

h2 {
	font-size: 34px;
	font-size: 2.4vw;
	color: #20899F;
	display: block;
	padding: 5px 0 0 0;
	margin: 5px 0;
	line-height: 1.1em;
}
h2 a {color:#00ADEE;}
h2 a:hover, h2 a:focus {color:#FFFFFF;}
.answer h2 {font-size: 26px;font-size: 1.8vw; font-weight:300; color:#FFFFFF;}
#main-result-title h2 {color:#FFFFFF; text-transform:uppercase;font-size: 28px;font-size: 2vw;}

h3 {
	font-size: 28px;
	font-size: 2vw;
	color: #000000;
	display: block;
	padding: 5px 0 0 0;
	margin: 5px 0;
	line-height: 1.1em;
}
h4 {
	font-size: 26px;
  	font-size: 1.8vw;
	color: #FFFFFF;
	padding-top: 0px;
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 5px;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 10px;
	margin-top: 15px;
	line-height: 1.2em;
}
.tip h4 {font-weight:300;}
#result h4 {text-transform:uppercase;font-size: 3vw;}

h5 {
	font-size: 23px;
	font-size: 1.6vw;
	color: #000000;
	padding: 0 0 5px 0;
	margin: 10px 0;
}
.info-block h5 {color:#FFFFFF;font-weight: 700;text-transform:uppercase;font-size: 19px;font-size: 1.3vw;margin: 1px 0;}
h6{
	font-size: 17px;
	color: #000000;
	padding: 5px 0;
	margin: 5px 0 0 0;
	line-height: 1.1em;
}
.info-block h6 {color:#FFFFFF;font-weight: 700;text-transform:uppercase;font-size: 16px;font-size: 1.1vw;}
#about h6 {color:#4D4D4D;font-size: 19px;font-size: 1.3vw;}
#improve-these h6 {font-size: 26px;font-size: 1.8vw;}
.small {font-size:0.8em;}


/*-------------------------------

styling

-----------------------------------*/


.clearfloat {
	clear: both;
	height: 25px;
	font-size: 1px;
	line-height: 25px;
}
.clearfloat-small {
	clear: both;
	height: 1px;
	font-size: 1px;
	line-height: 1px;
}

.hidden-menu-item {display:none;}
.divide {border-bottom: 1px solid #999999;margin: 10px 0;height: 1px;}
.light-divide {border-bottom:1px solid #f7f8f8; margin:10px 0; height:1px;}
.main-divide {border-bottom:1px dashed #0C85C7; margin:45px 0 50px 0; height:1px;}

.section-inner .divide {margin:15px 0 30px 0;}
.white {color:#FFFFFF!important;}
.white:hover {color:#00ADEE;}
.black {color:#000000;}
.onalytica-blue {color:#20899F;}

.uppercase {text-transform:uppercase;}
.italic { font-style:italic; font-size:70%;line-height:0.8em;}

.underline {border-bottom:2px solid #FFFFFF; padding-bottom:25px; margin-bottom:25px;}

.url {color:#000000!important;border-bottom: dashed 1px #000000!important;}
.url:hover {color:#FFFFFF!important;border-bottom: 1px solid #FFFFFF!important;}

.stat {background-color: #EFD8D3;}
.stat.half-light {background-color: #F0DEDA;}
.stat h1 {color:#E20613!important;}
.highlighted {background-color: #CBDCD0!important;}
.highlighted.half-light {background-color: #D3E1D7!important;}
.highlighted h1 {color: #29B04F!important;}

.float-left {float:left;}
.float-right {float:right;}
.align-right {text-align:right;}
.align-left {text-align:left;}
.align-center {text-align:center;}

.icon-lg {font-size:7.5em;line-height:.75em;vertical-align:-30%; margin-right:5px;}
.icon-mid {font-size:3em;line-height:.75em;vertical-align:-30%; margin-right:5px;}
.icon-small {font-size:1.6em;line-height:.75em;vertical-align:-20%; margin-right:5px;}

.icon-one {color:#20899F;}
#counter-horizontal .icon-one {color:#FFFFFF;}

.filled {display:none;}
#counter-horizontal .filled {color:#FFFFFF; display:none;}
img { -ms-interpolation-mode: bicubic;}

.bold {font-weight:700;}

.hnumber {display:none;}

::selection {background: #20899F; color:#FFFFFF; /* Safari */}
::-moz-selection {background: #20899F; color:#FFFFFF; /* Firefox */}

.hidden-title, .hidden-text {opacity:0;}

.gap-right {margin-right:10px;}
.gap-left {margin-left:10px;}

.font-light {font-weight:300!important;}

#question-02, #question-03, #question-04, #question-05, #question-06, #question-07, #question-08 {display:none;} 
/*-------------------------------

button

-----------------------------------*/
.button-container {width:100%; margin: 30px 0 0 0; text-align:right;}
.two-button-container {width:100%; margin: 5% auto 0 auto;}
.button, button {
	font-family:'Open sans', arial, sans-serif!important;
	font-size: 1em;
	color: #FFFFFF;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	padding: 15px 25px;
	cursor: pointer;
 	text-align:center;
	text-decoration:none;
	min-width:250px;
	display:inline-block;
	margin: 0 10px 0 0;
	background-color: #3DC5E6;
	-webkit-transition-property: background, color, border;
  	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-property: background, color, border;
  	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-property: background, color, border;
  	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease-in-out;
	transition-property: background, color, border;
  	transition-duration: 0.4s;
	transition-timing-function: ease-in-out;
}
.button-outline {
	color: #20899F;
	border: 3px solid #20899F;
	background-color: #FFFFFF;
	padding: 12px 22px;
}
.button:hover, .button:active, .button:focus {
	text-decoration:none;
	cursor:pointer;
	color: #FFFFFF;
	background: #20899F;
}
.button-outline:hover, .button-outline:active, .button-outline:focus {
	background: #20899F;
}
.button-outline:active, .button-outline:focus {
	border: 3px solid #000000;
}
.button:active, .button:focus, #solutions .button:focus {
	color: #FFFFFF;
	background: #000000;
}

.button:focus, button:focus, #solutions .button:focus {outline: 0 !important;}

button {
	border: none;
	background: none;
}
.top-target {position:fixed;right:6%;top:0;z-index:999;}
.small-button {
	padding: 10px 45px 13px 45px;
	min-width:auto;
	margin: 0 0 8px 0;
	-webkit-border-top-right-radius: 0;
	-webkit-border-top-left-radius: 0;
	-moz-border-radius-topright: 0;
	-moz-border-radius-topleft: 0;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	font-size: 16px;
	text-transform: uppercase;
	background-color: #20899F;
	display:none;
}
.small-button:hover {
	background: #1A5D6C;
}
#start-button {
	font-size: 1.2em;
	text-transform:uppercase;
	margin-top:20px;
	display:none;
}
#start-button:hover {background:#1A5D6C;}
.top-button {background: #FFFFFF; color:#3DC5E6;font-size: 1em;padding: 10px 20px;min-width:200px;}
.top-button:hover {background: #000000;}

/*-------------------------------

media queries

-----------------------------------*/


@media screen and (min-width: 1440px){

}
@media screen and (min-width: 1600px){
.answer h2 {font-size: 2vw;}
.icon-lg {font-size:10em;}
.question-bar {font-size: 36px;}
#start-button, .tip-inner .button {min-width:auto;padding:2% 5%;font-size: 1.5vw;}
.small-button {font-size:1.8vw; width:auto;padding:25px 50px;}
}
@media screen and (min-width: 1920px){
}
@media screen and (min-width: 2280px){
	
}

@media screen and (max-width: 1320px){
h2 {font-size: 3vw;}
h5 {font-size: 2vw;}
}
@media screen and (max-width: 1280px){
.result-sub-title {font-size: 1.6vw;}
h6, #about h6 {font-size: 1.6vw;}
.flagged {font-size: 1.6vw;font-weight:300;}
.result-title, #about h5, #improve-these h6{font-size: 2vw;}
}
@media screen and (max-width: 1180px){
}
@media screen and (max-width: 1120px){

}
@media screen and (max-width: 1024px){
h2 {font-size: 3.3vw;}
h5 {font-size: 2vw;}
.answer-wrap {width: 75%;}
.icon-lg {font-size:7em;}
.tip h4 {font-size:2.5vw;}
.question-bar {padding: 3% 4%;}

#result .svg-container {margin:25px auto 15px auto;}
#result .half .svg-container, #result .half .svg-container {margin:0 auto 30px auto;}
#result-target, #result-engagement {padding:20px 0 0 0;}
#about p {font-size: 0.8em;}
.scale-rating {font-size:12px; bottom:12px;}
#weak {left:8%;}
#strong {right:7.5%;}
#contact-form-improve-inner h4 {font-size:2vw;}
}
@media screen and (max-width: 960px){
}
@media screen and (max-width: 900px){
#svg-wrap {bottom:-5px;left:-10%;width:120%;}
#headline {top:7%; left:5%; width:90%;}
h2 {font-size: 3.6vw;}
h5 {font-size: 2.3vw;}
.quarter, #improve-these .quarter  {width:50%;}
.flagged {font-size: 2.4vw;}
#contact-form {width:80%;margin:3% 10%;}

  }
/*-------------------------------

mobile

-----------------------------------*/

@media screen and (max-width: 820px){

}
@media screen and (max-width: 768px){
#svg-wrap {bottom:-5px;left:-40%;width:180%;}
#headline {top:5%; left:17.5%; width:65%;}
h2 {font-size: 5vw;}
#contact-form h2 {font-size: 4vw;}
h5 {font-size: 3vw;}
.question-bar {font-size: 26px;line-height: 1.2em;}
.answer-wrap {width: 90%;margin:25% auto 0 auto;}
.answer {padding:5% 0;}
.answer h2 {font-size: 2.3vw;}
.icon-lg {font-size:6em;}
.tip-inner {padding-top:60px;}
.tip h4 {font-size:3.5vw;}
#result .svg-container {margin:20px auto 10px auto;}
#result .half .svg-container, #result .half .svg-container {width:80%; margin:0 auto 20px auto;}
#result-main-influencer {padding:10px 0;}
#result-target, #result-engagement {padding:5px 0 0 0;}
.result-title, #about h5, #improve-these h6 {font-size: 2.5vw;}
#improve-these-inner {padding:15px 0 20px 0;} 
#contact-form {width:90%;margin:2% 5%;padding:2% 0;}
#contact-form h4 {font-size:2vw;}
.column-third {width:100%;}
#about .half {width:100%;}
.half-inner-left {padding:5% 5% 1% 5%;}
.half-inner-right {padding:1% 5% 5% 5%;} 
#process img {width:70%; margin-left:15%;}
.scale-rating {font-size:1.4vw; bottom:7px;}
#weak {left:8%;}
#strong {right:7.5%;}
.top-target {width:100%;position:fixed;text-align:center;left:0;}
.small-button {padding: 10px 0 13px 0;margin:0;width:100%;-webkit-border-radius: 0;-moz-border-radius:0;border-radius:0;border-bottom:1px solid #FFFFFF;}
#result-main-influencer {padding-top:40px;}
#contact-form-improve-inner {width:70%;}
#contact-form-improve-inner h4 {font-size:3vw;}
}
@media screen and (max-width: 700px){
.answer-wrap {margin:15% auto 0 auto;}
.small-button {font-size:14px;}
.hide-break {display:block;}	
}
@media screen and (max-width: 667px){
#svg-wrap {bottom:-5px;left:-30%;width:160%;}
#headline {top:5%; left:10%; width:80%;}
h2 {font-size: 6vw;}
h5 {font-size: 3.8vw;}
.question-bar {font-size: 24px;line-height: 1.4em;}
.answer-wrap {width: 95%;margin:17% auto 0 auto;}
.answer h2 {font-size: 2.6vw;}
.result-sub-title {font-size: 1.7vw;}
h6, #about h6 {font-size: 2vw;}
.flagged {font-size: 2.5vw;}
#contact-form h4 {font-size:2.5vw;}
.small-button {padding: 10px 15px 13px 15px;}

}

@media screen and (max-width: 568px){
.tip-inner {padding-top:50px;}
.tip h4 {font-size:4.2vw;}
#process img {width:80%; margin-left:10%;}
}

@media screen and (max-width: 480px){
#headline {top:5%; left:2.5%; width:95%;}
h2 {font-size: 7vw;}
h5 {font-size: 4.3vw;}
.question-bar {font-size: 25px;line-height: 1.3em;}
.answer-wrap {width: 95%;margin:20% auto 0 auto;}
.answer h2 {font-size: 3.5vw;}
.icon-lg {font-size:5.5em;}
.tip h4 {font-size:1.2em;}
.tip-inner .align-right {text-align:center;}
.tip-inner .button {width:100%;min-width:auto;}

#result .svg-container {width:90%;margin:15px auto 5px auto;}
#result .half .svg-container, #result .half .svg-container {width:90%; margin:0 auto 15px auto;}
#result-main-influencer {padding-bottom:20px;}
#result-target, #result-engagement {padding:0;}

.half {width:100%;}
.result-title, #about h5, #improve-these h6 {width:90%;font-size: 3.5vw;text-align:center;}
.result-sub-title {width:90%;font-size: 3vw;text-align:center;}
h6, #about h6 {font-size: 3vw;}
.flagged {font-size: 2.8vw;}
#improve-these-inner {padding:10px 0 15px 0;} 
.quarter  {width:100%;}
.info-item  {width:100%;text-align:center;}
#process img {width:100%; margin-left:0;}
.scale-rating {font-size:2vw; bottom:7px;}
#weak {left:6%;}
#strong {right:5%;}
#contact-form h4, #contact h4 {font-size:3vw;}
#contact-form h2 {font-size: 5vw;}
#contact-form-improve-inner {width:80%;margin-top:80px;}
#contact-form-improve-inner h4 {font-size:5vw;}
.hide-break {display:none;}	
.fs-form .fs-submit  {font-size:1em;padding:15px 25px;}
#form-wrap, #list-fields li{text-align:center;}
}

@media screen and (max-width: 400px){
.question-bar {font-size: 22px;}
.answer-wrap {width: 100%;margin:22% auto 0 auto;}
}

@media screen and (max-width: 375px){

}

@media screen and (max-width: 320px){
#start-button {min-width:auto;}
.question-bar {font-size: 1.4em;}
.answer-wrap {width: 100%;margin:25% auto 0 auto;}
.answer h2 {font-size: 0.9em;}
.tip h4 {font-size:1em;}
#improve-these .quarter {width:100%;text-align:center;}
.flagged {font-size: 6vw;}
.scale-rating {display:none;}
#contact-form h4 {font-size:5vw;}
#contact h4 {font-size:5.5vw;}
#contact-form h2 {font-size: 8vw;}
#contact-form-improve-inner h4 {font-size:6vw;}
}
@media screen and (max-width: 280px){
body{min-width:280px;}
#svg-wrap {bottom:-5px;left:-40%;width:180%;}
}

@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* IE10+ CSS styles go here */
}

.hidden-input, #callback-result-text, #ten-result-text {display:none;}