.quize{margin-bottom: 50px}
.quize-body{ transition: all 0.3s ease; opacity: 1}
.quize-body.update-in-process{ opacity: 0}
.quize-body-header{ display: flex; justify-content: space-between;  color: #fff; background: #514F4E; padding: 10px; text-transform: uppercase; letter-spacing: 0.5px; font-size: 13px; border-radius: 5px 5px 0 0; margin-bottom: 10px;}
.quize .title-wrapper { margin-bottom: 30px;}

.quize-footer{border: 1px solid #514F4E; border-radius: 0 0 5px 5px; text-align: center;  margin-top: 10px; }

.quize .title-wrapper h2{    font-weight: 300; font-size: 22px;text-align: center;margin-bottom: 10px;}
.quize .title-wrapper p{ text-align: center}

.quize-button.next{display: inline-block;height: 100%;padding: 10px 20px;}

.quize-inputs-wrapper{ display: flex; flex-wrap: wrap; margin: 0 -1px }

.quize-input-item-wrapper .quize-input-item{ height: 100%; box-sizing: border-box}

.quize-radio-item{ cursor: pointer}
.quize-radio-item.quize-field-value:after{ display: block; position: absolute; bottom: 5px; left: 5px; width: 12px; height: 12px; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxOCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNTkgMTAuNThMMS40MiA2LjQxTDAgNy44Mkw1LjU5IDEzLjQxTDE3LjU5IDEuNDFMMTYuMTggMEw1LjU5IDEwLjU4WiIgZmlsbD0iIzYxQkM2QSIvPgo8L3N2Zz4K); background-repeat: no-repeat; background-position: center; background-size: contain; content: ''}

.kitchen_form .quize-input-item-wrapper{ width: 33.33%; box-sizing: border-box; padding: .5px}
.kitchen_form .quize-input-item-wrapper .quize-input-item{    border: 1px solid #ebeae9;}

.quize-input-item-wrapper .quize-input-item.quize-field-value{ border: 2px solid #514F4E}


.quize-input-title{ font-size: 13px;  text-align: center; text-transform: uppercase; padding-top: 15px;}
.quize-input-image{ width: 80px; height: 80px;  display: block; margin: 10px auto;   box-sizing: border-box;border-radius: 4px; margin-bottom: 5px; margin-bottom: 20px}

.quize-field-value{ border: 2px solid #000;}

.quize-field-error span{ display: block; padding: 10px; text-align: center; color: #e55252}

.quize-screen_step2{border: 1px solid #c7c7c7; padding: 20px; }
.quize-screen_step2 .quize-fields{max-width: 1100px;margin: auto;}
.quize-screen_step2 .quize-input-field{ padding-right: 100px}
.quize-screen_step2 .quize-field-image{position: absolute;top: 0;right: 0;}
.quize-screen_step2 .quize-field-image img{ width: 70px;}
.quize-screen_step2 .quize-input-item-wrapper{ padding: 0; width:100%; padding-top: 10px;}
.quize-screen_step2 .quize-input-item-wrapper .quize-input-item{ width:180px; height: 34px;display: block;padding: 0 10px; line-height: 30px;border-radius: 4px;}


.quize-screen_step3 .quize-input-item-wrapper{ padding: .5px; width: 33.33%; box-sizing: border-box }
.quize-screen_step3 .quize-input-item{border: 1px solid #ebeae9;}
.quize-screen_step3 .quize-input-item.quize-field-value{ border: 2px solid #514F4E}

.quize-screen_step4 .quize-input-item-wrapper{ padding: .5px; width: 33.33%; box-sizing: border-box }
.quize-screen_step4 .quize-input-item{border: 1px solid #ebeae9;}
.quize-screen_step4 .quize-input-item.quize-field-value{ border: 2px solid #514F4E}

.quize-screen_contacts{max-width: 800px;  margin: auto;  text-align: center;}
.quize-screen_contacts .quize-input-field{  max-width: 300px;    text-align: left; margin: 10px auto; margin-bottom: 20px;}
.quize-screen_contacts  .quize-field-value{ padding: 10px 15px;  border-radius: 4px; border: 1px solid #c7c7c7;}
.quize-screen_contacts  .quize-field-error{ font-size: 14px; line-height: 16px;}

.contact-screen{max-width: 660px;margin: auto;border: 1px solid #eee;border-radius: 6px; padding-bottom: 20px;}
.contact-screen .screen-title-title{ padding: 20px}
.contact-screen .quize-field-title{ font-size: 14px; margin-bottom: 3px;}
.quize-button-send-wrap{ margin: 20px 0}
.quize-button-send{display: block;padding: 10px;margin: auto;width: 280px;background: #514f4e;border-radius: 4px;text-align: center;color: #fff;}

.quize-hide-elem{ display: none}

.result-message{ padding: 20px; text-align: center}
.result-message-title{   margin: 20px 0; font-size: 22px;}

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

    .quize h2 { font-size: 24px;text-align: center;}

    .quize-radio-item.quize-field-value:after{  bottom: 15px; left: 15px; width: 15px; height: 15px;}
    .quize-input-image{ width: 120px; height: 120px;}

    }

@media only screen and (min-width: 1024px) {
    .quize{margin-bottom: 120px}
    .kitchen_form .quize-input-item-wrapper{ width:20%;}

    .quize-screen_step2 .quize-field-image img{ width: 100px;}
    .quize-screen_step2 .quize-input-item-wrapper input{ width:240px;}
    .quize-screen_step2 .quize-input-item-wrapper{ padding-top: 20px; width: auto; }
    .quize-screen_step2 .quize-field-title{ padding-top: 10px}

    .quize-screen_step3 .quize-input-item-wrapper{  width: 16.66%; box-sizing: border-box }
    .quize-screen_step3 .quize-input-item{border: 1px solid #c7c7c7;}
    .quize-screen_step3 .quize-input-item.quize-field-value{ border: 2px solid #514F4E}

    .quize-screen_step4 .quize-input-item-wrapper{  width: 16.66%; box-sizing: border-box }
    .quize-screen_step4 .quize-input-item{border: 1px solid #c7c7c7;}
    .quize-screen_step4 .quize-input-item.quize-field-value{ border: 2px solid #514F4E}
}

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

    .quize-input-image{ width: 120px; height: 120px; display: block; margin: 10px auto}

}


