/* CSS clear based on http://meyerweb.com/eric/tools/css/reset/ */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address,
big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl,
dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time,
mark, audio, video {
	padding: 0; margin: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers and specific declarations */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: ''; content: none;
}

table {
	border-spacing: 0; border-collapse: collapse;
}


/* Main definitions */

html {
	box-sizing: border-box;
}

*, *:before, *:after {
	box-sizing: inherit;
}

body {
	padding: 0; margin: 0;
	position: relative;
	background: #fff;
}

.body {
	width: 100%; max-width: 1920px; min-height: 100vh;
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	background: #f7faff;
}

body, td, p, ul, ol {
	color: #303030;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 19px; line-height: 1.6em;
}

b, strong {
	font-weight: bold;
}

i, em {
	font-style: italic;
}

a, a:visited {
	color: #1865a7;
	text-decoration: none;
	transition: color 0.35s, background 0.35s;
}

a:hover, a:active {
	color: #184587;
	text-decoration: none;
	transition: color 0.35s, background 0.35s;
}

p {
	margin-bottom: 1em;
	text-align: justify;
}

p:last-child {
	margin-bottom: 0;
}

hr {
	height: 1px; display: block; clear: both;
	padding: 0; margin: 20px 0;
	background: rgba(0, 0, 0, 0.1); border: none;
}

h1 {
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 88px; line-height: 1em; font-weight: 900; text-align: center; text-transform: uppercase;
}

h2 {
	position: relative;
	padding-bottom: 25px;
	color: #1865a7;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 28px; line-height: 1em; font-weight: 700; text-align: center; 
}

h2::after {
	width: 50px; height: 2px; display: block; content: '';
	position: absolute; left: 50%; bottom: 0;
	margin-left: -25px;
	background-color: #1865a7;
}

h2.left-aligned {
	text-align: left;
}

h2.left-aligned::after {
	position: absolute; left: 0;
	margin-left: 0;
}

h3 {
	position: relative;
	padding-bottom: 18px;
	color: #1865a7;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 23px; line-height: 1em; font-weight: 700; text-align: left; text-transform: uppercase;
}

h3::after {
	width: 50px; height: 2px; display: block; content: '';
	position: absolute; left: 0; bottom: 0;
	background-color: #1865a7;
}

h4 {
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 19px; line-height: 1em; font-weight: 700; text-align: left; text-transform: uppercase;
}

h5 {
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; line-height: 0.9em; font-weight: 400; letter-spacing: -1px; text-align: center; text-transform: uppercase;
}

.clear {
	clear: both;
}

.cf:before,
.cf:after {
	content: "";
	display: table;
}

.cf:after {
	clear: both;
}

.wrapper {
	width: 1220px; max-width: 100%;
	position: relative;
	margin: 0 auto;
}

.last-section {
	padding-bottom: 200px !important;
}

.centered {
	text-align: center;
}


/* Buttons */

.main-button {
	min-height: 70px; display: inline-block;
	position: relative;
	padding: 25px 80px 25px 30px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); border-radius: 35px;
	font-size: 19px; line-height: 20px; font-weight: 900; text-align: left; text-transform: uppercase;
}

.main-button::before {
	width: 46px; height: 46px; display: block; content: '';
	position: absolute; top: 12px; right: 12px; z-index: 10;
	background-color: #bd69d9; border-radius: 50%; box-shadow: inset 3px 3px 7px rgba(0, 0, 0, 0.15);
	transition: background-color 0.25s, transform 0.25s;
}

.main-button::after {
	width: 0; height: 0; display: block; content: '';
	position: absolute; top: 26px; right: 27px; z-index: 15;
	border-width: 8px 0 8px 12px; border-style: solid;
	border-color: transparent transparent transparent #fff;
}

.main-button,
.main-button:link,
.main-button:visited {
	background-color: #fff; color: #bd69d9;
	transition: padding 0.25s, color 0.25s;
}

.main-button:hover,
.main-button:active {
	padding-left: 35px;
	color: #1865a7;
	transition: padding 0.25s, color 0.25s;
}

.main-button:hover::before,
.main-button:active::before {
	background-color: #1865a7;
	transform: scale(1.15);
	transition: background-color 0.25s, transform 0.25s;
}

.main-button.narrow {
	min-height: 60px;
	padding: 20px 70px 20px 25px;
	border-radius: 30px;
}

.main-button.narrow::before {
	top: 7px; right: 7px;
}
.main-button.narrow::after {
	top: 21px; right: 21px;
}

.main-button.narrow:hover,
.main-button.narrow:active {
	padding-left: 25px; padding-right: 75px;
}

.main-button.inverted,
.main-button.inverted:link,
.main-button.inverted:visited {
	background: #bd69d9; color: #fff;
	transition: padding 0.25s, color 0.25s;
}

.main-button.inverted::before {
	background: #fff;
}

.main-button.inverted::after {
	border-color: transparent transparent transparent #bd69d9;
}

.test-button {
	display: inline-block;
	padding: 22px 46px;
	border: none; border-radius: 6px;
	font-size: 0; line-height: 0;
}

.test-button,
.test-button:link,
.test-button:visited {
	background-color: #909090; color: #fff;
}

.test-button.green,
.test-button.green:link,
.test-button.green:visited {
	background-color: #196f0b;
}

.test-button.green:hover,
.test-button.green:active {
	background-color: #135709;
}

.test-button.red,
.test-button.red:link,
.test-button.red:visited {
	background-color: #850909;
}

.test-button.red:hover,
.test-button.red:active {
	background-color: #6b0707;
}

.test-button.blue,
.test-button.blue:link,
.test-button.blue:visited {
	background-color: #097ad9;
}

.test-button.blue:hover,
.test-button.blue:active {
	background-color: #0765b3;
}

.test-button.white,
.test-button.white:link,
.test-button.white:visited {
	background-color: #fff; color: #2796f4;
}

.test-button.white:hover,
.test-button.white:active {
	background-color: #f0f0ff; color: #1865a7;
}

.test-button span {
	display: inline-block; vertical-align: middle;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 26px; line-height: 28px; font-weight: 700; text-transform: uppercase;
}

.test-button i {
	width: 27px; height: 22px; display: inline-block; vertical-align: middle;
	margin-left: 20px;
	background-position: center center; background-repeat: no-repeat;
}

.test-button[data-button="start"] i,
.test-button[data-button="hider"] i {
	background-image: url("../images/button-icon-play.png");
}

.test-button.white[data-button="start"] i {
	background-image: url("../images/button-icon-play-blue.png");
}

.test-button[data-button="tak"] i {
	background-image: url("../images/button-icon-tick.png");
}

.test-button[data-button="nie"] i {
	background-image: url("../images/button-icon-cross.png");
}

.small-button {
	display: inline-block;
	padding: 10px 15px;
	border: none; border-radius: 17px;
	font-size: 14px; line-height: 1em; font-weight: 700; text-transform: uppercase;
}

.small-button,
.small-button:link,
.small-button:visited {
	background-color: #1b7ed4; color: #fff;
}




/* Site header */

.site-header {
	width: 100%;
	background: #4884be;
	position: relative; z-index: 10;
}

.site-header::before {
	width: calc(100% + 40px); height: 150px; display: block; content: '';
	position: absolute; top: calc(100% - 15px); left: -20px; z-index: 20;
	background: #f7faff;
	transform: rotate(3.5deg);
	transform-origin: bottom right;
}

.site-header.site-header-test {
	padding-bottom: 400px;
	background-image: url("../images/header-bgd.jpg"); background-position: center center; background-repeat: no-repeat;
	background-size: cover;
}

.site-header.site-header-test h1 {
	color: #fff;
	margin-top: 60px;
}

.site-header.site-header-results {
	padding-bottom: 175px;
	background-image: url("../images/header-bgd.jpg"); background-position: center center; background-repeat: no-repeat;
	background-size: cover;
}

.site-header.site-header-results h1 {
	color: #fff;
	margin-top: 60px;
}

.videobg-holder {
	width: 100%;
	position: absolute; left: 0; top: 0; z-index: 5;
}

.videobg-aspect {
	width: 100%; height: 0;
	position: relative;
	padding-bottom: 41.145%
}

.videobg-player {
	width: 100%; height: 100%;
	position: absolute; left: 0; top: 0;
}

.videobg-player iframe {
	width: 100%; height: 100%;
	position: absolute; left: 0; top: 0;
	border: 0 none;
}

.site-header .wrapper {
	height: 100%;
	position: relative; z-index: 10;
}

.site-header .navigation {
	padding: 8px 0;
	border-bottom: 1px solid #fff;
}

.site-header .navigation .logo-holder {
	float: left;
	padding-left: 10px;
	font-size: 0; line-height: 0;
}

.site-header .navigation .logo-holder img {
	display: inline-block;
}

.site-header .navigation .button-holder {
	float: right;
	text-align: left;
}

.site-header .slogan {
	margin-top: 110px;
	color: #fff;
}

.site-header .slogan .text-large {
	font-size: 98px; line-height: 0.9em; font-weight: 900; letter-spacing: -2px; text-transform: uppercase;
}

.site-header .slogan .text-medium {
	margin-top: 25px;
	font-size: 72px; line-height: 1em; font-weight: 100; letter-spacing: -1px;
}

.site-header .slogan .text-medium span {
	display: block;
}

.site-header .slogan .button-holder {
	margin-top: 45px;
}

.site-header .elements {
	position: absolute; right: 0; bottom: 0;
}

.site-header .elements .cloud {
	position: absolute; right: 0; bottom: 15px;
}

.site-header .elements .rocket {
	position: absolute; right: 0; bottom: 140px;
}


/* Intro section */

.intro-section {
	position: relative; z-index: 30;
	padding: 30px 0 70px 0;
	background: #f7faff;
}

.intro-section-inside {
	padding-left: 400px;
}

.intro-section-inside .text {
	margin-top: 70px;
}

.intro-section-inside .text:first-child {
	margin-top: 0;
}

.intro-section-inside .text h2 {
	margin-bottom: 20px;
}

.intro-section .illustration {
	max-height: calc(100% + 140px); display: block;
	position: absolute; right: calc(50% + 240px); bottom: -70px;
}


/* Test intro section */

.test-intro-section {
	position: relative;
	padding: 45px 0;
	background: #1865a7;
}

.test-intro-section .text {
	margin-top: 60px;
}

.test-intro-section .text:first-child {
	margin-top: 0;
}

.test-intro-section .text h2 {
	margin-bottom: 35px;
	color: #fff;
}

.test-intro-section .text h2::after  {
	background-color: #fff;
}

.test-intro-section .text p {
	color: #fff;
	text-align-last: center;
}

.test-intro-section .text .button-holder {
	margin-top: 40px;
	text-align: center;
}


/* Test slider section */

.test-slider-section .slider-buttons {
	padding: 30px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	font-size: 0; line-height: 0; text-align: center;
}

.test-slider-section .slider-buttons li {
	display: inline-block;
	margin: 0 8px;
}

.test-slider-section .slider-buttons li:last-child {
	margin-right: 0;
}

.test-slider-section .slider-buttons li a {
	width: 190px; height: 48px; display: inline-block; vertical-align: middle;
	padding: 8px 15px 0 55px;
	background-position: left 17px center; background-repeat: no-repeat;
	border-radius: 24px;
	font-size: 14px; line-height: 16px; font-weight: 700; text-align: left; text-transform: uppercase;
}

.test-slider-section .slider-buttons li.kierownicza a {
	background-image: url("../images/slider-button-kierownicza.png");
}

.test-slider-section .slider-buttons li.spoleczna a {
	background-image: url("../images/slider-button-spoleczna.png");
}

.test-slider-section .slider-buttons li.innowacyjna a {
	background-image: url("../images/slider-button-innowacyjna.png");
}

.test-slider-section .slider-buttons li.przedmiotowa a {
	background-image: url("../images/slider-button-przedmiotowa.png");
}

.test-slider-section .slider-buttons li.metodyczna a {
	background-image: url("../images/slider-button-metodyczna.png");
}

.test-slider-section .slider-buttons li a:link,
.test-slider-section .slider-buttons li a:visited {
	background-color: #1865a7; color: #fff;
	transition: padding 0.35s, background-color 0.35s;
}

.test-slider-section .slider-buttons li.active a,
.test-slider-section .slider-buttons li a:hover,
.test-slider-section .slider-buttons li a:active {
	padding-left: 58px;
	background-color: #289bfe;
	transition: padding 0.35s, background-color 0.35s;
}

.test-slider-section .slider-content {
	padding: 50px 0;
	background: #fff;
	font-size: 0; line-height: 0;
}

.test-slider-section .slider-content .slide {
	background: #fff;
}

.test-slider-section .slide-image {
	width: calc(100% - 490px); display: block; float: right;
	padding-left: 50px;
	text-align: right;
}

.test-slider-section .slide-image img {
	max-width: 100%; display: inline-block;
	margin-top: 30px;
}

.test-slider-section .slide-text {
	width: 490px; display: block; float: left;
}

.test-slider-section .slide-text h3 {
	margin-bottom: 30px;
}

.test-slider-section .slide-text p {
	font-size: 16px;
}

.test-slider-section .slide-text .job-list {
	width: 260px;
	margin-left: 50px;
}

.test-slider-section .slide-text .job-list li {
	position: relative;
	padding: 20px 0 20px 40px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	font-size: 17px; line-height: 1.25em; font-weight: 700;
}

.test-slider-section .slide-text .job-list li:last-child {
	border-bottom: 0 none;
}

.test-slider-section .slide-text .job-list li::before {
	width: 24px; height: 24px; display: block; content: '';
	position: absolute; left: 0; top: 50%;
	margin-top: -12px;
	border: 2px solid #99d0ff; border-radius: 50%;
}

.test-slider-section .slide-text .job-list li::after {
	width: 0; height: 0; display: block; content: '';
	position: absolute; left: 9px; top: 50%;
	margin-top: -6px;
	border-width: 6px 0 6px 9px; border-style: solid;
	border-color: transparent transparent transparent #3371ad;
}

.test-slider-section .slide-text .job-list li a {
	display: block;
}

.test-slider-section .slide-text .job-list li a:hover,
.test-slider-section .slide-text .job-list li a:active {
	text-decoration: underline;
}


/* Career section */

.career-section-heading {
	padding: 45px 0 90px 0;
	background: #1865a7;
}

.career-section-heading h2 {
	color: #fff;
}

.career-section-heading h2::after {
	background-color: #fff;
}

.career-section-intro {
	position: relative;
	padding: 70px 0;
}

.career-section-intro .text {
	max-width: 570px;
}

.career-section-intro .illustration {
	width: 50%; height: calc(100% + 30px); display: block;
	position: absolute; bottom: 0; right: 0;
	background: url("../images/career-intro-illustration.jpg") center center no-repeat;
	background-size: cover;
}

.career-section-boxes {
	position: relative; z-index: 20;
	padding-top: 45px;
}

.career-section-boxes .boxes {
	margin-top: 45px;
}

.career-section-boxes .box {
	width: calc(33% - 10px); display: block; float: left;
	padding: 20px; margin-right: 15px;
	background: #fff; border-radius: 6px; 
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.career-section-boxes .box:last-child {
	margin-right: 0;
}

.career-section-boxes .box h4 {
	font-size: 0; line-height: 0;
	margin-bottom: 30px;
}

.career-section-boxes .box h4 i {
	width: 64px; height: 64px; display: inline-block; vertical-align: middle;
	background-color: #1865a7; background-position: center center; background-repeat: no-repeat;
	border-radius: 50%;
}

.career-section-boxes .box.box-rynek h4 i {
	background-image: url("../images/career-box-rynek.png");
}

.career-section-boxes .box.box-sciezka h4 i {
	background-image: url("../images/career-box-sciezka.png");
}

.career-section-boxes .box.box-mozliwosci h4 i {
	background-image: url("../images/career-box-mozliwosci.png");
}

.career-section-boxes .box h4 span {
	width: calc(100% - 80px); display: inline-block; vertical-align: middle;
	margin-left: 16px;
	color: #1865a7;
	font-size: 19px; line-height: 1.1em; font-weight: 700; text-align: left;
}

.career-section-boxes .box p {
	font-size: 15px; line-height: 1.5em; font-weight: 700;
}


/* Salary chart section */

.salary-chart-section {
	position: relative; z-index: 10;
	padding: 140px 0 80px 0; margin-top: -100px;
	background: #1865a7;
}

.salary-chart-section h2 {
	margin-bottom: 45px;
	color: #fff;
}

.salary-chart-section h2::after {
	background-color: #fff;
}

.salary-chart-section .chart-mobile-wrapper {
	display: none;
	text-align: center;
}

.salary-chart-section .chart-mobile-wrapper img {
	max-width: 95%;
	display: inline-block;
}


/* Activity chart section */

.activity-chart-section {
	position: relative; z-index: 30;
	padding: 45px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.activity-chart {
	width: 870px; display: block; float: right;
}

.activity-chart h2 {
	margin-bottom: 25px;
}

.activity-chart-section .chart-mobile-wrapper {
	display: none;
	text-align: center;
}

.activity-chart-section .chart-mobile-wrapper img {
	max-width: 95%;
	display: inline-block;
}

.activity-chart .chart-footer {
	margin-top: 20px;
	font-size: 12px; line-height: 1.65em;
}

.activity-chart-section .illustration {
	width: calc((100% - 1220px)/2 + 320px); height: calc(100% + 30px); display: block;
	position: absolute; bottom: 0; left: 0;
	background: url("../images/activity-chart-illustration.jpg") right center no-repeat;
	background-size: cover;
}


/* Find Out Section */

.find-out-section {
	background: #fff;
}

.find-out-intro {
	position: relative; z-index: 20;
	padding-top: 45px;
}

.find-out-intro h2 {
	margin-bottom: 45px;
}

.find-out-intro .button-holder {
	text-align: center;
}

.find-out-boxes {
	position: relative; z-index: 10;
	padding: 45px 0;
}

.find-out-boxes .boxes {
	width: 610px;
	margin-top: 30px;
	position: relative; z-index: 10;
}

.find-out-boxes .boxes h2 {
	margin-bottom: 45px;
}

.find-out-boxes .box {
	padding: 16px; margin-top: 20px;
	background-color: #064d89; border-radius: 4px;
}

.find-out-boxes .box .heading {
	padding-bottom: 15px; margin-bottom: 12px;
	border-bottom: 1px solid #fff;
	font-size: 0; line-height: 0;
}

.find-out-boxes .box .heading i {
	width: 38px; height: 38px; display: inline-block; vertical-align: middle;
	background-position: center center; background-repeat: no-repeat;
}

.find-out-boxes .box.box-czas .heading i {
	background-image: url("../images/find-out-box-czas.png");
}

.find-out-boxes .box.box-koszty .heading i {
	background-image: url("../images/find-out-box-koszty.png");
}

.find-out-boxes .box .heading span {
	width: calc(100% - 60px); display: inline-block; vertical-align: middle;
	margin-left: 22px;
	color: #fff;
	font-size: 28px; line-height: 1em; font-weight: 700; text-transform: uppercase;
}

.find-out-boxes .box p {
	margin: 0;
	color: #fff;
	font-size: 15px; line-height: 1.5em; font-weight: 700;
}

.find-out-boxes .illustration {
	max-height: 100%; display: block;
	position: absolute; bottom: 0; right: 0; z-index: 5;
}


/* Ending section */

.ending-section-heading {
	padding: 45px 0 90px 0;
	background: #1865a7;
}

.ending-section-heading h2 {
	color: #fff;
}

.ending-section-heading h2::after {
	background-color: #fff;
}

.ending-section-intro {
	position: relative;
	padding: 45px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.ending-section-intro .text {
	max-width: 560px; display: block; float: right;
}

.ending-section-intro .text p {
	font-size: 16px; line-height: 1.6em;
}

.ending-section-intro .illustration {
	width: 50%; height: calc(100% + 30px); display: block;
	position: absolute; bottom: 0; left: 0;
	background: url("../images/ending-intro-illustration.jpg") right center no-repeat;
	background-size: cover;
}

.ending-section-text {
	padding: 75px 0;
	background: #fff;
}

.ending-section-text .button-holder {
	margin-top: 45px;
	text-align: center;
}


/* Subpage test */

.flip-container {
	perspective: 1000px;
}

.flip-container .flipper {
	position: relative;
	transition: transform 0.75s, height 0.75s;
	transform-style: preserve-3d;
}

.flip-container.flipped .flipper {
	transform: rotateX(180deg);
	overflow: visible !important;
}

.flip-container .flipper .front {
	width: 100%;
	position: absolute; top: 0; left: 0;
	backface-visibility: hidden;
}

.flip-container .flipper .back {
	width: 100%;
	position: absolute; top: 0; left: 0;
	backface-visibility: hidden;
}

.flip-container .flipper .front {
	z-index: 2;
	transform: rotateX(0deg);
}

.flip-container .flipper .back {
	transform: rotateX(180deg);
}

.test-section {
	position: relative; z-index: 20;
	padding-bottom: 60px; margin-top: -340px;
	transition: margin 0.35s ease-in-out;
}

.test-section.moved {
	margin-top: -540px;
	transition: margin 0.35s ease-in-out;
}

.test-intro-box {
	padding: 35px 50px;
	background: #fff; border-radius: 6px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.test-intro-box h2 {
	margin-bottom: 40px;
}

.test-intro-box .button-holder {
	margin-top: 50px;
	text-align: center;
}

.test-box {
	background: #fff; border-radius: 6px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.test-box-header {
	height: 81px;
	padding: 15px;
	background: #f2f2f2; border-top-left-radius: 6px; border-top-right-radius: 6px; 
	font-size: 0; line-height: 0;
}

.test-box-header .counter {
	width: 150px; display: inline-block; vertical-align: middle;
	padding-left: 10px;
	border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.test-box-header .counter .number {
	height: 35px; display: block;
	padding-top: 3px;
	font-size: 28px; line-height: 30px; font-weight: 100;
}

.test-box-header .counter .number span  {
	display: inline-block;
	vertical-align: baseline;
}

.test-box-header .counter .label,
.test-box-header .progress .label {
	display: block;
	color: #1865a7;
	font-size: 13px; line-height: 15px; font-weight: 700;
}

.test-box-header .progress {
	width: calc(100% - 150px); display: inline-block; vertical-align: middle;
	padding: 0 15px 0 30px;
}

.test-box-header .progress-bar {
	width: 100%; height: 39px; display: block;
	position: relative;
	padding: 7px 0 3px 0;
}

.test-box-header .progress-bar .progress-base {
	width: 100%; height: 25px; display: block;
	padding: 4px;
	position: relative;
	background: #d6d6d6; border-radius: 10px;
}

.test-box-header .progress-bar .progress-current {
	width: 40%; height: 17px; display: block;
	background: #097ad9; border-radius: 10px;
	transition: width 0.75s ease-in-out;
}

.test-box-question {
	padding: 100px 50px;
	position: relative;
	border-top: 1px solid rgba(0, 0, 0, 0.15); border-bottom: 1px solid rgba(0, 0, 0, 0.15); color: #505050;
	font-size: 28px; line-height: 1.6em; text-align: center;
}

.test-box-question-inside {
	position: relative;
	transition: height 0.75s;
}

.test-box-question .question-text {
	width: 100%;
	position: absolute; left: 0; top: 0; z-index: 100;
	opacity: 1;
	transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.test-box-question .question-text.move-out {
	opacity: 0;
	transform: translateY(-25px);
	transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.test-box-question .question-text.move-in {
	opacity: 0;
	transform: translateY(25px);
	transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.test-box-buttons {
	padding: 35px 15px;
	text-align: center;
	background: #f2f2f2; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; 
}

.test-box-buttons > a {
	margin: 0 15px;
}

.test-form-box {
	padding: 35px 50px;
	background: #fff; border-radius: 6px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.test-form-box h2 {
	margin-bottom: 40px;
}

.test-form-box form {
	width: 760px; max-width: 100%; display: block;
	margin: 40px auto 0 auto;	
}

.form-row {
	margin-bottom: 40px;
}

.form-column {
	width: 49%; display: block; float: left;
	margin-right: 2%;
}

.form-column:nth-child(2) {
	margin-right: 0;
}

.form-column.full-width {
	width: 100%;
	margin-right: 0;
}

.form-group-input {
	position: relative;
}

.form-group-input input {
	width: 100%; display: block;
	padding: 10px 10px 10px 5px;
	background: transparent; border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.2); color: #606060;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 24px; line-height: 30px; font-weight: 400;
}

.form-group-input input:focus {
	outline: none;
}

.form-group-input input.error {
	box-shadow: none;
}

.form-group-input label {
	position: absolute; left: 5px; top: 10px;
	color: #909090; pointer-events: none;
	font-size: 26px; line-height: 30px; font-weight: 100;
	transition: all 0.4s ease;
}

.form-group-input input:focus ~ label,
.form-group-input input:valid ~ label,
.form-group-input.has-error input ~ label {
	top: -20px;
	font-size: 14px;
	color: #097ad9;
}

.form-group-input .underline {
	width: 100%; display: block;
	position: relative;
}

.form-group-input .underline::before {
	width: 0; height: 2px;
	display: block; content: '';
	position: absolute; left: 0; bottom: 0;
	background: #097ad9;
	transition: width 0.4s ease;
}

.form-group-input input:focus ~ .underline::before,
.form-group-input input:valid ~ .underline::before {
	width: 100%;
}

.form-group-select {
	position: relative;	
}

.form-group-select::after {
	width: 0; height: 0; display: block; content: '';
	position: absolute; top: 50%; right: 15px;
	padding: 3px; margin-top: -5px;
	border-style: solid; border-color: rgba(0, 0, 0, 0.2); border-width: 0 3px 3px 0;
	transform: rotate(45deg);
}
	
.form-group-select label {
	display: none;
}

.form-group-select label.error {
	display: block;
	position: absolute; left: auto; right: 5px; top: -20px;
	color: #fff;
	font-size: 14px;
}

.form-group-select select {
	width: 100%; height: 50px;
	padding: 4px 0;
	background-color: transparent; border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.2); color: #606060; color: #909090; cursor: pointer;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 26px; line-height: 50px; font-weight: 100;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.form-group-select select:focus {
	outline: none;
}

.form-group-select select option {
	color: #606060;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 18px; font-weight: 100;
}

.form-group-checkbox {
	position: relative;
	margin-bottom: 12px;
}

.form-group-checkbox label {
	width: calc(100% - 40px); display: inline-block; vertical-align: top;
	margin-left: 12px;
	cursor: pointer;
	font-size: 14px; line-height: 1.6em; text-align: justify;
}

.form-group-checkbox label::before,
.form-group-checkbox label::after {
	content: '';
	position: absolute; left: 0; top: 0;
}

.form-group-checkbox label::before {
	width: 24px; height: 24px;
	background: #fff; border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 3px; cursor: pointer;
	transition: background .3s;
}

.form-group-select label.error {
	display: block;
	position: absolute; left: auto; right: 5px; top: -20px;
	color: #fff;
	font-size: 14px;
}

.form-group-checkbox {
	margin-bottom: 30px;
}

.form-group-checkbox input[type="checkbox"] {
	width: 24px; height: 24px; display: block; float: left; visibility: hidden;
	margin: 0;
	outline: none; 
}

.form-group-checkbox input[type="checkbox"]:checked ~ label::before {
	background: #097ad9;
	border: none;
}

.form-group-checkbox input[type="checkbox"]:checked ~ label::after {
	width: 12px; height: 8px;
	border: 3px solid #fff; border-top-style: none; border-right-style: none;
	transform: translate(6px, 6px) rotate(-45deg);
}

.form-group-checkbox input[type="checkbox"]:disabled + label:before {
	border-color: rgba(0, 0, 0, 0.25);
}

.form-group-checkbox input[type="checkbox"]:disabled:checked + label:before {
	background: rgba(0, 0, 0, 0.25);
}

span.form-error {
	display: block; position: absolute;
	right: 5px; top: -20px;
	color: #1865a7;
	font-size: 14px;
}

.results-form-section span.form-error {
	color: #fff;
}

.form-group-checkbox span.form-error {
	right: auto; left: 0; top: -30px;
}

.form-row .button-holder {
	text-align: center;
}

.form-medium-label {
	margin-bottom: 12px;
	color: #606060;
	font-size: 15px; line-height: 1.5em;
}

.form-small-label {
	margin-bottom: 12px;
	color: #606060;
	font-size: 12px; line-height: 1.5em; font-weight: 700;
}


/* Results intro section */

.results-intro-section {
	position: relative; z-index: 30;
	margin-top: -20px; 
}

.results-intro-section h2 {
	margin-bottom: 30px;
}


/* Results general section */

.results-general-section {
	margin-top: 50px;
}

.results-general-section .wrapper {
	position: relative; z-index: 10;
}

.results-general-section .wrapper::before {
	width: 1500px; height: 100%; display: block; content: '';
	position: absolute; left: 50%; top: 0; z-index: -1;
	background-color: #1865a7;
}

.results-general-chart-wrapper {
	width: 50%; display: block; float: left;
	padding-top: 30px;
}

.results-general-stats-wrapper {
	width: 50%; display: block; float: right;
	padding: 35px 0 35px 35px;
	color: #fff;
}

.results-general-stats-wrapper h2 {
	color: #fff;
}

.results-general-stats-wrapper h2::after {
	background-color: #fff;
}

.results-general-stats-wrapper .main-stats-table {
	margin-top: 30px;
}

.results-general-stats-wrapper .main-stats-table .row {
	padding: 12px 0;
	border-bottom: 1px dotted #fff;
}

.results-general-stats-wrapper .main-stats-table .row .label {
	display: block; float: left;
	font-size: 22px; line-height: 35px;
}

.results-general-stats-wrapper .main-stats-table .row .value {
	display: block; float: right;
	font-size: 35px; line-height: 35px; font-weight: 900;
}

.results-general-stats-wrapper .main-stats-footer {
	margin-top: 15px;
	font-size: 0; line-height: 0; text-align: left;
}

.results-general-stats-wrapper .main-stats-footer .text {
	display: inline-block; vertical-align: middle;
	margin-top: 15px; margin-right: 20px;
	color: #fff;
	font-size: 13px; line-height: 1.2em; font-weight: 700; text-align: right;
}

.results-general-stats-wrapper .main-stats-footer .facebook-button {
	display: inline-block; vertical-align: middle;
	padding: 15px 55px 14px 25px; margin-top: 15px;
	border-radius: 4px;
	font-size: 13px; line-height: 1.3em; font-weight: 900; text-align: left; text-transform: uppercase;
}

.results-general-stats-wrapper .main-stats-footer .facebook-button,
.results-general-stats-wrapper .main-stats-footer .facebook-button:link,
.results-general-stats-wrapper .main-stats-footer .facebook-button:visited {
	background: #f7faff url("../images/button-icon-facebook.png") right 20px center no-repeat; color: #2280d0;
}


/* Results hiding */

.results-hidden-button-holder {
	padding: 30px 0 60px 0;
	text-align: center;
}

.results-hidden {
	display: none;
}


/* Results personality section */

.results-personality-section {
	padding: 40px 0;
	background: #fff; border-top: 1px solid rgba(0, 0, 0, 0.125); border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.results-personality-section .description {
	margin-top: 30px;
	font-size: 0; line-height: 0;
}

.results-personality-section .description .number-box {
	width: 122px; height: 122px; display: inline-block; vertical-align: top;
	background: #1b7ed4; border-radius: 4px;
	margin-top: 5px;
	text-align: center;
}

.results-personality-section .description .number-box .label {
	display: block;
	margin-top: 20px;
	color: #fff;
	font-size: 11px; line-height: 1em;
}

.results-personality-section .description .number-box .value {
	display: block;
	margin-top: 8px;
	color: #fff;
	font-size: 55px; line-height: 1em; font-weight: 700;
}

.results-personality-section .description .text {
	width: calc(100% - 122px); display: inline-block; vertical-align: top;
	padding-left: 30px;
}

.results-personality-section .description .text p {
	color: #606060;
	line-height: 1.4em;
}


/* Results jobs section */

.results-jobs-section {
	padding-top: 30px; padding-bottom: 10px;
}

.results-jobs-listing .item {
	width: calc(50% - 10px); display: block; float: left;
	margin-right: 20px; margin-bottom: 20px;
	background: #fff; border-radius: 6px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.075);
}

.results-jobs-listing .item:nth-child(2n) {
	margin-right: 0;
}

.results-jobs-listing .item .illustration {
	width: 160px; display: block; float: left;
	background-position: center center; background-repeat: no-repeat; background-size: cover;
	border-radius: 6px;
}

.results-jobs-listing .item .text {
	width: calc(100% - 160px); display: block; float: right;
	padding: 12px;
}

.results-jobs-listing .item .text h3 {
	padding-bottom: 0;
	font-size: 20px; line-height: 1.25em; text-transform: none;
}

.results-jobs-listing .item .text h3::after {
	display: none;
}

.results-jobs-listing .item .text p {
	margin-top: 15px;
	color: #303030;
	font-size: 15px; line-height: 1.5em; font-weight: 700;
}

.results-jobs-listing .item .text .button-holder {
	margin-top: 15px;
	text-align: right;
}


/* Results form section */

.results-form-section {
	padding: 45px 0;
	background: #1865a7;
}

.results-form-section h2 {
	color: #fff;
	margin-bottom: 30px;
}

.results-form-section h2::after {
	background-color: #fff;
}

.results-form-section .text p {
	color: #fff;
}

.results-form-section form {
	width: 760px; max-width: 100%; display: block;
	margin: 60px auto 0 auto;	
}

.results-form-section .form-group-input input {
	border-bottom: 1px solid rgba(255, 255, 255, 0.35); color: #fff;
}

.results-form-section .form-group-input label {
	color: #d0d0d0;
}

.results-form-section .form-group-input input:focus ~ label,
.results-form-section .form-group-input input:valid ~ label,
.results-form-section .form-group-input.has-error input ~ label {
	color: #d0d0d0;
}

.results-form-section .form-group-input .underline::before {
	background: #d0d0d0;
}

.results-form-section .form-group-select::after {
	border-color: rgba(255, 255, 255, 0.35);
}

.results-form-section .form-group-select select {
	border-bottom: 1px solid rgba(255, 255, 255, 0.35); color: #d0d0d0;
}

.results-form-section .form-group-checkbox label {
	color: #f0f0f0;
}

.results-form-section .form-small-label {
	color: #d0d0d0;
}


/* Footer */

.site-footer {
	position: relative; z-index: 20;
	background: #064d89;
}

.site-footer-partner {
	padding: 40px 0;
}

.site-footer-partner span {
	display: block;
	color: #fff;
	font-size: 13px; line-height: 1.2em; font-weight: 400;
}

.site-footer-partner img {
	display: block;
	margin-top: 20px;
}

.site-footer-notes {
	padding: 10px 0;
	background-color: rgba(0, 0, 0, 0.2);	
	font-size: 0; line-height: 0;
}

.site-footer-notes .copyright {
	display: block; float: left;
	color: rgba(255, 255, 255, 0.75);
	font-size: 13px; line-height: 21px; font-weight: 400;
}

.site-footer-notes .created {
	display: block; float: right;
	color: rgba(255, 255, 255, 0.6);
	font-size: 13px; line-height: 21px; font-weight: 400;
}

.site-footer-notes .created span,
.site-footer-notes .created span a,
.site-footer-notes .created span img {
	display: inline-block; vertical-align: top;
}

.site-footer-notes .created span a:link,
.site-footer-notes .created span a:visited {
	color: rgba(255, 255, 255, 0.45);
}

.site-footer-notes .created .buzzit {
	padding: 0 10px;
}

.site-footer-notes .created .buzzit img {
	margin-left: 5px;
}

.site-footer-notes .created .webology {
	padding: 0 10px;
	border-left: 1px dotted rgba(255, 255, 255, 0.45);
}


/* Odometer fix */

.odometer-digit:first-child {
	display: none !important;
}


/* AOS Animations */

[data-aos="soft-fade-up"] {
	opacity: 0;
	transition-property: transform, opacity;
	transition-duration: 0.5s !important;
}

[data-aos="soft-fade-up"].aos-animate {
    opacity: 1;
	transition-property: transform, opacity;
	transition-duration: 0.5s !important;
}

@media screen and (min-width: 768px) {
	[data-aos="soft-fade-up"] {
		transform: translateY(50px);
	}

	[data-aos="soft-fade-up"].aos-animate {
		transform: translateX(0);
	}
}

[data-aos="soft-fade-down"] {
	opacity: 0;
	transition-property: transform, opacity;
	transition-duration: 0.5s !important;
}

[data-aos="soft-fade-down"].aos-animate {
    opacity: 1;
	transition-property: transform, opacity;
	transition-duration: 0.5s !important;
}

@media screen and (min-width: 768px) {
	[data-aos="soft-fade-down"] {
		transform: translateY(-50px);
	}

	[data-aos="soft-fade-down"].aos-animate {
		transform: translateX(0);
	}
}

[data-aos="soft-fade-left"] {
	opacity: 0;
	transition-property: transform, opacity;
	transition-duration: 0.8s !important;
}

[data-aos="soft-fade-left"].aos-animate {
    opacity: 1;
	transition-property: transform, opacity;
	transition-duration: 0.8s !important;
}

@media screen and (min-width: 768px) {
	[data-aos="soft-fade-left"] {
		transform: translateX(50px);
	}

	[data-aos="soft-fade-left"].aos-animate {
		transform: translateX(0);
	}
}

[data-aos="soft-fade-right"] {
	opacity: 0;
	transition-property: transform, opacity;
	transition-duration: 0.8s !important;
}

[data-aos="soft-fade-right"].aos-animate {
    opacity: 1;
	transition-property: transform, opacity;
	transition-duration: 0.8s !important;
}

@media screen and (min-width: 768px) {
	[data-aos="soft-fade-right"] {
		transform: translateX(-50px);
	}

	[data-aos="soft-fade-right"].aos-animate {
		transform: translateX(0);
	}
}