
@font-face {
    font-family: 'nexa_boldregular';
    src: url('nexa_bold-webfont.eot');
    src: url('nexa_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('nexa_bold-webfont.woff') format('woff'),
         url('nexa_bold-webfont.ttf') format('truetype'),
         url('nexa_bold-webfont.svg#nexa_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'nexa_lightregular';
    src: url('nexa_light-webfont.eot');
    src: url('nexa_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('nexa_light-webfont.woff') format('woff'),
         url('nexa_light-webfont.ttf') format('truetype'),
         url('nexa_light-webfont.svg#nexa_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;

} 
@font-face {
  font-family: 'fontello';
  src: url('../_font/fontello.eot?54653734');
  src: url('../_font/fontello.eot?54653734#iefix') format('embedded-opentype'),
       url('../_font/fontello.woff2?54653734') format('woff2'),
       url('../_font/fontello.woff?54653734') format('woff'),
       url('../_font/fontello.ttf?54653734') format('truetype'),
       url('../_font/fontello.svg?54653734#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'fontello';
  src: url('../_font/fontello.eot?19375890');
  src: url('../_font/fontello.eot?19375890#iefix') format('embedded-opentype'),
       url('../_font/fontello.woff2?19375890') format('woff2'),
       url('../_font/fontello.woff?19375890') format('woff'),
       url('../_font/fontello.ttf?19375890') format('truetype'),
       url('../_font/fontello.svg?19375890#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?19375890#fontello') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  color: #69c;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

:hover[class^="icon-"]:before, .active[class*=" icon-"]:before { color: #fff; }
 
.icon-mail:before { content: '\e800'; } /* '' */
.icon-phone:before { content: '\e801'; } /* '' */
.icon-menu:before { content: '\f008'; color: #fff; font-size: 25px; } /* '' */
.icon-facebook:before { content: '\f300'; } /* '' */
.icon-twitter-bird:before { content: '\f303'; } /* '' */
.icon-linkedin:before { content: '\f31a'; } /* '' */
.icon-instagram-filled:before { content: '\f31f'; } /* '' */

A.socialmedia { background-color: #fff; border-radius: 50%; padding: 5px; margin: 0 10px; }
A:hover.socialmedia,
A.active.socialmedia { background-color: #603; }

body { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d1e0f0+0,ffffff+100 */
background: #d1e0f0; /* Old browsers */
background: -moz-linear-gradient(top,  #d1e0f0 0%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #d1e0f0 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #d1e0f0 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1e0f0', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
font-family: verdana, arial, helvetica, sans-serif; }

.container-fluid { overflow: hidden; max-width: 1366px; margin: 0 auto; background-color: #fff; }

.specialismen A { font-family: nexa_lightregular; font-size: 25px; line-height: 30px; font-weight: normal; color: #7daed3; text-decoration: none; border: 0; outline: none;  }

.bovensterij { position: relative; }

.logo { position: absolute; right: 0; top: -54px; z-index: 1; }
.headerlogo { position: absolute; right: 0; top: 0; }

.navbar { background-color: #69c; border-bottom: 1px solid #fff; z-index: 0; }
UL.navbar-nav A.nav-link { font-family: verdana, arial, helvetica, sans-serif; background-image: url(../_img/dot_nav_active.png); background-repeat: no-repeat; font-size: 15px; font-weight: normal; color: #fff; letter-spacing: 0.1em; text-decoration: none; outline: none; background-position: 0 10px; padding: .5rem 0.75rem .5rem 1.2rem !important; }

UL.subnav { list-style: none; padding-left: 4rem; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d1e0f0+0,ffffff+100 */
background: #69c; /* Old browsers */
background: -moz-linear-gradient(left,  #69c 0%, #ffffff 10%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #69c 0%,#ffffff 10%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #69c 0%,#ffffff 10%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1e0f0', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */}
UL.subnav A.nav-link { font-family: verdana, arial, helvetica, sans-serif; background-image: url(../_img/dot_subnav_active.png); background-repeat: no-repeat; font-size: 13px; font-weight: normal; color: #69c; letter-spacing: 0.1em; text-decoration: none; outline: none; background-position: 0 9px; padding: .5rem 0.75rem .5rem 1.2rem !important; }
UL.subnav A:hover.nav-link,
UL.subnav A.active.nav-link { color: #603; }

UL.footernav A.nav-link { font-family: verdana, arial, helvetica, sans-serif; background-image: url(../_img/dot_nav_active.png); background-repeat: no-repeat; font-size: 14px; font-weight: normal; color: #fff; letter-spacing: 0.1em; text-decoration: none; outline: none; background-position: 0 10px; padding: .5rem 0.75rem .5rem 1.2rem; }

UL.navbar-nav A:hover.nav-link,
UL.navbar-nav A.active.nav-link,
UL.footernav A:hover.nav-link,
UL.footernav A.active.nav-link { background-image: url(../_img/dot_nav.png); background-repeat: no-repeat; background-position: 0 10px; color: #603; font-weight: normal; }

UL.navbar-nav A.nav-link.contact { display: inline-block; background-color: #603; color: #fff; background-image: none; }
UL.navbar-nav A:hover.nav-link.contact, UL.navbar-nav A.active.nav-link.contact { color: #69c; }

UL.subnav A:hover.nav-link,
UL.subnav A.contact.nav-link { background-image: url(../_img/dot_subnav.png); color: #603;}

.subnavonderdeel { font-size: 13px !important; }
UL.footernav { list-style: none; padding: 0; }
.activiteiten A { font-family: nexa_lightregular; font-size: 20px; line-height: 30px; font-weight: normal; color: #fff; text-decoration: none; border: 0; outline: none; }
.activiteiten A:hover,
.activiteiten A.active { color: #603; }

.navbar-toggler { padding: 0.5rem 0rem; }

.nopadding { padding-left: 0; padding-right: 0; }

H1 { font-family: nexa_boldregular; font-size: 26px; font-weight: normal; line-height: 29px; color: #603; padding-bottom: 20px; margin: 0; }
H2 { font-family: nexa_boldregular; font-size: 17px; font-weight: normal; line-height: 22px; color: #603; margin: 0; }
.specialdetails H2 { font-size: 16px; }
H3 { font-family: nexa_boldregular; font-size: 17px; font-weight: normal; line-height: 22px; color: #603; margin: -20px 0 20px 0; }
P { font-family: verdana, arial, helvetica, sans-serif; font-size: 14px; font-weight: normal; line-height: 17px; color: #000; padding-bottom: 20px; margin: 0; }
.specialdetails P { font-size: 12px; }
A { color: #69c; text-decoration: none; border: 0; outline: none; }
A:hover,
A.active { color: #603; }
SPAN { font-family: verdana, arial, helvetica, sans-serif; font-size: 12px; font-weight: normal; line-height: 17px; color: #000; }

.detailkolom { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d1e0f0+0,ffffff+100 */
background: #69c; /* Old browsers */
background: -moz-linear-gradient(top,  #69c 0%, #ffffff 80%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #69c 0%,#ffffff 80%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #69c 0%,#ffffff 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1e0f0', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ margin-top: -25px; }
.geenlinks { padding-left: 0; }
.geenrechts { padding-right: 0; }
.img-fluid.geenborder { border: 0; }

UL.opsomming { margin: -20px 0 0 0; padding: 0px 0px 20px 2px; list-style: none; }
UL.opsomming LI { background-image: url(../_img/dot_nav.png);  background-repeat: no-repeat; background-position: 0 0; margin: 0; font-family: verdana, arial, helvetica, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; color: #000; padding-left: 14px; }

.img-fluid { border-bottom: 1px solid #fff; }

.bovenaanmetsub { margin-top: -83px; }
.bovenaan { margin-top: -48px; }

A.btn { background-color: #d1e0f0; border-radius: 0; margin: 0 0 10px 0; }
A.btn P { font-family: nexa_boldregular; font-size: 18px; font-weight: normal; line-height: 23px; color: #603; text-align: center; padding: 0; margin: 0; }
A.btn H2 { font-family: nexa_boldregular; font-size: 24px; font-weight: normal; line-height: 33px; color: #603; text-align: center; padding: 9px 0px 0px 0px; margin: 0; }
A:hover.btn P,
A.active.btn P,
A:hover.btn H2,
A.active.btn H2 { color: #fff; }
A:hover.btn,
A.active.btn { background-color: #603; }
A.btn.contact { background-color: #603; color: #fff; display: inline-block; margin: 10px 0; padding: 10px 20px; border: 2px solid #603; }
A:hover.btn.contact { background-color: #fff; color: #603; }

form { font-family: verdana, arial, helvetica, sans-serif; font-size: 14px; font-weight: normal; line-height: 17px; color: #000; padding-bottom: 20px; margin: 0; }

.form-control { font-size: 14px; font-weight: normal; }
label { font-weight: bold; }
.btn { background-color: #603; border-radius: 0; margin: 0 0 10px 0; color: #fff; font-family: nexa_boldregular; font-size: 18px; font-weight: normal; line-height: 23px; }
:hover.btn { color: #603; background-color: #d1e0f0; }

footer { background-color: #69c; }
footer .contact A { color: #fff; }
footer .contact A:hover,
footer .contact A.active { color: #603; text-decoration: none; border: 0; outline: none; }
footer .contactgegevens { font-size: 14px; }

@media only screen and (max-width: 992px) {
    /* Style adjustments for viewports that meet the condition */

UL.footernav A.nav-link,
UL.footernav A:hover.nav-link,
UL.footernav A.active.nav-link { background-image: none; }
UL.opsomming { padding: 0px 0px 0px 2px; }
.bovenaan,
.bovenaanmetsub { margin: -20px 0 0 0; }
.img-fluid { max-width: 75%; }
.img-fluid.home { max-width: 100%; }
.detailkolom { margin-top: -25px; }
.logo { top: -100px; }

}

@media only screen and (max-width: 767px) {
.img-fluid { max-width: 50%; }
.detailkolom { margin-top: 0; }
}
