@charset "utf-8";

*, *::before, *::after {
		  box-sizing: border-box;
		  user-select: none;       
		  -webkit-user-select: none; 
		  -moz-user-select: none;   
		  -ms-user-select: none; 
		}
			
		html, body { 
			margin: 0; 
			padding: 0; 
		}

		body {
			background-color: #03153c;
			font-family: "Montserrat", sans-serif;
		}
		
		h1, .h1 {
			font-size: clamp(1.6rem, 2.5vw, 1.825rem);
			line-height: clamp(2rem, 2.5vw, 2.2rem);
			text-align: center;
		}
		
		h2. .h2 {
			 font-size: clamp(1.5rem, 2.5vw, 1.625rem);
			line-height: clamp(1.8rem, 2.5vw, 2rem);
			 
		}
		
		p {
			font-size: clamp(1rem, 2.5vw, 1.125rem);
			line-height: clamp(1.3rem, 2.5vw, 1.425rem);
			margin: 0 0 30px 0;
		}

		#site-head {
			width: 100%;
			height: 80px;
			background-color: #000000;
			z-index: 2;
		}
		
		.site-head-content {
			width: auto;
			margin: 0 auto;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 12px 20px;
		}
		
		#site-head .logo img {
			width: 130px;
			height: auto;
		}
		
		.btn {
			background-color: rgb(242 43 124);
			border: 2px solid rgb(242 43 124);
			transition: border-color 0.4s ease 0s, background-color 0.4s ease 0s;
			padding: 12px 24px;
			text-decoration: none;
			color: #fff;
			font-family: "Montserrat", sans-serif;
			font-size: 16px;
			font-weight: 700;
			display: inline-block;
		}
		
		.btn:hover {
			background-color: #fff;
			border: 2px solid rgb(242 43 124);
			color: rgb(242,43,124);
		}
		
		#main-content {
			overflow: hidden;
		}
		
		.lead-gen-home #main-content .section_content_top {
			position: relative;
		}
		
		.lead-gen-home #main-content .section_content_top:before {
			content: "";
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			background: url("../images/hero_bg_mobile.jpg");
			background-size: 100% auto;
			/*background-size: cover;*/
			background-position: center bottom;
			background-repeat: no-repeat;
		}
		
		section {
			max-width: 1450px;
			margin: 0 auto;
		}
		
		.hero-heading-container {
			width: 100%;
			height: auto;
			margin: 0 auto;
			z-index: 1;
			position: relative;
			text-align: center;
			padding-top: 40px;
			padding-bottom: 40px;
		}
		
		.hero-heading {
			width: 100%;
			height: auto;
			margin: 0 auto;
			z-index: 1;
			position: relative;
		}

		.fade-in-image { 
			opacity: 0;
			margin: 0 auto;
			position: relative;
			animation: fadeIn 0.8s;
			animation-fill-mode: forwards;
		}
		
		.fade-in-scale-image { 
			opacity: 0;
			margin: 0 auto;
			position: relative;
			animation: fadeInScale 1s;
			animation-fill-mode: forwards;
		}
		
		.hero-image {
			width: 54%;
			height: auto;
			z-index: 0;
		}

		.section_content .fade-in-image:nth-child(2) {
			position: absolute;
			top: 75px;
			left: -9%;
		}
		.section_content .fade-in-image:last-child {
			position: absolute;
			top: 57px;
			right: -26%;
		}

		.float  {
			animation: float 3s ease-in-out infinite;
		}
		
		.delay2  {
			animation-delay: 0.3s;
		}
		
		.delay3  {
			animation-delay: 0.7s;
		}
		
		@keyframes fadeIn {
			0% { 
				opacity: 0;
				transform: translate(0,320px) scale(.2);
			}
			100% { 
				opacity: 1;
				transform: translate(0) scale(1); 
			}
		}
		
		@keyframes fadeInScale {
			0% { 
				opacity: 0;
				transform: translate(0,0) scale(.3);
			}
			50% { 
				opacity: 1;
				transform: translate(0,0) scale(1.2); 
			}
			90% { 
				opacity: 1;
				transform: translate(0,0) scale(1); 
			}
			100% { 
				opacity: 1;
				transform: translate(0,0) scale(1); 
			}
		}

		@keyframes float {
			0% {
				transform: translateY(0);
			}

			50% {
				transform: translateY(-20px);
			}

			100% {
				transform: translateY(0);
			}
		}
		
		.speech-wrapper {
			width: 100%;
			margin: 0 auto;
			height: auto;
			position: relative;
		}
		
		.speech-wrapper img {
			display: none;
			width: 100%;
			height: auto;
		}
		
		.speech-content {
			text-align: center;
			padding: 10%;
			background-color: #fff;
			
			position: relative;
		}
		
		.speech-content:before {
			content: "";
			position: absolute;
			left: 0;
			top: -15px;
			width: 100%;
			height: 38px;
			background: url("../images/speech_mobile_top.png");
			background-size: contain;
			background-position: top center;
			background-repeat: no-repeat;
			z-index:0;
		}
		
		.speech-content:after {
			content: "";
			position: absolute;
			left: 0;
			bottom: -100%;
			width: 100%;
			height: 100%;
			background: url("../images/speech_mobile_bottom.png");
			background-size: contain;
			background-position: top center;
			background-repeat: no-repeat;
		}
		
		.speech-content h2 { 
			margin-top: 0; 
		}
		
		footer {
			position: relative;
			padding: 2% 20px 80px;
			text-align: center;
			max-width: 840px;
			margin: 0 auto;
		}
		
		.lead-gen-home footer {
			padding: 40% 20px 80px;
		}
		
		footer * {
			color: #ffffff;
		}
		
		footer a {
			text-decoration: none;
		}
		
		footer img {
			width: 40px;
			height: 40px;
			margin-bottom: 20px;
		}
		
		footer p {
			font-size: 0.875rem;
			font-weight: 300;
		}
		
		@media only screen and (min-width: 599px) {
			.btn {
				font-size: 1.25rem;
				padding: 12px 40px;
			}
			.speech-content {
				padding: 12% 8%;
			}
			footer {
				padding: 20px 20px 80px;
			}
			
			.lead-gen-home footer {
				padding: 200px 20px 80px;
			}
		}
		
		@media only screen and (min-width: 992px) {
			.btn {
				padding: 12px 30px;
			}
			
			.lead-gen-home #main-content .section_content_top:before {
				content: none;
			}
			
			#main-content { 
				background: url("../images/hero_bg.png");
				background-size: 100% auto;
				background-position: top center;
				background-repeat: no-repeat;
			}		
			
			#site-head .logo img {
				width: 180px;
				height: auto;
			}
			.hero-heading-container {
				width: 940px;
				height: auto;
				margin: 0 auto;
				z-index: 1;
				position: relative;
				padding-top: 70px;
				padding-bottom: 0;
			}
		
			.hero-heading {
				width: 740px;
				height: auto;
			}
			
			.section_content_top {
				position: relative;
			}

			.section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 90px;
				left: 4%;
			}
			
			.section_content .fade-in-image:last-child {
				position: absolute;
				top: 60px;
				right: 3%;
			}
			.hero-image {
				width: 283px;
				height: auto;
			}
			
			.speech-wrapper {
				width: 884px;
			}
			.speech-wrapper img {
				display: block;
			}
			.speech-content {
				position: absolute;
				left: 0;
				top: 0;
				margin: 0 auto;
				text-align: center;
				/*padding: 80px 110px;*/
				padding: 9% 12%;
				background-color: transparent;
			}
			.speech-content:before, .speech-content:after {
				content: none;
			}
			
			.speech-content h2 span {
				display: block;
			}
			
			body:not(lead-gen-home) footer {
				padding: 80px 20px 80px;
			}
		}
		
		@media only screen and (min-width: 1200px) {
		.section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 90px;
				left: 10%;
			}
			
			.section_content .fade-in-image:last-child {
				position: absolute;
				top: 60px;
				right: 10%;
			}
		}
		
		@media only screen and (min-width: 1600px) {
			.site-head-content {
				width: 1450px;
				padding: 12px 20px;
			}

			.hero-heading-container {
				width: 940px;
				height: auto;
				margin: 0 auto;
				z-index: 1;
				position: relative;
				padding-top: 70px;
			}
		
			.hero-heading {
				width: 940px;
				height: auto;
			}
			.section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 90px;
				left: -9%;
			}
			.section_content .fade-in-image:last-child {
				position: absolute;
				top: 60px;
				right: -3%;
			}
			.hero-image {
				width: 483px;
				height: auto;
			}
			
			.speech-wrapper {
				width: 884px;
			}
		}
		
		
		/* Survey page styles */		
		
		.lead-gen-survey #main-content {
			background: url("../images/bg_mobile.jpg");
			background-size: cover;
			background-position: center;
			background-repeat: no-repeat;
		}
		.lead-gen-survey #main-content:before {
			content: none;
		}
		.questions-wrapper {
			text-align: center;
			padding: 70px 20px;
		}
		.progress-bar {
			width: 221px;
			margin-bottom: 10px;
		}
		.questions {
			margin-top: 0px;
		}
		.questions .question {
			display: block;
			background-color: #fff;
			padding: 20px 40px;
			margin-bottom: 10px;
			font-weight: 500;
			cursor: pointer;
		}
		
		.questions .question {
			transition: box-shadow 0.3s ease;
		}

		.questions .question.selected  {
			outline: 4px solid #ed276f;
			box-shadow: 0px 0px 20px 10px #ed276f;

		}
		.questions .question:not(.selected):hover {
			box-shadow: 0px 0px 20px 10px #f3f3f3;
		}

		.questions-content .btn  {
			margin-top: 30px;
			padding: 12px 65px;
		}
		.questions-wrapper input[type="submit"]:hover {
			cursor: pointer;
		}
		
		@media only screen and (min-width: 992px) {
			.lead-gen-survey #main-content { 
				background: url("../images/bg.jpg");
				background-size: 100% auto;
				background-position: top center;
				background-repeat: no-repeat;
			}
			.questions-wrapper {
				width: 990px;
				margin: 0 auto;
				padding-top: 70px;
			}
			.questions-wrapper h1 {
				padding-left: 40px;
				padding-right: 40px;
			}
			.questions .question {
				margin-bottom: 20px;
			}
			.questions-content .btn  {
				margin-top: 40px;
			}
		}
		
		
		/* Form page styles */	
		.data-capture {display:none;}
		
		.data-capture .questions-wrapper {
			padding: 50px 20px;
		}
		.data-capture .questions-content {
			text-align: center			
		}
		.data-capture .results-title {
			width: 100%;
			height: auto;
			max-width: 368px;
			margin: 0 auto;
			text-align: center;
			opacity: 0;
			animation: zoom 0.8s;
			animation-fill-mode: forwards;
		}
		.data-capture #results-form {
			margin: 0 auto;
			text-align: center;
		}
		.data-capture #results-form fieldset {
			border: none;
			text-align: center;
			padding: 0;
		}
		.data-capture #results-form input[type="text"] {
			border: 1px  solid #5d7394;
			margin-bottom: 16px;
			width: 100%;
			box-sizing: border-box;
			color: #262d3b;
			font-weight: 500;
			font-family: "Montserrat", sans-serif;    
			font-size: 0.8rem;			
  			line-height: 1.2rem;
			padding: 14px 16px;
			text-align:center;
		}
		.data-capture #results-form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #262d3b; text-align: center; }
		.data-capture #results-form input::-moz-placeholder { /* Firefox 19+ */ color: #262d3b; text-align: center; }
		.data-capture #results-form input:-ms-input-placeholder { /* IE 10+ */ color: #262d3b; text-align: center; }
		.data-capture #results-form input:-moz-placeholder { /* Firefox 18- */ color: #262d3b; text-align: center; }
		.data-capture .questions-content .btn {
			padding: 12px 25px;
			margin-top: 10px;
			width: 100%;
		}
		.data-capture #results-form input[type="submit"] {
			font-size: 0.8rem;			
		}
		
		@keyframes zoom {
			0% {
				transform: scale(.3) translate(0, 0);
				acity: 0;
			}

			50% {
				transform: scale(1.1) translate(0, 0);
			  opacity: 1;
			}

			100% {
				transform: scale(1) translate(0, 0);
			  opacity: 1;
			}
		}
		
		@media only screen and (min-width: 768px) {
			.data-capture #results-form input[type="text"] {
				padding: 20px 40px;
				font-size: 1.1rem;
				line-height: 1.3rem;
			}
			.data-capture .questions-content .btn {
				width: auto;
				padding: 12px 65px;
				margin-top: 30px;
			}
			.data-capture #results-form input[type="submit"] {
				font-size: 1.25rem;
			}
		}
		
		@media only screen and (min-width: 992px) {
			.data-capture .results-title {
				max-width: 910px;
				margin-top: 40px;
				margin-bottom: 30px;
			}
			.data-capture #results-form {
				max-width: 410px;
			}
		}
		
		.btn.disabled, .btn.disabled:hover {
	
			pointer-events: none;
		}
		
		.error {
		  color: red;
		  font-size: 1em;
		  margin-top: 4px;
		  font-weight:bold;
		  }
		  
		  .questions .question {
		  user-select: none;       
		  -webkit-user-select: none; 
		  -moz-user-select: none;   
		  -ms-user-select: none; 
		}

/* Results page styles */
		/*.lead-gen-result #main-content {
			background: url("../images/bg_mobile.jpg");
			background-size: 100% auto;
			background-position: top;
			background-repeat: no-repeat;
			position: relative;
		}*/
		.lead-gen-result #main-content {
			background: url("../images/result_bg_top_mobile4.jpg");
			background-size: 100% 600px;
			background-position: center top;
			background-repeat: no-repeat;
			position: relative;
		}
		
		.lead-gen-result .section_content_top {

			position: relative;
		}
		.lead-gen-result #main-content:before {
			content: none;
		}
		.lead-gen-result .profile-bottom {
			background: url(images/profile_bg_bottom.png);
			background-size: 100% auto;
			background-position: top;
			background-repeat: no-repeat;
			position: relative;
			z-index: -1;
		}
		.lead-gen-result .hero-heading-container {
			padding-top: 130px;
			padding-bottom: 130px;
		}
		.lead-gen-result .hero-heading {
			width: 88%;
		}
		.lead-gen-result .hero-image {
			width: 70%;
		}
		.lead-gen-result .section_content .fade-in-image:nth-child(2) {
			top: 45px;
			right: -25%;;
		}
		.lead-gen-result .section_content .fade-in-image:last-child {
			position: absolute;
			top: 35px;
			right: -30%;
		}
		.lead-gen-result .speech-wrapper p {
			font-size: clamp(1rem, 2.5vw, 1.125rem);
		  	line-height: clamp(1.5rem, 2.5vw, 1.725rem);
			margin-bottom: 0;
		}
		.lead-gen-result .profile-wrapper {
			max-width: 900px;
			margin: 0 auto;
			padding: 80px 20px 140px 20px;
		}
		.lead-gen-result .profile-wrapper * {
			color: #fff;
		}
		.lead-gen-result .profile-content {
			padding-bottom: 30px;
		}
		.lead-gen-result .profile-wrapper ul {
		  /*list-style-image: url(images/bullet.png);*/
			padding-left: 20px;
		}
		.lead-gen-result .profile-wrapper li::marker {
		  content: url(images/bullet.png);
			background-size: 10px 10px;
		}
		.lead-gen-result .profile-wrapper li {
			font-weight: 300;
			font-size: clamp(1rem, 2.5vw, 1.065rem);
			line-height: 1.8rem;
 			margin-bottom: 10px;
		}
		.lead-gen-result .profile-wrapper li strong {
			font-weight: 700;
		}
		
		.lead-gen-result .help-wrapper {
			width: 100%;
			margin: 0 auto;
			height: auto;
			position: relative;
		}
		
		.lead-gen-result .help-wrapper img {
			display: none;
			width: 100%;
			height: auto;
		}
		
		.lead-gen-result .help-content {
			text-align: center;
			padding: 8%;
			background-color: #fff;
			position: relative;
			margin-bottom: 200px;
			z-index: 1;
		}
		
		.lead-gen-result .help-content:before {
			content: "";
			position: absolute;
			left: 0;
			top: -28vw;
			width: 100%;
			height: 100%;
			background: url("../images/speech_result-mobile-top.png");
			background-size: contain;
			background-position: top center;
			background-repeat: no-repeat;
			z-index: -1;
		}
		
		.help-content:after {
			content: "";
			position: absolute;
			left: 0;
			bottom: -100%;
			width: 100%;
			height: 100%;
			background: url("../images/speech_result-mobile-bottom.png");
			background-size: 100% auto;
			background-position: top center;
			background-repeat: no-repeat;
		}
		.lead-gen-result .help-content h2 { 
			margin-top: 0; 
		}
		.lead-gen-result .help-content a:not(.btn) {
			text-decoration: none;
			font-weight: 700;
			color: #ed276f;
		}
		
		@media only screen and (min-width: 599px) {
			.lead-gen-result .profile-wrapper {
				padding: 120px 20px 270px 20px;
			}
			.lead-gen-result .help-content {
				margin-bottom: 250px;
			}
		}
		
		@media only screen and (min-width: 992px) {
			.lead-gen-result #main-content { 
				background: url("../images/bg.jpg");
				background-size: 100% auto;
				background-position: top center;
				background-repeat: no-repeat;
			}
			.lead-gen-result .section_content_top, .lead-gen-result .profile-bottom {
				background: none;
			}
			.lead-gen-result .profile-bottom {
				position: relative;
				z-index: 1;
			}
			.lead-gen-result .profile-wrapper {
				z-index: 1;
        		position: relative;
			}
			.lead-gen-result .speech-wrapper img {
				max-width: 640px;
				margin: 0 auto;
			}
			.lead-gen-result .hero-image {
				width: 283px;
				height: auto;
			}
			.lead-gen-result .section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 290px;
				left: 1%;
				right: auto;
			}
			.lead-gen-result .section_content .fade-in-image:last-child {
				position: absolute;
				top: 260px;
				right: 1%;
			}
			.lead-gen-result .hero-heading-container {
				padding-top: 60px;
				padding-bottom: 60px;
			}
			.lead-gen-result .speech-wrapper {
				width: 640px;
			}
			.lead-gen-result  .speech-content {
				padding: 8% 16%;
			}
			.lead-gen-result .speech-content.speech-content-apprentice {
				padding: 8% 13%;
			}
			.lead-gen-result .profile-wrapper {
				padding: 0px 20px 0px 20px;
			}
			.lead-gen-result  .help-wrapper {
				width: 906px;
			}
			.lead-gen-result .help-wrapper img {
				display: block;
			}
			.lead-gen-result .help-wrapper img {
				max-width: 906px;
				margin: 0 auto;
			}
			.lead-gen-result .help-content {
				position: absolute;
				left: 0;
				top: 0;
				margin: 0 auto;
				text-align: center;
				/*padding: 80px 110px;*/
				padding: 12% 19%;
				background-color: transparent;
			}
			.lead-gen-result .help-content.help-content-apprentice {
				padding: 14% 14%;
			}
			.lead-gen-result .help-content.help-content-strategist {
				padding: 12% 13%;
			}
			.lead-gen-result .help-content.help-content-orchestrator {
				padding: 14% 11%;
			}
			.lead-gen-result .help-content:before, .help-content:after {
				content: none;
			}
			
			.lead-gen-result .help-content h2 span {
				display: block;
			}
		}
		
		@media only screen and (min-width: 1200px) {
			.lead-gen-result .section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 290px;
				left: 10%;
				right: auto;
			}
			.lead-gen-result .section_content .fade-in-image:last-child {
				position: absolute;
				top: 260px;
				right: 10%;
			}
		}
		
		@media only screen and (min-width: 1600px) {
			.lead-gen-result .hero-heading {
				height: 196px;
				width: auto;
			}
			.lead-gen-result .hero-image {
				width: 380px;
				height: auto;
			}
			.lead-gen-result .section_content .fade-in-image:last-child {
				position: absolute;
				top: 280px;
				right: 6%;
			}   
			.lead-gen-result .section_content .fade-in-image:nth-child(2) {
				position: absolute;
				top: 310px;
				left: 5%;
			}
			.profile-wrapper {
				padding: 120px 20px;
			}
			.help-wrapper {
				width: 884px;
			}
		}

		.lead-gen-result .hero-heading, .lead-gen-result .speech-content, .lead-gen-result .profile-wrapper, .lead-gen-result .help-content {display:none;}
		
		#searchlight {position:absolute; top:0px; width:100%; max-width:900px; background:no-repeat center; background-size:contain; aspect-ratio:900 / 600;}
		@media only screen and (max-width: 992px) {
			#searchlight {position:absolute; top:0px; width:100%; max-width:900px; background:no-repeat center; background-size:contain; aspect-ratio:900 / 600;}
		}
		@media only screen and (max-width: 599px) {
			#searchlight {position:absolute; width:100%; max-width:900px; top:0; height:450px; background-position:center top; background-size:contain; aspect-ratio:900 / 1200;}
		}

.optin-container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 17px;
  text-align: left;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.optin-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.optin-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff; border:solid 1px #000;
}

.optin-container:hover input ~ .optin-checkmark {
  background-color: #fff;
}

.optin-container input:checked ~ .optin-checkmark {
  background-color: rgb(242 43 124);
}

.optin-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.optin-container input:checked ~ .optin-checkmark:after {
  display: block;
}

.optin-container .optin-checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

