.warmtepomp-subsidie{width:100%!important}
.warmtepompCheck{margin-bottom:30px;padding:30px;background-color: #ffffff78;}
.warmtepompCheck .col-md-own{width:20%;float:left}
.warmtepompCheck .no-gutters{margin-right:0;margin-left:0}
.warmtepompCheck .no-gutters .col,.warmtepompCheck .no-gutters [class*="col-"]{padding-right:0;padding-left:0}
.warmtepompCheck .previous{border:1px solid #e5e5e5;background-color:#fff;color:#40403f; width: auto;padding: 6px 12px;margin-top: 0px;}
.warmtepompCheck .intro{margin-bottom:30px}
.warmtepompCheck .warmtepomp-form{position:relative;width:100%;display:block;height: 352px;}
.warmtepompCheck .warmtepomp-form fieldset{position:absolute;left:0;right:0}
.warmtepompCheck .warmtepomp-form fieldset .steps{width:100%;margin-bottom:15px}
.warmtepompCheck .warmtepomp-form fieldset .steps ul{margin:0;padding:0;list-style:none}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li{display:inline-block;background-color:#f3f3f3;width:15%;height:30px;line-height:30px;border-radius:30px;text-align:center;border:1px solid #e5e5e5;position:relative;margin-right:1%}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li:last-child{margin-right:0}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li:last-child:after{display:none}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li:after{position:absolute;content:"";width:24px;height:2px;background-color:#e5e5e5;display:block;margin-top:4px;right:-24px;top:34%}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li.active{background:#0099d8;color:#fff;border:1px solid #0099d8}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li.active:after{background-color:#0099d8}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li.active:hover{background-color:#12426d}
.warmtepompCheck .warmtepomp-form fieldset .steps ul li:hover{background-color:#efefef}
.warmtepompCheck .warmtepomp-form fieldset .question{padding:15px;border:1px solid #e5e5e5;background-color:#fff}
.warmtepompCheck .warmtepomp-form fieldset .question .small{margin-bottom:5px}
.warmtepompCheck .warmtepomp-form fieldset .question h3{margin:0;line-height:28px}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer input{display:none}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer label{display:block;width:100%;margin:0}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option{display:block;width:100%;font-size:16px;cursor:pointer;float:left;border:1px solid #e5e5e5;position:relative;min-height:144px;text-align:center;background-color:#fff}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option:hover{border:1px solid #0099d8}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option .icon{width:80px;display:block;margin-bottom:10px;margin:0 auto;text-align:center;position:relative;height:49px;font-size:25px;margin-top:25px}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option .icon .number{position:absolute;bottom:0}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option .icon img{display:block;margin:0 auto;position:absolute;bottom:0}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option .title{font-weight:400;line-height:28px;line-height:21px;margin-top:10px;display:block}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer .option .checkIcon{display:none}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer input:checked~.option{border:1px solid #0099d8}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer input:checked~.option .line{position:absolute;bottom:0;left:0;right:0;height:2px;background:#0099d8}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer input:checked~.option .checkIcon{display:inline-block;color:#0099d8;font-size:20px}
.warmtepompCheck .warmtepomp-form fieldset .answers .answer.empty{height:59px;display:block;border:1px solid #e5e5e5;border-top:0 none}
.warmtepompCheck .warmtepomp-form fieldset .results{border:1px solid #e5e5e5;padding:15px;background-color:#fff}
.warmtepompCheck .warmtepomp-form fieldset:not(:first-child){display:none}
.warmtepompCheck .warmtepomp-form fieldset .buttons{text-align:right;margin-top:30px}
.ketelDetailTop .description{margin-bottom:30px}
@media (max-width:380px){.warmtepompCheck .col-md-own{width:100%!important}
.warmtepompCheck form{width:100%!important}
.warmtepompCheck form .steps ul li{width:47%!important;margin-bottom:10px!important}
.warmtepompCheck form .steps ul li:first-child,.warmtepompCheck form .steps ul li:nth-child(3),.warmtepompCheck form .steps ul li:nth-child(5){margin-right:3%!important}
.warmtepompCheck form .steps ul li:last-child,.warmtepompCheck form .steps ul li:nth-child(2),.warmtepompCheck form .steps ul li:nth-child(4){margin-right:0px!important}
.warmtepompCheck form .steps ul li:after{display:none!important}
}
@media (max-width:768px){.warmtepompCheck form{width:100%}
.warmtepompCheck form .steps ul li{width:14%!important;margin-right:17px!important}
.warmtepompCheck form .steps ul li:last-child{margin-right:0px!important}
.warmtepompCheck form .steps ul li:last-child:after{display:none}
.warmtepompCheck form .steps ul li:after{width:20px!important;right:-20px!important}
}
@media (max-width:1025px){.warmtepompCheck form{width:100%}
.warmtepompCheck form .steps ul li{margin-right:14px!important}
.warmtepompCheck form .steps ul li:last-child{margin-right:0px!important}
.warmtepompCheck form .steps ul li:last-child:after{display:none}
.warmtepompCheck form .steps ul li:after{width:20px!important;right:-20px!important}
}
.progress-bar{text-align:left;transition-duration:3s}

.progress-perfect .progress-bar {
  background-color: #55c142;
}
.progress-good .progress-bar {
  background-color: #a2c142;
}
.progress-decent .progress-bar {
  background-color: #e09f4f;
}
.progress-bad .progress-bar {
  background-color: #e04f4f;
}
.progress-super .progress-bar {
  background-color: #e04f4f;
}
.warmtepompcheck-formulier {
  display: none;
  text-align: center;
}
  .warmtepompcheck-formulier h2 {
    margin-top: 5px;
  }
  .warmtepompcheck-formulier h4 {
    color: #0099d8 !important;
  }
  .cms-form-type-textarea .cms-form-field {
    height: 150px !important;
  }

.warmtepomp-desc {}
    .warmtepomp-desc .row {
      margin-top: 20px;
      margin-bottom: 20px;
    }

  .warmtepomp-desc .warmtepomp-merken {}
    .warmtepomp-desc .warmtepomp-merken .merken-item {
      padding: 20px;
      background-color: #fff;
      display: inline-block;
      margin-bottom: 25px;
    }
      .warmtepomp-desc .warmtepomp-merken .merken-item .merk-img {
        width: 60%;
        float: left;
      }
      .warmtepomp-desc .warmtepomp-merken .merken-item img {
        max-width: 100%;
      }
        .warmtepomp-desc .warmtepomp-merken .merken-item a.web-link {
          float: right;
          width: 20%;
          display: inline-block;
          padding: 17px 24px;
          background-color: #0099d8;
          color: #fff;
          margin-top: 5px;
          font-size: 18px;
        }
        .warmtepomp-desc .warmtepomp-merken .merken-item a.web-link:hover {
          background-color: #0f4b82;
        }

  .warmtepomp-desc .warmtepomp-geschikt {
    padding: 20px;
    background-color: #f6f6f6;
  }
    .warmtepomp-desc .warmtepomp-geschikt img {
      margin-bottom: 30px;
      max-width: 100%;
    }
    .warmtepomp-desc .warmtepomp-geschikt .row {
      margin-top: 0px;
      margin-bottom: 0px;
    }
    .warmtepomp-desc .warmtepomp-geschikt h2 {
      font-weight: 700;
    }
    .warmtepomp-desc .warmtepomp-geschikt .geschikt-item {
      position: relative;
      padding-left: 27px;
    }
      .warmtepomp-desc .warmtepomp-geschikt .geschikt-item:before {
        content: "\e114";
        font-family: 'Glyphicons Halflings';
        font-style: normal;
        font-weight: 400;
        position: absolute;
        top: -3px;
        left: 0px;
        font-size: 21px;
        color: #44a10a;
      }
  .warmtepomp-desc .warmtepomp-besparen {
    padding: 20px;
    background-color: #fff;
  }
    .warmtepomp-desc .warmtepomp-besparen h2 {
      margin-top: 5px;
    }

  .warmtepomp-desc .warmtepomp-subsidie {}
    .warmtepomp-desc .warmtepomp-subsidie ul {
      margin: 0;
      padding: 0;
      margin-bottom: 20px;
      margin-top: 15px;
      padding-left: 20px;
    }
      .warmtepomp-desc .warmtepomp-subsidie ul li {
        list-style: none;
        position: relative;
        padding-left: 25px;
      }
        .warmtepomp-desc .warmtepomp-subsidie ul li:before {
          display: inline-block;
          font-family: 'Glyphicons Halflings';
          font-style: normal;
          font-weight: 400;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          content: "\e013";
          margin-right: 5px;
          position: absolute;
          left: 0px;
          color:#44a10a;
        }

        .cta {
        	display: inline-block;
        	background: #0099d8;
            border: 1px solid #0c6482;
        	color: #fff;
        	font-size: 14px;
        	font-weight: 700;
        	padding: 6px 12px;
        	border-radius: 4px;
        }