@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,700'); /* Scss Document */ /*====================================
 KLEUREN
 GEBRUIK DE VOLGENDE VARIABELEN:
 $tekst_kleur
 $primaire_kleur
 $secundaire_kleur
 $tertiaire_kleur
 $menu_link_kleur
 $menu_link_kleur_hover
 $button_tekst_kleur
 $link-tekst_kleur
 $tekst_kleur
 THEMA OPTIES
 $breed_logo_desktop
 TYPO
 Paragraaf	Source Sans Pro
 ====================================*/ @keyframes zoominoutsinglefeatured { 0% { transform:scale(1); }

 50% { transform:scale(1.1); }

 100% { transform:scale(1); }

 }

 .zoom { animation:zoominoutsinglefeatured 15s 1; }

 /*====================================
 MIXINS
 ====================================*/ /*====================================
 GENERAL
 ====================================*/ body { font-size:14px; color:#000; font-family:'Montserrat', sans-serif; font-weight:500; }

 :focus { outline:none; }

 ::selection { background:#42a7c6; /* The Fallback */ background:rgba(66, 167, 198, 0.1); color:#42a7c6; }

 .light { font-weight:300; }

 .no-padding { padding:0; }

 .center { text-align:center; }

 .right { text-align:right; }

 .extra-p-r { padding-right:15px; }

 p { line-height:1.5rem; margin-bottom:15px; font-weight:500; }

 .intro-rechts p { margin-bottom:5px; }

 a { color:#42a7c6; text-decoration:underline; }

 a:hover { color:#42a7c6; text-decoration:none; }

 .parallax { /*   background-attachment: fixed;*/ background-position:top; background-repeat:no-repeat; min-height:50vh; background-position-y:-150px; }

 .spacer { min-height:20px; display:block; }

 .lintje { color:#fff; position:absolute; right:35px; top:10px; z-index:9999; font-size:1.7rem; }

 div#preloader { position:fixed; left:0; top:0; z-index:999; width:100%; height:100%; overflow:visible; background:#fff url('../../assets/images/preloader.png') no-repeat center center; }

 /*====================================
 TYPO
 ====================================*/ #header-home h1 { font-size:3rem; }

 h2 { font-size:2rem; margin-bottom:30px; }

 h3 { font-size:1.2rem; margin-bottom:15px; }

 h4 { font-size:1.6rem; }

 h5 { font-size:1.4rem; }

 h6 { font-size:1rem; }

 /*====================================
 FONT SIZES - 1 REM IS 15 PX
 ====================================*/ .rem05 { font-size:0.5rem; }

 .rem06 { font-size:0.6rem; }

 .rem07 { font-size:0.7rem; }

 .rem08 { font-size:0.8rem; }

 .rem09 { font-size:0.9rem; }

 .rem10 { font-size:1rem; }

 .rem11 { font-size:1.1rem; }

 .rem12 { font-size:1.2rem; }

 .rem13 { font-size:1.3rem; }

 .rem14 { font-size:1.4rem; }

 .rem15 { font-size:1.5rem; }

 .rem16 { font-size:1.6rem; }

 .rem17 { font-size:1.7rem; }

 .rem18 { font-size:1.8rem; }

 .rem19 { font-size:1.9rem; }

 .rem20 { font-size:2rem; }

 .rem21 { font-size:2.1rem; }

 .rem22 { font-size:2.2rem; }

 .rem23 { font-size:2.3rem; }

 .rem24 { font-size:2.4rem; }

 .rem25 { font-size:2.5rem; }

 .rem26 { font-size:2.6rem; }

 .rem27 { font-size:2.7rem; }

 .rem28 { font-size:2.8rem; }

 .rem29 { font-size:2.9rem; }

 .rem30 { font-size:3rem; }

 .rem60 { font-size:5rem; }

 .rem50 { font-size:6rem; }

 /*====================================
 FONT KLEUR
 ====================================*/ .tekst-wit { color:#fff; }

 .tekst-zwart { color:#000; }

 .tekst-wit a,.tekst-wit a:link,.tekst-wit a:visited { color:#fff; }

 .tekst-wit a:hover { color:#000; }

 .tekst-primair { color:#42a7c6; }

 .tekst-primair a,.tekst-primair a:link,.tekst-primair a:visited { color:#42a7c6; }

 .tekst-primair a:hover { color:#000; }

 .tekst-secondair { color:#000; }

 .tekst-secondair a,.tekst-secondair a:link,.tekst-secondair a:visited { color:#000; }

 .tekst-secondair a:hover { color:#42a7c6; }

 .tekst-tertiair { color:#000; }

 .tekst-tertiair a,.tekst-tertiair a:link,.tekst-tertiair a:visited { color:#000; }

 .tekst-tertiair a:hover { color:#42a7c6; }

 /*====================================
 VLAK KLEUR
 ====================================*/ .vlak-wit { background-color:#fff; }

 .vlak-lichtgrijs { background-color:#f6f6f6; }

 .vlak-grijs { background-color:#ebebeb; }

 .vlak-primair { background-color:#42a7c6; }

 .vlak-secondair { background-color:#000; }

 /*====================================
 EFFECTEN / ANIMATIES
 ====================================*/ .hoef:hover { opacity:0.8; }

 @keyframes scroll { 0% { opacity:0; }

 10% { transform:translateY(0); opacity:1; }

 100% { transform:translateY(15px); opacity:0; }

 }

 @keyframes bounceScroll { from,20%,53%,80%,to { -webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); }

 40%,43% { -webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform:translate3d(0, -10px, 0); transform:translate3d(0, -10px, 0); }

 70% { -webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform:translate3d(0, -5px, 0); transform:translate3d(0, -5px, 0); }

 90% { -webkit-transform:translate3d(0, -4px, 0); transform:translate3d(0, -4px, 0); }

 }

 .vimeo-wrapper { width:100%; height:290px; overflow:hidden; }

 .vimeo-wrapper iframe { width:100%; height:300px; }

 /*====================================
 INTRO
 ====================================*/ ul.voordelen li { list-style-type:none; margin-bottom:10px; }

 ul.voordelen li:before { font-family:"Font Awesome 5 Pro"; font-weight:400; content:"\f00c"; color:#000; display:inline-block; margin-left:-2em; width:2em; }

 ul.voordelen { padding:0; margin-left:2em; margin-bottom:0; }

 ol.zekerheden { padding:0; margin:0 0 30px 15px; }

 ol.zekerheden li { padding:5px 0 0 15px; }

 /*====================================
 INTRO
 ====================================*/ /*.intro-links, .intro-rechts {
 margin-top: 100px
 }*/ .intro-tekst p { line-height:150%; font-size:1.2rem; }

 /*====================================
 SOCIAL ICONS
 ====================================*/ .social-icons a:hover { color:#42a7c6; }

 .zoek-header { padding-top:22px; width:260px; }

 .zoek-header a { font-size:1rem; }

 .social-icons a:hover,.social-icons-header a:hover { color:#000; }

 ul.social-icons-header { margin:15px 0 5px 0; padding:0; }

 .social-icons a { font-size:0.6rem; display:inline-block; }

 .social-icons-header a { font-size:0.6rem; display:inline-block; color:#42a7c6; }

 /*====================================
 MENU
 ====================================*/ button:focus { outline:none; }

 nav.navbar { background-color:#fff; }

 .navbar-toggler:focus,.navbar-toggler:active { outline:0; }

 .navbar-toggler span { display:block; background-color:#444; height:3px; width:25px; margin-top:6px; margin-bottom:6px; -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg); opacity:1; }

 .navbar-toggler:hover > span { background-color:#42a7c6; }

 .navbar-toggler span:nth-child(1),.navbar-toggler span:nth-child(3) { -webkit-transition:transform 0.35s ease-in-out; -moz-transition:transform 0.35s ease-in-out; -o-transition:transform 0.35s ease-in-out; transition:transform 0.35s ease-in-out; }

 .navbar-toggler:not(.collapsed) span:nth-child(1) { position:absolute; left:12px; top:10px; -webkit-transform:rotate(135deg); -moz-transform:rotate(135deg); -o-transform:rotate(135deg); transform:rotate(135deg); opacity:0.9; }

 .navbar-toggler:not(.collapsed) span:nth-child(2) { height:12px; visibility:hidden; background-color:transparent; }

 .navbar-toggler:not(.collapsed) span:nth-child(3) { position:absolute; left:12px; top:10px; -webkit-transform:rotate(-135deg); -moz-transform:rotate(-135deg); -o-transform:rotate(-135deg); transform:rotate(-135deg); opacity:0.9; }

 .hoofdmenu ul.menu { padding:0; margin:0; display:block; }

 .hoofdmenu ul.menu li { list-style-type:none; margin:7px 0 10px 15px; }

 .hoofdmenu ul.menu li a { color:#000; text-decoration:none; }

 .hoofdmenu ul.menu li a:hover { color:#42a7c6; }

 .hoofdmenu ul.menu li.current_page_item a { color:#42a7c6; }

 .hoofdmenu ul.sub-menu li.current-menu-item a { color:#42a7c6; }

 .hoofdmenu li.current-menu-item a { color:#42a7c6 !important; }

 .hoofdmenu ul li.current_page_parent a { color:#42a7c6; }

 .hoofdmenu ul.sub-menu li a { color:#000; }

 .hoofdmenu ul li.inspring { padding-left:15px; }

 img.headerlogo { width:100%; }

 .navbar-brand { width:100px; }

 .right-menu button { background-color:transparent; border:none; }

 .right-menu ul li { float:left; list-style-type:none; margin-left:15px; }

 .right-menu ul li a,.right-menu ul li i { color:#000; }

 .right-menu ul { margin:0; padding:0; }

 .right-menu a { text-decoration:underline; text-decoration-color:#42a7c6; color:#000; }

 .right-menu i { font-size:1.2rem; }

 nav ul ul.sub-menu { visibility:hidden; opacity:0; transition:visibility 0s linear 0.25s, opacity 0.25s linear; position:absolute; margin-left:5px; padding:10px 15px 10px 5px; background-color:#fff; list-style-type:none; width:auto; display:block; }

 nav ul ul.sub-menu li { display:block; float:none; }

 nav ul li:hover > ul.sub-menu { visibility:visible; opacity:1; transition-delay:0s; }

 /*====================================
 HEADER
 ====================================*/ #headerbeeld { width:100%; height:350px; background-size:contain; background-repeat:no-repeat; background-position:top; }

 #headerbeeld-vervolg { height:45vh; margin-top:62px; background-size:cover; background-repeat:no-repeat; background-position:center; }

 #header-home h1 { margin-top:-40px; text-align:left; color:#000; letter-spacing:0.25px; font-size:3rem; }

 #header-home h2 { text-align:left; letter-spacing:0.25px; font-size:1.5rem; line-height:150%; }

 #intro-kop h1 { font-size:3rem; text-align:left; letter-spacing:0.25px; line-height:150%; }

 .mark-rechts { margin-top:0px; }

 .bg-overlay { width:100%; height:100px; background:linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.45)); position:absolute; bottom:0; z-index:9999; }

 /*====================================
 BREADCRUMBS / BROODKRUIMELS
 ====================================*/ #broodkruimels .container { border-bottom:1px solid #dedede; }

 #breadcrumbs,#breadcrumbs i,#breadcrumbs a { color:#000; }

 /*==================================================
 VERVOLG
 ==================================================*/ #vervolg-intro { margin-top:40px; background-position:top center; background-size:100%; background-repeat:no-repeat; background-color:#fff; background-image:none; }

 #vervolg-intro .foto-rechts { max-height:300px; overflow:hidden; }

 /*====================================
 FORMULIEREN / KNOPPEN
 ====================================*/ a.button { padding:5px 12px; margin:0; display:inline-block; text-decoration:none; font-weight:400; }

 a.button:hover { cursor:pointer; text-decoration:none; }

 .btn-primary { color:#fff; background-color:#42a7c6; border:none; }

 .btn-primary:hover { background-color:#000; color:#fff; }

 .btn-secondary { color:#fff; background-color:#000; border:none; }

 .btn-secondary:hover { background-color:#42a7c6; color:#fff; }

 a.button.button-primair { color:#fff; background-color:#42a7c6; text-decoration:none !important; }

 a.button.button-primair:hover { background-color:#000; color:#fff; }

 a.button.button-secondair { color:#fff; background-color:#000; text-decoration:none !important; }

 a.button.button-secondair:hover { background-color:#42a7c6; color:#fff; }

 a.button.button-wit { color:#000; background-color:#fff; text-decoration:none !important; }

 a.button.button-wit:hover { background-color:#42a7c6; color:#fff; }

 a.button i.fa-long-arrow-right { margin-left:5px; display:inline-block; }

 a.button.button-rood-2 i.fa-arrow-right { visibility:hidden; width:0; }

 textarea,input { color:#a4a4a4; }

 .label-left .nf-field-label { padding-right:2% !important; text-align:left !important; width:100px !important; }

 .nf-form-fields-required { padding:25px 0; }

 .field-wrap .pikaday__container,.field-wrap .pikaday__display,.field-wrap > div input,.field-wrap select,.field-wrap textarea { width:100%; background-color:rgba(66, 167, 198, 0.16); border:none; padding:10px; }

 .field-wrap > div input[type=checkbox],.field-wrap button,.field-wrap input[type=button],.field-wrap input[type=submit] { width:auto; background-color:#42a7c6; color:#fff; padding:5px 10px; }

 .label-left .nf-field-label label { font-weight:500; color:#000; }

 .ninja-forms-req-symbol { color:#000 !important; }

 #nf-form-2-cont .nf-form-fields-required { display:none; }

 .nf-field-label label { font-weight:500 !important; }

 /*====================================
 GOOGLE KAARTJE
 ====================================*/ .kaartje { height:100%; min-height:400px; }

 .kaart { height:400px; }

 /*====================================
 REVIEW SLIDER
 ====================================*/ .review-slider-wrapper { background-color:#555; background-size:cover; background-position:center; }

 .review-slider-wrapper .row-overlay { background:#555; background:rgba(0, 0, 0, 0.71); }

 .review-slider-wrapper p { font-size:1.2rem; line-height:150%; color:#fff; font-weight:500; }

 .review-slider-wrapper hr { color:#fff; background-color:#fff; }

 .review-slider-wrapper span { font-size:1rem; line-height:100%; color:#fff; font-weight:500; }

 .owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span { background:#62b6cf; }

 .item-bg { background-size:cover; height:290px; background-position:center; }

 .owl-carousel .owl-next i,.owl-carousel .owl-prev i { color:#42a7c6; font-size:1.8rem; }

 .owl-carousel .owl-prev { position:absolute; float:left; bottom:50%; left:-30px !important; border:none; border-radius:0; padding:5px 15px 5px 12px; margin:0; }

 .owl-carousel .owl-next { position:absolute; float:left; bottom:50%; right:-30px !important; border:none; border-radius:0; padding:5px 12px 5px 15px; margin:0; }

 .owl-theme .owl-nav [class*=owl-]:hover { background:#fff; color:#000 !important; text-decoration:none; }

 /*====================================
 CARDS
 ====================================*/ .card { border:none; background-color:transparent; width:100%; }

 .card-footer { border:none; background-color:transparent; padding:15px 10px; }

 .card-body { padding:1.25rem 10px; }

 .nieuws-inner h3 { padding:10px 0; margin:0; }

 .bg-foto { height:270px; background-size:cover; background-position:center; }

 /*====================================
 FOOTER
 ====================================*/ footer { margin:0; border-top:5px solid #000; }

 footer .copyright p,footer .copyright a,.breadcrumbs a { font-size:1rem; }

 footer a,.card-body a,#content a { text-decoration:underline; text-decoration-color:#42a7c6; color:#000; }

 .home-body footer { border-top:none !important; }

 ul.footermenu li { list-style-type:none; }

 ul.footermenu li a { text-decoration:none; color:#000; }

 ul.footermenu li:before { font-family:"Font Awesome 5 Pro"; font-weight:400; content:"\f054"; color:#42a7c6; display:inline-block; margin-left:-2em; width:2em; }

 ul.footermenu { padding:0; margin-left:2em; }

 /*====================================
 SCROLL TO TOP
 ====================================*/ .cd-top { display:inline-block; height:40px; width:40px; position:fixed; z-index:9999; bottom:0px; right:0px; color:#fff; background-color:#42a7c6; line-height:27px; overflow:hidden; visibility:hidden; padding:4px 0 0 11px; opacity:0; -webkit-transition:opacity 0.3s 0s, visibility 0s 0.3s; -moz-transition:opacity 0.3s 0s, visibility 0s 0.3s; transition:opacity 0.3s 0s, visibility 0s 0.3s; }

 .cd-top.cd-is-visible,.cd-top.cd-fade-out,.no-touch .cd-top:hover { -webkit-transition:opacity 0.3s 0s, visibility 0s 0s; -moz-transition:opacity 0.3s 0s, visibility 0s 0s; transition:opacity 0.3s 0s, visibility 0s 0s; }

 .cd-top.cd-is-visible { visibility:visible; opacity:1; }

 .cd-top.cd-fade-out { opacity:0.5; }

 /*====================================
 404
 ====================================*/ .viernulvier { text-align:center; width:100%; font-size:50px; }

 .viernulvier h1 { font-size:80px; }

 .viernulvier h3 { font-size:45px !important; }

 .viernulvier a:hover { text-decoration:none; }

 .searchform label { display:none; }

 .searchform input { font-size:1rem; }

 input.search-field { font-size:1rem; width:90%; margin-bottom:30px; padding:5px; }

 /*==================================================
 Bootstrap 4 Media Queries
 ==================================================*/ /* Small devices (landscape phones, 576px and up) */ /* Medium devices (tablets, 768px and up) */ @media (min-width:768px) { .navbar-brand { width:125px; }

 .hoofdmenu ul.menu li { float:left; }

 nav ul ul.sub-menu li { float:none !important; }

 #header-home h1 { margin-top:-115px; font-size:6rem; }

 #intro-kop h1 { font-size:6rem; margin-top:-75px; }

 .parallax { min-height:70vh; background-position:center center; }

 .right-menu i { font-size:1rem; }

 .review-slider-wrapper p { font-size:1.4rem; line-height:170%; }

 .spacer { padding:30px; }

 .intro-tekst p { font-size:1.6rem; }

 .mark-rechts { margin-top:-60px; }

 h2 { font-size:2.5rem; }

 .card { width:50%; }

 }

 /* Large devices (desktops, 992px and up) */ /* Extra large devices (large desktops, 1200px and up) */ /* Extra large devices 2  */ @media (min-width:1600px) { .parallax { min-height:60vh; background-size:cover; /*		background-position-y: -200px;*/ }

 }

 /* Extra large devices 3  */ @media (min-width:1900px) { .parallax { min-height:60vh; background-size:cover; /*		background-position-y: -250px;*/ }

 }

 /* Extra large devices 4  */