@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

section.calculator .calc-form{
    display:none
}
section.videoinstrukcia {
    margin-top: 40px;
}
.overlayshow {
  width: 100%;
  height: 100%;
  background: rgba(51, 51, 51, 0.78);
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  z-index: 3000;
  backdrop-filter: blur(2px);
}
.succcesform {
    position: fixed;
    background: #fff;
    width: 37%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 5px;
    border: 1px solid #ccc;
    padding: 10px;
    text-align: center;
    z-index: 3001;
    display: none;
    font-family: 'Ubuntu';
    font-size: 24px;
}
.succcesform span {
    cursor: pointer;
}


.vidzamka input:checked + label ~ .calc-form.cwetzm {
    display: block !important;
}
.vidzamka input:checked + label ~ .calc-form.cwetzm .cvetzamka {
 display: flex !important;
}

.voprosy.kr.cvetzamka{display:none}
.calc-form.cwetzm img{display:none}
.calc-form .kr label[for="cvetzamka-7"], .calc-form .kr label[for="cvetzamka-8"] {
    display: none;
}


.vidzamka input:checked:nth-child(1) + label ~ .calc-form.cwetzm img:nth-child(1){
    display:block !important;
}
.vidzamka input:checked:nth-child(3) + label ~ .calc-form.cwetzm img:nth-child(2){
    display:flex !important;
}
.vidzamka input:checked:nth-child(5) + label ~ .calc-form.cwetzm img:nth-child(3){
    display:flex !important;
}

.vidzamka input:checked:nth-child(5) + label ~ .calc-form .kr label[for="cvetzamka-7"], 
.vidzamka input:checked:nth-child(5) + label ~ .calc-form .kr label[for="cvetzamka-8"],
.vidzamka input:checked:nth-child(5) + label ~ .calc-form .kr label[for="cvetzamka-7"] img, 
.vidzamka input:checked:nth-child(5) + label ~ .calc-form .kr label[for="cvetzamka-8"] img{
    display:flex !important;
}

.ukajitecol { opacity: 0;}
.voprosy.vidokna input:checked ~ .ukajitecol { opacity: 1;}

.voprosy.vidokna input:checked ~ .ukajitecol label{
    display:none
}
.voprosy.vidokna input:checked:nth-child(1) + label ~ .ukajitecol label:nth-child(2){
    display:flex!important
}
.voprosy.vidokna input:checked:nth-child(3) + label ~ .ukajitecol label:nth-child(4), .voprosy.vidokna input:checked:nth-child(3) + label ~ .ukajitecol label:nth-child(2){
    display:flex!important
}
.voprosy.vidokna input:checked:nth-child(5) + label ~ .ukajitecol label:nth-child(6),
.voprosy.vidokna input:checked:nth-child(5) + label ~ .ukajitecol label:nth-child(4), 
.voprosy.vidokna input:checked:nth-child(5) + label ~ .ukajitecol label:nth-child(2){
    display:flex!important
}

.voprosy.vidokna input:checked:nth-child(7) + label ~ .ukajitecol label:nth-child(6),
.voprosy.vidokna input:checked:nth-child(7) + label ~ .ukajitecol label:nth-child(4), 
.voprosy.vidokna input:checked:nth-child(7) + label ~ .ukajitecol label:nth-child(2){
    display:flex!important
}


.sposustdostsetki span.vopros, .sposustdostzachity span.vopros {
    position: relative;
    right: auto;
    margin-left: -70px;
}
.sposustdostsetki span.vopros + span, .sposustdostzachity span.vopros + span {
    position: relative;
    margin-left: -115px;
    right: auto;
    top: auto;
    margin-top: -10px;
}


.razmkolsetki {
    background-color: #D9D9D9;
    display: inline-block;
    width: 40%;
    padding: 40px;
    margin-top: 20px;
    border-radius: 20px;
    font-size: 18px;
}
.razmkolsetki > div > span:first-child {
    font-size: 20px;
    font-weight: 500;
    color: #2E5077;
    margin-right: 30px;
}
.razmkolsetki>div {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}
.razmkolsetki>div:last-child {
    margin-bottom: 0px;
}
.razmkolsetki input[type="number"] {
    display: block;
    width: 80%;
    border: none;
    border-radius: 100px;
    padding: 6px;
    font-size: 17px;
}
.razmkolsetki div div span {
    margin-bottom: 9px;
    display: block;
}

.typekostrukcii span.vopros + span {
    right: auto;
    bottom: auto;
    margin-left: 280px;
    top: -60px;
}
.typekostrukcii span.vopros+span:before {
    transform: rotate(-19deg);
    height: 100px;
    bottom: -98px;
}
.typekostrukcii span.vopros {
    position: relative;
    bottom: 0px;
    right: 0px;
    margin-left: -55px;
    margin-top: 70px;
    width: 25px;
    height: 25px;
    font-size: 16px;
    border: 3px solid;
    margin-right: 8px;
}
.razmsteklopaketa img {
    width: 100%;
    padding: 0px 35px;
}
.razmpodokonka img {
    width: 100%;
    padding: 0px 0px;
    margin-top: 13px;
}
.razmsteklopaketa, .razmpodokonka {
    width: 170px;
    background-color: #D9D9D9;
    flex-direction: column;
    border-radius: 15px;
    align-items: center;
    gap: 5px !important;
    padding: 20px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='76' height='73' viewBox='0 0 76 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='36.5' cy='36.5' r='33' stroke='%232E5077' stroke-width='7'/%3e%3cpath d='M13.5625 39.8698L34.6863 61.3539C34.893 61.5651 35.1458 61.732 35.4277 61.8434C35.7096 61.9547 36.0138 62.0078 36.3196 61.9991C36.6254 61.9903 36.9256 61.9199 37.1997 61.7926C37.4738 61.6654 37.7153 61.4842 37.9078 61.2616L74.9107 18.5606C75.0927 18.3521 75.2275 18.1113 75.3069 17.8526C75.3863 17.5939 75.4088 17.3228 75.3729 17.0558C75.337 16.7887 75.2435 16.5313 75.098 16.2991C74.9526 16.0669 74.7583 15.8648 74.5269 15.7051L65.4434 9.39194C64.9958 9.08112 64.4358 8.94718 63.8838 9.01892C63.3318 9.09067 62.8319 9.36237 62.4917 9.77558L38.1827 39.1899C37.9969 39.4129 37.7627 39.5964 37.4956 39.7284C37.2284 39.8604 36.9345 39.9379 36.633 39.9558C36.3315 39.9737 36.0295 39.9316 35.7467 39.8322C35.4639 39.7329 35.2068 39.5785 34.9923 39.3793L24.5186 29.5891C24.32 29.4023 24.084 29.2541 23.8241 29.153C23.5641 29.0519 23.2854 28.9998 23.0039 28.9998C22.7224 28.9998 22.4436 29.0519 22.1837 29.153C21.9237 29.2541 21.6877 29.4023 21.4891 29.5891L13.6092 37.126C13.227 37.4905 13.009 37.9785 13.0003 38.4892C12.9916 38.9999 13.1929 39.4941 13.5625 39.8698Z' fill='%23FF5C00'/%3e%3c/svg%3e ");   
    background-repeat:no-repeat;
    background-size: 30px;
}
.razmsteklopaketa input[type="number"], .razmpodokonka input[type="number"]{
    display: block;
    border: none;
    border-radius: 30px;
    width: 100%;
    height: 25px;
    text-align: center;
}
.kolstvotok {
    margin-top: 20px;
}
.ukajitecol img {
    width: 25px;
}
.ukajitecol {
    margin-top: 60px;
    font-size: 18px;
}
.calc-form.paramok-slider {
    display: flex;
    justify-content: space-between;
}
:focus-visible {
    outline: -webkit-focus-ring-color auto 0px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; 
}
section.calculator-div .contaier {
    border: 4px dashed #2E5077;
    padding: 30px;
    border-radius: 10px;
    box-sizing: border-box;
}
section *{
   font-family: Ubuntu;
   position:relative;
   box-sizing: border-box;
}
.razmeryokna .mrg {
    margin-right: 40px;
}
section .contaier {
    max-width: 1240px;
    margin: 0 auto;
}
section.calculator h2{
font-size: 27px;
font-weight: 700;
line-height: 1.2em;
}
.infostvk {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 30px;
}
.ukajitecol img[src="/static/img/calc/no.svg"] {
    margin-left: 20px;
}
.voprosy {
    display: flex;
    gap: 80px;
    flex-wrap: wrap;
}
p.formlb {
    color: #000;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 15px;
    font-weight: 300;
    margin-bottom: 20px;
    margin-top: 50px;
}
.razmeryokna input[type="number"] {
    font-size: 18px;
    display: block;
    border: none;
    background-color: #D9D9D9;
    border-radius: 30px;
    height: 43px;
    text-align: center;
    width: 140px;
}
.razmeryokna {
    display: flex;
    align-items: baseline;
    gap: 15px;
}
p.formlb span {
    color: #2E5077;
    background: #D9D9D9;
    height: 43px;
    width: 43px;
    display: flex;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
}
.calc-form label, .calc-formone label{cursor:pointer}
.calc-form input, .calc-formone input{display:none}
.calc-form .kv label, .calc-formone .kv label{
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='73' height='73' viewBox='0 0 73 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='3.5' y='3.5' width='66' height='66' stroke='%232E5077' stroke-width='7'/%3e%3c/svg%3e ");
font-size: 18px;
font-weight: 700;
line-height: 1.2em;
color:#2E5077;
background-size: 30px;
height: 30px;
background-repeat: no-repeat;
display: flex;
align-items: center;
padding-left: 40px;
}
.calc-form .kv input:checked + label, .calc-formone .kv input:checked + label{
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='73' height='73' viewBox='0 0 73 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='3.5' y='3.5' width='66' height='66' stroke='%232E5077' stroke-width='7'/%3e%3cpath d='M9.56248 40.8698L30.6863 62.3539C30.893 62.5651 31.1458 62.732 31.4277 62.8434C31.7096 62.9547 32.0138 63.0078 32.3196 62.9991C32.6254 62.9903 32.9256 62.9199 33.1997 62.7926C33.4738 62.6654 33.7153 62.4842 33.9078 62.2616L70.9107 19.5606C71.0927 19.3521 71.2275 19.1113 71.3069 18.8526C71.3863 18.5939 71.4088 18.3228 71.3729 18.0558C71.337 17.7887 71.2435 17.5313 71.098 17.2991C70.9526 17.0669 70.7583 16.8648 70.5269 16.7051L61.4434 10.3919C60.9958 10.0811 60.4358 9.94718 59.8838 10.0189C59.3318 10.0907 58.8319 10.3624 58.4917 10.7756L34.1827 40.1899C33.9969 40.4129 33.7627 40.5964 33.4956 40.7284C33.2284 40.8604 32.9345 40.9379 32.633 40.9558C32.3315 40.9737 32.0295 40.9316 31.7467 40.8322C31.4639 40.7329 31.2068 40.5785 30.9923 40.3793L20.5186 30.5891C20.32 30.4023 20.084 30.2541 19.8241 30.153C19.5641 30.0519 19.2854 29.9998 19.0039 29.9998C18.7224 29.9998 18.4436 30.0519 18.1837 30.153C17.9237 30.2541 17.6877 30.4023 17.4891 30.5891L9.60917 38.126C9.22695 38.4905 9.00896 38.9785 9.00027 39.4892C8.99158 39.9999 9.19286 40.4941 9.56248 40.8698Z' fill='%23FF5C00'/%3e%3c/svg%3e ");
}
span.plus {
    order: 1;
}

.calc-form .kr label, .calc-formone .kr label{
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='76' height='73' viewBox='0 0 76 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='36.5' cy='36.5' r='33' stroke='%232E5077' stroke-width='7'/%3e%3c/svg%3e ");
font-size: 18px;
font-weight: 700;
line-height: 1.2em;
color:#2E5077;
background-size: 30px;
height: 30px;
background-repeat: no-repeat;
display: flex;
align-items: center;
padding-left: 40px;
}
.calc-form .kr input:checked + label, .calc-formone .kr input:checked + label{
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='76' height='73' viewBox='0 0 76 73' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='36.5' cy='36.5' r='33' stroke='%232E5077' stroke-width='7'/%3e%3cpath d='M13.5625 39.8698L34.6863 61.3539C34.893 61.5651 35.1458 61.732 35.4277 61.8434C35.7096 61.9547 36.0138 62.0078 36.3196 61.9991C36.6254 61.9903 36.9256 61.9199 37.1997 61.7926C37.4738 61.6654 37.7153 61.4842 37.9078 61.2616L74.9107 18.5606C75.0927 18.3521 75.2275 18.1113 75.3069 17.8526C75.3863 17.5939 75.4088 17.3228 75.3729 17.0558C75.337 16.7887 75.2435 16.5313 75.098 16.2991C74.9526 16.0669 74.7583 15.8648 74.5269 15.7051L65.4434 9.39194C64.9958 9.08112 64.4358 8.94718 63.8838 9.01892C63.3318 9.09067 62.8319 9.36237 62.4917 9.77558L38.1827 39.1899C37.9969 39.4129 37.7627 39.5964 37.4956 39.7284C37.2284 39.8604 36.9345 39.9379 36.633 39.9558C36.3315 39.9737 36.0295 39.9316 35.7467 39.8322C35.4639 39.7329 35.2068 39.5785 34.9923 39.3793L24.5186 29.5891C24.32 29.4023 24.084 29.2541 23.8241 29.153C23.5641 29.0519 23.2854 28.9998 23.0039 28.9998C22.7224 28.9998 22.4436 29.0519 22.1837 29.153C21.9237 29.2541 21.6877 29.4023 21.4891 29.5891L13.6092 37.126C13.227 37.4905 13.009 37.9785 13.0003 38.4892C12.9916 38.9999 13.1929 39.4941 13.5625 39.8698Z' fill='%23FF5C00'/%3e%3c/svg%3e ");    
}

.okna label span, .kakoymaterial label span, .cvetokna label span, .skolkokamervstekle label span, .cvetpodokon label span, .typekostrukcii label span, .cvetsetki label span, .vidzamka label span, .cvetzamka label span{
    background-color: #D9D9D9;
    width: 100%;
    text-align: center;
    border-radius: 40px;
    padding: 6px;
    font-size: 18px;
    margin-top: -5px;
}
.okna label img, .kakoymaterial img, .vidzamka label img, .cvetzamka label img{
    width: 200px;
}
.cvetpodokon label img, .cvetsetki label img, .skolkokamervstekle label img {
    width: 160px;
}

.cvetokna label img, .typekostrukcii label img {
    width: 85px;
}

.okna label, .kakoymaterial label, .cvetokna label, .skolkokamervstekle label, .cvetpodokon label, .typekostrukcii label, .cvetsetki label, .vidzamka label, .cvetzamka label{
    flex-flow: column;
    background-position: 2% 55%;
    padding-left: 0px !important;
    height: auto !important;
}
.skolkokamervstekle span {
    margin-top: -10px !important;
}
.typekostrukcii {
    gap: 25px;
}
.vidzamka, .cvetzamka{
    gap:40px
}
.typekostrukcii label span {
    margin-top: -5px;
    width:170px
}
.cvetpodokon label span {
    margin-top: -40px;
    width:180px
}
.vidzamka label span, .cvetzamka label span{
    width:210px
}


.cvetokna label {
  background-position: 2% 35%;  
  width: 15%;
}

.voprosy.remonta label {
    width: 24%;
}
.voprosy.remonta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 30px;
}
span.vopros {
    border: 4px solid #2E5077;
    line-height: 1em;
    border-radius: 100px;
    width: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: #2E5077;
    cursor:context-menu;
    position: absolute;
    right: 200px;
    height: 30px;
    bottom: 0px;
}
span.vopros+span {
    border: 5px solid #2E5077;
    position: absolute;
    right: 36px;
    bottom: 47px;
    padding: 6px 10px;
    border-radius: 16px;
        opacity: 0;
    transition:0.3s;
}
span.vopros:hover + span {
    opacity: 1;
}
span.vopros+span:before {
    content: "";
    width: 4px;
    height: 50px;
    position: absolute;
    background: #2E5077;
    bottom: -40px;
    left: 43px;
    transform: rotate(60deg);
}

.kolvo input[type="number"], .ukkolizgirazmerset input[type="number"] {
    font-size: 18px;
    display: block;
    border: none;
    background-color: #D9D9D9;
    border-radius: 30px;
    height: 43px;
    text-align: center;
    width: 140px;
}
.kolvo span, .ukkolizgirazmerset span {
    color: #2E5077;
    font-weight: 600;
}
.stoimost p {
    margin: 0px;
}
.stoimost {
    font-size: 18px;
    margin-top: 40px;
    font-weight: 400;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}
.stoimost button {
    color: #2E5077;
    background-color: #D9D9D9;
    border-radius: 50px;
    border: none;
    font-weight: 600;
    font-size: 20px;
    padding: 7px 30px;
    margin-right: 20px;
    cursor: pointer;
}
span.final-sum, .final-itog-sum {
    background-color: #D9D9D9;
    border-radius: 100px;
    padding: 6px 20px;
    margin-right: 10px;
    margin-left: 5px;
}
.kolvo, .ukkolizgirazmerset {
    display: flex;
    align-items: center;
    gap: 15px;
}
section.calculator-div .fin-ras {
    background: #D9D9D9;
    width: 23%;
    border-radius: 20px;
    padding: 30px;
    font-size: 18px;
    display: flex;
    flex-direction: column;
}
section.calculator-div {
    margin-top: 40px;
}
section.calculator-div .contaier {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    flex-wrap: wrap;
}

section.calculator-div span.plus {
    border: 3px solid #2E5077;
    border-radius: 80px;
    height: 40px;
    width: 40px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' width='512' height='512' x='0' y='0' viewBox='0 0 32 32' style='enable-background:new 0 0 512 512' xml:space='preserve' class=''%3e%3cg transform='matrix(1.2900000000000003,0,0,1.2900000000000003,-4.640000000000004,-4.640000000000004)'%3e%3cpath fill='%232e5077' fill-rule='nonzero' d='M17 4v11h11v2H17v11h-2V17H4v-2h11V4z' opacity='1' data-original='%23000000'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
    background-size: 29px;
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 30px;
    margin-bottom: 30px;
    cursor:pointer;
}
p.txtitog {
    font-size: 18px;
    margin-top: 40px;
    margin-bottom: 40px;
}
.txtformfn {
    display: flex;
    font-size: 18px;
    align-items: baseline;
}
.txtformfn span {
    color: #2E5077;
    font-weight: 600;
    margin-right: 20px;
}
section.calculator-it form input {
    padding: 10px 30px;
    background: #D9D9D9;
    border: none;
    border-radius: 100px;
    font-size: 18px;
}
section.calculator-it form {
    gap: 20px;
    display: flex;
    margin-right: 20px;
}
section.calculator-it form input.bot-send-mail {
    color: #2E5077;
    font-weight: 600;
    padding: 3px 35px;
}

.vidokna {
    gap: 20px;
}
.vidokna label img {
    width: 82px;
}
.vidokna label {
    padding-left: 30px !important;
    padding-top: 40px;
}
.slider {
	position: relative;
	width: 100%;
	max-width: 800px;
	margin: auto;
	overflow: hidden;
}

.slides {
	display: flex;
	transition: transform 0.5s ease-in-out;
}

.slide {
	min-width: 100%;
	box-sizing: border-box;
	text-align: center;
}

.slide img {
	width: 80%;
	height: 300px;
	object-fit: contain;
}

.navigation {
	position: absolute;
	top: 50%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	transform: translateY(-50%);
}

.nav-btn {
	border: none;
	padding: 10px;
	cursor: pointer;
	background-color: #0000;
	background-size: contain;
	padding: 25px;
	background-repeat: no-repeat;
}

button.nav-btn.prev {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='73' height='76' viewBox='0 0 73 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M73 37.8425C73 58.5525 56.6584 75.3413 36.5 75.3413C16.3416 75.3413 0 58.5525 0 37.8425C0 17.1325 16.3416 0.34375 36.5 0.34375C56.6584 0.34375 73 17.1325 73 37.8425Z' fill='%23D9D9D9'/%3e%3cpath d='M15.2322 36.5877C14.2559 37.564 14.2559 39.1469 15.2322 40.1232L31.1421 56.0331C32.1184 57.0094 33.7014 57.0094 34.6777 56.0331C35.654 55.0568 35.654 53.4739 34.6777 52.4976L20.5355 38.3555L34.6777 24.2133C35.654 23.237 35.654 21.6541 34.6777 20.6778C33.7014 19.7015 32.1184 19.7015 31.1421 20.6778L15.2322 36.5877ZM57 35.8555L17 35.8555V40.8555L57 40.8555V35.8555Z' fill='%232E5077'/%3e%3c/svg%3e ");

}

button.nav-btn.next {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='73' height='76' viewBox='0 0 73 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cellipse cx='36.5' cy='37.8425' rx='36.5' ry='37.4988' fill='%23D9D9D9'/%3e%3cpath d='M57.7678 40.1232C58.7441 39.1469 58.7441 37.564 57.7678 36.5877L41.8579 20.6778C40.8816 19.7015 39.2986 19.7015 38.3223 20.6778C37.346 21.6541 37.346 23.237 38.3223 24.2133L52.4645 38.3555L38.3223 52.4976C37.346 53.4739 37.346 55.0568 38.3223 56.0331C39.2986 57.0095 40.8816 57.0095 41.8579 56.0331L57.7678 40.1232ZM16 40.8555L56 40.8555L56 35.8555L16 35.8555L16 40.8555Z' fill='%232E5077'/%3e%3c/svg%3e ");
}

.dots {
	text-align: center;
	margin-top: 10px;
}

.dot {
	height: 10px;
	width: 10px;
	margin: 0 3px;
	background-color: #D9D9D9;
	border-radius: 50%;
	display: inline-block;
	cursor: pointer;
}

.dots .active {
	background-color: #2499C2;
}

.sliderokon {
	margin-top: 55px;
	width: 50%;
}
section.calculator .calc-form.active {
    display: block;
}
section.calculator .calc-form.paramok-slider.active {
    display: flex;
}
.vidmoskit label {
    width: 24%;
}
.voprosy.vidmoskit {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 30px;
}
.slide1stv:before {
    content: "";
    background-image: url(/static/img/calc/no.svg);
    width: 30px;
    height: 30px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
.slide1stv.active:before{
   background-image: url(/static/img/calc/ok.svg);
}

.slide2stv:before {
    content: "";
    background-image: url(/static/img/calc/nono.svg?v2);
    width: 160px;
    height: 30px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
.slide2stv.active:before{
   background-image: url(/static/img/calc/okno.svg);
}
.slide2stv.active2:before{
   background-image: url(/static/img/calc/okok.svg);
}

.slide3stv:before {
    content: "";
    background-image: url(/static/img/calc/nonono.svg);
    width: 272px;
    height: 30px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
.slide3stv.active:before{
   background-image: url(/static/img/calc/oknono.svg);
}
.slide3stv.active2:before{
   background-image: url(/static/img/calc/okokno.svg);
}
.slide3stv.active3:before{
   background-image: url(/static/img/calc/okokok.svg);
}

.slide4stv:before {
    content: "";
    background-image: url(/static/img/calc/nononot.svg);
    width: 140px;
    height: 250px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
}
.slide4stv.active:before{
   background-image: url(/static/img/calc/oknonot.svg);
}
.slide4stv.active2:before{
   background-image: url(/static/img/calc/okoknot.svg);
}
.slide4stv.active3:before{
   background-image: url(/static/img/calc/okokokt.svg);
}
.kolstvotok label {
    width: 10%;
    padding-top: 0px;
    padding-left: 35px !important;
}
.calc-form.cwetzm p.formlb {
    margin-top: 30px;
}
.calc-form { display: none; }
.calc-form.active { display: block; }


@media (max-width:768px){
.calc-form .kv label, .calc-formone .kv label{
    font-size: 18px;
    background-size: 30px;
    padding-left: 35px;
    width: 47%;
}
.sposustdostsetki span.vopros + span, .sposustdostzachity span.vopros + span {
    margin-left: auto;
    font-size: 14px;
    width: 180px;
    margin-top: -13px;
    bottom: 0px;
    border: 3px solid #2E5077;
    right: 70px;
}
.sposustdostsetki span.vopros + span:before, .sposustdostzachity span.vopros + span:before {
    height: 25px;
    left: auto;
    right: -7px;
    bottom: auto;
    top: -17px;
}
.razmkolsetki {
    width: 80%;
}
.sliderokon {
    margin-top: 30px;
    width: 100%;
}
section.calculator .calc-form.paramok-slider {
    flex-flow: column;
}
.ukajitecol {
    margin-top: -20px;
    font-size: 18px;
}
section.calculator .calc-form.paramok-slider .kolstvotok label {
    width: 24% !important;
    margin-bottom: -10px !important;
}
#form-okna-parametry-1 .voprosy.kr.vidokna label {
    width: 20%;
    margin-bottom: 50px;
}
section.calculator .calc-form.paramok-slider p.formlb {
    margin-top: 0px;
}
p.formlb {
    margin-top: 20px;
}
#form-okna-cvet-1 label {
    width: 30%;
}
.vidokna label img {
    width: 70px;
}
#form-okna-1 label {
    width: 100%;
}
#form-okna-1 span.vopros {
    position: relative;
    right: 0;
    top: -50px;
    left: 270px;
}
#form-okna-1 span.vopros+span {
    position: relative;
    right: 0;
    left: 40px;
    top: 0px;
    font-size: 14px;
    border: 3px solid #2E5077;;
}
span.vopros+span:before {
    width: 3px;
    bottom: 17px;
    left: 163px;
}
.voprosy.remonta {
    gap: 20px;
}
.voprosy {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}
.stoimost {
    flex-direction: column;
    gap: 10px;
} 
span.final-sum {
    display: inline-block;
} 
.txtformfn {
    flex-wrap: wrap;
    gap: 10px;
}
.txtformfn span {
    width: 100%;
} 
section.calculator-div .fin-ras{
    width: 32%;padding: 20px;
}
section.calculator-div .contaier{
    gap: 10px;padding: 10px;
}
section.calculator-div span.plus{
    margin-top: 20px;
    margin-bottom: 20px;
}


}


@media (max-width:510px){
section.calculator-it form {
    flex-direction: column;
    margin-right: 0px;
    width: 100%;
}
#form-4 label {
    width: 100%;
}
.sposustdostsetki span.vopros + span:before, .sposustdostzachity span.vopros + span:before {
        height: 35px;
        left: auto;
        right: -16px;
        bottom: auto;
        top: -23px;
    }
.vidzamka label span, .cvetzamka label span {
    width: 41vw;
    padding: 6px 15px;
    font-size: 3.7vw;
}
.typekostrukcii span.vopros + span {
    right: 11px;
    bottom: auto;
    top: 0px;
    border: 3px solid #2E5077;
    font-size: 14px;
    background-color: #fff;
    width: 170px;
}
.razmkolsetki {
    width: 100%;
    padding: 20px;
}
.razmkolsetki > div > span:first-child {
    font-size: 20px;
    font-weight: 500;
    color: #2E5077;
    margin-right: 15px;
}
.razmkolsetki input[type="number"]{
    width: 95%;
}
.typekostrukcii span.vopros+span:before {
    transform: rotate(-19deg);
    height: 27px;
    bottom: -27px;
    left: auto;
    right: 20px;
}
.cvetpodokon label img, .cvetsetki label img, .skolkokamervstekle label img {
    width: 27vw;
}
#form-okna-proizvoditel-1 label {
    width: 100%;
}
#form-okna-cvet-1 label {
        width: 47%;
    }
.vidokna label img {
        width: 15vw;
    }
.infostvk {
    flex-direction: column;
    align-items: flex-start;
}
.razmeryokna input {
    width: 100% !important;
}
.razmeryokna {
    flex-direction: column;
}
.cvetokna label img, .typekostrukcii label img {
    width: 75px;
}
.ukajitecol img[src="/static/img/calc/no.svg"] {
    margin-left: 0px;
    margin-right: 6px;
}
section.calculator-it form input.bot-send-mail {
    padding: 10px;
}
section.calculator-div .fin-ras {
    width: 100%;
    padding: 20px;
}
.okna label img, .kakoymaterial img, .vidzamka label img, .cvetzamka label img {
    width: 80%;
}
.calc-form .kr label, .calc-formone .kr label {
    width: 46%;
}
.okna label, .kakoymaterial label, .cvetokna label, .skolkokamervstekle label, .cvetpodokon label, .typekostrukcii label, .cvetsetki label, .vidzamka label, .cvetzamka label {
    background-position: 2% 25%;
}
#form-3 label {
    width: 100%;
}




}