.calculator-content {
	width: 100%; width: 100%; padding: var(--w-padding) calc( (100% - var(--w-main)) / 2 );  background: var(--c-grey-100); padding-bottom: 36px;
	font-size: 14px; line-height: 16px; font-weight: 500; color: var(--c-grey-800); text-align: center;
}
.calculator-content > .title{
    margin: 0;
    padding: 0 0 48px 0;
    font-size: 58px;
    line-height: 62px;
    letter-spacing: -0.02em;
    font-weight: 600;
    text-align: center;
    color: #000;
}

.calculator-content > .calculator{
	display: block; width: 100%; background: #fff; max-width: 976px;
	border-radius: 12px; position: relative; margin: 0 auto;
}
.calculator-content > .calculator:after{ content: ''; display: block; clear: both; }
.calculator-content > .calculator > .result{
	background: var(--c-theme-d); padding: 24px 40px;
	border-radius: 0 12px 12px 0; position: relative;
	width: 348px; height: 432px; float: right; text-align: center;
	font-size: 16px; line-height: 19px; font-weight: 700; color: #fff;
}
.calculator-content > .calculator > .result .circle{
	display: block; width: 260px; height: 260px; margin: 0 auto 16px auto;
	color: var(--c-theme-d); background: #fff; border-radius: 50%;
}
.calculator-content > .calculator > .result .circle > p{
	color: var(--c-theme-d); margin: 0; padding: 59px 40px 20px 40px;
	font-size: 18px; line-height: 22px; font-weight: 700;
}
.calculator-content > .calculator > .result .circle > span.price{ font-size: 52px; display: block; line-height: 56px; font-weight: 600; letter-spacing: -0.02em; }
.calculator-content > .calculator > .result .circle > span.valute{ font-size: 28px; display: block; line-height: 32px; font-weight: 600; letter-spacing: -0.01em; }
.calculator-content > .calculator > .result > p{
	margin: 0; border-top: 1px solid var(--c-grey-200);
	padding: 16px 0;
}
.calculator-content > .calculator > .result .interest, .calculator-content > .calculator > .result .interest-total{ color: var(--c-theme-l); }

.calculator-content > .calculator > .controls{
	float: left; width: calc(100% - 348px);
	padding: 48px; text-align: left;
	color: var(--c-grey-800);
}
.calculator-content > .calculator > .controls .row{
	border-bottom: 1px solid var(--c-grey-100); padding: 12px 0;
	font-size: 18px;  font-weight: 700; line-height: 22px;
	float: left; width: 100%;
}
.calculator-content > .calculator > .controls .row:first-child{ border-top: 1px solid var(--c-grey-100); }

.calculator-content > .calculator > .controls .row > .title{
	display: block; width: calc(100% - 224px); float: left; height: 32px; line-height: 32px;
}
.calculator-content > .calculator > .controls .row:first-child > .title{ height: 30px; line-height: 30px; }

.calculator-content > .calculator > .controls .row label{
	float: left; width: 200px; text-align: right; margin-left: 24px;
	position: relative; height: 32px;
	font-size: 28px; line-height: 32px; font-weight: 600; letter-spacing: -0.01em;
}
.calculator-content > .calculator > .controls .row label span.valute{ font-size: 18px; line-height: 22px; font-weight: 700; letter-spacing: 0;  }
.calculator-content > .calculator > .controls .row label.radio{ float: right; width: auto; padding-left: 40px;  margin-left: 30px; font-size: 18px; line-height: 30px; font-weight: 700; letter-spacing: 0; }

.calculator-content input[type="radio"]{
	width: 30px; height: 30px; margin: 0; padding: 0;
	-webkit-appearance: none; appearance: none;
  	background-color: #fff;
  	border: 1px solid var(--c-grey-400); border-radius: 15px;
  	display: grid; place-content: center;
  	position: absolute; top: 0; left: 0px;
}
.calculator-content input[type="radio"]::before {
    content: ""; display: block; width: 14px; height: 14px; border-radius: 7px;
    background: var(--c-white);
  	transform: scale(0);
    transition: 120ms transform ease-in-out;
}
.calculator-content input[type="radio"]:checked{ background: var(--c-green); border-color: var(--c-green); }
.calculator-content input[type="radio"]:checked::before {
    transform: scale(1);
}



.calculator-content > .calculator > .controls .row.slider-row{ padding-bottom: 36px; }
.calculator-content > .calculator > .controls .row{ position: relative; }
.calculator-content > .calculator > .controls .row .slider { width: 100%; position: absolute!important; bottom: 12px; left: -12px; }
.calculator-content > .calculator > .controls .row .slider > .dragger {
  background: var(--c-theme-d);
  border: 4px solid #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  border-radius: 12px;
  width: 24px; height: 24px;
}
.calculator-content > .calculator > .controls .row .slider > .track, .calculator-content > .calculator > .controls .row .slider > .highlight-track {
  background: var(--c-theme-d);
  height: 4px;
}

.calculator-content > .calculator > .controls .row > .title{ white-space: nowrap; }
.calculator-content > p:last-child{ margin-bottom: 0; }

@media screen and (max-width:1180px){
	.calculator-content{ padding: 36px 20px; }
	.calculator-content > .title{ font-size: 40px; line-height: 40px; letter-spacing: -0.02em; padding-bottom: 36px; }
	.calculator-content > .calculator > .controls{ padding: 36px 20px; }
}
@media screen and (max-width:850px){
	.calculator-content > p{ text-align: left; }
	.calculator-content > .calculator{ max-width: 628px; }
	.calculator-content > .calculator > .controls{ width: 100%; }
	.calculator-content > .calculator > .result{ width: 100%; border-radius: 0 0 12px 12px; }
}
@media screen and (max-width:550px){
	.calculator-content > .calculator > .controls .row > .title{ width: 100%; }
	.calculator-content > .calculator > .controls .row label{ width: 100%; margin-left: 0; text-align: left; }
	.calculator-content > .calculator > .controls .row label.radio{ float: left; margin-left: 0; margin-right: 24px; }

}