html {
  overflow-x: hidden;/* The absolutely positioned .plectrum in the footer, as well as an Opera bug with box-shadow, causes side-scrollers. We don't want side-scrollers! TODO: investigate if we can get rid off this somehow in the current world. */
  float: left;/* Stretch around all the floated elements, so that the html-bg actually is bottom aligned to the window. Expected behaviour is unclear in the spec; see https://bugzilla.mozilla.org/show_bug.cgi?id=590491 */
  width: 100%;/* Make this full-width to allow center aligning of the #container to keep working. */
  font-size: 75%;/* Effective 12px */
  background-color: #fff;
}
html.theme .bibliotheek-container {
  background-position: left 132px;/* Start the pattern under the header overlay, assuming default font-size. */
}
html.theme .bibliotheek-container::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 112px;
  padding: 0 0 1.25em;
  content: "";
  background-color: inherit;
}
html.theme .cookieBar-filler + .bibliotheek-container::before {
  position: relative;
}
html.theme.kids .bibliotheek-container {
  background-color: #c1e64f;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg_pattern_0-6.png");
}
html.theme.jeugd .bibliotheek-container {
  background-color: #00a093;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg_pattern_6-12.png");
  background-position: -210px 132px;
}
html.theme.jong .bibliotheek-container {
  background-color: #009ce0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg_pattern_12.png");
  background-position: -130px 132px;
}
html.theme.jongeren .bibliotheek-container {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg_pattern_15.png");
}
html.theme #widget-identifier-bnl-zoeken {
  padding: 5px 10px;
  background: rgba(239, 239, 239, 0.9);
}
body {
  margin: 0;
  font-family: Arial, Verdana, sans-serif;
  font-size: 1.3417rem;
  padding: 1rem;
}
html.theme .cookieBar-filler + .bibliotheek-container > #bibliotheek-nl-page {
  margin-top: -130px;
}
#bibliotheek-nl-page {
  width: 97%;
  max-width: 1200px;
  min-height: 50em;
  margin: 0 auto;
  padding: 0 4px;/* 4px padding to give room for the box-shadows and outlines, given that overflow is hidden */
}
.bibliotheek-container {
  overflow: hidden;
}
/* landingpage layout*/
.biebwidget-double-column {
  float: left;
  min-width: 560px;
  width: 68%;
}
.biebwidget-double-column .biebwidget {
  margin-right: 3%;
}
.biebwidget-column {
  float: left;
  min-width: 280px;
  width: 32%;
}
.biebwidget-double-column .biebwidget-column {
  width: 50%;
}
.biebwidget-double-column .biebwidget-column .biebwidget {
  margin-right: 6%;
}
/*** Widget styling ***/
/* Widget frame styling */
/* A .standard biebwidget is a bordered widget as seen on the homepage or any subsequent page; 20px padding, 20px margin-bottom, box-shadow.
   A .bordered biebwidget is a .standard widget without padding; used for widgets with atypical spacing (drawing up to the border) like the tabbedbanner.
   A .basic biebwidget only has the 20px margin-bottom; used for widgets with a completely unique style, like the schatkamer.
   A biebwidget without one of the above classes doesn't get any container styling at all. Used for unique page-elements like the navigatiebalk.
   A .overflowing biebwidget draws content outside its container, so doesn't have the standard overflow: hidden which helps widgets not interfere with each other.
*/
.biebwidget > h2 {
  margin: 0;/* reset */
}
.standard.biebwidget,
.bordered.biebwidget,
.basic.biebwidget {
  margin-bottom: 20px;
}
.standard.biebwidget,
.bordered.biebwidget {
  background-color: #ffffff;
  -webkit-box-shadow: 0 1px 3px 0 #868686;
  box-shadow: 0 1px 3px 0 #868686;
}
.standard.biebwidget >  {
  padding: 40px 40px;
}
@media only screen and (min-width: 0) and (max-width: 469px) {
  .standard.biebwidget >  {
    padding: 20px 20px;
  }
}
.standard.biebwidget > h2 +  {
  padding-top: 0;
}
.standard.expandable.biebwidget > h2.label +  {
  padding-top: 40px;
}
.standard.biebwidget > h2,
.bordered.biebwidget > h2,
.standard.biebwidget > .biebwidget-content:first-child > h2:first-child,
.bordered.biebwidget > .biebwidget-content:first-child > h2:first-child {
  padding: 10px 40px;
}
@media only screen and (min-width: 0) and (max-width: 469px) {
  .standard.biebwidget > h2,
  .bordered.biebwidget > h2,
  .standard.biebwidget > .biebwidget-content:first-child > h2:first-child,
  .bordered.biebwidget > .biebwidget-content:first-child > h2:first-child {
    padding: 10px 20px;
  }
}
.widget-columns .standard.biebwidget >  {
  padding: 20px 20px;
}
.widget-columns .standard.biebwidget > h2 +  {
  padding-top: 0;
}
.widget-columns .standard.biebwidget > h2,
.widget-columns .bordered.biebwidget > h2,
.widget-columns .standard.biebwidget > .biebwidget-content:first-child > h2:first-child,
.widget-columns .bordered.biebwidget > .biebwidget-content:first-child > h2:first-child {
  padding: 10px 20px;
}
.standard.biebwidget > h2,
.bordered.biebwidget > h2,
.standard.biebwidget > .biebwidget-content:first-child > h2:first-child,
.bordered.biebwidget > .biebwidget-content:first-child > h2:first-child {
  font-weight: normal;
  color: #ff7320;
  font-family: Arial, sans-serif;
}
.standard.biebwidget > h2,
.standard.biebwidget > .biebwidget-content:first-child > h2:first-child {
  font-size: 1.725rem;
}
.bordered.biebwidget > h2,
.bordered.biebwidget > .biebwidget-content:first-child > h2:first-child {
  font-size: 1.5333rem;
}
h2 {
  font-family: Arial, sans-serif;
}
.overflowing.biebwidget >  {
  overflow: visible;
}
.biebwidget > p.endorsement {
  margin: -5px 0 0 0;
  padding: 0 20px 20px 20px;
  text-align: right;
  color: #868686;
  font-size: 1.0542rem;
}
.biebwidget > p.endorsement > a {
  color: inherit;
}
.biebwidget > p.endorsement > a:hover,
.biebwidget > p.endorsement > a:focus {
  color: #ff7320;
}
/* Generic widget styling */
{
/* Basic prevention of this widget interfering with others; Also force clear floats. */
  overflow: hidden;
  color: #505450;
}
/* Some resets */
ol,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
  list-style: none;
}
h2 {
  font-weight: normal;
  font-size: 1.5333rem;
}
h3 {
  font-weight: normal;
  font-size: 1.5333rem;
}
h4 {
  font-weight: normal;
  font-size: 1.5333rem;
}
h5 {
  font-weight: normal;
  font-size: 1.5333rem;
}
h6 {
  font-weight: normal;
  font-size: 1.5333rem;
}
h3,
h4,
h5,
h6 {
  font-family: Arial, sans-serif;
}
h3 {
  line-height: 1.3;
  color: #505450;
}
li,
p,
dd,
dt {
  line-height: 1.3;
}
.intro + .maintext,
.maintext + p,
.richtext + p,
.richtext + .rich-items,
.pagenav + p,
p.separate,
p + p,
ul + p,
ol + p,
p + .rich-items,
  /* When the p is a .tools / .totalresults, its margin-bottom collapses with this margin-top. */
p + .itemnav,
p + .tagcloud {
  margin-top: 20px;
}
.sectioned .section {
  margin-top: 20px;
}
h2 + .maintext,
.maintext:first-child {
  margin-top: -2px;/* Offset for the baseline of the first line of .maintext content being 2px lower than it'd be for non-.maintext content. */
}
.maintext h1,
.maintext h2,
.maintext h3,
.maintext h4,
.maintext h5,
.maintext h6 {
  line-height: 1.3;
}
.main-column h2 + .maintext > h3:first-child {
  margin-top: -4px;/* More baseline offset to keep the first line of text lined out correctly. */
  margin-bottom: 4px;
}
.richtext ul,
.richtext ol,
.richtext object,
.richtext object > p,
.richtext div.video {
  margin-bottom: 12px;
}
.richtext li ul,
.richtext li ol {
  margin-bottom: 0;
}
.richtext p + ul,
.richtext p + ol,
.richtext p + img,
.richtext p + img + p,
.richtext p + img + ul,
.richtext p + img + ol,
.richtext p + object,
.richtext p + object > p,
  /* Fallback content. */
.richtext p + div.video,
.richtext p + h3,
.richtext p + h4,
.richtext p + h5,
.richtext p + h6,
.richtext p + dl.meta,
.richtext .intro + dl.meta,
.richtext object + dl.meta,
.richtext div.video + dl.meta,
.richtext dl.meta + p,
dl.meta + h3,
dl.meta + h4,
dl.meta + h5,
dl.meta + h6,
.richtext .maintext + h3,
.richtext .maintext + h4,
.richtext .maintext + h5,
.richtext .maintext + h6,
.richtext h4 + object,
.richtext h5 + object,
.richtext h4 + div.video,
.richtext h5 + div.video {
  margin-top: 20px;
}
.richtext h3 + h4,
.richtext h4 + h5 {
  margin-top: 5px;
}
.sectioned .title.section + .section > h4:first-child {
  margin-top: -15px;/* Offset the 20px of the .section to arrive at the 5px from above. */
}
/* list */
.richtext span.image ~ *:not(.plain) > li {
  pointer-events: none;
}
.richtext span.image ~ *:not(.plain) > li a {
  pointer-events: auto;
  position: relative;
}
.richtext *:not(.plain) > li {
  position: relative;
}
.richtext ul:not(.plain) > li:before,
.richtext ol:not(.plain) > li:before {
  display: inline-block;
}
.richtext ul:not(.plain) > li {
  left: 1.33rem;
  margin-right: 1.33rem;
  text-indent: -1.33rem;
}
.richtext ul:not(.plain) > li:before {
  width: 1.33rem;
  text-indent: 0;
  content: "\2022";
  vertical-align: -3px;
  height: 15px;
  font-size: 1.9167rem;
}
.richtext ol:not(.plain) {
  counter-reset: list-count;
}
.richtext ol:not(.plain) > li {
  left: 2.527rem;
  margin-right: 2.527rem;
  text-indent: -2.527rem;
}
.richtext ol:not(.plain) > li:before {
  width: 2.527rem;
  text-indent: 0;
  content: counter(list-count) ".";
  counter-increment: list-count;
}
.richtext ol:not(.plain) > li:nth-child(n)::before {
  text-indent: .7315rem;
  text-indent: 1ch;
}
.richtext ol:not(.plain) > li:nth-child(n+10)::before {
  text-indent: 0;
}
.richtext ol:not(.plain) > li:nth-child(n+100)::before {
  text-indent: -.7315rem;
  text-indent: -1ch;
}
.richtext *:not(.plain) > li > * {
  text-indent: 0;/* Don't let this inherited property do any damage. */
}
.richtext ol:not(.plain) {
  margin-left: 5px;
}
a,
button.link {
  color: #505450;
  text-decoration: underline;
}
a.button,
.tabs a,
.link-list a,
.filter-block a,
.delete-list a,
.pagenav a,
.metanav a,
.metanav button {
  text-decoration: none;
}
a img {
  border: none;
}
a:hover,
* a:hover,
a:focus,
* a:focus,
button.link:hover,
button.link:focus {
  text-decoration: underline;
  color: #ff7320;
}
.intro {
  font-size: 1.6771rem;
}
/* TODO: review this; is this really as generic as it gets? How would the existence of this line be described? */
.intro + .rich-items {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
ol > li > a:only-child,
ul > li > a:only-child {
  display: block;
}
/* Elements hidden while animating a foldable */
.closing + .filter-block button,
.opening + .filter-block button,
.closing + .expanding-block button,
.opening + .expanding-block button {
  visibility: hidden;
}
/* Page layout styling------------------------------------------------------------*/
/* Two column page styling, order: 2-1 (vestiges of 2-1-3 removed, since they were completely unused) */
.main-column-wrapper {
  padding-bottom: 40px;
}
.main-column-wrapper.nav {
  float: left;
  width: 100%;
}
.biebwidget-content.detail .main-column-wrapper:not(.nav) h2,
.biebwidget-content.detail .main-column-wrapper:not(.nav) h2 ~ p,
.biebwidget-content.detail .main-column-wrapper:not(.nav) form::before,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .form-row,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .intro p,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext p:not(.viz):not(.accessiblebannertext),
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext ul,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext ol,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext > h3,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext *:not(li) > h3,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext > h4,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext *:not(li) > h4,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext h5,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext h6,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext dl.meta,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext object,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext div.video,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext .table table:not(.full),
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext .highlight > .content,
.biebwidget-content.detail .main-column-wrapper:not(.nav) .message {
  max-width: 765px;
  margin-right: auto;
  margin-left: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext span.image {
  display: block;
  max-width: 765px;
  margin-right: auto;
  margin-left: auto;
}
.errorpage.biebwidget  .main-column-wrapper {
  padding-bottom: 0;
}
.main-column-wrapper.nav .main-column {
  margin: 0 0 0 255px;
}
.nav-column {
  float: left;
  width: 255px;
  margin-left: -100%;
  padding-right: 40px;
  font-size: 1.15rem;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.nav-column .rich-items h3 {
  margin-top: 0;
}
/*
OUTDATED Progression of header sizes:
- landingpage widget: 18px, 12px bold
- nav-column: 16px, 12px bold
- main-column detailpage: 24px, 16px, 13px bold
- main-column overviewpage: 24px, 13px bold
*/
.main-column h2 {
  margin-top: -8px;
  margin-bottom: 7px;/* Creates an effective 15px gap to the next textual content. */
  word-wrap: break-word;/* Necessary given the huge font-sizes. */
  color: #ff7320;
  font-size: 5.75rem;
  text-indent: -2px;
  font-family: Arial, sans-serif;
}
.main-column h2.long {
  font-size: 4.025rem;
}
.nav-column h2 {
  overflow: hidden;
  margin-bottom: 1px;
  padding-bottom: 10px;
  text-overflow: ellipsis;
  font-size: 1.6771rem;
  font-family: Arial, sans-serif;
}
.nav-column > p:first-child {
  margin-top: 32px;/* Baseline on the same height as the content following the .main-column h2. (Assuming a .tools) */
}
.nav-column > p.additional:first-child {
  margin-top: 33px;/* Baseline on the same height as the content following the .main-column h2. (Assuming a .tools) */
}
.nav-column * + h2 {
  margin-top: 40px;/* Spacing for subsequent blocks. */
}
.nav-column *:first-child + h2 {
  margin-top: 28px;/* If there's just one element before the h2... */
}
.main-column h3 {
  font-weight: normal;
  font-size: 2.0125rem;
}
.rich-items h4 {
  line-height: 1.3;
}
.main-column .rich-items h3 {
  font-size: 1.6771rem;
}
.main-column h4 {
  font-size: 1.6771rem;
}
.grid-items h3 {
  font-size: 1.3417rem;
}
.grid-items h4 {
  font-size: 1.3417rem;
}
.main-column h5 {
  font-style: italic;
  color: #101310;
  font-size: 1.2458rem;
}
.main-column .rich-items .content.calendar h3 {
  margin-right: 130px;/* Free up space for the .offset image. */
}
.main-column .content.more h3 .button {
  font-size: 1.3417rem;
}
.main-column .content.more h4 .button {
  font-family: Arial, sans-serif;
  font-size: 1.3417rem;
}
.nav-column h3 {
  margin-top: 11px;/* Effective white-space: 15px. */
  font-size: 1.3417rem;
}
.nav-column h3:first-child {
  margin-top: 0;
}
.nav-column li {
  margin: 6px 0;
  word-wrap: break-word;
}
.nav-column img {
  max-width: 220px;
}
.nav-column p {
  margin-bottom: 15px;
}
/* END Page Styling ------------------------------------------------------------*/
.link-list {
  margin-top: 5px;
}
.link-list > li {
  margin: 6px 0;
  padding-left: 10px;
  text-indent: -10px;
}
.filter-block > .link-list:last-of-type > li:first-of-type,
.expanding-block > .link-list:last-of-type > li:first-of-type,
.expanding-block > .link-list:last-of-type > li:first-of-type,
.relatedlinks .link-list:last-of-type > li:first-of-type {
  margin: 0;
}
.link-list > li > a {
  padding-left: 10px;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/link-item.png") no-repeat left 5px;
}
.link-list > li > a:only-child {
  display: inline;/* In link-lists, links should just be inline even if they're :only-child. */
}
.link-list > li > a:hover {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAHBAMAAADZviHeAAAAJFBMVEX/cyD/cyD/cyD/cyD/cyD/cyD/cyD/cyD/cyD/cyAAAAD/cyAFy1A7AAAAC3RSTlPdqu6Zd8wzZhGIAHAF7R8AAAAkSURBVAgdYyyUVGDSOsfAxBF1gYn9pQ3TL4UjDNFsq1gs9RkAZrQHX2cqXGcAAAAASUVORK5CYII=");
}
.nav-column .link-list,
.filter-block,
.expanding-block {
  position: relative;
  padding-bottom: 10px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left bottom;
}
.nav-column .link-list .link-list {
  padding-bottom: 0;
}
.filter-block {
  padding-bottom: 2.833em;
}
.filter-block button,
.expanding-block button {
  position: absolute;
  bottom: 0.833em;
}
.filter-block button.quaternary,
.expanding-block button.quaternary {
  background-image: none;
}
.filter-block button.quaternary.hidden,
.expanding-block button.quaternary.hidden {
  display: none;
}
.filter-block button.quaternary:hover,
.expanding-block button.quaternary:hover,
.filter-block button.quaternary:focus,
.expanding-block button.quaternary:focus {
  background-image: none;
}
.filter-block button.quaternary.more::before,
.expanding-block button.quaternary.more::before,
.filter-block button.quaternary > .button.quaternary:not(.open)::before,
.expanding-block button.quaternary > .button.quaternary:not(.open)::before {
  content: "+";
  display: inline-block;
  margin-right: .45rem;
}
.filter-block button.quaternary.less::before,
.expanding-block button.quaternary.less::before,
.filter-block button.quaternary > .button.quaternary.open::before,
.expanding-block button.quaternary > .button.quaternary.open::before {
  content: "\2212";
  display: inline-block;
  margin-right: .45rem;
}
.expanding-block button.quaternary {
  margin-bottom: -1em;
}
.filter-block .link-list,
.expanding-block .link-list {
  padding: 0;
  background-image: none;
}
.nav-column .link-list:last-child {
  background-image: none;
}
.richtext .link-list > li {
  list-style: none;
}
/* There'll be several unnecessary properties in here. Sadly that's the price of making them configurable. */
ul.subnav a {
  display: block;
  padding-bottom: 2px;
  text-decoration: none;
  color: #505450;
}
ul.subnav a:focus,
ul.subnav a:hover {
  color: #ff7320;
}
ul.subnav > li {
  margin: 3px 0 2px 0;
  font-size: 1.15rem;
}
ul.subnav > li.current > a {
  color: #ff7320;
}
ul.subnav ul {
  margin-top: 2px;
  padding-top: 2px;
  padding-bottom: 1px;
}
ul.subnav ul a:focus,
ul.subnav ul a:hover {
  color: #ff7320;
}
ul.subnav ul > li {
  margin: 2px 0 2px 0;
  font-size: 1.0542rem;
}
ul.subnav ul > li.current > a {
  color: #ffffff;
}
ul.subnav a {
  padding-left:  10px;
}
ul.subnav > li {
  padding-bottom: 2px;
}
ul.subnav > li.expanded {
  padding-bottom: 0;
}
ul.subnav > li:not(:last-child):not(.expanded) {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left bottom;
}
ul.subnav > li.current > a {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/link-item-hover.png") no-repeat left 5px;
}
ul.subnav ul {
  border-top: 1px solid #868686;
  border-bottom: 1px solid #868686;
  padding-left: 10px;
}
ul.subnav ul > li.current > a {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/link-item-hover.png") no-repeat left 5px;
}
ul.subnav ul > li.current > a {
  padding-top: 3px;
  border-radius: 4px;
  background-color: #ff7320;
  background-image: none;
  -webkit-box-shadow: 0 5px 4px -2px rgba(255, 255, 255, 0.2) inset, 0 8px 11px -6px rgba(255, 255, 255, 0.35) inset;
  box-shadow: 0 5px 4px -2px rgba(255, 255, 255, 0.2) inset, 0 8px 11px -6px rgba(255, 255, 255, 0.35) inset;
}
.delete-list {
  margin-bottom: 30px;
}
.delete-list > li {
  margin: 6px 0 0 0;
}
.delete-list > li > a {
  padding-left: 20px;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/icon-delete.png") no-repeat left center;
}
.filters.nav-column .delete-list a:hover,
.filters.nav-column .delete-list a:focus {
  color: red;
  text-decoration: line-through;
}
.hidden {
  display: none;
}
dl.meta {
  margin: 0;
  padding: 0;
}
dl.meta:after {
  /* Can't use a simple overflow: hidden here, since that'd break the centering of the dl.meta in one-column pages with floated images right before. */
  content: "";
  display: block;
  clear: both;
}
dl.meta dt,
dl.meta dd {
  float: left;
  display: block;
}
dl.meta dt {
  width: 26%;
  clear: left;
  overflow: hidden;
  padding-right: 10px;
  padding-left: 10px;
  text-indent: -10px;
  text-overflow: ellipsis;
  color: #868686;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
dl.meta dd {
  min-width: 15em;
  max-width: 74%;
}
dl.meta dd audio {
  width: 450px;
  max-width: 100%;
  margin: 0;
}
dl.meta dd + dd {
  clear: left;
  margin-left: 26%;
}
dl.meta dt,
dl.meta dd {
  margin: 6px 0;
}
dl.dense dt,
dl.dense dd {
  margin: 2px 0;
}
dl.dense dd + dd {
  margin: 0 0 4px 26%;
}
.main-column-wrapper.nav dl.meta dt {
  width: 34%;
}
.main-column-wrapper.nav dl.meta dd {
  max-width: 64%;
}
.main-column-wrapper.nav dl.meta dd + dd,
.main-column-wrapper.nav dl.meta.dense dd + dd {
  margin-left: 34%;
}
dl.narrow {
  overflow: hidden;
  margin: 0 0 10px 0;
  padding: 0 0 3px 0;
  border-bottom: 1px solid #d0d0d0;
}
dl.narrow:last-child {
  margin-bottom: 0;
  border-bottom: 0;
}
dl.narrow dt {
  float: left;
  clear: both;
  width: 100%;
  padding: 6px 9em 6px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
dl.narrow dt:first-child {
  padding-top: 0;
  background-image: none;
}
dl.narrow dd {
  float: right;
  width: 8em;
  margin-left: -8em;
  padding-top: 6px;
  text-align: right;
}
dl.narrow dt:first-child + dd {
  padding-top: 0;
}
dl.narrow dd + dd {
  clear: right;
  padding-top: 3px;
  padding-bottom: 6px;
}
p.additional,
span.additional,
.richtext.additional {
  font-weight: normal;
  color: #868686;
}
p.additional,
span.additional,
.richtext.additional {
  font-size: 1.15rem;
}
p.additional + p.additional {
  margin-top: 0;
}
p.additional + p.additional.separate {
  margin-top: 20px;
}
p.additional a:not(:hover):not(:focus),
span.additional a:not(:hover):not(:focus) {
  color: inherit;
}
/** Teaser for when titledetail description is long **/
.teaser {
  position: relative;
  max-height: 6.5em;/* 5 lines at line-height 1.3 */
  overflow: hidden;
  margin-bottom: 3em;/* Create space for the open button. */
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-property: max-height, margin-bottom;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.5s;
  -o-transition-property: max-height, margin-bottom;
  transition-delay: 0.00s;
  transition-duration: 0.5s;
  transition-property: max-height, margin-bottom;/* 0.00s is used because 0s is incorrectly transformed to 0 by the YUI compressor */
}
.teaser::after {
  position: absolute;
  bottom: 0;
  display: block;
  content: "";
  width: 100%;
  height: 1.3em;/* 1 line at line-height 1.3 */
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAXCAYAAADKmiUPAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn%2FAACA6QAAdTAAAOpgAAA6mAAAF2%2BSX8VGAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAPElEQVQI10XMOQqAUBAE0Wcnbl9F8P43lTEbk6KhmlJVgjnYgye4gzXYWozGEZy9fow%2B7x1YgktVvcH0AbGsCBQP71GMAAAAAElFTkSuQmCC") repeat-x bottom center;/* teaser-gradient.png */
  background-size: 100% 100%;
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.1s;
  -webkit-transition-property: bottom;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.1s;
  -o-transition-property: bottom;
  transition-delay: 0.00s;
  transition-duration: 0.1s;
  transition-property: bottom;
}
.teaser.expanded {
  max-height: none;
  margin-bottom: 0;
}
.teaser.expanded[data-closeable] {
  margin-bottom: 3em;
}
.teaser.expanded::after {
  bottom: -1.4em;
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.1s;
  -webkit-transition-property: bottom;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.1s;
  -o-transition-property: bottom;
  transition-delay: 0.00s;
  transition-duration: 0.1s;
  transition-property: bottom;
}
.teaser + p.teasertoggler {
  position: absolute;
  margin-top: -3em;/* 3x13px inside the 3x16px margin-bottom. */
}
.teaser + p.teasertoggler .button {
  background-image: none;
}
.teaser + p.teasertoggler .button.hidden {
  display: none;
}
.teaser + p.teasertoggler .button:hover,
.teaser + p.teasertoggler .button:focus {
  background-image: none;
}
.teaser + p.teasertoggler .button.more::before,
.teaser + p.teasertoggler .button > .button.quaternary:not(.open)::before {
  content: "+";
  display: inline-block;
  margin-right: .45rem;
}
.teaser + p.teasertoggler .button.less::before,
.teaser + p.teasertoggler .button > .button.quaternary.open::before {
  content: "\2212";
  display: inline-block;
  margin-right: .45rem;
}
.medium,
li.medium {
  min-height: 20px;/* Background image dimensions: 20x20px */
  padding-top: 3px;
  padding-left: 25px;
  background-position: 0 40%;
  background-repeat: no-repeat;
  display: inline-block;
}
li.medium {
  display: block;
}
/* NBC item type ('material') icons. */
.medium.book {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/book.png");
}
.medium.book.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/book-white.png");
}
.medium.bigletterbook {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/largeprintbook.png");
}
.medium.bigletterbook.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/largeprintbook-white.png");
}
.medium.ebook {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/ebook.png");
}
.medium.ebook.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/ebook-white.png");
}
.medium.audiobook,
.medium.spokenbook,
.medium.daisyrom,
.medium.daisyaudiostream {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/audiobook.png");
}
.medium.audiobook.white,
.medium.spokenbook.white,
.medium.daisyrom.white,
.medium.daisyaudiostream.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/audiobook-white.png");
}
.medium.movie {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/video.png");
}
.medium.movie.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/video-white.png");
}
.medium.music,
.medium.album {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/album.png");
}
.medium.music.white,
.medium.album.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/album-white.png");
}
.medium.cdsingle {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/track.png");
}
.medium.cdsingle.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/track-white.png");
}
.medium.sheetmusic {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/sheetmusic.png");
}
.medium.sheetmusic.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/sheetmusic-white.png");
}
.medium.software {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/software.png");
}
.medium.software.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/software-white.png");
}
.medium.game {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/game.png");
}
.medium.game.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/game-white.png");
}
.medium.magazine {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/magazine.png");
}
.medium.magazine.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/magazine-white.png");
}
/* Youth page type ('material') icons/materialtypes. */
.medium.app {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/appreview.png");
}
.medium.app.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/appreview-white.png");
}
.medium.edumedia {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/edumedia.png");
}
.medium.edumedia.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/edumedia-white.png");
}
.medium.video {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/video.png");
}
.medium.video.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/video-white.png");
}
.medium.audio { /* Way too generic a name. :/ */
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/lecture.png");
}
.medium.audio.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/lecture-white.png");
}
.medium.digitaalprentenboek {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/picturebook.png");
}
.medium.digitaalprentenboek.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/picturebook-white.png");
}
.medium.arrangements {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/arrangement.png");
}
.medium.arrangements.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/arrangement-white.png");
}
/* not yet used material types */
.medium.article {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/artikel.png");
}
.medium.article.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/artikel-white.png");
}
.medium.online-source {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/online-bron.png");
}
.medium.online-source.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/online-bron-white.png");
}
.medium.readinglist {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/lezenvoordelijst.png");
}
.medium.readinglist.white {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/materialtypes/lezenvoordelijst-white.png");
}
/** Book covers **/
img.cover {
  display: block;
  margin-top: 3px;
  -webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2);
}
img.full.cover,
.main-column .rich-items img.full.cover {
  max-width: 310px;
  max-height: 496px;
}
img.small.cover,
.main-column .rich-items img.small.cover {
  max-width: 200px;
  max-height: 320px;
}
img.list-big.cover,
.main-column .rich-items img.list-big.cover {
  max-width: 120px;
  max-height: 192px;
}
.rich-items img.etalage,
  /* Exception since the itempicker is now being used for non-catalog items, too. */
img.etalage.cover,
.main-column .rich-items img.etalage.cover {
  max-width: 80px;
  max-height: 128px;
}
img.extrasmall.cover,
  /* We're now mix-and-matching covers and content items. */
.main-column .rich-items img.extrasmall,
.main-column .rich-items img.extrasmall.cover {
  max-width: 60px;
  max-height: 96px;
}
img.list.cover,
.main-column .rich-items img.list.cover {
  max-width: 40px;
  max-height: 64px;
}
/* New style placeholders */
.coverplaceholder {
  display: block;
  position: relative;
  padding: 0.5em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.coverplaceholder.full {
  width: 310px;
  height: 496px;
  font-size: 3.45rem;
}
.coverplaceholder.small { /* "small", to keep it the same as content images */
  width: 200px;
  height: 320px;
  font-size: 2.0125rem;
}
.coverplaceholder.list-big {
  width: 120px;
  height: 192px;
  font-size: 1.2458rem;
}
.coverplaceholder.etalage {
  width: 80px;
  height: 128px;
  font-size: 1.0542rem;
}
.coverplaceholder.extrasmall {
  width: 60px;
  height: 96px;
  font-size: 0.9583rem;
}
.coverplaceholder.list {
  width: 40px;
  height: 64px;
  letter-spacing: 1px;
  line-height: 1.5;
  font-size: 0.575rem;/* Made more legible by the next two lines. */
}
/* Placeholders are portrait ('book') format, except for music/album/cdsingle, where they're square. */
/* TODO: LESSify*/
.coverplaceholder.music.full,
.coverplaceholder.album.full,
.coverplaceholder.cdsingle.full {
  height: 310px;
}
.coverplaceholder.music.small,
.coverplaceholder.album.small,
.coverplaceholder.cdsingle.small {
  height: 200px;
}
.coverplaceholder.music.list-big,
.coverplaceholder.album.list-big,
.coverplaceholder.cdsingle.list-big {
  height: 120px;
}
.coverplaceholder.music.etalage,
.coverplaceholder.album.etalage,
.coverplaceholder.cdsingle.etalage {
  width: 100px;
  height: 100px;
}
.coverplaceholder.music.extrasmall,
.coverplaceholder.album.extrasmall,
.coverplaceholder.cdsingle.extrasmall {
  height: 60px;
}
.coverplaceholder.music.list,
.coverplaceholder.album.list,
.coverplaceholder.cdsingle.list {
  height: 40px;
}
.coverplaceholder,
.coverplaceholder.variant1 {
  background-color: #8348ae;
}
.coverplaceholder.variant2 {
  background-color: #dc0032;
}
.coverplaceholder.variant3 {
  background-color: #005db9;
}
.coverplaceholder.variant4 {
  background-color: #96460b;
}
.coverplaceholder.variant5 {
  background-color: #b6be00;
}
.coverplaceholder:before {
  display: block;
  position: absolute;
  top: 50%;
  left: 5%;
  overflow: hidden;
  max-height: 95%;
  width: 90%;
  content: attr(data-title);
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
  text-transform: uppercase;
  text-overflow: ellipsis;
  color: rgba(255, 255, 255, 0.8);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* Widget library: rich-items and grid-items. */
.rich-items,
.grid-items {
  margin-bottom: 10px;
  border-bottom: 1px solid #d0d0d0;
}
div.rich-items {
  overflow: hidden;
}
div.rich-items.highlight {
  border-bottom: 0;
}
.rich-items:last-child,
.grid-items:last-child {
  margin-bottom: 0;
  border-bottom: 0;/* The solid line demarcates where the list ends and the next bit of content begins. If there's no next bit of content (within the widget), remove the line. Note: this does mean that next content (if it exists) should always be a sibling; otherwise exceptions will need to be invented to restore the line. */
}
.grid-items > li,
.rich-items > li {
  position: static;
  list-style: none;
}
.rich-items > li {
  clear: both;
  overflow: hidden;
  padding: 10px 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.rich-items > li:first-child,
.rich-items.interactive[data-component="bw.ui.paginator"] > li:nth-child(3n+1) {
  padding-top: 0;
  background-image: none;
}
.rich-items > li.highlight div + h3,
.rich-items > li.highlight div + h4,
div.rich-items.highlight div + h3,
div.rich-items.highlight div + h4 {
  margin-top: 12px;
}
.rich-items > li.highlight + li {
  background-image: none;
  border-top: 1px solid #d0d0d0;
}
.rich-items img {
  float: left;
  max-width: 60px;
  max-height: 96px;
  margin: 4px 10px 5px 0;
}
.rich-items:last-child > li:last-child img {
  margin-bottom: 0;
}
.rich-items img.offset {
  float: right;
  margin-right: 0;
  margin-left: 10px;
}
.rich-items .content {
  float: left;
  width: 100%;
  padding-left: 70px;/* Default 10px padding next to a default 60px wide img.*/
  line-height: 1.2;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;/* Allow the 100% width to take padding into account. */
}
.rich-items .content dl.meta {
  line-height: 1.31;
}
.rich-items > .content {
  padding-bottom: 10px;/* If this isn't a list, but just a single item. */
}
.rich-items:last-child > .content {
  padding-bottom: 0;/* But if there's nothing after the .rich-items, then the biebwidget will already provide the white-space. */
}
.rich-items .content.full {
  padding-left: 330px;/* 20px margin next to a .cover.full */
}
.rich-items .content.small {
  padding-left: 220px;/* 20px margin next to a .cover.small */
}
.main-column .rich-items .content.list-big,
.rich-items .content.list-big {
  padding-left: 140px;/* 20px margin next to a .cover.list-big */
}
.main-column .rich-items .content.etalage,
.rich-items .content.etalage {
  padding-left: 100px;/* 20px margin next to a .cover.etalage */
}
.main-column .rich-items .content.extrasmall {
  padding-left: 80px;/* 20px margin next to a .cover.extrasmall */
}
.rich-items .content.list {
  padding-left: 60px;/* 20px margin next to a .cover.list */
}
.rich-items .content.calendar {
  padding-left: 5em;/* em-based, since this is text. */
}
.main-column .rich-items .content.empty,
.rich-items .content.empty {
  padding-left: 0;
}
.rich-items .viz {
  position: relative;/* Keep the viz clickable when there's positioned content next to it. */
  float: left;
  margin-left: -100%;
}
.rich-items .viz.calendar {
  margin-top: 2px;
}
.rich-items .viz a {
  text-decoration: none;
}
.rich-items .viz a:focus > img:only-child,
.rich-items .viz a:focus > span.coverplaceholder {
  /* Due to absolute positioning and overflow: hidden, focus on this link is rather un-intuitive, so let's make it a bit more obvious. */
  box-shadow: 2px 2px #ffffff, 5px 5px 3px #ff7320;
}
.rich-items .content.more {
  position: relative;
  padding-bottom: 2.5em;
}
.main-column .rich-items .content.more {
  padding-bottom: 3em;
}
.rich-items .content.more h3 .button,
.rich-items .content.more h4 .button {
  position: absolute;
  bottom: 0;
  display: block;
  margin-bottom: 0;
  padding-bottom: 0;
  font-weight: normal;
  font-family: Arial, sans-serif;
}
.rich-items .content.more h3 .button {
  font-size: 1.3417rem;
}
.rich-items .content.more h4 .button {
  font-size: 1.3417rem;
}
.main-column .rich-items .content.more h3 .button,
.main-column .rich-items .content.more h4 .button {
  margin-bottom: 5px;
  padding-bottom: 3px;
}
.main-column .rich-items .content.more h3 .button.tertiary,
.main-column .rich-items .content.more h4 .button.tertiary {
  padding-bottom: 0;
}
.rich-items .content .link-list > li {
  float: left;
  margin-right: 20px;
  list-style: none;
}
.rich-items .content .link-list > li.medium {
  padding-left: 22px;
  text-indent: 0;
}
.main-column .rich-items,
.grid-items {
  clear: left;/* Clear the float of .tools, so that margins will collapse. */
  margin-top: 13px;
  margin-bottom: 20px;
}
.main-column .rich-items:last-child {
  margin-bottom: 0;
}
.main-column .rich-items > li {
  padding: 17px 0 12px 0;
}
.main-column .rich-items > li:first-child {
  padding-top: 0;
}
.main-column .rich-items.actionable > li:first-child {
  padding-top: 1px;/* Create space for the margin-top: -1px of the first button. */
}
.main-column .rich-items img {
  max-width: 200px;
  max-height: 320px;
  margin: 4px 20px 10px 0;
}
.main-column .rich-items.tiny img.cover,
.main-column .rich-items.tiny img {
  max-width: 60px;
  max-height: 80px;
}
.main-column .rich-items.tiny .coverplaceholder.extrasmall {
  max-width: 50px;
  max-height: 80px;
  font-size: 0.75rem;
}
.main-column .rich-items.small img {
  max-width: 120px;
  max-height: 192px;
}
.main-column .rich-items .viz img {
  margin-bottom: 5px;
}
.main-column .rich-items .content {
  padding-left: 220px;
}
.main-column .rich-items .content.calendar {
  padding-left: 5em;/* em-based, since this is text. */
}
.main-column .rich-items .content img.offset {
  float: right;
  margin-top: -1.083em;
  margin-right: 0;
  margin-left: 10px;
}
.main-column .rich-items .content .additional img.offset {
  margin-top: -1.1818em;
}
.main-column .rich-items .content.more img.offset {
  max-width: 120px;
  max-height: 90px;/* Purposefully limit this to low height. */
  margin-bottom: 0;
}
.main-column .small.rich-items,
.main-column .tiny.rich-items {
  overflow: hidden;
  border-bottom: 0;
}
.main-column .small.rich-items > li,
.main-column .tiny.rich-items > li {
  float: left;
  clear: none;
  width: 48%;
  margin-left: 4%;
  padding: 10px 0;
  background-image: none;
}
.main-column .tiny.rich-items > li {
  width: 32%;
  margin-left: 2%;
}
.main-column .small.rich-items > li:nth-of-type(2n+1),
.main-column .tiny.rich-items > li:nth-of-type(3n+1) {
  clear: left;
  margin-left: 0;
}
.main-column .rich-items.small .content:not(.calendar) {
  padding-left: 140px;
}
.main-column .tiny.rich-items .content:not(.calendar) {
  padding-left: 70px;
}
/* 'Responsive' styling for etalage within narrow columns on landingpage. */
.biebwidget-column  .main-column .small.rich-items:not(.sliding) > li {
  width: 100%;
  margin-left: 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.biebwidget-column  .main-column .small.rich-items:not(.sliding) > li:first-child {
  background-image: none;
}
.biebwidget-column  .main-column .small.rich-items:not(.sliding) > li:nth-of-type(2n+1) {
  clear: none;
  margin-left: 0;
}
.biebwidget-column  .main-column .tiny.rich-items > li {
  width: 100%;
  margin-left: 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.biebwidget-column  .main-column .tiny.rich-items > li:first-child {
  background-image: none;
}
.biebwidget-column  .main-column .tiny.rich-items > li:nth-of-type(3n+1),
.biebwidget-column  .main-column .tiny.rich-items > li:nth-of-type(2n+1) {
  clear: none;
  margin-left: 0;
}
.biebwidget-double-column  .main-column .tiny.rich-items > li {
  width: 48%;
  margin-left: 4%;
}
.biebwidget-double-column  .main-column .tiny.rich-items > li:nth-of-type(3n+1) {
  clear: none;
  margin-left: 4%;
}
.biebwidget-double-column  .main-column .tiny.rich-items > li:nth-of-type(2n+1) {
  clear: left;
  margin-left: 0;
}
.main-column .rich-items.actionable .content {
  padding-right: 180px;
}
.main-column .rich-items.actionable .actions {
  float: right;
  width: 160px;
  margin-right: 2px;
  margin-left: -162px;
  text-align: right;
}
.main-column .rich-items.actionable .actions > p:first-child .primary.button,
.main-column .rich-items.actionable .actions > p:first-child .secondary.button,
.main-column .rich-items.actionable .actions > p:first-child .quaternary.button {
  margin-top: -1px;/* Line out baseline with the title. */
}
.main-column .rich-items.actionable .actions > p:first-child + p:last-child,
.main-column .rich-items.actionable .actions > p:first-child + form:last-child {
  margin-top: 40px;
}
.main-column .imagelist > li {
  float: left;
  width: 49%;
  margin: 0 0 20px 2%;
}
.main-column .imagelist > li:nth-child(odd) {
  clear: left;
  margin-left: 0;
}
.main-column .imagelist > li img {
  display: block;
  max-width: 100%;
}
/* .accompanying on content following a h2 or h3 guarantees placement close to the header, with an appropriate amount of white-space to follow. */
h3 + .accompanying {
  margin-bottom: 5px;
}
.main-column h2 + .accompanying {
  margin-top: -6px;
  margin-bottom: 10px;
}
.main-column h2 + .accompanying + .accompanying,
.main-column h3 + .accompanying + .accompanying {
  margin-top: -10px;
  margin-bottom: 10px;
}
.main-column h3 + .accompanying {
  margin-bottom: 10px;
}
.grid-items {
  overflow: hidden;
}
.grid-items > li {
  overflow: hidden;
  float: left;
  width: 200px;/* This is a reasonable default width, which in a 2-column page shows 4-5 items per row. This can be increased/decreased on individual pages as necessary. */
  height: 4.8071em;
  margin: 0 15px 20px 0;
  padding: 0 0 140px 0;/* max-height of the image, plus 7px (for visually 10px) white-space underneath */
}
.grid-items.high > li {
  width: 165px;
  padding-bottom: 199px;
}
.grid-items.narrow > li {
  width: 100px;
}
.grid-items > li > h3,
.grid-items > li > h4 {
  position: relative;
  overflow: hidden;
  height: 2.4em;/* 2 lines */
  margin-bottom: 0.25em;
  padding: 140px 0 0.1em 0;/* padding-top = max-height of the image, plus 7px (for visually 10px) white-space underneath; padding-bottom = 2px separation to the subtitle. */
  line-height: 1.2;
  text-align: center;
}
.grid-items.high > li > h3,
.grid-items.high > li > h4 {
  padding-top: 199px;
}
.grid-items .imgwrapper {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;/* define the space available for the image */
  height: 133px;
}
.grid-items.high .imgwrapper {
  height: 192px;
}
.grid-items .imgwrapper > img,
.grid-items .imgwrapper > .coverplaceholder {
  position: absolute;
  right: 0;
  bottom: 0;/* line out at the baseline */
  left: 0;
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;/* center horizontally, made possible by right: 0 + left: 0 */
}
.grid-items p.calendar {
  position: absolute;
  bottom: 0;
  float: none;
  width: 100%;
}
.grid-items p.calendar span {
  padding-right: 0;
}
.grid-items p.calendar.period span.until.date-day {
  background-position: 48% 0;
}
.grid-items > li > p {
  overflow: hidden;
  max-height: 2.4em;/* 2 lines */
  line-height: 1.2;
  text-align: center;
}
a.feed {
  padding-left: 15px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/feed-tiny.png");
  background-position: left 63%;
  background-repeat: no-repeat;
}
p.totalresults,
.main-column .tools {
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #d0d0d0;
}
.main-column .tools {
  float: left;
  width: 100%;
  margin-top: -9px;
}
.main-column .tools > p.totalresults {
  float: left;
  margin-bottom: 0;
  padding-top: 9px;/* align to baseline with tools */
  padding-bottom: 0;
  border-bottom: 0;
}
.main-column .tools .searchsorting {
  float: right;
  margin-left: 15px;
}
.main-column .tools .searchsorting label {
  vertical-align: bottom;
}
.main-column .tools .searchsorting .button.primary,
.main-column .tools .searchsorting .button.secondary {
  margin-top: 3px;
  margin-bottom: 0;
}
.main-column .tools .searchsorting select {
  vertical-align: unset;
}
/* If there's content before the .totalresults / .tools line, give it a margin-top (visually equal to 15px),
    so that minimal white-space between that content and this line is guaranteed (margin-collapsing will take care of it not adding up).
   This unfortunately relies on the AEM-generated class .overview, and only works if that previous content is within a .sectioned div.
   Note that we don't want to _always_ do this, since by itself we want this closer to the h2, with its baseline lined out with a sidebar header. */
.main-column h2 + .sectioned + .overview > .totalresults:first-child {
  clear: both;
  margin-top: 13px;
}
.main-column h2 + .sectioned + .overview > .tools:first-child {
  clear: both;
  margin-top: 4px;
}
.main-column .overview + .sectioned {
  margin-top: 20px;
}
.main-column .tools + .categorized,
.main-column .tools + .mapcontainer {
  clear: left;
}
.main-column .categorized {
  overflow: auto;
}
.main-column .categorized h3 {
  margin-bottom: 20px;
}
/* Widget library: common elements */
/* Calendar look */
p.calendar {
  float: left;
  line-height: 0.8;
}
p.calendar span {
  display: block;
  margin-bottom: 4px;
  padding-right: 20px;
  font-weight: bold;
  text-align: center;
}
p.calendar span.date-weekday {
  font-size: 1.9167rem;
}
p.calendar span.date-day {
  font-size: 2.6833rem;
}
p.calendar span.date-month {
  font-size: 1.9167rem;
}
p.calendar.period span.date-day {
  text-indent: -1px;
  font-size: 1.9167rem;
}
p.calendar.period span.date-month {
  font-size: 1.4375rem;
}
p.calendar.period span.until {
  position: relative;
  left: 10px;
}
p.calendar.period span.until.date-day {
  padding-top: 10px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAICAYAAADwdn+XAAAAIGNIUk0AAG2YAABzjgAA+swAAIT6AAB5gQAA/RMAADBtAAASKQ0eJk4AAAAJcEhZcwAACxMAAAsTAQCanBgAAABcSURBVCjPYwgICWAgAyvB2KRqDAXiVUD8H4hnEmsAyLZyIL4L1QjDIIOU8Gl0QbINhu9CDcPpBUEctu0G4jRsFiHbNhNN0zsg7kC2DZcB5cTahs8FHVAXKJEapQBcY5gn+xhLYQAAAABJRU5ErkJggg==") no-repeat 4px 0;
}
.richtext p.calendar {
  margin-bottom: 8px;
}
/* A .struct header exists to create a correct document outline, but isn't wanted as visual output since that outline is obvious because of context. */
.struct {
  position: absolute;
  left: -9999px;
}
.richtext {
  clear: both;
}
.richtext .constructed h3,
.richtext .constructed h4,
.richtext .constructed h5 {
  /* With constructed richtext, we trust that offset images are sparse enough that it's safe not to clear: right. */
  clear: left;
}
.richtext .intro + .maintext > .section:first-child > h3:first-child,
.richtext .intro + .maintext > .section:first-child > h4:first-child,
.richtext .intro + .maintext > .title.section:first-child + .section > h3:first-child,
.richtext .intro + .maintext > .title.section:first-child + .section > h4:first-child,
.richtext .intro + h3,
.richtext .intro + h4,
.richtext img.offset + p + h3,
.richtext img.offset + p + h4,
.richtext img.offset + p + h5 { /* These last img + p + hx never happen anymore due to AEM sectioning. :/ */
  clear: left;
}
.richtext h3,
.richtext h4,
.richtext h5 {
  /* Is it safe enough to always clear left (rather than both) these? We'll have to try... */
  clear: left;
}
.richtext .intro + img,
.richtext .intro + img + p,
.richtext .intro + object,
.richtext .intro + object + p,
.richtext .intro + div.video,
.richtext .intro + div.video + p {
  clear: right;
}
.rich-items > li.richtext,
.rich-items > li.richtext h3,
.rich-items > li.richtext h4,
.rich-items > li.richtext h5 {
  clear: none;
}
.richtext img {
  float: left;
  clear: left;
  max-width: 200px;
  max-height: 320px;
  margin: 3px 20px 10px 0;
}
.intro img {
  max-width: 384px;
  max-height: 614px;
}
object.flash,
object.flash img {
  max-width: 100%;
}
.richtext div.video {
  display: block;
  float: none;
  clear: both;
  width: 100%;
  max-width: 640px;
  max-height: 1024px;
  margin-right: 0;
}
.richtext img.offset {
  float: right;
  clear: right;
  margin-right: 0;
  margin-left: 3.657rem;
}
.maintext.richtext img {
  margin-top: 5px;/* Deal with the higher line-height. */
}
.maintext.richtext p + img,
.richtext .maintext p + img {
  margin-top: 19px;/* Maintain the white-space between paragraphs as well. */
}
.richtext ol > li > a:only-child,
.richtext ul > li > a:only-child {
  display: inline;/* Can't trust that this really is the only child, and doesn't offer any benefit to keep it display: block anyway. */
}
div.video .aspect-ratio {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 57%;
}
div.video .aspect-ratio.square {
  padding-bottom: 100%;
}
div.video .aspect-ratio.threeQuarters {
  padding-bottom: 75%;
}
div.video .aspect-ratio.widescreen {
  padding-bottom: 57%;
}
div.video .aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
audio {
  margin: 10px 0;
}
audio,
iframe {
  width: 100%;
  border: 0;
}
/* .sliding is the generic class for all items which should transition with a 'sliding' motion. */
.sliding.interactive {
  position: relative;
  overflow: hidden;
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-property: height;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.3s;
  -o-transition-property: height;
  transition-delay: 0.00s;
  transition-duration: 0.3s;
  transition-property: height;
}
/* Percentage-based layouts have larger items, so they should transition more slowly. */
.sliding.interactive[data-itemwidth] {
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
}
/* By default it's assumed that sliding is always done using margin-left. */
.sliding.interactive > li {
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-property: margin-left;
  -webkit-transition-timing-function: cubic-bezier(.02, .01, .47, 1);
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.3s;
  -o-transition-property: margin-left;
  -o-transition-timing-function: cubic-bezier(.02, .01, .47, 1);
  transition-delay: 0.00s;
  transition-duration: 0.3s;
  transition-property: margin-left;
  transition-timing-function: cubic-bezier(.02, .01, .47, 1);/* Emulate jQuery 'swing'. */
}
/* Percentage-based layouts have larger items, so they should transition more slowly. */
.sliding.interactive[data-itemwidth] > li {
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
}
.sliding.rich-items.interactive[data-itemwidth] > li {
  position: absolute;
  top: 0;
}
.main-column .sliding.small.rich-items.interactive > li {
  clear: none;
  margin-right: 2%;
  margin-left: 0;
}
.main-column .sliding.small.rich-items.interactive > li.hidden {
  display: none;
}
/* By setting the .animating class, a sliding item can also transition the 'left' property.
   This extra class is desired, because in those cases you'll also want to be able to position items directly, to prepare them for animating. */
.sliding.interactive > li.animating {
  -webkit-transition-property: margin-left, left;
  transition-property: margin-left, left;
}
.sliding.rich-items.interactive > li.current,
.sliding.rich-items.interactive > li.current ~ li,
.sliding.grid-items.interactive > li.current,
.sliding.grid-items.interactive > li.current ~ li {
  display: block;
}
.sliding.grid-items.interactive > li.current ~ li.hidden {
  display: none;
}
.slidingnav {
  position: relative;
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-property: height;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.3s;
  -o-transition-property: height;
  transition-delay: 0.00s;
  transition-duration: 0.3s;
  transition-property: height;
}
.slidingnav button.prev,
.slidingnav button.next {
  position: absolute;
  top: 50px;
  z-index: 2;
  display: block;
  width: 18px;
  height: 26px;
  margin: 0 5px;
  border: 0;
  border-radius: 50%;
  padding: 10px 14px;
  text-indent: -9999em;
  cursor: pointer;
  background-repeat: no-repeat;
  background-color: rgba(255, 255, 255, 0.05);
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.slidingnav button.prev {
  left: 0;
  background-position: 45% center;/* Visually centered, even if actually slightly off-center. */
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-larger-glowy.png");
}
.slidingnav button.prev.passive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-larger-glowy-passive.png");
}
.slidingnav button.next {
  right: 0;
  background-position: 55% center;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-larger-glowy.png");
}
.slidingnav button.next.passive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-larger-glowy-passive.png");
}
.slideshow:hover .slidingnav button:not(.passive) {
  background-color: rgba(255, 255, 255, 0.3);
}
.slidingnav button.prev:not(.passive):hover,
.slidingnav button.prev:not(.passive):focus {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAaCAYAAAC6nQw6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAACQ0lEQVR42mL8//8/AzUAQACxkKCWCYhVgFgRyj8PxK+BGOwSgAAi1iBmIA5gOL7Mm+H2EQWwiF3yeQYF4z1A1g6QYQABxEKkIYEMp9dGMdw6HAgXPbLQkoGRiYNB3vAqkPcIIICYiDLk1KoohsvbAxn+/maA41/fOBjuntAEyoMwA0AAsRA05OjiKIaLWwKxqvj9Hc4ECCAWvIYcmBXFcGYddkNY2H4w6HqchwY6A0AAseA0ZO/UKIaTK3Eb4lk1j0FKaw805hgAAogFqyE7+6MYji/FbYhvwzwGdbutsBgDCQMEEAuGIdu6oxiOLsRhCPsPhsCmeQyaTiBDtsMMAQGAAIIZxAhOJ1vaoxgOz8NtSGj7PAZtFwxDQAAggGAGyTJc3uEEDFzchkT0zGPQccNqCAgABBAsHWkynN+kidOQ6AnzgDG0DZchIAAQQEwE0/WfnxwMD85KAllc+NQDBBBM4jqDod91nIYdnBPIsLk1EhyOkPDEAAABBDPoMdDp+xjsU9bjNQwUjgwMntgMAwgg5oaGBhj7FjBt/GH4+ZWV4eE57OF1dY8ug7jKVyAGhdMdZCmAAEI2CCR5E69h//6y4DIMIICQDSLHsH9AkbsgYYAAwhYLf4F4PYNv9TKcYQaKyaUFScDYdAHyREFCAAGEKzqJM+zQXEMgC4QZAAIIX3kEMwwRa3gAQAARKmpxGwZK8ZC0B05/AAHESGR1BCn8QekIlpXQCn+AAGIkoV5jBGduaBmNXh0BBBAjtSpIgAADADfe0YvJ5XZzAAAAAElFTkSuQmCC");
  background-color: rgba(255, 255, 255, 0.4);
}
.slidingnav button.next:not(.passive):hover,
.slidingnav button.next:not(.passive):focus {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAaCAYAAAC6nQw6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAACaklEQVR42mL8//8/AzUAQACxILEZgVgUiA2h/PtAfAeI/xFjEEAAsSAZ4sHw4KwLw6G5EINUbR4wWEZtBbI2APFfQgYBBBDMIFmGh+d9GI4sTGL4/58DLHLrMAMDC7sAg2kwyJL1hAwDCCCYQZoMd09oMvz6xoEie3l7IMN/oH6zMAZChgEEECKMfn9nYPjxGVPFmbWBDL9/MjBYx+I1DCCAYAadZ9D1OM9w/YAlw59fHBiqji8NBFvkkIbTMIAAYm5oaADR3xh4RZkYBKW/MtzYr8vw+wcLw9/fDCj48SWQ11kZlMz+ANXfBGKUdAMQQDCDQOAug4j8fwYhma8M1/ZgN+zRBU2Gn19ZGVQsMQwDCCBkgxjA6UZU8T+DsPxXhqu7dRn+/GRh+AfUg4wfnocYpmqNYhhAAKEbBDFMTOk/0MCvDFd2Qg0DBgkyfngWYpiaLdCZDDdAmgACiAlLBIBs2M6g47aVIaJnHgMj8w+Gv0DL0fGBWYEMl3c4gdMgEAAEEBOOZAExTNdjG0P0hHnAhPkDq6rzmzTBaRAIAAKICU9iBclxAbONJNB7HISyCEAA4TIIlC0CGDa3RjIcnBOIU7eh33UgCcIMAAHEhMMQT7D/8Rlin7Ie6PV9QNZjEBcggJhwGOLNsLQgCa8hvtXLoCUDOPoBAogJpyG4wgVhCEpWAQggJpTyiExDQAAggGAGiYILNTINAQGAAIIZZAguGck0BAQAAoiJYGFMhCEgABBAMIOug9MEegom0hAQAAggRmh1hFn4gwyGpBOiCn+AAGJEqtfQq6Pr0MRGVMUHEECM1KogAQIMANzuDAiYFZn2AAAAAElFTkSuQmCC");
  background-color: rgba(255, 255, 255, 0.4);
}
.slidingindicators {
  padding-top: 5px;
  text-align: center;
}
.slidingindicators .dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 1px 5px;
  border-radius: 50%;
  background-color: #999;
}
.slidingindicators .dot.current {
  margin: 0 4px;
  border: 1px solid #999;
  background-color: #fff;
}
ul.rotatingitems.interactive {
  position: relative;
  height: 200px;
}
ul.slidingitems.interactive {
  position: relative;
  min-height: 100px;
}
ul.rotatingitems.interactive > li,
ul.slidingitems.interactive > li {
  position: absolute;
  top: 0;
  width: 100%;
  text-align: center;
}
ul.rotatingitems > li img {
  width: auto;/* Temporarily override .bannerimage styling. */
  display: inline;/* idem */
  max-width: 100%;
  max-height: 200px;
}
/* Used in the siteheader and footer */
ul.metanav {
  float: right;
  font-size: 1.2458rem;
}
ul.metanav > li {
  float: left;
  padding: 0 10px 2px 10px;
  border-left: 1px solid #496660;
  line-height: 11px;
}
ul.metanav > li:first-child {
  border-left: 0;
}
/* bw.ui.foldable ------------------------------------------------------ */
.toggler.interactive {
  padding-left: 15px;
  cursor: pointer;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next.png") no-repeat 2px 60%;
}
.toggler.interactive.open,
.toggler.interactive.opening {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/dropdown.png") no-repeat 0 65%;
}
h3.toggler.interactive {
  background-position: 2px 50%;
}
h3.toggler.interactive.open,
h3.toggler.interactive.opening {
  background-position: 0 55%;
}
.toggler.interactive + * {
  display: none;
}
.toggler.interactive.open + * {
  display: block;
}
.toggler.interactive button > span:first-child {
  position: absolute;
  text-indent: -9999px;
}
.toggler.interactive button:focus {
  color: #ff7320;
}
/* Explicit definition of top margin in order to prevent stuttering behaviour while sliding down with jQuery */
.toggler + .link-list {
  margin-top: 0;
}
.toggler.interactive + dl.meta {
  margin-left: 20px;
}
.mapcontainer {
  width: 100%;
  height: 384px;
  border: 1px solid #d0d0d0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.mapstatus {
  width: 100%;
  min-height: 2.5em;
  border: 1px solid #d0d0d0;
  border-top: 0;
  padding: 6px 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
p.mapstatus + .rich-items {
  margin-top: 0;
}
.mapstatus:empty {
  border-color: transparent;
}
.mapcontainer.hidden + .mapstatus {
  display: none;
}
.bannerimage {
  display: block;
  width: 100%;
}
/* Library: buttons ------------------------------------------------------------*/
.button { /* Generic button */
  display: inline-block;/* Not a big deal if this isn't supported; it's only here to be able to add some margin above and below the button. */
}
button.button,
button.default,
button.link { /* Don't use <button> styles. */
  margin: 0;
  border: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-align: inherit;
  background-color: transparent;/* Should be inherit, but IE refuses to join us here in the future. >.< */
  cursor: pointer;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;/* Styling form elements consistently is hard when they behave according to different box-sizing methods. */
}
button.default:not(:disabled) {
  color: inherit;
}
button.default:disabled,
button.link:disabled {
  cursor: auto;
}
button.button::-moz-focus-inner,
button.default::-moz-focus-inner,
button.link::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/* TODO: Make padding from ButtonPrimary and ButtonSecondary variable, so math can be done on it for 'low' buttons.
   This is needed for .searchsorting, where we now hard assume that setting padding-top/-bottom is safe.
   This would also enable a cleaner .loading implementation. */
.primary.button { /* Primary importance button: there should be only one of these per page */
  margin:  5px 0 5px 0px;
  padding:  7px 35px 8px 9px;
  border:  1px solid transparent;
  border-radius:  5px;
  color:  #ffffff;
  text-decoration:  none;
  background: #ff7320;
  background: #ff7320 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABD0lEQVQ4y4XRPStHcRQH8J9SHpNIWSQjOy/BIqWwGAxmJW/AxrswGiykDFKSyegFKFI2SSkfhK7BuTr/2z9unbrn+3CefgUFbwV7KCWQUlChqpEHLOL1VxKKX09H9t6hMysq7OMSu7VlGictfSMmwvGea97XM+EqiNXI72vnBrbi/zTIo3YttrGey+d4DOdyTa4FsBOC98jnSxqqiqULnuvjZbJgJF92IA4/hv4k7G4OVBN97abNMeXnq/CEpaYmJyOYwXjC5vCaOr5hIZtX8dlYrMJmKrKCj8S9YLbgq42xwjV6U4Fh3GRNwSjOGsZbTIZpEBcN/gBdfx2sB4cN03Hg5b9rD+E81jqMN2zRfAPSLrmpx9A84QAAAABJRU5ErkJggg==") right 10px center no-repeat;
}
.primary.button:hover,
.primary.button:focus {
  border:  1px solid transparent;
  color:  #ffffff;
  text-decoration:  none;
  background: #fb5d00;
  background: #fb5d00 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABD0lEQVQ4y4XRPStHcRQH8J9SHpNIWSQjOy/BIqWwGAxmJW/AxrswGiykDFKSyegFKFI2SSkfhK7BuTr/2z9unbrn+3CefgUFbwV7KCWQUlChqpEHLOL1VxKKX09H9t6hMysq7OMSu7VlGictfSMmwvGea97XM+EqiNXI72vnBrbi/zTIo3YttrGey+d4DOdyTa4FsBOC98jnSxqqiqULnuvjZbJgJF92IA4/hv4k7G4OVBN97abNMeXnq/CEpaYmJyOYwXjC5vCaOr5hIZtX8dlYrMJmKrKCj8S9YLbgq42xwjV6U4Fh3GRNwSjOGsZbTIZpEBcN/gBdfx2sB4cN03Hg5b9rD+E81jqMN2zRfAPSLrmpx9A84QAAAABJRU5ErkJggg==") right 10px center no-repeat;
}
.primary.button:focus {
  color:  #ffffff;
}
.primary.button {
  font-family: Arial, sans-serif;
}
.submit.button { /* Button that doesn't suggest going to another page (by absense of arrow like bg image) */
  margin:  5px 0 5px 0px;
  padding:  7px 9px 8px 9px;
  border:  1px solid transparent;
  border-radius:  5px;
  color:  #ffffff;
  text-decoration:  none;
  background-color: #ff7320;
}
.submit.button:hover,
.submit.button:focus {
  border:  1px solid transparent;
  color:  #ffffff;
  text-decoration:  none;
  background-color: #fb5d00;
}
.submit.button:focus {
  color:  #ffffff;
}
.submit.button {
  font-family: Arial, sans-serif;
}
.secondary.button { /* Secondary importance button */
  margin:  5px 0 5px 0px;
  padding:  7px 35px 8px 9px;
  border:  1px solid #d0d0d0;
  border-radius:  5px;
  color:  #505450;
  text-decoration:  none;
  text-shadow:  none;
  background: #ebebeb;
  background: #ebebeb url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABEElEQVQ4y2P4X8zAAMSfQYQ+iMMAFQET/0EYJvIRiBOB+CxcCVQFnMOIrPc4EHMiqwAxtgLxfSD2gGnRBeLJKPZCsQxUxxNkM0NhbgLi61CJZih/AkxnABB3QdlHoJJF2KxoBeJgZOOR8RuoTl2YpDYQ/wPimVAF/6AKxECcP0gO44Aq+AMLvNdIkiC+BpT9C2bXfCDWBGJ+ZIXoDkI2AUMSGauA4hMp9MzQ1SBz2IHYGIjVkMR8gfgnko03gVgRWTMfEB9DUgDD9UiGlKLJHQDpA0mkY9EIwg+BmBfJAAsg/oEkvweXyaCYMoXKSQHxZSS5f9A0izfAQGGwFs3QJlwBho5BcbYXFJnQpMGErgYA1X+GLlG/c1QAAAAASUVORK5CYII=") right 10px center no-repeat;
}
.secondary.button:hover,
.secondary.button:focus {
  border:  1px solid #d0d0d0;
  color:  #ffffff;
  text-decoration:  none;
  text-shadow:  none;
  background: #505050;
  background: #505050 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABD0lEQVQ4y4XRPStHcRQH8J9SHpNIWSQjOy/BIqWwGAxmJW/AxrswGiykDFKSyegFKFI2SSkfhK7BuTr/2z9unbrn+3CefgUFbwV7KCWQUlChqpEHLOL1VxKKX09H9t6hMysq7OMSu7VlGictfSMmwvGea97XM+EqiNXI72vnBrbi/zTIo3YttrGey+d4DOdyTa4FsBOC98jnSxqqiqULnuvjZbJgJF92IA4/hv4k7G4OVBN97abNMeXnq/CEpaYmJyOYwXjC5vCaOr5hIZtX8dlYrMJmKrKCj8S9YLbgq42xwjV6U4Fh3GRNwSjOGsZbTIZpEBcN/gBdfx2sB4cN03Hg5b9rD+E81jqMN2zRfAPSLrmpx9A84QAAAABJRU5ErkJggg==") right 10px center no-repeat;
}
.secondary.button {
  font-family: Arial, sans-serif;
}
.tertiary.button { /* Tertiary importance button */
  margin:  0 0 5px 0;
  padding:  0 0 0 18px;
  color:  #505450;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABA0lEQVR42mL8X6zAgAY4gdgViCWg/BdAvBuIvyMrYkHTlAPELUDMjyb+EYjrgXgiTIAJSXIaEE/GookBKjYBiGeia0wD4kwGwiANisEamYG4DkVaSJaBQcUKl2aQWmaQRjMglkaRYucCmruIgcEhDZtGkFozkEYtrOYyAR3iU8nAkDgbYhAq0GJCD2YMICLPwMArii76HRQdl3FqOr+RgWFNFQPDz2/oMpdhGi8AsQFc+M9vBoaNTQwMh+djM+4mTCMIpADxMSBmA/Ne34Ng7KAAOR7PAnExgTj8BcS5QLwDPeVMAWJnID6IRdMRIDaBqsGaVvdBMcjJxkiu+YVuEkCAAQDl+DGY+33pQQAAAABJRU5ErkJggg==") left center no-repeat;
  background-size:  auto auto;
}
.tertiary.button:hover,
.tertiary.button:focus {
  color:  #ff7320;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABA0lEQVR42mL8X6zAgAY4gdgViCWg/BdAvBuIvyMrYkHTlAPELUDMjyb+EYjrgXgiTIAJSXIaEE/GookBKjYBiGeia0wD4kwGwiANisEamYG4DkVaSJaBQcUKl2aQWmaQRjMglkaRYucCmruIgcEhDZtGkFozkEYtrOYyAR3iU8nAkDgbYhAq0GJCD2YMICLPwMArii76HRQdl3FqOr+RgWFNFQPDz2/oMpdhGi8AsQFc+M9vBoaNTQwMh+djM+4mTCMIpADxMSBmA/Ne34Ng7KAAOR7PAnExgTj8BcS5QLwDPeVMAWJnID6IRdMRIDaBqsGaVvdBMcjJxkiu+YVuEkCAAQDl+DGY+33pQQAAAABJRU5ErkJggg==") left center no-repeat;
  background-size:  auto auto;
}
.quaternary.button { /* Quaternary importance button */
  margin:  0 0 5px 0;
  padding:  2px 12px 3px 0;
  color:  #505450;
  text-decoration:  underline;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAAUklEQVR42mIMCAnoYICACijNwALELkBsDMSCQJwOEmQCYlcgPgvEaUB8BqQIJPgeKrEHqmMVE1TbTKgxYAUgM+9CJUAqw0ASLFAOCM+C2Q4QYAAaqg9vjktbCAAAAABJRU5ErkJggg==") right center no-repeat;
  background-size:  auto auto;
}
.quaternary.button:hover,
.quaternary.button:focus {
  color:  #ff7320;
  text-decoration:  underline;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAAZ0lEQVR42mL8X6yQxsDA4ALE6Qw9998DaQYmIFYC4lAg3s1QoigIEmT8//8/A5AzE8gG6QCprIAIgkCJYgeQLEdWCeJ0QGQZ0hmBFp0BMoyB+B4QhwEtO8sCZOwB4tVAPAtmO0CAAQAy6CC6niNkcAAAAABJRU5ErkJggg==") right center no-repeat;
  background-size:  auto auto;
}
.back.primary.button {
  padding: 7px 9px 8px 32px;
  background: #ff7320;
  background: #ff7320 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAAA80lEQVQ4y5XSzwoBURQG8FHK3yRSNpIlex7BRkphY2FhreQF7HgLSwsbUhZSkpWlB1CkZicpZRDiO7pTp9OMmPptzjnfvXPnjmYYhib4YQhPmEPIYuZDFnwwgReT/iXsgbEIDlX9a9gNIxGcqiNQPwYt6EEDAmbYBQMRXEBQBZOwFf0ZRKnZFY0lRNjr9UXf1NNEYQNhFvTC2ib8pAGdFU5QZWEnrGzCOg1k4cyKd6iwBZoWwQdtYg7k4cKaNyiy3TuwV70d1OQ9F+DKFqDFcqwfhwz/mPLiy2pXc4EDJH79PUkJjipMT+qfMKmrI7TBYRd+A4NCuamdTqn9AAAAAElFTkSuQmCC") left 10px center no-repeat;
}
/* REFACTOR Abo 22-02-2018; the &:focus is missing here */
.back.primary.button:hover,
.back.primary.button:focus {
  background: #fb5d00;
  background: #fb5d00 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAAA80lEQVQ4y5XSzwoBURQG8FHK3yRSNpIlex7BRkphY2FhreQF7HgLSwsbUhZSkpWlB1CkZicpZRDiO7pTp9OMmPptzjnfvXPnjmYYhib4YQhPmEPIYuZDFnwwgReT/iXsgbEIDlX9a9gNIxGcqiNQPwYt6EEDAmbYBQMRXEBQBZOwFf0ZRKnZFY0lRNjr9UXf1NNEYQNhFvTC2ib8pAGdFU5QZWEnrGzCOg1k4cyKd6iwBZoWwQdtYg7k4cKaNyiy3TuwV70d1OQ9F+DKFqDFcqwfhwz/mPLiy2pXc4EDJH79PUkJjipMT+qfMKmrI7TBYRd+A4NCuamdTqn9AAAAAElFTkSuQmCC") left 10px center no-repeat;
}
.back.secondary.button {
  padding: 7px 9px 8px 32px;
  background: #ebebeb;
  background: #ebebeb url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAAA70lEQVQ4y2P4X8zAgIaZgHgmEP8C4r1AzI9FDRhjE5wMxP+RsC6xmpvQNK4FYnZiNBehaTyC5GRNIO4C4vlAHICuORGI/yFpvAzEUlA5UyB+g2ZwKUyzBzRwYBL3gVgDyUVb0TSC8Gsg1gdJ7kES/AHEFkgaeYH4IRbNIJwOUjABSeAPEDcjaeYA4utYNILUhYIU8AHxAWx+guJ6LJqPgfTBFIgB8VkkyX/QQATJcUITzUeo+HEg1kaPKkUgvolkwE8g9kWSVwNiY+R4R494UGp6gmQAKIpkSEmeZkgGfAZiFVI0g3AwVGMrEDPi0gwA5t+GLlRLbIMAAAAASUVORK5CYII=") left 10px center no-repeat;
}
/* REFACTOR Abo 22-02-2018; the &:focus is missing here */
.back.secondary.button:hover,
.back.secondary.button:focus {
  background: #505050;
  background: #505050 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAADwikbvAAAA80lEQVQ4y5XSzwoBURQG8FHK3yRSNpIlex7BRkphY2FhreQF7HgLSwsbUhZSkpWlB1CkZicpZRDiO7pTp9OMmPptzjnfvXPnjmYYhib4YQhPmEPIYuZDFnwwgReT/iXsgbEIDlX9a9gNIxGcqiNQPwYt6EEDAmbYBQMRXEBQBZOwFf0ZRKnZFY0lRNjr9UXf1NNEYQNhFvTC2ib8pAGdFU5QZWEnrGzCOg1k4cyKd6iwBZoWwQdtYg7k4cKaNyiy3TuwV70d1OQ9F+DKFqDFcqwfhwz/mPLiy2pXc4EDJH79PUkJjipMT+qfMKmrI7TBYRd+A4NCuamdTqn9AAAAAElFTkSuQmCC") left 10px center no-repeat;
}
.back.quaternary.button {
  padding: 2px 0 3px 12px;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAYElEQVR42mIMCAlgQAIdIAIggFiQBGYCcRoQnwUIICYg4QLEZ2ACQOwKEEAglauAWBCI9wBxGBC/BwggkEpXEAOqA2SEIEAAMUG1KENVhgLxXYAAgln0HqoDZK4LQIABAB2SD371zh/eAAAAAElFTkSuQmCC") left no-repeat;
}
.back.quaternary.button:hover {
  padding: 2px 0 3px 12px;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAaklEQVR42mL8//8/AxiUKAoCyZlAvAcggFiQBHYDsTEQ3wMIICagQBqQcRcqMIuh534FQAAxQbWAVHYCBdJBGgECCCSYDjGUoRyoqxzEAAggRrBFJYograuAWAmIzwIEECOa7SDzBQECDACosBpnwYXgXgAAAABJRU5ErkJggg==") left no-repeat;
}
/* When changing padding for the primary or submit button also change the padding for the loading icon*/
.loading.primary.button,
.loading.submit.button {
  padding: 2px 10px 3px 9px;
  background-image: none;
  padding: 7px 9px 8px 9px;
}
.loading.primary.button:hover,
.loading.submit.button:hover,
.loading.primary.button:focus,
.loading.submit.button:focus {
  background-image: none;
  padding: 7px 9px 8px 9px;
}
.loading.primary.button:not(.back)::after,
.loading.submit.button:not(.back)::after {
  display: inline-block;
  content: "";
  height: 1em;
  width: 1em;
  margin: 1em 2.33em 1em 4.33em;
  border-radius: 50%;
  font-size: 3px;
  -webkit-box-shadow: 2em 0 0 0 #fff, 1.414em 1.414em 0 0 #fff, 0 2em 0 0 #fff, -1.414em 1.414em 0 0 #fff, -2em 0 0 0 #fff, -1.414em -1.414em 0 0 #fff, 0 -2em 0 0 #fff, 1.414em -1.414em 0 0 #fff;
  box-shadow: 2em 0 0 0 #fff, 1.414em 1.414em 0 0 #fff, 0 2em 0 0 #fff, -1.414em 1.414em 0 0 #fff, -2em 0 0 0 #fff, -1.414em -1.414em 0 0 #fff, 0 -2em 0 0 #fff, 1.414em -1.414em 0 0 #fff;
  -webkit-animation: 1500ms linear 0.00s normal none infinite running spinner-loader;
  animation: 1500ms linear 0.00s normal none infinite running spinner-loader;/* 0.00s is used because 0s is incorrectly transformed to 0 by the YUI compressor */
}
.loading.primary.button.back::before,
.loading.submit.button.back::before {
  display: inline-block;
  content: "";
  height: 1em;
  width: 1em;
  margin: 1em 2.33em 1em 4.33em;
  border-radius: 50%;
  font-size: 3px;
  -webkit-box-shadow: 2em 0 0 0 #fff, 1.414em 1.414em 0 0 #fff, 0 2em 0 0 #fff, -1.414em 1.414em 0 0 #fff, -2em 0 0 0 #fff, -1.414em -1.414em 0 0 #fff, 0 -2em 0 0 #fff, 1.414em -1.414em 0 0 #fff;
  box-shadow: 2em 0 0 0 #fff, 1.414em 1.414em 0 0 #fff, 0 2em 0 0 #fff, -1.414em 1.414em 0 0 #fff, -2em 0 0 0 #fff, -1.414em -1.414em 0 0 #fff, 0 -2em 0 0 #fff, 1.414em -1.414em 0 0 #fff;
  -webkit-animation: 1500ms linear 0.00s normal none infinite running spinner-loader;
  animation: 1500ms linear 0.00s normal none infinite running spinner-loader;/* 0.00s is used because 0s is incorrectly transformed to 0 by the YUI compressor */
  margin: 1em 4.33em 1em 2.33em;
}
@-webkit-keyframes spinner-loader {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner-loader {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.richtext .button {
  margin-bottom: 0;
}
.buttons .button + .button {
  margin-left: 20px;
}
button.primary.small,
button.secondary.small,
button.submit.small,
button.loading.small,
button.loading.submit.small,
button.loading.submit.small,
button.primary.submit.small,
button.primary.back.small,
button.secondary.submit.small,
button.secondary.back.small,
button.primary.small:hover,
button.secondary.small:hover,
button.submit.small:hover,
button.loading.small:hover,
button.loading.submit.small:hover,
button.loading.submit.small:hover,
button.primary.submit.small:hover,
button.primary.back.small:hover,
button.secondary.submit.small:hover,
button.secondary.back.small:hover,
button.primary.small:focus,
button.secondary.small:focus,
button.submit.small:focus,
button.loading.small:focus,
button.loading.submit.small:focus,
button.loading.submit.small:focus,
button.primary.submit.small:focus,
button.primary.back.small:focus,
button.secondary.submit.small:focus,
button.secondary.back.small:focus {
  padding-top: 2px;
  padding-bottom: 2px;
}
/* itempicker; default position above the detail */
ul.itempicker,
ol.itempicker {
  margin-bottom: 10px;
  border-bottom: 1px solid #d0d0d0;
  padding-bottom: 10px;/* 20px to the bottom of the imgs (10 + 7 + 3) */
  text-align: center;
}
ul.itempicker > li,
ol.itempicker > li {
  display: inline-block;/* align on baseline */
  margin: 0 -13px;/* 5% padding per item is too much for narrow columns, so remove part of that spacing again. (We don't want to use a smaller percentage padding, otherwise it hardly increases for wider columns.) */
  padding: 0 5%;
}
ul.itempicker > li > a,
ol.itempicker > li > a,
ul.itempicker > li > span,
ol.itempicker > li > span {
  display: block;
  padding: 7px 3px;
  outline: none;
  cursor: pointer;
}
ul.itempicker > li.current > a,
ol.itempicker > li.current > a,
ul.itempicker > li.current > span,
ol.itempicker > li.current > span {
  margin: 0 -3px -3px -3px;/* The .current img becomes larger because of the border; remove that space here so nothing will shift. */
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/selection-indicator.png") no-repeat center bottom;
}
ul.itempicker > li.current > a img,
ol.itempicker > li.current > a img,
ul.itempicker > li.current > a .coverplaceholder,
ol.itempicker > li.current > a .coverplaceholder,
ul.itempicker > li.current > span img,
ol.itempicker > li.current > span img,
ul.itempicker > li.current > span .coverplaceholder,
ol.itempicker > li.current > span .coverplaceholder,
ul.itempicker > li.current > a p.calendar,
ol.itempicker > li.current > a p.calendar {
  margin-top: 0;
  border: 3px solid #ff7320;
  border-radius: 4px;
}
ul.itempicker > li.current > a .coverplaceholder.list,
ol.itempicker > li.current > a .coverplaceholder.list,
ul.itempicker > li.current > span .coverplaceholder.list,
ol.itempicker > li.current > span .coverplaceholder.list {
  margin-top: -3px;/* A .coverplaceholder doesn't have a built-in margin-top which can be compensated for with margin-top: 0. */
  width: 46px;/* Since the coverplaceholder has box-sizing: border-box, the above border is being subtracted from the width, so should be added on again. */
  height: 70px;
}
ul.itempicker > li.current > a .coverplaceholder.list.music,
ol.itempicker > li.current > a .coverplaceholder.list.music,
ul.itempicker > li.current > span .coverplaceholder.list.music,
ol.itempicker > li.current > span .coverplaceholder.list.music,
ul.itempicker > li.current > a .coverplaceholder.list.album,
ol.itempicker > li.current > a .coverplaceholder.list.album,
ul.itempicker > li.current > span .coverplaceholder.list.album,
ol.itempicker > li.current > span .coverplaceholder.list.album,
ul.itempicker > li.current > a .coverplaceholder.list.cdsingle,
ol.itempicker > li.current > a .coverplaceholder.list.cdsingle,
ul.itempicker > li.current > span .coverplaceholder.list.cdsingle,
ol.itempicker > li.current > span .coverplaceholder.list.cdsingle {
  height: 46px;
}
ul.itempicker > li > a p.calendar span,
ol.itempicker > li > a p.calendar span {
  padding: 2px 3px 2px 2px;
}
ul.itempicker > li > a p.calendar span.date-day,
ol.itempicker > li > a p.calendar span.date-day {
  font-size: 2.2042rem;
}
ul.itempicker > li > a p.calendar span.date-month,
ol.itempicker > li > a p.calendar span.date-month {
  font-size: 1.4375rem;
}
ul.itempicker > li > a:focus img,
ol.itempicker > li > a:focus img,
ul.itempicker > li > a:focus .coverplaceholder,
ol.itempicker > li > a:focus .coverplaceholder {
  outline: 1px solid #ff7320;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.main-column ul.itempicker > li,
.main-column ol.itempicker > li {
  margin: 0;
  padding: 0 5px;/* Used fixed spacing between items in a .main-column, as 5% is just way too much. */
}
ul.itemdetail.rich-items > li {
  border-top: none;
}
/* itempicker below the detail */
.itemdetail + ul.itempicker,
.itemdetail + ol.itempicker {
  margin-top: 10px;
  margin-bottom: 0;
  border-top: 1px solid #d0d0d0;
  border-bottom: 0;
  padding-top: 10px;
  padding-bottom: 0;
}
.itemdetail + ul.itempicker + *,
.itemdetail + ol.itempicker + * {
  margin-top: 10px;
}
.itemdetail + ul.itempicker > li,
.itemdetail + ol.itempicker > li {
  vertical-align: top;/* align by top */
}
.itemdetail + ul.itempicker > li.current > a,
.itemdetail + ol.itempicker > li.current > a,
.itemdetail + ul.itempicker > li.current > span,
.itemdetail + ol.itempicker > li.current > span {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/selection-indicator-up.png") no-repeat center top;
}
.rich-items.itemdetail + ul.itempicker,
.rich-items.itemdetail + ol.itempicker {
  margin-top: 0;/* The dividing line is already provided by the .rich-items list here. */
  border-top: 0;
  padding-top: 0;
}
/* When JavaScript is enabled, only show the .current itemdetail. */
ul.itemdetail.interactive > li {
  display: none;
  padding: 0 0 10px 0;/* Remove the .rich-items padding. */
  background: none;/* Remove the .rich-items dotted line. */
}
ul.itemdetail.interactive > li.current {
  display: block;
}
.main-column .itemdetail {
  max-width: 836px;/* When the image is center-aligned, it looks weird for this to be completely left aligned, so left-align its contents with the .itempicker. */
  margin-right: auto;
  margin-left: auto;
}
.main-column ul.itempicker,
.main-column ol.itempicker {
  overflow: hidden;
  max-width: 836px;/* 11 items. */
  margin-right: auto;
  margin-left: auto;
  font-size: 0;/* No extra space between items. */
}
.main-column ul.itempicker > li:first-child:nth-last-child(n),
.main-column ol.itempicker > li:first-child:nth-last-child(n) {
  /* :nth-last-child(n) so IE8 will ignore this line along with all the following ones. */
  margin-left: -836px;
}
.main-column ul.itempicker > li:last-child,
.main-column ol.itempicker > li:last-child {
  margin-right: -836px;
}
/* All form styles for form.generated, .rangeitem, and basic input/textarea styling.
   _No_ <button> styling, other than what falls in the previous categories. */
/* Form: basic form styles ------------------------------------------------------------*/
input,
textarea {
  color: #505450;
}
/* TODO: revisit styling here in a few months, once browsers have settled upon common behaviour. */
input.empty,
textarea.empty {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
/* Old gecko. */
input:-moz-placeholder,
textarea:-moz-placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
/* https://bugzilla.mozilla.org/show_bug.cgi?id=737786#c70 */
input::placeholder,
textarea::placeholder {
  font-style: italic;
  color: #888e88;
  opacity: 1;
}
input:focus {
  border-color: #ff7320;
}
/* upload component */
.upload ul {
  margin: 10px 232px;
}
.upload p:not(.description) {
  margin: 10px 240px;
}
.upload button {
  margin: 0 242px;
}
.upload button.delete {
  display: block;
  height: 15px;
  padding: 3px 5px 3px 20px;
  background: transparent url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/icon-delete.png") no-repeat left center;
  cursor: pointer;
  text-decoration: none;
  border: none;
}
@media screen and (max-width: 619px) {
  .upload p:not(.description) {
    margin: 10px 0;
    width: auto;
    display: inline-block;
  }
}
textarea {
  font-family: inherit;
  font-size: inherit;
}
form.generated::before {
  overflow: hidden;
  clear: both;
  margin-right: 20px;
  padding: 7px 0;
}
form.generated.clear .form-row label,
form.generated.clear .form-row .label {
  display: block;
  float: none;
}
form.generated.clear .form-row label {
  margin-bottom: 5px;
}
form.generated.clear .form-row:not(.birthdate) select,
form.generated.clear .form-row .clear-full {
  width: 100%;
}
form.generated.clear .form-row .error {
  margin-left: 0;
}
form.generated.clear .form-row .description {
  padding-left: 0;
}
form.generated fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
form.generated fieldset legend {
  font-size: inherit;
  font-weight: normal;
  line-height: 1.3;
  margin: 0;
  padding: 7px 0;
}
form.generated .form-row {
  overflow: hidden;
  clear: both;
  padding: 7px 0;
}
form.generated .form-row > * {
  margin-right: 20px;
}
form.generated .form-row.richtext * {
  margin-right: 0;
}
form.generated .form-row > label,
form.generated .form-row > .label {
  width: 220px;
}
form.generated .form-row label,
form.generated .form-row .label {
  float: left;
  display: inline-block;
  padding: 4px 0 0 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
form.generated .form-row .label + .value {
  display: inline-block;
  padding: 4px 0 0 0;
  margin-top: 0;
}
form.generated .form-row input + label {
  width: auto;
  margin: 4px 20px 5px 0;
  padding: 0;
}
form.generated .form-row.multiple select,
form.generated .form-row.multiple input[type=text] {
  width: auto;
}
form.generated .form-row p + p.accompanying {
  margin-top: 0;
}
form.generated .form-row > p + label,
form.generated .form-row > p + label + input {
  margin-top: .5em;
}
form.generated .form-row > .input-options {
  float: left;
  max-width: calc(100% - 260px);
}
form.generated .form-row > .input-options > .input-group {
  position: relative;
  float: left;
  margin-right: 0;
  padding-left: 20px;
  width: 100%;
}
form.generated .form-row > .input-options > .input-group > input {
  position: absolute;
  left: 0;
}
form.generated .form-row.checkbox > .input-options > .input-group {
  width: 100%;
}
form.generated .form-row > .label {
  min-width: 220px;
}
form.generated legend em,
form.generated label em {
  display: inline-block;
  overflow: hidden;
  width: 1em;
  height: 1em;
}
form.generated legend em:before,
form.generated label em:before {
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "*";
}
form.generated .label.required:after {
  display: inline-block;
  width: 1em;
  height: 1em;
  content: "*";
}
form.generated .label.required + .input-group label {
  overflow: hidden;
  width: 0;
  height: 0;
  text-indent: -99999px;
}
form.generated .label.required + .input-group label em:before {
  content: none;
}
form.generated input[type=text],
form.generated input[type=email],
form.generated input[type=password],
form.generated input[type=url],
form.generated input[type=tel],
form.generated input[type=search],
form.generated select,
form.generated textarea {
  float: left;
  width: 320px;
  max-width: 96%;
  font-size: inherit;
  font-family: inherit;
  color: #000000;
}
form.generated textarea {
  height: 150px;
}
form.generated select {
  width: 326px;
}
form.generated input[type=radio],
form.generated input[type=checkbox] {
  float: left;
  width: auto;
  margin: 6px 8px 0 0;
}
form.generated input.modifier {
  clear: left;
  margin-left: 240px;
  font-style: normal;
}
form.generated .input-list {
  float: left;
  margin: 3px 0 0 0;
}
form.generated .input-list input[type=radio],
form.generated .input-list input[type=checkbox] {
  width: auto;
  margin: 3px 8px 0 0;
}
form.generated .input-list li {
  overflow: hidden;
  clear: both;
  margin: 0;
  padding: 10px 0 0 0;
  list-style: none;
}
form.generated .input-list li:first-child {
  padding-top: 0;
}
form.generated .input-list li label {
  padding: 0;
  margin: 0;
}
form.generated .input-list li input + label + input {
  width: 247px;
  margin-left: 8px;
  margin-top: -3px;
}
form.generated legend.label-error,
form.generated label.label-error {
  font-weight: bold;
  color: red;
}
form.generated .body-field {
  display: none;
}
form.generated .description {
  clear: left;
  padding: 5px 20px 5px 240px;
  font-style: italic;/* Copy placeholder styling. */
  color: #888e88;
}
form.generated .form-row.buttons {
  margin-top: 17px;
  padding: 17px 0;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png") repeat-x left top;
}
form.generated .birthdate label {
  position: absolute;
  left: -9999px;
}
form.generated .birthdate select:nth-of-type(1) {
  margin-right: 20px;
  width: 4em;
}
form.generated .birthdate select:nth-of-type(2) {
  margin-right: 20px;
  width: 8.75em;
}
form.generated .birthdate select:nth-of-type(3) {
  margin-right: 0;
  width: 5em;
}
.main-column-wrapper form.generated .form-row > p.label:not(.viz) {
  margin-right: 20px;
  margin-left: 0;
}
span.config-error,
  /* This should move to wcm.css */
form.generated span.error {
  clear: left;
  float: left;
  margin: 6px 0 0 240px;
  padding-left: 18px;
  width: 360px;
  color: red;
  line-height: normal;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/icon-form-error.png") no-repeat left 3px;
}
form .rangeitem {
  float: left;
  position: relative;
  width: 25%;
  height: 40px;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
form .rangeitem input {
  position: absolute;
  margin: 0;
  opacity: 0;
}
form .rangeitem input[type=checkbox] + label + * > input[type=radio] + label {
  width: 24px;
  height: 24px;
  margin-right: -24px;
  margin-left: 9%;
  padding: 0;
  margin-top: 4px;
  display: inline-block;
}
form .rangeitem input[type=checkbox] + label + * > input[type=radio]:checked + label {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/range-scrubber-inactive.png");
}
/* TODO:
			move image to ../images/
			get an orange version
			overwrite for green version in wichbook css
		*/
form .rangeitem input[type=checkbox]:checked + label + * > input[type=radio]:checked + label {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/range-scrubber-active.png");
}
form .rangeitem input[type=checkbox] + label {
  position: absolute;
  top: 9px;
  left: 18px;
  right: 18px;
  height: 4px;
  padding: 0;
  margin: 0;
  border: 1px solid #ababab;
  border-bottom-color: #c9c9c9;
  border-top-color: #909090;
  border-radius: 4px;
  background-color: #cacaca;
  color: transparent;
  -webkit-box-shadow: inset 0px 3px 6px -5px black;
  box-shadow: inset 0px 3px 6px -5px black;
}
form .rangeitem input[type=checkbox]:focus ~ div.radioarea {
  outline: 1px solid #ff7320;
}
form .rangeitem inputinput[type=checkbox] + label + * > input[type=radio]:focus + label {
  width: 20px;
  height: 20px;
  margin-top: 3px;
  border: 1px solid #ff7320;
  border-radius: 16px;
  background-position: -2px 0;
}
form .rangeitem h3 {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  font-size: inherit;
}
form .rangeitem h3 span {
  position: absolute;
  bottom: 0;
  display: block;
  text-indent: -9999em;
}
form .rangeitem h3 span.left {
  left: 0;
  text-indent: 0;
}
form .rangeitem h3 span.right {
  right: 0;
  text-align: right;
  text-indent: 0;
}
form.static .rangeitem input[type=checkbox] {
  top: 6px;
  left: 0;
  margin: 0;
  z-index: 1;
  opacity: 1;
}
form.static .rangeitem input[type=radio] {
  right: 0;
}
form.interactive .rangeitem > div.radioarea,
form .rangeitem > fieldset.radiowrapper {
  position: absolute;
  left: -10px;
  right: 30px;
  display: block;
  height: 45px;
  margin-top: -2px;
  border: 0;
  padding: 0;
  font-size: 0;/* No white-space between inline-block elements. */
  color: transparent;
  cursor: default;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
form.interactive .rangeitem > div.radioarea {
  left: 10px;
  right: 10px;
  cursor: pointer;
}
form.cancelconfirm > p:first-of-type {
  float: left;
  margin-top: 13px;
}
form.cancelconfirm > p + p {
  float: right;
  margin-top: 13px;
}
form.cancelconfirm .tertiary.button {
  margin-top: 7px;/* Same baseline as a primary/secondary button. */
}
form.cancelconfirm .quaternary.button {
  margin-top: 5px;/* Same baseline as a primary/secondary button. */
}
@media only screen and (min-width: 901px) and (max-width: 1150px) {
  form .rangeitem {
    width: 33.3%;
  }
}
@media only screen and (min-width: 621px) and (max-width: 900px) {
  form .rangeitem {
    width: 50%;
  }
}
@media only screen and (min-width: 0) and (max-width: 620px) {
  form .rangeitem {
    width: 100%;
  }
}
@media only screen and (max-width: 705px) {
  form.generated .form-row:not(.body-field) {
    display: block;
  }
  form.generated .form-row input,
  form.generated .form-row select,
  form.generated .form-row textarea,
  form.generated .form-row .description,
  form.generated .form-row .input-list {
    float: left;
    clear: left;
    margin-left: 1px;
    padding-left: 0;
  }
  form.generated .form-row label,
  form.generated .form-row .label {
    display: inline;
    width: 100%;
  }
  form.generated .form-row select {
    margin: 5px 0;
  }
  form.generated .form-row input[type=checkbox]:first-child {
    margin-left: 0;
  }
  form.generated .form-row p.label + input[type=checkbox] {
    margin-left: 0;
  }
  form.generated .form-row > .input-options {
    max-width: none;
  }
  form.generated .form-row > .input-options > .input-group {
    clear: both;
  }
  form.generated .form-row input[type=file] {
    margin: 5px 0;
  }
  form.generated .form-row.birthdate > select {
    width: 8.75em;
  }
  span.config-error,
  form.generated span.error {
    margin-left: 0;
  }
}
@media only screen and (max-width: 470px) {
  form.generated .form-row p.label:first-child {
    float: none;
  }
}
@media only screen and (min-width: 24em) and (max-width: 666px) {
  form.generated .birthdate select.month,
  form.generated .birthdate select.year {
    clear: none;
  }
}
@media only screen and (max-width: 23.999em) {
  form.generated .birthdate select.month,
  form.generated .birthdate select.year {
    margin-top: 5px;
  }
}
/* A new type of detail page, for specific products: titledetail (NBC) and app/edumedia/luistercollege/prentenboek. */
.biebwidget-content.product .main-column-wrapper.nav .main-column {
  margin-left: 430px;
}
.biebwidget-content.product .head {
  position: relative;
  min-height: 100px;
  margin-bottom: 20px;
  margin-left: -430px;
  padding: 40px 40px 40px 430px;
  background-color: #595959;
  color: #ffffff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.biebwidget-content.product .head > * {
  position: relative;
  z-index: 1;
}
.biebwidget-content.product .head h2,
.biebwidget-content.product .head a {
  color: inherit;
}
.biebwidget-content.product .head a:hover,
.biebwidget-content.product .head a:focus {
  text-decoration: none;/* Given the colored background, we don't want to use a different color to differentiate this state. */
}
.biebwidget-content.product .head ~ * {
  margin-right: 40px;
}
.biebwidget-content.product .head + h2,
.biebwidget-content.product .head h2 {
  margin-top: 0;
  font-weight: normal;
  line-height: 1;
}
.biebwidget-content.product .head + h2 {
  position: relative;
  margin-bottom: 20px;
  color: #505450;
}
.biebwidget-content.product .head p.subtitle {
  font-size: 3.3542rem;
}
.biebwidget-content.product .head p.creator {
  font-size: 3.3542rem;
}
.biebwidget-content.product .head h2.long + p.subtitle {
  font-size: 2.6833rem;
}
.biebwidget-content.product .head h2.long + p.creator {
  font-size: 2.6833rem;
}
.biebwidget-content.product .head .additional {
  color: inherit;
  font-size: 1.725rem;
}
.biebwidget-content.product .head + h2 + .additional {
  font-size: 1.725rem;
}
.biebwidget-content.product .head + h2 + .accompanying {
  margin-top: -15px;
  margin-bottom: 30px;
  font-size: 1.725rem;
}
.biebwidget-content.product .head + h2 > .imgwrapper,
.biebwidget-content.product .head .imgwrapper {
  position: absolute;
  left: 0;
  top: 0;
  float: left;
  max-width: 310px;
  max-height: 496px;
  margin-left: -370px;
}
.biebwidget-content.product .head + h2 > .imgwrapper {
  margin-top: -150px;
}
.biebwidget-content.product img.representative,
.biebwidget-content.product .head .coverplaceholder {
  display: block;
  max-width: 100%;
  max-height: 100%;
  border: 5px solid #ffffff;
  border-radius: 6px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.biebwidget-content.product img.representative.cursus {
  border-style: none;
}
@media only screen and (min-width: 917px) {
  .biebwidget-content.product .head {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 751px) and (max-width: 960px) {
  .biebwidget-content.product .head + h2,
  .biebwidget-content.product .head h2 {
    line-height: 1.1;
    font-size: 4.6rem;
  }
  .biebwidget-content.product .head + h2.long,
  .biebwidget-content.product .head h2.long {
    font-size: 3.8573rem;
  }
  .biebwidget-content.product .head p.subtitle {
    font-size: 2.875rem;
  }
  .biebwidget-content.product .head p.creator {
    font-size: 2.875rem;
  }
  .biebwidget-content.product .head h2.long + p.subtitle {
    font-size: 2.3rem;
  }
  .biebwidget-content.product .head h2.long + p.creator {
    font-size: 2.3rem;
  }
  .biebwidget-content.product .head .additional {
    font-size: 1.5333rem;
  }
  .biebwidget-content.product .head + h2 + .additional {
    font-size: 1.5333rem;
  }
  .biebwidget-content.product .head + h2 + .accompanying {
    font-size: 1.5333rem;
  }
}
@media only screen and (min-width: 751px) and (max-width: 916px) {
  .biebwidget-content.product .main-column-wrapper.nav .main-column {
    margin-left: 300px;
  }
  .biebwidget-content.product .head {
    margin-left: -300px;
    padding-left: 300px;
  }
  .biebwidget-content.product .head + h2 > .imgwrapper,
  .biebwidget-content.product .head .imgwrapper {
    max-width: 220px;
    max-height: 352px;
    margin-left: -260px;
  }
  .biebwidget-content.product .head .coverplaceholder.full {
    height: 352px;
  }
  .biebwidget-content.product .head .coverplaceholder.music.full,
  .biebwidget-content.product .head .coverplaceholder.album.full,
  .biebwidget-content.product .head .coverplaceholder.cdsingle.full {
    height: 220px;
  }
}
@media only screen and (min-width: 0) and (max-width: 750px) {
  .biebwidget-content.product .head h2 {
    line-height: 1.15;
    font-size: 4.025rem;
  }
  .biebwidget-content.product .head h2.long {
    font-size: 2.875rem;
  }
  .biebwidget-content.product .head p.subtitle {
    font-size: 2.3rem;
  }
  .biebwidget-content.product .head p.creator {
    font-size: 2.3rem;
  }
  .biebwidget-content.product .head h2.long + p.subtitle {
    font-size: 2.0125rem;
  }
  .biebwidget-content.product .head h2.long + p.creator {
    font-size: 2.0125rem;
  }
  .biebwidget-content.product .head .additional {
    font-size: 1.4375rem;
  }
  .biebwidget-content.product .head + h2 + .additional {
    font-size: 1.4375rem;
  }
  .biebwidget-content.product .head + h2 + .accompanying {
    font-size: 1.4375rem;
  }
  .biebwidget-content.product .head {
    margin-left: 0;
    padding: 20px;
  }
  .biebwidget-content.product .head ~ * {
    margin-right: 20px;
    margin-left: 20px;
  }
  .biebwidget-content.product .head + h2 > .imgwrapper,
  .biebwidget-content.product .head .imgwrapper {
    position: relative;
    top: auto;
    left: auto;
    max-width: 33%;
    margin: 5px 20px 20px 0;
  }
  .biebwidget-content.product .head .coverplaceholder.full {
    width: 29vw;
    height: 46.4vw;
    font-size: 0.92rem;
  }
  .biebwidget-content.product .head .coverplaceholder.music.full,
  .biebwidget-content.product .head .coverplaceholder.album.full,
  .biebwidget-content.product .head .coverplaceholder.cdsingle.full {
    height: 29vw;
  }
}
@media only screen and (min-width: 455px) and (max-width: 750px) {
  .biebwidget-content.product .intro.teaser + p {
    margin-left: 33%;
    padding-left: 30px;
  }
  .biebwidget-content.product .head .coverplaceholder.full {
    font-size: 1.288rem;
  }
}
@media only screen and (min-width: 0) and (max-width: 454px) {
  .biebwidget-content.product .head {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .biebwidget-content.product .head h2 {
    line-height: 1.2;
    font-size: 2.875rem;
  }
  .biebwidget-content.product .head h2.long {
    font-size: 2.3rem;
  }
  .biebwidget-content.product .head p.subtitle {
    font-size: 1.725rem;
  }
  .biebwidget-content.product .head p.creator {
    font-size: 1.725rem;
  }
  .biebwidget-content.product .head h2.long + p.subtitle {
    font-size: 1.725rem;
  }
  .biebwidget-content.product .head h2.long + p.creator {
    font-size: 1.725rem;
  }
  .biebwidget-content.product .intro.teaser {
    clear: left;
  }
}
.widget-bnl-siteheader {
  padding-top: 20px;
}
.widget-bnl-siteheader .globalmessage {
  margin:  -20px 0 20px 0;
  padding:  20px;
  border-radius:  0 0 10px 10px;
  overflow:  hidden;
  background-color: #ffffff;
  -webkit-box-shadow: 0 1px 3px 0 #868686;
  box-shadow: 0 1px 3px 0 #868686;
}
.widget-bnl-siteheader h1 a {
  float: left;
  margin: 0 80px 10px 20px;
}
.widget-bnl-siteheader .logo-wrapper {
  position: relative;
  width: 100%;
}
.widget-bnl-siteheader .logo-wrapper::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 292px;
  top: -22px;
  left: -25px;
  margin-bottom: 20px;
  padding-right: 40px;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/html-bg-gradient.png") no-repeat left top transparent;/* The radial gradient behind the logo. */
  z-index: -10;
}
.widget-bnl-siteheader .logo-wrapper.noticeActive::before {
  margin-top: 20px;
  margin-bottom: 0;
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .widget-bnl-siteheader .logo-wrapper::before {
    left: -35px;
  }
}
.widget-bnl-siteheader img.sitelogo {
  display:  block;
  float:  left;
}
.widget-bnl-siteheader .skiplinks {
  position: absolute;
  top: 0;
  left: 0;
  margin-top: -5.7em;
  display: table;
  padding: 20px;
  padding-right: 100%;
  border: 1px solid #d0d0d0;
  background-color: #f5f5f5;
  z-index: 100;
}
.widget-bnl-siteheader .skiplinks > a,
.widget-bnl-siteheader .skiplinks > span {
  display: table-cell;
  vertical-align: bottom;
  white-space: pre;
}
.widget-bnl-siteheader .skiplinks > a ~ span:last-child {
  height: 1.4em;
  transition: height 0.25s;
}
.widget-bnl-siteheader .skiplinks > a:focus ~ span:last-child {
  height: 7em;
  transition: height 0.25s;
}
.widget-bnl-siteheader ul.metanav {
  position: relative;
  z-index: 96;/* Set higher than the navigatiebalk. */
  padding: 0 0 0.5em 0;
}
.widget-bnl-siteheader ul.metanav > li {
  padding: 0;
}
.widget-bnl-siteheader ul.metanav > li > a,
.widget-bnl-siteheader ul.metanav > li > button {
  margin: 0 5px 0 0;
  padding: 0 0 0 5px;
  line-height: 16px;
  color: #505450;
}
.widget-bnl-siteheader ul.metanav > li > a:hover,
.widget-bnl-siteheader ul.metanav > li > button:hover {
  color: #505450;
}
.widget-bnl-siteheader ul.metanav > li > button:disabled {
  display: none;
}
.widget-bnl-siteheader ul.metanav li.drop {
  position: relative;
}
.widget-bnl-siteheader ul.metanav li.drop > button,
.widget-bnl-siteheader ul.metanav li.drop > a {
  margin-right: 5px;
  padding-right: 14px;/* Reserve space for the marker */
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/dropdown.png");
  background-repeat: no-repeat;
  background-position: right 55%;
}
.widget-bnl-siteheader ul.metanav li.drop > button:focus,
.widget-bnl-siteheader ul.metanav li.drop:hover > button,
.widget-bnl-siteheader ul.metanav li.drop.focus > button,
.widget-bnl-siteheader ul.metanav li.drop > a:focus,
.widget-bnl-siteheader ul.metanav li.drop:hover > a,
.widget-bnl-siteheader ul.metanav li.drop.focus > a {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAJcEhZcwAACxMAAAsTAQCanBgAAABlSURBVAjXY/hfrLAJiC8BsSQQMyBhUSC+AJIHcR4B8X+oQgGoAn4gvggVfwwSMAfir1CBE0AsBqX/Q8XNYUa7A/FPqMQXKA3iO4Pkkd0QDcT/oAr+AHEITI4BzbHpQPweiJOQxQEG3G5QU8Y0nQAAAABJRU5ErkJggg==");
}
.widget-bnl-siteheader ul.metanav button.profile,
.widget-bnl-siteheader ul.metanav a.profile {
  position: relative;
  padding-left: 32px;
  font-weight: bold;
}
.widget-bnl-siteheader ul.metanav button.profile:hover,
.widget-bnl-siteheader ul.metanav a.profile:hover,
.widget-bnl-siteheader ul.metanav button.profile:focus,
.widget-bnl-siteheader ul.metanav a.profile:focus {
  text-decoration: none;
}
.widget-bnl-siteheader ul.metanav > li.drop.login.loggedin ul.submenu li {
  min-width: 175px;
}
.widget-bnl-siteheader ul.metanav > li.drop.login:not(.loggedin) {
  margin-right: 0;
}
.widget-bnl-siteheader ul.metanav > li.drop.login:not(.loggedin) a.profile {
  padding-right: 0;
  background: none;
}
.widget-bnl-siteheader ul.metanav > li.drop.login:not(.loggedin) a.profile:hover,
.widget-bnl-siteheader ul.metanav > li.drop.login:not(.loggedin) a.profile:focus {
  text-decoration: underline;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.loggedin) button.profile,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin a.profile {
  display: none;
}
.widget-bnl-siteheader ul.metanav > li.drop.loggedin button.profile::before,
.widget-bnl-siteheader ul.metanav > li.drop:not(.loggedin) a.profile::before {
  content: "";
  position: absolute;
  z-index: 100;
  left: 4px;
  top: -5px;
  width: 24px;
  height: 24px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/profile.png");
  background-repeat: no-repeat;
  background-position: left center;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.loggedin) .submenu {
  display: none;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login),
.widget-bnl-siteheader ul.metanav > li.drop.loggedin {
  margin-right: 5px;
  padding: 0;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login):hover,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin:hover,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login).focus,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin.focus {
  margin-right: -5px;
  padding-right: 5px;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-left: 1px solid rgba(0, 0, 0, 0.2);
  background: #ffffff;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login):hover::before,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin:hover::before,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login).focus::before,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin.focus::before {
  content: "";
  position: absolute;
  z-index: 99;
  left: -1px;
  top: -9px;
  width: 100%;
  height: 9px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 0;
  background: #ffffff;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login):hover > ul.submenu,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin:hover > ul.submenu,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login).focus > ul.submenu,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin.focus > ul.submenu {
  display: block;
  z-index: 99;
  position: absolute;
  margin-left: -1px;
  padding: 9px 0 14px 0;
  min-width: 100%;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-top: none;
  background: #ffffff;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu {
  display: none;
  margin-left: -1px;
  padding: 20px 0;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu a,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu a,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu span,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu span {
  display: block;
  padding: 4px 20px 4px 32px;
}
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu li a:hover,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu li a:hover,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu li a:focus,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu li a:focus,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu li span:hover,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu li span:hover,
.widget-bnl-siteheader ul.metanav > li.drop:not(.login) > ul.submenu li span:focus,
.widget-bnl-siteheader ul.metanav > li.drop.loggedin > ul.submenu li span:focus {
  background: #efefef;
  color: #505450;
  text-decoration: none;
}
.widget-bnl-siteheader ul.metanav > li.drop + li:not(.drop) {
  margin-left: 0;
}
.widget-bnl-siteheader ul.metanav > li.drop.loggedin:hover + li:not(.drop),
.widget-bnl-siteheader ul.metanav > li.drop.loggedin.focus + li:not(.drop) {
  border-left: 0;
  margin-left: 5px;
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://nl-nl.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://nl-nl.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://nl.pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://nl.pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.instagram.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://instagram.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.instagram.com/"] {
  display: block;
  overflow: hidden;
  text-indent: -9999em;
  width: 16px;
  margin: 0 0 -1px -1px;
  padding: 0 6px 0 1px;
  background-repeat: no-repeat;
  background-position: left center;
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://nl-nl.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.facebook.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://nl-nl.facebook.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-facebook.png");
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://twitter.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.twitter.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-twitter.png");
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://youtube.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.youtube.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-youtube.png");
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://linkedin.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.linkedin.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-linkedin.png");
}
.widget-bnl-siteheader ul.metanav > li > a[href^="https://pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://nl.pinterest.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.pinterest.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-pinterest.png");
}
.widget-bnl-siteheader ul.metanav > li > a[href^="http://www.instagram.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://instagram.com/"],
.widget-bnl-siteheader ul.metanav > li > a[href^="https://www.instagram.com/"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/follow-instagram.png");
}
.widget-bnl-siteheader ul.metanav > li > a.speaker {
  padding-right: 18px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/speaker.png");
  background-position: right bottom;
  background-repeat: no-repeat;
}
.widget-bnl-siteheader ul.metanav > li:last-child > a.speaker {
  padding-right: 18px;
  background-position: right bottom;
}
@media only screen and (min-width: 635px) {
  .widget-bnl-siteheader ul.metanav > li.become-member {
    float: none;
    clear: both;
    display: block;
    border: none;
    text-align: right;
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a {
    /* TODO abo 26-01-2018 Refactor: */
    /* The distance between the service menu and become member isn't configurable. This means that for certain styles, when using the service menu,
			there will be too little white space between the two. Making this configurable and adding a margin-top here would solve that. */
    position: relative;
    display: inline-block;
    padding: 0 0 4px 0;
    border-bottom: 2px solid transparent;
    font-family: Arial, sans-serif;
    color: #505450;
    font-size: 2.1083rem;
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a:hover,
  .widget-bnl-siteheader ul.metanav > li.become-member > a:focus {
    text-decoration: none;
    border-bottom: 2px solid #505450;
    color: #505450;
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a > span {
    color: #ff7320;
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a > span {
    position: relative;
    padding-left: 15px;
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a > span::before {
    content: "\00a0";
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a > span::after {
    content: "";
    position: absolute;
    left: 0;
    height: 14px;
    width: 15px;
    margin: 1px 0 0 0;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABEElEQVQ4y2P4X8zAAMSfQYQ+iMMAFQET/0EYJvIRiBOB+CxcCVQFnMOIrPc4EHMiqwAxtgLxfSD2gGnRBeLJKPZCsQxUxxNkM0NhbgLi61CJZih/AkxnABB3QdlHoJJF2KxoBeJgZOOR8RuoTl2YpDYQ/wPimVAF/6AKxECcP0gO44Aq+AMLvNdIkiC+BpT9C2bXfCDWBGJ+ZIXoDkI2AUMSGauA4hMp9MzQ1SBz2IHYGIjVkMR8gfgnko03gVgRWTMfEB9DUgDD9UiGlKLJHQDpA0mkY9EIwg+BmBfJAAsg/oEkvweXyaCYMoXKSQHxZSS5f9A0izfAQGGwFs3QJlwBho5BcbYXFJnQpMGErgYA1X+GLlG/c1QAAAAASUVORK5CYII=") no-repeat;
    top: calc(50% - 7px);
  }
  .widget-bnl-siteheader ul.metanav > li.become-member > a > span:focus {
    color: #ff7320;
  }
}
.widget-bnl-siteheader #bibliotheek-nl-content {
  clear: left;
  padding-bottom: 20px;
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .widget-bnl-siteheader li.drop.hoverexpandable.login {
    margin: 0 0 0.5em 0;
    padding-left: 0;
  }
  .widget-bnl-siteheader {
    padding-top: 15px;/* Instead of 20px white-space. */
  }
  .widget-bnl-siteheader ul.metanav {
    margin: 0 11px 0 10px;
    padding: 0 0 1em 0;
  }
  .widget-bnl-siteheader h1 a {
    margin: 0 20px 10px 10px;
  }
  .widget-bnl-siteheader img.sitelogo {
    max-width:  100%;
  }
}
.widget-bnl-navigatiebalk > ul {
  position: relative;
  z-index: 95;/* Set high so the covers from the schatkamer don't have a higher z-index than the menus which are a part of this. */
  clear: both;
  float: left;/* Can't use overflow: hidden to stretch the navbar around its floated contents because of the expandable menus, so float it as well. */
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  min-height:  10px;
  padding-right:  7px;
  border-radius:  6px;
  color:  #ffffff;
  background-color: #ff7320;
}
.widget-bnl-navigatiebalk > ul > li {
  float: left;
  min-height:  65px;
  border-right:  1px solid #ff9658;
}
.widget-bnl-navigatiebalk > ul > li > a,
.widget-bnl-navigatiebalk > ul > li > span {
  display: block;
  padding:  17px 20px 14px 20px;
  border-bottom:  1px solid transparent;
  overflow:  hidden;
  color:  #ffffff;
  line-height:  33px;
  text-decoration:  none;
  font-size: 1.9167rem;
}
.widget-bnl-navigatiebalk > ul > li > a,
.widget-bnl-navigatiebalk > ul > li > span {
  font-family: Arial, sans-serif;
}
.widget-bnl-navigatiebalk > ul > li.drop > a,
.widget-bnl-navigatiebalk > ul > li.drop > span {
  cursor: pointer;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAGCAYAAADQQP5pAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAlwSFlzAAALEwAACxMBAJqcGAAAAERJREFUKM9j+P//vwEIM6ABXOIUg/8IkIAklgAVe08LC88jW4pkGQjsp4WFAkB8/z8mADlEgIEWABpf7+liGRZLaWoZAF1/gw+KBxCOAAAAAElFTkSuQmCC") no-repeat right 5px top 55%;
}
.widget-bnl-navigatiebalk > ul > li.drop > a,
.widget-bnl-navigatiebalk > ul > li.drop > span {
  padding-right: 38px;/* Reserve space for the marker */
}
.widget-bnl-navigatiebalk > ul > li.active > a,
.widget-bnl-navigatiebalk > ul > li.active.touchstart > a,
.widget-bnl-navigatiebalk > ul > li.active:not(.touchstart) > a {
  color: #505450;
}
.widget-bnl-navigatiebalk > ul > li.active.drop > a,
.widget-bnl-navigatiebalk > ul > li.active.touchstart.drop > a,
.widget-bnl-navigatiebalk > ul > li.active:not(.touchstart).drop > a {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/dropmarker-active.png") right 55% no-repeat;
}
.widget-bnl-navigatiebalk > ul > li.drop > a:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):hover > a,
.widget-bnl-navigatiebalk > ul > li.drop.focus > a,
.widget-bnl-navigatiebalk > ul > li.drop > span:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):hover > span,
.widget-bnl-navigatiebalk > ul > li.drop.focus > span {
  cursor: pointer;
  background-color: #ffffff;
  background: #ffffff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAGBAMAAAAibuNaAAAAG1BMVEUAAAD/cyD/cyD/cyD/cyD/cyD/cyD/cyD/cyA8uB4RAAAACHRSTlMAMM9gEO/fv8nRmxAAAAApSURBVAjXYxBkACIE6DBgbkXiajRbtCNx3To6VJC4jBFNDgxIQBRZEgAXUQWbhMEN1wAAAABJRU5ErkJggg==") no-repeat right 5px top 55%;
}
.widget-bnl-navigatiebalk > ul > li.drop > a:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):hover > a,
.widget-bnl-navigatiebalk > ul > li.drop.focus > a,
.widget-bnl-navigatiebalk > ul > li.drop > span:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):hover > span,
.widget-bnl-navigatiebalk > ul > li.drop.focus > span {
  padding-right: 38px;/* Reserve space for the marker */
}
.widget-bnl-navigatiebalk > ul > li.drop > a[href=""] {
  cursor: default;
}
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child {
}
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > a,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > span {
  border-radius:  6px 0 0 6px;
}
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > a:hover,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > span:hover,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > a:focus,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > span:focus {
}
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > a:hover,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > span:hover,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > a:focus,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):first-child > span:focus {
}
.widget-bnl-navigatiebalk > ul > li.drop:first-child > a:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):first-child:hover > a,
.widget-bnl-navigatiebalk > ul > li.drop.focus:first-child > a,
.widget-bnl-navigatiebalk > ul > li.drop:first-child > span:focus,
.widget-bnl-navigatiebalk > ul > li.drop:not(.touchstart):not(.focus):first-child:hover > span,
.widget-bnl-navigatiebalk > ul > li.drop.focus:first-child > span {
  border-radius:  6px 0 0 0;
}
.widget-bnl-navigatiebalk > ul > li > a:focus,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover > a,
.widget-bnl-navigatiebalk > ul > li.focus > a,
.widget-bnl-navigatiebalk > ul > li > span:focus,
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover > span,
.widget-bnl-navigatiebalk > ul > li.focus > span {
  outline: 0;
  color:  #ff7320;
  background-color: #ffffff;
}
.widget-bnl-navigatiebalk > ul > li > ul {
  display: none;
  color:  #505450;
  background-color: #ffffff;
}
.widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover > ul,
.widget-bnl-navigatiebalk > ul > li.focus > ul {
  position: absolute;
  z-index: 99;
  display: block;
  margin-left:  0;
  padding:  9px 0 14px 0;
  border:  1px solid #f0f0f0;
  border-top:  0;
  background-color: #ffffff;
}
.widget-bnl-navigatiebalk > ul > li > ul a,
.widget-bnl-navigatiebalk > ul > li > ul span {
  display: block;
  padding:  4px 20px;
  color:  #505450;
  text-decoration:  none;
}
.widget-bnl-navigatiebalk > ul > li > ul a:hover,
.widget-bnl-navigatiebalk > ul > li > ul a:focus,
.widget-bnl-navigatiebalk > ul > li > ul span:hover,
.widget-bnl-navigatiebalk > ul > li > ul span:focus {
  color:  #505450;
  text-decoration:  none;
  background-color: #f0f0f0;
}
@media (min-width: 635px) {
  .widget-bnl-navigatiebalk > ul > li.home > a {
    padding-left: 17px;
    padding-right: 17px;
    background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/home/home.png") no-repeat center;
  }
  .widget-bnl-navigatiebalk > ul > li.home > a > span {
    display: inline-block;
    text-indent: -9999px;
    padding-left: 18px;
  }
  .widget-bnl-navigatiebalk > ul > li.home.active > a {
    background-image: url('../images/icons/home/active.png');
  }
  .widget-bnl-navigatiebalk > ul > li.home:hover > a,
  .widget-bnl-navigatiebalk > ul > li.home.focus > a,
  .widget-bnl-navigatiebalk > ul > li.home > a:focus {
    background-image: url('../images/icons/home/hover.png');
    background-color: #ffffff;
  }
}
@media (min-width: 0) and (max-width: 634px) {
  .widget-bnl-navigatiebalk > ul {
    width:  100%;
    padding-right:  0;
  }
  .widget-bnl-navigatiebalk > ul > li {
    width:  50%;
    min-height:  30px;
    border-radius:  0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover,
  .widget-bnl-navigatiebalk > ul > li.focus,
  .widget-bnl-navigatiebalk > ul > li:focus {
    color:  #ff7320;
    background-color: #ffffff;
  }
  .widget-bnl-navigatiebalk > ul > li:nth-of-type(even) {
    float:  right;
    border-right:  0;
  }
  .widget-bnl-navigatiebalk > ul > li:nth-of-type(odd) {
    float:  left;
    border-left:  1px solid #ff9658;
  }
  .widget-bnl-navigatiebalk > ul > li > a {
    padding-top:  12px;
    padding-bottom:  9px;
  }
  .widget-bnl-navigatiebalk > ul > li a { /* Purposefully not > a. */
    padding-left:  15px;
  }
  .widget-bnl-navigatiebalk > ul > li > ul > li a { /* Purposefully not > a. */
    font-size: inherit;
  }
  .widget-bnl-navigatiebalk > ul > li:first-child,
  .widget-bnl-navigatiebalk > ul > li:first-child > a:focus,
  .widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover:first-child > a,
  .widget-bnl-navigatiebalk > ul > li.focus:first-child > a {
    border-radius: 6px 0 0 0;
  }
  .widget-bnl-navigatiebalk > ul > li:first-child + li,
  .widget-bnl-navigatiebalk > ul > li:first-child + li > a:focus,
  .widget-bnl-navigatiebalk > ul > li:first-child + li:not(.touchstart):not(.focus):hover > a,
  .widget-bnl-navigatiebalk > ul > li:first-child + li.focus > a {
    border-radius: 0 6px 0 0;
  }
  .widget-bnl-navigatiebalk > ul > li:last-child:nth-of-type(even),
  .widget-bnl-navigatiebalk > ul > li:last-child:nth-of-type(even) > a:focus,
  .widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover:last-child:nth-of-type(even) > a,
  .widget-bnl-navigatiebalk > ul > li.focus:last-child:nth-of-type(even) > a {
    border-radius: 0 0 6px 0;
  }
  .widget-bnl-navigatiebalk > ul > li:last-child:nth-of-type(odd),
  .widget-bnl-navigatiebalk > ul > li:last-child:nth-of-type(odd) > a:focus,
  .widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover:last-child:nth-of-type(odd) > a,
  .widget-bnl-navigatiebalk > ul > li.focus:last-child:nth-of-type(odd) > a,
  .widget-bnl-navigatiebalk > ul > li:nth-last-child(2):nth-of-type(odd),
  .widget-bnl-navigatiebalk > ul > li:nth-last-child(2):nth-of-type(odd) > a:focus,
  .widget-bnl-navigatiebalk > ul > li:not(.touchstart):not(.focus):hover:nth-last-child(2):nth-of-type(odd) > a,
  .widget-bnl-navigatiebalk > ul > li.focus:nth-last-child(2):nth-of-type(odd) > a {
    border-radius: 0 0 0 6px;
  }
  .widget-bnl-navigatiebalk > ul > li > a,
  .widget-bnl-navigatiebalk > ul > li > span {
    border: none;
    line-height: 25px;
  }
}
.widget-bnl-zoekinsiteofcatalogus {
  clear: left;
  position: relative;
  top:  -20px;
  margin-bottom:  -20px;
  padding:  30px 0 5px 0;
  text-align:  center;
}
.widget-bnl-zoekinsiteofcatalogus form {
  padding: 0 10px;
}
.widget-bnl-zoekinsiteofcatalogus .where,
.widget-bnl-zoekinsiteofcatalogus input[type="text"],
.widget-bnl-zoekinsiteofcatalogus .material-filter,
.widget-bnl-zoekinsiteofcatalogus button.submit {
  display: inline-block;
  vertical-align: bottom;
}
.widget-bnl-zoekinsiteofcatalogus .where {
  margin-bottom:  2px;
  padding-right:  10px;
}
.widget-bnl-zoekinsiteofcatalogus .where > label {
  float:  left;
  clear:  left;
  margin-top:  -2px;
  margin-bottom:  2px;
}
.widget-bnl-zoekinsiteofcatalogus .where > label + label {
  margin-top:  2px;
  margin-bottom:  -2px;
}
.widget-bnl-zoekinsiteofcatalogus .where > label input[type="radio"] {
  position:  relative;
  top:  1px;
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content.interactive:not(.nofilter) .where {
  display: none;
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content.nofilter .inputwrapper {
  width: calc(26.3125em - 5px);
  margin-right: 5px;
}
/* TODO: Check if this styling is correct for the simple (radio button) variant */
.widget-bnl-zoekinsiteofcatalogus .inputwrapper {
  position: relative;
  display: inline-block;
  width:  17.6875em;
  height:  1.8em;
  min-width:  13em;
  max-width:  40%;
  margin:  3px 8.625em 5px -5px;
  padding:  0 22px 0 0;
  border:  1px solid transparent;
  border-radius:  6px;
  vertical-align:  bottom;
  font-size: 1.5333rem;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content:not(.interactive) .inputwrapper {
  width: 26.3125em;/* Effective width: 421px. (=283+138) */
  margin-right: 5px;
}
/* TODO: Revisit this file; see how much can be removed in favour of generic form styling. */
.widget-bnl-zoekinsiteofcatalogus input[type="text"] {
  height: 100%;
  width: 100%;
  padding:  0 10px 0 10px;
  border:  1px solid transparent;
  border-radius:  6px;
  border-color:  #b8b8b8 #cdcdcd #e1e1e1 #cdcdcd;
  font-size: inherit;
  background-color: #ffffff;
  -webkit-box-shadow: 0 1px 1px #eee inset;
  box-shadow: 0 1px 1px #eee inset;
}
.widget-bnl-zoekinsiteofcatalogus input[type="text"]:focus {
  outline: 0;
  border-color:  #ff7320;
  -webkit-box-shadow: 0 1px 1px #d0d0d0 inset;
  box-shadow: 0 1px 1px #d0d0d0 inset;
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content.interactive input[type="text"] {
  width: 100%;
  padding-right: 8.625em;/* Effect padding-right: 138px; */
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content.interactive.nofilter input[type="text"] {
  padding-right: 10px;
}
.widget-bnl-zoekinsiteofcatalogus.biebwidget-content.static button.submit {
  margin-left: 15px;
}
.widget-bnl-zoekinsiteofcatalogus button.submit {
  height:  1.8em;/*2.375em; Effective height 38px. */
  margin:  0 0 5px 0;
  padding:  0 12px 0 17px;
  border:  1px solid transparent;
  border-color:  #d8d8d8 #d2d2d2 #d5d5d5 #d2d2d2;
  color:  #505450;
  font-weight:  bold;
  background-color:  #ffffff;
  font-size: 1.5333rem;
  border-radius:  7px;
}
.widget-bnl-zoekinsiteofcatalogus button.submit:hover,
.widget-bnl-zoekinsiteofcatalogus button.submit:focus {
  color:  #ff7320;
  background-color:  #505050;
}
.widget-bnl-zoekinsiteofcatalogus button.submit:focus {
  border-color: #b5b5b5 #d2d2d2 #e0e0e0 #d2d2d2;
  outline: 0;
}
.widget-bnl-zoekinsiteofcatalogus button.submit:hover,
.widget-bnl-zoekinsiteofcatalogus button.submit:focus {
  color:  #ff7320;
  background-color:  #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus button.submit {
  font-family: Arial, sans-serif;
}
.widget-bnl-zoekinsiteofcatalogus button.submit > span {
  display: block;
  padding-right: 1.4em;
  line-height: 1.3;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/search.png") no-repeat right center;
  background-size: auto 75.26%;
}
.widget-bnl-zoekinsiteofcatalogus button.submit:hover > span,
.widget-bnl-zoekinsiteofcatalogus button.submit:focus > span {
  color: inherit;
  background: url("data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAABR0lEQVQ4y6XTPS9DYRQH8Eu9pCJMoo2lgkgkPofYDBJSA2KodO3UpJ+gCTFbWQwGMRCjtw+gA6JDU01ENUSCxOLxP5wrpyfPy2D4Dfeec//3eY1MIRMJHZCFY3iED3iAQ5hXvb+M+SFfjsEJGI8DGPEFUUhdffQCNXhV72/awkRQN5yKxntYgRQk+aN1aIqeI16GtqBlFTJuXYtCZhqeRO+MDjoXxawjJJYXvTs66I0L9LfBQFBa9FegUwbFf7j+m7dbkqdveCN6ZdC7GNFAICjlG9GlGNVCICgnenf1Gq2KIg131BEyxaed+r5gVgf1wIUKW4Ihrg3DGl+VuOfKdbInoKFOcAuq8Gy5Kp9QdN21STgL3LU79VyyBZEELMI+3PIo6VjswRz0waYtzLdDdAf7octS02FbUWC7fcoiaOM/QWSbQmhq3/9DpLy9sU4jAAAAAElFTkSuQmCC") no-repeat right center;
  background-size: auto 75.26%;
}
.widget-bnl-zoekinsiteofcatalogus button.submit::-moz-focus-inner {
  border: 0;
}
.widget-bnl-zoekinsiteofcatalogus button.submit:focus > span {
  margin: 1px 0 -1px 0;
}
.widget-bnl-zoekinsiteofcatalogus .material-filter {
  position: absolute;
  right: -8.625em;
  top: -3px;
  overflow: visible;
  width: 8em;
  margin: 0.5em 0.66em 0.5em 0;
  text-align: left;
}
.widget-bnl-zoekinsiteofcatalogus .material-filter button {
  display: block;
  overflow: hidden;
  width:  98%;
  margin-top:  -1px;
  padding:  0 0 0 8px;
  border-left:  1px solid #cdcdcd;
  color:  #505450;
  line-height:  1.692;
  white-space:  nowrap;
  text-overflow:  ellipsis;
  font-size: 1.2458rem;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/dropdown.png") 98% 60% no-repeat;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.widget-bnl-zoekinsiteofcatalogus .material-filter button:hover,
.widget-bnl-zoekinsiteofcatalogus .material-filter button:focus {
  color:  #ff7320;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAGCAYAAAARx7TFAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAJcEhZcwAACxMAAAsTAQCanBgAAABlSURBVAjXY/hfrLAJiC8BsSQQMyBhUSC+AJIHcR4B8X+oQgGoAn4gvggVfwwSMAfir1CBE0AsBqX/Q8XNYUa7A/FPqMQXKA3iO4Pkkd0QDcT/oAr+AHEITI4BzbHpQPweiJOQxQEG3G5QU8Y0nQAAAABJRU5ErkJggg==") 98% 60% no-repeat;
}
.widget-bnl-zoekinsiteofcatalogus .material-list {
  display: none;
  position: absolute;
  z-index: 93;/* Set between schatkamer covers and navigatiebalk. */
  width: 8em;/* 8.1875em;*/
  border-width: 1px;
  border-style: none solid solid;
  padding:  0 0 7px 0;
  border-radius:  0 0 7px 7px;
  border-color:  #d8d8d8 #d2d2d2 #d5d5d5 #d2d2d2;
  background-color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .material-list.open {
  display: block;
}
.widget-bnl-zoekinsiteofcatalogus .material-list [type="radio"] {
  display: none;
}
.widget-bnl-zoekinsiteofcatalogus .material-list label {
  display: block;
  overflow: hidden;
  padding: 2px 8px 1px 8px;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  font-size: 1.2458rem;
}
.widget-bnl-zoekinsiteofcatalogus .material-list a {
  display: block;
  overflow: visible;
  margin-top: 5px;
  border-top: 1px solid #cdcdcd;
  padding: 4px 8px 0 8px;
  font-size: 1.15rem;
}
.widget-bnl-zoekinsiteofcatalogus .material-list label.current,
.widget-bnl-zoekinsiteofcatalogus .material-list label:hover {
  color:  #ffffff;
  background-color: #ff7320;
}
.widget-bnl-zoekinsiteofcatalogus .material-list hr {
  margin: 4px 8px 2px 8px;
  border: 0 solid transparent;
  border-top: 1px solid #cdcdcd;/*#d0d0d0;*/
  height: 0;
}
.widget-bnl-zoekinsiteofcatalogus .beta {
  position: absolute;
  display: inline-block;
  min-height: 16px;
  margin: 1em 0 0 13px;
  border: 2px solid #efefef;
  border-radius: 9px;
  padding: 3px 0.9em 0 0.9em;
  font-weight: bold;
  text-transform: uppercase;
  color: #ffffff;
  background-color: #009900;
  font-size: 1.2938rem;
  -webkit-box-shadow: 0 6px 3px -3px rgba(0, 0, 0, 0.25), 0 2px 1px -1px rgba(0, 0, 0, 0.15) inset;
  box-shadow: 0 6px 3px -3px rgba(0, 0, 0, 0.25), 0 2px 1px -1px rgba(0, 0, 0, 0.15) inset;
}
.widget-bnl-zoekinsiteofcatalogus .beta:before {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  left: -22px;
  top: 0.3em;
  margin-top: 1px;
  border-style: solid;
  border-width: 6px 11px;
  border-color: transparent #efefef transparent transparent;
}
.widget-bnl-zoekinsiteofcatalogus .beta:after {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  left: -14px;
  top: 0.3em;
  margin-top: 3px;
  border-style: solid;
  border-width: 4px 7px;
  border-color: transparent #009900 transparent transparent;
}
/* autocomplete */
.widget-bnl-zoekinsiteofcatalogus .results-container {
  position: absolute;
  z-index: 92;
  left: 0;
  right: 0;
  max-width: none;
  width: auto;
  margin: -1px 0 0 0;
  border-style: solid;
  border-width: 1px;
  border-top: none;
  padding: 0 10px 0 10px;
  text-align: left;
  text-overflow: ellipsis;
  border-color:  #b8b8b8 #cdcdcd #e1e1e1 #cdcdcd;
  background-color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .results-container::before {
  content: "";
  position: absolute;
  top: -1em;
  left: -1px;
  display: block;
  width: 5px;
  height: 1em;
  border-left: 1px solid #cdcdcd;
  background-color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .results-container::after {
  content: "";
  position: absolute;
  top: -1em;
  right: -1px;
  display: block;
  width: 5px;
  height: 1em;
  border-right: 1px solid #cdcdcd;
  background-color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .results-container input {
  position: absolute;
  left: -9999px;
}
.widget-bnl-zoekinsiteofcatalogus .results-container label {
  display: block;
  width: 100%;
  margin-left: -10px;
  padding: 7px 10px;
  text-align: left;
  border: none;
  background: none;
  outline: none;
  color: #505450;
  cursor: pointer;
  font-size: 1.15rem;
}
.widget-bnl-zoekinsiteofcatalogus .results-container input:focus + label,
.widget-bnl-zoekinsiteofcatalogus .results-container label:hover {
  background-color: #ff7320;
  color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .results-container ul .current button,
.widget-bnl-zoekinsiteofcatalogus .results-container ul button:hover,
.widget-bnl-zoekinsiteofcatalogus .results-container ul button:focus {
  background-color: #ff7320;
  color: #ffffff;
}
.widget-bnl-zoekinsiteofcatalogus .nofilter .results-container {
  width: calc(25.3125em + 6px);
}
@media (min-width: 0) and (max-width: 800px) {
  .widget-bnl-zoekinsiteofcatalogus .beta {
    display: none;
  }
}
@media (min-width: 0) and (max-width: 634px) {
  .widget-bnl-zoekinsiteofcatalogus .where > label {
    float: none;
    white-space: nowrap;
  }
}
@media (min-width: 0) and (max-width: 469px) {
  .widget-bnl-zoekinsiteofcatalogus form {
    padding-top: 5px;
    background: rgba(239, 239, 239, 0.7);
  }
  .widget-bnl-zoekinsiteofcatalogus .where,
  .widget-bnl-zoekinsiteofcatalogus.biebwidget-content.interactive .where {
    display: block;
  }
  .widget-bnl-zoekinsiteofcatalogus .material-filter {
    display: none;
  }
  .widget-bnl-zoekinsiteofcatalogus input[type="text"],
  .widget-bnl-zoekinsiteofcatalogus.biebwidget-content.interactive input[type="text"] {
    min-width: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 5px;
    padding-left: 5px;
  }
  .widget-bnl-zoekinsiteofcatalogus .inputwrapper,
  .widget-bnl-zoekinsiteofcatalogus .inputwrapper.nofilter,
  .widget-bnl-zoekinsiteofcatalogus.biebwidget-content:not(.interactive) .inputwrapper,
  .widget-bnl-zoekinsiteofcatalogus.biebwidget-content.nofilter .inputwrapper {
    position: relative;
    max-width: none;
    width: auto;
    margin-right: 0;
    padding-right: 0;
    min-width: 0;
  }
  .widget-bnl-zoekinsiteofcatalogus .results-container,
  .widget-bnl-zoekinsiteofcatalogus .nofilter .results-container {
    left: 0;
    right: 0;
    max-width: none;
    width: auto;
    padding: 0 10px;
  }
  .widget-bnl-zoekinsiteofcatalogus .results-container::after,
  .widget-bnl-zoekinsiteofcatalogus .nofilter .results-container::after {
    content: "";
    top: -1em;
    height: 1em;
  }
  .widget-bnl-zoekinsiteofcatalogus button.submit {
    padding-left: 7px;
  }
  .widget-bnl-zoekinsiteofcatalogus button.submit.submit > span {
    text-indent: -9999em;
  }
}
.widget-bnl-footer {
  position: relative;
  float: right;
  clear: both;
  width: 100%;
  padding-top: 30px;
}
/* This is the bottom-right plectrum. */
.widget-bnl-footer > .plectrum {
  position: absolute;
  z-index: -1;
  right: -50px;
  bottom: 0;
  height: 126px;
  width: 139px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/bg-plectrum.png");
  background-repeat: no-repeat;
}
.widget-bnl-footer .nav {
  overflow: hidden;
  margin-bottom:  20px;
  padding:  20px 20px 40px 20px;
  color:  #ffffff;
  background-color: #505450;
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.widget-bnl-footer .nav a,
.widget-bnl-footer .nav * a {
  color: #ffffff;
}
.widget-bnl-footer .nav a:hover,
.widget-bnl-footer .nav a:focus,
.widget-bnl-footer .nav * a:hover,
.widget-bnl-footer .nav * a:focus {
  color: #ff7320;
}
.widget-bnl-footer .nav .link-list > li > a {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAHCAYAAAArkDztAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAZklEQVR42mL4//9/GhCvAmJBIGaAYYAAYmJgYFAC4lAg3g3EggxQABBAMBUz/0PAO6gJDAABxICkveM/AhgDBBBMsBxJEKwDIIBAgmegAndBKmEmAAQQI8gIoF3vgXgWlAYDgAADAL8QbWY6vj2VAAAAAElFTkSuQmCC");
}
.widget-bnl-footer .nav .link-list > li > a:hover,
.widget-bnl-footer .nav .link-list > li > a:focus {
  /* background-image: data-uri("image/png;base64", "../images/link-item-hover.png"); TODO: restore this once Jaap's fix is in. */
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/link-item-hover.png");
}
.widget-bnl-footer .column {
  float: left;
  width: 17%;
  min-width: 11em;/* Prevent long words from overlapping the next column at large default font-sizes. */
  min-height: 120px;
  padding-left: 2%;
}
.widget-bnl-footer .column:first-child {
  width: 21%;
  padding-left: 0;
}
.widget-bnl-footer h2 {
  margin:  0 20px 15px 0;
  padding-top:  15px;
  font-size: 1.4375rem;
}
/* This is the top-left plectrum. */
.widget-bnl-footer .nav .plectrum {
  position: absolute;/* Break out of the overflow: hidden .nav */
}
.widget-bnl-footer .nav .plectrum > *:first-child {
  margin-top: 154px;
}
.widget-bnl-footer .nav .plectrum img {
  position: absolute;
  top: -55px;
  left: 0;
}
.widget-bnl-footer .metanav {
  margin: 0 90px 20px 0;
}
.widget-bnl-footer .metanav a {
  color: #505450;
}
.widget-bnl-footer .cookie-permission-container {
  clear: both;
  padding-top: 1em;
  padding-left: 2%;
}
.widget-bnl-footer .cookie-permission-container {
  padding-left: 23%;
}
.widget-bnl-footer .cookie-permission-container span {
  margin-right: 10px;
}
.widget-bnl-footer .cookie-permission-container button.cookie-permission {
  color: #ffffff;
  text-decoration: underline;
}
.widget-bnl-footer .cookie-permission-container button.cookie-permission:hover,
.widget-bnl-footer .cookie-permission-container button.cookie-permission:focus {
  color: #ffffff;
  text-decoration: none;
}
@media (min-width: 0) and (max-width: 916px) {
  .widget-bnl-footer .cookie-permission-container {
    padding-left: 2%;
  }
}
/*adaptive*/
@media (min-width: 900px) and (max-width: 1024px) {
  .widget-bnl-footer > .plectrum {
    right: -15px;
  }
}
@media (min-width: 0) and (max-width: 916px) {
  .widget-bnl-footer .column {
    min-width: 23%;
    min-height: 0;
  }
  .widget-bnl-footer .column:first-child {
    width: auto;
  }
  .widget-bnl-footer > .plectrum {
    display: none;
  }
  .widget-bnl-footer .metanav {
    margin-right: 0;
  }
}
@media (min-width: 634px) and (max-width: 916px) {
  .widget-bnl-footer .nav .plectrum img {
    max-width: 160px;
  }
  .widget-bnl-footer .column:first-child + .column {
    padding-top: 100px;
  }
}
@media (min-width: 0) and (max-width: 634px) {
  .widget-bnl-footer .nav .plectrum img {
    max-width: 100px;
  }
  .widget-bnl-footer .column:first-child + .column {
    padding-top: 33px;
  }
  .widget-bnl-footer .column {
    min-height: 10%;
    width: 40%;
    padding-right: 8%;
  }
  .widget-bnl-footer .column:nth-child(4) {
    clear: left;
  }
}
.biebwidget-content.widget-bnl-category .gids {
  background: #fafafa url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/plectrum-large-gids.png") no-repeat center;
  background-size: 95%;
}
.biebwidget-content.widget-bnl-category .gids > .container {
  background: -moz-linear-gradient(left, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%), -moz-linear-gradient(right, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%), -webkit-linear-gradient(right, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%);/* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to left, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%), linear-gradient(to right, rgba(250, 250, 250, 0) 0, rgba(250, 250, 250, 0.005) 15px, rgba(250, 250, 250, 0.965) 35px, rgba(250, 250, 250, 0.965) 50%, rgba(250, 250, 250, 0) 50%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.biebwidget-content.widget-bnl-category .gids h3 {
  margin: 0 160px;
  padding: 57px 0 20px 0;
  text-align: center;
}
.biebwidget-content.widget-bnl-category .gids .container {
  margin: 0 160px;
  padding: 0 0 30px 0;
}
.biebwidget-content.widget-bnl-category .gids .container > dl {
  position: relative;
  padding-right: 40px;
}
.biebwidget-content.widget-bnl-category .gids .container > dl > dt {
  clear: none;
  width: 50%;
  padding: 0 8em 12px 40px;
  background-image: none;
}
.biebwidget-content.widget-bnl-category .gids .container > dl > dt:nth-of-type(odd) {
  clear: left;
}
@media only screen and (min-width: 1051px) {
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd {
    margin-top: 2em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd {
    margin-top: 4em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd {
    margin-top: 6em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd {
    margin-top: 8em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd + dd {
    margin-top: 10em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd + dd + dd {
    margin-top: 12em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd + dd + dd + dd {
    margin-top: 14em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd + dd + dd + dd + dd {
    margin-top: 16em;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl dt + dd + dd + dd + dd + dd + dd + dd + dd + dd + dd {
    margin-top: 18em;
  }
}
.biebwidget-content.widget-bnl-category .gids .container > dl > dd {
  float: left;
  width: 15%;
  margin: 0 0 0 -8.5em;
  padding: 0 0 11px 0;
}
.biebwidget-content.widget-bnl-category .gids .container::after {
  content: "";
  float: left;
  display: block;
  height: 20px;
  width: 100%;
}
.biebwidget-content.widget-bnl-category .gids .container p {
  padding: 0 40px;
}
@media only screen and (min-width: 0px) and (max-width: 1050px) {
  .biebwidget-content.widget-bnl-category .gids .container > dl > dt {
    clear: both;
    width: 75%;/* fallback */
    width: calc(100% - 8.1em);
    padding: 0 0 12px 40px;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl > dt:nth-of-type(odd) {
    clear: both;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl > dd {
    float: right;
    width: 25%;/* fallback */
    width: calc(8em);/* to make sure em is not used for fallback */
    margin: 0;
  }
}
@media only screen and (min-width: 700px) and (max-width: 900px) {
  .biebwidget-content.widget-bnl-category .gids .container,
  .biebwidget-content.widget-bnl-category .gids h3 {
    margin: 0 80px;
  }
}
@media only screen and (min-width: 500px) and (max-width: 700px) {
  .biebwidget-content.widget-bnl-category .gids .container,
  .biebwidget-content.widget-bnl-category .gids h3 {
    margin: 0 20px;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl {
    background: none;
  }
}
@media only screen and (min-width: 0px) and (max-width: 666px) {
  .biebwidget-content.widget-bnl-category .gids h3 {
    text-align: left;
  }
}
@media only screen and (min-width: 0px) and (max-width: 500px) {
  .biebwidget-content.widget-bnl-category .gids {
    background: #fafafa;
  }
  .biebwidget-content.widget-bnl-category .gids .container,
  .biebwidget-content.widget-bnl-category .gids h3 {
    margin: 0 20px;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl {
    padding-right: 20px;
    background: none;
  }
  .biebwidget-content.widget-bnl-category .gids .container > dl > dt {
    padding-left: 20px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 400px) {
  .biebwidget-content.widget-bnl-category .gids .container,
  .biebwidget-content.widget-bnl-category .gids h3 {
    margin: 0;
  }
}
/** HEAD **/
.standard.biebwidget .widget-bnl-catalogusoverview .main-column .head {
  overflow: hidden;
  margin-top: -40px;
  margin-right: -40px;
  margin-left: -40px;
}
.widget-bnl-catalogusoverview .main-column .head,
.widget-bnl-category .main-column .head {
  position: relative;
  min-height: 100px;
  margin-bottom: 20px;
  padding: 40px 40px 40px 40px;
  background-color: #595959;
  color: #ffffff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  background-size: cover;
  background-position: left center;
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_heavy::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 42.5em;
  height: 100%;
  background-size: 100%;
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_light::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_light::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_heavy::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_heavy::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_heavy::before,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block {
  overflow: hidden;
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > h2,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > h2,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > h3,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > h3,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > h3,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > h3,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .content > h3,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .content > h3,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > h3 + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > h3 + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .content > h3 + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .content > h3 + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .content + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .content + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > p + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > p + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper p + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper p + p,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > .content p + p,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-catalogusoverview .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary,
.widget-bnl-category .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-catalogusoverview .main-column .head.legacy-contrast::before,
.widget-bnl-category .main-column .head.legacy-contrast::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 42.5em;
  height: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;
  background-size: 100%;
}
.widget-bnl-catalogusoverview .main-column .head.low {
  min-height: 70px;
  padding-bottom: 20px;
}
.widget-bnl-catalogusoverview .main-column .head > *,
.widget-bnl-category .main-column .head > * {
  position: relative;
}
.widget-bnl-catalogusoverview .head h2 {
  color: inherit;
}
.widget-bnl-catalogusoverview .main-column .head:not(.low) h2,
.widget-bnl-category .head h2 {
  margin-top: 70px;
  color: inherit;
}
.widget-bnl-catalogusoverview .head .additional,
.widget-bnl-category .head .additional {
  max-width: 500px;
  color: inherit;
}
.widget-bnl-catalogusoverview .head .additional {
  font-size: 1.725rem;
}
.widget-bnl-category .head .additional {
  font-size: 1.725rem;
}
.widget-bnl-catalogusoverview .head .additional a,
.widget-bnl-category .head .additional a {
  color: inherit;
}
.widget-bnl-catalogusoverview .head .additional a:hover,
.widget-bnl-catalogusoverview .head .additional a:focus,
.widget-bnl-category .head .additional a:hover,
.widget-bnl-category .head .additional a:focus {
  color: inherit;
  text-decoration: none;
}
.widget-bnl-catalogusoverview .head .back.quaternary.button,
.widget-bnl-category .head .back.quaternary.button {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-back-white.png");
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .widget-bnl-catalogusoverview .head h2 {
    font-size: 2.875rem;
  }
  .widget-bnl-category .head {
    padding-left: 20px;
    padding-right: 20px;
  }
  .widget-bnl-category .head h2 {
    padding-left: 0;
    padding-right: 0;
    font-size: 2.875rem;
  }
}
.widget-bnl-catalogusoverview .tablinks > ul {
  padding-left: 0;
  text-align: left;
}
.widget-bnl-catalogusoverview .tablinks > ul > li {
  margin-right: 20px;
  margin-left: 0;
}
.bordered.biebwidget .widget-bnl-category .main-column > h2:first-child { /* h2 shown, but no .head */
  padding: 40px 40px 0 40px;
}
.bordered.biebwidget .widget-bnl-category .main-column > h2:first-child ~ p {
  padding-right: 40px;
  padding-left: 40px;
}
.bordered.biebwidget .widget-bnl-category .table.section {
  margin-right: 40px;
  margin-left: 40px;
}
.bordered.biebwidget .widget-bnl-category .richtext.section + .section {
  margin-top: 20px;
}
.widget-bnl-category .richtext.section:not(:empty),
.widget-bnl-category .libraryfinder.section {
  overflow: hidden;/* Not ideal, since this means floated images in a paragraph won't have the next paragraph wrapping around them; but they wouldn't anyway due to the clear on .richtext... */
  margin-top: 20px;
}
.widget-bnl-category .signpost.section {
  margin-top: 20px;
}
/** SLIDING NAV + SCROLLABLEIMAGEBANNER **/
.widget-bnl-category .slidingnav.oneway > button.passive {
  display: none;
}
.slidingnav.large button.prev,
.slidingnav.large button.next {
  width: 28px;
  height: 46px;
  margin: 0 0.5%;
  padding: 10px 1.4%;
}
.slidingnav.large button.prev,
.slidingnav.large button.prev.passive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-huge.png");
}
.slidingnav.large button.next,
.slidingnav.large button.next.passive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-huge.png");
}
.slidingnav.large button.prev:not(.passive):hover,
.slidingnav.large button.prev:not(.passive):focus {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-huge-hover.png");
  background-color: transparent;
}
.slidingnav.large button.next:not(.passive):hover,
.slidingnav.large button.next:not(.passive):focus {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-huge-hover.png");
  background-color: transparent;
}
.widget-bnl-category .scrollableimagebanner.interactive {
  position: relative;
}
.widget-bnl-category .scrollableimagebanner.interactive > li {
  position: absolute;
  top: 0;
  background-color: #ffffff;
}
.widget-bnl-category .scrollableimagebanner li:not(:only-child) {
  width: 90%;
}
.widget-bnl-category .scrollableimagebanner.interactive > li > div,
.widget-bnl-category .scrollableimagebanner.interactive > li > div > div.content,
.widget-bnl-category .scrollableimagebanner.interactive > li > div > div.overlay {
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.7s;
  -webkit-transition-property: opacity;
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.7s;
  -o-transition-property: opacity;
  transition-delay: 0.00s;
  transition-duration: 0.7s;
  transition-property: opacity;
}
.widget-bnl-category .scrollableimagebanner.interactive > li.partial > div {
  opacity: 0.4;
}
.widget-bnl-category .scrollableimagebanner.interactive > li.partial > div > .content,
.widget-bnl-category .scrollableimagebanner.interactive > li.partial > div > .overlay {
  opacity: 0;
}
.widget-bnl-category .scrollableimagebanner li > div {
  position: relative;
  min-height: 400px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_light::before,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 12.67em;
  background-size: 100%;
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_light::before {
  background: -moz-linear-gradient(bottom, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(bottom, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_light::before {
  background: linear-gradient(to top, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_heavy::before {
  background: -moz-linear-gradient(bottom, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(bottom, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_heavy::before {
  background: linear-gradient(to top, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block {
  overflow: hidden;
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > h2,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > h3,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > h3,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .content > h3,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper > h3,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper > h3,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > h3 + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .content > h3 + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper > h3 + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper > h3 + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .content + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > p + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper p + p,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > .content p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .contrastWrapper.contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .scrollableimagebanner .white {
  background-color: #595959;
}
.widget-bnl-category .scrollableimagebanner .white.legacy-contrast::before {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 12.67em;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-bottom.png") repeat-x left bottom;
  background-size: auto 100%;
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_light::before,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 12.67em;
  background-size: 100%;
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_light::before {
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_light::before {
  background: linear-gradient(to top, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_heavy::before {
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_heavy::before {
  background: linear-gradient(to top, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block {
  overflow: hidden;
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > h2,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > h3,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > h3,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .content > h3,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper > h3,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper > h3,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > h3 + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .content > h3 + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper > h3 + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper > h3 + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .content + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > p + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper p + p,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > .content p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .scrollableimagebanner .white .contrastWrapper.contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .scrollableimagebanner div.overlay,
.widget-bnl-category .scrollableimagebanner .white > div.content,
.widget-bnl-category .scrollableimagebanner .white .button.tertiary,
.widget-bnl-category .scrollableimagebanner .white .button.quaternary {
  color: #ffffff;
}
.widget-bnl-category .scrollableimagebanner .white .button.quaternary {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-white.png");
}
.widget-bnl-category .scrollableimagebanner .white .button.tertiary:focus,
.widget-bnl-category .scrollableimagebanner .white .button.tertiary:hover {
  color: #ffffff;
  text-decoration: underline;
}
.widget-bnl-category .scrollableimagebanner .white .button.quaternary:focus,
.widget-bnl-category .scrollableimagebanner .white .button.quaternary:hover {
  color: #ffffff;
  text-decoration: none;
}
.widget-bnl-category .scrollableimagebanner .content {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 25px 40px;
}
.widget-bnl-category .scrollableimagebanner div.overlayed .content {
  padding-right: 260px;
}
.widget-bnl-category .scrollableimagebanner h3 {
  color: #ff7320;
  font-size: 4.025rem;
}
.widget-bnl-category .scrollableimagebanner .white h3 {
  color: #ffffff;
}
.widget-bnl-category .scrollableimagebanner h3,
.widget-bnl-category .scrollableimagebanner p.tagline {
  line-height: 1.2;
}
.widget-bnl-category .scrollableimagebanner .white h3,
.widget-bnl-category .scrollableimagebanner .white p.tagline,
.widget-bnl-category .scrollableimagebanner .white .tertiary.button:not(:hover):not(:focus),
.widget-bnl-category .scrollableimagebanner .white .quaternary.button:not(:hover):not(:focus) {
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.widget-bnl-category .scrollableimagebanner p.tagline {
  font-size: 1.5333rem;
}
.widget-bnl-category .scrollableimagebanner p.tagline + p {
  margin-top: 5px;
}
.widget-bnl-category .scrollableimagebanner .primary.button,
.widget-bnl-category .scrollableimagebanner .secondary.button {
  margin-left: 0;
}
.widget-bnl-category .scrollableimagebanner .overlay {
  position: absolute;
  right: 0;
  bottom: 0;
  float: right;
  min-width: 171px;
  max-width: 220px;
  min-height: 96px;
  padding: 40px 10px 20px 10px;
  text-align: center;
  line-height: 1.1;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: cover;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/plectrum-banner-bottomright.png");
}
.widget-bnl-category .scrollableimagebanner .overlay > span {
  display: block;
}
.widget-bnl-category .scrollableimagebanner .overlay > span:first-child {
  font-size: 5.75rem;
}
.widget-bnl-category .scrollableimagebanner .overlay > span + span {
  font-size: 2.3rem;
}
@media only screen and (min-width: 0) and (max-width: 569px) {
  .widget-bnl-category .scrollableimagebanner > li > div {
    min-height: 0;
    padding: 179px 20px 20px 20px;
  }
  .widget-bnl-category .scrollableimagebanner .content,
  .widget-bnl-category .scrollableimagebanner div.overlayed .content {
    position: relative;
    padding: 0;
  }
  .widget-bnl-category .scrollableimagebanner .overlay {
    display: none;
  }
  .widget-bnl-category .scrollableimagebanner h3 {
    font-size: 2.5875rem;
  }
}
/** SIMPLEBANNER **/
.widget-bnl-category .simplebanner {
  position: relative;
  display: block;
  min-height: 260px;
  overflow: hidden;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.widget-bnl-category .simplebanner:not(.white).contrast_light::before,
.widget-bnl-category .simplebanner:not(.white).contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 42.5em;
  height: 100%;
  background-size: 100%;
}
.widget-bnl-category .simplebanner:not(.white).contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .simplebanner:not(.white).contrast_light::before {
  background: -moz-linear-gradient(left, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .simplebanner:not(.white).contrast_light::before {
  background: linear-gradient(to right, rgba(255, 255, 255,.3) 0%, rgba(255, 255, 255,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .simplebanner:not(.white).contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .simplebanner:not(.white).contrast_heavy::before {
  background: -moz-linear-gradient(left, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .simplebanner:not(.white).contrast_heavy::before {
  background: linear-gradient(to right, rgba(255, 255, 255,.7) 0%, rgba(255, 255, 255,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .simplebanner:not(.white).contrast_block {
  overflow: hidden;
}
.widget-bnl-category .simplebanner:not(.white).contrast_block > h2,
.widget-bnl-category .simplebanner:not(.white).contrast_block > h3,
.widget-bnl-category .simplebanner:not(.white).contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > h3,
.widget-bnl-category .simplebanner:not(.white).contrast_block .content > h3,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper > h3,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper > h3,
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > h3 + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .content > h3 + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .content + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > p + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper p + p,
.widget-bnl-category .simplebanner:not(.white).contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .simplebanner:not(.white).contrast_block > .content p + p > .quaternary,
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .simplebanner:not(.white).contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(255, 255, 255,.5);
}
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .simplebanner:not(.white).contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .simplebanner:not(.white).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .simplebanner:not(.white).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .simplebanner:not(.white).contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .simplebanner.imageless {
  min-height: 164px;
}
.widget-bnl-category .simplebanner > .wrapper {
  position: relative;
  height: 100%;
  overflow: hidden;
  padding: 20px 8.5% 20px 11.083%;
}
.widget-bnl-category .simplebanner.overlayed > .wrapper:before,
.widget-bnl-category .simplebanner.overlayed > .wrapper:after {
  position: absolute;
  display: block;
  content: "";
}
.widget-bnl-category .simplebanner.overlayed > .wrapper:before {
  left: 0;
  bottom: 0;
  width: 133px;
  height: 171px;
  margin-left: -133px;
  padding-left: 11.083%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/plectrum-banner-bottomleft.png") no-repeat right bottom;
}
.widget-bnl-category .simplebanner.overlayed > .wrapper:after {
  right: 0;
  top: 0;
  width: 102px;
  height: 111px;
  margin-right: -102px;
  padding-right: 8.5%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/plectrum-banner-topright.png") no-repeat left top;
}
.widget-bnl-category .simplebanner.overlayed > .wrapper {
  min-height: 220px;
}
.widget-bnl-category .simplebanner.imageless > .wrapper.separator {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted-vertical.png") repeat-y 60% top content-box;
}
.widget-bnl-category .simplebanner .wrapper .main-info {
  float: left;
  width: 60%;
}
.widget-bnl-category .simplebanner .wrapper .main-info .wrapper {
  margin: 60px 20px 60px 0;
  padding: 0 20px 0 20px;
}
.widget-bnl-category .simplebanner.imageless .wrapper .main-info .wrapper {
  margin: 20px 20px 20px 0;
}
.widget-bnl-category .simplebanner .wrapper .main-info .wrapper h3 {
  margin-bottom: 10px;
  font-weight: normal;
  line-height: 1.2;
  color: #ff7320;
  font-size: 2.6833rem;
}
.widget-bnl-category .simplebanner.imageless .wrapper .main-info .wrapper h3 {
  font-size: 1.9167rem;
}
.widget-bnl-category .simplebanner.white {
  background-color: #595959;
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_light::before,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 42.5em;
  height: 100%;
  background-size: 100%;
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_light::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_light::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_heavy::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_heavy::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block {
  overflow: hidden;
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > h2,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > h3,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > h3,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .content > h3,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper > h3,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper > h3,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > h3 + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .content > h3 + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .content + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > p + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper p + p,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > .content p + p > .quaternary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > p + p > .tertiary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block + .content > p + p > .quaternary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-category .simplebanner.white:not(.twoblocks).contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .simplebanner.twoblocks:not(.contrast_block)::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-size: 100%;
}
.widget-bnl-category .simplebanner.twoblocks.contrast_light::before {
  background-color: rgba(255, 255, 255, 0.2);
}
.widget-bnl-category .simplebanner.twoblocks.contrast_heavy::before {
  background-color: rgba(255, 255, 255, 0.45);
}
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper h3,
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper .extra-info .wrapper h4,
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper .extra-info .wrapper p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px;
  background-color: rgba(255, 255, 255, 0.5);
}
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper p + p {
  float: left;
  clear: both;
}
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper p + p .tertiary,
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper p + p .quaternary {
  margin-bottom: 3px;
  background-color: rgba(255, 255, 255, 0.5);
}
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper p + p .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .simplebanner.twoblocks.contrast_block .wrapper p + p .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_light::before {
  background-color: rgba(0, 0, 0, 0.2);
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_heavy::before {
  background-color: rgba(0, 0, 0, 0.45);
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper h3,
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper > h3 + p,
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper .extra-info .wrapper h4,
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper .extra-info .wrapper p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px;
  background-color: rgba(0, 0, 0, 0.5);
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper p + p {
  float: left;
  clear: both;
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper p + p .tertiary,
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper p + p .quaternary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0, 0.5);
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper p + p .quaternary {
  padding: 5px 10px;
}
.widget-bnl-category .simplebanner.white.twoblocks.contrast_block .wrapper p + p .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper h3,
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper p,
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.tertiary.button,
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.quaternary.button,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper h4,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper ul,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper li,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper p,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper a {
  color: #ffffff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.quaternary.button {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-white.png");
}
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.tertiary.button:hover,
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.tertiary.button:focus {
  text-decoration: underline;
  color: #ffffff;
}
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.quaternary.button:hover,
.widget-bnl-category .simplebanner.white .wrapper .main-info .wrapper a.quaternary.button:focus,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper a:hover,
.widget-bnl-category .simplebanner.white .wrapper .extra-info .wrapper a:focus {
  text-decoration: none;
  color: #ffffff;
}
.widget-bnl-category .simplebanner .wrapper .extra-info {
  float: left;
  width: 40%;
}
.widget-bnl-category .simplebanner .wrapper .extra-info .wrapper {
  margin: 60px 0 52px 20px;
  padding: 13px 20px 8px 20px;/* 13px padding-top to make baselines of headers line out. */
}
.widget-bnl-category .simplebanner.imageless .wrapper .extra-info .wrapper {
  margin: 12px 0 20px 20px;/* 8px less margin-top than .main-info to make baselines of headers line out. */
}
.widget-bnl-category .simplebanner .wrapper .extra-info .wrapper h4 {
  margin-bottom: 10px;
  font-weight: normal;
  line-height: 1.2;
  font-size: 1.5333rem;
}
.widget-bnl-category .simplebanner .wrapper .extra-info .wrapper ul li {
  margin: 0 16px 5px;
}
@media only screen and (min-width: 0) and (max-width: 450px) {
  .widget-bnl-category .simplebanner.overlayed > .wrapper:before {
    display: none;
  }
  .widget-bnl-category .simplebanner.overlayed > .wrapper:after {
    padding-right: 20%;
  }
  .widget-bnl-category .simplebanner.imageless > .wrapper.separator {
    background: none;
  }
  .widget-bnl-category .simplebanner .wrapper .main-info,
  .widget-bnl-category .simplebanner .wrapper .extra-info {
    width: 80%;
  }
  .widget-bnl-category .simplebanner .wrapper .main-info .wrapper,
  .widget-bnl-category .simplebanner .wrapper .extra-info .wrapper {
    margin: 20px 0;
    padding-right: 20px;
    padding-left: 0;
  }
}
/** LINK-LIST **/
.widget-bnl-category .category-page-link-list-wrapper {
  padding: 40px;
}
.widget-bnl-category .category-page-link-list-wrapper h3 {
  text-align: center;
}
.widget-bnl-category .category-page-link-list-wrapper > .link-list {
  overflow: hidden;
}
.widget-bnl-category .category-page-link-list-wrapper > .link-list > li {
  float: left;
  clear: none;
  width: 22%;
  margin-left: 3%;
  padding: 0;
}
.widget-bnl-category .category-page-link-list-wrapper > .link-list > li:nth-of-type(4n+1) {
  clear: left;
}
.widget-bnl-category .category-page-link-list-wrapper > .link-list > li span {
  padding-left: 10px;
}
@media only screen and (min-width: 0) and (max-width: 916px) {
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li:nth-of-type(4n+1) {
    clear: none;
  }
}
@media only screen and (min-width: 744px) and (max-width: 916px) {
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li {
    width: 30%;
  }
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li:nth-of-type(3n+1) {
    clear: left;
  }
}
@media only screen and (min-width: 570px) and (max-width: 743px) {
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li {
    width: 47%;
  }
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li:nth-of-type(2n+1) {
    clear: left;
  }
}
@media only screen and (min-width: 0) and (max-width: 569px) {
  .widget-bnl-category .category-page-link-list-wrapper > .link-list > li {
    width: 96%;
    text-indent: 0;
  }
}
/** ETALAGE (SCROLLABLELIST) **/
.bordered.biebwidget .widget-bnl-category .scrollablelist.section {
  margin: 0 40px 20px 40px;
}
.widget-bnl-category .scrollablelist.section > h3:first-child {
  margin-top: 33px;
  text-align: center;
}
.widget-bnl-category .scrollablelist.section .grid-items,
.widget-bnl-category .scrollablelist.section .rich-items {
  margin-left: 40px;/* Create space for the navigation arrows if this is scrollable. */
}
.widget-bnl-category .scrollablelist.section .grid-items + p,
.widget-bnl-category .scrollablelist.section .rich-items + p {
  margin-left: 40px;
}
.widget-bnl-category .scrollablelist.section .grid-items.narrow {
  margin-left: 30px;/* Makes regular-sized book covers line out on their left edge with other types of lists. */
}
.widget-bnl-category .scrollablelist.section .grid-items.high {
  margin-left: 18px;/* Makes regular-sized book covers line out on their left edge with other types of lists. */
}
.widget-bnl-category .scrollablelist.section .slidingnav button.prev {
  left: -17px;
}
.widget-bnl-category .scrollablelist.section .slidingnav button.next {
  right: -17px;
}
@media only screen and (min-width: 0) and (max-width: 450px) {
  .bordered.biebwidget .widget-bnl-category .scrollablelist.section {
    margin: 0;
  }
  .bordered.biebwidget .widget-bnl-category .scrollablelist.section > h3:first-child {
    padding-right: 40px;
    padding-left: 40px;
  }
  .bordered.biebwidget .widget-bnl-category .scrollablelist.section .highlight {
    margin-right: 40px;
    margin-left: 40px;
  }
}
/** ATMOSPHERIC LIST **/
.widget-bnl-category .atmosphericlist .wrapper {
  position: relative;
  color: #ffffff;
  background-color: #000;
  background-position: -9999px;
  background-repeat: no-repeat;
}
.widget-bnl-category .atmosphericlist .wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 350px;
  background: inherit;
  background-position: left center;
  background-size: cover;
}
.widget-bnl-category .atmosphericlist .wrapper div:first-child {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 120px;
  width: 195px;
  float: left;
  padding: 10px 20px;
  padding-left: 40px;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7) 15%, #000000);
}
.widget-bnl-category .atmosphericlist .wrapper div:first-child h3,
.widget-bnl-category .atmosphericlist .wrapper div:first-child p {
  margin-top: 20px;
}
.widget-bnl-category .atmosphericlist .wrapper div + div {
  margin-left: 355px;
  padding: 5px 20px;
}
.widget-bnl-category .atmosphericlist ul {
  overflow: hidden;
  height: 240px;/* ick; really should be calculated from ems for the caption + fixed height for the covers. */
  margin-top: 0;
  margin-bottom: 5px;
  border-bottom: 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left bottom;
}
.widget-bnl-category .atmosphericlist ul:last-child {
  background-image: none;
}
.widget-bnl-category .atmosphericlist ul li {
  margin-top: 10px;
}
.widget-bnl-category .atmosphericlist h3,
.widget-bnl-category .atmosphericlist a,
.widget-bnl-category .atmosphericlist p {
  color: #ffffff;
}
.widget-bnl-category .atmosphericlist a:hover,
.widget-bnl-category .atmosphericlist a:focus {
  text-decoration: none;
}
.widget-bnl-category .atmosphericlist .grid-items + p {
  margin-top: 5px;
}
.widget-bnl-category .atmosphericlist .button.quaternary {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-white.png");
}
.widget-bnl-category .atmosphericlist .button.quaternary:hover,
.widget-bnl-category .atmosphericlist .button.quaternary:focus {
  text-decoration: none;
  color: #ffffff;
}
@media only screen and (min-width: 0) and (max-width: 899px) {
  .widget-bnl-category .atmosphericlist .wrapper::before {
    content: none;
  }
  .widget-bnl-category .atmosphericlist .wrapper div:first-child {
    position: absolute;
    left: 0;
    padding-left: 20px;
  }
  .widget-bnl-category .atmosphericlist .wrapper div + div {
    margin-left: 215px;
  }
}
@media only screen and (min-width: 0) and (max-width: 770px) {
  .widget-bnl-category .atmosphericlist .wrapper div:first-child {
    position: relative;
    width: auto;
  }
  .widget-bnl-category .atmosphericlist .wrapper div + div {
    margin-left: 0;
  }
}
@media only screen and (min-width: 633px) and (max-width: 652px) {
  .widget-bnl-category .atmosphericlist .grid-items > li {
    margin-right: 10px;
  }
}
/* Moved over from action styling */
.widget-bnl-category .buttonlink.section,
.widget-bnl-category .faq.section,
.widget-bnl-category .paragraph.section,
.widget-bnl-category .sectiontitle.section {
  max-width: 640px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 40px;
  padding-left: 40px;
}
.widget-bnl-category .richtext img.standalone {
  margin-right: auto;
  margin-left: auto;
}
.widget-bnl-category .buttonlink.section,
.widget-bnl-category .paragraph.section,
.widget-bnl-category .sectiontitle.section {
  text-align: center;
}
.widget-bnl-category .paragraph.section span.image ~ p,
.widget-bnl-category .paragraph.section img ~ p,
.widget-bnl-category .paragraph.section span.image ~ ul,
.widget-bnl-category .paragraph.section img ~ ul,
.widget-bnl-category .paragraph.section span.image ~ ol,
.widget-bnl-category .paragraph.section img ~ ol {
  text-align: left;
}
.widget-bnl-category .libraryfinder {
  padding: 0 40px;
}
.widget-bnl-category .libraryfinder h3 {
  margin-bottom: 10px;
  text-align: center;
}
.widget-bnl-category .signpost {
  padding-right: 40px;
  padding-left: 40px;
}
@media only screen and (min-width: 765px) {
  .bordered.biebwidget .widget-bnl-category .libraryfinder.section {
    margin-right: auto;
    margin-left: auto;
  }
  .widget-bnl-category .libraryfinder {
    width: 640px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    padding: 20px 30px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
  }
  .widget-bnl-category .libraryfinder form.generated {
    overflow: hidden;
  }
  .widget-bnl-category .libraryfinder .form-row {
    clear: none;
    float: left;
  }
  .widget-bnl-category .libraryfinder .form-row > label {
    width: auto;
  }
  .widget-bnl-category .libraryfinder #libraryfinder-zoekopdracht {
    width: 260px;
  }
  .widget-bnl-category .libraryfinder .button.submit {
    margin-top: 0;
    margin-right: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 666px) {
  .widget-bnl-category .paragraph.section,
  .widget-bnl-category .sectiontitle.section,
  .widget-bnl-category .libraryfinder h3,
  .widget-bnl-category .scrollablelist.section > h3:first-child,
  .widget-bnl-category .category-page-link-list-wrapper h3 {
    text-align: left;
  }
}
/* Unique "action-page" styling. NOT suitable for basing any further style changes on; purely a one-off for the specific purpose of "gezamelijk inschrijven"! */
.widget-bnl-category.biebwidget-content.action .main-column .head {
  min-height: 200px;
  padding-bottom: 20px;
}
.widget-bnl-category.biebwidget-content.action .main-column .head::before {
  width: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-bottom.png") repeat-x left bottom;
}
.widget-bnl-category.biebwidget-content.action .main-column .head > * {
  float: none;/* Don't float in highcontrast mode. */
  margin-right: auto;
  margin-left: auto;
  padding-right: 20px;
  padding-left: 20px;
  text-align: center;
}
.widget-bnl-category.biebwidget-content.action .main-column .head h2 {
  margin-top: 150px;
}
.widget-bnl-category.biebwidget-content.action h3,
.widget-bnl-category.biebwidget-content.action .comparison p.sellingpoint > .value {
  color: #ff7320;
}
.widget-bnl-category.biebwidget-content.action .white h3 {
  color: #ffffff;
}
.widget-bnl-category.biebwidget-content.action .steps h3,
.widget-bnl-category.biebwidget-content.action .features h3 {
  color: inherit;
}
.widget-bnl-category.biebwidget-content.action .comparison h3 { /* Enough specificity to also catch the .highlight */
  background-color: transparent;
}
.widget-bnl-category.biebwidget-content.action .paragraph.section h3 + p {
  margin-top: 20px;
}
.widget-bnl-category.biebwidget-content.action .actionbanner:not(:empty) {
  margin-top: 60px;
}
.widget-bnl-category.biebwidget-content.action ul.comparison > li {
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
}
.widget-bnl-category.biebwidget-content.action ul.comparison > li.highlight {
  border: 2px solid #ff7320;
  border-radius: 4px;
  box-shadow: 0 0 2px #ff7320;
}
.widget-bnl-category.biebwidget-content.action ul.comparison > li.highlight::after {
  margin-left: -2px;
  border: 2px solid #ff7320;
  border-top: 0;
  border-radius: 0 0 4px 4px;
  box-shadow: 3px 2px 2px -2px rgba(255, 115, 32, 0.5), -3px 2px 2px -2px rgba(255, 115, 32, 0.5), 0 5px 0 2px #ffffff;
}
.widget-bnl-category.biebwidget-content.action ul.comparison > li.highlight h3 {
  color: #ff7320;
}
.widget-bnl-category.biebwidget-content.action ul.comparison > li::after {
  height: 4px;/* Space for the border-radius, and for something to remain of the box-shadow after the -2px contraction. */
  margin-bottom: 2px;/* Space for the box-shadow. */
  margin-left: -1px;/* Make this line out with the left border of the li. */
  border: 1px solid #ccc;/* Solid so it doesn't multiply with the underlying border. */
  border-top: 0;
  border-radius: 0 0 3px 3px;
  box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 3px 0 3px #ffffff;/* The real box-shadow layered over solid white, which obscures the bottom of the left border of the li (otherwise visible due to the border-radius). */
}
.widget-bnl-category.biebwidget-content.action .libraryfinder {
  margin-bottom: 40px;
}
.widget-bnl-category.biebwidget-content.action .buttonlink.section .button.quaternary,
.widget-bnl-category.biebwidget-content.action .buttonlink.section .button.tertiary {
  position: absolute;
  top: 0;
  left: 40px;
}
.widget-bnl-category.biebwidget-content.action .buttonlink.section .primary.button { /* Primary importance button: there should be only one of these per page */
  font-size: 1.725rem;
}
.bordered.biebwidget .widget-bnl-category.biebwidget-content.action .libraryfinder.section,
.bordered.biebwidget .widget-bnl-category.biebwidget-content.action .scrollableimagebanner.section:not(:first-child),
.bordered.biebwidget .widget-bnl-category.biebwidget-content.action .paragraph.section h3,
.bordered.biebwidget .widget-bnl-category.biebwidget-content.action .sectiontitle.section h3 {
  margin-top: 40px;
}
.bordered.biebwidget .widget-bnl-category.biebwidget-content.action .buttonlink.section {
  position: relative;
  margin-top: 13px;
  margin-bottom: 40px;
  padding-top: 40px;
}
@media only screen and (min-width: 711px) {
  .widget-bnl-category.biebwidget-content.action ol.steps > li {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
  }
  .widget-bnl-category.biebwidget-content.action ol.steps > li::after {
    height: 4px;/* Space for the border-radius, and for something to remain of the box-shadow after the -2px contraction. */
    margin-bottom: 2px;/* Space for the box-shadow. */
    margin-left: -1px;/* Make this line out with the left border of the li. */
    border: 1px solid #ccc;/* Solid so it doesn't multiply with the underlying border. */
    border-top: 0;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.15), 0 3px 0 3px #ffffff;/* The real box-shadow layered over solid white, which obscures the bottom of the left border of the li (otherwise visible due to the border-radius). */
  }
}
.actionbanner > .actionbanner {
  position: relative;
}
.actionbanner > .actionbanner:not(:empty) {
  margin-top: 40px;
  margin-bottom: 20px;
  padding-top: 25px;
  padding-bottom: 30px;
  background-color: #efefef;
}
.actionbanner > .actionbanner .imagewrapper {
  position: absolute;
  bottom: 0;
  width: 34%;
  height: 100%;
}
.actionbanner > .actionbanner .imagewrapper > .image {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
.actionbanner > .actionbanner .imagewrapper > .image img {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  margin: auto auto auto 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.actionbanner > .actionbanner .imagewrapper > .image img.center {
  margin: auto auto;
  padding-left: 40px;
}
.actionbanner > .actionbanner .imagewrapper > .image img.right {
  margin: auto 0 auto auto;
  padding-left: 40px;
}
.actionbanner > .actionbanner h3,
.actionbanner > .actionbanner p {
  margin-left: 34%;
  margin-right: 23%;
  padding-left: 40px;
}
@media only screen and (max-width: 710px) {
  .actionbanner > .actionbanner h3,
  .actionbanner > .actionbanner p {
    padding-right: 20px;
    padding-left: 20px;
    margin-right: 0;
  }
  .actionbanner > .actionbanner .imagewrapper > .image img.center {
    padding-left: 20px;
  }
  .actionbanner > .actionbanner .imagewrapper > .image img.right {
    padding-left: 20px;
  }
}
@media only screen and (min-width: 0) and (max-width: 469px) {
  .actionbanner > .actionbanner .imagewrapper {
    top: 20px;
    width: 100%;
    height: 150px;
  }
  .actionbanner > .actionbanner .imagewrapper > .image img {
    height: auto;
    width: auto;
    padding-right: 20px;
  }
  .actionbanner > .actionbanner h3:first-child,
  .actionbanner > .actionbanner p:first-child {
    margin-top: 188px;/*20 (top margin) + 150 (height) + 18(margin to h3 or p)*/
  }
  .actionbanner > .actionbanner h3,
  .actionbanner > .actionbanner p {
    margin-left: 0;
  }
}
.articlehighlighted {
  position: relative;
}
.articlehighlighted .wrapper {
  min-height: 300px;
  background-color: #595959;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
.articlehighlighted .backgroundImage {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: right center;
}
.articlehighlighted .backgroundImage::before {
  content: "";
  display: inline-block;
  height: 100%;
  width: 100%;
}
.articlehighlighted div.article_highlighted_text {
  position: relative;
}
.articlehighlighted span.imgwrapper {
  float: right;
  height: auto;
  width: calc(50% - 25px);
  max-width: 384px;
  max-height: 384px;
  padding-left: 40px;
  overflow: hidden;
}
.articlehighlighted span.imgwrapper img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.articlehighlighted > div.hasBackgroundImage div.article_highlighted_text {
  width: 100%;
  padding: 0;
}
.articlehighlighted > div.hasBackgroundImage div.content {
  width: 50%;
  padding: 40px 40px;
  min-height: 220px;
}
.articlehighlighted > div.hasBackgroundImage div.content:not(.contrast_block):not(.contrast_none):not(.contrast_light):not(.contrast_heavy) {
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.4) 30%, rgba(0, 0, 0, 0.3) 90%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.4) 30%, rgba(0, 0, 0, 0.3) 90%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(to right, rgba(0, 0, 0, 0.4) 30%, rgba(0, 0, 0, 0.3) 90%, rgba(0, 0, 0, 0) 100%);
}
.articlehighlighted > div.hasBackgroundImage div.content.contrast_light {
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.3) 30%, rgba(0, 0, 0, 0.2) 90%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 30%, rgba(0, 0, 0, 0.2) 90%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(to right, rgba(0, 0, 0, 0.3) 30%, rgba(0, 0, 0, 0.2) 90%, rgba(0, 0, 0, 0) 100%);
}
.articlehighlighted > div.hasBackgroundImage div.content.contrast_heavy {
  padding-right: 80px;
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.6) 86%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.6) 86%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(to right, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.6) 86%, rgba(0, 0, 0, 0) 100%);
}
.articlehighlighted > div.hasBackgroundImage div.content.contrast_block h3,
.articlehighlighted > div.hasBackgroundImage div.content.contrast_block h3 + p {
  float: left;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0, 0.5);
}
.articlehighlighted > div.hasBackgroundImage div.content.contrast_block p + p {
  float: left;
}
.articlehighlighted > div.hasBackgroundImage div.content.contrast_block p + p .quaternary,
.articlehighlighted > div.hasBackgroundImage div.content.contrast_block p + p .tertiary {
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0, 0.5);
}
.articlehighlighted > div > div.article_highlighted_text {
  padding: 40px;
}
.articlehighlighted > div > div.article_highlighted_text div.content > h3 {
  font-size: 3.45rem;
}
.articlehighlighted > div > div.article_highlighted_text div.content > p {
  padding: 20px 0;
}
.articlehighlighted > div > div.article_highlighted_text div.content > h3 a,
.articlehighlighted > div > div.article_highlighted_text div.content > p,
.articlehighlighted > div > div.article_highlighted_text div.content .tertiary,
.articlehighlighted > div > div.article_highlighted_text div.content .quaternary {
  color: #ffffff;
}
.articlehighlighted > div > div.article_highlighted_text div.content > h3 a:hover,
.articlehighlighted > div > div.article_highlighted_text div.content .tertiary:hover,
.articlehighlighted > div > div.article_highlighted_text div.content .quaternary:hover {
  text-decoration: none;
}
.articlehighlighted > div > div.article_highlighted_text div.content .button {
  margin-left: 0;
}
.articlehighlighted > div > div.article_highlighted_text div.content .quaternary {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAPUlEQVQI12P4//9/BxQzwDCIOPMfAmYiCwoiSYBoF5gWkMRuqMQ7mMAqmAAQGzNAGf+hKgVhZoJUpSHbDgCyvnhVII5begAAAABJRU5ErkJggg==");
}
.articlehighlighted > div > div.article_highlighted_text::after {
  content: "";
  display: block;
  clear: both;
}
@media only screen and (max-width: 750px) {
  .articlehighlighted .hasBackgroundImage div.article_highlighted_text div.content {
    width: calc(100% - 80px);
    padding-right: 40px;
  }
  .articlehighlighted div.article_highlighted_text div.content span.imgwrapper {
    display: block;
    float: none;
    width: 100%;
    padding: 0;
  }
}
.combocollection .widget-bnl-combo.bordered p,
.biebwidget.bordered .widget-bnl-combo p,
.combocollection .widget-bnl-combo.bordered ul,
.biebwidget.bordered .widget-bnl-combo ul,
.combocollection .widget-bnl-combo.bordered ol,
.biebwidget.bordered .widget-bnl-combo ol {
  margin-right: 20px;
  margin-left: 20px;
}
.combocollection .widget-bnl-combo.bordered ul.slidingitems,
.biebwidget.bordered .widget-bnl-combo ul.slidingitems,
.combocollection .widget-bnl-combo.bordered ul p,
.biebwidget.bordered .widget-bnl-combo ul p,
.combocollection .widget-bnl-combo.bordered ol p,
.biebwidget.bordered .widget-bnl-combo ol p {
  margin-right: 0;
  margin-left: 0;
}
.combocollection .widget-bnl-combo .section ~ p.section,
.widget-bnl-combo .section ~ p.section,
.combocollection .widget-bnl-combo .section ~ .section p,
.widget-bnl-combo .section ~ .section p,
.combocollection .widget-bnl-combo .section ~ .section ul,
.widget-bnl-combo .section ~ .section ul,
.combocollection .widget-bnl-combo .section ~ .section ol,
.widget-bnl-combo .section ~ .section ol,
.combocollection .widget-bnl-combo .section ~ .section iframe,
.widget-bnl-combo .section ~ .section iframe,
.combocollection .widget-bnl-combo .section ~ .section img,
.widget-bnl-combo .section ~ .section img,
.combocollection .widget-bnl-combo .section ~ .section.video,
.widget-bnl-combo .section ~ .section.video,
.combocollection .widget-bnl-combo .section ~ .section ul p + p,
.widget-bnl-combo .section ~ .section ul p + p,
.combocollection .widget-bnl-combo .section ~ .section ol p + p,
.widget-bnl-combo .section ~ .section ol p + p,
.combocollection .widget-bnl-combo .section ~ .section ul p.separate,
.widget-bnl-combo .section ~ .section ul p.separate,
.combocollection .widget-bnl-combo .section ~ .section ol p.separate,
.widget-bnl-combo .section ~ .section ol p.separate {
  margin-top: 13px;
}
.combocollection .widget-bnl-combo .section ~ .section.video iframe,
.widget-bnl-combo .section ~ .section.video iframe,
.combocollection .widget-bnl-combo .section ~ .section ul img,
.widget-bnl-combo .section ~ .section ul img,
.combocollection .widget-bnl-combo .section ~ .section ol img,
.widget-bnl-combo .section ~ .section ol img,
.combocollection .widget-bnl-combo .section ~ .section ul p,
.widget-bnl-combo .section ~ .section ul p,
.combocollection .widget-bnl-combo .section ~ .section ol p,
.widget-bnl-combo .section ~ .section ol p {
  margin-top: 0;
}
.combocollection .widget-bnl-combo.bordered .section:last-child,
.biebwidget.bordered .widget-bnl-combo .section:last-child {
  margin-bottom: 20px;
}
.combocollection .widget-bnl-combo.bordered .image.section:last-child,
.biebwidget.bordered .widget-bnl-combo .image.section:last-child {
  margin-bottom: 0;
}
.combocollection .widget-bnl-combo .section.manuallist .rich-items,
.widget-bnl-combo .section.manuallist .rich-items {
  border-bottom: 1px solid #d0d0d0;
}
.combocollection .widget-bnl-combo .section.manuallist:last-child .rich-items,
.widget-bnl-combo .section.manuallist:last-child .rich-items {
  border-bottom: 0;
}
.combocollection .widget-bnl-combo .section.manuallist .rich-items .viz,
.widget-bnl-combo .section.manuallist .rich-items .viz {
  margin-left: -100%;
}
.combocollection .widget-bnl-combo .section.manuallist .rich-items img,
.widget-bnl-combo .section.manuallist .rich-items img {
  margin-top: 4px;
}
.combocollection .widget-bnl-combo .section.manuallist .rich-items > li:last-child img,
.widget-bnl-combo .section.manuallist .rich-items > li:last-child img {
  margin-bottom: 5px;
}
.combocollection .widget-bnl-combo .section.manuallist:last-child .rich-items > li:last-child img,
.widget-bnl-combo .section.manuallist:last-child .rich-items > li:last-child img {
  margin-bottom: 0;
}
.combocollection .widget-bnl-combo.bordered ul.rotatingitems.interactive > li,
.biebwidget.bordered .widget-bnl-combo ul.rotatingitems.interactive > li {
  padding: 0 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.combocollection {
  padding: 40px 40px 0 40px;
}
.combocollection > .container {
  display: block;
}
.combocollection > .container > .column {
  display: inline-block;
  position: relative;
  overflow: hidden;/* Necessary for the rotating images and slideshow. */
  width: 28%;
  width: calc(33% - 27px);/* subtract spacing between columns (slightly more, due to the way border-box is calculated?) */
  margin-bottom: 40px;
  vertical-align: top;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.combocollection > .container > .column > h3 {
  margin: 15px 20px 10px 20px;
}
.combocollection > .container > .column .widget-bnl-combo:not(.bordered) {
  padding: 0 20px 20px 20px;
}
.combocollection > .container > .column .richtext.section {
  margin-left: 0;
  margin-right: 0;
}
.combocollection > .container > .column > .image {
  display: block;
  height: 250px;
  margin: 0 20px 20px 20px;
  background-position: center;
  background-size: cover;
}
.combocollection > .container.equal > .column {
  width: 47%;
  width: calc(50% - 45px);/* subtract spacing between columns (slightly more, due to the way border-box is calculated?) */
}
.combocollection > .container.twothirds > .column-1,
.combocollection > .container.onethird > .column-2 {
  width: 62%;
  width: calc(65% - 45px);/* subtract spacing between columns (slightly more, due to the way border-box is calculated?) */
}
.combocollection > .container.twothirds > .column-2,
.combocollection > .container.onethird > .column-1 {
  width: 35%;
}
.combocollection > .container .column-1 {
  margin-right: 40px;
}
.combocollection > .container .column-3 {
  margin-left: 40px;
}
/* clearfix after floats */
.combocollection > .container::after {
  content: "";
  display: block;
  clear: both;
}
@media only screen and (min-width: 0) and (max-width: 960px) {
  .combocollection .container.size-3 > .column {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 800px) {
  .combocollection .container > .column.column-1,
  .combocollection .container > .column.column-2,
  .combocollection .container > .column.column-3 {
    width: 100%;
  }
}
@media only screen and (min-width: 0) and (max-width: 450px) {
  .combocollection {
    padding-right: 20px;/* Straight 0 would be more useful, but all other category page elements still have 40px white-space total, so consistency trumps for now. */
    padding-left: 20px;
  }
  .combocollection > .container > .column {
    box-shadow: none;
  }
}
ul.comparison {
  position: relative;
  overflow: hidden;
  margin: 13px 20px;
  text-align: center;
}
ul.comparison > li {
  display: inline-block;
  width: 300px;
  margin: 13px 5px -90.5em 5px;/* 4em space for the button, with needs to be aligned, and so is absolutely positioned. */
  border: 1px solid #dfdfdf;
  padding-bottom: 100em;/* Equal heights columns; rewrite with flexbox once we can drop support for IE9. */
  vertical-align: top;
  text-align: left;
}
ul.comparison > li.highlight,
ul.comparison > li.highlight::after {
  border-color: #ff7320;
}
ul.comparison > li::after { /* Draw the border-bottom, since the real one is way out of sight due to equal height columns. */
  content: "";
  position: absolute;
  bottom: 0;
  width: 300px;
  border-bottom: 1px solid #dfdfdf;
}
ul.comparison h3 {
  padding: 10px 15px;
  text-align: center;
  background-color: #dfdfdf;
}
ul.comparison li.highlight h3 {
  background-color: #ff7320;
  color: #ffffff;
}
ul.comparison p.richtext {
  margin: 13px 15px;
  text-align: center;
}
ul.comparison ul > li {
  margin: 8px 15px 5px 25px;
  list-style: disc outside;
}
ul.comparison p.sellingpoint {
  position: absolute;
  bottom: 3.85em;
  width: 270px;
}
ul.comparison p.sellingpoint > .value {
  display: inline-block;
  padding: 0 3px;
  font-size: 2.3rem;
}
ul.comparison p.action {
  position: absolute;
  bottom: 10px;
  width: 270px;
  margin-right: 15px;
  margin-left: 15px;
  text-align: center;
}
ul.comparison p.sellingpoint ~ p.action {
  padding-top: 1em;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
@media only screen and (min-width: 871px) and (max-width: 1025px) {
  ul.comparison > li,
  ul.comparison > li::after {
    width: 250px;
  }
  ul.comparison p.sellingpoint,
  ul.comparison p.action {
    width: 220px;
  }
}
@media only screen and (min-width: 711px) and (max-width: 870px) {
  ul.comparison > li,
  ul.comparison > li::after {
    width: 200px;
  }
  ul.comparison p.sellingpoint,
  ul.comparison p.action {
    width: 170px;
  }
  ul.comparison h3 {
    padding-right: 10px;
    padding-left: 10px;
  }
  ul.comparison p.richtext,
  ul.comparison p.action {
    margin-right: 10px;
    margin-left: 10px;
  }
  ul.comparison ul > li {
    margin-right: 10px;
    margin-left: 20px;
  }
}
@media only screen and (max-width: 710px) {
  ul.comparison {
    margin-right: 0;
    margin-left: 0;
  }
  ul.comparison > li {
    margin-bottom: 13px;
    padding-bottom: 0;
  }
  ul.comparison > li::after {
    display: none;
  }
  ul.comparison p.sellingpoint,
  ul.comparison p.action {
    position: static;
    bottom: auto;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
.coverflow {
  position: relative;
  min-height: 230px;
  margin: 0;
}
.coverflow.static {
  /*
	 * In static version we show only the item details (if present), in
	 * interactive mode we show the container with covers.
	 */
  position: static;
}
.coverflow.static.withdetails .coverflow-container {
  display: none;
}
.coverflow.static .coverflow-container {
  padding: 10px 5px 20px 20px;
}
.coverflow.static .coverflow-container li.cover > a {
  min-height: 195px;
  float: left;
  margin: 0 15px 15px 0;
}
.coverflow.static .coverflow-details-container {
  margin-top: 20px;
}
.coverflow.interactive .coverflow-container {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.coverflow.interactive .coverflow-container li.cover > a {
  display: block;
}
.coverflow.interactive .coverflow-container > a {
  -webkit-transition-delay: 0.00s;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-property: width, height, top, left;
  -webkit-transition-timing-function: cubic-bezier(.02, .01, .47, 1);
  -o-transition-delay: 0.00s;
  -o-transition-duration: 0.3s;
  -o-transition-property: width, height, top, left;
  -o-transition-timing-function: cubic-bezier(.02, .01, .47, 1);
  transition-delay: 0.00s;
  transition-duration: 0.3s;
  transition-property: width, height, top, left;
  transition-timing-function: cubic-bezier(.02, .01, .47, 1);
}
.coverflow.interactive .coverflow-container img.cover {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.coverflow.interactive h2,
.coverflow.interactive .coverflow-details-container {
  display: none;
}
.coverflow.interactive .coverflow-info {
  position: absolute;
  width: 25px;
  height: 25px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/coverflow-info.png");
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 30;
}
.coverflow.interactive .coverflow-info.coverflow-close {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/coverflow-close.png");
}
.coverflow.interactive .content {
  margin: 10px 160px 10px 10px;
  padding: 0 10px 20px 10px;
}
.coverflow.interactive .content p {
  max-height: 100px;/* Guard against very long descriptions; sadly has to be in px, since this is absolutely positioned. */
  overflow: hidden;
}
.coverflow.interactive img.cover {
  max-width: 100%;
  max-height: 100%;
  margin: 0;
}
.coverflow .coverflow-container li.cover {
  margin: 0 5px;
}
.coverflow > button.prev,
.coverflow > button.next {
  position: absolute;
  bottom: 94px;
  display: block;
  width: 14px;
  height: 22px;
  margin: 0 10px;
  border: 0;
  padding: 10px;
  text-indent: -9999em;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center center;
  background-color: transparent;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.coverflow > button.prev {
  left: 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-larger.png");
}
.coverflow > button.prev:hover,
.coverflow > button.prev:focus {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAWCAYAAADwza0nAAADZGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAwRTdDOTE0NTBGQUUwMTE5RUJDRTNGRkY2NDVCODYxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjBEQTVGM0U4RkE1QjExRTBCQ0FBQzJGMEVBRkE3MUIwIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjBEQTVGM0U3RkE1QjExRTBCQ0FBQzJGMEVBRkE3MUIwIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgV2luZG93cyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjE0NzgyQTBFNTlGQUUwMTE5RUJDRTNGRkY2NDVCODYxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwRTdDOTE0NTBGQUUwMTE5RUJDRTNGRkY2NDVCODYxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+6jurdwAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADGSURBVDjLndSxCsIwEMbxPEoGN5cDZ8HNN3A+cHEXHFzM4uTsKPiG9wjnl9rSkuZy1eEHpe2fNmmToKrBdY47SL2Yz/nR+8SgEwLUjl5HBq1IdvQ8MKjBCB97BjUIxHl03zKoQYDmk3PbMKhBgIZ7x+i6ZlCDAE0f8j24rBjUIEDlkPLHJVCDdNcrExj6v+GnyAszboWtVzXj4SdmJ6Z66Mez8ZbLZ3FcW3uLYmvhenFsrfpWnLwtg/8L63E3zrBws6Jys/oAhJc8KXTyTbgAAAAASUVORK5CYII=");
}
.coverflow > button.prev.passive {
  cursor: default;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev-larger-passive.png");
}
.coverflow > button.next {
  right: 0;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-larger.png");
}
.coverflow > button.next:hover,
.coverflow > button.next:focus {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAWCAYAAADwza0nAAADZGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjAwRTdDOTE0NTBGQUUwMTE5RUJDRTNGRkY2NDVCODYxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjA0OUFFODhBRkE1QjExRTBCNjMwQTlBNUZBQTg1MDFDIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjA0OUFFODg5RkE1QjExRTBCNjMwQTlBNUZBQTg1MDFDIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgV2luZG93cyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjE0NzgyQTBFNTlGQUUwMTE5RUJDRTNGRkY2NDVCODYxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwRTdDOTE0NTBGQUUwMTE5RUJDRTNGRkY2NDVCODYxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+nx/KIwAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAC9SURBVDjLndQ9CgIxEIbhPcoWdjYD1oKdN7AesLEXLGxMY2VtKXjDOcLnF6MoOJNsLB5YFl42m78BwID9OFJ6WT3fNQy474SM8EXb4W2bCA6th9dNIgQ0Di/rkYwQUD/MD+elkBEC6ofZaSFkhID6YXacCxkhoH6YHWZCRgioH5YNIWSEgMSLXI9TLdTKF9M/UTDUMsRa5ExOe1Kc5eiIPmFnVMJyiLuid5h6o1bYOMj+/024On4vK5lyWT0AZr08KUh6skwAAAAASUVORK5CYII=");
}
.coverflow > button.next.passive {
  cursor: default;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-larger-passive.png");
}
/* More than one coverflow. */
.coverflows.interactive > li {
  display: none;
}
.coverflows.interactive > li.current {
  display: block;
}
/* Selecting out of a list of more than one coverflow */
.listselection {
  position: relative;
  overflow: hidden;
  min-height: 1.5em;
  margin: 0;
  border-radius: 3px;
  padding: 0;
  background-color: #ffffff;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}
.listselection.interactive {
  padding-right: 25px;
}
.listselection button {
  border: 0;
  padding: 0;
}
.listselection > ul.active {
  background-color: #ffffff;
}
.listselection > ul > li {
  border-right: 1px solid #d0d0d0;
}
.listselection > ul > li > button {
  margin: 0 10px;
  line-height: 1.625;
}
.listselection > ul > li > button:not([disabled]):hover,
.listselection > ul > li > button:not([disabled]):focus {
  text-decoration: underline;
}
.listselection > ul > li.current > button {
  color: #ff7320;
}
.listselection.static > ul > li:last-child {
  border-right: 0;
}
.listselection .toggle {
  border-radius: 0 1px 1px 0;
  background-color: #ffffff;
}
.listselection .toggle.active,
.listselection .toggle:hover,
.listselection .toggle:focus {
  background-color: #ff7320;
}
.listselection .toggle button {
  width: 25px;
}
.listselection button {
  font: inherit;
  white-space: nowrap;
  background-color: transparent;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.listselection button.passive {
  cursor: auto;
}
.listselection > ul.active {
  overflow: auto;
}
.listselection > ul > li {
  float: left;
}
.listselection.interactive > ul > li {
  display: none;
}
.listselection.interactive > ul.active > li,
.listselection.interactive > ul > li.current {
  display: block;
}
.listselection.interactive > ul > li.current > button {
  display: inline;
  cursor: default;
}
.listselection .toggle {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
}
.listselection .toggle button {
  display: block;
  text-indent: -9999em;
  height: 100%;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAZElEQVQY02P4//8/Awy/SuUtBeIPQCyNzkdWVA3E/4H4JBBzovNhiuqggmeAmB+dD1IDUsQMxN+A+A8Qq6PzYTbCTMyEmnAJiEXR+XCFUMX5UMnzQMyGzmdA83UOED+HmYLMBwCs65jvNXeWyQAAAABJRU5ErkJggg==");
  background-repeat: no-repeat;
  background-position: center center;
}
.listselection .toggle.active button,
.listselection .toggle:hover button,
.listselection .toggle:focus button {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAXklEQVQY02P4//8/AxIuBeIPQCyNzkdWVP0fAk4CMSc6H6aoDip4Boj5sfAZQIqYgfgbEP8BYnUsfAaYQhDOhJpwCYhFsfAZkN2YD5U8D8Rs6HwGNF/nAPFzmCnIfAB+oO2j6ioUHQAAAABJRU5ErkJggg==");
}
h2 + .listselection {
  margin-left: 150px;
}
/* Specific for the schatkamer, rather than for the generic coverflow: */
.widget-bnl-schatkamer {
  position: relative;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/schatkamer-bg.png");
  background-repeat: repeat-x;
  background-position: center top;
  background-color: #d0d0d0;
}
.bordered.biebwidget .widget-bnl-schatkamer > h2:first-child {
  position: absolute;
  margin-top: 0;
  color: #505450;
}
.widget-bnl-schatkamer .listselection {
  position: absolute;
  top: 15px;
  right: 18px;
  z-index: 89;
}
.widget-bnl-schatkamer .coverflow {
  margin-top: 3em;
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .coverflow.interactive .content {
    margin: 10px 10px 10px 10px;
  }
  .coverflow.interactive .coverflow-container a.active img {
    display: none;
  }
}
.curvedbanner {
  background-position: right center;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
.curvedbanner > .details {
  margin-right: 287px;
  padding-right: 89px;
}
.curvedbanner > .details {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/curve.png");
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 90px 100%;
}
.curvedbanner > .details > .inner {
  min-height: 230px;
  padding: 0 20px 20px 20px;
  background-color: #ffffff;
}
.curvedbanner h2 {
  padding: 20px 0 10px 0;
  font-weight: normal;
  color: #ff7320;
  font-size: 1.725rem;
}
.curvedbanner .inner > p {
  margin-right: 20px;
  margin-bottom: 20px;
}
.curvedbanner .primary.button,
.curvedbanner .secondary.button {
  margin-left: 0;
}
ul.tabs.alt + ul .curvedbanner h2 {
  padding-top: 15px;
  color: #505450;
}
/* 1-column layout: reposition the image and use a different curve. Mirrored in adaptive.less for screen widths < 635px. */
.biebwidget-column  .curvedbanner {
  padding-top: 113px;
  background-position: center -30px;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.biebwidget-column  .curvedbanner > .details {
  margin-right: 0;
  padding-top: 47px;
  padding-right: 0;
}
.biebwidget-column  .curvedbanner > .details {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/curve-horizontal.png");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% 47px;
}
.biebwidget-column  .curvedbanner > .details > .inner,
.biebwidget-column  ul > li .curvedbanner > .details > .inner { /* One-tab doesn't have ul/li; higher specificity version necessary for multiple tabs. */
  min-height: 0;
  padding: 0 20px 20px 20px;
}
@media only screen and (min-width: 917px) and (max-width: 1025px) {
  /* 3-column layout with narrower columns: 284px for the image rather than 384px. */
  .curvedbanner > .details {
    margin-right: 199px;
  }
}
@media only screen and (min-width: 635px) and (max-width: 799px) {
  /* 2-column layout with narrower columns: 284px for the image rather than 384px. */
  .curvedbanner > .details {
    margin-right: 199px;
  }
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  /* 1-column layout: reposition the image and use a different curve. Mirroring the .biebwidget-column scope. */
  .curvedbanner {
    padding-top: 113px;
    background-position: center -30px;
    background-repeat: no-repeat;
    background-size: 100% auto;
  }
  .curvedbanner > .details {
    margin-right: 0;
    padding-top: 47px;
    padding-right: 0;
  }
  .curvedbanner > .details {
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/curve-horizontal.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100% 47px;
  }
  .curvedbanner > .details > .inner {
    min-height: 0;
    padding: 0 20px 20px 20px;
    background-color: #ffffff;
  }
}
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext ul.features,
.biebwidget-content.widget-bnl-support .main-column-wrapper:not(.nav) .richtext ul.features {
  max-width: none;
}
.biebwidget-content.detail .main-column-wrapper.nav ul.features li,
.biebwidget-content.widget-bnl-support .main-column-wrapper ul.features li {
  margin: 10px 2%;
}
.feature {
  clear: both;
}
.feature h3 {
  text-align: center;
}
ul.features {
  margin: 13px 3%;
  text-align: center;
  clear: both;
}
ul.features > li {
  display: inline-block;
  width: 27%;
  max-width: 384px;
  min-width: 200px;
  margin: 13px 3%;
  vertical-align: top;
}
ul.features.narrow > li {
  width: 43%;
}
ul.features img {
  max-width: 200px;
  max-height: 100px;
  margin-bottom: 8px;
  float: none;
}
ul.features h3 + .richtext,
ul.features h4 + .richtext {
  margin-top: 8px;
}
ul.features h3 > .image:only-child > img,
ul.features h4 > .image:only-child > img {
  margin-bottom: 0;
}
/* Get-it */
.audioplayer .bordered,
.get-it.bordered {
  display: block;
  overflow: hidden;
  margin-top: 20px;
  margin-bottom: 20px;
  border: 1px solid #d0d0d0;
  border-radius: 10px;
  padding: 15px 20px;
  background-color: #f5f5f5;
}
.get-it p.label {
  float: left;
  display: inline;
  margin-top: 5px;
  margin-right: 5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.5333rem;
}
.get-it p.action {
  float: right;
  margin-top: -5px;
  text-align: right;
}
.get-it p.action ~ p.action {
  margin-top: 8px;
}
.get-it p.action + p:not(.label),
.get-it p.action + p:not(.label) + p:not(.label) {
  clear: left;
  float: left;
  margin-top: 5px;
}
.get-it.rich-items > li {
  position: relative;
}
.get-it.bordered.rich-items h3,
.get-it.bordered.rich-items h4 {
  display: inline;
}
.get-it.rich-items h3,
.get-it.rich-items h4 {
  margin-top: 5px;
  padding-right: 8em;
}
.get-it.rich-items p.action {
  position: absolute;
  right: 0;
  top: 0;
  float: none;
  margin: 0;
}
.get-it.rich-items > li:first-child p.action {
  margin-top: -7px;
}
.get-it.rich-items > li:not(:first-child) p.action {
  padding-top: 10px;
}
.get-it.bordered ~ .rich-items.get-it p.action {
  padding-right: 21px;
}
@media only screen and (min-width: 751px) and (max-width: 799px) {
  .audioplayer .bordered,
  .get-it.bordered {
    display: block;
  }
  .get-it.bordered p.action a {
    margin-left: 0;
  }
  .get-it.bordered p.label,
  .get-it.bordered p.action {
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
    text-align: left;
  }
  .get-it.bordered ~ .rich-items.get-it p.action {
    padding-right: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 469px) {
  .audioplayer .bordered,
  .get-it.bordered {
    display: block;
  }
  .get-it.bordered p.action a {
    margin-left: 0;
  }
  .get-it.bordered p.label,
  .get-it.bordered p.action {
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
    text-align: left;
  }
  .get-it.bordered ~ .rich-items.get-it p.action {
    padding-right: 0;
  }
}
.richtext img.standalone {
  display: block;
  float: none;
  clear: both;
  width: 100%;
  max-width: 640px;
  max-height: 1024px;
  margin-right: 0;
}
.richtext img.standalone.detail {
  max-width: 792px;
  margin-right: auto;
  margin-bottom: 12px;
  margin-left: auto;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.image-small,
.image img.standalone.image-small {
  max-width: 384px;
  max-height: 614px;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.image-medium,
.image img.standalone.image-medium {
  max-width: 640px;
  max-height: 1024px;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.image-large,
.image img.standalone.image-large {
  max-width: 100%;
  max-height: 2048px;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.left,
.image img.standalone.left {
  margin-left: 0;
  margin-right: auto;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.right,
.image img.standalone.right {
  margin-left: auto;
  margin-right: 0;
}
.biebwidget-content.detail .main-column-wrapper .richtext .image img.standalone.center,
.image img.standalone.center {
  margin-left: auto;
  margin-right: auto;
}
.sectioned.maintext.richtext .section + .image.section > img.standalone,
.richtext .sectioned.maintext .section + .image.section > img.standalone {
  margin-top: 19px;/* Maintain the white-space between paragraphs as well. */
}
.biebwidget-content.detail .main-column-wrapper:not(.nav) .richtext img.standalone {
  margin-right: auto;
  margin-left: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.message {
  position: relative;
  margin: 20px 0;
  border: 1px solid #d0d0d0;
  padding: 15px 20px;
  background-repeat: no-repeat;
  background-position: 10px center;
  background-color: #f5f5f5;
}
.message.critical {
  border-color: #b6be00;
  background-color: #f5f5f5;
}
.message.info.critical::before,
.message.alert.critical::before {
  content: "";
  display: block;
  position: absolute;
  width: 53px;
  height: 100%;
  top: 0;
  left: 0;
}
.message.info {
  border-color: #0071bc;
  background-color: #f5f5f5;
}
.message.info.critical {
  padding-left: 73px;
  border-color: #0071bc;
  background-color: #f5f5f5;
}
.message.info.critical::before {
  background: #0071bc url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/letter-i.png") no-repeat center;
}
.message.alert {
  border-color: #ff5f00;
  background-color: #f5f5f5;
}
.message.alert.critical {
  padding-left: 73px;
  border-color: #ff0000;
  background-color: #f5f5f5;
}
.message.alert.critical::before {
  background: #ff0000 url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/exclamation-mark.png") no-repeat center;
}
.message > h3:first-child {
  margin-bottom: 1em;
  font-size: 1.5333rem;
}
.message > p:first-child {
  font-size: 1.5333rem;
}
.biebwidget  .nbcitemhighlighted {
  position: relative;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
.biebwidget  .nbcitemhighlighted .backgroundImage {
  position: absolute;
  height: 100%;
  width: 50%;
  z-index: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: right center;
}
.biebwidget  .nbcitemhighlighted .backgroundImage::before {
  content: "";
  display: inline-block;
  height: 100%;
  width: 100%;
}
.biebwidget  .nbcitemhighlighted div.article_highlighted_text {
  position: relative;
}
.biebwidget  .nbcitemhighlighted .left .backgroundImage {
  right: 0;
}
.biebwidget  .nbcitemhighlighted .left div.article_highlighted_text > div.content {
  width: calc(62% - 45px);
}
.biebwidget  .nbcitemhighlighted .left > div.content .button {
  margin-left: 0;
}
.biebwidget  .nbcitemhighlighted .right .backgroundImage {
  left: 0;
}
.biebwidget  .nbcitemhighlighted .right div.article_highlighted_text > div.content {
  margin-left: 40.5%;
  width: calc(62% - 45px);
}
.biebwidget  .nbcitemhighlighted .right div.article_highlighted_text > div.content .button {
  margin-left: 0;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text {
  padding: 40px;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content {
  float: left;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper > h3 a,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content > h3 a,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper p,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content p,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper .tertiary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content .tertiary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper .quaternary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content .quaternary {
  color: #ffffff;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper > h3 a,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content > h3 a {
  font-size: inherit;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper > p,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content > p {
  font-size: inherit;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper > .tertiary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content > .tertiary {
  font-size: inherit;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper > .quaternary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content > .quaternary {
  font-size: inherit;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper h3 a:hover,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content h3 a:hover,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper .tertiary:hover,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content .tertiary:hover,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper .quaternary:hover,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content .quaternary:hover {
  text-decoration: none;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper .quaternary,
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text div.content .quaternary {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAPUlEQVQI12P4//9/BxQzwDCIOPMfAmYiCwoiSYBoF5gWkMRuqMQ7mMAqmAAQGzNAGf+hKgVhZoJUpSHbDgCyvnhVII5begAAAABJRU5ErkJggg==");
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text::after {
  content: "";
  display: block;
  clear: both;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper {
  margin-right: 40px;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper:not(.threed) img {
  width: 180px;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper.threed {
  -webkit-perspective: 1000px;
  perspective: 1000px;/* This is a reasonable default, but needs to be about half the size for very small 3D covers to give acceptable perspective. */
  left: -20px;/* Compensate for the left edge of the img moving right after the transform. */
  background-size: 0;
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper.threed::before {
  content: '';
  position: absolute;
  top: 0.33%;
  bottom: 2.33%;
  width: 25%;
  left: 90%;
  -webkit-transform: rotateY(65deg);
  transform: rotateY(65deg);
  z-index: -1;
  background-image: linear-gradient(90deg, #dadada, #bababa);
  background-size: 9.9%;/* This scales along reasonably well, but needs adjusting for very small 3D covers. */
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper.threed::after {
  content: '';
  position: absolute;
  top: 0.75%;
  bottom: 3.3%;
  right: -8.15%;
  width: 25%;
  border: inherit;
  border-left: inherit;
  border-right: 0;
  border-radius: 0 2px 2px 0;
  z-index: -2;
  background-image: inherit;
  background-size: cover;
  background-position: right;
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}
.biebwidget  .nbcitemhighlighted > div > div.article_highlighted_text span.imgwrapper.threed img.representative {
  max-height: inherit;/* Crucial to make the 3D cover scale along well with a container which is changing in size. */
  border: none;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 2px;
  -webkit-transform: rotateY(-20deg);
  transform: rotateY(-20deg);/* Can lead to pretty ugly font-rendering in Fx - https://bugzilla.mozilla.org/show_bug.cgi?id=506548 :( */
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
  width: 180px;
}
@media only screen and (max-width: 1230px) {
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content {
    margin-left: 30%;
  }
}
@media only screen and (max-width: 830px) {
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content {
    margin-left: 0;
  }
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content,
  .biebwidget  .nbcitemhighlighted .left div.article_highlighted_text div.content {
    width: calc(95% - 45px);
  }
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content {
    float: none;
    width: 100%;
  }
}
@media only screen and (max-width: 660px) {
  .biebwidget  .nbcitemhighlighted .left > .backgroundImage {
    background-image: none !important;
  }
  .biebwidget  .nbcitemhighlighted .left div.article_highlighted_text div.content,
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content {
    float: none;
    width: 100%;
    max-width: none;
  }
}
@media only screen and (max-width: 500px) {
  .biebwidget  .nbcitemhighlighted .right > .backgroundImage {
    background-image: none !important;
  }
  .biebwidget  .nbcitemhighlighted .left div.article_highlighted_text div.content,
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text div.content {
    width: 100%;
    display: inline-block;
    margin-top: 20px;
  }
  .biebwidget  .nbcitemhighlighted .left div.article_highlighted_text span.imgwrapper,
  .biebwidget  .nbcitemhighlighted .right div.article_highlighted_text span.imgwrapper {
    padding-left: 0;
    margin-right: calc(100% - 180px);
    margin-left: 0;
  }
}
.modalwindow-container:not(.bar) {
  position: fixed;
  z-index: 101;
  right: 2%;
  left: 2%;
}
*:not(.bar) > .modalwindow {
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
  border: 1px solid #7e847e;
  border-radius: 10px;
  padding: 20px;
  background-color: #ffffff;
}
.cookieBar-filler + .bibliotheek-container  .bar {
  position: absolute;
  margin-bottom: 20px;
  top: 0;
  max-width: 97%;
}
.cookieBar-filler + .bibliotheek-container  .bar::before {
  content: "";
  display: block;
  position: absolute;
  width: 100vw;
  height: 100%;
  background: white;
  left: calc((100vw - 100%) / 2 * -1);
  -webkit-box-shadow: 0 2px 5px rgba(170, 170, 170, 0.2);
  box-shadow: 0 2px 5px rgba(170, 170, 170, 0.2);
}
.bibliotheek-container  h1 {
  position: relative;
}
@media only screen and (max-width: 634px) and (min-width: 0) {
  .logo-wrapper.noticeActive::after {
    margin-bottom: 20px;
  }
}
.modalwindow-container.bar {
  position: absolute;
}
.modalwindow-container.bar .modalwindow.main-column {
  position: relative;
  max-width: 100%;
  width: 1200px;
  margin: 0 auto;
  padding: 10px 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.modalwindow-container.bar .modalwindow.main-column:after {
  display: table;
  content: "";
  clear: both;
}
.modalwindow-container.bar .modalwindow.main-column .modalwindow-content {
  overflow: inherit;
}
.modalwindow-container.bar .modalwindow.main-column h2 {
  display: inline-block;
  font-size: 1.5rem;
}
.modalwindow-container.bar .modalwindow.main-column p:first-of-type {
  max-width: 50%;
  max-width: calc(90% - 12em);
}
.modalwindow-container.bar .modalwindow.main-column p:not(.buttons) {
  display: inline-block;
  float: left;
  margin-top: -5px;
  font-size: 1.2rem;
}
.modalwindow-container.bar .modalwindow.main-column p:nth-of-type(2) {
  margin-top: 10px;
  clear: both;
}
.modalwindow-container.bar .modalwindow.main-column p.buttons {
  position: absolute;
  right: 0;
  top: 25%;
  margin-top: 5px;
  margin-right: 25px;
}
.cookieBar-filler {
  position: relative;
  max-width: 97%;
  width: 1200px;
  margin: 0 auto;
  padding: 10px 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.cookieBar-filler .cookie-header-text {
  overflow: inherit;
}
.cookieBar-filler .cookie-header-text::after {
  content: "";
  display: table;
  clear: both;
}
.cookieBar-filler .cookie-header-text .cookie-header {
  display: inline-block;
  padding: 0 16px .5em 0;
  margin: 0;
  width: 100%;
  font-size: 1.5rem;
  word-wrap: break-word;
  font-weight: normal;
  font-family: Arial, sans-serif;
}
.cookieBar-filler .cookie-header-text .cookie-header::before {
  content: attr(data-header);
}
.cookieBar-filler .cookie-header-text .cookie-text {
  display: inline-block;
  float: left;
  max-width: calc(90% - 12em);
  margin: -5px 0 0 0;
  padding: 0;
  line-height: 1.3;
  font-size: 1.2rem;
}
.cookieBar-filler .cookie-header-text .cookie-text::after {
  content: attr(data-text);
}
.cookieBar-filler .cookie-header-text .cookie-read-more {
  display: inline-block;
  float: left;
  clear: both;
  margin-top: 10px;
  padding: 0;
}
.cookieBar-filler .cookie-header-text .cookie-read-more::before {
  content: attr(data-readmore);
  display: inline-block;
  font-size: .9em;
  margin:  0 0 5px 0;
  padding:  0 0 0 18px;
  color:  #505450;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABA0lEQVR42mL8X6zAgAY4gdgViCWg/BdAvBuIvyMrYkHTlAPELUDMjyb+EYjrgXgiTIAJSXIaEE/GookBKjYBiGeia0wD4kwGwiANisEamYG4DkVaSJaBQcUKl2aQWmaQRjMglkaRYucCmruIgcEhDZtGkFozkEYtrOYyAR3iU8nAkDgbYhAq0GJCD2YMICLPwMArii76HRQdl3FqOr+RgWFNFQPDz2/oMpdhGi8AsQFc+M9vBoaNTQwMh+djM+4mTCMIpADxMSBmA/Ne34Ng7KAAOR7PAnExgTj8BcS5QLwDPeVMAWJnID6IRdMRIDaBqsGaVvdBMcjJxkiu+YVuEkCAAQDl+DGY+33pQQAAAABJRU5ErkJggg==") left center no-repeat;
  background-size:  auto auto;
}
.cookieBar-filler .cookie-header-text .cookie-read-more::before:hover,
.cookieBar-filler .cookie-header-text .cookie-read-more::before:focus {
  color:  #ff7320;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABA0lEQVR42mL8X6zAgAY4gdgViCWg/BdAvBuIvyMrYkHTlAPELUDMjyb+EYjrgXgiTIAJSXIaEE/GookBKjYBiGeia0wD4kwGwiANisEamYG4DkVaSJaBQcUKl2aQWmaQRjMglkaRYucCmruIgcEhDZtGkFozkEYtrOYyAR3iU8nAkDgbYhAq0GJCD2YMICLPwMArii76HRQdl3FqOr+RgWFNFQPDz2/oMpdhGi8AsQFc+M9vBoaNTQwMh+djM+4mTCMIpADxMSBmA/Ne34Ng7KAAOR7PAnExgTj8BcS5QLwDPeVMAWJnID6IRdMRIDaBqsGaVvdBMcjJxkiu+YVuEkCAAQDl+DGY+33pQQAAAABJRU5ErkJggg==") left center no-repeat;
  background-size:  auto auto;
}
.cookieBar-filler .cookie-buttons {
  position: absolute;
  right: 0;
  top: 25%;
  margin-top: 5px;
  margin-right: 25px;
  text-align: center;
  line-height: 1.3;
}
.cookieBar-filler .cookie-buttons .cookie-approve {
  display: inline-block;
  margin:  5px 0 5px 0px;
  padding:  7px 35px 8px 9px;
  border:  1px solid transparent;
  border-radius:  5px;
  color:  #ffffff;
  text-decoration:  none;
  background: #ff7320;
  background: #ff7320 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABD0lEQVQ4y4XRPStHcRQH8J9SHpNIWSQjOy/BIqWwGAxmJW/AxrswGiykDFKSyegFKFI2SSkfhK7BuTr/2z9unbrn+3CefgUFbwV7KCWQUlChqpEHLOL1VxKKX09H9t6hMysq7OMSu7VlGictfSMmwvGea97XM+EqiNXI72vnBrbi/zTIo3YttrGey+d4DOdyTa4FsBOC98jnSxqqiqULnuvjZbJgJF92IA4/hv4k7G4OVBN97abNMeXnq/CEpaYmJyOYwXjC5vCaOr5hIZtX8dlYrMJmKrKCj8S9YLbgq42xwjV6U4Fh3GRNwSjOGsZbTIZpEBcN/gBdfx2sB4cN03Hg5b9rD+E81jqMN2zRfAPSLrmpx9A84QAAAABJRU5ErkJggg==") right 10px center no-repeat;
}
.cookieBar-filler .cookie-buttons .cookie-approve:hover,
.cookieBar-filler .cookie-buttons .cookie-approve:focus {
  border:  1px solid transparent;
  color:  #ffffff;
  text-decoration:  none;
  background: #fb5d00;
  background: #fb5d00 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAOCAYAAAGHjXZ5AAABD0lEQVQ4y4XRPStHcRQH8J9SHpNIWSQjOy/BIqWwGAxmJW/AxrswGiykDFKSyegFKFI2SSkfhK7BuTr/2z9unbrn+3CefgUFbwV7KCWQUlChqpEHLOL1VxKKX09H9t6hMysq7OMSu7VlGictfSMmwvGea97XM+EqiNXI72vnBrbi/zTIo3YttrGey+d4DOdyTa4FsBOC98jnSxqqiqULnuvjZbJgJF92IA4/hv4k7G4OVBN97abNMeXnq/CEpaYmJyOYwXjC5vCaOr5hIZtX8dlYrMJmKrKCj8S9YLbgq42xwjV6U4Fh3GRNwSjOGsZbTIZpEBcN/gBdfx2sB4cN03Hg5b9rD+E81jqMN2zRfAPSLrmpx9A84QAAAABJRU5ErkJggg==") right 10px center no-repeat;
}
.cookieBar-filler .cookie-buttons .cookie-approve:focus {
  color:  #ffffff;
}
.cookieBar-filler .cookie-buttons .cookie-approve::before {
  content: attr(data-approve);
}
.cookieBar-filler .cookie-buttons .cookie-decline {
  display: inline-block;
  margin:  0 0 5px 0;
  padding:  2px 12px 3px 0;
  color:  #505450;
  text-decoration:  underline;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAAUklEQVR42mIMCAnoYICACijNwALELkBsDMSCQJwOEmQCYlcgPgvEaUB8BqQIJPgeKrEHqmMVE1TbTKgxYAUgM+9CJUAqw0ASLFAOCM+C2Q4QYAAaqg9vjktbCAAAAABJRU5ErkJggg==") right center no-repeat;
  background-size:  auto auto;
  margin-left: 20px;
}
.cookieBar-filler .cookie-buttons .cookie-decline:hover,
.cookieBar-filler .cookie-buttons .cookie-decline:focus {
  color:  #ff7320;
  text-decoration:  underline;
  background: transparent;
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAHCAYAAADAp4fuAAAAZ0lEQVR42mL8X6yQxsDA4ALE6Qw9998DaQYmIFYC4lAg3s1QoigIEmT8//8/A5AzE8gG6QCprIAIgkCJYgeQLEdWCeJ0QGQZ0hmBFp0BMoyB+B4QhwEtO8sCZOwB4tVAPAtmO0CAAQAy6CC6niNkcAAAAABJRU5ErkJggg==") right center no-repeat;
  background-size:  auto auto;
}
.cookieBar-filler .cookie-buttons .cookie-decline::after {
  content: attr(data-decline);
}
@media only screen and (min-width: 0px) and (max-width: 816px) {
  .biebwidget-content.noticeActive:not(.longNotice) .modalwindow-container.bar .modalwindow.main-column p:nth-of-type(2) {
    margin-top: 10px;
  }
  .biebwidget-content.noticeActive:not(.longNotice) .modalwindow-container.bar .modalwindow.main-column p .buttons {
    clear: both;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 0) and (max-width: 768px) {
  .modalwindow-container.bar .modalwindow.main-column p.buttons {
    position: relative;
    clear: both;
  }
  .modalwindow-container.bar .modalwindow.main-column p:first-of-type {
    max-width: 100%;
  }
  .cookieBar-filler > .cookie-header-text > .cookie-text {
    max-width: 100%;
  }
  .cookieBar-filler > .cookie-header-text > .cookie-read-more::before {
    margin-bottom: 0;
  }
  .cookieBar-filler > .cookie-buttons {
    position: relative;
    margin-top: 4px;
  }
}
/* styles copied from widget h2 */
.modalwindow h2 {
  padding: 0 16px .5em 0;/* padding-right for the close button */
  margin: 0;
  font-weight: normal;
  color: #ff7320;
  font-family: Arial, sans-serif;
  font-size: 1.725rem;
}
.modalwindow button.close {
  position: absolute;
  right: 22px;
  top: 20px;
  display: block;
  width: 11px;
  height: 12px;
  border: none;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAMCAIAAAA7y9DJAAAAv0lEQVR42nSQMQqEMBBFs+P2loJFyoCNJ7BL6RFyP0+gnZWlVnoEbTSdNioI2c8KIRvWD4HH/GHyZ8gY0/d927bG0TzPTdOgDn7Xdd11HWNMa53nOWBZlqIojuMAn+cZJEnCvoKxbVsYhtaGrut6lWU5DAN7EKYSXpqmTzYsukkI8dcG0J1gHEevY5qmG8hN7grhqqoCBHEcuzbnfF1Xux22Je9vpZQXnKSUXjQLURRlWcZw133fcWbzK1v5CDAAHhiRmm6gdo0AAAAASUVORK5CYII=") no-repeat;
  cursor: pointer;
}
.modalwindow button.close:hover,
.modalwindow button.close:focus {
  border: 0;
  outline: 0;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAMCAIAAAA7y9DJAAAAuklEQVR42mL8//8/w+k1DD8+MdgmMcDBs2sMV3YxCMowmIawMGxsZjg8Dyx6nSG8Gyo9PZLh+ycQ+8cn5gbp+wh9758yCMkgpIHgzy/G/ytKQLbgAuHdzA2rj4K0Ag3AJg10BxOUpeOGVRpIM0FdcPcEuop7JyE0E4rLkQHQcStLgTRzA9cRFGllC4b3TxC++/6ZCd3uzOUQ6+GAicGvFs1pCIaUFoNbPgMw1P9/+/j/6dX/aAAmAhBgAKqda4EKsM7aAAAAAElFTkSuQmCC") no-repeat;
}
.modalwindow button.close::-moz-focus-inner {
  border: 0;
  outline: 0;
}
.modalwindow button.close span {
  position: absolute;
  left: -9999px;
}
.modalwindow-content {
  overflow: auto;
}
.modalwindow-content.closepadding {
  padding-right: 16px;
}
.modalwindow-content .buttons {
  text-align: center;
}
.backgroundoverlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: #505450;
  opacity: 0.70;
}
.scrollablelist.section {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  clear: both;
}
.scrollablelist.section .rich-items,
.scrollablelist.section .grid-items {
  overflow: hidden;
  margin-bottom: 10px;
  margin-left: 20px;
  border-bottom: 0;
}
.widget-columns  .scrollablelist.section .rich-items:not(.sliding),
.widget-columns  .scrollablelist.section .grid-items:not(.sliding) {
  margin-left: 0;/* On a landing page we don't care about lining out scrollable and non-scrollable etalages, and need the extra space. */
}
.scrollablelist.section .grid-items {
  margin-bottom: 0;/* Grid-items have more white-space inside. */
}
.scrollablelist.section .rich-items + p {
  margin-top: 20px;
}
.scrollablelist.section .grid-items + p,
.scrollablelist.section .rich-items + p {
  padding-top: 5px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.scrollablelist.section .slidingnav {
  position: absolute;
  width: 100%;
}
.scrollablelist.section .slidingnav.fadeout::after {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  content: "";
  display: block;
  width: 60px;
  height: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-bg-gradient.png") repeat-y right center;
}
.scrollablelist.section .slidingnav button .prev {
  left: -20px;
}
.scrollablelist.section .slidingnav button .next {
  right: 20px;
}
.main-column .tiny.rich-items.link-list-minimal .content:not(.calendar),
.main-column .tiny.rich-items.link-list-small .content:not(.calendar) {
  padding-left: 30px;
}
.widget-bnl-category .scrollablelist.section .rich-items.link-list {
  margin-left: 0;
}
.scrollablelist ul.grid-items + p {
  margin-top: 0;
}
.scrollablelist ul.grid-items.no-subitems > li {
  padding-bottom: 100px;
}
.scrollablelist ul.grid-items.high.no-subitems > li {
  padding-bottom: 159px;
}
.scrollablelist .link-list {
  display: block;
  display: flex;
  flex-wrap: wrap;
}
.scrollablelist .link-list .content {
  padding-left: 30px;
}
.scrollablelist .link-list li {
  float: left;
  clear: none;
  min-width: 200px;
  text-indent: 0;
  word-wrap: normal;
  padding: 0;
  background-image: none;
}
.scrollablelist .link-list li:first-child {
  padding: 0;
}
.scrollablelist .link-list li .content:not(.calendar):before {
  position: absolute;
  display: block;
  content: "";
}
.scrollablelist .link-list.link-list-small > li {
  width: 32%;
  margin-left: 2%;
  margin-bottom: 20px;
}
.scrollablelist .link-list.link-list-small > li .content:not(.calendar):before {
  margin-top: 2px;
}
.scrollablelist .link-list.link-list-small > li .content:not(.calendar):before {
  margin-left: -25px;
  height: 20px;
  width: 20px;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABDUlEQVQ4y7WVwRGDIBBFLYESUgIlUAIecqcES7ADS7AES6AESrAESjCQfDLrCis5xJkdR5Z9/C+4DoNwjc/RpJhZ2OGXKxUoFMYURyMi5qg7mE4RUOSzmhQOxTXwnmskWERYYllSWtTqms1Ak1jgwPiG+y4oVRRYLFkytjIVHuCW4pkC3wXkebmxyTcnLxbp0chJxxboAmK++zps2O0FUhEf2wQY2IHekNsEoJGAzXPVgOnKnAvwZEPapHLcakDDX3IFuDJgwJhD3p72gWxCaAC5wgk1Cnl/EkNstxQ+CMzj2TJ1s/jpNVQu7L2V73+/dB7WHKaONmfJfN3bvhxTpADyt+3rLw228xdgpJoXntu1AahjfSUAAAAASUVORK5CYII=") no-repeat left center;
}
.scrollablelist .link-list.link-list-small > li:nth-of-type(3n+1) {
  margin-left: 0;
}
.scrollablelist .link-list.link-list-minimal > li {
  width: 24%;
  margin-left: 1%;
  max-height: calc(2.6em);
}
@media only screen and (max-width: 789px) {
  .scrollablelist .link-list.link-list-small > li {
    width: 47%;
  }
  .scrollablelist .link-list.link-list-small > li:nth-of-type(3n+1) {
    clear: left;
  }
}
@media only screen and (max-width: 768px) and (min-width: 0) {
  .scrollablelist .link-list.link-list-small > li:nth-of-type(2n+1) {
    clear: left;
    margin-left: 0;
  }
}
@media only screen and (max-width: 555px) {
  .widget-bnl-category .scrollablelist.section .rich-items {
    margin-left: 0;
    padding-left: 40px;
  }
  .scrollablelist .link-list.link-list-small > li {
    width: 90%;
    margin-bottom: 0;
    margin-left: 0;
  }
  .scrollablelist .link-list.link-list-small > li:nth-of-type(2n+1) {
    clear: left;
  }
}
@media only screen and (max-width: 450px) and (min-width: 0) {
  .main-column .scrollablelist .rich-items.link-list-small li {
    margin-left: 0;
  }
  .main-column .scrollablelist .rich-items.link-list-small li .content:not(.calendar):before {
    content: "";
    float: left;
  }
  .main-column .scrollablelist .rich-items.link-list-small li .content:not(.calendar):before {
    padding-left: 30px;
    width: 20px;
    height: 20px;
  }
}
.scrollablelist .highlight {
  margin-top: 20px;
}
.scrollablelist .highlight > .content {
  position: relative;
  float: left;
  width: 50%;
  padding: 0 20px 56px 0;
  margin: 0 0 20px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.scrollablelist .highlight > .content.nbc {
  padding-bottom: 0;
}
.scrollablelist .highlight > .content h3 {
  font-size: inherit;
}
.scrollablelist .highlight > .content h4 img {
  float: right;
  margin: 0 0 20px 20px;
}
.scrollablelist .highlight > .content h4 .coverplaceholder,
.scrollablelist .highlight > .content h4 .cover {
  float: left;
  margin: 0 20px 20px 0;
}
.scrollablelist .highlight > .content h4 + p.additional {
  margin-top: 0.33em;
  color: #505450;
}
.scrollablelist .highlight > .content h4 + p.additional.creator {
  font-size: 1.5333rem;
}
.scrollablelist .highlight > .content h4 a .button {
  position: absolute;
  bottom: 0;
  left: 0;
  margin: 0;
}
.scrollablelist .highlight > .content.agenda {
  padding-left: 4em;
}
.scrollablelist .highlight > .content.agenda .calendar {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
}
.scrollablelist .highlight > .content.agenda a .button {
  left: 4em;
}
.scrollablelist .highlight ul,
.scrollablelist .highlight ul + p {
  width: 50%;
}
.scrollablelist .highlight ul {
  float: left;
  margin: 0;
}
.scrollablelist .highlight ul li {
  list-style: none;
  margin-left: 0;
}
.scrollablelist .highlight ul li:not(:last-child) {
  padding:  20px 0 20px 0;
  border-bottom:  1px solid #d0d0d0;
}
.scrollablelist .highlight ul li:last-child {
  padding:  20px 0 20px 0;
}
.scrollablelist .highlight ul li:first-child {
  padding-top: 0;
}
.scrollablelist .highlight ul li h4 + p {
  margin-top: 0.33em;
}
.scrollablelist .highlight ul + p {
  float: right;
  padding: 0 0 20px 0;
  margin:  0;
  padding:  20px 0 20px 0;
  border-top:  1px solid #d0d0d0;
}
.scrollablelist .highlight *:last-child::after {
  clear: both;
  width: 100%;
}
@media screen and (max-width: 1069px) {
  .scrollablelist .highlight > .content,
  .scrollablelist .highlight ul,
  .scrollablelist .highlight ul li,
  .scrollablelist .highlight ul + p {
    width: 100%;
    float: none;
  }
  .scrollablelist .highlight > .content {
    padding-right: 0;
  }
  .scrollablelist .highlight ul {
    clear: left;
    margin:  0;
    padding:  20px 0 20px 0;
    border-top:  1px solid #d0d0d0;
  }
}
@media screen and (min-width: 634.01px) {
  .scrollablelist > .highlight > .content > h4 {
    font-size: 2.6833rem;
  }
}
/* Widget library: pagination */
.pagenav {
  clear: left;
  text-align: center;
}
.itemnav {
  clear: left;
  max-width: 836px;
  margin-top: 15px;
  margin-right: auto;
  margin-left: auto;
  border-top: 1px solid #d0d0d0;
  padding-top: 10px;
  text-align: center;
}
.pagenav ol {
  display: inline;
  padding:  0 5px;
  border-left:  1px solid #496660;
  border-right:  1px solid #496660;
}
.pagenav ol > li {
  display: inline-block;
}
.pagenav ol > li.current {
  min-width:  0.9em;
  margin:  0 2px;
  padding:  1px 5px;
  color:  #ffffff;
  font-weight:  bold;
  background-color: #ff7320;
}
/* Make the 'border' look like a square */
.pagenav ol > li.current:first-child {
  /* Offset the ol border a bit more when the first page is .current. */
  margin: 0 2px 0 4px;
}
.pagenav ol > li.current:last-child {
  margin: 0 4px 0 2px;
}
.pagenav ol > li.current > button {
  padding:  0;
  color:  inherit;
  font-weight:  inherit;
}
.pagenav ol > li span.jump {
  pause: 20ms;
}
.pagenav ol > li span.jump:before {
  padding: 0 6px 0 2px;
  content: "...";
  text-decoration: none;
}
.pagenav ol > li > a,
.pagenav ol > li > button {
  display:  inline;
  padding:  0 5px;
}
.pagenav ol > li:not(.current) > button:hover,
.pagenav ol > li:not(.current) > button:focus {
  color:  #ff7320;
  text-decoration:  underline;
}
.pagenav ol > li button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.pagenav ol > li:first-child span.jump:before {
  padding: 0 2px 0 6px;
}
.pagenav span a,
.pagenav span button,
.pagenav .inactive,
.itemnav span a,
.itemnav .inactive {
  padding: 0 20px;
  background-repeat: no-repeat;
  background-position: center center;
}
/* Previous/next links */
.pagenav .inactive,
.itemnav .inactive {
  opacity: 0.25;
}
.pagenav span a,
.pagenav span button,
.pagenav .inactive {
  display: inline-block;
  text-indent: -9999em;
}
.pagenav .prev a,
.pagenav .prev button,
.pagenav .prev.inactive,
.itemnav .prev a,
.itemnav .prev.inactive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-prev.png");
}
.itemnav .prev {
  float: left;
}
.itemnav .next {
  float: right;
}
.pagenav .next a,
.pagenav .next button,
.pagenav .next.inactive,
.itemnav .next a,
.itemnav .next.inactive {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next.png");
}
.pagenav .prev a:hover,
.pagenav .prev a:focus,
.pagenav .prev button:hover,
.pagenav .prev button:focus,
.itemnav .prev a:hover,
.itemnav .prev a:focus {
  text-decoration: none;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAJCAYAAAD6reaeAAAABGdBTUEAALGOfPtRkwAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAENJREFUCNdj+P//PwMMP+yJ+A/CcIHHNXb//xcrgDGGAIiNIQBSxAATeFFq8B9mFKrKKSlQlehmAiVw2w53Z4Mb2DIA00J7qVmP5W0AAAAASUVORK5CYII=");
}
.pagenav .next a:hover,
.pagenav .next a:focus,
.pagenav .next button:hover,
.pagenav .next button:focus,
.itemnav .next a:hover,
.itemnav .next a:focus {
  text-decoration: none;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAJCAYAAAD6reaeAAAABGdBTUEAALGOfPtRkwAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAD5JREFUCNdjeNgT8R+EgYABhhn+Fyv8B+HHNXZwCQYwB00CLIMuATfnRakBXAKickoKqkp0Afy2P2xwQ3EnAMDSe6kNDjqdAAAAAElFTkSuQmCC");
}
/* Previous/next links in main-column (wide) paginator */
.main-column .pagenav span a,
.main-column .pagenav span button,
.main-column .pagenav .inactive,
.main-column .itemnav span a,
.main-column .itemnav .inactive {
  padding: 0 10px 1px 10px;
}
.main-column .pagenav span a,
.main-column .pagenav span button,
.main-column .pagenav .inactive {
  text-indent: 0;
}
.main-column .pagenav .prev a,
.main-column .pagenav .prev button,
.main-column .pagenav .prev.inactive,
.main-column .itemnav .prev a,
.main-column .itemnav .prev.inactive {
  background-position: left center;
}
.main-column .pagenav .next a,
.main-column .pagenav .next button,
.main-column .pagenav .prev a,
.main-column .itemnav .next a,
.main-column .itemnav .prev a {
  text-decoration: underline;
}
.main-column .pagenav .next a,
.main-column .pagenav .next button,
.main-column .pagenav .next.inactive,
.main-column .itemnav .next a,
.main-column .itemnav .next.inactive {
  background-position: right center;
}
.quickpagenav {
  text-align: center;
  margin-top: 20px;
}
.quickpagenav button.secondary.button {
  margin-top: 3px;
  margin-bottom: 0;
  padding-top: 2px;
  padding-bottom: 2px;
}
form.generated .feedback .value {
  font-weight: bold;
}
form.generated .feedback.strong .value {
  color: #228800;
}
form.generated .feedback.mediocre .value {
  color: #ff7320;
}
form.generated .feedback.weak .value {
  color: #ff0000;
}
.signpost > .signpost {
  position: relative;
  padding-bottom: 3.25em;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted-vertical.png") repeat-y center top;
}
.signpost > .signpost::after {
  content: "";
  display: block;
  clear: both;
}
.signpost > .signpost div.side {
  width: 50%;
  vertical-align: top;
  float: left;
}
.signpost > .signpost div.left.side {
  text-align: right;
}
.signpost > .signpost div.left.side > * {
  padding-right: 20px;
}
.signpost > .signpost div.right.side {
  text-align: left;
}
.signpost > .signpost div.right.side > * {
  padding-left: 20px;
}
.signpost > .signpost p.action {
  position: absolute;
  bottom: 0;
  padding: 0 20px;
}
.signpost > .signpost p.action:first-of-type {
  right: 50%;
  text-align: right;
}
.signpost > .signpost p.action:last-of-type {
  left: 50%;
  text-align: left;
}
@media only screen and (min-width: 0) and (max-width: 569px) {
  .signpost > .signpost {
    padding-bottom: 0;
    background-image: none;
  }
  .signpost > .signpost div.side {
    width: auto;
    float: none;
  }
  .signpost > .signpost div.left.side {
    text-align: left;
  }
  .signpost > .signpost div.left.side > * {
    padding-right: 0;
  }
  .signpost > .signpost div.right.side > * {
    padding-left: 0;
  }
  .signpost > .signpost p.action {
    position: relative;
    bottom: inherit;
    margin: 10px 0;
    padding-right: 0;
    padding-left: 0;
  }
  .signpost > .signpost p.action:first-of-type {
    right: inherit;
    text-align: left;
  }
  .signpost > .signpost p.action:last-of-type {
    left: inherit;
  }
}
ol.steps {
  position: relative;
  overflow: hidden;
  margin: 13px auto 20px auto;
  word-wrap: break-word;
  text-align: center;
}
ol.steps > li {
  display: inline-block;
  width: 300px;
  margin: 2.5em 0 -100em 40px;
  border: 1px solid #d0d0d0;
  padding: 3em 0 101.667em 0;/* Equal heights columns; rewrite with flexbox once we can drop support for IE9. */
  vertical-align: top;
  text-align: left;/* Keeping this centered gives problems with the positioning of the ::after. */
}
ol.steps > li:first-child {
  margin-left: 0;
}
ol.steps > li:first-child > h3::before {
  content: "1";
}
ol.steps > li:first-child + li > h3::before {
  content: "2";
}
ol.steps > li:first-child + li + li > h3::before {
  content: "3";
}
ol.steps > li::after { /* Draw the border-bottom, since the real one is way out of sight due to equal height columns. */
  content: "";
  position: absolute;
  bottom: 0;
  width: 300px;
  border-bottom: 1px solid #d0d0d0;
}
ol.steps > li > h3,
ol.steps > li > div.richtext {
  padding-right: 20px;
  padding-left: 20px;
  text-align: center;
}
ol.steps > li > h3 {
  position: relative;
}
ol.steps > li > h3::before {
  position: absolute;
  left: 50%;
  width: 2em;
  height: 1.75em;
  margin-top: -2.625em;
  margin-left: -1em;
  padding-top: 0.375em;
  line-height: 1;
  color: #ffffff;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/steps-plectrum.png") no-repeat;
  background-size: contain;
  font-size: 2.3rem;
}
ol.steps > li > h3 + div.richtext {
  margin-top: 13px;
}
ol.steps > li + li::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 16px;
  height: 26px;
  margin-left: -29px;/* 20px (1/2 margin) + 8px (1/2 width) + 1px (border) */
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/steps-next.png") no-repeat;
}
@media only screen and (min-width: 906px) and (max-width: 1065px) {
  ol.steps > li,
  ol.steps > li::after {
    width: 250px;
  }
}
@media only screen and (min-width: 711px) and (max-width: 905px) {
  ol.steps > li,
  ol.steps > li::after {
    width: 200px;
  }
  ol.steps > li {
    margin-left: 30px;
  }
  ol.steps > li + li::before {
    margin-left: -24px;/* 15px (1/2 margin) + 8px (1/2 width) + 1px (border) */
  }
}
@media only screen and (max-width: 710px) {
  ol.steps {
    width: auto;
  }
  ol.steps > li,
  ol.steps > li:first-child {
    display: block;
    width: auto;
    min-height: 3.5em;
    margin: 0 20px;
    border: 0;
    padding: 10px 0 10px 5.33em;
  }
  ol.steps > li:not(:first-child) {
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
    background-repeat: repeat-x;
    background-position: left top;
  }
  ol.steps > li::after,
  ol.steps > li + li::before {
    display: none;
  }
  ol.steps > li > h3,
  ol.steps > li > div.richtext {
    padding-right: 0;
    padding-left: 0;
    text-align: left;
  }
  ol.steps > li > h3::before {
    left: auto;
    margin-top: 0;
    margin-left: -2.833em;/* Causes a 20px gap to the right. */
    text-align: center;
  }
}
.table table {
  clear: both;
  width: 100%;
  table-layout: fixed;
  border-spacing: 0;
  margin: 20px 0;
}
.table table th,
.table table td {
  text-align: left;
  padding: 10px 20px;
  word-wrap: break-word;
}
.table table > tbody > tr > th {
  background-color: #f5f5f5;
}
.table table > tbody > tr > th,
.table table td {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.table table > tbody > tr:first-child > th,
.table table > tbody > tr:first-child > td {
  background-image: none;
  border-top: 1px solid #d0d0d0;
}
.table table.rowheader > thead > tr:first-child > th:first-child,
.table table.rowheader.nocolumnheader > tbody > tr:first-child > th:first-child {
  width: 25%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.table table.rowheader thead > tr > th:nth-of-type(2),
.table table.rowheader tr > td:nth-of-type(1),
.table table.norowheader thead > tr > th:nth-of-type(n+2),
.table table.norowheader tr > td:nth-of-type(n+2) {
  border-left: 1px solid #d0d0d0;
}
@media only screen and (min-width: 480px) and (max-width: 560px) {
  .table table th,
  .table table td {
    padding-right: 10px;/* A bit less horizontal padding until the breakpoint. */
    padding-left: 10px;
  }
}
@media only screen and (min-width: 0) and (max-width: 479.9px) {
  /* Hide the thead without making it invisible for assistive technologies. */
  .table table > thead {
    position: absolute;
    top: -9999em;
    left: -9999em;
    overflow: hidden;
  }
  /* Reset styling elements. */
  .table table > tbody > tr > th,
  .table table td {
    background-image: none;
  }
  .table table > tbody > tr:first-child > th,
  .table table > tbody > tr:first-child > td {
    border-top: 0;
  }
  .table table.rowheader > thead > tr:first-child > th:first-child,
  .table table.rowheader.nocolumnheader > tbody > tr:first-child > th:first-child {
    width: auto;
  }
  .table table.rowheader thead > tr > th:nth-of-type(2),
  .table table.rowheader tr > td:nth-of-type(1),
  .table table.norowheader thead > tr > th:nth-of-type(n+2),
  .table table.norowheader tr > td:nth-of-type(n+2) {
    border-left: 0;
  }
  /* No more table; everything's a block now. */
  .table table,
  .table table thead,
  .table table tbody,
  .table table th,
  .table table td,
  .table table tr {
    display: block;
  }
  .table table tr {
    clear: both;
    overflow: hidden;
    margin-top: 13px;/* Gap between the previous tr and the header of this one. */
  }
  .table table td {
    padding-top: 0;/* 0 vertical padding to let the horizontal dotted lines (generated by :after) fit without gaps. */
    padding-bottom: 0;
  }
  /* Each row header becomes a full-width header. */
  .table table > tbody > tr > th {
    text-align: center;
    border-bottom: 1px solid #d0d0d0;
  }
  /* We render the column header before each table cell, at 40% width. */
  .table table tr > td[data-title]:before {
    content: attr(data-title);
    float: left;
    clear: both;
    width: 40%;
    margin-right: -1px;
    padding: 10px 20px 10px 0;
    word-wrap: break-word;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-right: 1px solid #d0d0d0;
  }
  .table table tr > td > div,
  .table table tr > td > span {
    display: block;
    padding: 10px 0;/* Get back the vertical white-space lost at the td level. */
  }
  /* We put each table cell behind its column header, at 60% width. */
  .table table.columnheader tr > td > div,
  .table table.columnheader tr > td > span {
    float: left;
    width: 60%;
    padding-left: 20px;/* Spacing between the vertical line and the content. */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-left: 1px solid #d0d0d0;
  }
  .table table.columnheader.norowheader tr > td:first-child {
    border-top: 1px solid #d0d0d0;
  }
  /* Generate the dividing line to the next 'row' (table cell). */
  .table table tr > td:not(:last-child):after {
    content: "";
    position: relative;
    clear: both;
    float: left;
    height: 1px;
    width: 100%;
    margin-left: -20px;/* Line out back to the left of the 'row'. */
    padding: 0 20px;/* Fill up the remaining space. */
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
    background-repeat: repeat-x;
    background-position: left top;
  }
}
@media only screen and (min-width: 0) and (max-width: 380px) {
  .table table th,
  .table table td {
    padding-right: 10px;/* A bit less horizontal padding for this final stretch. */
    padding-left: 10px;
  }
  .table table.columnheader tr > td[data-title]:before {
    padding-right: 10px;
  }
  .table table.columnheader tr > td > div,
  .table table.columnheader tr > td > span {
    padding-left: 10px;
  }
  .table table.columnheader tr > td:not(:last-child):after {
    margin-left: -10px;
    padding: 0 10px;
  }
}
.tablinks {
  padding-left: 0;
  padding-right: 0;
}
.tablinks > ul {
  padding: 10px;
  text-align: center;
}
.tablinks > ul > li {
  position: static;
  display: inline-block;
  margin-left: 20px;
  list-style: none;
}
.tablinks > ul > li > .current {
  border: 1px solid #d0d0d0;
  border-radius: 5px;
  background-color: #ffffff;
  box-shadow: inset 0px 2px 11px -6px black;
}
.richtext .tablinks > ul > li > a,
.richtext .tablinks > ul > li > span,
.tablinks > ul > li > a,
.tablinks > ul > li > span {
  display: block;
  padding: 5px 20px;
}
/* Widget library: tabs */
.tabs {
  position: relative;
  overflow: visible;
  float: left;
  width: 100%;
  margin-bottom:  10px;
  border-bottom:  1px solid #d0d0d0;
  font-family: Arial, sans-serif;
}
.tabs:after { /* Extremely dirty hack to remove the the sideways box-shadows of the tabs which exist underneath the border-bottom. */
  position: absolute;
  bottom: -3px;
  display: block;
  width: 100%;
  height: 2px;
  content: "";
  background-color: #fff;
}
.tabs > li {
  float: left;
  margin:  1px 2px 0 1px;
  background-color: #efefef;
}
.tabs > li.current > a {
  color:  #ff7320;
  background-color: #ffffff;
  -webkit-box-shadow: 0 4px #ffffff, 0 1px 3px rgba(0, 0, 0, 0.5);
  box-shadow: 0 4px #ffffff, 0 1px 3px rgba(0, 0, 0, 0.5);
}
.tabs > li.current > a:focus {
  -webkit-box-shadow: 0 4px #efefef, 0 -1px 3px #ff7320;
  box-shadow: 0 4px #efefef, 0 -1px 3px #ff7320;
}
.tabs > li > a {
  float: left;
  min-height:  21px;
  padding:  5px 15px;
  color:  #505450;
  background-color: #efefef;
  -webkit-box-shadow: 0 -4px 2px -2px #efefef inset, 0 -27px 12px -8px #ffffff inset, 0 1px #d0d0d0, 0 4px #ffffff, 0 1px 3px rgba(0, 0, 0, 0.5);
  box-shadow: 0 -4px 2px -2px #efefef inset, 0 -27px 12px -8px #ffffff inset, 0 1px #d0d0d0, 0 4px #ffffff, 0 1px 3px rgba(0, 0, 0, 0.5);
}
.tabs > li > a:hover {
  color:  #ff7320;
  text-decoration:  none;
  background-color: #ffffff;
}
.tabs > li > a:focus {
  outline: 0;
  color:  #ff7320;
  background-color: #ffffff;
  -webkit-box-shadow: 0 -4px 2px -2px #efefef inset, 0 -27px 12px -8px #ffffff inset, 0 1px #d0d0d0, 0 4px #ffffff, 0 -1px 3px #ff7320;
  box-shadow: 0 -4px 2px -2px #efefef inset, 0 -27px 12px -8px #ffffff inset, 0 1px #d0d0d0, 0 4px #ffffff, 0 -1px 3px #ff7320;
}
.tabs + ul,
.tabs + ol {
  clear: left;
}
.tabs.interactive + ul > li,
.tabs.interactive + ol > li {
  display: none;
}
.tabs.interactive + ul > li.current,
.tabs.interactive + ol > li.current {
  display: block;
}
.tabs.alt {
  overflow: hidden;
  float: none;
  margin:  0;
  padding:  0 0 0 10px;
  border-bottom:  0;
  background-color: #efefef;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.tabs.alt:after {
  display: none;/* Remove the hack. */
}
.tabs.alt > li {
  margin:  0 1px 0 0;
}
.tabs.alt > li:hover {
  background-color: #efefef;
}
.tabs.alt > li > a {
  min-height:  27px;
  padding:  15px 10px;
  font-size: 1.725rem;
  -webkit-box-shadow: none;
  box-shadow: none;
}
/* Override unwanted inherited styling */
.tabs.alt > li > a:hover {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.tabs.alt > li > a:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.tabs.alt > li.current > a {
  margin-bottom: 0;
  color:  #ff7320;
  background-color: #ffffff;
}
.tabs.alt > li.current > a:hover,
.tabs.alt > li.current > a:focus {
  background-color: #ffffff;
}
h3.tabtitle {
  margin: 15px 0 5px 0;
  font-weight: normal;
  border-bottom: 1px solid #d0d0d0;
  font-size: 1.5333rem;
}
> h3.tabtitle:first-child,
li:first-child h3.tabtitle {
  margin-top: 0;
}
.tabs.interactive + ul h3.tabtitle {
  position: absolute;
  left: -9999em;
}
.tagcloud > li {
  display: inline;
  margin-right: 15px;
  line-height: 22px;
  white-space: nowrap;
}
.tagcloud > li.weight_1 {
  font-size: 1.2458rem;
}
.tagcloud > li.weight_3 {
  font-size: 1.3417rem;
}
.tagcloud > li.weight_4 {
  font-size: 1.5333rem;
}
.tagcloud > li.weight_5 {
  vertical-align: 1px;/* Visually offset the extra 1px whitespace between letters and underline. */
  font-size: 2.0125rem;
}
ul.tagcloud > li > a {
  display: inline;
}
/* Toggles. */
.tools ul.toggle {
  float: right;
  width: auto;
  margin-left: 15px;
  padding-top: 3px;
  padding-right: 1px;
}
.tools ul.toggle > li {
  float: left;/* float left inside float right, so visual order equals keyboard access (tab-through-links) order */
}
.tools .toggle a,
.tools .toggle button {
  width: 23px;
  height: 18px;
  margin-left: 4px;
  border: 1px solid rgba(0, 0, 0, 0.18);/* Effective color probably #d0d0d0 */
  border-radius: 6px;
  padding: 2px 0;
  text-indent: -9999em;
  background-repeat: no-repeat;
  background-position: center center;
}
.tools .toggle button {
  cursor: pointer;
  background-color: transparent;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.tools .toggle .current a,
.tools .toggle a:hover,
.tools .toggle .current button,
.tools .toggle button:hover {
  border-color: #ff7320;
  background-color: #ff7320;
}
.tools .toggle a:focus,
.tools .toggle button:focus {
  background-color: #fbbd8e;/* TODO: temporary; find guidelines for all focus styling. */
  outline: transparent none 0;
}
.tools .toggle .list a {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/toggle-list.png");
}
.tools .toggle .list.current a,
.tools .toggle .list a:hover {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAOklEQVR42mL8DwQMWEB7ezsjAz7wHwdoa2vDKQcCLPgMxWsr3W1kYiATsBAMPWrbyDgajzSIR4AAAwAMheinHCJmGgAAAABJRU5ErkJggg==");
}
.tools .toggle .grid a {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/toggle-grid.png");
}
.tools .toggle .grid.current a,
.tools .toggle .grid a:hover {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAK0lEQVR42mL8DwQM2AEjlMYqz8RAJhgJGlmQQo+BQOhSz8bReKS2RoAAAwAXxAcdzlX66wAAAABJRU5ErkJggg==");
}
.tools .toggle .map a,
.tools .toggle .map button {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/toggle-map.png");
}
.tools .toggle .map.current a,
.tools .toggle .map a:hover,
.tools .toggle .map.current button,
.tools .toggle .map button:hover {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAkklEQVQoz2P4//8/AxrOAuJ7/yHgHpSProYBXWDFf+xgBT6NWWiKd6Lxs3BpPICkKBmINaE0DBzApfEpkk16UDE9JJuf4tK4D8n0ZiA2htIwsA+XRjc0Pz1F47vhC9XJOEJ1MqHoAOF2NE3txMQjCBsC8TWopmtQPlEakW1txyGPU2MkVGMkqRqloBql8GkkCwAACFGVbfQmDMYAAAAASUVORK5CYII=");
}
hr.divider {
  clear: both;
}
hr.divider.whitespace {
  height: 1px;
  margin: 30px auto;
  border: none;
}
hr.divider.line {
  width: 200px;
  margin: 60px auto 59px auto;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 1px solid #505450;
}
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding > li {
  display: block;
  position: relative;
}
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding > li > * {
  opacity: 1;
  transition: 0.2s;
}
/* these items will move offscreen, we add a transition to make it look nicer */
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding > li.before > *,
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding > li.after > * {
  opacity: 0.01;
  transition: opacity 0.2s 0.2s;
}
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.rich-items,
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.grid-items {
  padding-left: 40px;
  padding-right: 40px;
  box-sizing: border-box;
}
/* two item view, must always show two, fade the partial if it is not one of the two */
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.rich-items > li.current + li + li > * {
  opacity: 0.01;
  transition: opacity 0.2s 0.2s;
}
.main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.rich-items > li.current + li + li + li > * {
  opacity: 0.01;
  transition: none;
}
/* landing page tweaks */
.biebwidget-column  .main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.rich-items,
.biebwidget-column  .main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.grid-items {
  padding-left: 0;
  padding-right: 0;
}
.biebwidget-column  .main-column .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.small.rich-items > li {
  width: 90%;
  width: calc(80%);
}
@media screen and (max-width: 960px) {
  .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.rich-items,
  .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.sliding.grid-items {
    margin-left: 20px;
  }
}
@media screen and (max-width: 700px) {
  .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.small.rich-items > li {
    width: 100%;
  }
  .scrollablelist ul[data-component~="bw.ui.slidingitems"].interactive.rich-items > li.current + li > * {
    opacity: 0.01;
    transition: opactity 0.2s 0.2s;
  }
}
.quote {
  position: relative;
  padding: 20px 0;
}
.quote blockquote {
  margin: 4px 0 0 -2px;
  padding: 0 42px;
  font-family: Arial, sans-serif;
  font-style: italic;
  color: #505450;
  font-size: 1.333rem;
}
.quote blockquote::before {
  position: absolute;
  content: "\201C";
  left: 15px;
  margin-top: -10px;
  font-size: 53px;
  color: #ff7320;
}
.quote blockquote p {
  padding: 0 10px;
}
.quote blockquote::after {
  position: absolute;
  content: "\201D";
  right: 35px;
  margin-top: -30px;
  font-size: 53px;
  color: #ff7320;
}
.quote .quote-source {
  display: inline-block;
  margin-top: 3px;
  padding-left: 50px;
  color: #505450;
}
.quote a {
  color: #505450;
}
.quote a:hover,
.quote a:focus {
  color: #ff7320;
}
.detail .main-column-wrapper:not(.nav) .quote {
  max-width: 765px;
  margin-right: auto;
  margin-left: auto;
  box-sizing: border-box;
}
.detail .main-column-wrapper:not(.nav) .quote blockquote {
  position: relative;
  display: table;/* fix for overlapping intro image */
}
.detail .main-column-wrapper:not(.nav) .quote blockquote::after {
  right: 25px;
}
.widget-bnl-category .blockquote {
  max-width: 640px;
  margin-right: auto;
  margin-left: auto;
}
.richtext .videohighlighted.video {
  max-width: none;
  max-height: none;
}
.videohighlighted {
  clear: both;
}
.videohighlighted > div::after {
  content: "";
  display: block;
  clear: both;
}
.videohighlighted div.container {
  float: right;
  width: 46%;
  width: calc(50% - 20px);
  max-width: 400px;
}
.videohighlighted div.container:only-of-type {
  width: 400px;
  margin-right: 0;
}
.videohighlighted div.container:first-of-type {
  float: left;
}
.videohighlighted div.container .aspect-ratio,
.videohighlighted div.container .button {
  margin-top: 20px;
}
@media only screen and (min-width: 0) and (max-width: 650px) {
  .videohighlighted div.container {
    float: none;
    width: 400px;
    max-width: 100%;
  }
}
.bordered.biebwidget .biebwidget-content.widget-bnl-support .main-column > * {
  padding-left: 200px;
  padding-right: 200px;
}
.biebwidget-content.widget-bnl-support .main-column .head {
  font-weight: bold;
  position: relative;
  min-height: 100px;
  margin-bottom: 20px;
  padding: 40px 40px 40px 40px;
  background-color: #595959;
  color: #ffffff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  background-size: cover;
  background-position: left center;
}
.biebwidget-content.widget-bnl-support .intro {
  padding-top: 20px;
}
/* Cursus doesn't want this gradient, since there's no text inside the head. */
.biebwidget-content.widget-bnl-support .main-column .head > * {
  position: relative;
}
.biebwidget-content.widget-bnl-support .main-column .head.legacy-contrast::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 42.5em;
  height: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;
  background-size: 100%;
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_light::before,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 42.5em;
  height: 100%;
  background-size: 100%;
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_light::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_light::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block {
  overflow: hidden;
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > h2,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > h3,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > h3,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .content > h3,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > h3 + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .content > h3 + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .content + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > p + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper p + p,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0,.5);
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.biebwidget-content.widget-bnl-support .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.biebwidget-content.widget-bnl-support .head {
  min-height: 70px;
  padding-bottom: 20px;
  overflow: hidden;
}
.biebwidget-content.widget-bnl-support .head h2 {
  color: inherit;
}
.biebwidget-content.widget-bnl-support .head .additional {
  padding-left: 0;
  color: inherit;
  font-size: 1.4375rem;
}
.biebwidget-content.widget-bnl-support .head .additional a {
  padding: 2px 0 3px 12px;
  background: transparent url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-back-white.png") left no-repeat;
}
.biebwidget-content.widget-bnl-support .head .additional a:hover {
  background: transparent url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/button-quaternary-back-hover.png") left no-repeat;
}
.biebwidget-content.widget-bnl-support .head + .metadata > dl.meta:first-child {
  margin-top: 0;
  padding-top: 0;
  background-image: none;
}
.biebwidget-content.widget-bnl-support .metadata {
  margin-top: 13px;
}
.biebwidget-content.widget-bnl-support .relatedlinks {
  position: relative;
  padding-bottom: 1.8em;
}
.biebwidget-content.widget-bnl-support .relatedlinks ul li a {
  display: inline;
}
.biebwidget-content.widget-bnl-support .relatedlinks button {
  position: absolute;
  bottom: 0;
  background-image: none;
}
.biebwidget-content.widget-bnl-support .relatedlinks button.hidden {
  display: none;
}
.biebwidget-content.widget-bnl-support .relatedlinks button:hover,
.biebwidget-content.widget-bnl-support .relatedlinks button:focus {
  background-image: none;
}
.biebwidget-content.widget-bnl-support .relatedlinks button.more::before,
.biebwidget-content.widget-bnl-support .relatedlinks button > .button.quaternary:not(.open)::before {
  content: "+";
  display: inline-block;
  margin-right: .45rem;
}
.biebwidget-content.widget-bnl-support .relatedlinks button.less::before,
.biebwidget-content.widget-bnl-support .relatedlinks button > .button.quaternary.open::before {
  content: "\2212";
  display: inline-block;
  margin-right: .45rem;
}
@media only screen and (max-width: 976px) {
  .bordered.biebwidget .biebwidget-content.widget-bnl-support .main-column > * {
    padding-left: 100px;
    padding-right: 100px;
  }
  .biebwidget-content.widget-bnl-support .head {
    font-size: 4.6rem;
  }
}
@media only screen and (max-width: 768px) {
  .bordered.biebwidget .biebwidget-content.widget-bnl-support .main-column > * {
    padding-left: 20px;
    padding-right: 20px;
  }
  .biebwidget-content.widget-bnl-support > .main-column-wrapper > .main-column > .head {
    padding-bottom: 20px;
  }
}
@media only screen and (max-width: 600px) {
  .bordered.biebwidget .biebwidget-content.widget-bnl-support .main-column > * {
    padding-left: 20px;
    padding-right: 20px;
  }
  .biebwidget-content.widget-bnl-support .head {
    margin-left: 0;
  }
}
.bordered.biebwidget .widget-bnl-arrangement .main-column > * {
  padding-left: 40px;
  padding-right: 40px;
}
.widget-bnl-course .main-column .head,
.widget-bnl-arrangement .main-column .head {
  position: relative;
  min-height: 100px;
  margin-bottom: 20px;
  padding: 40px 40px 40px 40px;
  background-color: #595959;
  color: #ffffff;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  background-size: cover;
  background-position: left center;
}
.widget-bnl-arrangement .intro {
  padding-top: 20px;
}
/* Cursus doesn't want this gradient, since there's no text inside the head. */
.widget-bnl-arrangement .main-column .head > * {
  position: relative;
}
.widget-bnl-arrangement .main-column .head.legacy-contrast::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 42.5em;
  height: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;
  background-size: 100%;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_light::before,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_heavy::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 42.5em;
  height: 100%;
  background-size: 100%;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_light::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_light::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_light::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.3) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/gradient-left.png") repeat-y left top;/* Old browsers */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: -moz-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* Chrome10-25,Safari5.1-6 */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_heavy::before {
  background: linear-gradient(to right, rgba(0, 0, 0,.7) 0%, rgba(0, 0, 0,0) 100%);/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block {
  overflow: hidden;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > h2,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > h3,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 0 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > h3,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .content > h3,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper > h3,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > h3 + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .content > h3 + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper > h3 + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .content + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper + p {
  float: left;
  clear: both;
  margin-bottom: 3px;
  padding: 5px 10px 5px 10px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > p + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper p + p,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > .content p + p {
  display: inline-block;
  float: left;
  clear: both;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  margin-bottom: 3px;
  background-color: rgba(0, 0, 0,.5);
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .tertiary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .tertiary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > .content p + p > .tertiary {
  padding: 5px 10px 5px 28px;
  background-position: left 10px center;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block + .content > p + p > .quaternary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block .wrapper p + p > .quaternary,
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > .content p + p > .quaternary {
  padding: 5px 10px;
}
.widget-bnl-arrangement .main-column .head:not(.contrast_none).contrast_block > p {
  padding: 3px 10px 5px 32px;
  background-position: 10px 5px;
}
.widget-bnl-arrangement .head h2 {
  margin-top: 45px;
  color: inherit;
}
.widget-bnl-arrangement .head .additional {
  color: inherit;
  font-size: 1.4375rem;
}
.widget-bnl-arrangement .head + .metadata > dl.meta:first-child {
  margin-top: 0;
  padding-top: 0;
  background-image: none;
}
.widget-bnl-arrangement .metadata {
  margin-top: 13px;
}
.widget-bnl-arrangement dl.meta {
  margin-top: 20px;
  padding-top: 20px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.widget-bnl-youth .metadata {
  margin-top: 13px;
}
.widget-bnl-youth .head + dl.meta,
.widget-bnl-youth .toggler + dl.meta {
  margin-top: 0;
  padding-top: 0;
  background-image: none;
}
.widget-bnl-youth .contentlink {
  margin-top: 33px;
  margin-bottom: 33px;
}
.widget-bnl-youth dl.meta + .get-it.bordered {
  margin-top: 33px;
}
.widget-bnl-youth .get-it.bordered + .contentlink {
  margin-top: -8px;
}
.widget-bnl-youth .contentlink ul.links > li {
  margin-top: 13px;
}
.widget-bnl-youth .contentlink .get-it p.label {
  padding-right: 15em;
}
.widget-bnl-youth .contentlink .get-it p.action {
  width: 18em;
  margin-left: -18em;
}
.widget-bnl-course dl.meta,
.widget-bnl-youth dl.meta:not(:first-child) {
  margin-top: 20px;
  padding-top: 20px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.widget-bnl-youth .main-column > div.flash {
  margin-bottom: 13px;
}
.widget-bnl-youth .screenshots {
  position: relative;
  overflow: hidden;
  margin-top: 13px;
}
.widget-bnl-youth .screenshots h3 {
  padding-bottom: 10px;
}
.widget-bnl-youth .screenshots ul > li > img {
  width: 96%;
}
.widget-bnl-youth .screenshots .slidingnav {
  position: absolute;
  width: 100%;
  -webkit-transition-duration: 0.7s;
  transition-duration: 0.7s;
}
.widget-bnl-youth .screenshots .slidingnav.fadeout:after {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  content: "";
  display: block;
  width: 60px;
  height: 100%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next-bg-gradient.png") repeat-y right center;
}
.widget-bnl-youth .screenshots .sliding.interactive > li {
  float: left;
  width: 75%;
}
.widget-bnl-youth .screenshots .sliding.interactive > li {
  position: absolute;
  top: 0;
  display: none;
}
.widget-bnl-youth .screenshots .sliding.interactive > li.current,
.widget-bnl-youth .screenshots .sliding.interactive > li.current ~ li {
  display: block;
}
.widget-bnl-youth .screenshots .sliding.interactive > li.current ~ li.hidden {
  display: none;
}
/* XXX: What does this do? Remove? */
.widget-bnl-youth .rich-items {
  border: none;
}
.widget-bnl-youth .imgwrapper.app::after {
  position: absolute;
  content: "";
  display: block;
  width: 66px;
  height: 57px;
  max-width: 33%;
  max-height: 28.5%;
  right: 9%;
  bottom: 9%;
  background: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/widget/appreview-overlay.png") no-repeat right bottom;
  background-size: contain;
}
.widget-bnl-youth img.representative.app {
  border-radius: 40px;
}
@media only screen and (min-width: 635px) and (max-width: 799px) {
  .contentlink .get-it.bordered p.label,
  .contentlink .get-it.bordered p.action {
    width: auto;
    margin: 0;
    padding: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 919px) {
  .widget-bnl-youth .screenshots ul > li {
    max-width: 90%;
  }
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .widget-bnl-course .richtext,
  .widget-bnl-youth .richtext {
    clear: none;
  }
  .widget-bnl-youth img.overlay-icon {
    bottom: 8%;
    right: 7%;
  }
  .widget-bnl-youth img.representative.app {
    border-radius: 17%;
  }
}
@media only screen and (min-width: 0) and (max-width: 469px) {
  .contentlink .get-it.bordered p.label,
  .contentlink .get-it.bordered p.action {
    width: auto;
    margin: 0;
    padding: 0;
  }
}
.widget-bnl-myprofile .actionable {
  float: left;
  width: 100%;
  margin-top: 13px;
  padding-top: 13px;
  padding-right: 200px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.widget-bnl-myprofile .actions {
  float: right;
  width: 180px;
  margin-top: 13px;
  margin-left: -180px;
  padding-top: 15px;/* Same baseline as the h3 inside the .actionable */
  text-align: right;
}
.form-row + p > a.button.quaternary.back {
  margin-right: 20px;
}
.form-row #ebooks_terms + label,
.form-row #ebooks_newsletter + label {
  visibility: visible;
  width: auto;
  height: auto;
  text-indent: 0;
}
.form-row #ebooks_terms + label > em,
.form-row #ebooks_newsletter + label > em {
  overflow: hidden;
  width: 0;
  height: 0;
  text-indent: -99999px;
}
.form-row #ebooks_terms + label > em::before,
.form-row #ebooks_newsletter + label > em::before {
  content: none;
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  .widget-bnl-myprofile .actionable {
    float: none;
    padding-right: 0;
  }
  .widget-bnl-myprofile .actions {
    margin-left: 0;
    padding-top: 0;
  }
}
.widget-bnl-mb-bookshelf .message > p {
  display: inline-block;
}
.widget-bnl-mb-bookshelf .message .button {
  float: right;
  margin-top: -18px;
}
.widget-bnl-mb-bookshelf .bookshelf ul > li .medium.ebook[data-format="Download-DRM"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/formats/ebooks-e-reader.png");
}
.widget-bnl-mb-bookshelf .bookshelf ul > li .medium.ebook[data-format="Online-Watermark"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/formats/ebooks-online-lezen.png");
}
.widget-bnl-mb-bookshelf .bookshelf ul > li .medium.ebook[data-format="Download-Watermark"] {
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/icons/formats/ebooks-app.png");
}
.widget-bnl-mb-bookshelf .message.notloggedin .button {
  margin-top: -8px;
}
.widget-bnl-mb-profile .message.notloggedin .button {
  float: right;
  margin-top: -30px;
}
@media only screen and (max-width: 1200px) {
  .widget-bnl-mb-bookshelf .message .button {
    float: none;
    margin: 10px 0 0 0;
  }
}
.widget-bnl-readinglist .links > h3 {
  margin-top: 20px;
}
.widget-bnl-readinglist dl.meta {
  margin-top: 20px;
  padding-top: 10px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left top;
}
.widget-bnl-readinglist dl.meta::after {
  width: 100%;
  height: 2px;
  padding-top: 10px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
  background-repeat: repeat-x;
  background-position: left bottom;
}
.widget-bnl-readinglist .get-it {
  min-height: 60px;
  background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/lezen_voor_de_lijst_logo.png");
  background-position: left 20px center;
  background-repeat: no-repeat;
}
.widget-bnl-readinglist .get-it .action {
  margin-top: 0;
}
.widget-bnl-readinglist .get-it .action > a {
  margin-top: 16px;
}
.widget-bnl-readinglist .get-it.bordered {
  padding: 10px 20px;
}
.widget-bnl-readinglist .get-it + .metadata {
  margin-top: 0;
}
.widget-bnl-readinglist .metadata {
  margin-top: 20px;
}
@media screen and (min-width: 751px) and (max-width: 800px) {
  .widget-bnl-readinglist .get-it.bordered {
    float: left;
    background-position: top 20px center;
  }
  .widget-bnl-readinglist .get-it.bordered::before {
    display: block;
    content: "";
    height: 60px;
  }
}
@media screen and (max-width: 470px) {
  .widget-bnl-readinglist .get-it.bordered {
    float: left;
    background-position: top 20px center;
  }
  .widget-bnl-readinglist .get-it.bordered::before {
    display: block;
    content: "";
    height: 60px;
  }
}
@media screen and (max-width: 427px) {
  .widget-bnl-readinglist .buttons .button + .button {
    margin-right: 20px;
  }
  .widget-bnl-readinglist .buttons .button + .button + .button {
    margin-left: 0;
  }
}
.expandable.biebwidget > h2.label { /* Don't show a label-only h2 on large screens. */
  display: none;
}
/* adaptive ----------- */
@media only screen and (min-width: 0) and (max-width: 1240px) {
  html {
    /* Keep the halo positioned behind the logo. */
    background-position: -18px top;
  }
}
@media only screen and (min-width: 0) and (max-width: 950px) {
  #bibliotheek-nl-page {
    padding: 0 4px;
  }
}
@media only screen and (min-width: 751px) and (max-width: 950px) {
  .main-column h2 {
    font-size: 4.6rem;
  }
}
@media only screen and (min-width: 751px) and (max-width: 916px) {
  .nav.main-column-wrapper .intro img {
    max-width: 200px;
    max-height: 320px;
  }
}
@media only screen and (min-width: 635px) and (max-width: 916px) {
  .biebwidget-double-column {
    min-width: 100%;
    width: 100%;
  }
  .biebwidget-column {
    width: 49%;
  }
  .biebwidget-double-column .biebwidget-column {
    width: 52%;
  }
  .biebwidget-double-column .biebwidget-column + .biebwidget-column {
    width: 48%;
  }
  .biebwidget-double-column .biebwidget,
  .biebwidget-double-column .biebwidget-column + .biebwidget-column .biebwidget {
    margin-right: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 916px) {
  .main-column .tiny.rich-items > li {
    width: 48%;
    margin-left: 4%;
  }
  .main-column .tiny.rich-items > li:nth-of-type(3n+1) {
    clear: none;
    margin-left: 4%;
  }
  .main-column .tiny.rich-items > li:nth-of-type(2n+1) {
    clear: left;
    margin-left: 0;
  }
  .main-column .rich-items.actionable .content {
    padding-right: 0;
  }
  .main-column .rich-items.actionable .actions {
    display: inline-block;
    float: none;
    width: 100%;
    margin-top: 13px;
    margin-left: 0;
    padding-left: 220px;
    text-align: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .main-column .rich-items.actionable .content.etalage ~ .actions {
    padding-left: 100px;
  }
  .main-column .rich-items.actionable .actions > p {
    display: inline-block;
  }
  .main-column .rich-items.actionable .actions > p:first-child .primary.button,
  .main-column .rich-items.actionable .actions > p:first-child .secondary.button,
  .main-column .rich-items.actionable .actions > p:first-child .quaternary.button {
    margin-top: 0;
    margin-right: 13px;
  }
  .main-column .rich-items.actionable .actions > p:first-child + p:last-child,
  .main-column .rich-items.actionable .actions > p:first-child + form:last-child {
    margin-top: 0;
    float: right;
  }
}
@media only screen and (min-width: 751px) and (max-width: 799px) {
  .main-column-wrapper.nav dl.meta dt,
  .main-column-wrapper.nav dl.meta dd,
  .main-column-wrapper.nav dl.meta dd + dd {
    float: none;
    width: auto;
    max-width: none;
    min-width: 0;
    padding: 0;
    margin: 0 0 6px 0;
    text-indent: 0;
  }
  .main-column-wrapper.nav dl.meta dt {
    margin: 13px 0 0 0;
  }
  .main-column-wrapper.nav dl.meta dt:first-child {
    margin-top: 0;
  }
  .main-column-wrapper.nav dl.meta.dense dd + dd {
    margin: 0 0 4px 0;/* TODO: Investigate having this only as fallback, and lining out dds with flexbox? */
  }
  .main-column-wrapper.nav dl.meta dd audio {
    margin-top: 10px;
  }
}
@media only screen and (min-width: 451px) and (max-width: 750px) {
  .main-column h2 {
    font-size: 4.025rem;
  }
  /* Avoid a narrow column of text next to the intro image by making that image smaller. */
  .intro img {
    max-width: 200px;
    max-height: 320px;
  }
}
@media only screen and (min-width: 0) and (max-width: 750px) {
  /*content*/
  .main-column-wrapper {
    float: left;
    width: 100%;
    padding-bottom: 20px;
  }
  .nav-column {
    float: left;
    width: auto;
    margin-left: 0;
  }
  .nav.main-column-wrapper .main-column,
  .biebwidget-content.product .nav.main-column-wrapper .main-column {
    margin: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 634px) {
  /* mobile */
  body {
    margin: 0;
  }
  .biebwidget-column {
    width: 100%;
    max-width: 384px;
  }
  .biebwidget-double-column {
    min-width: 50%;
    width: 100%;
  }
  .biebwidget-double-column .biebwidget {
    margin-right: 0;
  }
  .biebwidget-double-column .biebwidget-column {
    width: 100%;
  }
  .biebwidget-double-column .biebwidget-column .biebwidget {
    margin-right: 0;
  }
  /*clickarea ipad-achtig en mobiel*/
  .pagenav span a,
  .pagenav .inactive {
    padding: 10px 20px;
  }
  .pagenav ol > li > a {
    padding: 10px 15px;
  }
  .pagenav ol > li.current:first-child,
  .pagenav ol > li.current:last-child,
  .pagenav ol > li.current {
    margin: 0 10px;
  }
  /*pagenav in pagina widget*/
  .main-column .pagenav ol > li {
    display: none;
  }
  .main-column .pagenav ol > li.current {
    display: inline;
  }
  .scrollablelist-wrapper.interactive .scrollablelist-container a.active img {
    display: none;
  }
  /*clickarea ipad-achtig en mobiel*/
  .richtext img {
    float: none;
  }
  .tools ul.toggle > li {
    padding-left: 5px;/* A bit more white-space to improve hitting the right button. */
  }
  .grid-items > li {
    margin-right: 10px;
    margin-bottom: 10px;
  }
  dl.meta dt,
  dl.meta dd,
  dl.meta dd + dd {
    float: none;
    width: auto;
    max-width: none;
    min-width: 0;
    padding: 0;
    margin: 0 0 6px 0;
    text-indent: 0;
  }
  dl.meta dt {
    margin: 13px 0 0 0;
  }
  dl.meta dt:first-child {
    margin-top: 0;
  }
  dl.meta.dense dd + dd {
    margin: 0 0 4px 0;/* TODO: Investigate having this only as fallback, and lining out dds with flexbox? */
  }
  dl.meta dd audio {
    margin-top: 10px;
  }
  .main-column-wrapper.nav dl.meta dt {
    width: auto;
  }
  .main-column-wrapper.nav dl.meta dd {
    max-width: none;
  }
  .main-column-wrapper.nav dl.meta dd + dd,
  .main-column-wrapper.nav dl.meta.dense dd + dd {
    margin-left: 0;
  }
  .main-column .small.rich-items:not(.sliding) > li {
    width: 100%;
    margin-left: 0;
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
    background-repeat: repeat-x;
    background-position: left top;
  }
  .main-column .small.rich-items:not(.sliding) > li:first-child {
    background-image: none;
  }
  .main-column .small.rich-items:not(.sliding) > li:nth-of-type(2n+1) {
    clear: none;
    margin-left: 0;
  }
  .unimportant.biebwidget {
    display: none;
  }
  .widget-columns .expandable .biebwidget > h2 {
    cursor: pointer;
    background: transparent url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/nav-next.png") no-repeat 9px center;
  }
  .widget-columns .expandable .biebwidget > h2.open {
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/dropdown.png");
    background-position: 7px center;
  }
  .expandable.biebwidget > h2.label {
    display: block;/* Do show the label-only h2 when needed to expand the widget. */
  }
  .standard.expandable.biebwidget > h2.label +  {
    padding: 0 20px 20px 20px;
  }
  .expandable.biebwidget >  {
    display: none;
  }
  .expandable.biebwidget > p.endorsement {
    display: none;
  }
  .expandable.open.biebwidget >  {
    display: block;
  }
  .expandable.open.biebwidget > p.endorsement {
    display: block;
  }
  .expandable.open.biebwidget >  .tabs.alt {
    border-radius: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 569px) {
  .main-column .tiny.rich-items > li,
  .biebwidget-double-column  .main-column .tiny.rich-items > li {
    width: 100%;
    margin-left: 0;
    background-image: url("https://www.bibliotheek.nl/etc/designs/styles/bnl/clientlibs/images/bg-dotted.png");
    background-repeat: repeat-x;
    background-position: left top;
  }
  .main-column .tiny.rich-items > li:first-child,
  .biebwidget-double-column  .main-column .tiny.rich-items > li:first-child {
    background-image: none;
  }
  .main-column .tiny.rich-items > li:nth-of-type(3n+1),
  .main-column .tiny.rich-items > li:nth-of-type(2n+1),
  .biebwidget-double-column  .main-column .tiny.rich-items > li:nth-of-type(3n+1),
  .biebwidget-double-column  .main-column .tiny.rich-items > li:nth-of-type(2n+1) {
    clear: none;
    margin-left: 0;
  }
}
@media only screen and (min-width: 0) and (max-width: 450px) {
  .main-column h2 {
    font-size: 3.3542rem;
  }
  .main-column h2.long {
    font-size: 3.3542rem;
  }
  /* Avoid a narrow column of text next to any content image by making that img a block. */
  .main-column .richtext .intro img,
  .main-column .richtext img,
  .main-column .richtext img.offset {
    float: none;
    clear: both;
    margin-right: 0;
    margin-left: 0;
  }
  .main-column .richtext .intro img {
    max-height: 614px;
    max-width: 100%;
  }
  .main-column .rich-items .content:not(.calendar),
  .main-column .rich-items .content.list-big,
  .main-column .rich-items .content.etalage,
  .main-column .small.rich-items .content:not(.calendar),
  .main-column .tiny.rich-items .content:not(.calendar) {
    padding-left: 0;
  }
  .main-column .rich-items .content:not(.calendar):before {
    /* Carve out space for the img */
    content: "";
    float: left;
    width: 80px;
    height: 85px;
  }
  .main-column .rich-items .viz img,
  .main-column .rich-items .viz img.cover {
    max-width: 60px;
    max-height: 80px;
  }
  img.shrinkable,
  img.cover.shrinkable {
    max-width: 80px;
    max-height: 107px;
  }
  .main-column .rich-items .viz .coverplaceholder:not(.list) {
    width: 50px;/* Shrink all coverplaceholders in rich-items lists, except for the smallest size. */
    height: 80px;
    font-size: 0.9583rem;
  }
  .main-column .rich-items .viz .coverplaceholder.music:not(.list),
  .main-column .rich-items .viz .coverplaceholder.album:not(.list),
  .main-column .rich-items .viz .coverplaceholder.cdsingle:not(.list) {
    height: 50px;
  }
  .coverplaceholder.shrinkable:not(.list):not(.extrasmall) {
    width: 80px;/* Shrink all coverplaceholders in rich-items lists, except for the smallest size. */
    height: 128px;
    font-size: 1.0542rem;
  }
  .coverplaceholder.shrinkable.music:not(.list):not(.extrasmall),
  .coverplaceholder.shrinkable.album:not(.list):not(.extrasmall),
  .coverplaceholder.shrinkable.cdsingle:not(.list):not(.extrasmall) {
    height: 80px;
  }
  .main-column .rich-items .content.calendar:before {
    display: none;
  }
  .main-column .rich-items .content.calendar h3 {
    margin-right: 0;
  }
  .main-column .rich-items .content.calendar img.offset {
    display: none;
  }
  .main-column .rich-items.actionable .actions,
  .main-column .rich-items.actionable .content.etalage ~ .actions {
    padding-left: 0;
  }
}