:root  {
  --rozerood: #b4006f;
  --paars: #44195b;
  --heldergeel: #f8db00;
  --blauwgroen: #007399;
  --groen: #00673b;
  --blauw: #4877af;
  --rozerood: #b4006f;
  --lichtgrijs: #d5dad6;
  --grijs: #b0b1b2;
  
  --header__sidebar: var(--groen);
}

.page {
    padding-bottom: 2cm;
}

#bbr-product, #bbr-acronym {
    color:var(--heldergeel);
    text-align:left;
    text-transform:initial;
    letter-spacing:initial;
    font-size:2.9vw;
    font-weight:normal;
    margin:0;
    padding-left:.5em;
}
@media screen and (min-width: 1000px) {
    #bbr-product, #bbr-acronym {
        font-size:1.75em;
    }
}
@media screen and (min-width: 900px) and (max-width: 1150px) {
  #bbr-product .authors {
    display:none;
  }
}
@media screen and (max-width: 700px) {
  #bbr-product {
    margin-top: .35em;
    display:inline-block;
    font-size:3.5vw;
  }
  #bbr-product .authors {
    display:none;
  }
  .hamburger {
    
  }
}
#bbr-product strong {
    color: #fff;
}
#header-content {
    background-color: var(--paars);
}
header {
    background-color: var(--groen);
}
h1 .article-type, h1 .chapter-label {
    color:#ddd;
}
h1.title {
    background-color: var(--blauwgroen);
    color:#fff;
}
nav, 
h1.title {
      border-top: solid .35rem var(--rozerood);

}
h1.author {
    background-color: var(--rozerood);
    color:white;
}
h2 {
    color: var(--paars);
}
.referencesPane h2 {
  display:none;
}
h3 {
    color: var(--groen);
    font-weight:bold;
}
a {
    color: var(--rozerood);
}
dt {
    font-weight:bold;
}
a:hover {
    border-bottom: .25em solid var(--rozerood);
}
details li a {
    color: var(--groen);
}
details li a:hover {
    border:none;
    background-color:var(--rozerood);
    color:var(--heldergeel);
    padding:.1em .4em;
}
.letters a {
    color: var(--blauw);
    border-color: var(--heldergeel);
}
h1 .article-type {
    color: var(--rozerood);
}
.affiliation {
    color:var(--blauw);
}
nav, nav ul {
    background-color: #4b4b4a;
}
.navbutton svg {
    border:solid .08em #999;
    border-radius:.25em;
    background-color: var(--blauwgroen);
}
.navbutton svg:hover {
    background-color:var(--rozerood);
}
.navbutton.disabled svg, .navbutton.disabled svg:hover {
    background-color: #4b4b4a;
}
.navbutton svg path {
    fill:#fff;
}

ol {
    padding-left:1.5em;
    margin-top:0;

}
ol ol {
    padding-left:2em;
}

@media screen and (max-width: 450px),(min-width: 900px),(max-height:600px) {
    nav ul li {
        border-bottom: solid 1px var(--blauw);
    }
}

nav ul ul li {
    border-bottom: solid 1px var(--blauw);
}
nav ul ul li:hover {
    background-color: var(--rozerood);
}
nav li a, nav li a:link, nav li a:visited, nav li a:hover {
    color: var(--heldergeel);
}
nav ul li:visited, nav ul li:hover {
    background-color: var(--rozerood);
}

nav ul ul {
    background-color: var(--blauw);
}
nav ul ul li a, nav ul ul li a:link, nav ul ul li a:visited, nav ul li:hover a {
    color:var(--heldergeel);
}

#submenu svg, #subburger svg, #back-to-top svg {
    border: solid 1px var(--rozerood);
    border-radius: .25em;
    background-color: var(--blauw);
    height: 35px;
    width: 35px;
}
#subburger svg path, #back-to-top svg line, #back-to-top svg path {
    stroke:#fff;
    fill:#fff;
}
.metadata-area {
    padding: 0 8.5%;
}
#search:hover #search-svg, #search a:hover {
    fill: #fff;
    border-bottom: none;
}
#jb-logo {
    fill: #fff;
}
details {
    margin:0 2.5em 1em 0;
}
details li {
    font-weight:bold;
    list-style-type: none;
    margin-left:7.75em;
    text-indent:-6.25em;
}
details li a:hover {
    margin-left:-.4em;
}
ul.toc {
    margin-bottom:1em;
}
.caption-label {
    color: var(--rozerood);
}
summary .caption-label {
    color: var(--paars);
}
summary {
    margin-left:6.25em;
    text-indent:-6.25em;

}
a:hover .caption-label {
    color: #eee;
}

.showkey {
    color:var(--groen);
    font-weight:bold;
}
.answer-set .label {
    border: 1.5px solid var(--blauw);
    color:var(--blauw);
    background-color:#fff;
}
.key .list-item {
    margin-bottom: .5em;
}
.list-item-content p {
    padding-left: 0;
}
.list-item-label {
    padding-right:.5em;
}
/*.list-item-label {*/
/*    min-width:2em;*/
/*}*/
.explanation {
    color: var(--groen);
}
.list-item.question {
    margin-bottom:.5em;
}
.question .list {
    margin-top:0;
    margin-bottom:0;
    clear:initial;
    width:auto;
}
.list .columns {
    -webkit-column-width: 160px;
       -moz-column-width: 160px;
            column-width: 160px;
}
.grammaticality-marker {
    margin-left:0;
}
p > .grammaticality-marker {
    margin-left:-0.4em;
    position:static;
}
#mc-trigger:checked ~ p span.label.correct {
    background-color: #335525;
    border: 1.5px solid #335525;
    color:white;
}

label div {
    margin-top:2em;
}
code {
    color:var(--blauw);
    white-space: pre;
    font-size:.9em;
}
p > code {
    font-size:1em;
}
ul.toc {
    padding-left:0;
    display:inline-block;
    text-indent:0;
    list-style-type:none;
    line-height:2em;
}
p {
    text-align:left;
}
table {
    background-color:inherit;
    border-color:#ddd;
}
table.array {
    margin-top:0em;
    margin-bottom:0em;
    font-size:inherit;
    line-height:1.75em;
    border-top:none;
    border-bottom:none;
    border:none;
    background-color:transparent;
    width:inherit;
    display:inline;
}
table.array td {
    border-bottom:none;
    padding:0;
    padding-right:0.5em;
    text-align:left;
    vertical-align:top;
}
.no-rules {
    border-top:none;
    border-bottom:none;
    border:none;
    background-color:#fff;
}
.no-shade {
    border-top:none;
    border-bottom:none;
    border:none;
    background-color:#fff;
}

.small {
    font-size:0.8em;
}
.array {
    display:table;

}
.table-wrap.panel {
    text-align:initial;
    margin-top:0;
}
th {
    border-bottom:solid 1px var(--blauw);
    border:none;
    background-color: var(--blauw);
    color:#fff;
    padding-left:0;
    text-align:inherit;
}
td:first-child, th:first-child {
    padding-left:.5em;
}
td:last-child, th:last-child {
    padding-right:.5em;
}
td {
    padding-top:.5em;
    padding-bottom:.25em;
    text-align:inherit;
    padding-right:0.2em;
    min-width:1.5em;
}
tbody:last-of-type tr:last-child td {
    padding-bottom:.25em;
}
tbody { border-top: solid 1px #ddd;
}

.refyear {
    color:var(--groen);
}
.svg-nav-toggle {
    fill: var(--lichtgrijs);
}
@media screen and (min-width: 1366px) {
    .imageContainer {
         position: inherit; 
    }
    #bbr-product {
      padding-left: .5em;
    }
}

@media screen and (max-width: 900px) and (min-width:701px) {
    #bbr-product, #bbr-acronym {
        padding:.66em 1em;
}
    nav, nav ul {
        background-color: #eee;
    }
    nav li a, nav li a:link, nav li a:visited, nav li a:hover {
        color: var(--groen);
    }
    nav li a, nav li a:link, nav li a:visited, nav li a:hover {
        color: var(--groen);
    }
}
@media screen and (max-width: 450px) {
    nav ul li {
        border-bottom: solid 1px var(--blauw);
    }
    #bbr-acronym {
        font-size:4vw;
        padding:.0 0 0 .5em;
        display:inline-block;
    }
    .coverlogo {
        width:113px;
        height:150px;
    }

}