/* Default CSS */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, span, video {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   background: transparent;
}
table {
   border-collapse: collapse;
   border-spacing: 0;
}
button{
  outline: none !important;
}
input
{
    outline:none !important;
}

h1,h2,h3,h4,h5,h6,p{
  margin:0;
  padding:0;
}
input, button, textarea, select{
  outline: none;
}
.btn.focus, .btn:focus {
  outline: none;
  box-shadow: none !important;
}

ul{
  margin:0;
  padding: 0;
  list-style: none;
}
a{
  margin:0;
  padding:0;
  text-decoration: none;
}
a:hover{
  text-decoration: none;
}
html{
  overflow-x: hidden !important;
}
body{
  font-family: 'Arial';
  font-weight: 400;
  font-size: 16px;
  overflow: hidden;
}
img{
  
  height: auto;
}
h1 {
  color: #FFFFFF;
  font-size: 33px;
  font-weight: 600;
  font-family: 'Arial CE';
}
h2 {
  font-weight: 700;
  font-size: 28px;
  color: #3F5C96;
  line-height: 1.5;
}
h3 {
  font-size: 22px;
  color: #3F5C96;
  font-weight: 700;
  line-height: 1.5;
}
p{
  color: #000;
  font-size: 16px;
  font-weight: 400;
}

/*--------------------Start header area css----------------------*/
.header__main_area{
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 99;
}
.header__content_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 20px 0;
}
.logo__header_top {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.logo a {
  display: block;
  /*max-width: 240px;*/
  font-size:2em;
  color:#fff;
  width: 100%;
}
.menu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  padding-top: 28px;
}
.menu ul:after {
  content: "";
  width: 100%;
  height: 8px;
  background: #C6CBD2;
  top: 0;
  left: 0;
  position: absolute;
  border-radius: 10px;
}
.header__contact ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.header__contact ul li a {
  color: #E6E6E6;
  font-size: 17px;
}
.header__contact ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.menu ul li a span{
  color: #999999;
  font-size: 12.5px;
}
.menu__area {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  margin-top: 68px;
}
.menu ul li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 20%;
          flex: 0 0 20%;
  position: relative;
}
.menu ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #FFFFFF;
  font-size: 20px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
}
.menu ul li:not(:first-child) a{
  padding-left: 23px;
}
.menu ul li a.active:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 8px;
  top: -28px;
  left: 0;
  background: #0278FE;
  z-index: 2;
  border-radius: 10px;
}
.menu ul li:not(:last-child):after{
  content: "";
  position: absolute;
  width: 3px;
  height: 100%;
  background: #C6CBD2;
  right: 0;
  top: 0
}
.header__contact {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 35%;
          flex: 0 0 35%;
}

/*Start Humber Icon Design Css*/
.mobile-menu-icon{
  display: none;
}
.all-p-humber {
  width: 30px;
  height: 18px;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 99;
}
.all-p-humber span {
  display: block;
  position: absolute;
  height: 3px;
  width: 30px;
  background: #FFF;
  border-radius: 0;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  left: 0;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
.all-p-humber span:nth-child(1) {
  top: 0px;
}
.all-p-humber span:nth-child(2), .all-p-humber span:nth-child(3) {
  top: 8px;
}
.all-p-humber span:nth-child(4) {
  top: 16px;
}
.all-p-humber.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}
.all-p-humber.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.all-p-humber.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.all-p-humber.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}
/*End Humber Icon Design Css*/


 /*--------------------Start banner area css----------------------*/
.banner__main_area {
  background: url(../images/banner.png) no-repeat scroll 0 0 / cover;
  padding: 420px 0 290px;
  position: relative;
}
.banner__content_area{
  text-align: center;
}
.banner__content_area p{
  font-size: 20px;
  color: #CCCCCC;
}
.btn_style_1 {
  background: #49c801;
  font-size:1.2rem;
  font-family: 'Arial CE';
  font-weight: bold;
  display: inline-block;
  color: #fff !important;
  padding: 14px 20px;
  border-radius: 40px;
  box-shadow: 2px 8px 5px rgba(0,0,0,0.2);
}
.banner__content_area a{
  margin-top: 23px;
}
.cv__ketel_main_area ul li:nth-child(1) a img{
  max-width: 82px;
  width: 100%;
}
.cv__ketel_main_area ul li:nth-child(2) a img{
  max-width: 71px;
  width: 100%;
}
.cv__ketel_main_area ul li:nth-child(3) a img{
  max-width: 100px;
  width: 100%;

}
.cv__ketel_main_area ul li:nth-child(4) a img{
  max-width: 98px;
  width: 100%;
}
.cv__ketel_main_area ul li:nth-child(5) a img{
  max-width: 129px;
  width: 100%;
}
/*.cv__ketel_main_area ul li a img{
  height: 100px;
}*/

.cv__ketel_main_area ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #FFF;
  box-shadow: 0px 7px 12px rgba(0,0,0,0.30);
  box-sizing: border-box;
}
.cv__ketel_main_area {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -80px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.cv__ketel_main_area ul li a {
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  padding: 32px 30px 29px;
  box-sizing: border-box;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  background: #FFF;
}
.cv__ketel_main_area ul li:not(:last-child) a:after {
  content: "";
  position: absolute;
  width: 3px;
  height: 120px;
  right: 0;
  top: 50%;
  background: #CCCCCC;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.cv__ketel_main_area ul li a span p {
  color: #08254F;
  font-size: 22px;
  line-height: 1.5;
  margin-top: 13px;
}
.cv__ketel_main_area ul li:nth-child(1) a span p {
  margin-top: 14px;
}
.cv__ketel_main_area ul li:nth-child(2) a span p {
  margin-top: 11px;
}
.cv__ketel_main_area ul li:nth-child(3) a span p {
  margin-top: 15px;
}
.cv__ketel_main_area ul li:nth-child(4) a span p {
  margin-top: 16px;
}
.cv__ketel_main_area ul li:nth-child(5) a span p {
  margin-top: 48px;
}
.cv__ketel_main_area ul li a:hover {
  background: #0278FE;
  margin-top: -30px;
}
.ketel__on_changes{
  display: none;
  /*transition: 0.8s ease-in-out;*/
}
.cv__ketel_main_area ul li a:hover .ketel__on_details{
  display: none;
}
.cv__ketel_main_area ul li a:hover .ketel__on_changes {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /*transition: 0.8s ease-in-out;*/
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.ketel__on_changes i {
  width: 40px;
  height: 40px;
  background: #FFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50%;
  margin-top: 10px;
}
.ketel__on_changes p {
  color: #FFF !important;
  font-size: 22px !important;
  margin-bottom: 5px;
}
.cv__ketel_main_area ul li {
  width: 200px;
  height: 215px;
}
/*--------------------Static pages-------------------*/
#content{
  margin-top:95px;
}
#content h1{
  color:#3F5C96;
}
#content h2{
  margin-top:20px;
}
/*--------------------waroom__main_area css-------------------*/
.waroom__main_area{
  padding: 0px 0 89px;
}
.section__heading h1 {
  font-size: 30px;
  text-align: center;
  font-weight: bold;
  color: #3F5C96;
}
.snelle__service{
  margin-top: 50px;
}
.snelle__service ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 800px;
  margin: auto;
  position: relative;
  padding-bottom: 20px;
}
.snelle__service ul li a {
  font-size: 22px;
  font-weight: 500;
  color: #000;
  position: relative;
  display: inline-block;
}
.snelle__service ul:after {
  content: "";
  position: absolute;
  width: 500px;
  height: 7px;
  background: rgba(153,153,153,1);
  bottom: 0;
  left: 42%;
  -webkit-transform: translateX(-45%);
          transform: translateX(-45%);
}
.snelle__service ul li a:after {
  content: "";
  position: absolute;
  left: 94px;
  top: 42px;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  z-index: 2;
  background: rgba(153,153,153,1);
}
.snelle__service ul li:nth-child(2) a:after {
  left: 50px;
}
.snelle__service ul li:nth-child(3) a:after {
  left: 45px;
}
.snelle__service ul li a.active:after {
  background: #0278FE;
  top: 48px;
}
.snelle__service ul li a.active{
  font-size: 30px;
}
.warooM__content_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 80px 0 0px;
}
.waroom__right_area {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}
.waroom__left_area {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}
.waroom__txt {
  padding-left: 50px;
}
.waroom__txt p span{
  display: block;
}
.waroom__images {
  position: relative;
}
.waroom__images img {
  max-width:400px;
}
/* .waroom__images:after {
  content: "";
  position: absolute;
  width: 116%;
  height: 120%;
  background: url(../images/shadow.png) no-repeat scroll 0 0 / cover;
  left: -8%;
  top: -11%;
  z-index: -1;
} */


/*------------Start over__loodigeter_main_area css----------------*/
.over__loodigeter_main_area {
  background: #E6E6E6;
  padding: 50px 0 78px;
}
.over___content_area{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.over__left_area{
  -webkit-box-flex: 0;
      -ms-flex: 0 0 45%;
          flex: 0 0 45%;
}
.over__right_area{
  -webkit-box-flex: 0;
      -ms-flex: 0 0 55%;
          flex: 0 0 55%;
}
.over__loodigeter_content p {
  font-weight: 900;
  font-size: 18px;
  max-width: 365px;
  width: 100%;
}
.over__rijswijk_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-top: 35px;
}
.single__over_items {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(50% - 25px);
          flex: 0 0 calc(50% - 25px);
  margin: auto;
}
.single__over_items p {
  max-width: 240px;
  width: 100%;
  line-height: 1.5;
}
.single__over_items a {
  width: 44px;
  height: 44px;
  background: #0278FE;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #FFF;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  margin-top: 5px;
}

/*------------recensies__main_area css----------------*/
.recensies__main_area {
  background: #08254F;
  padding: 40px 0 50px;
  margin-bottom: 25px;
}
.recensies__single_area h2 {
  font-size: 32px;
  color: #FFF;
}

/*--------rating area-----------*/

.star-rating {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  font-size:1.5em;
  -ms-flex-pack:distribute;
      justify-content:space-around;
  padding:0 .2em;
  text-align:center;
  width:5em;
}

.star-rating input {
  display:none;
}

.star-rating label {
  color: #FFF;
  cursor: pointer;
  font-size: 60px;
}

.star-rating :checked ~ label {
  color: #0278FE;
}

.star-rating label:hover,
.star-rating label:hover ~ label {
  color:#0278FE;
}
.fieldset__box_rating {
  padding-left: 60px;
}
/* explanation */
.recensies__content_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.recensies__content_area p {
    color: #fff;
}
.recensies__content_area h2{
    color: #fff;
}
.recensies__single_area {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(33.33% - 90px);
          flex: 0 0 calc(33.33% - 90px);
  margin: auto;
  position: relative;
  height: 230px;
  margin-bottom: 70px;
}
.recensies__single_area:not(:first-child):after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: -10px;
  top: 17px;
  border: 5px solid #FFF;
  z-index: 0;
}
.recensies__single_area:nth-child(1) {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.33%;
          flex: 0 0 33.33%;
  margin: initial;
}
.recensies__single_area h3 {
  font-size: 19px;
  color: #0278FE;
  font-weight: 600;
  display: inline-block;
  background: #08254F;
  margin-left: 20px;
  padding: 5px;
  position: relative;
  z-index: 2;
}
.recensies__single_area p {
  color: #FFF;
  font-size: 15px;
  max-width: 260px;
  width: 100%;
  padding: 10px;
  position: relative;
  z-index: 3;
}
/*============== footer__main_area css =============*/
.footer__main_area{
  padding:40px 0 100px 0;
  background:#04132A;
}
.footer__content_area{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.footer__left_logo a img {
  max-width: 260px;
}
.footer__left_text {
  padding: 20px 0 0 78px;
}
.footer__left_text p{
  color:#FFF;
  max-width: 175px;
}
.footer__content h4 {
  position: relative;
  padding-left: 10px;
  color:#E6E6E6;
  margin:62px 0 12px 0;
}
.footer__content h4:after{
  content: "";
  position: absolute;
  width: 3px;
  height: 85%;
  background: #C6CBD2;
  left:0;
  bottom:0;
  border-radius:15px;
}
.footer__content ul li {
  position: relative;
  padding-left: 34px;
}
.footer__content ul li:after{
  content: '';
  position: absolute;
  width:25px;
  height:25px;
  background:#0278FE;
  left:0;
  top:5px;
  border-radius:50px;
  border:4px solid #034CA2;
}
.footer__content ul li a{
  color:#FFFFFF;
  font-size:18px;
  display: inline-block;
  padding:5px 0;
}

/*============== Contact__main_area css =============*/
.contact__main_area {
  padding: 230px 0 30px 0;
}
.contact__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom:40px;
}
.contact__content label{
  color:#122E56;
  font-size:25px;
  padding-bottom:8px;
  font-weight: 500;
}
.contact__content input{
  color:#122E56;
  font-size:25px;
  padding:8px 15px;
  background:#E6E6E6;
  border:none;
  width:100%;
}
.contact__content textarea{
  resize: none;
  border:none;
  color:#122E56;
  font-size:25px;
  padding:8px 15px;
  background:#E6E6E6;
  width:100%;
  height:480px;
}
/*============== afspraak__main_area css =============*/
.afspraak__main_area{
  padding:160px 0;
}
.afspraak__main_content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.afspraak__content_left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}
.afspraak__content_right {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  padding-left:40px;
}
.afspraak__content_right p {
  font-size: 23px;
  font-weight: 900;
  color: #272727;
  line-height: 34px;
  padding:20px 0;
}
.afspraak__content_right a{
  margin-top:40px;
}
.afspraak_btn{
  display: inline-block;
  color:#FFFFFF;
  background:#0278FE;
  padding:10px 30px;
  font-size:25px;
  border-radius:40px;
}
.afspraak_btn:hover{
  color:#FFFFFF;
}
/*============== dakwerk__main_area css =============*/
.dakwerk__main_area{
  background:#08254F;
  padding:70px 0 200px 0;
  margin-bottom: 270px;

}
.dakwerk__content_area h2{
  margin-bottom: 50px;
  color:#FFFFFF;
}
.dakwerk__content_area p{
  font-size:29px;
  font-weight:700;
  color:#FFFFFF;
}