@charset "UTF-8";
.layout {
  min-height: 100vh;
  padding-top: 100px;
  padding-bottom: 120px;
}

.calc-bg-1 {
  background: url("/img/calc/calc-bg-1.jpg") center 0 no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

.calc-bg-2 {
  background: url("/img/calc/calc-bg-2.jpg") center 0 no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

.calc-bg-3 {
  background: url("/img/calc/calc-bg-3.jpg") center 0 no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

.calc-bg-4 {
  background: url("/img/calc/calc-bg-4.jpg") center 0 no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
.calc-bg-4 .calc-title {
  color: #fff;
}

.calc-title {
  text-align: center;
  font-size: 20px;
  font-family: "Geometria", sans-serif;
  line-height: 30px;
  color: #425254;
  margin-bottom: 50px;



}

.calc-title span {
  display: block;
  font-weight: bold;
  font-size: 37px;
  margin-bottom: 20px;


text-align: center;
    font-size: 40px;
    font-weight: bold;
    // color: #464451;
    color: #1A3F40;
   // margin: 0;
    font-family: 'Geometria-Bold';
    letter-spacing: -3px;

}

.calc-wrap {
  background-color: #fff;
  box-shadow: 0 5px 70px rgba(175, 184, 185, 0.75);
	border-radius: 15px;
	padding: 20px 20px;
}

.calc-nav {
  position: static !important;
	visibility: hidden;
}
.calc-nav li {
  flex: 0 0 24%;
  max-width: 24%;
  display: block;
  margin: 0;
}
.calc-nav li:first-child {
  flex-grow: 1;
  flex: 0 0 28%;
  max-width: 28%;
}
.calc-nav li a {
  background-color: #f0f4f5;
  color: #8dc63f;
  text-align: center;
}
.calc-nav li a.active {
  //border-top-color: transparent;
}

.calc-progress {
  margin-bottom: 80px;
}

.calc-progress-nav {
  display: flex;
  justify-content: space-between;
  padding: 0;
  margin: 0;
  counter-reset: point;
}
.calc-progress-nav li {
  display: inline-block;
  font-size: 12px;
  position: relative;
  padding-left: 42px;
  padding-right: 10px;
  height: 36px;
  line-height: 24px;
  padding-bottom: 12px;
}
.calc-progress-nav li span {
  display: inline-block;
  white-space: nowrap;
}
.calc-progress-nav li.is-active {
  color: #3c484a;
}
.calc-progress-nav li.is-active:before {
  background-color: #8cc63f;
}
.calc-progress-nav li.is-active:after {
  border-color: #8cc63f;
  background-color: #8cc63f;
  color: #fff;
}
.calc-progress-nav li.is-finished:after {
  content: "";
  background-color: #fff;
  border-color: #adafb1;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAKCAYAAABv7tTEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkFENEUwNTQzMzE4NTExRUJBRjExOURENjk5QjdEMkYzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkFENEUwNTQ0MzE4NTExRUJBRjExOURENjk5QjdEMkYzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QUQ0RTA1NDEzMTg1MTFFQkFGMTE5REQ2OTlCN0QyRjMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QUQ0RTA1NDIzMTg1MTFFQkFGMTE5REQ2OTlCN0QyRjMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz72tOKjAAAAuUlEQVR42mI8feYsA5HACohPAvFfJiI1+ADxfiBeC8QsxGiyA+KVQMwGxI+B+A+yJmwGGALxJiDmAuKlQJyHrNAbiI8AsRCSBlUg3gnE/FCN8UD8H6aJBYj7gdgSiPcAsQgQywDxPiAWhdIRoACAmQbS8AeIXaEeNYQqYoNqPAXEQUD8HdnNLFD6IRDbQzXoQsWuQUPtI7pHkT0PChkHIL4JNcQdiF9jC04WNP5TqEZuIH6CKw4AAgwA5a4jKdoBRZ8AAAAASUVORK5CYII=") center center no-repeat;
}
.calc-progress-nav li:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 5px;
  background-color: #dce1e2;
}
.calc-progress-nav li:after {
  content: counter(point);
  counter-increment: point 1;
  position: absolute;
  left: 0px;
  top: 0;
  width: 24px;
  height: 25px;
  border: 1px solid #adafb1;
  color: #adafb1;
  border-radius: 50%;
  line-height: 23px;
  text-align: center;
  font-weight: bold;
}
.calc-progress-nav li:not(:first-child) {
  padding-left: 70px;
}
.calc-progress-nav li:not(:first-child) .arrow {
  position: absolute;
  left: 10px;
  top: 0;
}
.calc-progress-nav li:not(:first-child):after {
  left: 35px;
}

.calc-row {
  display: flex;
  justify-content: space-between;
}
.calc-row .col {
  flex-grow: 1;
  max-width: 100%;
  flex-basis: 0;
  width: 100%;
}

.choose-unit {
  position: relative;
}
.choose-unit input[type=radio] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
}
.choose-unit input[type=radio]:checked + label {
  background-color: #f6f9fa;
}
.choose-unit label {
  display: block;
  cursor: pointer;
  margin: 0;
}
.choose-unit.js-selected {
  background-color: #f6f9fa;
	border: solid 4px #8cc63f;
}
.choose-unit p {
  font-size: 11px;
  line-height: 17px;
  margin-bottom: 0;
}

.choose-unit-more {
  font-size: 12px;
  padding-top: 13px;
  margin-bottom: 53px;
}
.choose-unit-more a {
  color: #8cc63f;
  text-decoration: underline;
}
.choose-unit-more a:hover {
  text-decoration: none;
}

.calc-sub-title {
  text-align: center;
  font-size: 19px;
  font-weight: bold;
  margin-bottom: 35px;
}

.calc-sub-title span{
    display: block;
    font-weight: 300;
    font-size: 17px;
}

.calc-wrap .col {
  padding: 0;
}

.calc-choose-place {
  margin: 0 -12px;
}
.calc-choose-place .col {
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
  padding: 0 12px;
}


.calc-choose-place-balk {
  margin: 0 -12px;
}
.calc-choose-place-balk .col {
  flex: 0 0 49.3333333333%;
  max-width: 49.3333333333%;
  padding: 0 12px;
}

.calc-choose-place .choose-unit {
  border-radius: 8px;
  box-shadow: 0 1px 5px rgba(218, 224, 225, 0.75);
}

.calc-choose-flat-walls .col {
  flex-grow: 1;
  max-width: 100%;
  flex-basis: 0;
  width: 100%;
}
.calc-choose-flat-walls .col + .col {
  margin-left: -1px;
}
.calc-choose-flat-walls label {
  min-height: 310px;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 10px;
}
.calc-choose-flat-walls .choose-unit-img {
  margin-bottom: 35px;
}

.choose-unit {
  border: 1px solid #e8e9e9;
  text-align: center;
  transition: all 0.25s ease-in-out;
}
.choose-unit:hover {
  box-shadow: 0 3px 8px rgba(218, 224, 225, 0.85);
}

.calc-choose-house-walls .col {
  flex-grow: 1;
  max-width: 100%;
  flex-basis: 0;
  width: 100%;
}
.calc-choose-house-walls .col + .col {
  margin-left: -1px;
}
.calc-choose-house-walls label {
  min-height: 310px;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 10px;
}
.calc-choose-house-walls .choose-unit-img {
  margin-bottom: 35px;
}

.calc-choose-place .choose-unit label {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 276px;
  padding-top: 40px;
  margin: 0;
  border-radius: 8px;
  transition: all 0.25s ease-in-out;
}
.calc-choose-place .choose-unit-txt {
  font-size: 19px;
}
.calc-choose-place .choose-unit-img {
  margin-bottom: 55px;
}

.choose-unit-txt {
  font-weight: bold;
  color: #425254;
  font-size: 16px;
  line-height: 19px;
}

.calcul-btn {
  background-color: #5ac31a !important;
  color: #fff !important;
  font-size: 17px;
  font-weight: bold;
  border-color: #8cc63f;
  margin: 0;
}
.calcul-btn:hover, .calcul-btn:active, .calcul-btn:focus {
  background-color: #fff;
  color: #5ac31a;
}

.calc-btn-box {
  text-align: center;
  display: flex;
  justify-content: center;
  margin-top: 30px;
  position: relative;
	margin-bottom: 20px;
}

.calcul-btn-back {
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #8c9697;
  padding-left: 17px;
}
.calcul-btn-back:before {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-left: 2px solid #8c9697;
  border-bottom: 2px solid #8c9697;
  left: 0;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}
.calcul-btn-back:hover {
  color: #8c9697;
}

.calc-hint {
  background: #eaf7e4;
  font-size: 14px;
  color: #425254;
  text-align: center;
  padding: 15px 10px;
  margin-bottom: 24px;
  margin-top: -40px;
}
.calc-hint a {
  color: #425254;
  text-decoration: underline;
  font-weight: bold;
}
.calc-hint a:hover {
  text-decoration: none;
}

.calc-choose-window-type .choose-unit {
  padding: 15px 10px 24px 10px;
	height: 100%;
}
.calc-choose-window-type .col {
  margin-left: -1px;
}
.calc-choose-window-type .choose-unit-img {
  height: 212px;
  margin-bottom: 15px;
}
.calc-choose-window-type .choose-unit-img img {
  max-width: 100%;
}
.calc-choose-window-type .choose-unit-txt {
  min-height: 70px;
  font-size: 14px;
  line-height: 19px;
}

.type-unit-check {
  position: relative;
  max-width: 127px;
  margin: 0 auto;
  border-bottom: 1px solid #e4e5e5;
  margin-bottom: 14px;
  padding-bottom: 9px;
}
.type-unit-check input[type=checkbox], .type-unit-check input[type=radio] {
  visibility: hidden;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.type-unit-check input[type=checkbox]:checked + label:after, .type-unit-check input[type=radio]:checked + label:after {
  display: block;
}
.type-unit-check label {
  display: inline-block;
  font-size: 12px;
  position: relative;
  padding-left: 30px;
  height: 22px;
  line-height: 22px;
  cursor: pointer;
}
.type-unit-check label:before {
  content: "";
  display: block;
  position: absolute;
  width: 22px;
  height: 22px;
  border: 1px solid #b5b7b9;
  border-radius: 50%;
  left: 0;
  top: 0;
}
.type-unit-check label:after {
  content: "";
  display: none;
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #8cc63f;
  left: 5px;
  top: 5px;
}

.qty-spinner {
  display: inline-flex;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
}
.qty-spinner .qtyminus, .qty-spinner .qtyplus {
  height: 36px;
  width: 33px;
  border: 1px solid #a8a9aa;
  font-size: 24px;
  color: #657577;
  background-color: #fff;
  outline: none !important;
}
.qty-spinner .qtyValue {
  height: 36px;
  width: 46px;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  border-width: 1px;
  border-color: #a8a9aa;
  color: #657577;
  background-color: #fff;
}
.qty-spinner .qtyminus {
  border-right: 0;
}
.qty-spinner .qtyplus {
  border-left: 0;
}

.js-selected .qty-spinner {
  visibility: visible;
  opacity: 1;
}

.calc-window-size {
  border: 1px solid #e5e6e6;
  padding: 22px;
  display: flex;
}
.calc-window-size + .calc-window-size {
  border-top: 0;
}

.calc-window-size-lft {
  flex: 0 0 50%;
  max-width: 50%;
}

.calc-window-size-rht {
  flex: 0 0 50%;
  max-width: 50%;
  padding-left: 30px;
}
.calc-window-size-rht p {
  font-size: 12px;
  line-height: 20px;
}

.calc-window-size-params {
  padding: 0;
  margin: 0 0 15px 0;
  font-size: 14px;
  font-weight: 600;
}
.calc-window-size-params li {
  display: flex;
}
.calc-window-size-params li + li {
  margin-top: 10px;
}
.calc-window-size-params span {
  font-weight: 400;
  flex: 0 0 120px;
  max-width: 120px;
}

.calc-window-size-box {
  padding-bottom: 46px;
  padding-right: 46px;
  position: relative;
  display: inline-block;
}

.calc-window-parametrs .calc-window-size-box {
  padding: 0;
}
.calc-window-parametrs .calc-window-select {
  right: 0;
}
.calc-window-parametrs .calc-window-size-lft {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}
.calc-window-parametrs .calc-window-size-rht {
  flex: 1 1 auto;
  width: 1%;
  padding-left: 45px;
  max-width: 100%;
}

.checkbox-unit {
  position: relative;
  margin-bottom: 9px;
}
.checkbox-unit input[type=radio], .checkbox-unit input[type=checkbox] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
}
.checkbox-unit input[type=radio]:checked + label:before, .checkbox-unit input[type=checkbox]:checked + label:before {
  border-color: #8cc63f;
  background-color: #8cc63f;
}
.checkbox-unit input[type=radio]:checked + label:after, .checkbox-unit input[type=checkbox]:checked + label:after {
  opacity: 1;
}
.checkbox-unit label {
  margin: 0;
  position: relative;
  padding-left: 40px;
  font-size: 14px;
  font-weight: bold;
  height: 25px;
  line-height: 25px;
  cursor: pointer;
}
.checkbox-unit label:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  border: 1px solid #b2b2b2;
}
.checkbox-unit label:after {
  content: "";
  display: block;
  position: absolute;
  left: 6px;
  top: 7px;
  width: 14px;
  height: 7px;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(-45deg);
  opacity: 0;
}

.set-size-width {
  position: absolute;
  left: 0;
  right: 46px;
  bottom: 0px;
  text-align: center;
  font-size: 14px;
}
.set-size-width img {
  position: relative;
  z-index: 1;
}
.set-size-width:before {
  content: "";
  display: block;
  position: absolute;
  background-color: #aab1b1;
  height: 1px;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.set-size-width:after {
  content: "";
  display: block;
  position: absolute;
  top: -120px;
  left: 1px;
  right: 1px;
  bottom: 10px;
  border-left: 1px solid #aab1b1;
  border-right: 1px solid #aab1b1;
}
.set-size-width .input-box {
  position: relative;
  padding-top: 0px;
}
.set-size-width .input-box:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 14px 4px 0;
  border-color: transparent #aab1b1 transparent transparent;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.set-size-width .input-box:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 14px;
  border-color: transparent transparent transparent #aab1b1;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.set-size-height {
  position: absolute;
  left: 100%;
  bottom: 70px;
  top: 0;
  text-align: center;
  font-size: 14px;
}
.set-size-height:before {
  content: "";
  display: block;
  position: absolute;
  background-color: #aab1b1;
  width: 1px;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.set-size-height:after {
  content: "";
  display: block;
  position: absolute;
  border-top: 1px solid #aab1b1;
  border-bottom: 1px solid #aab1b1;
  top: 0;
  bottom: 0;
  left: -46px;
  right: 0;
}
.set-size-height .input-box {
  position: absolute;
  left: -15px;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
}
.set-size-height .input-box:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 4px 14px 4px;
  border-color: transparent transparent #aab1b1 transparent;
  position: absolute;
  left: 12px;
  top: 0;
}
.set-size-height .input-box:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 14px 4px 0 4px;
  border-color: #aab1b1 transparent transparent transparent;
  position: absolute;
  left: 12px;
  bottom: 0;
}
.set-size-height .set-size-input {
  width: 60px;
}

.set-size-input {
  width: 60px;
  height: 40px;
  border: 1px solid #adadad;
  background-color: #fff;
  position: relative;
  z-index: 1;
  display: inline-block;
  padding: 10px;
  font-size: 14px;
}

.calc-window-select {
  position: absolute;
  left: 0;
  top: 30px;
  display: flex;
  right: 48px;
  margin: 0 -3px;
}

.select-calc {
  flex: 0 0 33.333333333%;
  max-width: 33.333333333%;
  padding: 0 3px;
}

/* select */
.jcf-select {
  display: inline-block;
  vertical-align: top;
  position: relative;
  border: 1px solid #a8b3b4;
  background: #fff;
  height: 22px;
  max-width: 90px;
  min-width: 60px;
}

.jcf-select select {
  z-index: 1;
  left: 0;
  top: 0;
}

.jcf-select .jcf-select-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  cursor: default;
  display: block;
  font-size: 10px;
  line-height: 22px;
  margin: 0 35px 0 8px;
}

.jcf-select .jcf-select-opener {
  position: absolute;
  text-align: center;
  background: #425254;
  width: 18px;
  bottom: 0;
  right: 0;
  top: 0;
}
.jcf-select .jcf-select-opener:after {
  content: "";
  display: block;
  position: absolute;
  width: 6px;
  height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  left: 6px;
  top: 7px;
  transform: rotate(-45deg);
}

body > .jcf-select-drop {
  position: absolute;
  margin: -1px 0 0;
  z-index: 9999;
}

body > .jcf-select-drop.jcf-drop-flipped {
  margin: 1px 0 0;
}

.jcf-select .jcf-select-drop {
  position: absolute;
  margin-top: 0px;
  z-index: 9999;
  top: 100%;
  left: -1px;
  right: -1px;
}

.jcf-select .jcf-drop-flipped {
  bottom: 100%;
  top: auto;
}

.jcf-select.jcf-compact-multiple {
  max-width: 220px;
}

.jcf-select.jcf-compact-multiple .jcf-select-opener:before {
  display: inline-block;
  padding-top: 2px;
  content: "...";
}

.jcf-select-drop .jcf-select-drop-content {
  border: 1px solid #f00;
}

.jcf-select-drop.jcf-compact-multiple .jcf-hover {
  background: none;
}

.jcf-select-drop.jcf-compact-multiple .jcf-selected {
  background: #e6e6e6;
  color: #000;
}

.jcf-select-drop.jcf-compact-multiple .jcf-selected:before {
  display: inline-block;
  content: "";
  height: 4px;
  width: 8px;
  margin: -7px 5px 0 -3px;
  border: 3px solid #777;
  border-width: 0 0 3px 3px;
  transform: rotate(-45deg);
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865483, M12=0.7071067811865467, M21=-0.7071067811865467, M22=0.7071067811865483, SizingMethod='auto expand')";
}

/* select options styles */
.jcf-list {
  display: inline-block;
  vertical-align: top;
  position: relative;
  background: #fff;
  line-height: 14px;
  font-size: 12px;
  width: 100%;
}

.jcf-list .jcf-list-content {
  vertical-align: top;
  display: inline-block;
  overflow: auto;
  width: 100%;
}

.jcf-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.jcf-list ul li {
  overflow: hidden;
  display: block;
}

.jcf-list .jcf-overflow {
  overflow: auto;
}

.jcf-list .jcf-option {
  white-space: nowrap;
  overflow: hidden;
  cursor: default;
  display: block;
  padding: 5px 9px;
  color: #656565;
  min-height: 14px;
  height: 1%;
}

.jcf-list .jcf-disabled {
  background: #fff !important;
  color: #aaa !important;
}

.jcf-select-drop .jcf-hover,
.jcf-list-box .jcf-selected {
  background: #e6e6e6;
  color: #000;
}

.jcf-list .jcf-optgroup-caption {
  white-space: nowrap;
  font-weight: bold;
  display: block;
  padding: 5px 9px;
  cursor: default;
  color: #000;
}

.jcf-list .jcf-optgroup .jcf-option {
  padding-left: 30px;
}

.calc-range-slider {
  width: 246px;
}

.ui-slider {
  position: relative;
}

.ui-slider .ui-slider-handle {
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  background: #8cc63f;
  cursor: pointer;
  border-radius: 50%;
}

.ui-slider .ui-slider-range {
  position: absolute;
  z-index: 1;
  font-size: 0.7em;
  display: block;
  border: 0;
  overflow: hidden;
  background: #8cc63f;
}

.ui-slider-horizontal {
  height: 7px;
}

.ui-slider-horizontal .ui-slider-handle {
  top: -8px;
  margin-left: -9px;
}

.ui-slider-horizontal .ui-slider-range {
  top: 0;
  height: 100%;
}

.ui-slider-horizontal .ui-slider-range-min {
  left: 0;
}

.ui-slider-horizontal .ui-slider-range-max {
  right: 0;
}

.ui-widget-content {
  height: 3px;
  background: #9b9d9e;
}

.calc-window-checkbox-title {
  font-size: 17px;
  font-weight: bold;
  margin-bottom: 15px;
}

.calc-window-checkbox {
  display: flex;
  padding-top: 10px;
  margin: 0 -15px;
}

.calc-window-checkbox-col {
  flex: 0 0 39%;
  max-width: 39%;
  padding: 0 15px;
}

.calc-character {
  display: flex;
}

.calc-character-img {
  text-align: center;
  margin-bottom: 50px;
}

.calc-character-lft {
  flex: 0 0 310px;
  max-width: 310px;
}

.calc-character-rht {
  flex: 1 1 auto;
  width: 1%;
  padding-left: 40px;
}

.mosquito strong {
  display: block;
  font-size: 17px;
  font-weight: bold;
  margin-bottom: 13px;
}

.mosquito-types {
  margin: 0;
  padding: 0;
  display: flex;
}
.mosquito-types li {
  display: inline-block;
  position: relative;
  font-size: 12px;
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%;
}
.mosquito-types li input[type=checkbox], .mosquito-types li input[type=radio] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: 0;
  top: 0;
}
.mosquito-types li input[type=checkbox]:checked + label, .mosquito-types li input[type=radio]:checked + label {
  color: #8cc63f;
}
.mosquito-types li input[type=checkbox]:checked + label:before, .mosquito-types li input[type=radio]:checked + label:before {
  background: #8cc63f;
}
.mosquito-types label {
  display: inline-block;
  padding-top: 70px;
  position: relative;
  cursor: pointer;
}
.mosquito-types label:before {
  content: "";
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #c1c7c8;
  /* Old browsers */
  background: linear-gradient(to bottom, #c1c7c8 0%, #91999a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#c1c7c8", endColorstr="#91999a",GradientType=0 );
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.mosquito-types .mosquito-1 label:after {
  content: "";
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAaCAMAAACaYWzBAAAAZlBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+Vn2moAAAAIXRSTlMAAzTzDIjHq9i1oo4f7b+Ug3gRBvnlvrCbi4BaUk48LxchOe1mAAAAo0lEQVQoz42SBw7DIAxFIYzsSUeaTt//kiW2ImhdlD4JkP6XbGNbxLhJC8Zz6FoAUPaSxXJ2goB9bLI08ImRpOfwTYVGD0RRmbpUZDiv30nuKKlevNXLNVCBeh0KaRd8b6ifRWCiBzMfGsE4gqfkuoaVkRsNGtddg4f6P3m6XP7Blz+/W2L8zZs4KoBZptqeu8Sg5sRoh71loPWxalsfho4W7g2+/B2C/EEmRAAAAABJRU5ErkJggg==") center center no-repeat;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.mosquito-types .mosquito-2 label:after {
  content: "";
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAiCAMAAAAJbCvNAAAAh1BMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9qkf8RAAAALHRSTlMA/A7169bRkHfkJgLu3L+ViVo4CMSjg2lNQwu5fXFTRzEfFhUFyrOpp55hLY0fpBkAAAD7SURBVDjLhZFZcoMwEESFAAkQmzFg4zWOnb3vf76UylSEZiL7fcBHv9LUTIv/2Fad/cmjCKARn+VN9klIaAHkeYk0JGS4U4eE1SwkJiB0mCkCQjHn0edkHo7Q1y64hSWVYs3DXXescWfF00mrCH9c2YVTLGBnWg/w0WR2DcLWF75oHkm2uoMXIRMmbDxhZHmy8zZ49sCJ5Y3wGJ7khk6oSEkvIGTCZ0OFgggNyWNDhL2X8h7Fm9cy0FNBLYUcUFTolyVahwofLlcH+/WanlpdOeG9sm8cXl1+idiVYqB0lyiY8H0qEf8s7pyN2djqYa/yuFRNdjbidnEjfgFPOU5v+zLlXgAAAABJRU5ErkJggg==") center center no-repeat;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.mosquito-types .mosquito-3 label:after {
  content: "";
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAiCAMAAAAAh4u3AAAASFBMVEUAAAD////////////////////////////////////////////////////////////////////////////////////////////neHiwAAAAF3RSTlMA0Qb1Qw6TkD88HBTbLCvDoG5sY1CBhF1NYU0AAACYSURBVDjLxdPbDoMgDAbgn5OKKODA9f3fdPHKNLh1Gcv2XZBAKJCW4ppXN4gGUhDN4wT89ZZNeYgUDRBN44w+2r2xZzErGBuPsez6XHKGLN9DxgGBqOIULZjVLMcZOQW84DSeClVDlOh+EZkym2cqaFSiwKPQ0nv5xYfqKRvHyyZnOVpWr1ZTebkZbPwgC15t6NXRvF997wNjsgU8XrqeMAAAAABJRU5ErkJggg==") center center no-repeat;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.calc-character-line {
  display: flex;
  align-items: center;
}
.calc-character-line + .calc-character-line {
  margin-top: 25px;
}

.character-label {
  display: inline-block;
  flex: 0 0 160px;
  max-width: 160px;
  font-size: 17px;
  font-weight: bold;
}
.character-label span {
  font-weight: normal;
  font-size: 14px;
}

.calc-character-block {
  border-bottom: 1px solid #e4e5e5;
  padding: 32px 0;
}

.с-btn {
  background-color: #425254;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  border-radius: 4px;
  padding: 8px 15px;
  line-height: 18px;
  border: 0;
  min-width: 128px;
}

.character-value {
  flex: 1 1 auto;
  width: 1%;
  display: flex;
  align-items: center;
}

.calc-radio-set {
  display: flex;
}
.calc-radio-set .type-unit-check {
  max-width: 100%;
  padding-bottom: 0;
  border: 0;
  margin: 0;
}
.calc-radio-set .type-unit-check:not(:last-child) {
  margin: 0 30px 0 0;
}
.calc-radio-set label {
  margin: 0;
}
.calc-radio-set + .с-btn {
  margin-left: 20px;
}

.range-value {
  display: flex;
  align-items: center;
}

.range-value-input {
  flex: 0 0 100px;
  max-width: 100px;
  margin-right: 20px;
}
.range-value-input .form-control {
  text-align: center;
  font-size: 17px;
  font-weight: 600;
}

.range-value-slider {
  padding-top: 10px;
}

.range-value-legend {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  padding-top: 2px;
}

.modal .calc-row .col {
  padding: 0;
}

.calc-modal-title {
  text-align: center;
  font-size: 19px;
  font-weight: bold;
  margin-bottom: 25px;
}

.calc-modal .calc-choose-window-type .choose-unit-txt {
  min-height: auto;
  margin-bottom: 10px;
}
.calc-modal .type-unit-check {
  margin: 0;
  border: 0;
  max-width: none;
}
.calc-modal .choose-unit input[type=radio]:checked + label {
  background-color: transparent;
}

.calc-modal-buttons {
  text-align: center;
  padding-top: 35px;
}
.calc-modal-buttons .btn {
  display: inline-block;
  padding: 8px;
  min-width: 170px;
  font-size: 13px;
  line-height: 16px;
}

.extra-options {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -11px;
}
.extra-options .extra-col {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 0 11px;
  margin-bottom: 22px;
}
.extra-options .extra-col-full {
  flex: 0 0 100%;
  max-width: 100%;
}
.extra-options .extra-unit {
  border: 1px solid #e4e5e5;
  padding: 35px;
  box-shadow: 0 1px 5px rgba(218, 224, 225, 0.75);
}

.extra-col-full .extra-unit {
  display: flex;
  padding: 0;
}
.extra-col-full .extra-unit .extra-unit-in, .extra-col-full .extra-unit .extra-unit-map {
  flex: 0 0 50%;
  max-width: 50%;
}
.extra-col-full .extra-unit-in {
  padding: 20px 40px 35px 40px;
}

.extra-unit-form {
  padding: 15px 0 0 40px;
}
.extra-unit-form .form-control {
  font-size: 13px;
  height: 40px;
}

.extra-unit-headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
  min-height: 55px;
}
.extra-unit-headline .calc-radio-set {
  font-weight: bold;
  font-size: 14px;
}

.extra-unit-body {
  font-size: 11px;
  line-height: 18px;
}

.extra-unit-title {
  display: flex;
  align-items: center;
}
.extra-unit-title img {
  display: inline-block;
  margin-right: 17px;
}
.extra-unit-title span {
  font-weight: bold;
  font-size: 17px;
}

.extra-link {
  display: inline-block;
  color: #425254;
  font-weight: 600;
}
.extra-link:hover {
  color: #425254;
}
.extra-link span {
  display: block;
  padding-left: 50px;
  position: relative;
  height: 40px;
  line-height: 40px;
}
.extra-link span:before {
  content: "+";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 38px;
  height: 38px;
  border: 1px solid #b2b3b5;
  border-radius: 50%;
  text-align: center;
  line-height: 38px;
  color: #8dc63f;
  font-size: 32px;
  font-weight: normal;
}

.calc-choose-extra .choose-unit {
  height: 390px;
  padding: 92px 0 0 0;
}
.calc-choose-extra .choose-unit-img {
  height: 100px;
  margin-bottom: 6px;
}
.calc-choose-extra .choose-unit-txt {
  height: 110px;
}
.calc-choose-extra .type-unit-check {
  border-bottom: 0;
}

.calc-window-last {
  border-top: 1px solid #e4e5e5;
  padding-top: 20px;
}

.select-calc-selected {
  font-size: 10px;
  background-color: #425254;
  color: #fff;
  text-align: center;
  padding: 5px;
  font-weight: 600;
}

.calc-pre-final-teaser {
  background-color: #8cc63f;
  color: #fff;
  padding: 25px;
  box-shadow: 5px 10px 87px rgba(78, 110, 130, 0.81);
  display: flex;
  border-radius: 12px;
}

.calc-pre-final-teaser-txt {
  text-align: center;
  flex-wrap: 0 0 475px;
  max-width: 475px;
  padding: 20px 50px 0 50px;
  font-size: 14px;
  line-height: 20px;
}

.calc-pre-final-teaser-img {
  flex: 1 1 auto;
  width: 1%;
}
.calc-pre-final-teaser-img img {
  max-width: 100%;
}

.pre-final-teaser-title {
  font-size: 36px;
  font-weight: bold;
  line-height: 46px;
  padding-top: 20px;
  margin-bottom: 10px;
}
.pre-final-teaser-title > span {
  display: block;
  font-size: 92px;
  margin-bottom: 6px;
}
.pre-final-teaser-title > span span {
  font-size: 60px;
}

.calc-pre-final-form {
  padding: 55px 35px 40px 35px;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 5px 70px rgba(220, 226, 227, 0.5);
  margin-top: 14px;
}

.final-form-row {
  display: flex;
  align-items: center;
  margin: 0 -18px 25px -18px;
  justify-content: center;
}

.form-item {
  display: flex;
  align-items: center;
  font-weight: 600;
  padding: 0 18px;
}
.form-item label {
  margin: 0;
  display: inline-block;
}
.form-item .form-group {
  margin-bottom: 0;
  padding: 0 18px;
}
.form-item a {
  color: #657577;
  text-decoration: underline;
}
.form-item a:hover {
  text-decoration: none;
}

.form-file {
  padding: 0 20px;
  position: relative;
}

.form-add {
  padding: 0 20px;
  flex: 0 0 340px;
  max-width: 340px;
}
.form-add a {
  font-weight: 600;
  color: #657577;
  text-decoration: underline;
}

.final-form-add {
  align-items: flex-start;
}

.js .input-file-trigger {
  display: block;
  cursor: pointer;
  text-decoration: underline;
  font-weight: 600;
  margin: 0;
}

.js .input-file {
  position: absolute;
  top: 0;
  left: 0;
  width: 225px;
  opacity: 0;
  padding: 14px 0;
  cursor: pointer;
}

.input-file-container {
  text-align: right;
}

.file-return {
  margin: 0;
  width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-return:not(:empty) {
  margin: 10px 0 0 0;
}

.js .file-return {
  font-style: italic;
  font-size: 0.9em;
  font-weight: bold;
}

.js .file-return:not(:empty):before {
  content: "Выбран файл: ";
  font-style: normal;
  font-weight: normal;
}

.calc-thx {
  font-size: 36px;
  font-weight: bold;
  color: #fff;
  background-color: #8cc63f;
  max-width: 762px;
  flex: 0 0 762px;
  height: 340px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  box-shadow: 5px 10px 87px rgba(78, 110, 130, 0.81);
}

.layout-final {
  display: flex;
  justify-content: center;
  align-items: center;
}
.layout-final .container {
  display: flex;
  justify-content: center;
}

@media (max-width: 1199px) {
  .calc-progress-nav li:not(:first-child) .arrow {
    display: none;
  }

  .calc-progress-nav li:not(:first-child), .calc-progress-nav li {
    padding-left: 42px;
  }

  .calc-progress-nav li:not(:first-child):after {
    left: 5px;
  }

  .calc-nav li a {
    font-size: 16px;
    padding: 10px 15px 10px;
  }

  .calc-wrap .tab-content .card-body {
    padding-bottom: 40px;
  }

  .calc-choose-house-walls label {
    min-height: 210px;
  }

  .calc-choose-window-type .choose-unit-txt {
    font-size: 12px;
    line-height: 17px;
  }

  .modal .calc-row {
    flex-wrap: wrap;
  }

  .modal .calc-row .col {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }

  .choose-unit-more {
    margin-bottom: 15px;
  }

  .modal .calc-choose-window-type .choose-unit {
    padding-bottom: 15px;
  }

  .extra-options .extra-col:not(.extra-col-full) .extra-unit {
    padding: 15px;
  }

  .calc-pre-final-teaser-txt {
    padding: 0 15px;
  }

  .calc-pre-final-teaser-txt, .calc-pre-final-teaser-img {
    flex: 0 0 50%;
    max-width: 50%;
  }
}
@media (max-width: 991px) and (min-width: 768px) {
  .calc-progress-nav li:not(:first-child), .calc-progress-nav li {
    padding-left: 2px;
    padding-top: 30px;
    height: 66px;
  }

  .calc-progress-nav li:after {
    left: 50% !important;
    transform: translateX(-50%);
  }
}
@media (max-width: 991px) {
  .calc-wrap .is-opened .card-header {
    position: static;
  }

  .calc-choose-house-walls {
    flex-wrap: wrap;
    justify-content: center;
  }
  .calc-choose-house-walls .col {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
  }

  .calc-choose-window-type {
    flex-wrap: wrap;
  }
  .calc-choose-window-type .col {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%;
    margin-top: -1px;
  }

  .calc-window-size {
    display: block;
  }

  .calc-window-size-lft {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 30px;
  }

  .calc-window-size-rht {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .calc-window-size-rht {
    padding-left: 0;
  }

  .calc-window-parametrs .calc-window-size-rht {
    width: 100%;
    padding-left: 0;
  }

  .calc-character {
    display: block;
  }

  .calc-character-lft {
    max-width: 100%;
  }

  .mosquito {
    text-align: center;
  }

  .mosquito-types {
    justify-content: center;
  }
  .mosquito-types li {
    flex: 0 0 100px;
    max-width: 100px;
  }

  .calc-character-rht {
    width: 100%;
    padding-left: 0;
  }

  .calc-character-block {
    padding: 20px 0;
  }

  .calc-modal .modal-content {
    padding: 30px;
  }
  .calc-modal .calc-choose-window-type .choose-unit-img {
    margin-bottom: 10px;
  }

  .modal .calc-row .col {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .modal .calc-choose-sill .col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .extra-options .extra-col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .extra-col-full .extra-unit {
    display: block;
  }

  .extra-col-full .extra-unit .extra-unit-in, .extra-col-full .extra-unit .extra-unit-map {
    max-width: 100%;
  }

  .calc-choose-extra {
    flex-wrap: wrap;
  }
  .calc-choose-extra .col {
    flex: 0 0 33.333333333%;
    max-width: 33.333333333%;
  }

  .calc-choose-extra .choose-unit {
    height: 260px;
    padding-top: 30px;
  }

  .calc-choose-extra .choose-unit-txt {
    height: 80px;
  }

  .final-form-row {
    display: block;
  }

  .form-item label {
    flex: 0 0 120px;
    max-width: 120px;
  }

  .form-item {
    margin-bottom: 20px;
  }

  .input-file-container {
    text-align: left;
  }

  .form-file {
    margin-bottom: 15px;
  }

  .calc-pre-final-teaser {
    flex-direction: column-reverse;
    flex-wrap: wrap;
  }

  .calc-pre-final-teaser-txt {
    margin-top: 30px;
  }

  .calc-pre-final-teaser-txt,
.calc-pre-final-teaser-img {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
    text-align: center;
  }
  .calc-pre-final-teaser-txt img,
.calc-pre-final-teaser-img img {
    display: inline-block;
  }

  .calc-bg-1, .calc-bg-2, .calc-bg-3, .calc-bg-4 {
    background-attachment: scroll;
  }

  .calc-thx {
    flex: 0 0 600px;
    height: 300px;
  }
}
@media (max-width: 768px) {
  .calc-progress {
    margin-bottom: 30px;
  }

  .calc-progress-nav {
    flex-wrap: wrap;
    justify-content: center;
  }
  .calc-progress-nav li {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    margin-bottom: 10px;
  }

  .calc-btn-box {
    margin-top: 25px;
    display: block;
  }

  .calcul-btn-back {
    position: relative;
    transform: translateY(0);
    display: inline-block;
    margin-top: 15px;
  }

  .calcul-btn {
    width: 100%;
  }

  .calc-row {
    flex-wrap: wrap;
  }

  .calc-choose-flat-walls {
    justify-content: center;
  }

  .calc-choose-flat-walls label {
    min-height: 200px;
  }

  .calc-choose-flat-walls .choose-unit-img {
    margin-bottom: 15px;
  }

  .calc-choose-flat-walls .col {
    margin-top: -1px;
  }

  .calc-choose-flat-walls .col {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .calc-window-size-rht p {
    text-align: left;
  }

  .calc-window-checkbox-col {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .range-value {
    display: block;
  }

  .range-value-input {
    margin: 0 0 15px 0;
  }

  .character-value {
    display: block;
  }

  .calc-radio-set:not(:last-child) {
    margin-bottom: 20px;
  }

  .calc-range-slider {
    width: 100%;
  }

  .calc-character-line {
    align-items: flex-start;
  }

  .calc-radio-set + .с-btn {
    margin-left: 0;
  }

  .calc-hint {
    margin-top: 0;
  }

  .form-item {
    display: block;
    padding: 0;
  }

  .final-form-row {
    margin-left: 0;
    margin-right: 0;
  }

  .form-item .form-group {
    padding: 0;
    margin-bottom: 10px;
  }

  .form-item label {
    margin-bottom: 15px;
  }

  .calc-pre-final-form {
    padding: 25px;
  }

  .form-file {
    padding: 0;
  }

  .form-add {
    max-width: 100%;
    padding: 0;
  }

  .calc-thx {
    flex: 0 0 400px;
    height: 120px;
    font-size: 24px;
  }
}
@media (max-width: 577px) {
  .calc-row {
    flex-wrap: wrap;
  }

  .calc-row .col {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }

  .calc-choose-place .choose-unit label {
    min-height: 160px;
    padding-top: 15px;
  }

  .calc-choose-place .choose-unit-img {
    margin-bottom: 15px;
  }

  .calc-wrap .tab-content .card-body {
    padding: 15px;
  }

  .calc-title {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 30px;
  }

  .calc-title span {
    font-size: 28px;
    margin-bottom: 10px;
  }

  .layout {
    padding-top: 80px;
    padding-bottom: 40px;
  }

  .calc-choose-window-type .col {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 0;
    margin-left: -1px;
    width: auto;
  }

  .set-size-height {
    left: auto;
    right: 0;
  }

  .set-size-height .set-size-input {
    margin-left: -72px;
  }

  .calc-window-size {
    padding: 10px;
  }

  .extra-col-full .extra-unit-in {
    padding: 20px 20px 20px 20px;
  }

  .calc-choose-extra {
    flex-wrap: wrap;
  }
  .calc-choose-extra .col {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 0;
  }

  .calc-window-size-box {
    display: block;
  }
  .calc-window-size-box img {
    width: 100%;
  }

  .file-return {
    max-width: 100%;
    width: 200px;
  }

  .form-add {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .input-file-container {
    overflow: hidden;
    max-width: 100%;
  }

  .final-form {
    overflow: hidden;
  }

  .calc-pre-final-teaser-txt {
    padding: 0;
  }

  .pre-final-teaser-title {
    font-size: 24px;
    line-height: 34px;
  }

  .pre-final-teaser-title > span {
    font-size: 76px;
  }

  .pre-final-teaser-title > span span {
    font-size: 48px;
  }

  .calc-thx {
    flex: 0 0 280px;
    height: 80px;
    font-size: 20px;
  }
}
@media (max-width: 460px) {
  .set-size-height .input-box {
    left: -15px;
  }

  .set-size-height {
    right: 30px;
  }

  .calc-window-checkbox {
    flex-wrap: wrap;
    margin: 0;
  }

  .calc-window-checkbox-col {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
  }
  .calc-window-checkbox-col + .calc-window-checkbox-col {
    margin-top: 20px;
  }

  .calc-character-line {
    display: block;
  }

  .character-value {
    width: 100%;
    text-align: center;
  }

  .character-label {
    display: block;
    max-width: 100%;
    margin-bottom: 15px;
    text-align: center;
  }

  .calc-radio-set {
    justify-content: center;
    display: flex;
  }

  .range-value-input {
    max-width: 100%;
  }

  .extra-unit-headline {
    display: block;
  }

  .extra-unit-title img {
    display: none;
  }

  .extra-unit-title {
    text-align: center;
    display: block;
    margin-bottom: 10px;
  }
  .extra-unit-title span {
    display: block;
  }
}
@media (max-width: 400px) {
  .calc-choose-window-type .col {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 0;
  }

  .calc-choose-window-type .choose-unit-img {
    height: auto;
  }

  .calc-choose-window-type .choose-unit-txt {
    min-height: auto;
    margin-bottom: 10px;
  }

  .modal .calc-row .col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .calc-modal .modal-content {
    padding: 30px 15px;
  }
}
@media (max-width: 380px) {
  .extra-link span {
    padding: 40px 0 0 0;
  }
  .extra-link span:before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  .calc-choose-extra {
    flex-wrap: wrap;
  }
  .calc-choose-extra .col {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .set-size-height {
    right: 10px;
  }
}

@media (max-width: 767px){
  .calc-progress-nav{
    display: block;
    white-space: nowrap;
    overflow: auto;
    max-width: 100%;
  }  
}