:root {
   --bp-color: #e49a44;
   --bp-rgba: rgba(228, 154, 68, .8);
   --font-special-bp: 'Amatica SC', sans-serif;
   --font-heading-bp: 'Playfair Display';
   --font-heading-second-bp: 'Futura PT', 'Arial Black', 'Arial Bold', 'Gadget', sans-serif;
   --font-content-bp: "Futura PT Book", "Helvetica Neue", Helvetica, Arial, sans-serif;
   --white: #fff;
   --offwhite: #f4f4f4;
   --gray: #6f706f;
   --dark: #292929;
   --dark-rgba: rgba(41, 41, 41, .6);
   --darker: #231F20;
   --black: #000;
   --bp-bg: #FDDEAF;
   --bp-bg-light: #FEF1DD;
   --bp-offwhite: #FFFAF3;
}

@font-face {
   font-family: 'Playfair Display';
   src: url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-Black.eot);
   src: local('Playfair Display Black'), local('PlayfairDisplay-Black'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-Black.eot?#iefix) format('embedded-opentype'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-Black.woff2) format('woff2'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-Black.woff) format('woff'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-Black.ttf) format('truetype');
   font-weight: 900;
   font-style: normal;
   font-display: swap
}

@font-face {
   font-family: 'Playfair Display';
   src: url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-ExtraBold.eot);
   src: local('Playfair Display ExtraBold'), local('PlayfairDisplay-ExtraBold'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-ExtraBold.eot?#iefix) format('embedded-opentype'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-ExtraBold.woff2) format('woff2'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-ExtraBold.woff) format('woff'), url(https://www.woonoutlet07.nl/bp/fonts/PlayfairDisplay-ExtraBold.ttf) format('truetype');
   font-weight: 700;
   font-style: normal;
   font-display: swap
}

@font-face {
   font-family: 'Amatica SC';
   src: url('fonts/subset-AmaticaSC-Bold.eot');
   src: url('fonts/subset-AmaticaSC-Bold.eot?#iefix') format('embedded-opentype'),
      url('fonts/subset-AmaticaSC-Bold.woff2') format('woff2'),
      url('fonts/subset-AmaticaSC-Bold.woff') format('woff'),
      url('fonts/subset-AmaticaSC-Bold.ttf') format('truetype');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'Amatica SC';
   src: url('fonts/subset-AmaticaSC-Regular.eot');
   src: url('fonts/subset-AmaticaSC-Regular.eot?#iefix') format('embedded-opentype'),
      url('fonts/subset-AmaticaSC-Regular.woff2') format('woff2'),
      url('fonts/subset-AmaticaSC-Regular.woff') format('woff'),
      url('fonts/subset-AmaticaSC-Regular.ttf') format('truetype');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

.amatica-bold {
   font-family: 'Amatica SC';
   font-weight: bold;
}

.amatica {
   font-family: 'Amatica SC';
   font-weight: normal;
}

header h1 {
   position: absolute;
   z-index: 0;
}

* {
   font-family: var(--font-content-bp)
}

h1,
h2,
h3,
h3 a,
h4,
h5,
h6 {
   text-transform: inherit;
   color: var(--black)
}

a:hover {
   text-decoration: none;
}

.uppercase {
   text-transform: uppercase
}

.light {
   font-weight: 200
}

.text-center {
   text-align: center
}

.futura-bold {
   font-family: 'Futura PT', 'Helvetica Neue', Helvetica, Arial, sans-serif !important
}

.futura {
   font-family: var(--font-content-bp)
}

.playfair {
   font-family: 'Playfair Display';
   font-weight: lighter
}

.playfair-bold {
   font-family: 'Playfair Display';
   font-weight: 700 !important
}

.line-break {
   width: 100%;
   position: relative;
   display: block;
   margin: 50px 5%;
   padding: 0 5%;
   height: 1px;
   max-width: 80%;
   float: left;
   background: var(--black)
}

ul.horizon li {
   float: left;
   list-style-type: none
}

@media (min-width:768px) {
   .wbp-mobile {
      display: none !important
   }

   .wbp-desktop {
      display: block !important
   }
}

@media (min-width:0) and (max-width:767px) {
   .wbp-mobile {
      display: block !important
   }

   .wbp-desktop {
      display: none !important
   }
}

.gradient-overlay {
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0;
   right: 0;
   left: 0;
   display: block;
   z-index: 3;
   background: #E7B875;
   background: linear-gradient(0deg, rgba(231, 184, 117, 0.25) 0%, rgba(240, 160, 45, 0.59) 100%);
}

.outer {
   width: 100%;
   max-width: 100%;
   float: left;
   position: relative;
   display: block;
   margin: 0;
   padding: 0;
   overflow: hidden
}

.inner {
   padding: 3.5rem 8%
}

.home-banner .img-wrapper {
   width: 100%;
   height: auto;
   float: left;
   position: relative;
   overflow: hidden;
   margin: 0 auto;
   padding: 0
}

.img-wrapper a {
   position: relative
}

.img-wrapper a img {
   width: 100%
}

.cta {
   background: var(--black);
   color: var(--white) !important;
   border: 1px solid var(--black);
   text-decoration: none;
   padding: 1rem 5rem;
   border-radius: 200px;
   font-size: 90%;
   transition: all .5s linear !important;
   border-radius: 50px;
   text-shadow: none
}

.cta.reverse {
   background: var(--white) !important;
   color: var(--black) !important;
   border: 1px solid var(--white) !important
}

.cta.reverse:hover {
   background: var(--bp-color) !important;
   border: 1px solid var(--bp-color) !important;
   color: var(--white) !important
}

.cta.large {
   padding: 1.5rem 5rem;
   border-radius: 50px;
   font-size: 110%
}

.cta:hover {
   text-decoration: none;
   background: var(--white) !important;
   color: var(--black) !important;
}

.cta em {
   margin: 3px 0 0 5px
}

.hvr-grow {
   display: inline-block;
   vertical-align: middle;
   -webkit-transform: perspective(1px) translateZ(0);
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px rgba(0, 0, 0, 0);
   -webkit-transition-duration: 0.3s;
   transition-duration: 0.3s;
   -webkit-transition-property: transform;
   transition-property: transform;
}

.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
}

.center-content .inner {
   width: 90%;
   height: auto;
   float: left;
   position: relative;
   overflow: hidden;
   margin: 0 auto;
   text-align: center;
   padding: 0 5%
}

.center-content h3 {
   font-size: 2.8em
}

.center-content h4 {
   font-family: var(--font-content-bp);
   font-size: 1.8em;
   padding: 10px 0
}

.center-content h3,
.center-content h4 {
   margin: 0
}

.center-content p {
   margin-top: 10px;
   color: var(--gray);
   font-size: 1.1em
}

@media (max-width:1024px) {
   .center-content h3 {
      font-size: 1.8em
   }

   .center-content p {
      font-size: 1em
   }
}

.animated {
   animation-duration: 1s;
   animation-fill-mode: both
}

@media (print),
(prefers-reduced-motion:reduce) {
   .animated {
      animation-duration: 1ms !important;
      transition-duration: 1ms !important;
      animation-iteration-count: 1 !important
   }
}

.fadeIn {
   animation-name: fadeIn
}

@keyframes fadeIn {
   from {
      opacity: 0
   }

   to {
      opacity: 1
   }
}

.hvr-grow-rotate {
   display: inline-block;
   vertical-align: middle;
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px transparent;
   transition-duration: .3s;
   transition-property: transform
}

.hvr-grow-rotate:active,
.hvr-grow-rotate:focus,
.hvr-grow-rotate:hover {
   transform: scale(1.1) rotate(4deg)
}

.hvr-float-shadow {
   display: inline-block;
   vertical-align: middle;
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px transparent;
   position: relative;
   transition-duration: .3s;
   transition-property: transform
}

.hvr-float-shadow:before {
   pointer-events: none;
   position: absolute;
   z-index: -1;
   content: '';
   top: 100%;
   left: 5%;
   height: 10px;
   width: 90%;
   opacity: 0;
   background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, .35) 0, rgba(0, 0, 0, 0) 80%);
   background: radial-gradient(ellipse at center, rgba(0, 0, 0, .35) 0, rgba(0, 0, 0, 0) 80%);
   transition-duration: .3s;
   transition-property: transform, opacity
}

.hvr-float-shadow:active,
.hvr-float-shadow:focus,
.hvr-float-shadow:hover {
   transform: translateY(-5px)
}

.hvr-float-shadow:active:before,
.hvr-float-shadow:focus:before,
.hvr-float-shadow:hover:before {
   opacity: 1;
   transform: translateY(5px)
}

.hvr-icon-forward {
   display: inline-block;
   vertical-align: middle;
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px transparent;
   transition-duration: .1s
}

.hvr-icon-forward .hvr-icon {
   transform: translateZ(0);
   transition-duration: .1s;
   transition-property: transform;
   transition-timing-function: ease-out
}

.hvr-icon-forward:active .hvr-icon,
.hvr-icon-forward:focus .hvr-icon,
.hvr-icon-forward:hover .hvr-icon {
   transform: translateX(4px)
}

/* Hang */
@-webkit-keyframes hvr-hang {
   0% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }

   50% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
   }

   100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }
}

@keyframes hvr-hang {
   0% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }

   50% {
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
   }

   100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }
}

@-webkit-keyframes hvr-hang-sink {
   100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }
}

@keyframes hvr-hang-sink {
   100% {
      -webkit-transform: translateY(8px);
      transform: translateY(8px);
   }
}

.hvr-hang {
   display: inline-block;
   vertical-align: middle;
   -webkit-transform: perspective(1px) translateZ(0);
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.hvr-hang:hover,
.hvr-hang:focus,
.hvr-hang:active {
   -webkit-animation-name: hvr-hang-sink, hvr-hang;
   animation-name: hvr-hang-sink, hvr-hang;
   -webkit-animation-duration: .3s, 1.5s;
   animation-duration: .3s, 1.5s;
   -webkit-animation-delay: 0s, .3s;
   animation-delay: 0s, .3s;
   -webkit-animation-timing-function: ease-out, ease-in-out;
   animation-timing-function: ease-out, ease-in-out;
   -webkit-animation-iteration-count: 1, infinite;
   animation-iteration-count: 1, infinite;
   -webkit-animation-fill-mode: forwards;
   animation-fill-mode: forwards;
   -webkit-animation-direction: normal, alternate;
   animation-direction: normal, alternate;
}

.center-content .inner {
   width: 75%;
   height: auto;
   float: left;
   position: relative;
   overflow: hidden;
   margin: 0 auto;
   text-align: center;
   padding: 5rem 12.5% 5rem 12.5%
}

.center-content h3 {
   font-size: 2.8em
}

.center-content h4 {
   font-size: 1.8em;
   padding: 10px 0
}

.center-content h3,
.center-content h4 {
   margin: 0
}

.center-content p {
   margin-top: 10px;
   color: var(--gray);
   font-size: 1.1em
}

.hvr-bounce-in {
   display: inline-block;
   vertical-align: middle;
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px transparent;
   transition-duration: .5s
}

.hvr-bounce-in:active,
.hvr-bounce-in:focus,
.hvr-bounce-in:hover {
   transform: scale(1.2);
   transition-timing-function: cubic-bezier(.47, 2.02, .31, -.36)
}

.center-block {
   background: #fffbf3;
   margin: 2% 0 4% 0;
   text-align: center
}

.center-block .inner {
   text-align: center;
   padding-bottom: 2%
}

.center-block .horizon {
   width: 100%;
   max-width: 50%;
   margin: 0 auto;
   position: relative;
   display: block;
   overflow: hidden;
   padding: 0
}

.center-block .horizon li a em {
   color: black;
   width: 100%;
   clear: both
}

.center-block .horizon li a {
   color: var(--black);
   display: block
}

.center-block .horizon li {
   width: 33%
}

@media (min-width:0) and (max-width:991px) {
   .center-block .horizon li {
      width: 100%;
      clear: both
   }
}

.bg-off {
   background: #fffbf3 !important
}

.center-block.wat-doen .horizon li a em {
   color: var(--bp-color)
}

.volg-ons {
   background: white !important
}

.page-wrapper .nav-sections {
   z-index: 99999
}

.page-title-wrapper {
   margin-bottom: -81px
}

.page-title-wrapper h1 {
   opacity: 0
}

.btn-wrapper {
   width: 100%;
   position: relative;
   display: block;
   overflow: hidden;
   margin: 0 auto;
   padding: 1em 0;
   text-align: center
}

a.cta.altered {
   background: var(--bp-color) !important;
   color: var(--white) !important;
   border: 1px solid var(--bp-color)
}

a.cta.altered:hover {
   background: var(--black) !important;
   color: var(--white, #fff) !important;
   border: 1px solid var(--black)
}

a.cta.alternative {
   background: var(--black) !important;
   color: var(--white, #fff) !important;
   border: 1px solid var(--black)
}

a.cta.alternative:hover {
   background: var(--bp-color) !important;
   color: var(--black) !important;
   border: 1px solid var(--bp-color)
}

.fade-in-bottom {
   animation: fade-in-bottom 1.3s ease-in-out .3s both
}

.fade-in-bottom-toolate {
   animation: fade-in-bottom 1.3s ease-in-out 4.3s both
}

@keyframes fade-in-bottom {
   0% {
      transform: translateY(50px);
      opacity: 0
   }

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

.focus-in-expand {
   animation: focus-in-expand .8s cubic-bezier(.25, .46, .45, .94) .5s both
}

.focus-in-expand-2 {
   animation: focus-in-expand .8s cubic-bezier(.25, .46, .45, .94) 1s both
}

.focus-in-expand-3 {
   animation: focus-in-expand .8s cubic-bezier(.25, .46, .45, .94) 1.5s both
}

.block-cms-link.widget,
.block-static-block.widget {
   margin-bottom: -1px !important
}

.block,
.sidebar .widget.block:not(:last-child),
.sidebar .widget:not(:last-child) {
   margin-bottom: -1px !important
}

@media (max-width:767px) {
   .block-static-block.widget {
      margin-bottom: -1px !important
   }
}

@keyframes fade-in-fwd {
   0% {
      transform: translateZ(-80px);
      opacity: 0
   }

   100% {
      transform: translateZ(0);
      opacity: 1
   }
}

@media only screen and (max-width:767px) {
   .block-usp {
      padding: 10px 0 !important;
      background: #f4f4f4 !important;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000
   }
}

@media only screen and (max-width:767px) {
   .page-header .panel.wrapper .header.panel {
      height: 70px
   }
}

@media (min-width:768px) {
   header.outer.home-banner.bp {
      margin-top: -2.2em
   }
}

.nav-sections {
   margin-bottom: 0
}

.kenburns-left {
   width: 100%
}

@media (min-width:768px) and (max-width:1200px) {
   ul.level0>li.mega>a.mega {
      font-size: 95% !important
   }
}

.slide-in-bck-bl {
   -webkit-animation: slide-in-bck-bl .6s cubic-bezier(.25, .46, .45, .94) 4s both;
   animation: slide-in-bck-bl .6s cubic-bezier(.25, .46, .45, .94) 4s both;
   position: relative;
   z-index: 999
}

@keyframes slide-in-bck-bl {
   0% {
      -webkit-transform: translateZ(700px) translateY(300px) translateX(-400px);
      transform: translateZ(700px) translateY(300px) translateX(-400px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateZ(0) translateY(0) translateX(0);
      transform: translateZ(0) translateY(0) translateX(0);
      opacity: 1
   }
}

@keyframes slide-in-bck-bl {
   0% {
      -webkit-transform: translateZ(700px) translateY(300px) translateX(-400px);
      transform: translateZ(700px) translateY(300px) translateX(-400px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateZ(0) translateY(0) translateX(0);
      transform: translateZ(0) translateY(0) translateX(0);
      opacity: 1
   }
}

.hvr-grow-rotate {
   display: inline-block;
   vertical-align: middle;
   -webkit-transform: perspective(1px) translateZ(0);
   transform: perspective(1px) translateZ(0);
   box-shadow: 0 0 1px transparent;
   -webkit-transition-duration: .3s;
   transition-duration: .3s;
   -webkit-transition-property: transform;
   transition-property: transform
}

.hvr-grow-rotate:active,
.hvr-grow-rotate:focus,
.hvr-grow-rotate:hover {
   -webkit-transform: scale(1.1) rotate(4deg);
   transform: scale(1.1) rotate(4deg)
}

.fade-in-bottom {
   -webkit-animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1) 1s both;
   animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1) 1s both
}

@keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

@keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

.page-title-wrapper {
   width: 0;
   height: 0;
   display: none;
   visibility: hidden;
   z-index: -99;
   opacity: 0
}

.outer .inner h1 {
   margin: 1% 0 10%;
   font-size: 3em;
   font-weight: 700
}

.home-banner .btn-wrapper {
   margin: 0 auto 10vh auto;
   text-align: center
}

.inner.btn-wrapper {
   margin-top: -15vh;
   margin-bottom: 10vh
}

.in-expand-1 {
   -webkit-animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 1.9s both;
   animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 1.9s both
}

.in-expand-2 {
   -webkit-animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 2.3s both;
   animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 2.3s both
}

.in-expand-3 {
   -webkit-animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 2.5s both;
   animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 2.5s both
}

.in-expand-4 {
   -webkit-animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 3.7s both;
   animation: tracking-in-expand 1.2s cubic-bezier(.215, .61, .355, 1) 3.7s both
}

.fadein-1 {
   -webkit-animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) .5s both;
   animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) .5s both
}

.fadein-2 {
   -webkit-animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 1s both;
   animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 1s both
}

.fadein-3 {
   -webkit-animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 1.5s both;
   animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 1.5s both
}

.fadein-4 {
   -webkit-animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 2s both;
   animation: fade-in 1.2s cubic-bezier(.39, .575, .565, 1) 2s both
}

@keyframes tracking-in-expand {
   0% {
      letter-spacing: -.5em;
      opacity: 0
   }

   40% {
      opacity: .6
   }

   100% {
      opacity: 1
   }
}

@keyframes tracking-in-expand {
   0% {
      letter-spacing: -.5em;
      opacity: 0
   }

   40% {
      opacity: .6
   }

   100% {
      opacity: 1
   }
}

@keyframes kenburns-bottom-right {
   0% {
      -webkit-transform: scale(1) translate(0, 0);
      transform: scale(1) translate(0, 0);
      -webkit-transform-origin: 84% 84%;
      transform-origin: 84% 84%
   }

   100% {
      -webkit-transform: scale(1.25) translate(20px, 15px);
      transform: scale(1.25) translate(20px, 15px);
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom
   }
}

@keyframes kenburns-bottom-right {
   0% {
      -webkit-transform: scale(1) translate(0, 0);
      transform: scale(1) translate(0, 0);
      -webkit-transform-origin: 84% 84%;
      transform-origin: 84% 84%
   }

   100% {
      -webkit-transform: scale(1.25) translate(20px, 15px);
      transform: scale(1.25) translate(20px, 15px);
      -webkit-transform-origin: right bottom;
      transform-origin: right bottom
   }
}

@keyframes bounce-in-bck {
   0% {
      -webkit-transform: scale(7);
      transform: scale(7);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
      opacity: 0
   }

   38% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out;
      opacity: 1
   }

   55% {
      -webkit-transform: scale(1.5);
      transform: scale(1.5);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   72% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }

   81% {
      -webkit-transform: scale(1.24);
      transform: scale(1.24);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   89% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }

   95% {
      -webkit-transform: scale(1.04);
      transform: scale(1.04);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }
}

@keyframes bounce-in-bck {
   0% {
      -webkit-transform: scale(7);
      transform: scale(7);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in;
      opacity: 0
   }

   38% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out;
      opacity: 1
   }

   55% {
      -webkit-transform: scale(1.5);
      transform: scale(1.5);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   72% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }

   81% {
      -webkit-transform: scale(1.24);
      transform: scale(1.24);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   89% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }

   95% {
      -webkit-transform: scale(1.04);
      transform: scale(1.04);
      -webkit-animation-timing-function: ease-in;
      animation-timing-function: ease-in
   }

   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      -webkit-animation-timing-function: ease-out;
      animation-timing-function: ease-out
   }
}

@keyframes fade-in {
   0% {
      opacity: 0
   }

   100% {
      opacity: 1
   }
}

@keyframes fade-in {
   0% {
      opacity: 0
   }

   100% {
      opacity: 1
   }
}

@keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

@keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

.banner-left>* {
   color: var(--black)
}

.breadcrumbs {
   display: none
}

.block-static-block.widget,
.block-cms-link.widget {
   margin-bottom: 30px !important
}

.banner-left h4 {
   font-size: 2vw;
   margin: 2.5% 0
}

section.hero-content {
   position: absolute;
   top: 15%;
   right: 8%;
   bottom: 0;
   left: 8%;
   max-width: 100%;
   width: 84%;
   z-index: 200
}

.hero-content * {
   color: white;
   text-shadow: 3px 3px 8px rgba(0, 0, 0, .4)
}

.hero-content h2 {
   margin: 0;
   padding: 0;
   position: relative;
   overflow: hidden;
   text-transform: uppercase;
   line-height: 1.2
}

.hero-content h2,
.hero-content p {
   font-size: 4vw
}

.hero-content h2 span:nth-of-type(1),
.hero-content h2 span:nth-of-type(3) {
   font-size: 6vw;
   font-weight: lighter
}

.hero-content h2 span:nth-of-type(2) {
   font-size: 4vw;
   font-weight: bolder
}

.hero-content p,
.hero-content small {
   width: 100%;
   display: block;
   text-transform: uppercase
}

.hero-content a.cta {
   text-shadow: 4px 4px 3px rgba(0, 0, 0, 0)
}

.hero-content .btn-wrapper {
   text-align: left
}

@media (min-width:0) and (max-width:768px) {
   .hero-content * {
      text-align: center
   }

   .hero-content h2 {
      font-size: 9vw
   }

   .hero-content p {
      font-size: 7vw
   }

   .hero-content h2 span:nth-of-type(1),
   .hero-content h2 span:nth-of-type(3) {
      font-size: 15vw;
      font-weight: lighter
   }

   .hero-content h2 span:nth-of-type(2) {
      font-size: 8.2vw;
      font-weight: bolder
   }

   .hero-content .btn-wrapper {
      text-align: center
   }
}

.home-title span {
   position: relative;
   overflow: hidden;
   display: block
}

.home-title span::after {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
   height: 100%;
   background: linear-gradient(90deg, rgba(236, 176, 58, .45420174905899857) 0%, rgba(0, 0, 0, 0) 100%);
   animation: a-ltr-after 2s cubic-bezier(.77, 0, .18, 1) forwards;
   transform: translateX(-101%)
}

.home-title span::before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
   height: 100%;
   background: transparent;
   animation: a-ltr-before 2s cubic-bezier(.77, 0, .18, 1) forwards;
   transform: translateX(0)
}

.home-title span:nth-of-type(1)::before,
.home-title span:nth-of-type(1)::after {
   animation-delay: 1s
}

.home-title span:nth-of-type(2)::before,
.home-title span:nth-of-type(2)::after {
   animation-delay: 1.5s
}

.home-title span:nth-of-type(3)::before,
.home-title span:nth-of-type(3)::after {
   animation-delay: 2s
}

@keyframes a-ltr-after {
   0% {
      transform: translateX(-100%)
   }

   100% {
      transform: translateX(101%)
   }
}

@keyframes a-ltr-before {
   0% {
      transform: translateX(0)
   }

   100% {
      transform: translateX(200%)
   }
}

.sale-label:hover {
   text-decoration: none;
   background: var(--white);
   color: var(--black) !important
}

.sale-label strong {
   font-weight: 900 !important
}

.sale-label {
   margin: 0;
   padding: 1.3% 4%;
   font-size: 1.7vw;
   text-transform: uppercase;
   background: var(--black);
   color: #fff;
   line-height: 100%;
   font-weight: 300
}

@media (min-width:0) and (max-width:768px) {
   .sale-label {
      font-size: 6vw
   }
}

.hero-content .cta {
   background: var(--bp-color);
   color: var(--black) !important;
   border: 1px solid var(--bp-color)
}

.hero-content .cta em {
   color: var(--black) !important
}

.hero-content .cta:hover em {
   color: var(--white) !important
}

.hero-content .cta:hover {
   text-decoration: none;
   background: var(--black) !important;
   color: var(--white) !important;
   border: 1px solid black !important
}

.blije-klanten iframe {
   width: 100%;
   border: none;
   outline: none
}

.kenburns-top-right {
   -webkit-animation: kenburns-top-right 20s ease-in both;
   animation: kenburns-top-right 20s ease-in both
}

@-webkit-keyframes kenburns-top-right {
   0% {
      -webkit-transform: scale(1) translate(0, 0);
      transform: scale(1) translate(0, 0);
      -webkit-transform-origin: 84% 16%;
      transform-origin: 84% 16%
   }

   100% {
      -webkit-transform: scale(1.25) translate(20px, -15px);
      transform: scale(1.25) translate(20px, -15px);
      -webkit-transform-origin: right top;
      transform-origin: right top
   }
}

@keyframes kenburns-top-right {
   0% {
      -webkit-transform: scale(1) translate(0, 0);
      transform: scale(1) translate(0, 0);
      -webkit-transform-origin: 84% 16%;
      transform-origin: 84% 16%
   }

   100% {
      -webkit-transform: scale(1.25) translate(20px, -15px);
      transform: scale(1.25) translate(20px, -15px);
      -webkit-transform-origin: right top;
      transform-origin: right top
   }
}

.fade-in-bottom {
   -webkit-animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1.000) 1s both;
   animation: fade-in-bottom .6s cubic-bezier(.39, .575, .565, 1.000) 1s both
}

@-webkit-keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

@keyframes fade-in-bottom {
   0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0
   }

   100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1
   }
}

.frame {
   margin: 0 auto;
   max-width: 100%
}

.frame:after {
   content: "";
   display: table;
   clear: both
}

[class*='bit-'] {
   float: left;
   margin: 0
}

.bit-auto {
   width: auto
}

.bit-1 {
   width: 100%
}

.bit-2 {
   width: 50%
}

.bit-3 {
   width: 33.33333%
}

.bit-4 {
   width: 25%
}

.bit-5 {
   width: 20%
}

.bit-6 {
   width: 16.66667%
}

.bit-7 {
   width: 14.28571%
}

.bit-8 {
   width: 12.5%
}

.bit-9 {
   width: 11.11111%
}

.bit-10 {
   width: 10%
}

.bit-11 {
   width: 9.09091%
}

.bit-12 {
   width: 8.33333%
}

.bit-5 {
   width: 5%
}

.bit-10 {
   width: 10%
}

.bit-15 {
   width: 15%
}

.bit-20 {
   width: 20%
}

.bit-25 {
   width: 25%
}

.bit-30 {
   width: 31.33%
}

.bit-35 {
   width: 35%
}

.bit-40 {
   width: 40%
}

.bit-45 {
   width: 45%
}

.bit-50 {
   width: 50%
}

.bit-55 {
   width: 55%
}

.bit-60 {
   width: 60%
}

.bit-65 {
   width: 64%
}

.bit-70 {
   width: 70%
}

.bit-75 {
   width: 75%
}

.bit-80 {
   width: 80%
}

.bit-85 {
   width: 85%
}

.bit-90 {
   width: 90%
}

.bit-95 {
   width: 95%
}

@media(min-width:0) and (max-width:575px) {
   * {
      font-size: 99%
   }

   [class*='left'],
   [class*='right'] {
      float: none !important
   }

   [class*='bit-'] {
      width: 100%;
      margin: 0 auto
   }

   a.cta {
      margin: 10% auto !important;
      display: inline-block;
      max-width: 200px
   }

   .bit-4,
   .bit-30,
   .bit-35,
   .bit-55,
   .bit-3,
   .bit-65,
   .bit-70 {
      width: 96% !important;
      margin: 1%
   }

   .text-right,
   .text-left {
      width: 98% !important;
      padding: 1%;
      float: none;
      margin: 1% auto;
      text-align: center !important
   }
}

@media(min-width:576px) and (max-width:991px) {

   .bit-55,
   .bit-3,
   .bit-65,
   .bit-70 {
      width: 98% !important;
      padding: 0;
      clear: both
   }

   .bit-30 {
      width: 48% !important
   }
}

@media(min-width:992px) and (max-width:1199px) {

   .bit-55,
   .bit-3,
   .bit-65,
   .bit-70 {
      width: 98% !important;
      padding: 0;
      clear: both
   }

   .bit-30 {
      width: 48% !important
   }
}

.absolute {
   display: block;
   position: absolute;
   z-index: 10;
}

.top {
   top: 0
}

.bottom {
   bottom: 0
}

.centered {
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   text-align: center;
   overflow: hidden;
   margin: 0 auto;
   width: 100%;
   height: auto;
}

header h2 {
   text-transform: uppercase;
   font-size: 10vw;
}

.border-blocks h3 {
   margin: 0 auto;
   text-align: center;
   width: 100%;
   line-height: 200%;
   font-size: 2.5vw;
   margin: 0 0 2.5% 0;
}

.border-blocks .bit-25 {
   border: 5px solid var(--bp-bg);
   padding: 1.5% 2%;
   margin: 1.5% 2.5% 0 0;
   overflow: hidden;
   min-height: 250px;
}

.bg {
   background: var(--bp-bg-light);
   text-align: center;
}

.bg.offwhite {
   background: var(--offwhite);
   text-align: center;
}

.big-text {
   font-family: var(--font-heading-second-bp);
   color: var(--bp-color);
   font-size: 1.8em;
   text-decoration: none;
}

.big-text svg {
   margin: 1em 0 -.5em 0;
}

.big-text svg:hover {
   text-decoration: none
}

@media (min-width:0) and (max-width:991px) {
   .big-text svg {
      display: none
   }
}

.list-wrap ul {
   margin: 0;
   padding: 5%;
}

.list-wrap ul li {
   text-align: left;
   width: 100%;
   list-style-type: none;
}

.list-wrap ul li svg {
   float: left;
   margin: 5px 5% 0 0
}

.right {
   float: right !important;
}

.list span {
   color: #e49a44;
   margin: 0 2.5% 0 0;
   font-size: 2em;
   font-weight: bold;
   line-height: 100%;
   float: left;
}

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

.list {
   margin: 0;
   padding: 0;
   width: 100%;
}

section.you-know strong,
section.you-know strong span {
   font-size: 3vw;
   font-family: var(--font-heading-bp);
   color: var(--bp-color);
}

section h3 {
   font-size: 2.5vw;
   text-transform: uppercase;
   width: 100%;
   position: relative;
   display: block;
   margin: 1em 0 2em;
}

section h4 {
   font-size: 2em;
}

.divider {
   line-height: 100%;
   text-align: center;
}

section.divider .inner {
   padding: 1% 2% !important;
}

section.divider h4 {
   font-size: 3vw;
   margin: 0 auto;
   padding: 0 0 5px 0;
}

header h2 span {
   background: 50% 100%/50% 50% no-repeat radial-gradient(ellipse at bottom, var(--black), transparent, transparent);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
   font-size: 8vw;
   font-family: var(--font-heading-bp);
   -webkit-animation: reveal 3000ms ease-in-out forwards 200ms, glow 5500ms linear forwards 2000ms;
   animation: reveal 3000ms ease-in-out forwards 200ms, glow 5500ms linear forwards 2000ms;
}

@-webkit-keyframes reveal {
   80% {
      letter-spacing: 8px;
   }

   100% {
      background-size: 300% 300%;
   }
}

@keyframes reveal {
   80% {
      letter-spacing: 8px;
   }

   100% {
      background-size: 300% 300%;
   }
}

@-webkit-keyframes glow {
   40% {
      text-shadow: 0 0 4px var(--black);
   }

   100% {
      text-shadow: none;
      color: #000;
   }
}

@keyframes glow {
   40% {
      text-shadow: 0 0 4px var(--black);
   }

   100% {
      text-shadow: none;
      color: #000;
   }
}

@media (max-width:767px) {
   .absolute.centered {
      top: 20%;
   }
}

@media (min-width:0) and (max-width:991px) {
   .bit-25 {
      margin: 2.5% !important;
      min-height: auto!important;
      width: 90%;
   }

   section h3,
   .border-blocks h3 {
      font-size:2em
   }
   section.divider h4 {
  font-size: 6vw;
}

.bit-3 {
   margin:2em 0;
}

section.you-know strong,
section.you-know strong span {
   font-size: 2.2em;
}


}

.you-know {
   padding:0 0 2.5% 0;
}

section.text-center {
   padding:2.5% 0;
}