/* Базовые элементы */

/* Сетка */
.flex-columns {position: relative; width:100%; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center;}
.flex-columns.top-align {align-items:stretch;}
.flex-columns.end-align {align-items:end;}

.flex-columns.content-left {justify-content: flex-start;}
.flex-columns.content-right {justify-content: flex-end;}
.flex-columns.content-center {justify-content: center;}
.flex-columns.content-between {justify-content: space-between;}
.flex-columns.content-around {justify-content: space-around;}

.col-1, .col-1x1 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}

.col-1x2, .col-2x4 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}

.col-1x3 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.3%; max-width: 33.3%;}
.col-2x3 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 66.66666%; flex: 0 0 66.6%; max-width: 66.6%;}

.col-1x4 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-3x4 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}

.col-1x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-2x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
.col-3x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%;}
.col-4x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%;}

.col-1x6 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 16.66666%; flex: 0 0 16.6%; max-width: 16.6%;}
.col-5x6 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.3%; max-width: 83.3%;}

.col-1x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 14.25%; flex: 0 0 14.25%; max-width: 14.25%;}
.col-2x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 28.5%; flex: 0 0 28.5%; max-width: 28.5%;}
.col-3x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 42.85%; flex: 0 0 42.85%; max-width: 42.85%;}
.col-4x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 57.15%; flex: 0 0 57.15%; max-width: 57.15%;}
.col-5x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 71.5%; flex: 0 0 71.5%; max-width: 71.5%;}
.col-6x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 85.75%; flex: 0 0 85.75%; max-width: 85.75%;}


.col-1x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%;}
.col-3x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%;}
.col-5x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%;}
.col-7x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%;}

.col-1x12 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%;}
.col-11x12 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 91.66666%; flex: 0 0 91.66666%; max-width: 91.66666%;}


/* Масштаб */
.zoom125 { zoom: 75%; }
.zoom200 { zoom: 50%; }


/* Окно квиза */

.white-popup-block { background: #fff; padding: 0; text-align: left; width:calc(80vw - 50px); height:calc(85vh - 50px) !important; max-width: unset !important; min-width:300px; margin:5vh auto !important; padding:25px !important; position: relative; -moz-border-radius: 15px !important; -webkit-border-radius: 15px !important; -khtml-border-radius: 15px !important;  border-radius: 15px !important; }
.mfp-close { width: 60px; height: 60px; line-height: 60px;}

.quizdata { position: relative; width:100%; height:100%; overflow:hidden; }

  .quizdata a {  -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; 	transition: all 0.5s ease; }


  .quizdata .quiz-top { height:110px; overflow: hidden; }

  .quizdata .quiz-title { position: relative; width:100%; padding-top:10px; padding-bottom:10px; }
  .quizdata .quiz-title h3 { position: relative; text-transform: unset; margin:0px;}
  .quizdata .quiz-title h5 { position: absolute; top:25px; right:0; padding:0; margin:0; color:#666; font-size:16px; font-weight:300;  text-transform: unset; }

  .quizdata .quiz-step-menu { position: relative; width:100%; padding:0; text-align:center; border-radius: 5px; }
    .quizdata .quiz-step-menu a { position: relative; display: block; width:100%; background-color: #cec9b3; color:#fff; z-index:5; border-radius:5px; overflow: hidden; }
      .quizdata .quiz-step-menu a.completed { cursor:pointer;  background-color: #6e6953;  }
      .quizdata .quiz-step-menu a.active { background-color: #2f8c27;  }
      .quizdata .quiz-step-menu a:after { content: ''; position: absolute; right:0; top:0; bottom:0; width:1px; background-color: #fff; z-index:6; }
    .quizdata .quiz-step-menu a label { position: absolute; left:0; top:0; display:inline-block; width:56px; height:56px; line-height:56px; color:#fff; font-size:32px; font-weight: bold;  background-color: rgba(0, 0, 0, 0.05); overflow: hidden; display: -moz-inline-stack; vertical-align: text-top; zoom: 1; }
    .quizdata .quiz-step-menu a span { position: relative; display:inline-block; margin-left:28px; line-height:56px;  font-size:18px; display: -moz-inline-stack; vertical-align: text-top; zoom: 1;}


.quizdata .quiz-steps { position: relative; height: calc(100% - 120px); overflow: hidden; }
  
   .quizdata .quiz-step { position: relative;  height:calc(100% - 5px); margin-top:5px;  }
     .quizdata .quiz-step .quiz-step-data { position: relative;  height:calc(100% - 75px); background-color: #f6f4eb; border-radius: 5px; }
       .quizdata .quiz-step .quiz-step-data h2 { position: relative;  line-height:50px; text-align:center; margin:0px;}
       .quizdata .quiz-step .quiz-step-data .flex-columns { height:calc(100% - 50px); width:calc(100% - 40px); padding:0 20px; }
         .quizdata .step-2 .quiz-step-data .flex-columns { height:unset ;  }

   .quizdata .quiz-step a.step-data-item { position: relative; cursor:pointer; display: inline-block; width:calc(95% - 44px); /* height:95%; */ height: calc(95% - 42px); padding:10px 20px; margin:0 2.5%; background-color: #fff; border:solid 2px #fff; border-radius:5px; overflow: hidden;  }
      .quizdata .quiz-step a.step-data-item.selected { border:solid 2px #2f8c27; }
      .quizdata .quiz-step a.step-data-item:hover { box-shadow: 0 0.25rem 0.5rem 0px  rgba(0,0,0,0.1) ;  }
      .quizdata .quiz-step .step-data-item .quiz-step-img { position: relative; display: inline-block; width: 95%; margin: 0 2.5%; height:0; padding-top:65%; overflow: hidden; } 
        .quizdata .quiz-step .step-data-item .quiz-step-img-wrap { width:100% }
        .quizdata .quiz-step .step-data-item .quiz-step-img img { position: absolute; max-height:100% !important; width:unset !important; height: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }
      .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name { position: relative; display: block; padding-top:5px; padding-bottom:10px; font-size:24px; color:#000; text-align:center;  }
      .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-name { position: relative; display: block; padding-top:15px; padding-bottom:15px; font-size:21px; color:#000; text-align:center;  }
        .quizdata .quiz-step .step-data-item .quiz-step-name span { display: block; margin:0; padding-top:2px;  font-size:18px; }
      .quizdata .quiz-step .step-data-item .quiz-step-desc { position: relative; display: block; font-size:13px; color:#999;  text-align:center;  }

      .quizdata .quiz-step .step2item { position: relative; margin:10px; padding:20px; background-color: rgba(255,255,255,0.45); border-radius: 5px; }
        .quizdata .quiz-step .step2item h4 { position: relative; margin:0; padding:0; padding-bottom:10px; font-size:16px; font-weight:600; }

        .quizdata .quiz-step .step2item .floors, .quizdata .quiz-step .step2item .addelements { margin-top:15px; min-height:55px; } 
          .quizdata .quiz-step .step2item .floors label, .quizdata .quiz-step .step2item .addelements label { position: relative; display: inline-block; margin-right:15px; font-size:18px }
          .quizdata .quiz-step .step2item .floors label span, .quizdata .quiz-step .step2item .addelements label span { position: relative; display: inline-block; margin:5px 0; margin-left:5px; color:#666;}
          .quizdata .quiz-step .step2item .floors label.checked span, .quizdata .quiz-step .step2item .addelements label.checked span { color:#000; }

        .quizdata .quiz-step .step2item .housearea { position:relative; width:350px; height:50px; margin:10px 0; border-radius:5px; overflow:hidden; }
          .quizdata .quiz-step .step2item .housearea .areaval { position:relative; width:calc(100% - 2px); height:48px; text-align:center; border:solid 1px #cec9b3; background-color:#fff;  z-index:5}
            .quizdata .quiz-step .step2item .housearea .areaval h5 { display:inline-block;  line-height:44px; font-size: 16px; font-weight: normal; padding: 0; margin: 0; }
            .quizdata .quiz-step .step2item .housearea .areaval h5 span { font-size:22px }
            .quizdata .quiz-step .step2item .housearea .areaval h5 sup { font-size: 11px;  margin-left: 2px; }
          .quizdata .quiz-step .step2item .housearea a { position:absolute; cursor:pointer; top:0; width:50px; height:50px; line-height:48px; color:#fff; font-size:32px; text-align:center; background-color:#cec9b3;  z-index:6}
            .quizdata .quiz-step .step2item .housearea a:hover { background-color:#2f8c27; }
            .quizdata .quiz-step .step2item .housearea a.minus { left:0; }
            .quizdata .quiz-step .step2item .housearea a.plus  { right:0; }


      .quizdata .quiz-step .quiz-step-nav  { position: relative;  height:50px; padding-top:25px;  text-align: center; }
        .quizdata .quiz-step .quiz-step-nav a { position: relative; cursor: pointer; display:inline-block; margin:0 10px; padding:0 30px; line-height:48px; border-radius:5px; color:#fff; font-size:14px; font-weight:600;  text-transform: uppercase; display: -moz-inline-stack; vertical-align: text-top; zoom: 1;  }
          .quizdata .quiz-step .quiz-step-nav a.prev-step { padding-left:45px; background-color: #999; opacity: 0.5;}
            .quizdata .quiz-step .quiz-step-nav a.prev-step:hover { opacity: 1;}
            .quizdata .quiz-step .quiz-step-nav a.prev-step:after { content: '\2190'; position: absolute; left:15px; display: inline-block; line-height: 48px; font-size:18px; }
          .quizdata .quiz-step .quiz-step-nav a.next-step { cursor:default; padding-right:45px; background-color: #999; opacity: 0.5; }
            .quizdata .quiz-step .quiz-step-nav a.next-step.active { cursor: pointer; background-color: red;  }
              .quizdata .quiz-step .quiz-step-nav a.next-step.active:hover { opacity: 1;  }
            .quizdata .quiz-step .quiz-step-nav a.next-step:after { content: '\2192'; position: absolute; right:15px; display: inline-block; line-height: 48px; font-size:18px; }

.quiz-result { position: relative; height:100%;  /* height: calc(100% - 20px); */  overflow: hidden; }
  .quiz-result .quiz-report { position: relative; padding:20px 30px; font-size:18px; color:#fff; text-align: left; padding-bottom: 120px; }
    .quiz-result .quiz-report h3 { padding-bottom:15px; color:#fff; }
    .quiz-result .quiz-report div { padding-bottom:7.5px;  }
    .quiz-result .quiz-report div span { font-weight:bold;  }
    .quiz-result .quiz-report h5 { font-size:17px; text-transform: uppercase; font-weight:normal; padding: 0; margin-top: 30px; margin-bottom: 10px;}
      .quiz-result .quiz-report h5 span { display: block; font-size:63px; font-weight:bold; text-transform: unset; }
      .quiz-result .quiz-report h5 span b { font-size:48px; }
    .quiz-result .quiz-report h6 { font-size:12px; font-weight:normal; opacity:0.75; padding:0; margin:0; }

  .quiz-result .quiz-report a.startover  { position:absolute; cursor:pointer; bottom:25px; left:30px; right:30px; line-height:58px; color: #fff; font-size: 14px; font-weight: 600; text-align:center;  text-transform: uppercase; border-radius:5px; border:solid 1px rgba(255,255,255,0.5); opacity:0.5; } 
    .quiz-result .quiz-report a.startover:hover  { opacity:1; } 


  .quiz-result .quiz-step-data { height:100% !important; width:99%; margin-left:1%; }
    .quiz-result .quiz-step-data .quiz-step-data-res { position: relative; padding:15px 30px;}
      
      .quiz-result .quiz-step-data .quiz-step-data-res h2 { position: relative; line-height:unset; font-size:18px; color:#2f8c27; }
        .quiz-result .quiz-step-data .quiz-step-data-res h2 span { display:block; font-size:42px; color:#000; }

        .quizdata  .quiz-step .quiz-result .quiz-step-data .flex-columns  { height:unset;  } 

        .quiz-step-data-res .quiz-res-gifts { margin: 10px; } 
          .quiz-step-data-res .quiz-res-gifts .gift-item { position: relative; padding:15px; margin:0 7.5px; text-align: center; background-color: rgba(255,255,255,0.85); border-radius: 5px;  } 
          .quiz-step-data-res .quiz-res-gifts .gift-item h5 { padding:0; margin:0; padding-bottom:10px; font-size:16px; font-weight:normal; } 
          .quiz-step-data-res .quiz-res-gifts .gift-item span { position:relative; display:inline-block; width:50%; margin:10px 0; } 
          .quiz-step-data-res .quiz-res-gifts .gift-item span a { position:relative; display:inline-block; width:100%; height:0; padding-top:100%;  }
            .quiz-step-data-res .quiz-res-gifts .gift-item span a.gift1 { background: url(/quiz/img/gift1.svg) center center no-repeat; background-size: auto 100%;  }
            .quiz-step-data-res .quiz-res-gifts .gift-item span a.gift2 { background: url(/quiz/img/gift2.svg) center center no-repeat; background-size: auto 100%;  }
            .quiz-step-data-res .quiz-res-gifts .gift-item span a.gift3 { background: url(/quiz/img/gift3.svg) center center no-repeat; background-size: auto 100%;  }
            .quiz-step-data-res .quiz-res-gifts .gift-item span a.gift4 { background: url(/quiz/img/gift4.svg) center center no-repeat; background-size: auto 100%;  }

        .quiz-step-data-res .quiz-res-form { position: relative; width:calc(100% - 50px); padding:20px 0; margin:0 25px; margin-top:25px; background-color: rgba(255,255,255, 0.45); border-radius: 5px;    }
        .quiz-step-data-res .quiz-res-form span { display: block; padding:3% 5px; text-align: left; }
          .quiz-step-data-res .quiz-res-form span input { display:inline-block; width:calc(95% - 2px); padding:2.5% 10px; font-size:20px;  background-color: rgba(255,255,255, 0.5);  border:solid 1px #cec9b3; border-radius:5px; }
          .quiz-step-data-res .quiz-res-form span a.quiz-order-button {  position: relative;  cursor: pointer; display: block; width:95%; line-height: 60px;  border-radius: 5px; color: #fff; font-size: 14px; font-weight: 600; text-align:center;  text-transform: uppercase; background-color: red; opacity: 0.5;;}
            .quiz-step-data-res .quiz-res-form span a.quiz-order-button:hover { opacity:1; }
          .quiz-step-data-res .quiz-res-form span.policy { font-size:13px; opacity:0.5; } 


        .request-result { padding:10px;  text-align: center; font-size:18px; }
          .request-result h3 { padding-bottom:10px; }
          .quiz-step-data-res .quiz-res-form .request-result span { display: block; padding:0; font-size: 14px; text-align:center;}
          .request-result h6 { padding:0; margin:0; padding-top:10px; font-size: 16px; font-weight: normal; }

        .quiz-loading { height:100%; }  
        .quiz-loading img { width:auto !important; height:auto !important;}  


.quiz-step-data-res input[type="text"]::-webkit-input-placeholder {color: #999; }
.quiz-step-data-res input[type="text"]::-moz-placeholder {color: #999; }

.quiz-step-data-res input[type="text"].errorinput::-webkit-input-placeholder { font-size:0.8rem; color: red; }
.quiz-step-data-res input[type="text"].errorinput::-moz-placeholder {font-size:0.8rem; color: red; }


.green-block { background-color: #6fac67; border-radius: 5px; overflow: hidden; }            
.hidden { display: none !important; }            



@media only screen and (max-width: 1440px) {

  .quiz-result .quiz-report h5 { font-size: 15px; }
  .quiz-result .quiz-report h5 span { font-size: 50px; }
  .quiz-result .quiz-report h5 span b { font-size: 40px; }

} 
 

@media only screen and (max-width: 1366px) {

  .quizdata { zoom: 88%; }
  .white-popup-block { height:calc(95vh - 50px) !important; margin:2.5vh auto !important;  }

  .quiz-step-data-res .quiz-res-form { margin-top:10px; }
  .quiz-result .quiz-step-data .quiz-step-data-res { padding: 5px 30px; }
  .quiz-step-data-res .quiz-res-gifts { margin-top:0; }
  .quiz-step-data-res .quiz-res-gifts .gift-item h5 { font-size:14px; }
  .quiz-result .quiz-step-data .quiz-step-data-res { padding: 10px 0; }

  .quizdata .quiz-step .step-data-item .quiz-step-img { padding-top:60%; } 


  .quiz-result .col-2x7 { -ms-flex: 0 0 32.5%; flex: 0 0 32.5%; max-width: 32.5%; }
  .quiz-result .col-5x7 { -ms-flex: 0 0 67.5%; flex: 0 0 67.5%; max-width: 67.5%; }

} 


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

  .quizdata { zoom: 85%; }

} 



@media only screen and (max-width: 1023px) {

  .quizdata { zoom: 100%; }

  .white-popup-block { width:calc(95vw - 50px); height:calc(95vh - 50px) !important; margin:2.5vh auto !important;  }
  .quizdata .quiz-title { padding-top:0; }
  .quizdata .quiz-title h3 { font-size:20px; }
  .quizdata .quiz-title h5 { position: relative;  top: unset; right:unset; font-size:14px; }
  .quizdata .quiz-step-menu a label { width:36px; font-size: 24px; }
  .quizdata .quiz-step-menu a span { font-size:16px;  }

  .quizdata .quiz-step .quiz-step-data .col-1x3 { -ms-flex: 0 0 100%; flex: 0 0 100%;  max-width: 100%; }
  .quizdata .quiz-step .quiz-step-data .col-1x4 { -ms-flex: 0 0 50%; flex: 0 0 50%;  max-width: 50%; }
  .quizdata .quiz-step .quiz-step-data .flex-columns { height:unset;  }
  .quizdata .quiz-step .col-1x3 a.step-data-item { position: relative; width:calc(95% - 10px); height:unset; padding:5px; margin-bottom:10px; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center; }
  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-img-wrap  { width:30% }
  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-data-wrap  { width:65%; margin-left:5%;  }
  .quizdata .quiz-step .quiz-step-data .flex-columns { width: calc(100% - 10px); padding: 0 5px; }
 
  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name span { display:inline-block; font-size:inherit; }

  .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-name { width:100%; text-align: center; }
  .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-desc { display:none }
  .quizdata .quiz-step .col-1x4  .step-data-item .quiz-step-img { padding-top:45%; } 


  .quizdata .quiz-step .step2item .housearea { width:unset; }

  .quiz-result .quiz-step-data .quiz-step-data-res h2 span { font-size:36px; }
  
  .quiz-step-data-res .quiz-res-form  { width: calc(100% - 10px); margin: 0 5px; }
  .quiz-step-data-res .quiz-res-form span.policy { font-size: 11px; opacity: 0.5; }
  .quiz-step-data-res .quiz-res-form span input { font-size:18px; }
  
  .quiz-step-data-res .quiz-res-gifts .gift-item { padding: 5px 15px; margin: 5px 7.5px; }
  .quiz-result .quiz-report { padding: 20px; zoom:0.85; } 



} 



@media only screen and (max-width: 820px) {

  .quiz-result .quiz-report { height: calc(100vh - 130px); }
  .quiz-result .quiz-report h5 span { font-size: 40px; }
  .quiz-result .quiz-report h5 span b { font-size: 32px; }
  

}


@media only screen and (max-width: 720px) {

  .quizdata .quiz-top { height: 100px; }
  .quizdata .quiz-step-menu { zoom:0.75; }

  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name { font-size: 20px; padding-bottom: 5px; }
  .quizdata .quiz-step .step2item .floors label, .quizdata .quiz-step .step2item .addelements label { font-size: 16px; }
  .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-name { font-size:18px; }

  .quiz-result .quiz-step-data { width:100%; margin-left:0; }

  .quiz-result .col-2x7, .quiz-result .col-5x7 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom:10px;  }
  .quiz-result .quiz-report { height: unset; position: relative; width:100%; /* display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center; */ }
  .quiz-result .quiz-report h3 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom:0; }
  .quiz-result .quiz-report h3 { font-size:22px; }
  .quiz-result .quiz-report div { -ms-flex: 0 0 47%; flex: 0 0 47%; max-width: 47%; margin-bottom:0px; font-size:14px; } 
  .quiz-result .quiz-report h5 { position:absolute; top:15px; right:20px; width:calc(45% - 20px);}
  .quiz-result .quiz-report h5 { margin:10px 0;}
  .quiz-result .quiz-report h6 { position:absolute; top:90px; right:50px; width:calc(45% - 50px);}
  .quiz-result .quiz-report h6 { font-size: 9px }
  .quiz-step-data-res .quiz-res-gifts  .col-1x4  { -ms-flex: 0 0 25% !important; flex: 0 0 25% !important; max-width: 25% !important; margin-bottom:0px;  } 
  .quiz-step-data-res .quiz-res-gifts .gift-item h5 { font-size: 11px; }

  .quiz-result .quiz-report h5 { font-size: 10px; }
  .quiz-result .quiz-report a.startover { bottom: 20px; left: unset; right: 70px; line-height: 42px; padding: 0 32px; }  

}


@media only screen and (max-width: 640px) {


  .quizdata .quiz-title h5 { font-size:12px; }

  .step-2 .quiz-step-data .col-2x4 { -ms-flex: 0 0 100%;  flex: 0 0 100%; max-width: 100%; }
  .quizdata .quiz-step .step2item {  position: relative; margin: 10px;  padding: 10px; }
  .quiz-result .quiz-report a.startover { padding: 0 10px; }

  .quiz-step-data-res .quiz-res-gifts .col-1x4 { -ms-flex: 0 0 50% !important;  flex: 0 0 50% !important; max-width: 50% !important; }
  .quiz-step-data-res .quiz-res-gifts .gift-item { display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center; padding:2px 10px;  }
  .quiz-step-data-res .quiz-res-gifts .gift-item span { width:25%; }
  .quiz-step-data-res .quiz-res-gifts .gift-item h5 { width:70%; margin-left:5% ; padding-bottom: 0; }
  .quiz-step-data-res .quiz-res-form span.policy { font-size: 10px; }


}  



@media only screen and (max-width: 560px) {

  .quizdata .quiz-step-menu { zoom:0.65; }
  .white-popup-block { width: calc(98vw - 30px); height: calc(98vh - 50px) !important;  margin: 1vh auto !important;  padding: 15px !important; }

  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name { font-size: 18px; }
  .quizdata .quiz-step .step-data-item .quiz-step-desc { font-size: 12px;}

  .quizdata .quiz-step .quiz-step-data .col-1x4 { -ms-flex: 0 0 100%; flex: 0 0 100%;  max-width: 100%; }
  .quizdata .quiz-step .col-1x4 a.step-data-item { position: relative; width:calc(95% - 10px); height:unset; padding:5px; margin-bottom:10px; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center; }
  .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-img-wrap  { width:30% }
  .quizdata .quiz-step .col-1x4 .step-data-item .quiz-step-data-wrap  { width:65%; margin-left:5%;  }
  .quizdata .quiz-step .col-1x4  .step-data-item .quiz-step-img { padding-top:55%; } 

  .quizdata .quiz-steps { overflow:auto; }
  .quizdata .quiz-step { height:unset; }

}  



@media only screen and (max-width: 480px) {

  .quizdata .quiz-step-menu { zoom:0.6; }

  .quizdata .quiz-step .step-data-item .quiz-step-img, .quizdata .quiz-step .col-1x4  .step-data-item .quiz-step-img { padding-top: 70%; }
  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name { font-size: 17px; }

  .quizdata .quiz-step .quiz-step-nav a { margin: 0 5px; font-size:13px; }
  .quizdata .quiz-step .quiz-step-nav a.prev-step:after, .quizdata .quiz-step .quiz-step-nav a.next-step:after { line-height: 45px; } 
  .quizdata .quiz-step .col-1x3 a.step-data-item { padding: 12px 5px; }

  .quiz-result .quiz-report h5 { right:40px; font-size: 9px; }
  .quiz-result .quiz-report h5 span { font-size: 32px; }
  .quiz-result .quiz-report h5 span b { font-size: 26px; }
  .quiz-result .quiz-report h6 { width: calc(49% - 50px); }

  .quiz-result .quiz-step-data .quiz-step-data-res h2 span { font-size: 28px; }
  .quiz-result .quiz-step-data .quiz-step-data-res h2 { font-size: 14px; }

  .quiz-res-form .flex-columns:first-child .col-2x4 { -ms-flex: 0 0 100%; flex: 0 0 100%;  max-width: 100%; }
  .quiz-step-data-res .quiz-res-form span { padding:7px; }

  .quiz-step-data-res .quiz-res-form span a { font-size:12px; }
  .quiz-step-data-res .quiz-res-gifts { margin: 10px 5px; }


}    

@media only screen and (max-width: 420px) {
  
  .quizdata .quiz-title h5 { display:none; }

  .quiz-step-data-res .quiz-res-gifts { margin: 0 5px; }
  .quiz-step-data-res .quiz-res-form { padding:10px 0; background-color:unset; }


}

@media only screen and (max-width: 420px) {

  .quizdata .quiz-top { height: 80px; }

  .quizdata .quiz-step .col-1x3 .step-data-item .quiz-step-name { font-size: 16px; }
  .quizdata .quiz-step .step2item .floors label, .quizdata .quiz-step .step2item .addelements label { font-size: 15px; }
  .quizdata .quiz-step .quiz-step-nav a { padding: 0 25px; }

  .quiz-result .quiz-report a.startover { font-size:12px; right:60; line-height: 32px; }
  .quiz-result .quiz-report div { font-size:13px; }

  .quiz-result .quiz-step-data .quiz-step-data-res h2 { font-size: 13px; }
  .quiz-result .quiz-step-data .quiz-step-data-res h2 span { font-size: 24px;  }


}    


@media only screen and (max-width: 390px) {



}    


.quizdata .quiz-step .quiz-step-data h2{
	    font-size: 18px;
}