:root {
  
    --jb-blauw: #253776;
    --nav-groen: #335525;
    --nav-rood: #7c2529;
    --nav-lichtblauw: #6068b2;
    --navnoglichterblauw: #a7a4e0;
    --nav-lichtgroen: #9abb91;
    --bbr-geel: #e1bb4b;
    --bbr-rood: #9e2330;
    --bbr-lichtblauw: #4bafe8;
    
    --header__jb-logo-fill:#eee;

/* measurement variables */
    --navbar-width: 225px;
    --main-width: 1000px;
    --headerbar-height: 65px;
    --headerbar-lineheight:1.1em;
    --border-thickness:.07em;
    --main-page-margins:1cm;
    --footer-height:4.5em;
    --font-size: 12pt;
    --menu-height:50px;
    --search-width:var(--headerbar-height);
    
    --breakpoint-toc-in-aside: 1200px;
    overflow:hidden auto;
}
/*  experimental environment variables, for use in @media queries (no IE support) */
/*env( --breakpoint-monitor-xl: 1500px )
env( --breakpoint-monitor-l: 1250px )
env( --breakpoint-monitor-m: 1000px )
env( --breakpoint-tablet-l: 900px )
env( --breakpoint-tablet-m: 750px )
env( --breakpoint-phone-l: 600px )
env( --breakpoint-phone-m: 450px )
env( --breakpoint-phone-s: 350px )
*/

.client-authmsg {
    font-size:80%;
    color:#000;
    color:var(--navigation__auth-text,#000);
    line-height:1.2em;
    padding:1em;
    margin:1em .5em 0;
}

.client-ip {
    font-family:Courier;
    overflow-wrap:anywhere;
}

*, *::before, *::after {
    box-sizing: border-box;
}
*[data-target] {
  cursor:pointer;
}
body {
  display: grid;
  line-height: 1.75em;
  background-color: var(--page__canvas-background,#c0c0c0);
  margin:0;
  height:100vh;
  overflow-y:hidden;
   grid-template-areas: 
      'header-left header header-right'
      'menu main main'
      'menu footer footer';
    grid-template-columns:var(--navbar-width) 1fr var(--headerbar-height);
    grid-template-rows:var(--headerbar-height) 1fr minmax(0,max-content);    
}
body::before {
    content: "";
    background-color:var(--header__sidebar);
    grid-area:header-left;
}
body::after {
    content: "";
    background-color:var(--header__sidebar);
    grid-area:header-right;
}
.logo-container {
  grid-area:header-left;
  margin:auto 1rem;
  
}
nav {
  grid-area:menu;
  width:100%;
  height:100%;
	font-weight: bold;
	line-height:2.5em;
	transition: all .5s ease-in-out;
	background-color: var(--navigation__background,#eee);
}
aside {
	background-color: var(--page__canvas-background,#eee);
	overflow-y:auto;
	padding:.5em 1em;
	font-size:.85em;
	display:none;
	grid-area:right;
}
aside.toc > ul {
  text-indent:-1.2em;
  padding-inline-start:1.2em;
}
main {
  grid-area:main;
  line-height:inherit;
  overflow: hidden auto;
  background-color:white;
  height:100%;
}
main > div {
  padding:0;
}

/*  headers */
body > header {
    grid-area: header;
    background-color:var(--header__background);
    color:white;
/*    text-align:center;*/ /*commented out BO 2023-07-06 for books webview (e.g. clcc)*/
    line-height:var(--headerbar-lineheight);
    vertical-align:middle;
    display:flex;
    position:sticky;
    top:0;
}
#header-content {
  width:100%;
    font-weight:bold;
    background-color: var(--header__content-background,#777);
}
#jb-logo {
    fill: #ddd;
    fill: var(--header__jb-logo-fill,#666);
    -webkit-transition: fill .2s ease-out;
    -moz-transition: fill .2s ease-out;
    -o-transition: fill .2s ease-out;
    transition: fill .2s ease-out;
}
#jb-logo:hover {
    fill: #fff;
    fill: var(--header__jb-logo-hover,#fff);
}
#bbr-logo {
	background-color:transparent;
    position: absolute;
    padding-left:1.2em;
}
#bbr-topbar {
    display:flex;
    margin:auto;
    height:100%;
    align-items:center;
}
#bbr-topbar a:hover {
  border:none;
}
#bbr-product, #bbr-title {
  display:inline;
	color: #ddd;
	color: var(--header__title,#ddd);
	text-align: left;
	font-size: 2.2rem;
	padding: .33rem .6rem 0 1rem;
}
#bbr-acronym {
	text-align: right;
	padding: 0;
	padding-top: .45em;
	padding-right: .6em;
	line-height: 1.6em;
    display:none;
    font-size:1.45em;
    color:#eee;
}

div#search {
  grid-area:header-right;
  background-color:var(--header__sidebar);
  z-index:2;
  padding:.5em;
  text-align:left;
}
#header-title a {
    word-break:keep-all;
    color:#fff;
    color: var(--header__title,#fff)
}
#header-authors {
    padding:2% 1em;
    color:#000;
    color: var(--header__authors,#000);
}
#bookcode {
    position:absolute;
    bottom:0;
    right:0;
    background-color:#e9e9e9;
    background-color:var(--header__bookcode-background,#e9e9e9);
    color:#666;
    color:var(--header__bookcode-text,#666);
    font-size:.8em;
    letter-spacing:1.5px;
    padding:0 .5em;
}
.hamburger {
  display:none;
}
/*  footer business */
body > footer {
  color: #eee;
  background-color:var(--footer__background);
  grid-area:footer;
}
footer {
    font-size: .8em;
    overflow-y:auto;
}
footer.no-fulltext {
    border-left:.3em solid red;
    border-radius:.25em;
    background-color:#dee;
    margin-top:2em;
    padding:.5em 1em;
}
#article-footer, #issue-footer {
    line-height: 1.5em;
    padding: .5em 8.5%;
}
#article-footer a, #issue-footer a {
    color: #9ccef3;
    color: var(--footer__doilink,#9ccef3);
}
footer > #filterbox {
  margin:0 7.5%;
}
fieldset.filterbox {
  background-color:inherit;
  border:none;
}
fieldset.filterbox legend {
  color:white;
  
}
fieldset.filterbox input {
  padding:0 .5em;
  background-color:#def;
}
fieldset.filterbox input:focus {
  outline:none;
}
.letters button {
  margin-inline-end:.35em;
}
.letters {
  line-height:3em;
}
button.letter {
  margin-top:1em;
  
}
li.article + *.letter{
  margin-top:1em;
}
.found {
    background-color: yellow;
}
#printerfriendly {
	font-weight: bold;
	font-family: Verdana, Myriad, sans-serif;
	font-size: .8em;
	border: 1px solid #666666;
	color: #FFFFFF;
	background-color: #e1bb4c;
	padding: .35em .7em;
	cursor:pointer;
}
.button {
    text-align:center;
    margin:1em .5em;
}
.svg-nav-toggle {
	fill: #fff;
	height:22px;
	width:32px;
    pointer-events: all;
    cursor: pointer;
}
.svg-sub-toggle path {
    stroke-width:0;
    transition: all .5s;
}
#submenu svg, #subburger svg, #back-to-top svg, .navbutton svg {
    border: solid .12em #bbb;
    border: solid .12em var(--navigation__fullscreen-icon-outline,#bbb);
    border-radius:.25em;
    background-color:#9ccef3;
    background-color:var(--navigation__fullscreen-icon-background,#9ccef3);
    height:35px;
    width:35px;
    opacity:.5;
}
.navbutton svg path {
    fill:#fff;
    fill: var(--navigation__navigation-icon-arrows,#fff);
}
.navbutton a:hover {
    border-bottom:none;
}
.client-container:hover {
    background-color:transparent;

}
/* moved into grid in book-web.css */
/*div.navbutton {
    margin-top:3em;
    position:fixed;
    bottom:15px;
    font-size:1.2em;
}
*/
.disabled svg path {
    fill:#666;
}
#to-end path, #to-end rect, #next-chapter path {
    fill:#f5d30f;
}

#subburger svg path, #back-to-top svg line, #back-to-top svg path {
    stroke:#253776;
    stroke:var(--navigation__fullscreen-icon-arrows-outline,#253776);
    fill:#253776;
    fill:var(--navigation__fullscreen-icon-arrows,#253776);
}
#search svg {
    height: 48px;
    width:auto;
    
    fill: #eee;
    fill: var(--header__search-icon, #eee);
    -webkit-transition: fill .2s ease-out;
    -moz-transition: fill .2s ease-out;
    -o-transition: fill .2s ease-out;
    transition: fill .2s ease-out;
}
#search svg:hover {
    fill: #fff;
    fill: var(--header__search-icon--hover, #fff);
}
#search a:hover{
    border-bottom: none;
}
#nav-trigger, #sub-trigger, #subburger {
    display: none;
}
#nav-trigger:checked ~  nav {
    display: block;
    margin-inline-start:0;
}

.svg-nav-toggle .bar {
  -webkit-transform: rotate(0) translateY(0) translateX(0);
  transform: rotate(0) translateY(0) translateX(0);
  opacity: 1;
  -webkit-transform-origin: 20px 10px;
  transform-origin: 20px 10px;
  -webkit-transition: -webkit-transform 0.4s ease-in-out, opacity 0.2s ease-in-out;
  transition: transform 0.4s ease-in-out, opacity 0.2s ease-in-out;
}
.svg-nav-toggle .bar:nth-of-type(1) {
  -webkit-transform-origin: 20px 10px;
  transform-origin: 20px 10px;
}
.svg-nav-toggle .bar:nth-of-type(3) {
  -webkit-transform-origin: 20px 20px;
  transform-origin: 20px 20px;
}

input[id=nav-trigger]:checked ~ header .svg-nav-toggle .bar:nth-of-type(1) {
  -webkit-transform: rotate(-45deg) translateY(0) translateX(0);
  transform: rotate(-45deg) translateY(0) translateX(0);
}
input[id=nav-trigger]:checked ~ header .svg-nav-toggle .bar:nth-of-type(2) {
  opacity: 0;
}
input[id=nav-trigger]:checked ~ header .svg-nav-toggle .bar:nth-of-type(3) {
  -webkit-transform: rotate(45deg) translateY(0em) translateX(0em);
  transform: rotate(45deg) translateY(0em) translateX(0em);
}
.frame-affiliate-logo {
  display:inline-block;
  text-align:center;
  height:var(--headerbar-height);
  width:auto;
  padding:0 1.2em;
}
.frame-affiliate-logo  svg {
  height: var(--headerbar-height);
}
.frame-affiliate-logo + a #bbr-title {
  margin-inline-start:0;
  padding-left:0;
}

#demo {
	border:solid 2px #90c2e1;
	color:#90c2e1;
	padding:2px;
	cursor:pointer;
	text-indent: -2em;
}
nav > ul {
	list-style: none;
/*	background-color:#ddd;*/
	width:100%
  display:inline-table;
  box-shadow:none;
  padding-left:0em;
  padding-right:0em;
  background-color: #eee;
  background-color: var(--navigation__background,#eee);
  margin-top:1.37em;
}
nav > ul:after {
	content: ""; clear: both; display: block;
}
nav > ul li {
	float:none;
	border-bottom: solid 1px #90c2e1;
  border-bottom: solid 1px var(--navigation__list-item-separator, #90c2e1);
	position:relative;
	z-index:3;
}
nav > ul ul li {
  border-bottom: solid 1px var(--navigation__list-item-separator, white);
}

nav > ul li:last-of-type {
    border-bottom:none;
}
/* books ul ul background */
nav > ul ul {
	border-radius: 0px;
	padding: 0;
    display:inline-table;
    display:none;
    position: absolute;
    left: 100%;
    top:0;
	text-indent:1em;
    background-color: #83887c;
    background-color: var(--navigation__sub-background,#83887c);
    color:#000;
    min-width:17em;
}
nav > ul li:hover a {
    color:#fff;
    color:var(--navigation__list-item-text-hover,#fff);
}

nav > ul li a {
	display: block;
	padding: .25em 1em;
    color:#986769;
    color:var(--navigation__list-item-text,#986769);
	text-decoration: none;
}
nav > ul li:hover > ul, nav > ul li:focus > ul {
	display: inline-table;
	-webkit-animation-name: comein;
	-webkit-animation-duration:.5s;
	animation-name: comein;
	animation-duration:.5s;

}
nav a.nolink {
	text-decoration:none;
	background-color:inherit;
}
nav > ul li:hover {
    background-color: #aeb862;
    background-color: var(--navigation__list-item-box-hover,#aeb862);
}
nav > ul li li:hover {
    background-color: #831b30;
    background-color: var(--navigation__sub-list-item-box-hover,#831b30);
}

nav > ul li:hover li a{
    color:#fff;
    color:var(--navigation__sub-list-item-text,#fff);
}

nav > ul li:hover li:hover a {
    color:#fff;
    color:var(--navigation__list-item-text-hover,#fff);
}
nav > ul li:hover li:hover a:hover {
    color: var(--navigation__sub-list-item-text-hover);
}
/*.scroll-wrapper {
	-webkit-overflow-scrolling: touch;
  	overflow-y:auto;
    width: calc(100% - 125px);
    height:100%;
    position:relative;
}*/
#back-to-top {
    position:absolute;
    top:-22px;
    right:7px;
    transition:all .5s;
    z-index:2;
}
#back-to-top.active {
    position:fixed;
    top:initial;
    bottom:55px;
    right:7px;
    cursor:pointer;
}

#back-to-top.active svg {
    background-color:#9e2330;
    background-color:var(--main-content__up-icon-background-active,#9e2330);
    opacity:.5;
}

#back-to-top.active path, #back-to-top.active line {
    fill:#fff;
    fill:var(--main-content__up-icon-arrows-active,#fff);
    stroke:#fff;
    stroke:var(--main-content__up-icon-arrows-active,#fff);
    }

#content {
    display: block;
    height:100%;
    width:100%;
    overflow-y: hidden;
}

div.topbar {
	text-align:	right;
	padding-right:	2em;
}

#submenu {
	width: 125px;
	background-color: #eee;
	padding:0;
    padding-top: 2em;
    height: 100%;
    display: inline-block;
    float: left;
    transition: all .5s;
    position:relative;
}
div.submenu {
	color: black;
	text-align: left;
	padding: 0;
	margin:0;
	padding-left: .75em;
	padding-top: .5em;
}
div.subsubmenu {
	color: black;
	text-align: left;
	padding: 0;
	margin:0;
	padding-left: .75em;
	line-height:2em;
}
nav#topbar {
    font-size:1em;
    text-align: right;
}
nav#topbar ul {
    clear: inherit;
    background-color: transparent;
    box-shadow: 0 0 0px rgba(0,0,0,0);
    margin: 0;
}
nav#topbar li a, nav#topbar li a:link,nav#topbar li a:visited {
    color:white;
    font-size:.85em;
    font-weight: normal;
    padding: 0 1em;
}
nav#topbar li a {
    border-right:1px solid #ccc;
}
nav#topbar li:last-child a, nav#topbar li:last-child a:link, nav#topbar li:last-child a:visited {
    border-right:0;
}

nav#submenu {
    position:inherit;
    height: 100%;
    display: inline-block;
}

.logo-container a:hover{
	border-bottom: none;
}
li .logo-container {
    position:static;
    float:none;
    top:inherit;
    padding:.5em 0;
    margin: 0 -.25em;
    width:var(--navbar-width);
    height:3em;

}
li .logo-container #jb-logo {
    transition: fill 0.5s ease;
    fill: #253776;
}
.journal-logo {
    margin:0;
    height:var(--headerbar-height);
    width:auto;
    padding:.35rem 1em;
}
.journal-logo svg {
	height:100%;
	width:inherit;
}


/*
img#logo {
    height: 65px;
    width:105px;
    border:0;
    padding:0;
}
#logo > img {
	transition: height 0.5s;
}
*/
.bbr tr {
	padding: .5em;
}
table.topbar {
	width: 100%;
	background-color: #e1bb4b;
	color: 444;
}

th {
	line-height:1.65em;
	color:#253776;
	padding:.5em 0;
}

.bbr span.title {
	padding-top: .35em;
	padding-right: 1em;
	padding-bottom: .5em;
	margin: 0em;
	display: block;
	color: #eee;
	text-align:	left;
	font-size:	1.2em;
	font-weight: bold;
	hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	-webkit-hyphens: none;
}


img.bbr {
	height: 42px;
}

.topbar img {
	padding-left:5%;
}

.bbr {
	color: red;
	padding: 0cm ;
	margin: 0;
	border: none;
}

/* anchor styles */

#topbar a {
	color: white;
	font-size:	.85em;
}
#topbar a:hover, nav a:hover {
    border-bottom: none;
}

.submenu a {
	color: #9e2330;
	font-weight: bold;
}

.subsubmenu a {
	color: #e1bb4b;
	font-weight: bold;
	font-size:1.1em;
	line-height:2em;
}
div.jblogo {
    margin-top:1.5em;
}
a.jblogo:hover img {
	background-color:#fff;
	border-bottom:0;
	border-collapse:collapse;
}
a.login-button {
    border:1px solid transparent;
    background:#999;
    background:var(--navigation__login-box,#999);
    color:#fff !important;
    color:var(--navigation__login-text,#fff) !important;
    -webkit-transition: background .1s ease-out;
    -moz-transition: background .1s ease-out;
    -o-transition: background .1s ease-out;
    transition: background .1s ease-out;
}
a.login-button:hover {
    /*    border:10px solid #7d90c7 !important; commented out 15.02.17 pva*/
    background:#333;
    background:var(--navigation__login-box-hover,#333);
    color:#fff !important;
    color:var(--navigation__login-text-hover,#fff) !important;
}
aside .metrics {
  margin-top:18pc; /* to let it sink under the cover image */
  line-height:1.75em;
}
aside .metrics p {
  text-align:left;
}

body > logos, body > svg-set {
  display:none;
}


/* ******************* MEDIA QUERIES ******************* */

@media screen and (max-width: 1000px) {
    #header-authors {
        visibility:hidden;
        display:none;
    }
}

@media screen and (max-width: 900px) and (min-width:701px) {
    body {
        grid-template-areas: 
          'header header-right'
          'menu menu'
          'main main'
          'footer footer';
        grid-template-columns: 1fr var(--search-width);
        grid-template-rows:var(--headerbar-height) auto 1fr minmax(0,max-content);
    }
    body::before, body::after {
    display:none;
    }
    .client-authmsg {
        display:none;
    }
    #bbr-title, #header-title {
        padding-left:0;
        font-size:4vw;
    }

    body > .logo-container {
      display:none;
    }
    #header-content > .logo-container {
        display:none;
    }
    .navigation {
        width: 100%;
        max-width: 1000px;
        position: absolute;
        background-color:#ccc;
        left: 0;
    	padding:0;
    	height:30px;
    }
    nav {
        margin: auto;
        font-size: 1.05em;
        font-weight: bold;
        line-height: 1.8em;
        color: white;
        clear: both;
        text-align: left;
    	height:auto;
        z-index: 999;
        }

    nav > ul {
        position:relative;
        display:inline-table;
        background-color: #eee;
        background-color: var(--navigation__background,#eee);
        /* background-color:#ccc */
        padding-left:7%;
        box-shadow:none;
        margin:0;
        padding-top:0;
    }
    nav > ul li {
        float:left;
        border-bottom:none;
    }
    nav > ul li a {
        display:inline;
        color:#253776;
        padding:.25em .75em;
        color:#986769;
        color:var(--navigation__list-item-text,#986769)
    }
    nav > ul li:last-of-type a {
        border:none;
    }
    nav > ul li a:hover {
        text-decoration:none;
        border-bottom:none;
        color:purple;
    }
    nav > ul ul {
        border-radius: 0px;
        padding: 0;
        position: absolute;
        top: 100%;
        left:0;
        display: none;
        text-indent:0;
    }
    nav > ul li:hover > ul, nav > ul li:focus > ul {
    	display: block;
    	-webkit-animation-name: comein;
    	-webkit-animation-duration:.5s;
    	animation-name: comein;
    	animation-duration:.5s;
    }
    nav > ul ul li {
        float: none;
        border-bottom: 1px solid #bbb;
        position: relative;
        line-height:2.5em;
    }
    nav > ul ul li:hover {
        background-color:#335525;
        background-color:var(--navigation__sub-list-item-box-hover,#335525);
    }
/*    nav > ul ul li a, nav > ul ul li a:link, nav > ul ul li a:visited, nav > ul li:hover a {
    	color:white;
        color:var(--navigation__list-item-text-hover,#fff); /\*added 6/3/17, see: nav > ul ul li a, nav > ul ul li a:link, nav > ul ul li a:visited, nav > ul li:hover a  *\/
    }*/
}
@media screen and (max-width: 800px) {
    h1#bbr-product {
        font-size:1.35em;
    }
h1, h1.title.compact, h1.title, h1.author, div.author, h1.translator {
    padding: 2% 5vw;
    }
}
@media screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .hamburger {
      margin-inline-start:2.5vw;
    	z-index:1000;
      padding:.5em;
      margin:0;
      position:fixed;
      top:0;
      left:0;
    }
    .hamburger svg {
        width: 7.5vh;
        height: 7.5vh;
        min-width: 24px;
        min-height: 24px;
    }
    #bbr-title {
        padding-top:.2em;
    }
    #bbr-acronym {
        font-size: 6.5vh;
    }
}
@media screen and (max-height: 600px) and (orientation:landscape)  {
  :root {
    --headerbar-height:11vh;
  }
    #search svg {
        width:8vh;
        height:8vh;
    }
    li .logo-container {
        width: 150px;
    }
    #bbr-title {
        padding-top:1.5vh;
    }
}
@media screen and (max-width: 725px) {
    h1#bbr-product {
        text-transform: inherit;
        letter-spacing:normal;
    }
	nav > ul {
	/*background-color: #ccc;*/
  background-color: #eee;
  background-color: var(--navigation__background,#eee);
	}
    nav > ul li a:hover {
        font-weight: bold;
    }
}
@media screen and (max-width: 700px) {
  :root {
    --navbar-width: 200px;
  }
    body {
        grid-template-areas: 
          'header header header-right'
          'menu main main'
          'menu footer footer';
        grid-template-columns: auto 1fr var(--search-width);
        grid-template-rows:minmax(50px,10vw) 1fr minmax(0,max-content);
    }
    
  .frame-affiliate-logo{
    display:none;
    }
    .frame-affiliate-logo + a #bbr-title {
      padding-left:2.5em;
      line-height:2.5em;
    }
  body > header {
    line-height:1.65em;
    height:100%;
  }
/*  
    #bbr-acronym {
        display:inline;
    }
    #bbr-product {
        display:none;
    }
*/    #bbr-title {
        font-size:7.5vw;
        display:inline-block;
        padding-left:1rem;
        line-height:1em;
        margin-inline-start:0;
    }
  .frame-affiliate-logo + a #bbr-title {
    line-height:2em;
  }
    img#logo {
        height:30px;
        width:50px;
    }
    .journal-logo {
        margin:0;
        height:10vw;
        width:auto;
    }
    .logo-container {
      grid-area:footer;
        width:125px;
        height:20px;
        margin-inline-start:.5em;
        margin-top:.5em;
    }
    nav#topbar li a, nav#topbar li a:link, nav#topbar li a:visited {
        color:#fff;
    }
    header {
        height: 50px;
    }
    .navigation {
        top: 10vw;
    }
    input#nav-trigger:checked ~ nav {
      display:inline-table;
    }

    .hamburger {
    	width:36px;
    	height:36px;
    	z-index:1000;
        padding:.5em;
        margin:0;
        position:fixed;
        top:.7vw;
        left:10px;
        display:inline-block;
    }
    #bbr-topbar {
      display:inline-block;
      height:100%;
    }
    #header-content {
        padding-top:0;
    }
    div#search {
      text-align:center;
    }
    #search svg {
      height: 8vw;
      min-height:25px;
    }
    nav {
    	line-height:2.5em;
    	transition: margin .5s ease-in-out;
    	margin-inline-start: calc( 0px - var(--navbar-width) ); 
    	}
    nav > ul {
        display:inline-table;
    	/*background-color: #eee;*/
      background-color: #eee;
      background-color: var(--navigation__background,#eee);
    	width:100%;
        box-shadow:none;
        padding-left:0em;
        padding-right:0em;
    }
    nav > ul > li {
    	float:none;
    	border-bottom: solid 1px var(--navigation__list-item-separator, #90c2e1);
    	position:relative;
    	width:var(--navbar-width);
    }

    nav > ul li:last-of-type {
        border-bottom:none;
    }
    nav li a, nav li a:link, nav li a:visited, nav li a:hover {
    	color:#253776;
    	color:var(--navigation__list-item-text,#253776);
    }
    nav > ul ul li a, nav > ul ul li a:link, nav > ul ul li a:visited {
    	color:#253776;
    	color:var(--navigation__sub-list-item-text,#253776);
    }
    nav > ul ul li a:hover {
        color:#fff;
        color:var(--navigation__list-item-text-hover,#fff);
    }
    nav > ul li:hover {
        background-color: #e1bb4b;
        background-color: var(--navigation__list-item-box-hover,#e1bb4b);
    }
    nav > ul li a:hover {
        border-bottom:none;
    }
    nav > ul ul {
        background-color:#90c2e1;
        background-color:var(--navigation__sub-background,#90c2e1);
        display:none;
        position: absolute;
        left: 100%;
        top:0;
    	text-indent:1em;
    }
    nav > ul ul li {
    	border-bottom: solid 1px #fff;
    }
    nav > ul li:hover > ul, nav > ul li:focus > ul {
    	display: inline-table;
    	-webkit-animation-name: comein;
    	-webkit-animation-duration:.5s;
    	animation-name: comein;
    	animation-duration:.5s;
    }
}
@media screen and (max-width: 600px) 
{
  .frame-affiliate-logo + a #bbr-title {
    line-height:2.65rem;
  }
  .hamburger {
    top:0;
  }
}
@media screen and (max-width: 450px), (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    #bbr-acronym, #bbr-product, #bbr-title {
        margin-inline-start: calc(36px + 3vw);
        padding-left:0;
    }
    .journal-logo {
/* Ivo       padding:.35em 0;*/
        margin:0;
        height:10vw;
        width:auto;
        margin-inline-start: calc(36px + 3vw);
    }
    h1#bbr-title em {
        display:none;
    }
    .hamburger {
        display:inline-block;
        top:0;
        left:0;
    }
    .svg-nav-toggle {
        fill: #253776;
        fill: var(--header__hamburger-fill,#253776);
    }
    .navigation {
    	padding-top:0;
    	position:fixed;
    	top:10vw;
    	width: 10em;
    	height:100%;
    	background-color: #eee;
    	margin-inline-start:-10em;
	    transition: margin .5s ease-in-out;
	    overflow-y: scroll;
    }
    input#nav-trigger:checked ~ nav {
        display: block;
        margin-inline-start:0;
    }
    li .logo-container {
        width: 150px;
    }


}
@media screen and (max-width: 450px) {
    #bbr-title {
        margin-inline-start:calc(36px + 3vw);
    }
    #bbr-acronym {
        margin-top: 1vw;
    }

}
@media screen and (min-width: 1000px) {
    #header-title {
        padding:.5em 0 0 1em;
        font-size:2em;
        line-height: var(--headerbar-lineheight);
    }
/*    div.navbutton {
        z-index:999;
        left: calc((100vw - 1000px) / 2);
        bottom:25px;
        font-size:1.5em;
    }
*/    .navbutton svg {
        opacity:1;
    }

    #back-to-top {
        right:calc((50vw - 500px) );
    }
    #back-to-top.active {
        right:calc((50vw - 500px) );
    }
}
@media screen and (min-width: 1200px) {
    #bookcode {
        position:fixed;
    }
    body {
        grid-template-areas: 'header-left header header-right .'
              'menu main main right'
              'menu footer footer bottom-right';
        grid-template-columns:var(--navbar-width) calc(var(--main-width) - var(--headerbar-height)) var(--headerbar-height) 1fr;
        grid-template-rows:var(--headerbar-height) 1fr minmax(0,max-content);
    }
  .logo-container {
      margin:auto;
      text-align:right;
      width:100%;
      padding-right:1em;
      padding-top:0;
  }
}
/*  extra set needed for search */
@media screen and (min-width: 1265px) {
    #bookcode {
        position:fixed;
    }
    body {
        grid-template-areas: 'header-left header header-right'
              'menu main right'
              'menu footer bottom-right';
        grid-template-columns:var(--navbar-width) var(--main-width) 1fr;
        grid-template-rows:var(--headerbar-height) 1fr minmax(0,max-content);
    }
    div#search {
      background-color: transparent;
    }
}
@media screen and (min-width: 1450px ) {
  :root {
    --font-size:13pt;
  }
    body, html {	
        margin:auto;
    }
    main {
        margin:0;
    }
    #header-content {
        margin:0;
    }
    #back-to-top {
        right:calc((50vw - 500px) / 2);
    }
    #back-to-top.active {
        right:calc((50vw - 500px) / 2);
    }
    aside {
      visibility:visible;
      display:block;
    }
    details.toc {
      display:none;
    }
}
@media screen and (min-width: 1600px)
{
  :root {
    --font-size:13pt;
  }
  svg#jb-logo  {
    width:var(--navbar-width);
    height:auto;
  }
    .frame-affiliate-logo {
      width:var(--navbar-width);
      padding:0;
    }

  body {
    grid-template-areas:
        'header-left header header header-right'
        '. menu main right'
        '. menu footer right';
    grid-template-columns:1fr var(--navbar-width) var(--main-width) 1fr;
    grid-template-rows:var(--headerbar-height) 1fr minmax(0,max-content);
    }
}
