body{
  font-family: 'Lato', sans-serif;
    font-weight: 400;
}
.box-roi{
    padding: 20px;
    background: #fff;
    color: #000;
    margin-bottom: 20px;
    box-shadow: 0px 10px 30px 0px rgb(0 0 0 / 20%);
}
.vertical-center{
  margin: 0;
  position: absolute;
  top: 45%;
  left: 18%;
  float: center;

}
.box-info{
  background-color:#dedede;
  padding:0px 5px;
  border-radius:3px;
  float :right !important;
  margin-right:7px;
}
#metal-bending-calc .box-result{
  border:solid 5px #efefef;
  padding:5px;
  font-size:12px;
  margin:0px !important;
}
#metal-bending-calc .input-md{
  margin-bottom:2px !important;
}
#metal-bending-calc .form-group{
  margin-bottom:5px !important;
}
#metal-bending-calc .th-result{
  background-color: #fff;
  vertical-align: middle;
  width: 16.667%;
  font-size: 12px;
  border:solid 5px #ececec;
  border-bottom:none;
}
#metal-bending-calc.td-result{
  border:solid 5px #efefef !important;
  border-top:none !important;
}
#metal-bending-calc .result-value{
  border:solid 1px #efefef;
  padding:10px;
  margin-top:10px !important;
}
#metal-bending-calc .result{
  border:solid 1px #c0c0c0;

  padding:10px; 
  margin-top:5px;
}
#metal-bending-calc .result-value{
  margin:0px;
}

.box-roi > h3:first-of-type{
    border-radius: 3px 3px 0 0
}

.box-roi > h3:not(:first-of-type){
    margin-top:10px !important;
}

.box-roi .form-group {
    margin-right: -10px;
    margin-left: -10px;
}

.box-roi .button_action_container{
    margin-top:5px;
    margin-bottom: 0px;
}
.box-roi > .form-group{
  margin-bottom:2px !important;
}
#press-brake-calc.noUi-handle{

      width: 0;
      height: 0;
      border-left: 50px solid transparent;
      border-right: 50px solid transparent;
      border-top: 100px solid #f96506;
}

.noUi-handle {
  background: transparent !important;
  border-radius : none !important;
  top :-25px !important;
  cursor:grab;
  right: -25px !important;
  width: 0;
      height: 0px;
      border-left: 25px solid transparent;
      border-right: 25px solid transparent;
      border-top: 35px solid #f96506;
      border-radius: 50%;
}
.noUi-handle:hover {
  background: transparent !important;
  border-radius : none !important;
  top :-25px !important;
  cursor:grab;
  right: -25px !important;
  width: 0;
      height: 0px;
      border-left: 25px solid transparent;
      border-right: 25px solid transparent;
      border-top: 35px solid #f96506;
      border-radius: 50%;
}
.noUi-active {
  background: transparent !important;
  border-radius : none !important;
  top :-25px !important;
  cursor:grab;
  right: -25px !important;
  width: 0;
      height: 0px;
      border-left: 25px solid transparent;
      border-right: 25px solid transparent;
      border-top: 35px solid #f96506;
      border-radius: 50%;
}
.noUi-target {
  background: #FFF;
  border: 1px solid #efefef;
}
.noUi-connect {
  background: #FFF;
  opacity: 20%;
}
.noUi-horizontal {
  height: 14px;
}
.noUi-handle{
  box-shadow: none; 
}
.noUi-pips-horizontal{
  padding :0px !important;
  top:30%;
}
.noUi-horizontal .noUi-tooltip {
  bottom:20%;
}
.noUi-tooltip{
  border-radius: 0px !important;
  padding : 1px 2px !important; 
  font-size: 12px !important;
  font-weight: bold;
  border: none !important;
  top:-33px !important;
  color:#fff !important;
  background-color: transparent; !important;
}
#press-break-calc .input-md{
  width:100%;
  margin-bottom: 0px !important;
}

label > input{ /* Menyembunyikan radio button */
          /*visibility: hidden; */
          position: absolute;
          bottom:-25px !important;
        }
        label > input + img{ /* style gambar */
          cursor:pointer;
          border:2px solid transparent;
        }
        label > input:checked + img{ /* (RADIO CHECKED) style gambar */
          border:3px solid #f96506;
    box-shadow: 10px 20px 40px 10px rgb(0 0 0 / 30%);
        }
.press-option .col-sm-2{
  padding:2px !important;
}

.press-option .radio-inline{
  padding:0px !important;
}
.img-option{
  padding:0px !important; 
}
.box-option{
  padding: 5px 0px;
  border:solid 2px #dedede;
  padding-bottom: 15px !important;
}

.panel-heading {
  position: relative;
}

.panel-heading[data-toggle="collapse"]:after {
  font-family: 'Glyphicons Halflings';
  content: "\e072"; /* "play" icon */
  position: absolute;
  color: #f96506;
  font-size: 18px;
  line-height: 22px;
  left: 10px;
  margin-right:10px;
  top: calc(50% - 12px);
  /* rotate "play" icon from > (right arrow) to down arrow */
  -webkit-transform: rotate(-90deg);
  -moz-transform:    rotate(-90deg);
  -ms-transform:     rotate(-90deg);
  -o-transform:      rotate(-90deg);
  transform:         rotate(-90deg);
}
.panel-heading[data-toggle="collapse"].collapsed:after {
  /* rotate "play" icon from > (right arrow) to ^ (up arrow) */
  -webkit-transform: rotate(90deg);
  -moz-transform:    rotate(90deg);
  -ms-transform:     rotate(90deg);
  -o-transform:      rotate(90deg);
  transform:         rotate(90deg);
}
#press-break-calc .panel-title{
  margin-left: 20px;
}
.panel-default>.panel-heading{
  background-color: #efefef;
}
.panel-default>.panel-heading:hover{
  background-color: #dedede;
}
.radio-inline.bottom-20{
  margin-bottom: 20px !important;
}
input[type=radio]{
  transform:scale(1.5) !important;
  position: absolute;
  right : 10px !important;
}
label.top10{
  margin-top: 10px!important;
}
.top-pad{
  margin-top:15px !important;
}

.bottom-pad{
  margin-bottom: 15px !important;
}.bottom-zero{
  margin-bottom: 0px !important;
}
hr.press {
  border-width: 6px;
  border-color: #ced4da;
  width: 55px;
  margin: 15px !important;
  background-color: #ced4da !important;
  text-align: left !important;
}
hr.fix-bottom{
  text-align:left !important;
  position:absolute;
  bottom:-20px;
}