@charset "utf-8";
/* CSS Document */

/*reset*/
*{margin:0; padding:0; outline:none; box-sizing:border-box;}
img,fieldset{border:0px; display:block;}
br.clear, div.clear{clear:both; font-size:0px;}
ul, ol{list-style:none;}
textarea, input.text, input[type="text"], input[type="button"], input[type="submit"], .input-checkbox, button{-webkit-appearance:none; border-radius:0;}

header, nav, article, aside, section, footer{display:block; overflow:hidden;}
header, section, footer{width:100%; height:auto; position:relative;}

/*template*/
html{width:100%; height:100%; font-size:62.5%;}
body{width:100%; height:100%; font-family:'Source Sans Pro', sans-serif; font-size:1.8rem; line-height:1.628571; color:#2D2E83; overflow-x:hidden; overflow-y:scroll; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}


/*text*/
h1, h2, h3, h4, h5, h6{width:100%; height:auto; line-height:1.2; font-weight:bold; font-family:'Chelsea Market', cursive; color:#2D2E83; text-transform:uppercase;}
h1{font-size:4.0rem; margin-bottom:32px;}
h2{font-size:3.0rem; margin-bottom:32px;}
h3{font-size:2.0rem; margin-bottom:16px;}
h4{font-size:1.6rem; font-family:'Source Sans Pro', sans-serif; font-weight:normal; text-transform:unset;}
h1.dotted,h2.dotted,h3.dotted,h4.dotted{border-bottom:4px dotted #2D2E85; padding-bottom:8px;}
h1.dotted-top,h2.dotted-top,h3.dotted-top,h4.dotted-top{border-top:4px dotted #2D2E85; padding-top:8px;}
h1.center,h2.center,h3.center,h4.center{text-align:center;}
a, a *{color:#03B6E1; text-decoration:none;}
small{font-size:1.2rem;}
article ul,
article ol{list-style:disc outside; margin:0px 0px 30px 20px;}

/*floats*/
.left{float:left;}
.right{float:right;}
.center{text-align:center;}
/*video*/
.video-container{position:relative; padding-bottom:56.25%; height:0; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed{position:absolute; top:0; left:0; width:100%; height:100%;}

/*main-container*/
main{width:100%; max-width:1920px; min-height:100vh; margin:0px auto; background:url('../images/background-main.webp') no-repeat center 250px;} 
main.clear{background:none !important;} 
main.orange{background:url('../images/background-main-orange.webp') no-repeat center 250px;} 
main.bars{background:url('../images/background-main-bars.webp') no-repeat center 400px;} 
main.splash{background:url('../images/background-main-splash.webp') no-repeat; background-position:42px 300px; background-size:550px auto;} 
.container{max-width:1260px; margin:0px auto; padding: 0 24px; position:relative;}

/*header*/
header{background:#fff182; overflow:visible; height:250px; margin-bottom:100px;}
header .grid{height:300px; display:grid; grid-template-columns:1fr 1fr 1fr; grid-template-rows:250px 50px; column-gap:32px; background:url('../images/header-text.svg') no-repeat -4px 71px/ 60%;}
header .grid .logo{grid-area:1/2/1/3; height:160px; margin-top:-3px;}
header .grid .logo img{height:100%; width:100%; object-fit:contain;}
header .grid .icons{grid-area:1/3/1/4;}
header .grid .icons .wrapper{width:100%; display:block; margin:32px 0px;}
header .grid .icons .wrapper .socialicons{display:flex; justify-content:flex-end; margin-top:32px;}
header .grid .icons .wrapper .socialicons a{margin:auto 0;}
header .grid .icons .wrapper .socialicons a:not(:last-child){margin-right:16px;}
header .grid .icons .wrapper .socialicons a img{height:32px; width:32px;}
header .grid .icons .wrapper .searchbar{display:flex; justify-content:flex-end;}
header .grid .icons .wrapper .searchbar i{margin-right:32px;}
header .grid .icons .wrapper .searchbar input{height:32px; border-radius:4px; border:unset; min-width:50px;}
header .grid .icons .wrapper .searchbar input:first-of-type{margin-right:16px;}
header .grid .icons .wrapper .newsletter{height:64px; width:64px; display:block; float:right; background: url("../images/ico-nieuwsbrief-01.svg") no-repeat 0 0;}
header .grid .icons .wrapper .newsletter:hover{background: url("../images/ico-nieuwsbrief-02.svg") no-repeat 0 0;}
header .grid .icons .wrapper .newsletter img{height:100%; width:100%; object-fit:cover;}
header .grid .icons .wrapper .artist{height:64px; width:64px; display:block; float:right; margin-right:12px; background: url("../images/ico-aanmelden-artiest-01.svg") no-repeat 0 0;}
header .grid .icons .wrapper .artist:hover{background: url("../images/ico-aanmelden-artiest-02.svg") no-repeat 0 0;}
header .grid .icons .wrapper .artist img{height:100%; width:100%; object-fit:cover;}
header .grid .icons .wrapper .advies{height:64px; width:64px; display:block; float:right; margin-right:12px; background: url("../images/ico-advies-02.svg") no-repeat 0 0;}
header .grid .icons .wrapper .advies:hover{background: url("../images/ico-advies-01.svg") no-repeat 0 0;}
header .grid .icons .wrapper .advies img{height:100%; width:100%; object-fit:cover;}
header .grid .icons .wrapper .presentatiedag{height:64px; width:64px; display:block; float:right; margin-left:12px; background: url("../images/ico-presentatiedag-02.svg") no-repeat; background-size:cover;}
header .grid .icons .wrapper .presentatiedag:hover{background: url("../images/ico-presentatiedag-01.svg") no-repeat; background-size:cover;}
header .grid .icons .wrapper .presentatiedag img{height:100%; width:100%; object-fit:cover;}
header .grid .icons .wrapper .contact{height:64px; width:64px; display:block; float:right; margin-left:12px; background: url("../images/ico-contact-02.svg") no-repeat; background-size:cover;}
header .grid .icons .wrapper .contact:hover{background: url("../images/ico-contact-01.svg") no-repeat; background-size:cover;}
header .grid .icons .wrapper .contact img{height:100%; width:100%; object-fit:cover;}
header .grid .icons .wrapper .news{height:64px; width:64px; display:block; float:right; margin-right:12px; background: url("../images/ico-nieuws-02.svg") no-repeat;}
header .grid .icons .wrapper .news:hover{background: url("../images/ico-nieuws-01.svg") no-repeat 0 0;}
header .grid .icons .wrapper .news img{height:100%; width:100%; object-fit:cover;}

header .grid nav{grid-area:2/1/2/4;}
header .grid nav ul{display:flex; justify-content:center;}
header .grid nav ul li{height:50px;}
header .grid nav ul li a{width:100%; height:inherit; display:block;}
header .grid nav ul li.green{width:266px; background:url("../images/nav-green-sprite.png") no-repeat 0 0;}
header .grid nav ul li.green:hover,
header .grid nav ul li.green.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li.blue{width:222px; background:url("../images/nav-blue-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.blue:hover,
header .grid nav ul li.blue.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li.pink{width:174px; background:url("../images/nav-pink-2-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.pink:hover,
header .grid nav ul li.pink.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li.yellow{width:126px; background:url("../images/nav-yellow-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.yellow:hover,
header .grid nav ul li.yellow.on{background-position: 0 -50px;}
header .grid nav ul li.lightblue{width:164px; background:url("../images/nav-lightblue-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.lightblue:hover,
header .grid nav ul li.lightblue.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li.songs{width:238px; background:url("../images/nav-songs-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.songs:hover,
header .grid nav ul li.songs.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li.red{width:164px; background:url("../images/nav-red-sprite_B.png") no-repeat 0 0;}
header .grid nav ul li.red:hover,
header .grid nav ul li.red.on{cursor:pointer; background-position: 0 -50px;}
header .grid nav ul li a img{width:100%; height:50px; object-fit:contain;}
header .grid nav .mobicons{display:none;}
header .grid .menu{display:none;}

/*generals*/
.color-white{color:#ffffff;}
.color-blue{color:rgba(0,151,144,.4);}
.color-green{color:rgba(144,209,163,1);}
.color-yellow{color:rgba(255,227,0,.44);}
.color-red{color:rgba(223,78,27,.84);}
.color-purple{color:rgba(72,72,138,.48);}
.color-pink{color:rgba(223,78,27,.28)}
.bg-none{background: none !important;}
.bg-blue{background-color:rgba(0,151,144,.4);}
.bg-lightgreen{background-color:rgba(144,209,163,.38)}
.bg-lightpink{background-color:#f9dcd1}
.bg-green{background-color:rgba(144,209,163,1);}
.bg-yellow{background-color:rgba(255,227,0,.44)}
.bg-lightyellow{background-color:#fff49c}
.bg-purple{background-color:rgba(72,72,138,.48);}
.bg-lila{background-color:rgba(45,46,128,.20);}
.bg-red{background-color:rgba(223,78,27,.84);}
.bg-pink{background-color:rgba(223,78,27,.28);}
.marker{margin:0 -0.4em; padding:0.1em 0.4em; border-radius:0.8em 0.3em; background:transparent; background-image:linear-gradient(to right, rgba(255, 225, 0, 0.1), rgba(255, 225, 0, 0.7) 4%, rgba(255, 225, 0, 0.3)); -webkit-box-decoration-break:clone; box-decoration-break:clone;}
.marker.blue{background-image:linear-gradient(to right, rgba(0, 151, 144, 0.1), rgba(0, 151, 144, 0.7) 4%, rgba(0, 151, 144, 0.3));}
.marker.green{background-image:linear-gradient(to right, rgba(144,209,163, 0.1), rgba(144,209,163, 0.7) 4%, rgba(144,209,163, 0.3));}
.marker.yellow{background-image:linear-gradient(to right, rgba(255, 227, 0, 0.1), rgba(255, 227, 0, 0.7) 4%, rgba(255, 227, 0, 0.3));}
.marker.red{background-image:linear-gradient(to right, rgba(223,78,27, 0.1), rgba(223,78,27, 0.7) 4%, rgba(223,78,27, 0.3));}
.marker.purple{background-image:linear-gradient(to right, rgba(72,72,138, 0.1), rgba(72,72,138, 0.7) 4%, rgba(72,72,138, 0.3));}
.marker.pink{background-image:linear-gradient(to right, rgba(223,78,27, 0.1), rgba(223,78,27, 0.7) 4%, rgba(223,78,27, 0.3));}
a.season{height:150px; width:150px; display:inline-block; background:url('../images/ico-season-01.svg') no-repeat top right; text-indent:-4000px;}
a.season:hover{background:url('../images/ico-season-02.svg') no-repeat top right;}
a.presentation{height:150px; width:150px; display:inline-block; background:url('../images/ico-presentatiedag-01.svg') no-repeat top right; text-indent:-4000px;}
a.presentation:hover{background:url('../images/ico-presentatiedag-02.svg') no-repeat top right;}

/*forms*/
.formintro{min-height:200px; position:relative; background:url('../images/contact-form.png') no-repeat center rgba(144,209,163,.38); padding:24px 144px;}
.formintro.pink{background:url('../images/contact-form.png') no-repeat center #f9dcd1;}
.formintro h1{line-height:1; position:absolute; bottom:16px; margin-bottom:0px; width:unset; }
form.form-grid{padding:24px 144px; margin-bottom:44px;}
form.form-grid.nomargin{margin-bottom:0px;}
form.form-grid .wide{grid-column-end:span 2;}
form.form-grid .fit{display:grid; grid-template-columns:max-content auto; gap:16px;}
form.form-grid h2{margin-top:35px; margin-bottom:0px; font-size:2.4rem;}
form.form-grid h3{margin-top:35px; margin-bottom:0px; font-size:2.0rem;}
form.form-grid div{padding:8px 0px;}
form.form-grid div.row{}
form.form-grid div.noborder{}
form.form-grid div.message{font-family:'Chelsea Market', cursive; padding:0px 8px; font-size:1.8rem;}
form.form-grid div.label{padding:0px 8px;}
form.form-grid div.label span{border-bottom:16px solid #90D1A3; color:#2D2E80; font-family:'Chelsea Market', cursive; padding:0px 8px; font-size:1.8rem;}
form.form-grid div.row label.red{color:#e2001a;}
form.form-grid div span{display:block; height:32px; line-height:32px; color:#a3a3a3; font-size:1.2rem;}
form.form-grid div input[type="text"],
form.form-grid div input[type="number"],
form.form-grid div input[type="date"],
form.form-grid div input[type="email"],
form.form-grid div input[type="time"],
form.form-grid div input[type="datetime-local"]{width:100%; height:24px; line-height:24px; padding:16px; border:1px solid #ffffff; color:#2D2E83; font-family:'Chelsea Market', cursive; background:#ffffff;}
form.form-grid div select{width:100%; height:24px; line-height:24px; font-size:1.4rem; padding:16px; color:#2D2E83; border:1px solid #ffffff; background:#ffffff; color:#2D2E80; font-family:'Chelsea Market', cursive;}
form.form-grid div select{height:unset; line-height:unset; padding:8px 16px;}
form.form-grid div select option{color:#555555;}
form.form-grid div input[type="text"].red,
form.form-grid div input[type="number"].red,
form.form-grid div input[type="date"].red,
form.form-grid div input[type="email"].red,
form.form-grid div input[type="time"].red,
form.form-grid div select.red,
form.form-grid div input[type="datetime-local"].red{border:1px solid #e2001a;}
form.form-grid div textarea{width:100%; height:300px; line-height:24px; color:#2D2E83; font-family:'Chelsea Market', cursive; padding:16px; background:#ffffff; border:1px solid #ffffff;} 
form.form-grid div textarea:focus{border:1px solid #303030;}
form.form-grid div textarea.red{border:1px solid #e2001a;}
form.form-grid div.submit{display:grid; grid-template-columns:1fr 1fr;}
form.form-grid div.submit .button-left input[type=button],
form.form-grid div.submit .button-left input[type=submit]{border:0px; font-family:'Source Sans Pro', sans-serif; color:#555555; background-color:#eae9e9; font-size:1.4rem; padding:15px 25px; border-radius:5px; text-decoration:none; float:left; cursor:pointer;}
form.form-grid div.submit .button-right input[type=button],
form.form-grid div.submit .button-right input[type=submit]{border:0px; font-family:'Chelsea Market', cursive; color:#2D2E80; background-color:#90D1A3; font-size:1.8rem; padding:15px 25px; border-radius:5px; text-decoration:none; float:right; cursor:pointer;}
form.form-grid div.submit .button-right input[type=submit].grey{color:#f1f1f1; background-color:#444444;}
form.form-grid div.submit .button-right input[type=submit].lightpink{color:#f1f1f1; background-color:#f1c3b7;}


/*popup*/
.popup{display:flex; position:fixed; top:0; left:0; width:100vw; height:100vh; background:rgba(0,0,0,0.5); justify-content:center; align-items:center;}
.popup-content{aspect-ratio:61/27; max-width:95%; height:auto; margin:auto; margin-top:64px; position: relative;}
.popup-content img{width:100%; height:100%; object-fit:contain;}
.close-popup{position:absolute; top:10px; right:15px; font-size:2.4rem; cursor:pointer; color:white;}
body.noscroll{overflow:hidden; height:100%;}

/*sections*/
section{padding: 32px 0;}
section.no-bottom{padding-bottom:0px !important;}
section:first-of-type{padding:unset; padding-bottom:32px;}

section .return{height:50px; width:200px; background: url('../images/return.svg') no-repeat top left; margin-bottom:32px; }
section .return a{height:100%; width:100%; display:block; object-fit:cover; text-indent:-4000px;}
section .return:hover{cursor:pointer;}

section.intro{}
section.intro.splash{}
section.intro.splash .container{position: relative;}
section.intro.splash article{width:50%; float:right;}
section.intro.splash h1{width:100%; height:160px; border:none; text-indent:-4000px; margin-bottom:48px; background:url('../images/title-speelnest.png') no-repeat top right;}
section.intro article.advise{padding:24px 144px;}
section.intro .grid{display:grid; grid-template-columns:0.4fr 0.6fr;}
section.intro .grid article{grid-area:1/2/1/2; padding:64px 0px;}
section.intro article.seasonal{display:grid; grid-template-columns:auto 150px; gap:24px;}
section.intro article.seasonal h1{grid-column-end:span 2;}
section.intro .review{width:1212px; height:859px; display:block; background:url('../images/title-review.jpg') no-repeat; background-size:contain;}
section.intro .song-grid{display:grid; grid-template-columns:auto 800px; grid-gap:16px; margin-top:32px;}
section.intro .song-grid h1{grid-column-end:span 2;}
section.intro .song-grid .video{width:800px; height:442px; display:block; padding:66px 126px;}
section.intro .song-grid .video.player-1{background:url('../images/background-video-1.webp') no-repeat center; background-size:contain;}
section.intro .song-grid .video.player-2{background:url('../images/background-video-2.webp') no-repeat center; background-size:contain;}
section.intro .song-grid .video.player-3{background:url('../images/background-video-3.webp') no-repeat center; background-size:contain;}
section.intro .song-grid .video.player-4{background:url('../images/background-video-4.webp') no-repeat center; background-size:contain;}
section.intro .song-grid .icons{margin-top:32px;}
section.intro .song-grid .icons .age{width:126px; width:126px; display:block; float:left; margin-right:12px;}
section.intro .song-grid .icons .download{height:126px; width:126px; display:block; float:left; margin-right:12px; background: url("../images/ico-download-akkoorden-01.svg") no-repeat 0 0;}
section.intro .song-grid .icons .download:hover{background: url("../images/ico-download-akkoorden-02.svg") no-repeat 0 0;}
section.intro .song-grid .icons .download img{height:100%; width:100%; object-fit:cover;}

section.pop-up img{width:100%; height:100%; object-fit:contain;}

section.reviews{padding:64px 0;}
section.reviews .review{text-align:center; max-width:fit-content; padding:24px;}
section.reviews .wrapper{margin: 0 auto; position:relative; height:300px;}
section.reviews .review{position:absolute; z-index:10;}
section.reviews .review:nth-of-type(5n){background-color:#1b1909; color:white; transform:rotate(-2deg)translateX(-50%); width:90%; padding:11px; bottom:0; left:50%;}
section.reviews .review:nth-of-type(5n+1){background-color:#90D1A3;transform:rotate(10deg); width:45%; padding:14px; bottom:62%; left:4%;}
section.reviews .review:nth-of-type(5n+2){background-color:#f9dcd1;transform:rotate(-10deg); width:48%; padding:18px; bottom:75%; right:4%;}
section.reviews .review:nth-of-type(5n+3){background-color:#A8A7C7;transform:rotate(6deg); width:53%; padding:8px; bottom:26%; left:0%}
section.reviews .review:nth-of-type(5n+4){background-color:#E56939; transform:rotate(-7deg); width:48%; padding:10px; color:white; bottom:39%; right:0%;}
section.reviews .bg-branch{background-color:#A7D5D3; width:90%; height:30px; position:absolute; z-index:9;}
section.reviews .bg-branch.one{width:90%; bottom:65%; left:5%; transform:rotate(-2deg); }
section.reviews .bg-branch.two{width:80%; bottom:48%; left:15%;transform:rotate(2deg); }
section.reviews .bg-branch.three{width:64%; bottom:33%; right:18%;transform:rotate(-2deg); }
section.reviews .bg-branch.four{width:50%; bottom:20%; right:25%;transform:rotate(-1deg); }
section.reviews .bg-branch.five{width:40%; bottom:0; right:30%;transform:rotate(1deg); }

section.categories h2{ margin-bottom:64px;}
section.categories .grid{display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:16px;}
section.categories .grid .product{width:100%; position:relative; padding:32px 16px;}
section.categories .grid .product.bg-green{background:url('../images/frame-green.svg') no-repeat top center / 100%;}
section.categories .grid .product.bg-blue{background:url('../images/frame-blue.svg') no-repeat top center / 100%;}
section.categories .grid .product.bg-yellow{background:url('../images/frame-yellow.svg') no-repeat top center / 100%;}
section.categories .grid .product.bg-pink{background:url('../images/frame-pink.svg') no-repeat top center / 100%;}
section.categories .grid .product:nth-of-type(4n+1){transform:rotate(2deg);}
section.categories .grid .product:nth-of-type(3n+3){transform:rotate(-2deg);}
section.categories .grid .product:nth-of-type(4n+2){transform:rotate(-2deg);}
section.categories.artists .grid .product:nth-of-type(4n+1){transform:none;}
section.categories.artists .grid .product:nth-of-type(3n+3){transform:none;}
section.categories.artists .grid .product:nth-of-type(4n+2){transform:none;}
section.categories .grid .product .age{background-repeat:no-repeat; background-position:0 0; width:64px; height:64px; position:absolute; top:-16px; left:50%; transform: translate(-50%, 0);}
section.categories .grid .product.bg-green:hover .age{background-image:url("../images/frame-eye-green.svg") !important;}
section.categories .grid .product.bg-blue:hover .age{background-image:url("../images/frame-eye-blue.svg") !important;}
section.categories .grid .product.bg-yellow:hover .age{background-image:url("../images/frame-eye-yellow.svg") !important;}
section.categories .grid .product.bg-red:hover .age{background-image:url("../images/frame-eye-pink.svg") !important;}
section.categories .grid .product.bg-pink:hover .age{background-image:url("../images/frame-eye-pink.svg") !important;}
section.categories .grid .product .image{height:300px; width:300px; margin:24px auto 12px auto; position:relative;}
section.categories .grid .product .image img{height:100%; width:100%; object-fit:cover;}
section.categories .grid .product .image .overlay{width:300px; height:300px; display:block; background:url("../images/background-artist.webp") center / contain; position:absolute; top:0; left:0;}
section.categories .grid .product:hover .image .overlay{background:url("../images/background-artist-hover.webp") center / contain;}
section.categories .grid .product h3,
section.categories .grid .product h4{width:80%; margin:16px auto; color:#2D2E83;}
section.categories .grid .product a.delete{color:rgba(223,78,27,.84); font-size:1.2rem; float:right;}
section.categories .filter .panel{display:none;}
section.categories .filter .panel form{display:grid; grid-template-columns:repeat(4,25%); grid-gap:16px; padding:24px 0px;}
section.categories .filter .panel form .group{background:#e1f3e5; padding:16px; border-radius:8px;}
section.categories .filter .panel form .group h3{font-size:1.4rem; border-bottom:2px dotted #2D2E83; padding-bottom:8px; margin-bottom:16px;}
section.categories .filter .panel form .group .row label{font-size:1.4rem; margin-left:12px;}

section.product{}
section.product .grid{width:100%; display:grid; grid-template-columns:repeat(6,1fr); column-gap:16px; row-gap:48px; padding-top:16px; border-top:4px dotted #2d2e83;}
section.product .grid .image{grid-column-end:span 3;}
section.product .grid .image img{width:100%; object-fit:cover;}
section.product .grid .legend{grid-column-end:span 3;}
section.product .grid .legend .tags{display:grid; grid-template-columns:repeat(4,1fr); grid-gap:24px;}
section.product .grid .legend .tags .icon{width:auto; display:inline-block; position:relative; float:none; margin:0px 0px 0px 10px; cursor:pointer;}
section.product .grid .legend .tags .icon img{width:100%; object-fit:cover;}
section.product .grid .legend .tags .icon img:hover{cursor:pointer;}
section.product .grid .legend .tags .icon .tooltiptext{visibility:hidden; width:320px; height:unset; background:rgba(144,209,163,1); color:#2D2E83; text-align:center; padding:12px; border-radius:8px; line-height:unset; font-weight:normal; position:absolute; z-index:1; bottom:107%; left:50%; margin-left:-160px; opacity:0; transition:opacity 0.3s;}
section.product .grid .legend .tags .icon .tooltiptext::after{content:''; position:absolute; top:100%; left:50% ; margin-left:-5px; border-width:5px; border-style:solid; border-color:rgba(144,209,163,1) transparent transparent transparent;}
section.product .grid .legend .tags .icon:hover .tooltiptext{visibility:visible; opacity:1;}
section.product .grid .title{grid-column-end:span 6;}
section.product .grid .title *{margin:0px !important;}
section.product .grid .title h2{font-weight:normal; font-family:'Source Sans Pro', sans-serif;}
section.product .grid article{grid-column-end:span 6;}
section.product .grid .media{grid-column-end:span 2; max-height:300px;}
section.product .grid .media a{display:block; width:100%; max-height:300px;}
section.product .grid .media img{height:100%; max-height:300px; width:100%; object-fit:contain; margin:0px auto;}
section.product .grid .media iframe{width:100%; height:100%;}
section.product .grid .actions{grid-column-end:span 6; display:grid; grid-template-columns:150px 150px auto; grid-gap:32px;}
section.product .grid .actions p{grid-column-end:span 3; font-family:'Chelsea Market', cursive; }
section.product .grid .actions .contact{height:150px; width:150px; display:block; background:url('../images/ico-boekdirect-01.svg') no-repeat center / cover; text-indent:-4000px;}
section.product .grid .actions .contact:hover{background:url('../images/../images/ico-boekdirect-02.svg') no-repeat top right;}
section.product .grid .actions .advies{height:150px; width:150px; display:block; background:url('../images/ico-advies-01.svg') no-repeat center / cover; text-indent:-4000px;}
section.product .grid .actions .advies:hover{background:url('../images/ico-advies-02.svg') no-repeat top right;}

section.symbols .item{display:grid; grid-template-columns:80px auto; grid-gap:24px; width:80%; margin:12px auto;}
section.symbols .item .icon img{width:100%; height:100%; object-fit:contain;}
section.symbols .item .about h2{line-height:80px;}

section.bird{padding:0px;}
section.bird h1{width:497px; height:139px; border:none; margin-top:42px; text-indent:-4000px; background:url('../images/title-zelf-spelen.png') no-repeat top left;}
section.bird h1.lappie{width:100%; height:188px; border:none; margin-top:42px; text-indent:-4000px; background:url('../images/title-het-speelnest.webp') no-repeat top center;}
section.bird .split{display:grid; grid-template-columns:1fr 1fr; grid-gap:48px;}
section.bird .split .image{margin-bottom:40px;}
section.bird .split .image img{width:100%; height:100%; object-fit:contain;}
section.bird .split.switch{grid-template-columns:300px 1fr;}
section.bird .split.switch .image{grid-area:1/1/1/2;}

section.brochure object{height:100vh;}
section.brochure h2{padding-top:48px;}
section.brochure .actions{width:696px; display:grid; grid-template-columns:200px 200px 200px; grid-gap:48px; padding-top:24px; margin:0px auto;}
section.brochure .actions div:nth-of-type(1){width:200px; height:auto; transform:rotate(-4deg);}
section.brochure .actions div:nth-of-type(2){width:200px; height:auto; transform:rotate(3deg);}
section.brochure .actions div:nth-of-type(2){width:200px; height:auto; transform:rotate(-2deg);}
section.brochure .actions div img{width:100%; object-fit:cover;}

section.news .grid .newsitem{display:grid; grid-template-columns:160px auto; grid-gap:32px; margin:0px 12px;}
section.news .grid .newsitem .image img{object-fit:cover;  transform:rotate(-2deg);}
section.news .grid .newsitem:nth-of-type(odd){grid-template-columns:auto 160px; grid-gap:32px; margin:0px 12px;}
section.news .grid .newsitem:nth-of-type(odd) .image{grid-area:1/2/1/3;}
section.news .grid .newsitem:nth-of-type(odd) .image img{transform:rotate(3deg);}

/*footer*/
footer{padding:32px 0;}
footer a{color:#3738a0;}
footer a:hover{color:#2D2E83;}
footer .grid{display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:32px;}
footer .grid h4{text-transform:uppercase; margin-bottom:12px;}
footer .grid .info a{display:block; text-decoration:underline; font-size:1.4rem;}
footer .grid .newsletter{height:96px; width:96px; background: url("../images/ico-nieuwsbrief-01.svg") no-repeat 0 0; margin: 0 auto;}
footer .grid .newsletter:hover{height:96px; width:96px; background: url("../images/ico-nieuwsbrief-02.svg") no-repeat 0 0;}
footer .grid .contact{text-align:right;}
footer .grid .contact a{font-size:1.4rem;}
footer .grid .contact .socialicons{display:flex; justify-content:flex-end; margin-top:32px;}
footer .grid .contact .socialicons a{margin:auto 0;}
footer .grid .contact .socialicons a:not(:last-child){margin-right:16px;}
footer .grid .contact .socialicons a img{height:32px; width:32px;}
footer .grid .copyright{grid-column-end:span 3; display:grid; grid-template-columns:1fr 1fr; grid-gap:16px;}
footer .grid .copyright *{font-size:1.2rem;}
footer .grid .copyright div:last-of-type{text-align:right;}
footer .grid .copyright a{margin-left:12px;}

/*laptop*/
@media only screen and (max-width:1024px) 
{   
    h1{font-size:3.0rem;}
    h2{font-size:2.2rem;}

    header .grid{background:url('../images/header-text.svg')no-repeat 93px 91px/ 62%;}
    header .grid .logo{margin-top:-20px;}
    header .grid nav{grid-area:2/1/2/4;}
    header .grid nav ul{display:flex; justify-content:center;}
    header .grid nav ul li{height:37px; width:200px;}
    header .grid nav ul li a{height:inherit; width:inherit;}
    header .grid nav ul li.green{width:200px; background:url("../images/nav-green-sprite-D.png") no-repeat 0 0;}
    header .grid nav ul li.green:hover,
    header .grid nav ul li.green.on{background-position: 0 -37px;}
    header .grid nav ul li.blue{width:166px;background:url("../images/nav-blue-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.blue:hover,
    header .grid nav ul li.blue.on{background-position: 0 -37px;}
    header .grid nav ul li.pink{width:130px; background:url("../images/nav-pink-2-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.pink:hover,
    header .grid nav ul li.pink.on{background-position: 0 -37px;}
    header .grid nav ul li.yellow{width:94px; background:url("../images/nav-yellow-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.yellow:hover,
    header .grid nav ul li.yellow.on{background-position: 0 -37px;}
    header .grid nav ul li.lightblue{width:123px; background:url("../images/nav-lightblue-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.lightblue:hover,
    header .grid nav ul li.lightblue.on{background-position: 0 -37px;}
    header .grid nav ul li.songs{width:177px; background:url("../images/nav-songs-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.songs:hover,
    header .grid nav ul li.songs.on{background-position: 0 -37px;}
    header .grid nav ul li.red{width:123px; background:url("../images/nav-red-sprite_D.png") no-repeat 0 0;}
    header .grid nav ul li.red:hover,
    header .grid nav ul li.red.on{background-position: 0 -37px;}

    section.intro .song-grid{grid-template-columns:1fr;}
    section.intro .song-grid h1{grid-column-end:unset;}
    section.intro .song-grid .video{width:721px; height:398px; display:block; padding:60px 113px;}
    section.intro .song-grid .icons .age{width:84px; width:84px;}
    section.intro .song-grid .icons .download{height:84px; width:84px;}

    section.categories .grid .product .image{height:150px; width:150px;}
    section.categories .grid .product .image .overlay{width:150px; height:150px;}
    section.categories.artists .grid .product{padding:4px;}
    section.categories.artists .grid .product .image{height:200px; width:200px; margin:auto;}
    section.categories.artists .grid .product .image .overlay{height:200px; width:200px;}

    section.reviews{padding:32px 0;}
    section.reviews .review{padding:24px;}
    section.reviews .wrapper{height:300px;}
    section.reviews .review:nth-of-type(5n){bottom:0; left:50%;}
    section.reviews .review:nth-of-type(5n+1){transform:rotate(4deg); bottom:69%; left:0%;}
    section.reviews .review:nth-of-type(5n+2){transform:rotate(0deg); bottom:77%; right:5%;}
    section.reviews .review:nth-of-type(5n+3){transform:rotate(2deg); bottom:50%; left:0%}
    section.reviews .review:nth-of-type(5n+4){transform:rotate(-6deg); bottom:39%; right:5%;}
    section.reviews .bg-branch{width:80%; height:25px;}
    section.reviews .bg-branch.one{width:78%; bottom:66%; left:5%;}
    section.reviews .bg-branch.two{bottom:48%; left:14%;}
    section.reviews .bg-branch.three{bottom:24%; right: 4%;}
    section.reviews .bg-branch.four,
    section.reviews .bg-branch.five{display:none;}


}
/*tablet*/
@media only screen and (max-width:896px) 
{   
    section.reviews .wrapper{max-width:100%;} 
}

/*tablet*/
@media only screen and (max-width:768px) 
{   
    h1{font-size:2.5rem;}
    h2{font-size:2.0rem;}
    h3{font-size:1.8rem;}
    h4{font-size:1.8rem;}
    main.splash{background:none;} 
    header{overflow:visible; height:200px; margin-bottom:48px;}
    header .grid{height:300px; display:grid; grid-template-columns:1fr 1fr 1fr; grid-template-rows:200px 50px; column-gap:32px; background:url('../images/header-text.svg') no-repeat 40px 71px/ 60%;}
    header .grid .logo{ height:120px; margin-top:-20px;}
    header .grid .icons .wrapper{margin:16px 0px;}
    header .grid .icons .wrapper .searchbar input{height:24px;}
    header .grid .icons .wrapper .searchbar input[type="image"]{margin-right:0px;}
    header .grid .icons .wrapper .newsletter{height:48px; width:48px;}
    header .grid .icons .wrapper .artist{height:48px; width:48px;}
    header .grid .icons .wrapper .advies{height:48px; width:48px;}
    header .grid .icons .wrapper .news{height:48px; width:48px;}
    header .grid .icons .wrapper .presentatiedag{height:48px; width:48px;}
    header .grid nav ul li{height:25px; width:133px;}
    header .grid nav ul li a{height:inherit; width:inherit;}
    header .grid nav ul li.green{width:132px;background:url("../images/nav-green-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.green:hover,
    header .grid nav ul li.green.on{background-position:0 -25px;}
    header .grid nav ul li.blue{width:111px;background:url("../images/nav-blue-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.blue:hover,
    header .grid nav ul li.blue.on{background-position: 0 -25px;}
    header .grid nav ul li.pink{width:87px; background:url("../images/nav-pink-2-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.pink:hover,
    header .grid nav ul li.pink.on{background-position: 0 -25px;}
    header .grid nav ul li.yellow{width:63px; background:url("../images/nav-yellow-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.yellow:hover,
    header .grid nav ul li.yellow.on{background-position: 0 -25px;}
    header .grid nav ul li.lightblue{width:84px; background:url("../images/nav-lightblue-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.lightblue:hover,
    header .grid nav ul li.lightblue.on{background-position: 0 -25px;}
    header .grid nav ul li.songs{width:84px; background:url("../images/nav-songs-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.songs:hover,
    header .grid nav ul li.songs.on{background-position: 0 -25px;}
    header .grid nav ul li.red{width:84px; background:url("../images/nav-red-sprite_C.png")no-repeat 0 0;}
    header .grid nav ul li.red:hover,
    header .grid nav ul li.red.on{background-position: 0 -25px;}

    .formintro{padding:24px 96px;}
    .formintro h1{}
    
    form.form-grid{padding:24px 96px;}
    form.form-grid div.label span{border-bottom:12px solid #90D1A3; font-size:1.6rem;}
    
    section .return{height:50px; width:200px; background: url('../images/return.svg') no-repeat top left; margin-bottom:24px;}
    section.intro article.advise{padding:24px 96px;}

    section.intro .song-grid .video{width:378px; height:209px; display:block; padding:32px 60px;}
    section.intro .song-grid .icons .age{width:60px; width:60px;}
    section.intro .song-grid .icons .download{height:60px; width:60px;}

    section.categories h2{ margin-bottom:64px;}
    section.categories .grid{display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:16px;}
    section.categories .grid .product{width:100%; position:relative; padding:22px 16px;}
    section.categories .grid .product .age{background-repeat:no-repeat; background-position:0 0; width:48px; height:48px; position:absolute; top:-16px; left:50%; transform: translate(-50%, 0);}
    section.categories .grid .product.bg-green:hover .age{background-image:url("../images/eye-green.svg") !important;}
    section.categories .grid .product.bg-purple:hover .age{background-image:url("../images/eye-purple.svg") !important;}
    section.categories .grid .product.bg-yellow:hover .age{background-image:url("../images/eye-yellow.svg") !important;}
    section.categories .grid .product.bg-red:hover .age{background-image:url("../images/eye-pink.svg") !important;}
    section.categories .grid .product .image{height:100px; width:100px; margin:12px auto 6px auto;}
    section.categories .grid .product .image .overlay{width:100px; height:100px;}
    section.categories .grid .product h3,
    section.categories .grid .product h4{width:80%; margin:8px auto; color:#2D2E83;}
    section.categories.artists .grid .product{padding:4px;}
    section.categories.artists .grid .product .image{height:200px; width:200px; margin:auto;}
    section.categories.artists .grid .product .image .overlay{height:200px; width:200px;}
    section.categories .filter .panel form{grid-template-columns:repeat(2,50%);}

    section.product .grid{width:100%; display:grid; grid-template-columns:repeat(3,1fr); column-gap:16px; row-gap:48px; padding-top:16px; border-top:4px dotted #2d2e83;}
    section.product .grid .image{grid-column-end:span 3;}
    section.product .grid .image img{width:100%; object-fit:cover;}
    section.product .grid .title{grid-column-end:span 3;}
    section.product .grid .title *{margin:0px !important;}
    section.product .grid .title h2{font-weight:normal; font-family:'Source Sans Pro', sans-serif;}
    section.product .grid article{grid-column-end:span 3;}
    section.product .grid .media{grid-column-end:span 3; max-height:unset;}
    section.product .grid .media img{width:100%; object-fit:cover;}
    section.product .grid .media iframe{width:100%; height:100%;}
    section.product .grid .actions{grid-column-end:span 3;}
    section.product .grid .actions .contact{height:150px; width:150px; text-indent:-4000px;}
    /*section.product .grid .actions .contact:hover{background:url('../images/ico-contacteer-artiest-02.svg') no-repeat top right;}*/
    section.product .grid .actions .advies{height:150px; width:150px; text-indent:-4000px;}
    /*section.product .grid .actions .advies:hover{background:url('../images/ico-advies-02.svg') no-repeat top right;}*/

    section.reviews{padding:32px 0;}
    section.reviews .review{padding:24px; width:100%; position: relative; margin:20px auto;}
    section.reviews .wrapper{max-width:100%; height:unset;}
    section.reviews .review:nth-of-type(5n){bottom:0; left:50%;}
    section.reviews .review:nth-of-type(5n+1){transform:rotate(4deg); bottom:unset; left:unset;}
    section.reviews .review:nth-of-type(5n+2){transform:rotate(0deg); bottom:unset; right:unset;}
    section.reviews .review:nth-of-type(5n+3){transform:rotate(2deg); bottom:unset; left:unset;}
    section.reviews .review:nth-of-type(5n+4){transform:rotate(-6deg); bottom:unset; right:unset;}
    section.reviews .bg-branch{width:450px; height:25px;}
    section.reviews .bg-branch.one{width: 80%; transform:rotate(4deg); bottom:78%; left:2%;}
    section.reviews .bg-branch.two{width: 93%; transform:rotate(2deg); bottom:48%; left:4%;}
    section.reviews .bg-branch.three{width: 88%; transform:rotate(-4deg); bottom:24%; right: 5%;}

    footer{padding:24px 0;}
    footer .grid .newsletter{height:64px; width:64px;}
    footer .grid .newsletter:hover{height:64px; width:64px;}
    footer .grid .contact .socialicons{display:flex; justify-content:flex-end; margin-top:24px;}
}

/*mobile l*/
@media only screen and (max-width:426px)
{
    body{font-size:1.4rem;}
    h1{font-size:2.0rem;}
    h2{font-size:1.6rem;}
    h3{font-size:1.4rem;}
    h4{font-size:1.4rem;}

    form.smaller{width:100%;}
    form.form-grid{grid-template-columns:1fr;}
    form.form-grid .wide{grid-column-end:unset;}
    form.form-grid .label{border-bottom:0px !important}    
    form.form-grid div{padding:0px;}
    .formintro{padding:24px; background:url('../images/contact-form.png') no-repeat right rgba(144,209,163,.38);}
    .formintro h1{}
    form.form-grid{padding:24px;}
    form.form-grid div.label span{border-bottom:8px solid #90D1A3; font-size:1.4rem;}    
    form.form-grid .message{min-height:72px;}
    form.form-grid .fit{grid-template-columns:1fr; gap:8px;}
    
    main.splash{background-position:24px 200px; background-size:300px auto;} 
    
    header{height:110px; margin-bottom:32px;}
    header .grid{height:110px; display:grid; grid-template-columns:240px auto; grid-template-rows:unset; column-gap:32px; background:none;}
    header .grid .logo{grid-area:unset; height:90px; margin-top:0px;}
    header .grid .icons{display:none;}
    header .grid .icons .wrapper{display:none;}
    header .grid .icons .wrapper .socialicons{display:none;}
    header .grid .icons .wrapper .searchbar{display:none;}
    header .grid .icons .wrapper .newsletter{display:none;}
    header .grid .icons .wrapper .artist{display:none;}
    header .grid .icons .wrapper .news{display:none;}
    header .grid .icons .wrapper .presentatiedag{display:none;}
    header .grid nav{width:100%; height:auto; display:block; float:none; left:0; top:-800px; position:absolute; -webkit-transform:translateY(-140%); transform:translateY(-140%); -webkit-transition:-webkit-transform 0.5s, visibility 0s 0.5s; transition:transform 0.5s, visibility 0s 0.5s;}
    header .grid .menu{display:unset; display:block; text-align:right; grid-area:unset;}
    header .grid .menu a{height:100px;}
    header .grid .menu a i{font-size:2.5rem; color:#2D5088; line-height:100px;}    
    header .grid nav ul{width:100%; height:auto; display:block; position:relative; float:left; padding:12px; background:#ffffff;}
    header .grid nav ul li.green{width:100%; background-position:top right;}
    header .grid nav ul li.green:hover,
    header .grid nav ul li.green.on{background-position:top right;}
    header .grid nav ul li.blue{width:100%;background-position:top right;}
    header .grid nav ul li.blue:hover,
    header .grid nav ul li.blue.on{background-position:top right;}
    header .grid nav ul li.pink{width:100%;background-position:top right;}
    header .grid nav ul li.pink:hover,
    header .grid nav ul li.pink.on{background-position:top right;}
    header .grid nav ul li.yellow{width:100%;background-position:top right;}
    header .grid nav ul li.yellow:hover,
    header .grid nav ul li.yellow.on{background-position:top right;}
    header .grid nav ul li.lightblue{width:100%;background-position:top right;}
    header .grid nav ul li.lightblue:hover,
    header .grid nav ul li.lightblue.on{background-position:top right;}
    header .grid nav ul li.red{width:100%;background-position:top right;}
    header .grid nav ul li.red:hover,
    header .grid nav ul li.red.on{background-position:top right;}
    header .grid nav ul li{width:100%; height:auto; height:25px; display:block; float:left; margin:0px; text-align:right; margin: 12px 0;}
    header .grid nav.open{width:100vw; height:100vh; display:block; float:none; left:-24px; top:0px; z-index:110; position:absolute; margin:0px !important; -webkit-transform:translateY(0%); transform:translateY(0%); -webkit-transition:-webkit-transform 0.5s; transition:transform 0.5s;}
    header .grid nav.open .mobicons{width:100%; height:64px; display:block; background:#fff182; float:left; padding:8px 12px}
    header .grid nav.open .mobicons .newsletter{height:48px; width:48px; display:block; float:right; background: url("../images/ico-nieuwsbrief-01.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .newsletter:hover{background: url("../images/ico-nieuwsbrief-02.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .newsletter img{height:100%; width:100%; object-fit:cover;}
    header .grid nav.open .mobicons .artist{height:48px; width:48px; display:block; float:right; margin-right:12px; background: url("../images/ico-aanmelden-artiest-01.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .artist:hover{background: url("../images/ico-aanmelden-artiest-02.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .artist img{height:100%; width:100%; object-fit:cover;}
    header .grid nav.open .mobicons .advies{height:48px; width:48px; display:block; float:right; margin-right:12px; background: url("../images/ico-advies-02.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .advies:hover{background: url("../images/ico-advies-01.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .advies img{height:100%; width:100%; object-fit:cover;}
    header .grid nav.open .mobicons .news{height:48px; width:48px; display:block; float:right; margin-right:12px; background: url("../images/ico-nieuws-02.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .news:hover{background: url("../images/ico-nieuws-01.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .news img{height:100%; width:100%; object-fit:cover;}
    header .grid nav.open .mobicons .presentatiedag{height:48px; width:48px; display:block; float:right; margin-right:12px; background: url("../images/ico-presentatiedag-02.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .presentatiedag:hover{background: url("../images/ico-presentatiedag-01.svg") no-repeat 0 0;}
    header .grid nav.open .mobicons .presentatiedag img{height:100%; width:100%; object-fit:cover;}

    a.season {width:100px; height:100px;}
    
    section.intro{padding-bottom:0px;}
    section.intro.padding-bottom{padding-bottom:32px;}
    section.intro.splash{min-height:unset;}
    section.intro.splash .container{min-height:unset; background:none;}
    section.intro.splash article{width:100%;}
    section.intro.splash h1{height:100px; margin-bottom:12px; background:url('../images/title-speelnest.png') no-repeat top right / contain;}
    section.intro article.advise{padding:24px;}

    section.intro .grid{display:block;}
    section.intro .grid article{padding:unset; }
    section.intro article.seasonal{display:block;}

    section.categories h2{ margin-bottom:32px;}
    section.categories .grid{grid-template-columns:1fr; grid-gap:16px;}
    section.categories .grid .product{width:100%; position:relative; padding:48px 16px;}
    section.categories .grid .product .age{background-repeat:no-repeat; background-position:0 0; width:64px; height:64px; position:absolute; top:-16px; left:50%; transform: translate(-50%, 0);}
    section.categories .grid .product .image{height:250px; width:250px; margin:24px auto 12px auto;}
    section.categories .grid .product .image .overlay{width:250px; height:250px;}
    section.categories.artists .grid .product{padding:4px;}
    section.categories.artists .grid .product .image{height:200px; width:200px; margin:auto;}
    section.categories.artists .grid .product .image .overlay{height:200px; width:200px;}
    section.categories .filter .panel form{grid-template-columns:1fr;}

    section.product{}
    section.product .grid{grid-template-columns:1fr; row-gap:24px;}
    section.product .grid .image{grid-column-end:unset;}
    section.product .grid .legend{grid-column-end:unset;}
    section.product .grid .legend .tags{display:grid; grid-template-columns:repeat(8,1fr); grid-gap:12px;}
    section.product .grid .title{grid-column-end:unset;}
    section.product .grid article{grid-column-end:unset;}
    section.product .grid .media{grid-column-end:unset; max-height:unset; margin-bottom:24px;}
    section.product .grid .media img{width:100%; object-fit:cover;}
    section.product .grid .media iframe{width:100%; height:100%;}
    section.product .grid .actions{grid-column-end:unset; grid-template-columns:1fr 1fr; grid-gap:12px;}
    section.product .grid .actions p{grid-column-end:span 2;}
    section.product .grid .actions .contact{height:100px; width:100px;}
    section.product .grid .actions .advies{height:100px; width:100px;}
    
    section.bird{padding:32px 0px 0px 0px;}
    section.bird h1{width:100%; height:90px; margin:0px !important; background-size:80%; }
    section.bird h1.lappie{height:160px; background-size:90%;}
    section.bird .split{display:grid; grid-template-columns:1fr; grid-gap:24px;}
    section.bird .split .image img{width:100%; height:100%; object-fit:contain;}
    section.bird .split.switch{grid-template-columns:1fr;}
    section.bird .split.switch .image{grid-area:unset; width:80%; height:80%; }

    section.reviews{padding:32px 0;}
    section.reviews .review{padding:24px; width:100%; position: relative; margin:20px auto;}
    section.reviews .wrapper{max-width:100%; height:unset;}
    section.reviews .review:nth-of-type(5n){bottom:0; left:50%;}
    section.reviews .review:nth-of-type(5n+1){transform:rotate(4deg); bottom:unset; left:unset;}
    section.reviews .review:nth-of-type(5n+2){transform:rotate(0deg); bottom:unset; right:unset;}
    section.reviews .review:nth-of-type(5n+3){transform:rotate(2deg); bottom:unset; left:unset;}
    section.reviews .review:nth-of-type(5n+4){transform:rotate(-6deg); bottom:unset; right:unset;}
    section.reviews .bg-branch{width:450px; height:25px;}
    section.reviews .bg-branch.one{width: 80%; transform:rotate(4deg); bottom:78%; left:2%;}
    section.reviews .bg-branch.two{width: 93%; transform:rotate(2deg); bottom:48%; left:4%;}
    section.reviews .bg-branch.three{width: 88%; transform:rotate(-4deg); bottom:24%; right: 5%;}
    
    section.brochure object{display:none;}
    section.brochure .actions{width:100%; grid-template-columns:1fr 1fr; grid-gap:24px;}
    section.brochure .actions div{width:100% !important;}

    footer{padding:16px 0;}
    footer .grid{display:grid; grid-template-columns:1fr 1fr; grid-gap:16px;}
    footer .grid .newsletter{display:none;}
    footer .grid .contact .socialicons{display:flex; justify-content:flex-end; margin-top:8px;}
    footer .grid .copyright{grid-column-end:span 3; display:grid; grid-template-columns:1fr; grid-gap:8px;}
    footer .grid .copyright div{text-align:center !important;}
}

/*mobile m*/
@media only screen and (max-width:376px)
{
    h2{font-size:1.6rem;}
    section.bird h1{height:80px;}
    section.bird h1.lappie{height:160px;}
    section.categories .grid .product .image{height:200px; width:200px; margin:24px auto 12px auto;}
    section.categories .grid .product .image .overlay{width:200px; height:200px;}
}

/*mobile s*/
@media only screen and (max-width:320px)
{
    header .grid{grid-template-columns:200px auto;}
    header .grid .logo{height:82px;}
    
    .formintro h1{font-size:1.6rem;}
    section.intro.splash article{}

    section.categories .grid .product .image{height:180px; width:180px; margin:12px auto 8px auto;}
    section.categories .grid .product .image .overlay{width:180px; height:180px;}
    section.categories.artists .grid .product .image{height:200px; width:200px; margin:auto;}
    section.categories.artists .grid .product .image .overlay{height:200px; width:200px;}
}