.mb_slider{
  position:relative;
  padding:0px;
  z-index:0;
  user-select: none;
  -webkit-user-select: none;width: 100%;
}

.mb_slider *:not(.mb_sliderBar):not(.mb_sliderHandler){
  user-select: none;
  -webkit-user-select: none;
  pointer-events: none;
}

.mb_sliderBar{
  background-color:#ddeefb;
  height: 8px;
  width:1000px;
  border-radius:4px;
  margin-top:40px;
  cursor:default;border:2px solid #eef7fd;
}
.loandtls-rangeslider .mb_sliderBar{width:900px;}



.mb_sliderHandler{
  background-color: #dcedfa; border:6px solid #033a77;
  position: absolute;
  top: -12px;
  left: 0;
  border-radius: 50%;
  cursor: default;
 height: 25px;
width: 25px;
}

.mb_sliderHandler:hover{
  background-color: #c3e7ff;
}

.mb_sliderEnd, .mb_sliderStart, .mb_sliderValue{
  padding:7px;
  position:relative;
  text-align:right;
  top:-5px;
  margin:3px;
  min-width: 50px;
  color:#AAA;
  white-space: nowrap;
  cursor:default;
}

.mb_sliderStart{
  text-align: right;
}

.mb_sliderEnd{
  text-align: left;
}

.mb_sliderRange{
  position:absolute;
  height:100%;
  margin:0;
  top:0;
  background: #06579f !important;
  border-radius: 4px 0 0 4px ;
  cursor:default;
}

.mb_sliderZero{
  background-color: #fafafa;
  position:absolute;
  height:100%;
  margin:0;
  top:0;
  border-radius:4px 0 0 4px  ;
  cursor:default;
}

.mb_sliderZeroLabel{
  font: 12px/12px Arial, sans-serif;
  color: #AAA;
  padding: 5px;
  background-color: #fff;
  margin-left: -4px;
  z-index: -2;
  border-radius: 4px;
  margin-top: -5px;
}

.mb_sliderValueLabel{
text-align: center;
padding: 3px 5px;
color: #003876; font-size:22px;
top: -40px;
margin-left:0;
z-index:-1;
margin-top: -10px;
white-space: nowrap;
min-width: 20px;
left: inherit !important;
right: 0;border: none !important;
}

/*.mb_sliderValueLabel:after{
  content: "";
  position: absolute;
  bottom: -5px;
  width: 0;
  height: 0;
  left:0;
  right: 0;
  margin: auto;
  border-style: solid;
  border-width: 5px 5px 0 5px;
  border-color: #000 transparent transparent transparent;
  display:none;
}*/

.mb_sliderValueLabel.right{
  left: auto!important;
  right: -15px!important;
}

.mb_sliderValueLabel.left{
  left: -15px!important;
  right: auto!important;width: 100%;text-align: right;
}

.mb_sliderValueLabel.right:after{
  left:auto;
  right: 10px;
  margin: auto;
}

.mb_sliderValueLabel.left:after{
  right:auto;
  left: 10px;
  margin: auto;
}

.loan-calculator-main {padding-top: 20px;}
.loan-calculator-box {position: relative;margin-bottom:60px;display: flex;}
.mb_sliderEnd{ display:none !important;}
.mb_sliderStart{ display:none !important;}
.setVal{text-align: center;background: #ddeefb;width: 160px;border-radius: 4px;border: 1px solid #ebfdff; padding:10px 0px;margin-left: 20px;color: #003876;border-bottom: 5px solid #fff;}
.setVal input{ text-align:center; border:none; background:transparent; font-size:17px; color:#003876;}
.setVal:after{ content:'JOD'}
.mb_sliderValueLabel:after{ content:' JOD'}
.loan-calculator-box.loanterm .setVal:after{ content:'Month'}
.loan-calculator-box.loanterm .mb_sliderValueLabel:after{ content:' Month'}
.loan-calculator-box.interestrate .setVal:after{ content:'%'}
.loan-calculator-box.interestrate .mb_sliderValueLabel:after{ content:' %'}
.loan-calculator-box.interestrate small a{color:#0694db;top:30px; position:relative;}
.loan-calculator-box.interestrate small a:hover{color:#003876;}
.loan-calculator-box.interestrate small a i{ display:inline-block; padding-left:20px;}

.loan-calculator-box-content{ position:absolute; right:0px; top:0px; color:#003876; font-size:26px; text-align:right;}
.loan-calculator-box-content small{ display:block; font-size:14px;line-height: 16px;}
.loan-calculator-boxslide{ padding-right:220px; width:100%; display:flex;}
.loan-calculator-box-title{ color:#003876; font-size:22px; position:absolute; left:0px;}




@media only screen and (min-width:1801px) and (max-width:3400px) {


}
@media only screen and (min-width:1451px) and (max-width:1500px) {
.mb_sliderBar{width:920px;}
.loandtls-rangeslider .mb_sliderBar{width:880px;}
}
@media only screen and (min-width:1401px) and (max-width:1450px) {
.mb_sliderBar{width:880px;}
.loandtls-rangeslider .mb_sliderBar{width:880px;}
}
@media only screen and (min-width:1301px) and (max-width:1400px) {
.mb_sliderBar{width:780px;}
.loandtls-rangeslider .mb_sliderBar{width:800px;}


}
@media only screen and (min-width:1200px) and (max-width:1300px) {
.mb_sliderBar{width:710px;}
.loandtls-rangeslider .mb_sliderBar{width:650px;}



}
@media only screen and (min-width:992px) and (max-width:1199px) {
.mb_sliderBar{width:570px;}
.loandtls-rangeslider .mb_sliderBar{width:550px;}


}
@media only screen and (min-width:768px) and (max-width:991px) {
.loan-calculator-boxslide {padding-right:150px;}
.mb_sliderBar{width:400px;}
.loandtls-rangeslider .mb_sliderBar{width:400px;}



}
@media only screen and (max-width:767px) {
.loan-calculator-boxslide {padding-right: 0px;}
.loan-calculator-box-content{ display:none;}
.loan-calculator-box-title,.mb_sliderValueLabel {font-size: 16px;}
.mb_sliderBar{width:100%;}
.loandtls-rangeslider .mb_sliderBar{width:100%;}


}





