/* DEFAULTS */

html, body { margin:0px; padding:0px; background:#fff !important; font-family: 'Roboto', sans-serif; }

body a:focus, body a:hover { text-decoration: none; }
:focus { outline: none !important; }

.nopadding { padding:0px !important; }

h1, h2, h3, h4, h5 { font-family: 'Roboto', sans-serif !important; color:#0033a1; }

h2 { color:#0033a1; font-weight:100; margin-bottom:50px; }
h2 span { color:#c20430; font-weight:bold; }
h2 .bold { color:#0033a1; font-weight:bold; }

body p { margin:0 0 25px; }
body a { font-weight:bold; color:#189aea }
body a:hover { color:#0033a1; }

.page p { margin:0 0 31px; }
.contact a { color:#c20430; }

/* EQUAL HEIGHT */
@media (min-width:992px) {
  .row.equal { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }
  .row.equal > [class*='col-'] { display: flex; flex-direction: column; }
}

/* CONTAINER FIX TABLET */
@media (min-width: 768px) and (max-width:992px) {
  .container { width: 100% !important; }
}

/* HEADER */
header { background:#fff; height:90px; border-bottom:#ffd200 solid 5px; box-shadow:1px 2px 1px #888888; position:relative; z-index:9999; }
header .container-fluid .navbar-brand { width: 199px; padding:5px 15px; }

header .navbar-brand>img { width:100%; padding:0px; margin:0px; }

@media (min-width:1024px) {
  header { position:fixed; top: 0!important; z-index:99999; width:100%; height:90px; }
  .forcefullwidth_wrapper_tp_banner{ margin-top: 91px!important; }
}

.stroke { height:6px; background: #dc2c34; /* Old browsers */ background: -moz-linear-gradient(left,  #dc2c34 23%, #76b729 63%, #0c6f6e 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left,  #dc2c34 23%,#76b729 63%,#0c6f6e 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right,  #dc2c34 23%,#76b729 63%,#0c6f6e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dc2c34', endColorstr='#0c6f6e',GradientType=1 ); /* IE6-9 */ }

/* MENU*/
  .collapse .navbar-nav { float:right; padding:31px 20px; }
  .collapse .navbar-nav>li, .collapsing .navbar-nav>li { padding:0 15px; }
  .collapse .navbar-nav>li>a, .collapsing .navbar-nav>li>a { color:#0033a1; padding:0px; font-weight:900; font-size:17px; font-family: 'Roboto', sans-serif; font-weight:bold; }
  .collapse .navbar-nav>li.active>a { border-bottom:#c20430 solid 3px; }
  .collapse .nav>li>a:focus, .collapse .nav>li>a:hover { background-color:transparent; border-bottom:#c20430 solid 3px; }

  .phoneNumber { float:right; border-left:#dcdcdc solid 1px; padding:25px 0 30px 70px; color:#c20430; font-weight:bold; background:url('images/i-phone.png') no-repeat left 30px center; background-size:31px; font-size:20px; font-family: 'Roboto', sans-serif; font-weight:bold; }

  @media (min-width: 769px) {
    .collapse .navbar-nav { float:right; }
  }

  .navbar-toggle { top:30px; }
  .navbar-toggle .icon-bar { background-color:#0033a1; }
  .phoneMobile { float:right; padding:41px 15px 31px; margin-right:10px; border-left:#dcdcdc solid 1px; border-right:#dcdcdc solid 1px; }
  .phoneMobile img { width:31px; }
  .container-fluid>.navbar-collapse { z-index:99999; position:relative; }

  .nav .dropdown-menu { padding:0 25px; width:262px; }
  .nav .dropdown-menu>li>a { border-bottom:#dcdcdc solid 1px; margin:0 25px; padding:10px 0; font-family: 'Roboto', sans-serif; font-weight:300; }
  .nav .dropdown-menu li:last-child a { border-bottom:none; }
  .nav .dropdown-menu>li>a:focus, .nav .dropdown-menu>li>a:hover { background-color:transparent; }

  .navbar-nav>li>.dropdown-menu { box-shadow:none; border-radius:0px; top:40px; left:10px; }
  .navbar-nav .open .dropdown-menu { margin:0px; padding:0px; }
  .navbar-nav .open .dropdown-menu>li>a { color:#189aea; line-height:30px !important; }
  .navbar-nav .open .dropdown-menu>.active>a { background-color:transparent; color:#0033a1; }

  .menuIcons { display:inline-block; }
  .menuText { display:inline-block; color:#0033a1; font-weight:bold; text-transform:uppercase; font-size:16px; margin:-2px 5px 0 0; }

  @media (max-width:767px) {
    header .container-fluid .navbar-brand { width: 110px!important;
      padding: 0px;
      position: relative;
      top: 18px;
      left: 10px; }
    .navbar-brand>img { width:80%; }

    .navbar-toggle { top:15px; }
    .phoneMobile { padding:26px 15px 28px; }

    .navbar-collapse.in, .collapsing { overflow-y:visible; top:-4px; left:-1px; width:110%; }
    .collapse .navbar-nav, .collapsing .navbar-nav { float:none; background-color:#fff; position:relative; top:-1px; padding:20px 20px;  }
    .collapse .navbar-nav>li>a, .collapsing .navbar-nav>li>a { color:#0033a1; border-bottom:#dcdcdc solid 1px; padding:10px 0; }
    .collapse .navbar-nav>li.active>a { border-bottom:none; border-bottom:#dcdcdc solid 1px; }
    .collapse .nav>li>a:focus, .collapse .nav>li>a:hover { border-bottom:#dcdcdc solid 1px; }
  }

  @media (max-width:360px) {
    .navbar-header .navbar-brand { width:86px; top:28px; }
    .navbar-brand>img { width:100%; }
  }

/* SLIDER */
.rev_slider_wrapper { box-shadow:1px 2px 1px #888888; }
.rev_slider_wrapper .tp-dottedoverlay.twoxtwo { background:rgba(0,0,0,0.2); z-index: 1; }

.slideText { position:absolute; top:75px; left:26px; width:800px; } /* top:137px; */
.slideText h1 { text-shadow:0px 0px 20px #3f3f3f; font-size:55px; margin-bottom:20px; }
.slideText .textBox { font-family: 'Roboto', sans-serif; font-size:30px; text-shadow:0px 0px 20px #3f3f3f; }
.slideText .textBox span { color:#c20430; }

.slideText .textBox:nth-child(2) { display:inline-block; width:30%; float:left; line-height:35px; }
.slideText .textBox:last-child { display:inline-block; width:60%; font-weight:bold; line-height:35px; }

@media (max-width:767px) {
  .slideText { top:0px; left:0px; width:500px; }
  .slideText h1 { font-size:36px; text-align:center; }
  .slideText h1:after { content:'/'; color:#c20430; margin-left:10px; }
  .slideText .textBox { font-size: 20px; line-height: 24px !important; }

  .slideText .textBox:nth-child(2) { display:none; }
  .slideText .textBox:last-child { text-align:center; width:480px; }
}

@media (max-width:480px) {
  .slideText { top:0px; left:0px; width:340px; margin:0 auto; }
  .slideText .textBox { font-size: 20px; line-height: 24px !important; }  
  .slideText .textBox:last-child { text-align:center; width:336px; margin:0 auto; }
  .scrollDown { background: url('images/scroll-down.png') center center; background-size:100%; width:40px; height:40px; display:block; position:absolute; top:290px; left:148px; }
}

@media (max-width:360px) {
  .slideText h1 { font-size:30px; }
  .slideText .textBox { font-size:22px; }
  .slideText .textBox:last-child { width:287px; }
}

/* HOME */

/** intro **/
.introBox { padding: 0 0 70px 0; font-size:17px; }
.introBox h2 { color:#0033a1; font-weight:300; margin:70px 0 40px; font-size:40px; font-weight:300; }
.introBox h2 span { color:#c20430; }
.introBox h2 .bold { color:#0033a1; font-weight:bold; }

.introBox .introText { padding-right:40px; margin-right:20px; border-right:#dcdcdc solid 1px; }
.home .introBox .introText p { margin-bottom:40px; }
.introBox .introText .icon { background:url('images/i-ahref.png') no-repeat right center; background-size:18px; padding-right:25px; height:23px; display:inline-block; }

.introText ul { list-style: none; margin:0 0 25px; /* Remove default bullets */ }

.introText ul li::before { 
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #c20430; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */ 
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

@media (min-width:767px) and (max-width:992px) {
  .introBox .introText { min-height:500px; }
}

@media (min-width:993px) {

  .introBox .introText { min-height:315px; }
}

@media (max-width:780px) {

  .introBox .uspBox li{ font-size:1.2rem!important; }

}

@media (max-width:767px) {

  .introBox .introText { border-bottom:#dcdcdc solid 1px; border-right:none; margin-right:0px; padding-right:0px; padding-bottom:55px; }

  .page .introBox h2 { margin-top:50px; font-size:29px; }
  .page .introBox .introText { padding-bottom:40px; font-size:15px; }
}

.introBox .uspBox { margin:-5px 0 0 0; padding:0px; }
.introBox .uspBox li { background: url('images/i-ok.png') no-repeat left 8px center; background-size:24px; list-style-type:none; padding:8px 0 8px 50px; font-weight:bold; color:#0033a1; font-size:18px; }

@media (min-width:768px) and (max-width:992px) {
  .introBox .col-sm-4 { padding-left:0px; }
  .introBox .introText { margin-right:0px; }
}

/** services **/
.serviceBox { background:#f2f4f7; padding:60px 0; }
.serviceBox p { margin-bottom:40px; }

.serviceBox .row { margin: 20px 0; }

.serviceBox .bg { height:362px; }

.serviceBox .textBox { padding:20px 40px 25px 40px; height:100%; }
.serviceBox .textBox h2 { font-weight:300; font-size:38px; margin-bottom:40px; font-weight:300; }
.serviceBox .textBox h2 span { font-weight:bold; }


.serviceBox .textBox.blue {
  font-size:16px;
  position:relative;
  color:#ffd200;
  background-color: rgba(0,51,161,1);
  background: -moz-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%);
  background: -webkit-linear-gradient(top,rgba(0,51,161,1), rgba(0,38,104,1) 100%);
  background: -o-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%);
  background: -ms-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%);
  background: linear-gradient(to bottom, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%);
  height: 362px;
}

.serviceBox .textBox.blue:before { content:''; background:url('images/left-arrow.png') no-repeat; width:18px; height:29px; display:block; position:absolute; left:-18px; top:55px; }
.serviceBox .textBox.blue a { border-radius:5px; padding:10px 45px 10px 25px; color:#0033a1; background:#ffcc00 url('images/i-ahref.png') no-repeat right 15px center; background-size:18px; display:inline-block; }
.serviceBox .textBox.blue a:hover { background:#c20430 url('images/i-ahref-hover.png') no-repeat right 15px center; background-size:18px; color:#fff; }
.serviceBox .textBox.blue h2 { color:#ffd200; font-weight:300; }
.serviceBox .textBox.blue h2 .bold { color:#ffd200; font-weight:bold; }

.serviceBox .textBox.yellow { font-size:16px; position:relative; color:#0033a1; background: rgba(255,208,0,1); background: -moz-linear-gradient(top, rgba(255,208,0,1) 0%, rgba(253,214,30,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,208,0,1)), color-stop(100%, rgba(253,214,30,1))); background: -webkit-linear-gradient(top, rgba(255,208,0,1) 0%, rgba(253,214,30,1) 100%); background: -o-linear-gradient(top, rgba(255,208,0,1) 0%, rgba(253,214,30,1) 100%); background: -ms-linear-gradient(top, rgba(255,208,0,1) 0%, rgba(253,214,30,1) 100%); background: linear-gradient(to bottom, rgba(255,208,0,1) 0%, rgba(253,214,30,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd000', endColorstr='#fdd61e', GradientType=0 ); height: 362px;}
.serviceBox .textBox.yellow:before { content:''; z-index:9999; background:url('images/right-arrow.png') no-repeat; width:18px; height:29px; display:block; position:absolute; right:-18px; top:55px; }
.serviceBox .textBox.yellow a { position:relative; border-radius:5px; padding:10px 45px 10px 25px; color:#ffd200; display:inline-block; background: rgba(0,51,161,1); background: -moz-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,51,161,1)), color-stop(100%, rgba(0,38,104,1))); background: -webkit-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%); background: -o-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%); background: -ms-linear-gradient(top, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%); background: linear-gradient(to bottom, rgba(0,51,161,1) 0%, rgba(0,38,104,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0033a1', endColorstr='#002668', GradientType=0 ); }
.serviceBox .textBox.yellow a:hover { color:#fff; background:#c20430; }
.serviceBox .textBox.yellow a:after { content:''; background:url('images/i-ahref.png') no-repeat; background-size:18px; width:18px; height:18px; display:block; position:absolute; top:11px; right:15px; }
.serviceBox .textBox.yellow a:hover:after { background:url('images/i-ahref-hover.png') no-repeat right center; background-size:18px; }

@media (max-width:1024px) {
  .serviceBox .textBox.blue, .serviceBox .textBox.yellow { width:100%; height: 100%; display: table; }
  .serviceBox .textBox h2 { font-size:29px; }
  .serviceBox .bg { height:auto; }
}

@media (min-width:768px) and (max-width:992px) {
  .serviceBox .textBox.blue, .serviceBox .textBox.yellow { height: 414px; }
  .serviceBox .bg { height:414px; }
}

@media (max-width:991px) {
  .serviceBox .textBox a { font-size:12px; }
}

@media (max-width:767px) {
  .serviceBox .bg { height:160px; }

  .serviceBox .textBox { text-align:center; padding:25px; height: 362px;  }
  .serviceBox .textBox h2 { font-size:24px; text-align:center; margin-top:0px; }

  .serviceBox .textBox.blue:before { content:''; background:url('images/top-arrow-blue.png') no-repeat; width:18px; height:29px; display:block; position:absolute; left:50px; top:-11px; }
  .serviceBox .textBox.yellow:before { content:''; z-index:9999; background:url('images/top-arrow-yellow.png') no-repeat; width:18px; height:29px; display:block; position:absolute; right:50px; top:-11px; }
}

/* VERVOLG PAGINA */
.bannerBox { width:100%; height:432px; background-size:cover !important; margin-top:-19px; position:relative; box-shadow:1px 2px 1px #888888; }
.bannerBox h1 { font-size:56px; position:absolute; top:50px; color:#fff; font-weight:100; margin-bottom:50px; top: 50%; transform: translateY(-50%); text-shadow:0px 0px 20px #3f3f3f; }
.bannerBox h1 span { color:#c20430; font-weight:bold; }
.bannerBox h1 .bold { color:#fff; font-weight:bold; }

.infraprojecten { background:url('images/infra.jpg') no-repeat; background-position: left 40%; }
.tuinen { background:url('images/tuinen-home.jpg') no-repeat; background-position: left 30%; }
.woningbouw { background:url('images/woningbouw_banner.jpg') no-repeat; background-position: left center;}
.manegebodems { background:url('images/sport-manege_banner.jpg') no-repeat; background-position: left center;}
.overons { background:url('images/kuub-banner.jpg') no-repeat; background-position: left 40%; }
.bulldozer { background:url('images/banner-bulldozer.jpg') no-repeat; background-position: left center; } 
.edr { background:url('images/edr-banner.jpg') no-repeat; background-position: left 40%; } 
.epr { background:url('images/epr-banner.jpg') no-repeat; background-position: left center; } 

@media (max-width:767px) {
  .bannerBox { height:318px; }
  .infraprojecten { background-position:right center; }
  .tuinen { background-position:left  center; }
  .woningbouw { background-position:left  center; }
  .manegebodems { background-position:right  center; }
  .overons { background-position:left  center; }
}

/* SIDEBAR */
.moreBox ul { margin:0px; padding:0px; }
.moreBox li { margin-bottom:35px; list-style-type:none; padding-left:50px; font-family: 'Roboto', sans-serif; font-weight:bold; color:#0033a1; }
.moreBox a, .contactGegevens a { color:#c20430; display:block; font-weight:bold; word-break:break-all; }

.moreBox .tel { background: url('images/i-tel.png') no-repeat left center; background-size:30px; }
.moreBox .mail { background: url('images/i-apenstaart.png') no-repeat left center; background-size:30px; }
.moreBox .call { background: url('images/i-headphone.png') no-repeat left top; background-size:30px; }
.moreBox .call input { font-weight:100; font-size:15px; padding:12px; width:100%; color:#333; margin:15px 0 30px; border:#dcdcdc solid 1px; }
.moreBox .call input[type="submit"] { background-color:#c20430; color:#fff; border-radius:5px; border:none; font-weight:bold; width:131px; margin:0px; }

input[type="button"] { padding: 10px; background-color:#c20430; color:#fff; border-radius:5px; border:none; font-weight:bold; width:131px; margin:0px; }
/* CONTACT */
.mapsBox {  }
.mapsBox div#mapsBox { margin-top:-20px; width:100%; height: 432px; }

.contactForm { color:#333; }
.contactForm label { color:#0033a1; }
.contactForm input[type="text"], .contactForm input[type="email"], .contactForm input[type="tel"] { border:#dcdcdc solid 1px; border-radius:0px; height:40px; }

.contactForm input[type="radio"] { display:none; }
.contactForm input[type="radio"] + label { color:#0033a1; font-family:Arial, sans-serif; margin-right:20px; }
.contactForm input[type="radio"] + label span { display:inline-block; width:24px; height:24px; margin:-3px 10px 0 0; vertical-align:middle; background:url('images/radio.png') no-repeat; cursor:pointer; }
.contactForm input[type="radio"]:checked + label span { background:url('images/radio-selected.png') no-repeat; }

.contactForm textarea { border:#dcdcdc solid 1px; border-radius:0px; }

.contactForm .btn-primary { background-color:#c20430; border:none; width:131px; font-weight:bold; font-size:16px; padding:12px; margin-top:20px; }
.contactForm .btn-primary:hover { background-color:#0033a1; }

.contactGegevens { color:#0033a1; }

.contactGegevens h3 { font-size:19px; color:#0033a1; font-weight:300; margin-bottom:35px; }
.contactGegevens h3 span { color:#c20430; font-weight:bold; }
.contactGegevens h3 .bold { color:#0033a1; font-weight:bold; }

.contactGegevens ul { margin:0px; padding:0px; }
.contactGegevens li { list-style-type:none; margin-bottom:35px; }
.contactGegevens strong { display:block; }
.contactGegevens a { /*color:#189aea;*/ font-weight:300; }

/* FOOTER */
footer { position:relative; padding:20px 0 35px; }
footer.page { border-top:#f2f4f7 solid 20px; }

footer h2 { font-size:22px; color:#0033a1; font-weight:300; }
footer ul { margin:30px 0 0 0; padding:0px; color:#0033a1; }
footer li { list-style-type:none; font-size:17px; }
footer li b { width:70px; display:inline-block; }
footer a { font-weight:300; }

footer .socialBox { float:right; color:#0033a1; margin-top:65px; }
footer .socialBox img { width:38px; }
footer .socialBox span { margin-right:20px; font-size:20px; position:relative; top:4px; }

@media (max-width:767px) {
  footer { text-align:center; }
  footer ul { text-align:left; margin-left:25px; }
  footer li b { width:80px; }

  footer .socialBox { float:none; }
  footer .scrollup { width: 38px; height: 38px; position:absolute; right:30px; bottom:32px; z-index:66666; background: url('images/scroll-up.png') no-repeat right bottom; cursor: pointer; background-size:100%; }
}

@media (max-width:370px) {

  .slideText h1{
    font-size: 24px;
  }

  .scrollDown {
    top: 250px;
    left:120px;
  }
  .container .row ul li{
    font-size: 15px;
  }

  footer .col-md-6 { padding-left:10px; padding-right:10px; }
}