*{
	padding:0;
	margin:0;
	border:0;
	outline:none;
	box-sizing:border-box;
}

body{
	font-family:'Montserrat', sans-serif;
	font-weight:400;
	font-size:15px;
	line-height:24px;
}

h1,h2,h3,h4,h5{
	font-family:'Montserrat', sans-serif;
	font-weight:700;
	font-size:20px;
}

h1{
	font-size: 28px;

line-height: 1.2;

margin-bottom: 20px;font-weight: 400;
}

h2{
	font-size:27px;
	padding-right: 200px;
	margin-bottom:15px;font-weight: 400;
}
.vbr {

    display: flex;
    align-items: center;
    font-size: 11px;
    width: 216px;
    background: #fdfae1;
    border: 1px solid #ffe61b;
    text-align: center;
    justify-content: space-evenly;
    margin-bottom: 15px;

}

.thanks .step .vbr{
	font-size:13px;
}
.mdi-icon.mdi-16px {

    width: 16px;
    fill: #ffe61b;
    margin-top: 8px;

}
.thanks .step[data-step="1"] {

    display: flex;
    flex-direction: column;
    align-items: center;

}
h3{
	font-weight: 400;

font-size: 18px;

color: #a2a2a2;

margin-bottom: 20px;
}

p{
	margin:10px 0;
}

.container{
	width:100%;
	max-width:1240px;
	padding:0 20px;
	margin:0 auto;
}

a {

    color: #f6394a;
    text-decoration: none;

}
div.phone{
	
    color: #000;
	font-size:20px;
	line-height:1.3;
	padding-bottom:20px;
}

div.phone a{
	font-size: 16px;
	color:blue;
}

div.phone span{
	font-size:16px;
}
a:hover{
	text-decoration:none;
}

.start-page__button {

    white-space: normal;
    min-height: 55px;
    border-radius: 40px;

}
.percent{
	position: absolute;
    right: 0;
    bottom: 20px;
}

.percent span{
	
color:#f6394a;
}
.btn{
	
	font-family:'Montserrat';
	text-decoration:none;
position: relative;
color: #000;
overflow: hidden;
cursor:pointer;
background-color:#e8e8e8;
    font-size: 15px !important;
	padding: 18px 21px;
    min-height: 43px;
    height: auto;
    border-radius: 30px;
    border: none;
        border-top-color: currentcolor;
        border-right-color: currentcolor;
        border-bottom-color: currentcolor;
        border-left-color: currentcolor;
    line-height: 1.3rem;
    justify-content: space-between;
    align-items: center;
max-width: 293px;
float: left;
    margin-top: 16px;
    margin-right: 7px;
}
.button {
	font-family:'Montserrat';
	text-decoration:none;
position: relative;
color: #fff;
overflow: hidden;
cursor:pointer;
background-color:#f6394a;
    font-size: 15px !important;
    padding: 17px 30px;
    min-height: 43px;
    height: auto;
    border-radius: 30px;
    border: none;
        border-top-color: currentcolor;
        border-right-color: currentcolor;
        border-bottom-color: currentcolor;
        border-left-color: currentcolor;
    line-height: 1.3rem;
	display: flex;
    justify-content: space-between;
    align-items: center;
max-width: 293px;
}
.final-discount_v2 {

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    white-space: nowrap;margin-bottom: 15px;

}
.final-discount_v2__title, .final-discount_v2__value {

    font-style: normal;
    font-stretch: normal;
    letter-spacing: normal;
    text-align: left;
    color: #222;
    border: 1px solid #f7cd47;

}
.final-discount_v2__title {

    font-size: 14px;
    font-weight: 500;
    line-height: 2;
    border-radius: 4px;
    background-color: #faf1d6;
    padding: 0 18px 0 11px;

}
.final-discount_v2__value {

    position: relative;
    margin-left: -10px;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.71;
    -webkit-box-shadow: 0 3px 8px 0 rgba(247,205,71,.48);
    box-shadow: 0 3px 8px 0 rgba(247,205,71,.48);
    background-color: #f7cd47;
    padding-top: 1px;
    padding-left: 10px;
    padding-right: 15px;

}
.final-discount_v2__title, .final-discount_v2__value {

    font-style: normal;
    font-stretch: normal;
    letter-spacing: normal;
    text-align: left;
    color: #222;
    border: 1px solid #f7cd47;

}
.final-discount_v2__value::before {

    content: "";
    position: absolute;
    top: -1px;
    right: -14px;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 13px solid #f7cd47;
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;

}
.final-discount_v2__value::after {

    content: "";
    position: absolute;
    top: 9px;
    right: 0;
    display: block;
    width: 7px;
    height: 7px;
    border: 1.5px solid #c39c23;
    border-radius: 50%;
    background-color: #fff;

}
.button:hover{
background-color: #ff2236;;
}
.btn:hover{
	opacity:0.9;
}
.right div:not(.phone) {

    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

}
.logo {

    max-width: 250px;

}

.right div p {

    margin-top: 0;font-weight: 400;
    font-size: 14px;
    margin-bottom: 13px;

}
.button .icon{
	margin-right:3px;
	-webkit-box-align: center;

-ms-flex-align: center;

align-items: center;

display: -webkit-inline-box;

display: -ms-inline-flexbox;

display: inline-flex;

-webkit-box-pack: center;

-ms-flex-pack: center;

justify-content: center;
}
.button .icon svg {

    width: 18px;
    height: 18px;
	fill:#fff;

}

@-webkit-keyframes blick {
 50%,
 to {
  left:110%
 }
}
@keyframes blick {
 50%,
 to {
  left:110%
 }
}
.button.is-blicked::after {

    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    background: -webkit-gradient(linear,left top,right top,color-stop(10%,hsla(0,0%,100%,.1)),color-stop(20%,hsla(0,0%,100%,.2)),to(hsla(0,0%,100%,.6)));
    background: linear-gradient(90deg,hsla(0,0%,100%,.1) 10%,hsla(0,0%,100%,.2) 20%,hsla(0,0%,100%,.6));
    width: 20px;
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
    left: -20%;
   /* -webkit-transition: all 4s ease;
    transition: all 4s ease;*/
    -webkit-animation-name: blick;
    animation-name: blick;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
[name="name"]{
	background-image:url(img/name.svg);
	background-repeat:no-repeat;
	background-position:14px 12px;
}
[name="y-phone"]{
	background-image:url(img/phone.svg);
	background-repeat:no-repeat;
	background-position:14px 12px;
}

label[for="step7-1"] {

    border: 0;
    display: block;
    background: none !important;
    padding-left: 5px;

}
label[for="step7-1"]  input + span::before {

    left: 0;
}
label[for="step7-1"] input:checked + span::after {

    left: 2px;
}

body, html{
	min-height:100%;
	min-height:100vh;
}

.main{
	display:flex;
	min-height:100%;
	min-height:100vh;
	width:100%;
}

.main .left{
	flex:0 0 60%;
	background-image:url(img/bg.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position: 5% 50%;
	display: flex;
    align-items: center;
    justify-content: center;
}

label input + span::before {

    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    display: block;
    top: 16px;
    left: 11px;
    border: 2px solid #ddd;
    box-sizing: border-box;

}
input[type="text"]{
    box-sizing: border-box;
font-family:	inherit;
font-size:16px;
padding: 12px 20px 12px 40px;
    border: 1px solid #ddd;
    color: #000;
    flex: 0 0 48%;
    margin-bottom: 10px;
}
.progress-bar__field {

    height: 6px;
    position: relative;
    background: var(--color-bg-8,#dbdbdb);
    border-radius: 25px;
    -webkit-box-shadow: inset 0 -1px 1px var(--color-bg-2,hsla(0,0%,100%,.3));
    box-shadow: inset 0 -1px 1px var(--color-bg-2,hsla(0,0%,100%,.3));

}
.thanks{
	text-align:center;
}

.thanks h2{
	padding-right:0;
	font-weight:700;
}
.thanks h3{
	color:#000;
}
.right div:not(.phone):last-child {
    flex: 0;
}
.progress-bar__field span {

    display: block;
    height: 100%;
    border-radius: 20px;
	background: #f6394a;
    -webkit-box-shadow: inset 0 2px 9px hsla(0,0%,100%,.3),inset 0 -2px 6px rgba(0,0,0,.4),.6px 1.9px 7px 0 var(--color-alpha);
    box-shadow: inset 0 2px 9px hsla(0,0%,100%,.3),inset 0 -2px 6px rgba(0,0,0,.4),.6px 1.9px 7px 0 var(--color-alpha);
    position: relative;
    overflow: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}

label input:checked + span::after {

   content: '';

position: absolute;
width:16px;
height: 16px;

display: block;
top: 15px;

left: 13px;

background: url(img/check.svg);

box-sizing: border-box;

}

.main .left img{
	max-width:100%;
	height:auto;
}

.main .right{
	flex:0 0 40%;
	background:#fff;
	padding:40px;
	display: flex;

flex-direction: column;

align-items: flex-start;

justify-content: center;
}

.quiz{
	background:#fff;
	width:100%;
	max-width:850px;
	margin:0 auto;
	padding:30px;
}

.quiz-body{
	background:#eee;
	display:flex;
	align-items:center;
	justify-content:center;
}

.step [type="checkbox"]{
	opacity:0;
	z-index:-9;
}

label {position: relative;
display: inline-block;
    padding: 12px 20px;
    border: 1px solid #ddd;
	color: #000;
    flex: 0 0 48%;
    margin-bottom: 10px;

}

label:hover{
	background:#eee;
	cursor:pointer;
}

button.button{
	margin-top:15px;
	display: flex;
}
button.button svg {
    width: 16px;
    margin-left: 8px;
	margin-top: 3px;
}
.is-back {

    width: 16px;
    transform: rotate(180deg);
    margin-top: 2px;

}
.answers {

    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;

}

.step{
	display:none;
	position:relative;
}.bonus-wr {
display: flex;
    position: absolute;
    top: -30px;
    right: -30px;background: #ffe61b;

color: #000;
    padding: 10px;
    font-size: 15px;

}
.step[data-step="1"]{
	display:block;
}

.discount__arrows {

    position: relative;
    top: -15px;
    left: 2px;

}
.arrow path{
	
	fill:#f6394a;
}
.arrow {
    width: 14px;
    height: 10px;
    -webkit-animation-name: move-arrow;
    animation-name: move-arrow;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;

}

@-webkit-keyframes move-arrow {
 0% {
  -webkit-transform:translate(0);
  transform:translate(0)
 }
 50% {
  -webkit-transform:translateY(60%);
  transform:translateY(60%)
 }
 to {
  -webkit-transform:translate(0);
  transform:translate(0)
 }
}
@keyframes move-arrow {
 0% {
  -webkit-transform:translate(0);
  transform:translate(0)
 }
 50% {
  -webkit-transform:translateY(60%);
  transform:translateY(60%)
 }
 to {
  -webkit-transform:translate(0);
  transform:translate(0)
 }
}
@media (max-width:950px){
	.main .right {
		padding: 20px;
	}
	h1 {
		font-size: 24px;
	}
	h3 {
		font-size: 16px;
	}
	a.button {
		padding: 12px 12px;
	}
}

@media (max-width:900px){
	
}

@media (max-width:767px){
	div.phone {

    margin-top: 20px;

}
	.main{
		flex-wrap:wrap;
	}
	.main .right{
		flex:0 0 100%;
		padding:40px 30px;
	}
	
	.main .left{
		flex:0 0 100%;
		padding:15px;
		min-height:auto;
		max-height:400px
	}
	.logo {

		max-width: 250px;
		margin-bottom: 20px;

	}
}

@media (max-width:640px){
	label, input[type="text"] {
		flex: 0 0 100%;

	}
	h2 {

		font-size: 25px;
		margin-bottom: 30px;
		padding-right: 0;
		padding-top: 35px;

	}
}

@media (max-width:380px){
	
.percent{
	display:none;
}
.quiz {

    padding: 30px 10px;

}
.bonus-wr{
	right:-10px;
}
}