@charset "UTF-8";
/* CSS Document */


h1.main-title {
	font-size: 2.5rem;
	margin-bottom: 15px;
}
h2 {
	font-family: TeamCompass-Black;
	font-size:5rem;
	line-height: 1.2;
	font-weight: normal;
	margin: 0 0 30px 0;
}

h1.main-title > span.team-name {
	color: var(--brand_red);
}
h1.main-title > span.team-name:not(:empty):before {
	font-family: TeamCompass;
	color: #666666;
	content:" » ";
}



form[name="token-enabler"] {
	display: inline-block;
	position: relative;
	bottom: 0;
	left: 0;
	background-color: #CCCCCC;
	border-radius: 4px;
	margin: 35px 0 35px 0;
	padding: 25px 25px 25px 25px;
}
form[name="token-enabler"] label {
	font-size: 1.5rem;
	line-height: 30px;
}
form[name="token-enabler"] input[type="text"] {
	outline: none;
	min-width: 350px;
	padding: 10px 15px 10px 15px;
	margin: 0 10px 0 10px;
	height: 30px;
	border:none;
	border-radius: 4px;
	font-size: 2rem;

}
form[name="token-enabler"] input[type="submit"] {
	appearance: none;
	-webkit-appearance:none;
	outline: none;
	border: none;
	height: 50px;
	padding: 10px 15px 10px 15px;
	background-color: var(--brand_red);
	color: white;
	border-radius: 4px;
	font-size: 2rem;
}
	@media screen and (min-width:  0px) and (max-width: 699px) {
		form[name="token-enabler"] { width:calc(100% - 50px); }
		form[name="token-enabler"] input[type="text"] { min-width: 0; width: calc(100% - 30px); margin: 5px 0 10px 0; height: 30px;}
		form[name="token-enabler"] input[type="submit"] { width: calc(100% - 0px); height: 55px; }
	}





form[name="survey"] {
	outline: 0px dashed blue;
	position: relative;
	margin: 35px 0 15px 0;
}
form[name="survey"]:before {
	display: block;
	content:"";
	inset:-10px -50vw -35px -50vw;
	position: absolute;
	background: linear-gradient(0deg, #F0F1F2, #ffffff);
}


	/* Ratings explanation */
	
	.ratings-explanation {
		margin: 105px 0 25px 0;
		text-align: right;
		white-space: nowrap;
	}
	.ratings-explanation .re-label {
		display: inline-block;
		font-family: TeamCompass;
		font-weight: normal;
		font-size: 1.2rem;
		line-height: 1.3;
		display: none;
	}
	.ratings-explanation ul.ratings {
		display: inline-block;
		margin: 0;
		padding: 0;
		font-size: 0;
		line-height: 0;
		width: 480px;
		/* width: 210px; */
		/* white-space: normal; */
	}
	.ratings-explanation ul.ratings li {
		list-style: none;
		display: inline-block;
		font-size: 1.2rem;
		line-height: 15px;
		white-space: normal;
		width: 70px;
	}
	.ratings-explanation ul.ratings li i {
		display: block;
		position: relative;
		width:          15px;
		height:         15px;
		margin-bottom: -15px;
		border-radius:  15px;
	}
	.ratings-explanation ul.ratings li em {
		display: block;
		position: relative;
		width: 150px;
		height: 20px;
		margin: 0 0 -20px 0;
		font-family: TeamCompass-Light;
		font-style: normal;
		transform-origin: left top;
		transform: rotate(-45deg) translate(15px,0px);
		white-space: normal;
	}
	
	/* states */
	
	.ratings-explanation {
	}
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(1) { opacity:1; transition:opacity 0.6s ease 1.25s }
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(2) { opacity:1; transition:opacity 0.6s ease 1.2s }
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(3) { opacity:1; transition:opacity 0.6s ease 1.15s }
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(4) { opacity:1; transition:opacity 0.6s ease 1.1s }
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(5) { opacity:1; transition:opacity 0.6s ease 1.05s }
	#survey[data-radios="1"] .ratings-explanation .ratings li:nth-child(6) { opacity:1; transition:opacity 0.6s ease 1.0s }

	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(1) { opacity:0; transition:opacity 0.3s ease 0.0s }
	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(2) { opacity:0; transition:opacity 0.3s ease 0.05s }
	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(3) { opacity:0; transition:opacity 0.3s ease 0.1s }
	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(4) { opacity:0; transition:opacity 0.3s ease 0.15s }
	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(5) { opacity:0; transition:opacity 0.3s ease 0.2s }
	#survey[data-radios="0"] .ratings-explanation .ratings li:nth-child(6) { opacity:0; transition:opacity 0.3s ease 0.25s }

	

	/* SKIN: COLOR */
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(1) i { background-color: var(--rating_1_color); }
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(2) i { background-color: var(--rating_2_color); }
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(3) i { background-color: var(--rating_3_color); }
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(4) i { background-color: var(--rating_4_color); }
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(5) i { background-color: var(--rating_5_color); }
	#survey[data-skin="color"] .ratings-explanation ul.ratings li:nth-child(6) i { background-color: var(--rating_6_color); }

	/* SKIN: SHADES */
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(1) i { background-color: var(--rating_1_shades); }
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(2) i { background-color: var(--rating_2_shades); }
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(3) i { background-color: var(--rating_3_shades); }
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(4) i { background-color: var(--rating_4_shades); }
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(5) i { background-color: var(--rating_5_shades); }
	#survey[data-skin="shades"] .ratings-explanation ul.ratings li:nth-child(6) i { background-color: var(--rating_6_shades); }


	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(1) em:before { content:"Egyértelműen nem"; }
	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(2) em:before { content:"Inkább nem"; }
	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(3) em:before { content:"Néha nem"; }
	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(4) em:before { content:"Néha igen"; }
	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(5) em:before { content:"Inkább igen"; }
	html[lang="hu"] .ratings-explanation ul.ratings li:nth-child(6) em:before { content:"Egyértelműen igen"; }

	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(1) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(1) em:before { content:"I strongly disagree"; }
	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(2) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(2) em:before { content:"I disagree"; }
	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(3) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(3) em:before { content:"I disagree a little bit"; }
	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(4) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(4) em:before { content:"I agree a little bit"; }
	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(5) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(5) em:before { content:"I agree"; }
	html[lang="en"] .ratings-explanation ul.ratings li:nth-child(6) em:before, #survey[data-force_user_language="en"] .ratings-explanation ul.ratings li:nth-child(6) em:before { content:"I strongly agree"; }


.form-group {
	display: block;
	position: relative;
	margin: 40px 0 30px 0;
}
	.form-group {
		display: none;
	}

.form-group .fg-index {
	display: block;
	position: relative;
	width:          24px;
	height:         24px;
	margin-bottom: -24px;
	border-radius:  24px;
	line-height:    24px;
	font-size:      15px;
	text-align: center;
	background-color: #fe5457;
	color: white;
	font-weight: bold;
	overflow: hidden;
}
.form-group .fg-index:empty { display: none; }

.css.skn-1 .fg-title {
	display: inline-block;
	position: relative;
	background-color: #F9FBFC;
	color: #fe5457;
	padding: 0 15px 0 15px;
	margin: 0 0 0 25px;
	font-family: TeamCompass-Black;
	font-weight: normal;
	font-size: 2.0rem;
	z-index: 2;
	pointer-events: none;
}

.form-group .fg-line {
	display: block;
	position: relative;
	width: calc(100% - 60px);
	height: 2px;
	margin: 0 0 -2px 30px;
	background-color: #fe5457;
	top: -2px;
}

.form-group[data-contents="ratings"] .fg-line { width: calc(100% - 490px); }

.form-group                          ul.fg-icons { display: none; }
.form-group[data-contents="ratings"] ul.fg-icons {
	display: block;
	position: absolute;
	margin: 0; padding: 0;
	font-size: 0; line-height: 0;
	right: 0;
	top: -7px;
}
.form-group[data-contents="ratings"] ul.fg-icons li {
	display: inline-block;
	list-style: none;
	vertical-align: top;
	width:80px;
	height: 25px;
	margin: 0; padding: 0;
	text-align: center;
}
.form-group[data-contents="ratings"] ul.fg-icons li em {
	display: block;
	position: relative;
	width:          calc(100% - 40px);
	height:          2px;
	margin-bottom:  -2px;
	top: 18px;
	left: -20px;
}
.form-group ul.fg-icons li:nth-child(1) em { display: none; }

/* SKIN: COLOR */
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(1) em { background-color: var(--rating_1_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(2) em { background-color: var(--rating_2_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(3) em { background-color: var(--rating_3_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(4) em { background-color: var(--rating_4_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(5) em { background-color: var(--rating_5_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(6) em { background-color: var(--rating_6_color); }

/* SKIN: SHADES */
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(1) em { background-color: var(--rating_1_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(2) em { background-color: var(--rating_2_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(3) em { background-color: var(--rating_3_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(4) em { background-color: var(--rating_4_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(5) em { background-color: var(--rating_5_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(6) em { background-color: var(--rating_6_shades); }


.form-group ul.fg-icons li i {
	display: inline-block;
	position: relative;
	z-index: 2;
	width:          36px;
	height:         36px;
	margin-bottom: -36px;
	border-radius:  36px;
	line-height:    36px;
	font-size:      15px;
	text-align: center;
	color: white;
	font-weight: bold;
	overflow: hidden;
}

/* SKIN: COLOR */
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(1) i { background-color: var(--rating_1_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(2) i { background-color: var(--rating_2_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(3) i { background-color: var(--rating_3_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(4) i { background-color: var(--rating_4_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(5) i { background-color: var(--rating_5_color); }
#survey[data-skin="color"] .form-group ul.fg-icons li:nth-child(6) i { background-color: var(--rating_6_color); }

/* SKIN: SHADES */
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(1) i { background-color: var(--rating_1_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(2) i { background-color: var(--rating_2_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(3) i { background-color: var(--rating_3_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(4) i { background-color: var(--rating_4_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(5) i { background-color: var(--rating_5_shades); }
#survey[data-skin="shades"] .form-group ul.fg-icons li:nth-child(6) i { background-color: var(--rating_6_shades); }

.form-group ul.fg-icons li:nth-child(1) i:before { content:"\E918"; }
.form-group ul.fg-icons li:nth-child(6) i:before { content:"\E917"; }



#survey p {}
#survey p strong, #survey p b {
	font-family: TeamCompass;
	font-weight: bold;
}


	.survey-progress-marker {
		display: block;
		position: relative;
		width: calc(100% - 40px);
		height: 10px;
		border-radius: 10px;
		background-color: #EEE;
		margin: 15px 0 15px 40px;
	}
	.survey-progress-marker .spm-container {
		position: absolute;
		inset:0;
		box-shadow: inset 2px 1px 5px 0 rgba(0,0,0,0.3), 0 0 0 1px rgba(163,163,163,0.45);
		border-radius: inherit;
		overflow: hidden;
		background-color: white;
	}
	.survey-progress-marker .spm-container .spm-progress-bar {
		position: relative;
		width: 1000%;
		max-width: 100%;
		height: 100%;
		background-color: var(--brand_blue);
		transform-origin: left;
		transform: translateZ(0) scaleX(0);
		transition: transform 1.5s ease;
		will-change: transform;
	}
	.survey-progress-marker .spm-percent {
		position: relative;
		display: block;
		width:  40px;
		height: 20px;
		margin: 0 0 -20px 0;
		left: -40px;
		color: var(--brand_blue);
		text-align: left;
		font-size: 1.2rem;
	}
	.survey-progress-marker .spm-percent:after { content:"%"; }
	.XXXsurvey-progress-marker .spm-percent:after {
		bottom: 100%;
		left: 50%;
		border: solid transparent;
		content: "";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
		border-color: rgba(0,0,0,0);
		border-bottom-color: var(--brand_blue);
		border-width: 10px;
		margin-left: -10px;
	}



	/*					*/
	/* FORM ELEMENT 	*/
	/*					*/

	.form-element {
		display: block;
		position: relative;
		font-size: 0;
		line-height: 0;
		width: calc(100% - 20px);
		margin: 0 0 5px 20px;
		padding: 6px 0 4px 0;
	}
	.form-element {
		margin: 0 0 5px 0;
		width: calc(100% + 0px);
	}
	.form-element:before {
		display: block;
		position: absolute;
		inset:0 50px 0 0;
		border-radius: 5px;
		content:"";
		transition: background-color 1s ease;
		will-change: auto;
		display: none;
	}

	.form-element:hover:before {
		background-color: #E8E8E8;
	}

	.form-element:after {
		display: block;
		position: relative;
		content:" ";
		background-color: #D2D2D2;
		width: calc(100% - 45px);
		height: 1px;
		margin: 0 0 -1px 0px;
		padding: 0;
		top: 7px;
		left: 10px;
	}
	.form-group-items .form-element:last-child:after {
		display: none;
	}







	/*				*/
	/* Marker 		*/
	/*				*/

	.form-element .fe-marker {
		display: inline-block;
		position: relative;
		pointer-events: none;
		width: 20px;
		height: 22px;
		margin: 0 0 -22px 0;
		top: 5px;
		font-size: 1.5rem;
		line-height: 22px;
		left: -5px;
	} 
	.form-element[data-type="text1row"] .fe-marker { top: 10px; }
	
	                                       .form-element[data-mandatory="1"][data-filled="1"] .fe-marker i { color: #77B262; } 
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] .fe-marker i { color: #E84B2C; } 
	
	                                       .form-element[data-mandatory="1"][data-filled="1"] .fe-marker i:before { content:"\EBA0"; } 
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] .fe-marker i:before { content:"\E900"; } 
	
	/* filled state marker */
	form[name="survey"][data-warnings="0"] .form-element[data-mandatory="1"][data-filled="0"] .fe-marker { opacity: 0; transition: opacity 2s ease; }
	                                       .form-element[data-mandatory="1"][data-filled="1"] .fe-marker { opacity: 1; }
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] .fe-marker { opacity: 1; transition: opacity 2s ease; }
	
	/* red border on input elements */
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] input[type="text"],
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] input[type="email"] { border-color: #E84B2C; } 
	
	/* red color on label of unfilled element */
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] .fe-label p { color: #E84B2C; }
	
	
	/* animation on warning icon */
	form[name="survey"][data-warnings="1"] .form-element[data-mandatory="1"][data-filled="0"] .fe-marker i {
		animation: warning 1s 3 ease-in-out;
		animation-timing-function: ease-in, linear, ease-out;
	}
	        @keyframes warning {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
	@-webkit-keyframes warning {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
	   @-moz-keyframes warning {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
	     @-o-keyframes warning {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
	
	
	  
  

	

	/* DEFAULT SETTINGS */
	

	.form-element .fe-label, 
	.form-element .fe-value {
		display: inline-block;
		position: relative;
		vertical-align: middle;
	}
	.form-element .fe-label {
		width: calc(100% - 500px);
		font-family: TeamCompass;
		font-size: 1.3rem;
		line-height: 1.3;
		margin-left: 0;
		white-space: normal;
		min-height: 42px;
	}
	.form-element .fe-label p {
		padding: 0 0 0 0;
		margin: 0 0 0 0;
	}
	.form-element .fe-value {
		width: 480px;	
	}
	.form-element[data-type="radios6"] .fe-value {
		display: inline-block;
		position: relative;
		font-size: 0; line-height: 0;
		margin: 0; padding: 0;
	}	
	.form-element[data-type="radios6"] .fe-value label {
		margin: 0;
		padding: 0;
		display: inline-block;
		vertical-align: top;
		width: calc(100% / 6 - 5px);
		text-align: center;
	}
		/* filled state copy color */
		.form-element                  .fe-label p {color:#333333;font-family: TeamCompass-Light;font-weight: normal;text-align: left;padding-left: 10px;}
		.form-element[data-filled="0"] .fe-label p {}
		.form-element[data-filled="1"] .fe-label p {color:#999999;}
	






	/*					*/
	/* TEXTS (input) 	*/
	/*					*/
	/* single line 		*/
	/* multilines 		*/
	/*					*/

	.form-element[data-type="text1row"] .fe-value input,
	.form-element[data-type="text3rows"] .fe-value textarea {
		border: 1px solid #AAAAAA;
		font-family: TeamCompass;
		font-size: 1.5rem;
		outline: none;
		margin: 0 0 0 25px;
		width: calc(100% - 62px);
		border-radius: 5px;
	}
	.form-element[data-type="text1row"]  .fe-value input    { padding:  5px 10px 5px 10px; height:30px; line-height:30px; }
	.form-element[data-type="text3rows"] .fe-value textarea { padding: 10px 10px 5px 10px; height:60px; line-height:18px; resize:none; }

	.form-element[data-type="text1row"] .fe-value input[type="text"] {}
	.form-element[data-type="text1row"] .fe-value input[type="email"] {}
	
	/* Textrows */

		.form-element[data-type="text1row"],
		.form-element[data-type="text3rows"] {}

		.form-element[data-type="text1row"]  .fe-label,
		.form-element[data-type="text3rows"] .fe-label {
			display: block;
			width: calc(100% - 0px);
			min-height: 30px;
		}
		.form-element[data-type="text1row"]  .fe-value,
		.form-element[data-type="text3rows"] .fe-value {
			display: inline-block;
			width: calc(100% - 20px);
		}
		.form-element[data-type="text1row"]  .fe-value input,
		.form-element[data-type="text3rows"] .fe-value textarea {
			padding:5px 10px 5px 10px;
			margin: 0 0 0 10px;
			width: calc(100% - 60px);
		}
		.form-element[data-type="text1row"]:after,
		.form-element[data-type="text3rows"]:after{
			display: none;
		}
		
	



	/*					*/
	/* RATINGS (radios) */
	/*					*/

	.form-element[data-type="radios6"] .fe-value label { cursor: pointer; }
	.form-element[data-type="radios6"] .fe-value label input[type="radio"] {
		opacity: 0;
		position: absolute;
	}
	.form-element[data-type="radios6"] .fe-value label input[type="radio"] ~ .fcb {
		display: block;
		position: relative;
		outline: 0px solid red;
	}
	.form-element[data-type="radios6"] .fe-value label input[type="radio"] ~ .fcb i {
		display: inline-block;
		width:         20px;
		height:        20px;
		font-size:     15px;
		line-height:   20px;
		border-radius: 20px;
		overflow: hidden;
		border: 2px solid gray;
		background-color: white;
	}
	.form-element[data-type="radios6"] .fe-value input[type="radio"]         ~ .fcb i { }
	.form-element[data-type="radios6"] .fe-value input[type="radio"]:checked ~ .fcb i { background-color: gray; color: white; }

	/* SKIN: COLOR */
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(1) input[type="radio"] ~ .fcb i { border-color: var(--rating_1_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(2) input[type="radio"] ~ .fcb i { border-color: var(--rating_2_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(3) input[type="radio"] ~ .fcb i { border-color: var(--rating_3_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(4) input[type="radio"] ~ .fcb i { border-color: var(--rating_4_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(5) input[type="radio"] ~ .fcb i { border-color: var(--rating_5_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(6) input[type="radio"] ~ .fcb i { border-color: var(--rating_6_color); }

	/* SKIN: SHADES */
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(1) input[type="radio"] ~ .fcb i { border-color: var(--rating_1_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(2) input[type="radio"] ~ .fcb i { border-color: var(--rating_2_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(3) input[type="radio"] ~ .fcb i { border-color: var(--rating_3_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(4) input[type="radio"] ~ .fcb i { border-color: var(--rating_4_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(5) input[type="radio"] ~ .fcb i { border-color: var(--rating_5_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(6) input[type="radio"] ~ .fcb i { border-color: var(--rating_6_shades); }

	.form-element[data-type="radios6"] .fe-value input[type="radio"]         ~ .fcb i:before { content:""; }
	.form-element[data-type="radios6"] .fe-value input[type="radio"]:checked ~ .fcb i:before { content:"\EBA0"; }

	/* SKIN: COLOR */
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(1) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_1_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(2) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_2_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(3) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_3_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(4) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_4_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(5) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_5_color); }
	#survey[data-skin="color"] .form-element[data-type="radios6"] .fe-value label:nth-child(6) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_6_color); }

	/* SKIN: SHADES */
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(1) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_1_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(2) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_2_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(3) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_3_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(4) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_4_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(5) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_5_shades); }
	#survey[data-skin="shades"] .form-element[data-type="radios6"] .fe-value label:nth-child(6) input[type="radio"]:checked ~ .fcb i { background-color: var(--rating_6_shades); }

	.form-element[data-type="radios6"] .fe-value input[type="radio"] ~ .fcb em {
		display: block;
		position: relative;
		font-family: TeamCompass-Light;
		font-size: 1.3rem;
		line-height: 1.1;
		font-style: normal;
		height: 15px;
		margin-bottom: -15px;
		left: 22px;
		top: -18px;
		color: gray;
	}
	.form-element[data-type="radios6"] .fe-value label:nth-child(1) .fcb em:before { content:"1";}
	.form-element[data-type="radios6"] .fe-value label:nth-child(2) .fcb em:before { content:"2"; }
	.form-element[data-type="radios6"] .fe-value label:nth-child(3) .fcb em:before { content:"3"; }
	.form-element[data-type="radios6"] .fe-value label:nth-child(4) .fcb em:before { content:"4"; }
	.form-element[data-type="radios6"] .fe-value label:nth-child(5) .fcb em:before { content:"5"; }
	.form-element[data-type="radios6"] .fe-value label:nth-child(6) .fcb em:before { content:"6"; }

	.form-element[data-type="radios6"] .fe-value label input[type="radio"]       ~ .fcb i { transform:scale(1.00,1.00); box-shadow: 0 0  1px 0px rgba(127,127,127,0.0); XXXtransition: transform 0.5s ease, box-shadow 0.5s ease; }
	.form-element[data-type="radios6"] .fe-value label input[type="radio"]:hover ~ .fcb i { XXXtransform:scale(1.25,1.25); XXXbox-shadow: 0 0 15px 2px rgba(127,127,127,0.7); }


	.ellapsed-time {
		float: right;
		position: relative;
		transform:translateY(-100%);
	}


	/*					*/
	/* BUTTONS 			*/
	/*					*/

		.buttonset {
			display: block;
			margin: 15px 0 75px -5px;
			text-align: center;
			width: calc(100% - 50px);
		}
		.buttonset a.form-button {
			display: inline-block;
			position: relative;
			width: 300px;
			text-align: center;
			border-radius:40px;
			background-color: #666666;
			color: white;
			text-decoration: none;
			font-size:0;
			line-height: 0;
			box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 0px #666666;
			transition: box-shadow .3s ease, opacity .3s ease;
		}
		.buttonset a.form-button:hover {
			box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 5px #666666;
		}
		.buttonset a.form-submit-button {
			background-color: var(--brand_blue);
			box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 0px var(--brand_blue);
		}
		#survey[data-ready="0"] .buttonset a.form-submit-button { top:-100vh; pointer-events:none; transition: box-shadow .3s ease, opacity .3s ease 0.0s, top 0s linear 0.0s; }
		#survey[data-ready="1"] .buttonset a.form-submit-button { top:   0px; pointer-events:all;  transition: box-shadow .3s ease, opacity .3s ease 1.0s, top 0s linear 1.0s; }

		.buttonset a.form-submit-button:hover {
			box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 5px var(--brand_blue);
		}

		.buttonset a.form-button i { display: block; position: relative; width: 30px; height: 30px; font-size: 25px; line-height: 30px; margin: 0 0 -30px 0; top: 10px; left: 10px; }
		.buttonset a.form-button i:before { content:""; }
		.buttonset a.form-button em { font-style: normal; display: inline-block; position: relative; margin:0; padding: 10px 0 10px 0; font-size: 15px; line-height: 30px; white-space: nowrap;}
		.buttonset a.form-button em:before { content:"BUTTON"; }

		.buttonset a.form-submit-button {}
		.buttonset a.form-prev-button { float: left; }
		.buttonset a.form-next-button { float: right; transition:box-shadow 0.3s ease, opacity 0.3s ease, background-color 1s ease; }
		.buttonset a.form-next-button i { float: right; left: -10px; }

		.buttonset a.form-prev-button i:before { content:"\EB6B"; }
		.buttonset a.form-submit-button i:before { content:"\EA11"; }
		.buttonset a.form-next-button i:before { content:"\EB6C"; }

		.buttonset a.form-prev-button em:before { content:"Előző kérdéscsoport"; }
		.buttonset a.form-next-button em:before { content:"Következő kérdéscsoport"; }
		.buttonset a.form-submit-button em:before { content:"Felmérés elküldése"; }

		/* note with blinking a button */

			#survey[data-blink_next_button="1"] .buttonset a.form-next-button { background-color: var(--brand_blue); box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 0px var(--brand_blue); }
			#survey[data-blink_next_button="1"] .buttonset a.form-next-button:hover { box-shadow: 0 5px 0 0 rgba(0,0,0,0.2), 0 0 0 5px var(--brand_blue); }
			#survey[data-blink_next_button="1"] .buttonset a.form-next-button i {
				animation: button_note 0.75s 5 ease-in-out;
				animation-timing-function: ease-in, linear, ease-out;
			}
					@keyframes button_note {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
			@-webkit-keyframes button_note {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
			   @-moz-keyframes button_note {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}
				 @-o-keyframes button_note {0% {opacity:1} 50% {opacity:0} 100% {opacity:1}}


		/* override language */

		#survey[data-force_user_language="en"] .buttonset a.form-submit-button em:before { content:"Submit query form"; }
	




	/*						*/
	/* CONDITIONAL CONTENTS */
	/*						*/

		#survey[data-ready="0"] .buttonset a.form-submit-button {
			opacity: 0;
			pointer-events: none;
		}
		#survey[data-next="0"] .buttonset a.form-next-button,
		#survey[data-prev="0"] .buttonset a.form-prev-button {
			opacity: 0.3;
			pointer-events: none;
		}
		#survey[data-ready="1"] .buttonset a.form-submit-button,
		#survey[data-next="1"] .buttonset a.form-next-button,
		#survey[data-prev="1"] .buttonset a.form-prev-button {
			opacity: 1;
			pointer-events: all;
		}


	/*						*/
	/*	NAVIGATION			*/
	/*						*/

		#survey .navigation {
			display: block;
			position: relative;
			text-align: center;
			width: 100%;
			height:      50px;
			margin: 0 0 -50px 0;
		}
		#survey .navigation ul.groups {
			display: inline-block;
			position: relative;
			top: 50%;
			transform:translateY(-50%);
			list-style: none;
			margin: 0;
			padding: 0;
		}
		#survey .navigation ul.groups li {
			display: inline-block;
			position: relative;
			margin: 0;
			padding: 0;
			list-style: none;
			vertical-align: top;
			width: 15px;
			height: 15px;
			border-radius: 15px;
			margin-inline: 6px;
			background-color: #F0F0F0;
			box-shadow: inset 2px 1px 5px 0 rgba(0,0,0,0.2), 0 0 0 2px rgba(0,0,0,0);
			transform:scale(1.0,1.0);
			transition: all 0.3s ease;
			text-align: center;
		}
		#survey .navigation ul.groups li:hover {
		}

		#survey .navigation ul.groups li a {
			display: block;
			position: absolute;
			inset:-5px;
			cursor: pointer;
			text-decoration: none;
		}
		#survey[data-index="1" ] .navigation ul.groups li:nth-child( 1), 
		#survey[data-index="2" ] .navigation ul.groups li:nth-child( 2),  
		#survey[data-index="3" ] .navigation ul.groups li:nth-child( 3), 
		#survey[data-index="4" ] .navigation ul.groups li:nth-child( 4), 
		#survey[data-index="5" ] .navigation ul.groups li:nth-child( 5), 
		#survey[data-index="6" ] .navigation ul.groups li:nth-child( 6), 
		#survey[data-index="7" ] .navigation ul.groups li:nth-child( 7), 
		#survey[data-index="8" ] .navigation ul.groups li:nth-child( 8), 
		#survey[data-index="9" ] .navigation ul.groups li:nth-child( 9), 
		#survey[data-index="10"] .navigation ul.groups li:nth-child(10), 
		#survey[data-index="11"] .navigation ul.groups li:nth-child(11), 
		#survey[data-index="12"] .navigation ul.groups li:nth-child(12), 
		#survey[data-index="13"] .navigation ul.groups li:nth-child(13), 
		#survey[data-index="14"] .navigation ul.groups li:nth-child(14), 
		#survey[data-index="15"] .navigation ul.groups li:nth-child(15), 
		#survey[data-index="16"] .navigation ul.groups li:nth-child(16), 
		#survey[data-index="17"] .navigation ul.groups li:nth-child(17), 
		#survey[data-index="18"] .navigation ul.groups li:nth-child(18), 
		#survey[data-index="19"] .navigation ul.groups li:nth-child(19) { background-color: var(--brand_blue); width: 24px; }

		#survey .navigation ul.groups li[data-group-filled="1"] { 
			background-color:#77B262;
			box-shadow: none;
		}
		#survey .navigation ul.groups li:hover { 
			transform:scale(1.3,1.3);
		}
		#survey .navigation ul.groups li[data-group-filled="1"] i {
			display: block;
			position: relative;
			font-size: 9px;
			line-height: 15px;
			width: auto;
			height: 15px;
			margin: 0 0 -15px 0;
			padding: 0;
			overflow: hidden;
			color: #77B262;
			color: white;
			text-align: center;
			top:  0px;
			left: 0px;
			outline: 1px solid red;
			outline: none;
		}
		#survey .navigation ul.groups li[data-group-filled="1"] i:before { content:"\EBA0"; }

		#survey[data-next="0"] .navigation { 
			opacity:0;
			pointer-events: none;
		}


	/*						*/
	/*	SCROLLER 			*/
	/*						*/

	#survey .form-group-items-container {
		overflow: hidden;
	}
	#survey .form-group-scroller {
		width: 100%;
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		transition: transform 0.4s ease;
		will-change: transform;
		scroll-padding-left: 0;
		scroll-margin-left: 0;
	}
	#survey[data-groups="1" ] .form-group-scroller { width:  100%; }
	#survey[data-groups="2" ] .form-group-scroller { width:  200%; }
	#survey[data-groups="3" ] .form-group-scroller { width:  300%; }
	#survey[data-groups="4" ] .form-group-scroller { width:  400%; }
	#survey[data-groups="5" ] .form-group-scroller { width:  500%; }
	#survey[data-groups="6" ] .form-group-scroller { width:  600%; }
	#survey[data-groups="7" ] .form-group-scroller { width:  700%; }
	#survey[data-groups="8" ] .form-group-scroller { width:  800%; }
	#survey[data-groups="9" ] .form-group-scroller { width:  900%; }
	#survey[data-groups="10"] .form-group-scroller { width: 1000%; }
	#survey[data-groups="11"] .form-group-scroller { width: 1100%; }
	#survey[data-groups="12"] .form-group-scroller { width: 1200%; }
	#survey[data-groups="13"] .form-group-scroller { width: 1300%; }
	#survey[data-groups="14"] .form-group-scroller { width: 1400%; }
	#survey[data-groups="15"] .form-group-scroller { width: 1500%; }
	#survey[data-groups="16"] .form-group-scroller { width: 1600%; }
	#survey[data-groups="17"] .form-group-scroller { width: 1700%; }
	#survey[data-groups="18"] .form-group-scroller { width: 1800%; }
	#survey[data-groups="19"] .form-group-scroller { width: 1900%; }
	
	.form-group-scroller::-webkit-scrollbar {
		display: none;
	}
	
	#survey .form-group-scroller .form-group-items {
		flex: 0 0 auto;
		width: 100%;
		scroll-snap-align: start;
		flex-shrink: 0;
	}
	#survey[data-groups="1" ] .form-group-scroller .form-group-items { width: calc(100% /  1); }
	#survey[data-groups="2" ] .form-group-scroller .form-group-items { width: calc(100% /  2); }
	#survey[data-groups="3" ] .form-group-scroller .form-group-items { width: calc(100% /  3); }
	#survey[data-groups="4" ] .form-group-scroller .form-group-items { width: calc(100% /  4); }
	#survey[data-groups="5" ] .form-group-scroller .form-group-items { width: calc(100% /  5); }
	#survey[data-groups="6" ] .form-group-scroller .form-group-items { width: calc(100% /  6); }
	#survey[data-groups="7" ] .form-group-scroller .form-group-items { width: calc(100% /  7); }
	#survey[data-groups="8" ] .form-group-scroller .form-group-items { width: calc(100% /  8); }
	#survey[data-groups="9" ] .form-group-scroller .form-group-items { width: calc(100% /  9); }
	#survey[data-groups="10"] .form-group-scroller .form-group-items { width: calc(100% / 10); }
	#survey[data-groups="11"] .form-group-scroller .form-group-items { width: calc(100% / 11); }
	#survey[data-groups="12"] .form-group-scroller .form-group-items { width: calc(100% / 12); }
	#survey[data-groups="13"] .form-group-scroller .form-group-items { width: calc(100% / 13); }
	#survey[data-groups="14"] .form-group-scroller .form-group-items { width: calc(100% / 14); }
	#survey[data-groups="15"] .form-group-scroller .form-group-items { width: calc(100% / 15); }
	#survey[data-groups="16"] .form-group-scroller .form-group-items { width: calc(100% / 16); }
	#survey[data-groups="17"] .form-group-scroller .form-group-items { width: calc(100% / 17); }
	#survey[data-groups="18"] .form-group-scroller .form-group-items { width: calc(100% / 18); }
	#survey[data-groups="19"] .form-group-scroller .form-group-items { width: calc(100% / 19); }
	
	#survey[data-index="1" ] .form-group-items-container .form-group-scroller { scroll-snap-align: start; scroll-behavior: auto; scroll-padding-left: 0; scroll-margin-left: 0; scroll-snap-stop: always; }
	
	
	#survey[data-index="1" ] .form-group-items-container .form-group-scroller { transform:translateX(0); }
	#survey[data-index="2" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -100% / var(--question_groups))); }
	#survey[data-index="3" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -200% / var(--question_groups))); }
	#survey[data-index="4" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -300% / var(--question_groups))); }
	#survey[data-index="5" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -400% / var(--question_groups))); }
	#survey[data-index="6" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -500% / var(--question_groups))); }
	#survey[data-index="7" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -600% / var(--question_groups))); }
	#survey[data-index="8" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -700% / var(--question_groups))); }
	#survey[data-index="9" ] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -800% / var(--question_groups))); }
	#survey[data-index="10"] .form-group-items-container .form-group-scroller { transform:translateX( calc(  -900% / var(--question_groups))); }
	#survey[data-index="11"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1000% / var(--question_groups))); }
	#survey[data-index="12"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1100% / var(--question_groups))); }
	#survey[data-index="13"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1200% / var(--question_groups))); }
	#survey[data-index="14"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1300% / var(--question_groups))); }
	#survey[data-index="15"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1400% / var(--question_groups))); }
	#survey[data-index="16"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1500% / var(--question_groups))); }
	#survey[data-index="17"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1600% / var(--question_groups))); }
	#survey[data-index="18"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1700% / var(--question_groups))); }
	#survey[data-index="19"] .form-group-items-container .form-group-scroller { transform:translateX( calc( -1800% / var(--question_groups))); }

	.form-element[data-type="radios6"] {
		opacity: 1;	
		white-space: nowrap;
	}
	.form-element[data-type="radios6"].visible {
		opacity: 1;
	}
	
	.form-element input,
	.form-element textarea {
		
	}






	/*					*/
	/* SUBMIT STATES	*/
	/*					*/

	.progress-marker {
		position: fixed;
		background-color: rgba(51,51,51,0.72);
		left: 0; top: 0;
		right: 0; bottom: 0;
		width: 100%;
		height: 100%;
		z-index: 40000;
	}
	.progress-marker .status {
		display: block;
		position: fixed;
		left: 50%;
		top: 50%;
		transform:translate(-50%,-50%);
		text-align: center;
	}
	.progress-marker .status i {
		display: inline-block;
		position: relative;
		margin-bottom:   0px;
		width:         100px; 
		height:        100px;
		font-size:     100px;
		line-height:   100px;
		color: white;
		text-shadow: 0 0 10px black;
	}
	.progress-marker .status i:before { content:"\EBCD"; }

	.progress-marker .status em {
		display: block;
		position: relative;
		width: 240px;
		height: 60px;
		margin-bottom: -60px;
		color: white;
		text-align: center;
		font-size: 25px;
		line-height: 60px;
		font-style: normal;
		overflow: hidden;
		text-shadow: 0 0 5px black;
	}
	.progress-marker .status em:before { content:"Rögzítés..."; }



	@-webkit-keyframes rotating /* Safari and Chrome */ {
	  from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	  }
	  to {
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	  }
	}
	@keyframes rotating {
	  from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	  }
	  to {
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	  }
	}
	.progress-marker .status i {
	  -webkit-animation: rotating 2s linear infinite;
	  -moz-animation: rotating 2s linear infinite;
	  -ms-animation: rotating 2s linear infinite;
	  -o-animation: rotating 2s linear infinite;
	  animation: rotating 2s linear infinite;
	}


	.progress-marker { display: none; }
	.css.form-submitting .progress-marker { display: block; }

	.css.tpl-survey {}



	/*					*/
	/*					*/
	/* APPEARANCE		*/
	/*					*/
	/*					*/

		html[data-questions="all"] {}
		html[data-questions="factors"] {}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] {

		}

		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] .group-buttons {
			display: block;
			text-align: right;
		}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] .group-buttons a.next-group {
			display: inline-block;
			padding: 15px 25px;
			background-color: var(--brand_red);
			color: white;
			font-size: 1.5rem;
			line-height: 1.2;
			border-radius: 5px;
			margin: 15px 0;
			text-decoration: none;
			box-shadow: 0 0 0 0px var(--brand_red);
			transition: box-shadow 0.3s ease;
		}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] .group-buttons a.next-group:hover {
			box-shadow: 0 0 0 5px var(--brand_red);
		}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] a.next-group i {}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] a.next-group i:before {}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] a.next-group em {

		}
		.component[data-label="survey-conditional"][data-appearance="grouped-by-factors"] a.next-group em:before { content:"Következő kérdéscsoport"; }


	/*					*/
	/*					*/
	/* RESPONSIVES		*/
	/*					*/
	/*					*/


		@media screen and (min-width:  0px) and (max-width: 699px) {
			.ratings-explanation { text-align: center; width: calc(100% - 20px); }
			.ratings-explanation .re-label { display: block; text-align: center; margin-bottom: 10px; font-size: 1.5rem; line-height: 1.3; }
			.ratings-explanation ul.ratings { column-count: 2; }
			.ratings-explanation ul.ratings li { display: block; margin-bottom: 5px; font-size: 1.5rem; line-height: 1.3; }
			.form-group .fg-index { left: 50%;
									transform:translateX(-50%);
									width:          84px;
									height:         84px;
									border-radius:  84px;
									line-height:    84px;
									margin-bottom:   0px;
									font-size:      35px;}
			.css.skn-1 .fg-title { display: block; margin: 25px 0 15px 0; text-align: center; font-size: 3rem; line-height: 1.2; }
			html[data-location="site"] .css.skn-1 .fg-title { display: none;}
			.form-group .fg-line { width: calc(100% - 40px); margin: 0 0 -2px 20px; top: -9px; }
			.form-group[data-contents="ratings"] .fg-line { display: none; }
			.form-group[data-contents="ratings"] ul.fg-icons { position: relative; display: inline-block; top: 15px; left: 0px; left: 50%; transform:translateX(-50%); }
			.form-group[data-contents="ratings"] ul.fg-icons li { width: 12vw; }
			.form-group[data-contents="ratings"] ul.fg-icons li em { width: calc(100% - 20px); }
			.form-element[data-type="radios6"] .fe-value { display: inline-block; width: calc(100% - 20px); margin-left: -10px; left: 50%; transform:translateX(-50%); outline: 0px solid red; text-align: center;}
			.form-element[data-type="radios6"] .fe-value label { width: 12vw; outline: 0px dotted blue; }

			.form-element { margin-bottom: 15px; }
			.form-element[data-type="text1row"] { margin-bottom: 0 }
			.form-element .fe-label { display: block; width: 100%; margin-bottom: 10px; }
			.form-element:hover { background-color: transparent; }
			.form-element .fe-label p { margin: 0; }
			.form-element:after { width:calc(100% - 20px); margin: 0 0 -1px 0px; top: 14px; }
			.form-element[data-type="text1row"] .fe-value input { margin: 0 0 0 0; width: calc(100% - 180px); }
			.form-element[data-type="text1row"]:after { display: none; }
			#survey h2 { font-size: 3rem; line-height: 1.2; text-align: center;}
			.css.skn-1.tpl-survey-saved h2 { font-size: 3rem; line-height: 1.2; text-align: center; }
			.css.skn-1.tpl-survey-saved p { text-align: center; }
			.form-element .fe-marker { left: -20px; }
			.form-element[data-type="text1row"] .fe-marker { top:0; }
			.form-element .fe-value { width: 100%; }
			.form-element[data-type="text1row"] .fe-value input, .form-element[data-type="text3rows"] .fe-value textarea {
				width: calc(100% - 40px);
				margin: 0 0 0 0;
			}

		}
		#survey ul.ratings li em {
			transition: opacity 0.5s ease 0.25s;
			will-change:opacity;
		}
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(1):hover) ul.ratings li:not(:nth-child(1)) em,
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(2):hover) ul.ratings li:not(:nth-child(2)) em,
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(3):hover) ul.ratings li:not(:nth-child(3)) em,
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(4):hover) ul.ratings li:not(:nth-child(4)) em,
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(5):hover) ul.ratings li:not(:nth-child(5)) em,
		#survey:has(.form-element[data-type="radios6"] .fe-value label:nth-child(6):hover) ul.ratings li:not(:nth-child(6)) em { opacity: 0.2; transition: opacity 0.5s ease 0.25s; }





/* LOCALIZATIONS */

html[lang="hu"] {}
html[lang="hu"] {}




.form-notes {
	font-size: 1.3rem;
	line-height: 1.2;
	white-space:nowrap;
}
.form-notes p {
	white-space:pre-line;
}