@charset "UTF-8";
@-ms-viewport { width: device-width;}
@-o-viewport { width: device-width;}
@viewport { width: device-width; }
/* --------------------------------- RESET  ----------------------------------------- */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0}
* {  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
body{-webkit-text-size-adjust:none}
.red_star{color:red;visibility:hidden;font-size:22px;line-height:15px}
/* --------------------------------- BASIC & GENERAL   ----------------------------------------- */
body,input,select,textarea,h2,h3,h4,h5,h6{font-family:'Open Sans',Arial,sans-serif}
h1,h2{font-family:'Heebo',Arial,sans-serif}
body,input,select,textarea{font-size:16px;font-weight:400;line-height:1.65em}
a{-moz-transition:color .2s ease-in-out,border-bottom-color .2s ease-in-out;-webkit-transition:color .2s ease-in-out,border-bottom-color .2s ease-in-out;-ms-transition:color .2s ease-in-out,border-bottom-color .2s ease-in-out;transition:color .2s ease-in-out,border-bottom-color .2s ease-in-out}
strong,b{font-weight:700}
em,i{font-style:italic}
h1,h2,h3,h4,h5,h6{color:#000;font-weight:900;line-height:1em;margin:0 0 .5em}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:inherit;text-decoration:none;letter-spacing:0}
h1{font-size:9.5em;line-height:1em;margin:0}
h2{font-size:3em;line-height:1.5em}
h3{font-size:1.5em;line-height:1.5em}
h4{font-size:1.3em;line-height:1.5em}
h5{font-size:.9em;line-height:1.5em}
h6{font-size:.7em;line-height:1.5em}
sub{font-size:.8em;position:relative;top:.5em}
sup{font-size:.8em;position:relative;top:-.5em}
hr{border:0;border-bottom:solid 2px #e5e5e5;margin:2em 0}
hr.major{margin:3em 0}
pre{-webkit-overflow-scrolling:touch;background:#f8f8f8;border-radius:6px;border:solid 1px #e5e5e5;font-family:monospace;font-size:.9em;line-height:1.75em;margin:0 0 2em;overflow-x:auto;padding:1em 1.5em}
code{background:#f8f8f8;border-radius:6px;border:solid 1px #e5e5e5;font-family:monospace;font-size:.9em;margin:0 .25em;padding:.25em .65em}
.text-left{text-align:left}
.text-center{text-align:center}
.text-right{text-align:right}
.clear{clear:both;float:none;width:100%}
.mobHide{display:block}
.mobShow{display:none}
.clearfix{display:block}
.clearfix::after{content:"";clear:both;display:table}
.CircleImg{border-radius:50%}
.img-responsive{max-width:100%}
section.padding,div.padding{padding:40px 10px}
p.padding{padding:0 0 20px}
.platteText{max-width:700px;padding:30px 0}
/* --------------------------------- SITES & WIDTHS  ----------------------------------------- */
.site-width{max-width:1200px;margin:0 auto;padding:0 10px}
#nav-trigger,#nav-trigger span{width:50px;height:49px}
/* --------------------------------- COLORS  ----------------------------------------- */
/* COLORS */
body{background:#fff;color:#000}
input,select,textarea{color:#000}
h3{color:#000}
a{color:#000;text-decoration:underline}
a:hover{color:#000;background-color:#c40f2e}
/* Brand colors */
.accentKleur{color:#c40f2e}
.button{background-color:#000;color:#fff;border:2px solid #000}
.button:hover{background-color:#c40f2e;color:#fff;border:2px solid #000}
.hollow-button{background-color:rgba(0,0,0,1);/*border:2px solid #fff*/}
.hollow-button:hover{border-color:#fff;color:#fff;background-color:#c40f2e}
.button.wit{background-color:#fff;color:#000;border:2px solid #fff}
.button.wit:hover{background-color:#c40f2e;color:#fff;border:2px solid #fff}
.bgColor1{background-color:#fff;color:#000}



.bgColor2{background-color:#c40f2f;color:#fff}
.bgColor2 a {color:#fff}
.bgColor2 a:hover {color:#000}

.bgColor3{background-color:#000;color:#fff}
.bgColor3 a {color:#fff}

.bgColor3 h1,.bgColor3 h2,.bgColor3 h3{color:#fff}
.bgColor4{background-color:#e2e2e2}
.bgColor5,.bgColor5 h2,.bgColor5 h3{background-color:#f04c23;color:#fff}
.icon.major.accentEmpty{background:none;color:#000;height:3rem;line-height:2.5em;margin:0}
.icon.major.accentEmpty2{background:none;color:#fff;height:3rem;line-height:2.5em;margin:0}
.icon.major.accent1{background:#000;color:#fff}
.icon.major.accent2{background:#fff;color:#000}
.icon.major.accent3{background:#1A535C;color:#fff}
.icon.major.accent4{background:#FF6B6B;color:#fff}
.icon.major.accent5{background:#646464;color:#fff}
#header{background-color:#fff}
#footer{background:#fff}
#footer .copyright{color:#222}
/* --------------------------------- HEADER  ----------------------------------------- */
#header{width:100%;position:relative;padding:0;display:block;clear:both}
#header .logo{width:280px;float:left;padding:11px 5px 12px}
#header .logo a{display:block;border-bottom:none}
header .logo img{display:block;width:100%;height:auto;max-width:100%;max-height:100%}
/* --------------------------------- MENU & NAV  ----------------------------------------- */
#nav{float:right;font-size:14px;font-weight:700;padding:0;z-index:999;text-transform:uppercase}
/* --------------------------------- BUTTONS  ----------------------------------------- */
.button{display:inline-block;margin:10px;padding:12px 30px;-webkit-transition:background-color 300ms ease;transition:background-color 300ms ease;font-size:16px;line-height:21px;font-weight:700;text-align:center;text-decoration:none;letter-spacing:1px;text-transform:uppercase;min-width:145px}
.hollow-button{display:inline-block;margin-right:10px;margin-left:10px;padding:10px 30px;-webkit-transition:background-color 300ms ease,border 300ms ease,color 300ms ease;transition:background-color 300ms ease,border 300ms ease,color 300ms ease;color:#fff;line-height:21px;font-weight:700;letter-spacing:1px;text-decoration:none;text-transform:uppercase}
/* --------------------------------- GRID  ----------------------------------------- */
/* responsive grid system */
.section{clear:both;padding:0}
.col{display:block;float:left;margin:2% 0 2% 2%;padding:8px}
.col:first-child{margin-left:0}
.group:before,.group:after{content:"";display:table}
.group:after{clear:both}
.group{zoom:1;/* For IE 6/7 */}
/*  GRID OF SIX  */
.span_6_of_6{width:100%}
.span_5_of_6{width:83%}
.span_4_of_6{width:66%}
.span_3_of_6{width:48%}
.span_2_of_6{width:32%}
.span_1_of_6{width:15%}
/*  GRID OF FIVE  */
.span_5_of_5{width:100%}
.span_4_of_5{width:79%}
.span_3_of_5{width:59%}
.span_2_of_5{width:39%}
.span_1_of_5{width:18.3%}
/*  GRID OF FOUR  */
.span_4_of_4{width:100%}
.span_3_of_4{width:73%}
.span_2_of_4{width:48%}
.span_1_of_4{width:22%}
/* --------------------------------- HERO BANNERS   ----------------------------------------- */
.HeroBanner{background-attachment:scroll;background-position:center center;background-repeat:no-repeat;background-size:cover;padding:50px 0;text-align:left}
.HeroBanner .heroContent{position:relative;z-index:5}
.HeroBanner.HeroPlaceholder{background-color:#9CC}
.HeroButtons{width:100%;text-align:center;padding-top:140px}
.HeroBanner p{text-align:justify;max-width:400px;font-size:14px;padding:30px 0 0 10px;width:100%}
/* --------------------------------- HERO HOME   ----------------------------------------- */
.HeroBanner.HeroHome h1{padding:0 0 10px 10px; color:#fff;}
.HeroBanner.HeroHome{position:relative;padding:4rem 0;overflow:hidden}
.HeroBanner.HeroHome p{font-weight:700;color:#fff; font-size:20px;font-family:'Heebo',Arial,sans-serif;text-transform:uppercase;margin-left:17px;max-width:495px;padding:0; /*background-color:#ffffff99*/}
/* --------------------------------- HERO BACKGROUNDS   ----------------------------------------- */
.HeroBanner.gallery{background-color:#fff;background-image:url(/assets/images/hero-bg-gallery.jpg)}
.HeroBanner.test{background-image:url(/assets/images/hero-bg1.jpg)}
.HeroBanner.test2{background-image:url(/assets/images/hero-bg2.jpg)}
/* ICONS */
.icon{text-decoration:none;border-bottom:none;position:relative}
.icon:before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:FontAwesome;font-style:normal;font-weight:400;text-transform:none!important}
.icon > .label{display:none}
.icon.major{background:#666;border-radius:100%;color:#fff;cursor:default;display:inline-block;height:5.5em;line-height:5.5em;margin:0 0 2em;width:5.5em}
.icon.major:before{font-size:2.5em}
/* --------------------------------- HOME   ----------------------------------------- */
.intro p{max-width:700px;padding-bottom:20px;}
.intro h2 {color:#fff;margin: 0;}
.intro.site-width.clearfix {
    max-width: 800px;
}
/* --------------------------------- QUOTE BLOCKS    ----------------------------------------- */
.quote{position:relative;-moz-transition:all 1s ease-in;-webkit-transition:all .3s ease-in;-o-transition:all .3s ease-in;transition:all .3s ease-in;cursor: crosshair;}
.quote .quoteItem{position:relative;padding:40px 0}
.quote .title{max-width:850px;font-size:5rem;line-height:.9;padding-left:60px;font-family:'Heebo',Arial,sans-serif}
.quote .title:before{font-family:"FontAwesome";content:"\f10d";font-size:40px;font-style:normal;color:#fff;position:absolute;top:40px;left:20px}
.quote .quoteName{text-transform:uppercase;font-size:15px;padding-left:60px}
.quote.bgColor1 .title:before{color:#000}
.quote:hover,.quote:focus{color:#fff;background-color:#c40f2e;-moz-transition:all .7s ease-in;-webkit-transition:all .7s ease-in;-o-transition:all .7s ease-in;transition:all .7s ease-in}
.quote:hover .title:before,.quote:focus .title:before{color:#000;-moz-transition:all .7s ease-in;-webkit-transition:all .7s ease-in;-o-transition:all .7s ease-in;transition:all .7s ease-in}




/* --------------------------------- COLLECTIES  BLOCKS HERSCHREVEN OM EN OM WIDE    ----------------------------------------- */

.collectieBlock{position:relative}
.collectieBlock h2{font-size:3rem;padding:0;margin:0}
.collectieBlock .site-width{padding:0}

.collectieBlock .block-item{transition: .4s ease;
 width:47%;display:inline-block;
position:relative;height:250px;cursor:pointer;margin:1% 1% 40px; 
overflow: hidden;

background: linear-gradient(to right, red 50%, black 50%);
    background-size: 200% 100%;
    background-position:right bottom;
 }

.collectieBlock .text-block{width:inherit; height:250px;
min-width: 350px;color:#fff;position:absolute;top:0px;left:0px;z-index:3; /*background-color:#fff; */

}
.collectieBlock .text-block:before {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    border-bottom: 40px solid white;
    border-right: 40px solid #ff000000;
    width: 0;
}

.collectieBlock .text-block h2{position:relative;margin:0;padding:10px 20px;
color:#fff;font-size:40px;line-height:44px;display:inline-block;}

.collectieBlock .block-item .bg-image{width:100%;height:100%;transition: .4s ease;
    width: auto;
    height: 100%;
    min-width: 100%;}

.collectieBlock .block-item:hover .bg-image{ opacity:0.5}


.collectieBlock .block-item:hover{transition: .4s; 
 background-position:left bottom;}
 
 .collectieBlock .block-item:hover  .text-block  { background-color: transparent}
 .collectieBlock .block-item:hover  .text-block H2  {color:#fff}




/* --------------------------------- GALLERY PAGE     ----------------------------------------- */
.HeroBanner.collectieTopic{padding:80px 0 30px}
.HeroBanner.collectieTopic h1{display:block;font-size:6.5em}
.HeroBanner.collectieTopic p{display:block;text-align:justify;max-width:500px;font-size:14px;padding:30px 0 0 7px;width:100%}

.volgendeCollectie{width:100%;padding:0 0 60px;cursor:pointer}
.volgendeCollectie .nextItem{position:relative;padding:10px 30px 10px 10px;border-bottom:8px solid #000;max-width:370px;text-align:left}
.volgendeCollectie .Next{font-size:32px;text-transform:uppercase;font-weight:700;display:block;padding:10px 0}
.volgendeCollectie .NextTitle{font-size:3rem;line-height:.9;font-family:'Heebo',Arial,sans-serif}
.volgendeCollectie .nextItem:hover{background-color:#c40f2e;-moz-transition:all .7s ease-in;-webkit-transition:all .7s ease-in;-o-transition:all .7s ease-in;transition:all .7s ease-in}
.volgendeCollectie .nextItem:after{font-family:"FontAwesome";content:"\f061";font-size:38px;font-style:normal;color:#000;position:absolute;bottom:-15px;right:-14px}
.startItem{position:relative;padding:10px 30px;border-bottom:8px solid #fff;max-width:150px;margin:auto;text-align:right;cursor:pointer;margin-top:20px}
.startTitle{font-size:3rem;line-height:.9;font-family:'Heebo',Arial,sans-serif}
.startItem:hover{background-color:#c40f2e;color:#fff;-moz-transition:all .7s ease-in;-webkit-transition:all .7s ease-in;-o-transition:all .7s ease-in;transition:all .7s ease-in}
.startItem:after{font-family:"FontAwesome";content:"\f061";font-size:38px;font-style:normal;color:#fff;position:absolute;bottom:-15px;right:-18px}

.gallery {max-width:100%; padding-top: 30px; }
.gallery .painting {padding:30px 10px 50px 10px}
.gallery img {max-width:990px; width:100%; height:auto}
.gallery .titel {    font-weight: 700;     padding-top: 12px;}


/* --------------------------------- NIEUWS   ----------------------------------------- */
.social-news{    padding-top: 40px;}
.fb-column,.twit-col {    min-width: 450px;}

/* --------------------------------- INTRESSE BANNER       ----------------------------------------- */
.intresse{position:relative;-moz-transition:all 1s ease-in;-webkit-transition:all .3s ease-in;-o-transition:all .3s ease-in;transition:all .3s ease-in}
.intresse .quoteItem{position:relative;padding:40px 0;max-width:800px;margin:auto}
.intresse .title{max-width:850px;font-size:5rem;line-height:.9;font-family:'Heebo',Arial,sans-serif}
.intresse p{font-weight:700;padding:10px 0 10px 10px;max-width: 420px;}
/* --------------------------------- CONTACTFORMULIER   ----------------------------------------- */
.contactformulier{ max-width:500px; float:left;    width: 90%;}
.adresgegevens { max-width:300px; float:right; text-align:left;}
#contactform {    max-width: 750px;}
.contactformulier div{padding-bottom:10px}
.contactformulier .button{margin:10px 0;padding:13px}
.contactformulier input,.contactformulier select,.contactformulier textarea{width:90%;padding:6px}
 /* --------------------------------- VIDEO BLOCK   ----------------------------------------- */
.videoBlock{width:100%}
.video-container{position:relative;padding-bottom:56.25%;padding-top:0;height:0;overflow:hidden;margin-bottom:30px}
.video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%}
/* --------------------------------- FOOTER  ----------------------------------------- */
#footer{padding:3.7em 0 6em;text-align:left;font-size:14px;border-top:4px #000 solid}
#footer .link-list a{text-decoration:none;padding-bottom:2px;font-weight:700;border-bottom-style:solid;border-bottom-width:2px}
#footer a:hover{color:#fff;background-color:#c40f2e}
#footer h4{text-transform:uppercase}
#footer .link-list li{margin-bottom:5px}
#footer ul{list-style:none;margin:0 0 2em;padding-left:0}
#footer .contact img{max-height:70px;width:auto}
#footer .copyright{font-size:.9em;line-height:1em;margin:2em 0 0;padding:0}
#footer .copyright li{border-left:solid 1px #ddd;display:inline-block;list-style:none;margin-left:1em;padding-left:1em}
#footer .copyright li:first-child{border-left:0;margin-left:0;padding-left:0}
#footer .icons{margin-top:10px}
#footer .icons a{font-size:16px;line-height:16px;padding:5px;display:inline-block;background-color:#000;opacity:1}
#footer .icons a:hover{color:#fff;opacity:1}
#footer ul.icons li{display:inline-block;text-align:center;padding:0;width:34px;height:34px;background-color:#fff;margin-right:6px}
#footer .icons img{width:24px;height:24px;line-height:28px;opacity:1;filter:brightness(0) invert(1)}
#footer ul.icons li:hover{background-color:#09f}
.smallTxt{font-size:14px;line-height:21px}
.openingstijdenTable{max-width:257px}
.back-to-top-square{position:fixed;bottom:-1px;right:20px;width:40px;height:39px;background-color:#fff;border:1px solid #c5c5c5;border-radius:2px 2px 0 0;z-index:800;float:right;cursor:pointer;font-size:13px;opacity:.8}
.back-to-top-square a:hover { background-color: transparent}
#footer .icons a:hover{background-color:#c40f2e}
#footer .icons a:hover img{filter:grayscale(100%);opacity:1}
/* --------------------------------- ANIMATIONS  ----------------------------------------- */
.fadeItIn{
-webkit-transition: opacity 2s ease-in;
-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 2s; /* Firefox < 16 */
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera < 12.1 */
animation: fadein 2s;}
@keyframes fadein {
from { opacity: 0; transform: translateY(50px) }
to   { opacity: 1; transform: translateY(0px)}
}
@media all and (max-width:1200px) {
.HeroButtons{padding-top:100px}
}
/* --------------------------------- LAPTOPS  ----------------------------------------- */
@media all and (max-width:1100px) {
.collectieBlock .text-block h2{font-size:34px;line-height:40px}
.HeroButtons{padding-top:100px}
}
@media all and (max-width:950px) {
.HeroButtons{padding-top:60px}
.HeroBanner.HeroHome{padding:4rem 0 2rem}
.Nightwatching img{height:100%;width:auto}
}
/* --------------------------------- TABLETS  ----------------------------------------- */
@media all and (max-width: 860px) {
h1{font-size:6.5em;line-height:1em}
#header .logo{width:220px;padding:8px 5px 2px 5px}
#header{padding:0;padding-bottom:7px;    height: 50px;}
.HeroButtons{padding-top:60px}
.HeroBanner.collectieTopic h1{font-size:4em}
.collectieBlock .block-item{width:47%}
.collectieBlock .text-block h2{font-size:30px;line-height:36px}
.quote .title,.intresse .title{font-size:4rem;line-height:.9}
#footer{padding:4em 0 6em;text-align:left;font-size:14px}
#footer .span_1_of_4{width:48%}
.overige-projecten .span_3_of_6 {width:100%}
.overige-projecten .col {    margin: 1% 0;}
}
@media only screen and (max-width: 760px) {
.contactformulier{ max-width:500px; float:none;    width: 100%;}
.adresgegevens { max-width:300px; float:none; text-align:left; padding-bottom:20px;}
}
@media only screen and (max-width: 700px) {
.HeroBanner.gallery{background-color:#fff;background-image:url(/assets/images/hero-bg-gallery-mob.jpg)}
.HeroBanner.HeroHome{background-position:top center;padding:8rem 0 1rem}
.HeroBanner.HeroHome p{background-color:transparent}
.HeroButtons{padding-top:20px}

}
/* --------------------------------- MOBILE  ----------------------------------------- */
@media only screen and (max-width: 580px) {
.mobHide{display:none}
.mobShow{display:block}
.button{padding:8px 14px;min-width:130px}
#nav{margin-bottom:0}
#hero-banner{padding:50px 0}
#hero-banner img{max-width:100%;max-height:100%;width:100%;height:100%}
#hero-banner h1{padding:10px}
.HeroBanner.HeroHome{background-position:top center;text-align:center;padding:6rem 0 1rem;min-height:200px}
.HeroBanner.HeroHome p{margin:0;font-size:16px;line-height:1.2;text-align:center;padding:0;max-width:100%}
h1{font-size:3.8em;line-height:1em}
h2{font-size:2.25em;line-height:1.5em}
h3{font-size:1em;line-height:1.5em}
h4{font-size:1em;line-height:1.5em}
h5{font-size:.9em;line-height:1.5em}
h6{font-size:.7em;line-height:1.5em}
.col{margin:1% 0}
.span_1_of_6,.span_2_of_6,.span_3_of_6,.span_4_of_6,.span_5_of_6,.span_6_of_6{width:100%}
.span_5_of_5,.span_4_of_5,.span_3_of_5,.span_2_of_5,.span_1_of_5{width:100%}
.span_4_of_4,.span_3_of_4,.span_2_of_4,.span_1_of_4{width:100%}
.kenmerken .col{width:50%}
.volgendeCollectie{padding:0 20px 60px}
.volgendeCollectie .nextItem{max-width:inherit}
/* --------------------------------- COLLECTIES  BLOCKS    ----------------------------------------- */
.collectieBlock .block-item{width:47%; height: 170px;margin: 1%;}
.collectieBlock .text-block h2{font-size:32px;line-height:30px}
.collectieBlock h2{font-size:2.2rem;padding:0;margin:0}
.collectieBlock .text-block{min-width:inherit; height: 170px;}
/* --------------------------------- GALLERY PAGES      ----------------------------------------- */
.HeroBanner.collectieTopic{padding:60px 0 0}
.HeroBanner.collectieTopic h1{padding-left:3px;font-size:3.2em}
.HeroBanner.collectieTopic p{padding:30px 10px 0;margin:0;text-align:inherit}
.gallery .painting {font-size: 0.9rem;}
/* --------------------------------- QUOTE BLOCKS    ----------------------------------------- */
.quote{padding:60px 0}
.quote .title{font-size:3.4rem;line-height:.9;padding-left:45px}
.quote .title:before{left:0}
.quote .quoteItem{padding:40px 0}
.intresse .title{font-size:3.4rem;line-height:.9}
.intresse p{padding:10px 0}
.intresse p br{display:none}
.intresse .button{margin:20px 0 0}
/* --------------------------------- FOOTER  ----------------------------------------- */
#footer .copyright{font-size:14px;margin:2em 0 0;padding:0}
#footer .copyright li{width:100%;margin-left:0;margin-bottom:10px}
#footer .span_1_of_4{width:100%}
}
@media only screen and (max-width: 460px) {
h1{font-size:3em;line-height:1em}
.HeroBanner.collectieTopic h1{font-size:4em;width:100%}
.HeroButtons{padding-top:0}
.quote .title{font-size:3rem;line-height:.9;padding-left:45px}
.collectieBlock .text-block{left:0}
/*.collectieBlock .text-block h2{padding:8px 15px;font-size:22px;line-height:23px}*/
}
@media only screen and (max-width: 400px) {
.collectieBlock .text-block h2{padding:8px 15px;font-size:22px;line-height:23px}
}
@media only screen and (max-width: 360px) {
h1{font-size:2.6em;line-height:1em}
.HeroBanner.collectieTopic h1{font-size:3.6em;width:100%}
.collectieBlock {    text-align: center;}
.collectieBlock .block-item{width:100%;max-width:250px;text-align: left;}
/*.collectieBlock{text-align:center}*/
.collectieBlock h2{font-size:2rem;padding:0;margin:0}
.quote .title:before{font-size:26px}
.quote .title{font-size:2rem;line-height:.9;padding-left:32px}


}