@keyframes show_container {
	from { opacity:0;}
	to {opacity: 1;}
}

BODY.ScrollOff{ position:fixed; overflow-y:scroll; width:100%; }


/*********** popup container **************/
.quize_popup_container{ display:block; opacity:0; position:fixed; top:0; left:0; width:100%;  height:100%; overflow:auto;
	z-index:11000; background-color:rgba(0, 0, 0, 0.8);
	display: -webkit-flex;	display: flex; 
	-webkit-justify-content: center; justify-content: center;
	-webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease;	
	padding: 15px;
	min-width: 340px; box-sizing: border-box;
	background-image: url(preloader.svg); background-repeat: no-repeat; background-position: center; background-size: 100px;
}
.quize_popup_container.is-show{	opacity:1 !important;}

/*********** popup window **************/
.quize_popup_window{ position:relative; box-sizing:border-box; -webkit-border-radius:4px; border-radius:4px;
	overflow:hidden; height: 100%;   z-index:100; opacity: 0;
	display: -webkit-flex;	-webkit-align-items:center;	-webkit-justify-content: center;
	display: flex;	align-items:center;	justify-content: center;
	-webkit-transition: all 0.5s ease; transition: all 0.5s ease;
}
.quize_popup_window.is-show{ opacity: 1}

.quize_popup_wrapper{ background:#fff; box-sizing:border-box; width:100%;  min-width:200px; min-height: 100px; overflow: hidden;
	-webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

.quize_popup_content{-webkit-transition: all 0.5s ease;transition: all 0.5s ease; position: relative;}

.quize_popup_container iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; visibility: hidden; z-index: -1}

.quize_popup_case{ box-sizing:border-box;  padding:30px; -webkit-transition: all 0.5s ease;transition: all 0.5s ease;}

.quize_popup_wrapper_close{ position:absolute; width:30px; height:30px; top:7px; right:7px; z-index:300; cursor:pointer;     border: 1px solid #eee; 	border-radius: 50%; background: #fff; }

.quize_popup_wrapper_close:after{content: '\2716';display: block;position: absolute;top: 0;left: 1px;width: 20px;height: 20px;line-height: 20px;font-size: 18px;color: #FF383B;cursor: pointer;z-index: 1;text-align: center;margin: auto;bottom: 1px;right: 0;}



@media only screen and (min-width: 768px) {

	.quize_popup_case{width: 680px}
 
}


.quize_popup_case{ max-width: 340px; }
.quize-body{ margin: auto; filter:blur(0px); opacity: 1;
	-webkit-transition: all 0.6s ease; transition: all 0.6s ease;	}
.quize-body.update{  filter:blur(20px); opacity: 0.5; }

.quize-actions{   }
.quize-actions .buttons{}
.quize-button{ display: inline-block; color: #2b4f9c; text-decoration: none;  line-height: 40px;
	font-size: 16px;     font-weight: 500; opacity: 0.7; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; width: 130px;
	-webkit-transition: font-size 0.1s ease; transition: font-size 0.1s ease; width: 130px;}
.quize-button.skip{ margin-right:0px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 0;   width: 0; font-size: 0;}
.quize-button.skip.allow{ margin-right: 20px; opacity: 1;font-size: 16px;   width: inherit; }
.quize-button.next{ padding: 0px 20px; border: 1px solid #2b4f9c; position: relative; padding-right: 30px; background-image: url(/images/preload-button.svg);
	background-position: center; background-size: 0; background-repeat: no-repeat;}
.quize-button.next svg{ display: block;     position: absolute;height: 14px;top: 0;bottom: 0;margin: auto; right: 15px;  stroke:#2b4f9c}
.quize-button.next svg polyline{ stroke:#2b4f9c}
.quize-button:hover{ opacity: 1;}
.quize-button.skip:hover{ text-decoration: underline}
.quize-button.next:hover{ background-color:#2b4f9c; color: #fff  }
.quize-button.next:hover svg polyline{ stroke:#ffffff}
.quize-button.next:hover svg polyline{ stroke:#ffffff}
.quize-button.next.in-process{ background-size: 150px; font-size: 0; }
.quize-button.next.in-process svg{ opacity: 0; }


.quize-progress{display: -webkit-flex;	display: flex; -webkit-align-items:center; align-items:center; width: 400px; max-width: 100%}
.quize-progress-title{ font-size: 18px; font-weight: 500; padding-right: 20px;}
.quize-steps{ position: relative; width: 300px;
	display: -webkit-flex;	display: flex; -webkit-align-items:center; align-items:center;  -webkit-flex: 1; flex: 1;}
.quize-step{ position: relative; height: 1px; background: #2b4f9c; -webkit-flex: 1; flex: 1; }
.quize-step:first-child{ width: 11px; max-width: 11px;  }
.quize-step:after{ display: block; content: ""; position: absolute; width: 7px; height: 7px; top:0; bottom: 0; right: 0; margin: auto; background: #2b4f9c; border-radius: 50%; z-index: 10}
.quize-step.active{background: #ff5656 }
.quize-step.active:after{width: 11px; height: 11px; background: #ff5656 }

.quize-body{ padding: 20px 0;  }
.quize-body .cols{display: -webkit-flex;	display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap }
.cols .col-12{width: 100%}
.cols .col-7 {width: 58.33%}
.cols .col-6 {width: 50%}
.cols .col-5 {width: 41.66%}
.cols .col-0 {width: 0}

.quize-title{ font-size:22px; color:#373F41; font-weight: 800; margin-bottom: 20px}
.quize-text{ font-size: 16px; color:#737B7D}
.quize-image{ width: 100%; height: 100%}
.quize-image img{ display: none;}

.quize-fields{ margin: 20px auto; max-width: 80% }

.quize-input-field{ margin-bottom: 10px}

.quize-field-title{ display: block; font-weight: 600; font-size: 13px; margin-bottom: 10px;  }
.quize-field-desc{ display: block; font-weight: 100; font-size: 12px; margin-bottom: 10px; opacity: 0.8  }
.quize-inputs-wrapper{    margin: 10px 0;}

.quize-input-item-wrapper{ width: 100%; margin-bottom: 15px; position: relative }
.quize-input-item-wrapper:last-child{   }


.quize-input-item{ padding: 13px; color:#2b4f9c; font-size: 16px;    font-weight: 500; height: 100%;
	border: 1px solid #8397CD;  transition: all 0.3s ease;	-webkit-transition: all 0.3s ease;
	cursor:pointer; border-radius: 6px; box-sizing: border-box}

.quize-input-item-title{ display: block; font-weight: 600  }
.quize-input-item-desc{ display: block; font-size: 13px; font-weight: 300; padding-top: 5px; }


.quize-input-item-placeholder{ position: absolute;top: 0;padding: 14px; font-weight:300; text-transform: none; opacity: 1; transition: all 0.3s ease;	-webkit-transition: all 0.3s ease; z-index: -1; }
.quize-input-item-placeholder.hide{ opacity: 0; font-size: 0 }

.quize-input-field.text-input{ -webkit-flex-direction: column; flex-direction: column;}
.quize-input-field.text-input .quize-text-item{ text-align: left; height: auto;  }
.quize-input-field.text-input .quize-input-item-desc{ padding: 0;}
.quize-input-field.text-input .quize-input-item-wrapper{ margin: 10px 0}

.quize-input-field.textarea-input .quize-input-item{ height: 100px; max-height: 200px; t}




/*.quize-input-item-wrapper:focus .quize-input-value-placeholder{ opacity: 0; font-size: 0}*/

.quize-input-field.checkbox-group  .quize-input-item-wrapper{ width: 100%; margin-bottom: 10px; }
.quize-checkbox-group-item{ text-align: left; padding-left: 36px; display: -webkit-flex;	display: flex; -webkit-align-items: center; align-items: center}
.quize-checkbox-group-item:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 10px;  margin: auto; width: 16px; height: 16px; border: 1px solid #8397CD; transition: all 0.3s ease;	-webkit-transition: all 0.3s ease;}
.quize-checkbox-group-item.quize-field-value:before{ background: #ff5656; border-color: #ff5656}

.quize-checkbox-item{ text-align: left; padding-left: 36px; display: -webkit-flex;	display: flex; -webkit-align-items: center; align-items: center}
.quize-checkbox-item:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 10px;  margin: auto; width: 16px; height: 16px; border: 1px solid #8397CD; transition: all 0.3s ease;	-webkit-transition: all 0.3s ease;}
.quize-checkbox-item.quize-field-value:before{ background: #ff5656; border-color: #ff5656}
.quize-checkbox-item .quize-field-title{ margin-bottom: 0px;  }


.quize-radio-item.quize-field-value{background-color: #ff5656; border-color: #ff5656; color: #fff }
.quize-checkbox-group-item.quize-field-value{  border-color: #ff5656;   }
.quize-checkbox-item.quize-field-value{  border-color: #ff5656;   }


.quize-text-item {}

.quize-field-error{ display: none}
.quize-field-error span{ display: block; padding: 0 5px; color:#ff5656; font-size: 14px; font-weight: 500; text-align: center }

.quize-input-field.competitors_websites{ margin-bottom: 10px;}

.quize-screen_web_step_2_1_5 .additional_pages{ margin-bottom: 20px}

.quize-input-field.products_count .quize-inputs-wrapper{ display: -webkit-flex;	display: flex;  -webkit-justify-content: space-between; justify-content: space-between;}
.quize-input-field.products_count .quize-input-item-wrapper{ width: calc(33.33% - 10px) }
.quize-input-field.products_count .quize-input-item { padding: 10px 5px; font-size: 14px;}

.quize-input-field.online_payment .quize-inputs-wrapper{ display: -webkit-flex;	display: flex;  -webkit-justify-content: space-between; justify-content: space-between;}
.quize-input-field.online_payment .quize-input-item-wrapper{ width: calc(50% - 10px) }
.quize-input-field.online_payment .quize-input-item { padding: 10px 5px; font-size: 14px;}

.quize-input-field.delivery_system .quize-inputs-wrapper{ display: -webkit-flex;	display: flex;  -webkit-justify-content: space-between; justify-content: space-between;}
.quize-input-field.delivery_system .quize-input-item-wrapper{ width: calc(50% - 10px) }
.quize-input-field.delivery_system .quize-input-item { padding: 10px 5px; font-size: 14px;}


.quize-hide-elem{ -webkit-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 0; height: 0; width: 0; overflow: hidden;}

.quize-result  {  max-width: 400px; margin: auto}
.quize-result * { text-align: center }
.quize-result h2 { font-size: 22px; font-weight: 500; margin-bottom: 40px}
.quize-result p { margin-bottom: 20px; font-size: 16px;}

@media only screen and (min-width: 768px) {
	.quize_popup_case{ max-width: 540px !important; }

	.quize-title{ margin-bottom: 30px}

	.quize-body .cols .col-100per{ width: 60%}
	.quize-body .cols .col-50per{ width: 40%}

	.cols .col-12-w768{width: 100%}
	.cols .col-7-w768 {width: 58.33%}
	.cols .col-6-w768 {width: 50%}
	.cols .col-5-w768 {width: 41.66%}

	.quize-image img{ display: block; width: auto; position: absolute; top: 0; bottom: 0; left: 20px; right: 0; margin: auto; max-width: 100%}

	.quize-inputs-wrapper{display: -webkit-flex;	display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between;}
	.quize-input-field.checkbox-group  .quize-input-item-wrapper{ width: calc(50% - 10px); margin-bottom: 15px; }

	.quize-field-title{ font-size: 15px;   }
	.quize-field-desc{ font-size: 13px;}


}

@media only screen and (min-width: 1100px) {
	.quize-title{  margin-bottom: 30px}

	.quize-body .cols .col-100per{ width: 50%}
	.quize-body .cols .col-50per{ width: 50%}

	.cols .col-12-w1100{width: 100%}
	.cols .col-7-w1100 {width: 58.33%}
	.cols .col-6-w1100 {width: 50%}
	.cols .col-5-w1100{width: 41.66%}

	.quize-input-item-title{ font-size: 18px;}
	.quize-screen_web_step_1  .quize-input-item-wrapper{ width: calc(50% - 10px) !important;}

	.quize-screen_web_step_2_1_5
}

@media only screen and (min-width: 1240px) {
	.quize_popup_case {
		max-width: 540px !important;
	}
}