@font-face {
	font-family: 'Myriad Pro';
	src: url('../fonts/MyriadPro-Regular.eot');
	src: url('../fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Regular.woff') format('woff'),
		url('../fonts/MyriadPro-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Myriad Pro SemiCondensed';
	src: url('../fonts/MyriadPro-SemiCn.eot');
	src: url('../fonts/MyriadPro-SemiCn.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-SemiCn.woff') format('woff'),
		url('../fonts/MyriadPro-SemiCn.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
/*===== reset =====*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body {
    line-height:1.6;		
	font-size: 62.5%;
	font-family: 'Myriad Pro SemiCondensed';
	color: #404040;
}
.intro-content, .lang-switcher {
	font-family: 'Myriad Pro', sans-serif;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
ul {
    list-style:none;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
	outline: 0;
    font-size:100%;
    background:transparent;	
	text-decoration:none;
	transition: all 0.4s ease;
}
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
hr {
    display:block;
    height:0;
    border:0;   
    border-top: 1px solid #d4d6d7;
    margin: 0 auto;
    padding:0;
}
input, select,textarea {
    vertical-align:middle;
}
form  {
	text-align: left;
}
.cf:before, .cf:after {
    content: " "; 
    display: table; 
}
.cf:after {
    clear: both;
}
.clearfix {
        -height: 1%; /*IE6*/
        *zoom: 1; /*IE6-7*/
        display: table;
}
.clearfix:after {
   content: '1 1 1 1 1 1 1 1 1 1 1'; /*Op12+*/
   font: .1px/0 a;
   display: block;
   word-spacing: 99in;
   overflow: hidden; /*IE8-*/
}
h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
	line-height: 1.2;
}
p {
	line-height: 1.5;
}
::selection {
  color: #fff;	
  background: #3695eb;
}
::-moz-selection {
  color: #fff;	
  background: #3695eb;
}
* {
  border: none;
}
sup, sub {
    vertical-align: baseline;
    position: relative;
    font-size: .7em;
    line-height: 1;
    }
sup {
    bottom: 1ex;
    }
sub {
    top: .5ex;
    }
/*===== typography  =====*/
h1, #test_button {
	font-size: 2em;
	margin-bottom: 10px;
}
h2, a, button, label, input[type=text], th, td, .add_form textarea {
	font-size: 1.8em;
	margin-bottom: 7px;
}
legend, li, p, textarea, .add_form input[type=text], .add_form textarea {
	font-size: 1.6em;
}
p {
	margin-bottom: 7px;
}
a {
	color: #a53692;
}
a:hover {
	color: #b34ea2;
}
/*===== layout =====*/
body {
	box-sizing: border-box;
	text-align: left;
}
#content {
	margin: 0 auto;
	max-width: 1100px;
}
h1, h2, ul, .fieldset_row {
	margin-bottom: 20px;
}
p, li {
	margin-bottom: 10px;
}
.poll_form {
	margin: 0 auto;
	box-sizing: border-box;
	max-width: 1100px;
}
textarea:focus, input:focus{
    outline: none;
}
.home {
	float: right;
	width: 1.13em;
	height: 0.95em;
	margin-right: 13px;
	background-image: url('../img/home.png');
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
}
/* float-left */
legend, .radio_wrapper {
	display: inline-block;
	vertical-align: middle;
}
.poll_form label {
	font-size: 20px;
	display: inline-block;
	vertical-align: middle;
	padding: 0 5px 0 5px;
	line-height: 1;
	margin-bottom: 0;
}
.poll_form label:hover, .poll_form label.checked {
	
}

.poll_form input[type=radio] {
	display: inline-block;
	vertical-align: middle;  
}
.poll_form input[type=text] {
  border: 1px solid #000;
  padding: 5px;
  margin: 0;
  display: inline-block;
  vertical-align: middle;
  display: inline-block;
	vertical-align: middle;
  width: 35px;
}
#lang_switcher input[type=radio] {
  display: none;
}
#lang_switcher label {
  cursor: pointer;
}
button {
	color: #fff;
	padding: 7px 20px;
	display: block;
	cursor: pointer;
	transition: background-color 0.4s ease;
	background-color: #a53692;	
	margin: 0 auto;
}
button:hover {
	background-color: #b34ea2;
}
#test_button {
	display: inline-block;
	padding: 5px 10px;
	cursor: pointer;
	color: #a53692;
	border: 1px dotted;
}
#test_button:hover {
	cursor: pointer;
	color: #b34ea2;
}
.pseudo-link {
	color: #a53692;
	border-bottom: 1px dotted;
	cursor: pointer;
}
.pseudo-link.light {
	color: #dd95d1;
}
.pseudo-link:hover {
	color: #b34ea2;
	border-color: transparent;
}
.pseudo-link.light:hover {
	color: #fff;
}
table {
  border-collapse: collapse;
}
tr {
  border-bottom: 1px solid #ccc;
}
th, td {
  text-align: left;
  padding: 4px 10px;
}
table {
    border: 1px solid #000;
}
tr {
    border-top: 1px solid #000;
}
tr + tr {
    border-top: 1px solid transparent;
}
td {
    border-left: 1px solid #000;
}
td + td {
    border-left: 1px solid transparent;
}
#poll_1 fieldset:not(:first-child) legend {
	width: 70%;
}
#poll_2 fieldset legend {
	width: 60%;
}
.add_form textarea, .add_form input[type=text] {
	border: 1px solid #000;
}
.add_form input[type=text] {
	width: 50px;
}
.add_form table {
	width: 100%;
	margin-bottom: 50px;
}
.add_form td {
	vertical-align: top;
}
.lang-switcher {
	float: right;
}
.lang-switcher li {
	display: inline-block;
	margin-right: 10px;
	cursor: pointer;
	color: #b34ea2;
	font-weight: bold;
	font-size: 2em;
	line-height: 1;
	/* border-bottom: 2px solid transparent; */
	color: #c46ab5;	
}
.lang-switcher li:last-child {
	margin-right: 15px;
}
.lang-switcher .active, .lang-switcher li:hover {	
	color: #a53692;
	/* border-color: #a53692; */
	color: #dd95d1;
}
/*
.id_1 .lang-switcher li {
	color: #dd95d1;
}
.id_1 .lang-switcher li:hover {
	color: #c46ab5;
}
*/
.intro {
	position: relative;
	width: 100%;
	background-image: url('../img/bg.jpg');
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	margin: 0 auto;
}
.intro:before{
	content: "";
	display: block;
	padding-top: 112%;
}
.intro-content {
	position: absolute;
	width: 55%;
	top: 50px;
	left: 50px;
}
.intro-content img {
	max-width: 28%;
	margin-bottom: 10%;
}
.intro-content h1 {
	max-width: 50%;
	font-size: 3.5em;
	font-weight: bold;
	color: #a53692;
	margin-bottom: 70px;
	position: relative;
	text-transform: uppercase;
}
.underline {
	position: relative;
}
.underline:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	border-bottom: 7px solid;
	top: calc(100% + 31px);
}
.intro-content p {
	max-width: 50%;
	font-size: 3em;
	line-height: 1.3;
	margin-bottom: 7%;
}
.info p {
	font-size: 2.2em;
}
.intro-content button {
	font-size: 2.3em;
	font-weight: bold;
	text-transform: uppercase;
	margin: 0;
	padding: 15px 20px;
	color: #fff;
}
.intro-content button:hover {
	color: #fff;
}
.info { 
	max-width: 1100px;
	margin: 0 auto;
}
.info p {
	float: left;
	width: 65%;
	box-sizing: border-box;
	padding: 40px 50px;
}
.info strong {
	color: #a53692
}
.rcol {
	float: right;
	width: 35%;
	padding: 40px 50px;
	box-sizing: border-box;
}
.info img {
	max-width: 100%;
}
.footer {
	background-color: #a53692;
	padding: 25px 50px;
}
.footer p {
	color: #fff;
	font-size: 1.6em;
}
.header {
	position: absolute;
	z-index: 9;
	width: 100%;
	top: 0;
	left: 0;
}
.lang-wrapper {
	position: relative;
	margin: 0 auto;
	max-width: 1100px;
	padding-top: 20px;
}
.form_row:first-child {
	text-align: center;
	background-color: #a53692;
}
.form_row:first-child > .fieldset, .form_row:first-child > fieldset {
	padding: 50px 0;
}
.form_row:first-child legend, .form_row:first-child label {
	color: #fff;
	font-size: 2.5em;
}
.form_row:first-child input[type='text'] {
	border: none;
	width: 130px;
	display: block;
	margin: 10px auto 20px auto;
}
.form_row:first-child legend {
	display: block;
	margin: 10px auto;
}
.form_row:first-child p, .form_row:first-child .next_button ~ ul li, .form_row:first-child .next_button ~ p {
	color: #fff;
	font-size: 2em;
	max-width: 75%;
	margin: 0 auto;
}
.form_row:first-child .next_button ~ p, .form_row:first-child .next_button ~ ul li {
	text-align: left;
}
.form_row:first-child p strong {
	font-size: 1.3em;
}
.form_row:first-child button {
	display: block;
	margin: 10px auto;
	background-color: #c46ab5;
	font-size: 2em;
}
.form_row:first-child button:hover {
	background-color: #b34ea2;
}
.form_row:not(:first-child) {
	text-align: center;
	color: #a53692;
}
.form_row:not(:first-child)>fieldset {
	padding: 100px 0;
}
.form_row:not(:first-child) h2 {
	font-size: 4.5em;
	font-weight: bold;
}
.form_row:not(:first-child) legend {
	display: block;
	font-size: 2em;
	font-weight: bold;
	margin: 0 auto 50px auto;
}
.single_radio {
	display: inline-block;
	width: 85px;
}
#step_7 .single_radio {
	display: inline-block;
	width: 175px;
}
.form_row:not(:first-child) h3 {
	font-size: 0.7em;
	margin: 0 auto 5px auto;
	white-space: nowrap;
}
.form_row:not(:first-child) p {
	font-size: 1em;
	font-weight: bold;
	color: #404040;
}
.form_row {
	opacity: 1;
	height: auto;
	overflow: hidden;
	box-sizing: border-box;
	transition: opacity 0.8s ease;
}
.form_row.invisible {
	opacity: 0;
	height: 0;
	transition: opacity 0.8s ease;
}
.radio_wrapper {
	margin: 0 auto 30px auto;
}
body.wide, body.wide #content, body.wide form {
	max-width: 100%;
}
.info.full-width {
	padding: 50px 0;	
}
.info.full-width p {
	float: none;
	width: 100%;
	padding: 0;
	font-size: 1.8em;
	margin-bottom: 20px;
}
.info.full-width li {
	font-size: 1.8em;
	position: relative;
	padding-left: 25px;
	margin-bottom: 20px;
}
.info.full-width li:before {
    position: absolute;
    left: 0;
	top: 8px;
    content: "";
	display: block;
	border-radius: 50%;
	background-color: #a53692;
	width: 12px;
	height: 12px;
}
.info.full-width h1 {
	color: #a53692;
	font-size: 2.5em;
}
.info.full-width img {
	float: right;
	width: 25%;
	margin: 20px 0 20px 20px;
}
.info.full-width .test_result {
	color: #a53692;
	font-size: 2em;
	font-weight: bold;
}
/* radio */

/* Customize the label (the container) */
.form_row:not(:first-child) .radio_label {
  position: relative;
  padding: 0;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.form_row:not(:first-child) .radio_label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.form_row:not(:first-child) .radio_label span {
  position: relative;
  display: block;
  height: 36px;
  width: 36px;
  background-color: #a53692;
  border-radius: 50%;
  margin: 10px auto;
}

/* On mouse-over, add a grey background color */
.form_row:not(:first-child) .radio_label:hover input ~ span {
  
}

/* When the radio button is checked, add a blue background */
.form_row:not(:first-child) .radio_label input:checked ~ span {
 background-color: #a53692;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.form_row:not(:first-child) .radio_label span:after {
  content: "";
  position: absolute;
}

/* Show the indicator (dot/circle) when checked */
.form_row:not(:first-child) .radio_label input:checked ~ span:after {
  display: block;
  background-color: #a53692;
}

/* Style the indicator (dot/circle) */
.form_row:not(:first-child) .radio_label span:after {
  top: 11px;
  left: 11px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: #fff;
} 
#step_0 {
	height: 100vh;
}
#step_00 {
	min-height: 100vh;
}
#step_0.invisible, #step_00.invisible {
	height: 0;
	min-height: 0;
}

/**/

 /* Customize the label (the container) */
.form_row:first-child .radio_label {
  position: relative;
  padding: 0 0 0 35px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#poll_1 #step_0 .radio_label:first-child {
 margin-right: 20px;
}

/* Hide the browser's default radio button */
.form_row:first-child .radio_label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.form_row:first-child .radio_label span {
  position: absolute;
  top: 0;
  left: 0;
  height: 24px;
  width: 24px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.form_row:first-child .radio_label:hover input ~ span {
  background-color: #eee;
}

/* When the radio button is checked, add a blue background */
.form_row:first-child .radio_label input:checked ~ span {
 background-color: #eee;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.form_row:first-child .radio_label span:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.form_row:first-child .radio_label input:checked ~ span:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.form_row:first-child .radio_label span:after {
  top: 6px;
  left: 6px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #a53692;
} 

/** additional style for radio button */

#poll_1 .form_row:not(#step_0) .radio_label span:after, #poll_2 .radio_label span:after {
 display: none;
}

#poll_1 .form_row:not(#step_0) .radio_label input:checked ~ span:after, #poll_2 .radio_label input:checked ~ span:after {
  display: block;
  background-color: #fff;
}

/**/


/** radio */

.enter_form {
	margin: 50px auto 0 auto;
	width: 380px;
	background-color: #FFC0CB;
	border-radius: 15px;
	padding: 50px;
	text-align: center;
}
.enter_form .col {
	float: left;
	width: 50%;
	box-sizing: border-box;
}
.enter_form .col:first-child, .enter_form .col:nth-child(3)  {
	text-align: right;
	padding-right: 10px;
}
.enter_form .col:nth-child(2), .enter_form .col:nth-child(4) {
	text-align: left;
}

.enter_form input[type=text], .enter_form input[type=password] {
	font-size: 1.6em;
	border: 2px solid LightCoral;
	border-radius: 3px;
	width: auto;
	padding: 5px;
	color: #C71585;
}
.enter_form label {
	color: #C71585;
	font-size: 2em;
}
.enter_form input[type=text], .enter_form input[type=password], .enter_form label {
	display: inline-block;
}
.enter_form input[type=submit] {
	background-color: #C71585;
	color: #FFC0CB;
	font-size: 1.8em;
	padding: 10px 20px;
	border-radius: 5px;
	display: block;
	margin: 20px auto 0 auto;
	cursor: pointer;
}
.enter_form input[type=submit]:hover {
	opacity: 0.8;
}
.admin_table {
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto;
}
/**/
.links {
	padding: 0 50px 50px 50px;
}
.links h2 {
	color: #fff;
	font-size: 24px;
	font-weight: bold;
}
.links a:hover {
	opacity: 0.5;
}
.univer-links {
	float: left;
	width: calc(100% - 150px);
	box-sizing: border-box;
	background-color: #fff;
	padding: 15px 5px 15px 15px;
}
.univer-links + a {
	width: 55px;
	margin-top: 15px;
	float: right;
}
.univer-links + a img {
	max-width: 100%;
}
.univer-links li {
	float: left;
	width: 30%;
	box-sizing: border-box;
	padding-left: 5px;
	position: relative;
}
.univer-links li:first-child {
	float: left;
	width: 40%;
	padding-left: 65px;	
}
.univer-links li:first-child:after, .univer-links li:last-child:before {
	content: '';
	position: absolute;
	height: 65px;
	top: 10px;
	left: -10px;
	width: 0;
	border-left: 2px solid #a53692;
}
.univer-links li:first-child:after {
	left: auto;
	right: 15px;
}
.univer-links li:last-child {
	float: left;
	width: 30%;	
}
.univer-links li a {
	font-size: 14px;
	color: #2a2583;
	font-weight: bold;
}
.univer-links li img {
	width: 50px;
	position:absolute;
	top: 0;
	left: 0;
}
/* responsive */
@media (max-width: 1100px) {
/* */
.univer-links {
	width: calc(100% - 75px);	
	background-color: rgba(255, 255, 255, 0.5);
	padding: 10px;
	border-radius: 5px;
}
.univer-links li img, .univer-links li:first-child:after, .univer-links li:last-child:before {
	display: none;
}
.univer-links li, .univer-links li:first-child, .univer-links li:last-child {
	width: 33%;
	padding: 0;
}
.univer-links li {
	padding: 0 15px;
}
/* */	
.intro-content h1 {
	font-size: 2.5em;
}
.intro-content p {
	font-size: 2em;
}
.intro-content button {
	font-size: 1.6em;
}
.intro-content {
	top: 35px;
	left: 35px;
}
.info p {
	width: 62%;
	padding: 35px 25px 35px 35px;
	font-size: 2em;
}
.rcol {
	width: 38%;
	padding: 35px 35px 0 0;
}
.info.full-width, .footer {
	padding: 35px;
}
}
@media (max-width: 688px) {
/* */
.univer-links + a {
	width: 35px;
	margin-top: 15px;
}
.links {
	padding: 10px;	
}
.univer-links {
	float: none;
	width: 100%;
	padding: 10px;	
}
.univer-links ul {
	margin-bottom: 0;	
}
.univer-links li:last-child, .univer-links li:first-child, .univer-links li {
	float: none;
	width: 100%;
	padding: 0;
	margin-bottom: 20px;
}
.univer-links li:last-child {
	margin-bottom: 0;
}
.univer-links li:first-child:after, .univer-links li:last-child:before {
	display:none;
}	
.univer-links li img {
	display: none;
}
/* */		
#content>div:not(.intro) {
	padding-top: 75px;
}	
.intro-content {
	max-width: 70%;
}
.intro-content img {
	max-width: 25%;
	margin-bottom: 5%;
}
.intro-content h1 {
	max-width: 65%;
	font-size: 1.6em;
	line-height: 1;
}
.intro-content h1:after {
	border-bottom: 3px solid;
}
.intro-content p {
	max-width: 70%;
	font-size: 1.6em;
}
.intro-content button {
	font-size: 1.6em;
	padding: 10px 15px;
}
.intro-content {
	top: 20px;
	left: 20px;
}
.info p {
	float: none;
	width: 100%;
	padding: 10px 15px;
	font-size: 1.8em;
}
.rcol {
	display: none;
}
.info.full-width, .footer {
	padding: 10px 15px;
}
.enter_form {
	padding: 10px;
}
}