.maincalculator {
background:rgba(83,166,88,0.8);
width:100%;
max-width:900px;
margin:0 auto;
padding:10px 5px;
}
.calc_title {
    font-size: 22px;
	font-weight:700;
	text-align:center;
	text-transform:uppercase;
    color: #fff;
    width: 100%;
}
.calc_addtitle {
    font-size: 14px;
	font-weight:700;
	text-align:center;
    color: #000;
	margin-bottom:30px;
}
.calc_addtitle span{
	font-weight:400;
	display:block;
}

.maincalculator h1, h2, h3, h4, h5, h6 {
line-height:normal;
font-weight:normal;
}
.form-group {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-justify-content:flex-start;
justify-content:flex-start;
-webkit-align-items:center;
align-items:center;
margin-bottom:10px;
}
.group-title{
    font-size: 14px;
	font-weight:500;
	text-transform:uppercase;
    color: #fff;	
}
.form-group.w50{
	width:46%;
	margin:0 2% 20px 2%;
	float:left;
}
.form-group.w100{
	width:100%;
}
.form-group.w50 .group-title{
width:100%;
text-align:center;
}
.form-group.w100 .group-title{
width:100%;
text-align:center;
font-size: 18px;
}

.box-filter {
	padding:0;
}
.label {
	background:#ececeb;
	padding:7px 15px;
}
ul.complparametrs .check-compl,
ul.matparametrs .check-material {
	background-color: #00a2de;
	color: #FFF;

}
.complparametrs li span {
font-size:10px;
}
ul.complparametrs,
ul.matparametrs {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap:wrap; 
	flex-wrap: wrap;
	-webkit-justify-content:flex-start;
	justify-content:flex-start;
	-webkit-align-items:stretch;
	align-items:stretch;
	width:100%;
	padding: 8px 0;
	margin:0;
	overflow:hidden;
	min-height:50px;
}
ul.matparametrs li, ul.complparametrs li {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap:wrap; 
	flex-wrap: wrap;
	-webkit-justify-content:center;
	justify-content:center;
	-webkit-align-items:center;
	align-items:center;
	cursor: pointer;
	background: #546556;
	float:left;
	margin:3px 2% 3px 2%;
	list-style:none;
	padding:3px 5px;
	color:#fff;
	text-align:center;
	width:96%;
	height:50px;
	font-size:14px;
	line-height:1.2;
	text-transform:uppercase;
}
.calc-price{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap:wrap; 
	flex-wrap: wrap;
	-webkit-justify-content:center;
	justify-content:center;
	-webkit-align-items:center;
	align-items:center;
	/*width:70%;*/
	margin:0 auto;
	position:relative;
	order:2;
}
.calc-price-item {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap:wrap; 
	flex-wrap: wrap;
	-webkit-justify-content:flex-end;
	justify-content: flex-end;
	-webkit-align-items:center;
	align-items:center;
	color: #fff;
	padding:5px 10px;
	line-height:24px;
	position:relative;
}
.calc-price-item div.price-inner{
	background:#deefdf;
	color:#000;
	min-width:150px;
	text-align:right;
	padding:10px 5px;
	margin-left:10px;
}
.price-label{
	font-size:22px;
}
.pricemin, .pricemax {
	font-size: 24px;
	font-weight:500;
}
.currency{
	display:inline-block;
	/*display: none;*/
}
.currency sup{
	top: -7px;
	font-size:20px;
	color:#ff0000;
}
.pricetooltip{
	opacity:0;
	position:absolute;
	top:51px;
	left:calc(100% - 65px);
	z-index:2;
	min-width:70px !important;
	background:rgba(255,255,255,0.6);
	padding:5px 10px !important;
	font-size:12px;
	line-height:1.2;
	text-align:left !important;
}
.currency sup:hover{
	cursor:pointer;
}
.currency sup:hover + .pricetooltip,
.currency sup:hover ~ .pricetooltip{opacity:1;}


/*Range*/
.range-wrap {
  position: relative;
  margin: 30px 15px 30px 15px;
  width:100%;
  order:1;
  z-index:10;
}
.bubble {
	font-size:22px;
	color:#fff;
	font-weight:700;
  position: absolute;
  /*background: red;
  padding: 4px 12px;  
  border-radius: 4px;*/
  left:0;
  bottom:20px;
  transform: translateX(-50%);
}
.range {
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    border-radius:0;  
    background: #2d7433;
    outline: none;
    opacity: 0.9;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
	border:2px solid #fff; 
    background:#2d7433;
    cursor: pointer;
}

.range::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
	border:2px solid #fff;
    background:#2d7433;
    cursor: pointer;
}
.sval{
	font-size:16px;
	color:#fff;
	position:absolute;
	bottom:-30px;
}
.minval{
	left:0;
}
.maxval{
	right:0;
}
@media screen and (min-width: 375px) {
.calc_title {font-size: 24px;}
.calc_addtitle {font-size: 16px;}
.group-title {font-size: 16px;}
.form-group.w100 .group-title{
font-size: 20px;
}
}
@media screen and (min-width: 480px) {
.group-title{font-size: 20px;}
ul.matparametrs li, ul.complparametrs li {font-size:16px;}

}

@media screen and (min-width: 667px) {
.pricetooltip{
	top:1px;
	left:calc(100% - 10px);
}
.pricetooltip:before{
	position:absolute;
	content:"";
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 6px solid rgba(255,255,255,0.6);
	border-bottom: 6px solid transparent;
	left: -6px;
  	top:calc(50% - 5px);
}
.calc_title {font-size: 26px;}
.calc_addtitle {font-size: 18px;}
.calc_addtitle span{display:inline;}
	}
/*910px*/
@media screen and (min-width: 56.875em) { 
.maincalculator {padding:15px 20px;}
.calc_title {font-size: 26px;}
.calc_addtitle {font-size: 22px;color: #fff;}
.form-group.w50{width:100%;margin:0;float:none;}
.form-group.w100{width:100%;}
.form-group.w50 .group-title{width:30%;text-align:left;font-size:18px;}
.form-group.w100 .group-title{width:30%;text-align:left;font-size:18px;}
ul.complparametrs,
ul.matparametrs {width:70%	}
ul.matparametrs li, 
ul.complparametrs li {width:29%;font-size:16px;}
.calc-price{order:1;}
.range-wrap {order:2;margin: 30px 0 30px 0;}
}
@media screen and (min-width: 1024px) { 
.form-group.w50 .group-title{font-size:20px;}
.form-group.w100 .group-title{font-size:20px;}
}