/* Start connecting fonts */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;700&display=swap');
/* End connecting fonts */


/* Start wordpress editor */
.alignnone{display:block;}
.alignleft {display: inline;float: left;}
.alignright {display: inline;float: right;}
.aligncenter {display: block;margin-right: auto;margin-left: auto;}
blockquote.alignleft,.wp-caption.alignleft,img.alignleft {margin: 0 18px 10px 0;}
blockquote.alignright,.wp-caption.alignright,img.alignright {margin: 0 0 10px 18px;}
blockquote.aligncenter,.wp-caption.aligncenter,img.aligncenter {clear: both;margin-top: 0.4em;margin-bottom: 0.4em;}
.wp-caption.alignleft,.wp-caption.alignright,.wp-caption.aligncenter {margin-bottom: 1.2em;}
/* End wordpress editor */


/* Start general */
html, 
body { 
	height: 100%; 
}
body{
	color: #315678; 
	background-color: #094077;
	background-image: url(../img/bg.png);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	font-family: 'Heebo', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1;
}
body > section{
	width: 100%;
	height: 100%;
}
body.rtl{
	direction: rtl;
}
.container-fluid{
	max-width: 100%;
}
ul, ol{
	margin: 0;
	padding: 0;
}
a, a:hover{
	color: #00BAF2;
}
form{
	margin-bottom: 0;
}
input{
	box-shadow: none;
}
a, button, input[type="submit"], input, textarea{
	/*-webkit-transition: .3s all;
	-o-transition: .3s all;
	transition: .3s all;*/
}
a:focus, input:focus, textarea:focus, button:focus{
	outline: 0;
}
img{
	max-width: 100%;
	display: inline-block;
}
abbr[title]{
	text-decoration: none;
}
#main-wrapper{
	overflow: hidden;
}
@media (min-width: 768px){
	body{
		background-image: url(../img/bgd.png);
	}
}
/* End general */


/* Start .authorization */
.authorization{
	display: flex;
	padding: 3em 0;
}
.authorization > .container-fluid{
	max-width: 358px;
	margin: auto;
}
.authorization .logo{
	display: block;
	margin: 0 auto 4.35em;
	width: 17em;
	max-width: 100%;
}
.authorization form label{
	display: block;
	margin-bottom: 0.933em;
}
.authorization form label span{
	display: block;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.62;
	color: #fff;
}
.authorization form input{
	width: 100%;
	height: 2.4em;
	background-color: #fff;
	border: 1px solid #D9D9D9;
	border-radius: 0.32em;
	font-size: 1.66em;
	color: #315678;
	font-weight: 400;
	line-height: 1;
	padding: 0 0.4em;
}
.authorization form button{
	width: 100%;
	height: 4em;
	font-size: 1em;
	background: #20C9C9;
	border: 1px solid #D9D9D9;
	border-radius: 0.55em;
	text-align: center;
	color: #fff;
	margin-top: 1.45em;
}
.authorization form button span{
	font-size: 20px;
	font-weight: 500;
}
.authorization form p{
	font-size: 14px;
	font-weight: 400;
	color: #fff;
	line-height: 1.47;
	margin-top: 1.21em;
	margin-bottom: 0;
	text-align: center;
}
.authorization form p + p{
	margin-top: 0.3em;
}
.authorization form p a{
	color: #fff;
	text-decoration: underline;
}
.authorization form p a:hover{
	text-decoration: none;
}
.authorization .form-error{
	font-size: 14px;
	font-weight: 400;
	color: #E22523;
	margin-top: 1.21em;
	line-height: 1.47;
	text-align: center;
}
@media (max-width: 530px){
	.authorization{
		font-size: 2.815vw;
	}
}
/* End .authorization */


/* Start .welcome */
.welcome{
	display: flex;
	padding: 3em 0;
	text-align: center;
}
.welcome > .container-fluid{
	max-width: 428px;
	margin: auto;
}
.welcome .logo{
	width: 21.3em;
	display: block;
	margin: 0 auto;
}
.welcome  .title{
	font-size: 4em;
	line-height: 1.45;
	font-weight: 700;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.15em;
}
.welcome .desc{
	font-size: 2em;
	line-height: 1.06;
	font-weight: 400;
	color: #fff;
	margin-bottom: 0;
}
.welcome .desc{
	font-size: 2em;
	line-height: 1.06;
	font-weight: 400;
	color: #fff;
	margin-bottom: 2.1em;
}
.welcome .go-to-questions{
	display: inline-block;
	font-size: 2em;
	line-height: 1.06;
	font-weight: 400;
	color: #fff;
}
.welcome .go-to-questions:after{
	content: '';
	display: inline-block;
	width: 1em;
	height: 1em;
	background-image: url(../img/go-to-icon.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	vertical-align: middle;
}
@media (max-width: 530px){
	.welcome{
		font-size: 2.815vw;
	}
}
/* End .welcome */


/* Start .init-question */
.init-question{
	display: flex;
	padding: 3em 0;
	text-align: center;
}
.init-section-logo + .init-question{
	height: calc(100% - 4.66em);
}
.init-question > .container-fluid{
	max-width: 428px;
	margin: auto;
}
.init-question .logo{
	width: 12.6em;
	display: block;
	margin: 0 auto 2.8em;
}
.init-question .section-welcome{
	margin-top: 0.72em;
}
.init-question .section-welcome .title{
	font-size: 2.66em;
	line-height: 1.05;
	font-weight: 400;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0;
}
.init-question .section-welcome .desc{
	font-size: 1.66em;
	line-height: 1.28;
	font-weight: 400;
	color: #fff;
	margin-bottom: 0;
}
.init-question .section-next{
	margin-top: 3.32em;
	margin-bottom: 3em;
}
@media (max-width: 530px){
	.init-question,
	.init-section-logo{
		font-size: 2.815vw;
	}
}
/* End .init-question */


/* Start .section-question */
.section-question{
/*	margin-top: 2.8em;*/
	text-align: center;
}
.section-question .title{
	font-size: 2em;
	font-weight: 500;
	line-height: 1.47;
	color: #fff;
	margin-top: 1em;
	margin-bottom: 0.22em;
}
.section-question .desc{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.13;
	color: #fff;
	margin-bottom: 0;
}
.section-question.framed{
	background: #FFFFFF;
	border-radius: 0.53em;
	border: 0.26em solid #C9FAF1;
	margin-top: 4.26em;
	padding: 0.73em 0.66em 1em;
}
.section-question.framed .title{
	font-size: 2.4em;
	font-weight: 300;
	line-height: 1;
	color: #878D94;
	margin-bottom: 0.44em;
}
.section-question.framed .desc{
	color: #878D94;
}
.section-question .video-wrap{
	margin-left: -15px;
	margin-right: -15px;
}
.section-question .video-wrap iframe{
	width: 100%;
	height: 16em;
}

.section-question .video-wrap img{
	width: auto;
	height: 16em;
}
.section-question .video-title{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.5;
	color: #fff;
	margin-top: 0.5em;
	margin-bottom: 0;
}
/* End .section-question */


/* Start .section-answer */
.section-answer{
	text-align: center;
	max-width: 428px;
}
.section-answer.bool{
	margin-top: 1.73em;
}
.section-answer.bool .row{
	margin-left: -0.66em;
	margin-right: -0.66em;
}
.section-answer.bool .row > div{
	padding-left: 0.66em;
	padding-right: 0.66em;
}
.section-answer.bool label{
	display: block;
	margin-bottom: 0;
}
.section-answer.bool label input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.section-answer.bool label span{
	display: block;
	height: 11em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.533em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;	
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
}
.section-answer.bool label input[value="answer_0"] + span{
	background-image: url(../img/false.svg);
}
.section-answer.bool label input[value="answer_1"] + span{
	background-image: url(../img/true.svg);
}
.section-answer.radio{
	margin-top: 4.3em;
	max-width: 317px;
	margin-left: auto;
	margin-right: auto;
}
.section-answer.radio label{
	display: block;
	margin-bottom: 0;
	padding: 0;
}
.section-answer.radio label + label{
	margin-top: 0.8em;
}
.section-answer.radio label input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.section-answer.radio label span{
	display: block;
	min-height: 5.55em;
	line-height: 5.05em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.35em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;	
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
	color: #315678;
}
.section-answer.radio label span b{
	display: inline-block;
	font-size: 1.66em;
	font-weight: 400;
	line-height: 1.3;
  vertical-align: middle;
}



.section-answer.radio2{
	margin-top: 4.3em;
	max-width: 396px;
	margin-left: auto;
	margin-right: auto;
	text-align: right;
}
.section-answer.radio2 label{
	display: block;
	margin-bottom: 0;
	padding: 0;
}
.section-answer.radio2 label + label{
	margin-top: 2em;
}
.section-answer.radio2 label input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.section-answer.radio2 label span{
	display: block;
	min-height: 5.55em;
	line-height: 5.05em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.35em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;	
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
	color: #315678;
	padding: 0 2em 0 1em;
}
.section-answer.radio2 label span b{
	display: inline-block;
	font-size: 1.66em;
	font-weight: 400;
	line-height: 1.08;
	vertical-align: middle;
}
.section-answer label input:checked + span{
	background-color: #BDEFEF;
}

.section-answer label input.correct1 + span{
/*	background: linear-gradient(180deg, #C615A9 0%, #CD1DB0 56.25%, #E732C9 100%);*/
	background-color: #DBF1FC;
/*	color: #fff;*/
	border: 0;
	line-height: 5.55em;
}
.section-answer label input.correct2 + span{
/*	background: linear-gradient(180deg, #F16B8B 0%, #F391A9 100%);*/
	background-color: #FFF6DE;
	color: #315678;
	border: 0;
	line-height: 5.55em;
}
.section-answer label input.correct3 + span{
/*	background: linear-gradient(180deg, #FFD439 0%, #FDDE6F 100%);*/
	background-color: #D0D6E8;
	color: #315678;
	border: 0;
	line-height: 5.55em;
}
.section-answer label input.correct4 + span{
/*	background: linear-gradient(180deg, #F98633 0%, #F8A163 100%);*/
	background-color: #B9ECEC;
	color: #315678;
	border: 0;
	line-height: 5.55em;
}
.section-answer label input.correct5 + span{
/*	background: linear-gradient(180deg, #BE83EC 0%, #E4C2FF 100%);*/
	background-color: #EEFEE5;
	color: #315678;
	border: 0;
	line-height: 5.55em;
}

.section-answer label input.correct + span{
	background-color: #20C9C9;
	color: #fff;
}
.section-answer label input.incorrect + span{
	background-color: #fff;
	border-color: #E22523;
}
.section-answer.value{
	max-width: 186px;
}
.section-answer.value .correct-answer{
	display: none;
	background-color: #20C9C9;
	border-radius: 0.67em;
	font-size: 2em;
	font-weight: 500;
	line-height: 1.13;
	color: #fff;
  margin: 0 -1.15em 1.08em;
  padding: 0.6em 0.2em;
}
.section-answer.value .correct-answer span{
	font-weight: 700;
}
.section-answer.value input{
	background-color: #fff;
	font-size: 2em;
	border-radius: 0.135em;
	height: 3.34em;
	width: 100%;
	padding: 0 0.34em;
	border: 0;
	margin-bottom: 2em;
}
.section-answer.value input.line-through{
	text-decoration: line-through;
}
.section-answer.value input.correct-is{
	color: #098484;
  font-weight: 700;
}
.section-answer.value input[disabled]{
	background-color: #fff;
}
.section-answer.value button{
	display: block;
  height: 5.55em;
  width: 100%;
  background-color: #fff;
  border-width: 0.15em 0.15em 0.35em 0.15em;
  border-color: #20C9C9;
  border-style: solid;
  border-radius: 0.66em;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto auto;
  color: #315678;
  text-align: center;
}
.section-answer.value button:hover{
	background-color: #BDEFEF;
}
.section-answer.value button span{
	display: inline-block;
	font-size: 1.67em;
}
.section-answer.value button.correct{
	background-color: #20C9C9;
	color: #fff;
}
.section-answer.value button.incorrect{
	background-color: #fff;
	border-color: #E22523;
}

.section-answer.drag:before{
	content: '';
	position: absolute;
	z-index: 40;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.3);
}
.section-answer.drag.no-blackout:before{
	display: none;
}
.section-answer.drag .row{
	margin-left: -0.66em;
	margin-right: -0.66em;
}
.section-answer.drag .row > div{
	padding-left: 0.66em;
	padding-right: 0.66em;
	margin-bottom: 1.32em;
}
.section-answer.drag h3{
	font-size: 1.67em;
	font-weight: 500;
	line-height: 1.08;
	color: #fff;
	margin-top: 0;
	margin-bottom: 1.3em;
}
.section-answer.drag .drag-icon{
	padding-bottom: 2.4em;
	position: relative;
}
.section-answer.drag .drag-icon:before{
	content: '';
	position: absolute;
	left: 50%;
	margin-left: -6.8em;
	bottom: 0.6em;
	width: 13.6em;
	height: 3.67em;
	z-index: 50;
  
	background-image: url(../img/icon-drag.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
.section-answer.drag .drag-icon.arrows-hidden:before{
	display: none;
}
.section-answer.drag .answer-box{
	width: 4.94em;
	height: 5.6em;
	margin: 0 auto;
}
.section-answer.drag .bag{
	width: 4.94em;
	height: 5.6em;
	background-image: url(../img/money-bag.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
.section-answer.drag .house{
	width: 4.94em;
	height: 5.6em;
	background-image: url(../img/money-house.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
.section-answer.drag .col-item input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.section-answer.drag .framed-wrapper{
	border: 1px dashed #FFFFFF;
	border-radius: 8px;
	padding: 1.15em 1em 1.05em;
}

.section-answer.drag .framed-wrapper .answer-box{
	margin-bottom: 0.6em;
}
.section-answer.drag .framed-wrapper p{
	font-size: 1.33em;
	line-height: 1.1;
	color: #fff;
	margin-bottom: 0;
}
.section-answer.drag .col-item input:checked + .framed-wrapper{
	border: 1px solid #20C9C9;
	background-color: #BDEFEF;
}
.section-answer.drag .col-item input:checked + .framed-wrapper p{
	color: #315678;
}
.section-answer.drag .col-item input.incorrect + .framed-wrapper{
	border: 1px solid #E22523;
	background-color: #fff;
}
.section-answer.drag .col-item input.incorrect + .framed-wrapper p{
	color: #E22523;
}
.section-answer.drag .col-item input.correct + .framed-wrapper{
	background-color: #20C9C9;
	border: 0;
}
.section-answer.drag .col-item input.correct + .framed-wrapper p{
	color: #fff;
}

.section-answer.order .order-list{
	line-height: none;
}
.section-answer.order .order-list li{
	display: block;
	position: relative;
	min-height: 5.55em;
	line-height: 5.05em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.35em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
	color: #315678;
	margin-bottom: 0.8em;
	cursor: n-resize;
}
.section-answer.order .order-list li:before{
	content: '';
	width: 1.2em;
	height: 0.933em;
	background-image: url(../img/icon-drag2.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	position: absolute;
	top: 50%;
	margin-top: -0.466em;
	right: 0.86em;
}
.section-answer.order .order-list li.correct{
	background-color: #20C9C9;
	color: #fff;
}
.section-answer.order .order-list li.correct:before{
	background-image: url(../img/icon-drag2white.svg);
}
.section-answer.order .order-list li.incorrect{
	background-color: #fff;
	border-color: #E22523;
}
.section-answer.order .order-list li span{
	display: inline-block;
	font-size: 1.66em;
	font-weight: 400;
	line-height: 1.3;
	vertical-align: middle;
}
.section-answer.order button[type="submit"]{
	display: block;
  height: 5.55em;
  width: 12em;
  border: 0;
  background-color: #61CAFF;
  border-radius: 0.66em;
  color: #fff;
  text-align: center;
  margin: 3em auto 0;
}
.section-answer.order button[type="submit"][disabled]{
  background-color: #C8E1ED;
}
.section-answer.order button[type="submit"] span{
	display: inline-block;
	font-size: 1.67em;
	font-weight: 400;
}



.section-answer.pairs .row{
	margin-left: -1.15em;
	margin-right: -1.15em;
}
.section-answer.pairs .row > div{
	padding-left: 1.15em;
	padding-right: 1.15em;
	margin-bottom: 1.2em;
}
.section-answer.pairs label{
	display: block;
	margin-bottom: 0;
	padding: 0;
}
.section-answer.pairs label input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.section-answer.pairs label span{
	display: block;
	min-height: 5.55em;
	line-height: 5.05em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.35em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;	
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
	color: #315678;
}
.section-answer.pairs label span b{
	display: inline-block;
	font-size: 1.66em;
	font-weight: 400;
	line-height: 1.47;
  vertical-align: middle;
}




/* End .section-answer */


/* Start .section-next */
.section-next{
	text-align: center;
}
.section-next .next-question{
	display: none;
	font-size: 1.66em;
	line-height: 1.47;
	color: #fff;
	text-decoration: underline;
}
.section-next .skip-question{
	font-size: 1.66em;
	line-height: 1.47;
	color: #fff;
	text-decoration: underline;
}
/* End .section-next */


/* Start .page-content */
.section-logo{
	text-align: center;
	background-color: rgba(28, 30, 32, 0.2);
	height: 4.66em;
	line-height: 4.66em;
}
.section-logo img{
	display: inline-block;
	width: 8.8em;
	line-height: 1;
	vertical-align: middle;
}
.page-content .section-points{
	position: fixed;
/*	top: 6.2em;*/
	top: 1em;
	right: 1em;
	left: 1em;
	z-index: 50;
}
.page-content.static-points .section-points{	
	position: static;
	height: 5.85em;
	line-height: 5.85em;
	padding: 1.6em 15px 0;
}
.page-content .section-points > div{
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
	background-color: #BBB499;
	padding: 2px;
	border-radius: 20px;
}
.page-content .section-points > div:nth-child(1){
	float: right;
}
.page-content .section-points > div:nth-child(2),
.page-content .section-points > div:nth-child(3){
	float: left;
}
.page-content .section-points > div > div{
	display: inline-block;
	vertical-align: middle;
	border: 2px solid #fff;
	background-color: #EAE8E0;
	color: #315678;
	font-size: 1.34em;
	border-radius: 20px;
	height: 1.8em;
	line-height: 1.8em;
	padding: 0 0.7em 0 0.6em;
}
.page-content .section-points .points{
	background-image: url(../img/icon-shell.png);
	background-position: left 0.55em center;
	background-repeat: no-repeat;
  background-size: auto 68%;
  padding-left: 2.3em;
}
.page-content .section-points .points span{
	display: inline-block;
	vertical-align: middle;
	line-height: 1;
}
.page-content .section-content{
	height: calc(100% - 4.66em - 8em);
	overflow: auto;
	min-height: 12em;
}
.page-content.static-points .section-content{
	height: calc(100% - 4.66em - 8em - 5.85em);
}
.page-content .section-nav{
	background-color: #FFFDEE;
	height: 8em;
	line-height: 8em;
	text-align: center;
}
.page-content .section-nav .menu{
	display: inline-block;
	width: 100%;
	max-width: 410px;
	overflow: hidden;
	list-style: none;
	line-height: 1;
	vertical-align: middle;
}
.page-content .section-nav .menu > li{
	float: left;
	width: 25%;
}
.page-content .section-nav .menu > li a:before{
	content: '';
	display: block;
	margin: 0 auto 0.42em;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	height: 1.94em;
	opacity: 0.5;
}
.page-content .section-nav .nav-li-home a:before{
	background-image: url(../img/icon-home.svg);
}
.page-content .section-nav .nav-li-dictionary a:before{
	background-image: url(../img/icon-dictionary.svg);
}
.page-content .section-nav .nav-li-rating a:before{
	background-image: url(../img/icon-rating.svg);
}
.page-content .section-nav .nav-li-shop a:before{
	background-image: url(../img/icon-shop.svg);
}
.page-content .section-nav .menu > li a{
	font-size: 1.07em;
	line-height: 1;
	font-weight: 700;
	color: transparent;
}
.page-content .section-nav .menu .current-menu-item a{
	color: #53575D;
}
/*.page-content .section-nav .menu > li a:hover:before,
.page-content .section-nav .menu .current-menu-item a:before{
	opacity: 1;
}*/
.page-content .section-nav .nav-li-home a:hover:before,
.page-content .section-nav .nav-li-home.current-menu-item a:before{
	background-image: url(../img/icon-home-a.svg);
	opacity: 1;
}
.page-content .section-nav .nav-li-dictionary a:hover:before,
.page-content .section-nav .nav-li-dictionary.current-menu-item a:before{
	background-image: url(../img/icon-dictionary-a.svg);
	opacity: 1;
}
.page-content .section-nav .nav-li-rating a:hover:before,
.page-content .section-nav .nav-li-rating.current-menu-item a:before{
	background-image: url(../img/icon-rating-a.svg);
	opacity: 1;
}
.page-content .section-nav .nav-li-shop a:hover:before,
.page-content .section-nav .nav-li-shop.current-menu-item a:before{
	background-image: url(../img/icon-shop-a.svg);
	opacity: 1;
}

.page-content .wpml-ls-legacy-dropdown-click{
	width: auto;
}
.page-content .wpml-ls-legacy-dropdown-click a{
	color: #315678;
  padding: 0 1em 0 0;
  border: 0;
  background-color: #EAE8E0;
  text-transform: uppercase;
  line-height: 1.65;
}
.page-content .wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu a{
	padding: 0 0.5em;
}
.page-content .wpml-ls-legacy-dropdown-click a > span{
	display: inline-block;
	vertical-align: middle;
	line-height: 1;
}
.page-content .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle:after{
	right: 0;
}
.rtl .page-content .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle{
	padding: 0 0 0 1em;
}
.rtl .page-content .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle:after {
  right: auto;
  left: 0;
}




@media (max-width: 450px){
	.page-content{
		font-size: 3.33vw;
	}
}
/* End .page-content */


/* Start .steps-content */
.steps-content{
	display: flex;
	align-items: center;
	padding: 2em 0;
}
.steps-content .steps{
	position: relative;
	width: 23.74em;
	height: 96.2em;
	overflow: hidden;
	background-image: url(../img/snake.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: 100% auto;
	margin: auto;
	text-align: center;
}
.steps-content .steps.one-third{
	height: 38em;
}
.steps-content .steps.two-thirds{
	height: 65em;
}
.steps-content .steps .step{
	display: block;
	position: absolute;
	text-decoration: none;

  -webkit-transform: translate(-50%, 50%);
  -moz-transform: translate(-50%, 50%);
  -ms-transform: translate(-50%, 50%);
  -o-transform: translate(-50%, 50%);
  transform: translate(-50%, 50%);
}
.steps-content .steps .circle{
  text-align: center;
  width: 4em;
  height: 4em;
  line-height: 3.7em;
  padding: 0.25em;
  border-radius: 100%;
  background-color: #fff;
}
.steps-content .steps .circle > span{
	display: block;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background-color: #E1E1E1;
  color: #878D94;
  font-size: 2em;
  font-weight: 700;
}
.steps-content .steps .completed:not(.gift) .circle{
	font-size: 1.43em;
	padding: 0.25em;
	background-color: #1CAF95;
}
.steps-content .steps .completed .circle > span,
.steps-content .steps [class*="percent-"] .circle > span{
/*	background-color: #1FC7C7;*/
	background: linear-gradient(180deg, #3EE9E9 0%, #20C9C9 37.5%, #1ABDBD 100%);
	color: #fff;
}
.steps-content .steps .gift .circle{
	background-color: #E1E1E1;
	width: 5.33em;
	height: 5.33em;
	line-height: 5.03em;
}
.steps-content .steps .gift.completed .circle{
	font-size: 1.08em;
	padding: 0.35em;
	background-color: #1CAF95;
}
.steps-content .steps .gift .circle > span{
	background-color: #fff;
	font-size: 1em;
	background-image: url(../img/icon-gift.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 62% auto;
}
.steps-content .steps .gift[class*="percent-"] .circle > span{
	background-color: #E1E1E1;
}
.steps-content .steps .points{
	color: #fff;
	position: absolute;
	right: 0;
	-webkit-transform: translateY(50%);
  -moz-transform: translateY(50%);
  -ms-transform: translateY(50%);
  -o-transform: translateY(50%);
  transform: translateY(50%);
}
.steps-content .steps .points span{
	display: inline-block;
	vertical-align: middle;
	font-size: 1.3em;
	font-weight: 300;
}
.steps-content .steps .points b{
	display: inline-block;
	vertical-align: middle;
	font-size: 2em;
	font-weight: 400;
	line-height: 1;
}
.steps-content .steps .points:before{
	display: inline-block;
	vertical-align: middle;
	content: '';
	width: 1.87em;
	height: 1.74em;
	background-image: url(../img/icon-shell2.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	position: relative;
	top: -0.135em;
	margin-left: 0.2em;
}

.steps-content .steps .percent-10 .circle{
	background-image: linear-gradient(126deg, transparent 50%, #ffffff 50%), linear-gradient(90deg, #ffffff 50%, #1CAF95 50%);
}
.steps-content .steps .percent-20 .circle{
	background-image: linear-gradient(162deg, transparent 50%, #ffffff 50%), linear-gradient(90deg, #ffffff 50%, #1CAF95 50%);
}
.steps-content .steps .percent-30 .circle{
	background-image: linear-gradient(198deg, transparent 50%, #ffffff 50%), linear-gradient(90deg, #ffffff 50%, #1CAF95 50%);
}
.steps-content .steps .percent-40 .circle{
	background-image: linear-gradient(234deg, transparent 50%, #ffffff 50%), linear-gradient(90deg, #ffffff 50%, #1CAF95 50%);
}
.steps-content .steps .percent-50 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(-90deg, #1CAF95 50%, #ffffff 50%);
}
.steps-content .steps .percent-60 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(-54deg, #1CAF95 50%, #ffffff 50%);
}
.steps-content .steps .percent-70 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(-18deg, #1CAF95 50%, #ffffff 50%);
}
.steps-content .steps .percent-80 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(18deg, #1CAF95 50%, #ffffff 50%);
}
.steps-content .steps .percent-90 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(54deg, #1CAF95 50%, #ffffff 50%);
}
/*.steps-content .steps .percent-100 .circle{
	background: linear-gradient(270deg, #1CAF95 50%, transparent 50%), linear-gradient(90deg, #1CAF95 50%, #ffffff 50%);
}*/

.steps-content .steps .step-1{
	bottom: 2.05em;
	left: 55%;
}
.steps-content .steps .step-1.completed{
  bottom: 3.05em;
}
.steps-content .steps .step-1 + .points{
	bottom: 2.05em;
}
.steps-content .steps .step-1.completed + .points{
	bottom: 3.05em;
}
.steps-content .steps .step-2{
	bottom: 13em;
	left: 52.8%;
}
.steps-content .steps .step-2 + .points{
	bottom: 13em;
}
.steps-content .steps .step-3{
	bottom: 23.5em;
	left: 53.2%;
}
.steps-content .steps .step-3 + .points{
	bottom: 23.5em;
}
.steps-content .steps .gift-1{
	bottom: 34em;
	left: 32.8%;
}
.steps-content .steps .step-4{
	bottom: 44.6em;
	left: 55%;
}
.steps-content .steps .step-4 + .points{
	bottom: 44.6em;
}
.steps-content .steps .step-5{
	bottom: 51.6em;
	left: 29%;
}
.steps-content .steps .step-5 + .points{
	bottom: 51.6em;
}
.steps-content .steps .step-6{
	bottom: 54.6em;
	left: 66%;
}
.steps-content .steps .step-6 + .points{
	bottom: 54.6em;
}
.steps-content .steps .step-7{
	bottom: 60.8em;
	left: 91%;
}
.steps-content .steps .step-7 + .points{
	bottom: 60.8em;
}
.steps-content .steps .step-7.completed{
	left: 88%;
}
.steps-content .steps .gift-2{
	bottom: 67em;
	left: 55.8%;
}
.steps-content .steps .step-8{
	bottom: 73.8em;
	left: 30%;
}
.steps-content .steps .step-8 + .points{
	bottom: 73.8em;
}
.steps-content .steps .step-9{
	bottom: 81.6em;
	left: 63.6%;
}
.steps-content .steps .step-9 + .points{
	bottom: 81.6em;
}
.steps-content .steps .step-10{
	bottom: 91.5em;
	left: 63.5%;
}
.steps-content .steps .step-10 + .points{
	bottom: 91.5em;
}
/* End .steps-content */


/* Start .dictionary-content */
.dictionary-content{
	margin: 0 15px;
	padding: 1.1em 15px;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 0.54em 0.54em 0 0;
}
.dictionary-content .title{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.45;
	color: #315678;
	margin-top: 0.55em;
	margin-bottom: 0;
}
.dictionary-content .accordion .item{
	padding: 0.5em 0;
	border-bottom: 1px solid #315678;
}
.dictionary-content .accordion .item > button{
	border: 0;
	border-radius: 0;
	padding: 0;
	font-size: 1.34em;
	font-weight: 400;
	line-height: 1.45;
	color: #315678;
	background: transparent;
}
.dictionary-content .accordion .item > div{
	display: none;
	font-size: 1.2em;
	font-weight: 400;
	line-height: 1.45;
}
.dictionary-content .accordion:last-of-type .item:last-child{
	border: 0;
}
/* End .dictionary-content */


/* Start .rating-content */
.rating-content{
	margin: 0 15px;
	padding: 1.55em 0 0;
	background-color: rgba(255, 255, 255, 0.6);
	border-radius: 0.54em 0.54em 0 0;
}
.rating-content .section-title{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.45;
	color: #315678;
	margin-top: 0;
	margin-bottom: 1.22em;
	text-align: center;
}
.rating-content .rating-item{
	position: relative;
	border-top: 1px solid #D9D9D9;
	padding: 0 4.67em;
}
.rating-content .rating-item .img{
	height: 3.47em;
	width: 3.47em;
	border-radius: 50%;
	background-color: #315678;
	/*background-image: url(../img/icon-user.svg);*/
	/*background-size: 55% auto;*/
	background-repeat: no-repeat;
	background-position: center center;
	
  position: absolute;
  top: 50%;
  right: 0.55em;

  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.rating-content .rating-item:nth-of-type(1n) .img{
	background-image: url(../img/icon-user1.svg);
}
.rating-content .rating-item:nth-of-type(2n) .img{
	background-image: url(../img/icon-user2.svg);
}
.rating-content .rating-item:nth-of-type(3n) .img{
	background-image: url(../img/icon-user3.svg);
}
.rating-content .rating-item .title{
  font-size: 1em;
	min-height: 4.9em;
	line-height: 4.9em;
	margin-top: 0;
	margin-bottom: 0;
}
.rating-content .rating-item .title > span{
	display: inline-block;
	font-size: 1.34em;
	line-height: 1.45;
	font-weight: 400;
	color: #315678;
	vertical-align: middle;
}
.rating-content .rating-item .points{
	font-size: 1.34em;
	line-height: 1.45;
	font-weight: 700;
	color: #315678;
	position: absolute;
  top: 50%;
  left: 0.6em;

  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* End .rating-content */


/* Start .static-content */
.static-content{
	padding: 0 15px;
}
.static-content .row{
	margin-left: -0.77em;
	margin-right: -0.77em;
}
.static-content .row > div{
	padding-left: 0.77em;
	padding-right: 0.77em;
	margin-bottom: 1.54em;
}
.static-content .col-item{
	background-color: rgba(255, 255, 255, 0.8);
	background-image: url(../img/icon-lock.png);
	background-repeat: no-repeat;
	background-position: center center;
	border-radius: 0.54em;
	min-height: 8.54em;
	padding: 0 1.2em;
}
.static-content .col-item.current,
.static-content .col-item.next{
	background-image: none;
}
.static-content .col-item .title{
	margin-top: 0;
	margin-bottom: 0;
	min-height: 5.9em;
	line-height: 5.9em;
	font-size: 1em;
	color: #315678;
}	
.static-content .col-item .title span{
	display: inline-block;
	vertical-align: middle;
	font-size: 1.2em;
	line-height: 1.1;
	font-weight: 400;
}
.static-content .col-item .points{
	text-align: left;
	color: #315678;
}
.static-content .col-item .points span{
	display: inline-block;
	vertical-align: middle;
	font-size: 1.2em;
	line-height: 1.45;
	font-weight: 700;
	padding-top: 0.35em;
}
.static-content .col-item .points:after{
	display: inline-block;
	vertical-align: middle;
	content: '';
	width: 1.87em;
	height: 1.74em;
	background-image: url(../img/icon-shell2.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	margin-right: 0.6em;
}
.static-content .col-item.next .title,
.static-content .col-item.next .points{
	color: #878D94;
}
.static-content .col-item.next .points:after{
	opacity: 0.3;
}
/* End .static-content */


/* Start .question-content */
.question-content{
	position: relative;
	overflow: hidden;
}
.question-content .section-success{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	display: none;
	z-index: 100;
}	
.question-content .section-progress{
	height: 4.25em;
	background-color: #20C9C9;
	position: relative;
	border-bottom: 1px solid #fff;

	position: fixed;
	left: 0;
	right: 0;
	top: 0;
}
.question-content .section-progress .row{
	margin-left: 0;
	margin-right: 0;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0.85em;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
.question-content .section-progress .row > div{
	padding-left: 0;
	padding-right: 0;
	text-align: center;
	float: none;
}
.question-content .section-progress .bar{
	background-color: #E6E6E6;
	height: 1em;
	border-radius: 1.34em;
  direction: ltr;
}
.question-content .section-progress .bar span{
	display: block;
	width: 50%;
	background-color: #20C9C9;
	height: 100%;
	border-radius: 1.34em;
	border-width: 0.2em 0.67em 0.67em 0.67em;
	border-color: #098484;
	border-style: solid;
	position: relative;
}
.question-content .section-progress .bar span:after{
	content: '';
	display: block;
	width: 3.33em; 
	height: 3.33em;
	background-image: url(../img/animation2.gif);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	position: absolute;
	right: -1.85em;
	top: -1.4em;
}
.question-content .section-progress .bar span.noanim:after{
	display: none;
}
.question-content .section-progress .go-back{
	display: inline-block;
}
.question-content .section-progress .go-back svg{
	width: 2.14em;
	height: auto;
}
.question-content .section-content{
	display: flex;
	flex-direction: column;
  justify-content: space-between;
	height: calc(100% - 4.25em - 7em);
	overflow: auto;
	min-height: 12em;	
	padding: 0 15px;
}
.question-content .section-question{
	display: flex;
	flex-direction: column;

	max-width: 428px;
	width: 100%;
	margin: auto;
	padding: 1.5em 0;
}
.question-content .section-answer{
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: auto;
}
.question-content .section-next{
	height: 7em;
	padding-top: 1.2em;
	text-align: center;
	-webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
}
/* Start My solution */
.question-content .section-content{
/*	height: calc(100% - 4.25em);*/
	height: 100%;
	padding-top: 4.25em;
	padding-bottom: 2em;
}
.question-content .section-next{
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 500;
  background-color: #FFFDEE;
  padding-top: 2.2em;
}
.question-content .section-next .next-question{
	color: #4D5159;
	display: block;
}
/* End My solution */
@media (max-width: 450px){
	.question-content{
		font-size: 3.33vw;
	}
}
/* End .question-content */




.section-error{
	display: none;
	text-align: center;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 600;
  background-color: #373E45;
  padding-top: 0.8em;
  padding-bottom: 2.35em;

	-webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
}
.section-error .error-close{
	display: block;
	width: 2.14em;
	height: 2.14em;
	background-image: url(../img/icon-close.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	cursor: pointer;

	position: absolute;
	top: 1.38em;
	right: 1.38em;
}
.section-error .error-title{
	font-size: 2.66em;
	font-weight: 400;
	color: #F86260;
	line-height: 1.3;
	margin: 0;
	padding: 0 1.3em;
}
.section-error .error-desc{
	font-size: 1.4em;
	font-weight: 400;
	color: #F86260;
	line-height: 1.3;
}
.section-error .next-question,
.section-error .retry-question{
	display: inline-block;
	font-size: 1.66em;
	line-height: 1.47;
	color: #fff;
	text-decoration: underline;
	margin: 0.65em 1.5em 0;
}


/* Start .goal-popup */
.goal-popup{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 200;
	background: linear-gradient(180deg, #094077 0%, #1E558C 61.98%, #30669B 100%);
}
.goal-popup .popup-content{
	display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  overflow: auto;
  text-align: center;
  padding: 4.3em 1em;
}
.goal-popup span.popup-close{
	position: absolute;
	left: 1em;
	top: 1em;
}
.goal-popup span.popup-close svg{
	width: 2.13em;
	height: 2.13em;
}
.goal-popup .popup-header{
	padding-bottom: 1em;
}
.goal-popup .popup-header h2{
	font-size: 4.66em;
	font-weight: 700;
	line-height: 1.07;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.12em;
}
.goal-popup .popup-header p{
	font-size: 2em;
	font-weight: 300;
	line-height: 1.13;
	color: #fff;
	margin-bottom: 0;
}
.goal-popup .popup-img{
	padding-bottom: 1em;
}
.goal-popup .popup-points{
	padding-bottom: 1em;
}
.goal-popup .popup-points.sm{
	font-size: 70%;
}
.goal-popup .popup-points h3{
	font-size: 2em;
	font-weight: 300;
	line-height: 1.13;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.2em;
}
.goal-popup .popup-points span{
	display: inline-block;
}
.goal-popup .popup-points span b{
	display: inline-block;
	font-size: 6em;
	font-weight: 700;
	line-height: 1;
	color: #fff;
}
.goal-popup .popup-points span:after{
	display: inline-block;
	vertical-align: baseline;
	content: '';
	width: 3.4em;
	height: 3.086em;
	background-image: url(../img/icon-shell3.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
.goal-popup button.popup-close{
	font-size: 1.66em;
	color: #fff;
	text-decoration: underline;
	border: 0;
	background-color: transparent;
}
.goal-popup button.popup-close:hover{
	text-decoration: none;
}
@media (max-width: 450px){
	.goal-popup{
		font-size: 3.33vw;
	}
}
/* End .goal-popup */


/* Start .level-popup */
.level-popup{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 200;
	background: linear-gradient(180deg, #094077 0%, #1E558C 61.98%, #30669B 100%);
}
.level-popup .popup-content{
	display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  overflow: auto;
  text-align: center;
  padding: 4.3em 1em;
}
.level-popup span.popup-close{
	position: absolute;
	left: 1em;
	top: 1em;
}
.level-popup span.popup-close svg{
	width: 2.13em;
	height: 2.13em;
}
.level-popup .popup-header{
	padding-bottom: 1.5em;
}
.level-popup .popup-header h2{
	font-size: 4.66em;
	font-weight: 700;
	line-height: 1.07;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.02em;
}
.level-popup .popup-header p{
	font-size: 2em;
	font-weight: 300;
	line-height: 1.13;
	color: #fff;
	margin-bottom: 0;
}
.level-popup .popup-step{
	padding-bottom: 1em;
}
.level-popup .popup-step .circle{
	display: inline-block;
	border: 0.27em solid #1CAF95;
	background: linear-gradient(180deg, #3EE9E9 0%, #20C9C9 37.5%, #1ABDBD 100%);
	text-align: center;
	height: 12.54em;
	width: 12.54em;
	line-height: 12em;
	border-radius: 50%;
}
.level-popup .popup-step .circle span{
	display: inline-block;
	font-size: 6.66em;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	vertical-align: middle;
}
.level-popup .popup-step .circle span.gift{
	background-image: url(../img/icon-gift.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	height: 50%;
	width: 50%;
}
.level-popup .popup-results{
	text-align: right;
	padding-bottom: 1.5em;
}
.level-popup .popup-results > div{
	background-color: #386796;
	border-radius: 0.66em;
	min-height: 7.33em;
	line-height: 7.33em;
	padding: 0 1.05em 0 7em;
	margin-bottom: 1em;
	position: relative;
}
.level-popup .popup-results > div:last-child{
	margin-bottom: 0;
}
.level-popup .popup-results > div p{
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
	font-size: 2em;
	color: #fff;
	margin-bottom: 0;
}
.level-popup .popup-results > div > span{
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 1.05em;
	line-height: 1;

	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.level-popup .popup-results > div > span b{
	display: inline-block;
	font-size: 3em;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	margin-left: 0.1em;
}
.level-popup .popup-results > div > span.points:after{
	display: inline-block;
	vertical-align: baseline;
	content: '';
	width: 1.474em;
	height: 1.3376em;
	background-image: url(../img/icon-shell2.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
.level-popup .popup-results > div > span.next-points:after{
	display: inline-block;
	vertical-align: baseline;
	content: '';
	width: 1.6em;
	height: 1.288em;
	background-image: url(../img/icon-shop-a.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
.level-popup .popup-results .circle{
	text-align: center;
	width: 5em;
	height: 5em;
	line-height: 4.46em;
	padding: 0.27em;
	border-radius: 50%;
	background-color: #396086;

	display: inline-block;
	position: absolute;
	top: 50%;
	left: 1.05em;

	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.level-popup .popup-results .circle span{
	display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #386796;
  color: #fff;
  font-size: 1.33em;
  font-weight: 300;
}
.level-popup .popup-results .circle span b{
	font-size: 1.5em;
  font-weight: 700;
}
.level-popup .popup-results .circle.percent-10{
	background-image: linear-gradient(126deg, transparent 50%, #396086 50%), linear-gradient(90deg, #396086 50%, #F6DD80 50%);
}
.level-popup .popup-results .circle.percent-20{
	background-image: linear-gradient(162deg, transparent 50%, #396086 50%), linear-gradient(90deg, #396086 50%, #F6DD80 50%);
}
.level-popup .popup-results .circle.percent-30{
	background-image: linear-gradient(198deg, transparent 50%, #396086 50%), linear-gradient(90deg, #396086 50%, #F6DD80 50%);
}
.level-popup .popup-results .circle.percent-40{
	background-image: linear-gradient(234deg, transparent 50%, #396086 50%), linear-gradient(90deg, #396086 50%, #F6DD80 50%);
}
.level-popup .popup-results .circle.percent-50{
	background: linear-gradient(270deg, #F6DD80 50%, transparent 50%), linear-gradient(-90deg, #F6DD80 50%, #396086 50%);
}
.level-popup .popup-results .circle.percent-60{
	background: linear-gradient(270deg, #F6DD80 50%, transparent 50%), linear-gradient(-54deg, #F6DD80 50%, #396086 50%);
}
.level-popup .popup-results .circle.percent-70{
	background: linear-gradient(270deg, #F6DD80 50%, transparent 50%), linear-gradient(-18deg, #F6DD80 50%, #396086 50%);
}
.level-popup .popup-results .circle.percent-80{
	background: linear-gradient(270deg, #F6DD80 50%, transparent 50%), linear-gradient(18deg, #F6DD80 50%, #396086 50%);
}
.level-popup .popup-results .circle.percent-90{
	background: linear-gradient(270deg, #F6DD80 50%, transparent 50%), linear-gradient(54deg, #F6DD80 50%, #396086 50%);
}
.level-popup .popup-results .circle.percent-100{
	background: #F6DD80;
}
.level-popup .popup-actions a{
	display: inline-block;
	height: 4em;
	line-height: 4em;
	background-color: #fff;
	border-radius: 0.66em;
	padding: 0 1.1em;
	float: left;
}
.level-popup .popup-actions a span{
	display: inline-block;
	vertical-align: middle;
	line-height: 1;
	font-size: 1.33em;
	color: #315678;
	font-weight: 500;
}
.level-popup .popup-actions button{
	height: 4em;
	padding: 0;
	background-color: transparent;
	border: 0;
	color: #fff;
	float: right;
	text-decoration: underline;
}
.level-popup .popup-actions button:hover{
	text-decoration: none;
}
.level-popup .popup-actions button span{
	font-size: 1.66em;
}
@media (max-width: 450px){
	.level-popup{
		font-size: 3.33vw;
	}
}
/* End .level-popup */


/* Start .page-settings */
body.page-template-template-settings{
	overflow: hidden;
}
.page-settings{
	background-color: #094077;
}
.page-settings .section-content{
	display: flex;
  flex-direction: column;
  justify-content: space-between;
	height: calc(100% - 4.66em);
	overflow: auto;
	min-height: 12em;
  padding: 3.7em 1em 4.3em;
}
.page-settings .section-content > div{
	width: 100%;
	max-width: 420px;
  margin: 0 auto;
}
.page-settings .section-header{
	text-align: center;
}
.page-settings .section-header h2{
	font-size: 2em;
	font-weight: 700;
	line-height: 1.16;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.75em;
}
.page-settings .section-header p{
	font-size: 1.34em;
	font-weight: 300;
	line-height: 1.13;
	color: #fff;
	margin-bottom: 0;
}
.page-settings .section-dots{
	text-align: center;
	padding: 2.6em 0 2.9em;
}
.page-settings .section-dots span{
	display: inline-block;
	height: 0.4em;
	width: 2em;
	background-color: #fff;
	border-radius: 0.2em;

	-webkit-transition: .3s all;
	-o-transition: .3s all;
	transition: .3s all;
}
.page-settings .section-dots span.active{
	width: 3.6em;
	background-color: #FEC021;
}
.page-settings .section-tabs{
	padding-bottom: 3.7em;
}
.page-settings .section-tabs .title{
	font-size: 2em;
	font-weight: 400;
	line-height: 1.13;
	color: #fff;
	margin-top: 0;
	margin-bottom: 0.6em;
}
.page-settings .section-tabs .tab{
	display: none;
}
.page-settings .section-tabs .tab.active{
	display: block;
}
.page-settings .section-tabs .tab label{
	display: block;
	margin-bottom: 2.9em;
	padding: 0;
}.page-settings .section-tabs .tab label:last-child{
	margin-bottom: 0;
}
.page-settings .section-tabs .tab label input{
	position: absolute;
	z-index: -100;
	opacity: 0;
}
.page-settings .section-tabs .tab label span{
	display: block;
	min-height: 5.35em;
	line-height: 4.85em;
	background-color: #fff;
	border-width: 0.15em 0.15em 0.35em 0.15em;
	border-color: #20C9C9;
	border-style: solid;
	border-radius: 0.66em;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto auto;
	color: #315678;
	padding-right: 5.9em;
	position: relative;
}
.page-settings .section-tabs .tab label input:checked + span {
	background-color: #BDEFEF;
}
.page-settings .section-tabs .tab label span b {
	display: inline-block;
	font-size: 1.33em;
	font-weight: 300;
	line-height: 1.3;
	vertical-align: middle;
}
.page-settings .section-tabs .tab label span:before{
	content: '';
	position: absolute;
	top: 50%;
	right: 1.5em;

	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
.page-settings .section-tabs .tab label .level:before{
	width: 3.26em;
	height: 3.4em;
	margin-top: -1.7em;
}
.page-settings .section-tabs .tab label:nth-of-type(1) .level:before{
	background-image: url(../img/icon-sett-1.png);
}
.page-settings .section-tabs .tab label:nth-of-type(2) .level:before{
	background-image: url(../img/icon-sett-2.png);
}
.page-settings .section-tabs .tab label:nth-of-type(3) .level:before{
	background-image: url(../img/icon-sett-3.png);
}
.page-settings .section-tabs .tab label .hours:before{
	width: 3.33em;
	height: 3.33em;
	margin-top: -1.66em;
}
.page-settings .section-tabs .tab label:nth-of-type(1) .hours:before{
	background-image: url(../img/icon-sett-4.png);
}
.page-settings .section-tabs .tab label:nth-of-type(2) .hours:before{
	background-image: url(../img/icon-sett-5.png);
}
.page-settings .section-tabs .tab label:nth-of-type(3) .hours:before{
	background-image: url(../img/icon-sett-6.png);
}
.page-settings #duration{
	margin: 0 auto;
}
.page-settings #duration .rs-full .rs-bar{
	left: 0;
}
.page-settings #duration .rs-border{
	border: 0;
	stroke-width: 0!important;
}
.page-settings #duration .rs-path{
	stroke: #0A3159;
}
.page-settings #duration .rs-range{
	stroke: #20C9C9;
}
.page-settings #duration .rs-tooltip-text{
	font-size: 1em;
}
.page-settings #duration .rs-tooltip-text h3{
	font-family: 'Heebo', sans-serif;
	font-size: 4em;
	font-weight: 700;
	color: #fff;
	line-height: 1;
	margin-top: 0;
	margin-bottom: 0.12em;
}
.page-settings #duration .rs-tooltip-text p{
	font-family: 'Heebo', sans-serif;
	font-size: 1.33em;
	font-weight: 300;
	color: #fff;
	margin-bottom: 0;
}
.page-settings #duration .rs-container:before{
	content: '';
	display: block;
	height: 52px;
	width: 52px;
	border-radius: 50%;
	background-color: #20C9C9;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../img/icon-play.png);

	position: absolute;
	top: 1px;
	left: 50%;
	margin-left: -26px;
	z-index: 2;
}
.page-settings #duration .rs-handle{
	background-color: #097DB9;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../img/icon-stop.png);
}
.page-settings #duration.rs-animation .rs-transition{
	transition: none!important;
}
.page-settings .popup-actions a{
	display: inline-block;
	height: 4em;
	line-height: 4em;
	background-color: #fff;
	border-radius: 0.66em;
	padding: 0 1.1em;
	float: left;
}
.page-settings .popup-actions a span{
	display: inline-block;
	vertical-align: middle;
	line-height: 1;
	font-size: 1.33em;
	color: #315678;
	font-weight: 500;
}
.page-settings .popup-actions button{
	height: 4em;
	padding: 0;
	background-color: transparent;
	border: 0;
	color: #fff;
	float: right;
	text-decoration: underline;
}
.page-settings .popup-actions button:hover{
	text-decoration: none;
}
.page-settings .popup-actions button span{
	font-size: 1.66em;
}
@media (max-width: 450px){
	.page-settings{
		font-size: 3.33vw;
	}
}

/* End .page-settings */


.otgs-development-site-front-end{
	display: none!important;
}