/*  ------------------  */
/*  ------------------  */
/*  Site sidebar menu.  */
/*  ------------------  */
/*  ------------------  */
#sitemenubar {
	position: fixed;
	inset: 0 0 auto;
	z-index: 9;
	background: var(--commonbac);
	border-bottom: 4px solid var(--commonbor);
	box-shadow: inset 0 -1px 0 var(--darkerbor), 0 4px 8px #0007;
}
#sitemenubar > .wrap {
	display: flex;
	justify-content: space-between;
	padding: 6px;
}
/*  ------------------  */
.burger_check {
	display: block;
	position: absolute;
	top: -2em;
}
.hamburger {
	display: block;
	max-height: 2.8rem;
	padding-inline: 0 8px;
	line-height: 2.7rem;
	opacity: .9;
}
.hamburger span {
	position: relative;
	z-index: 1;
	vertical-align: middle;
}
.burger_check:focus + .hamburger,
.hamburger:hover {
	opacity: 1;
}
.hamburger span:first-child {
	display: inline-block;
	width: 3.2rem;
	height: .9rem;
	padding-top: .3rem;
	border-style: solid;
	border-width: .7rem 0;
	border-color: inherit;
	border-radius: .3rem;
}
.hamburger span:first-child::before {
	display: block;
	content: '';
	border-top: .7rem solid;
}
.hamburger span:nth-child(2) {
	font-size: 1.6rem;
	font-weight: 700;
	font-variant-caps: small-caps;
}
.hamburger span:nth-child(2)::before {
	content: 'Site  ';
}
.burger_check:checked + .hamburger span:nth-child(2)::before {
	content: 'Hide  ';
}
.hamburger::before {
	pointer-events: none;
	position: fixed;
	inset: calc(3rem + 16px) 0 0;
	content: '';
	background-color: #000;
	opacity: 0;
	transition: opacity .3s;
}
.burger_check:checked + .hamburger::before {
	pointer-events: auto;
	opacity: .4;
	transition: opacity .3s;
}
/*  ------------------  */
#websitemenu {
	box-sizing: border-box;
	position: fixed;
	overflow: auto;
    scrollbar-width: thin;
	scrollbar-color: var(--mediumbac) #0000;
	z-index: 1;
	top: calc(3rem + 12px);
	bottom: 0;
	left: -35rem;
	width: 34rem;
	max-width: 100vw;
	padding: .4rem 1rem 1rem;
	background: var(--commonbac);
	border: 4px solid var(--commonbor);
	border-bottom: 0;
	box-shadow: inset 0 0 0 1px var(--darkerbor), inset -1px 0 0 var(--darkerbor);
	transition: left .3s ease-out .05s;
}
.burger_check:checked + .hamburger + #websitemenu {
	left: calc(50% - 56rem);
	transition: left .3s ease-in;
}
@media screen and (max-width: 74rem) {
    .burger_check:checked + .hamburger + #websitemenu {
    	left: -5px;
    }
}
/*  ------------------  */
.menulevel1, .menulevel2 {
	list-style: none;
	margin: 0;
	padding: 4px 0 8px;
}
.menulevel2 {
	padding: 4px 0 8px;
}
@media (hover:none) {
	.listlevel2 {
		padding-block: 2px;
	}
}
.linklevel1, .linklevel2 {
	display: block;
	overflow: hidden;
	padding: 6px 12px;
	white-space: nowrap;
	text-decoration: none;
	text-overflow: ellipsis;
}
.linklevel2 {
	padding: 4px 12px;
	border: 1px solid #0000;
}
#websitemenu a:hover, #websitemenu a:focus {
	text-decoration: none;
}
/*  ------------------  */
/*  ------------------  */
/*  Top search form.    */
/*  ------------------  */
/*  ------------------  */
#search fieldset {
	display: flex;
}
#search .menu_search {
	flex: 1 1 auto;
	width: 140px;
	padding: 0 6px;
	border-right: 0;
	border-radius: 3px 0 0 3px;
}
#search .button {
	flex: none;
	width: 4rem;
	padding: 0;
	line-height: 2.6rem;
    border-radius: 0 3px 3px 0;
}
/*  ------------------  */
/*  ------------------  */
/*  Top/bottom links.   */
/*  ------------------  */
/*  ------------------  */
.custom_anchor {
	position: fixed;
	z-index: 4;
	left: -1px;
	width: 30px;
	font-size: 20px;
	font-weight: 700;
	opacity: .4;
}
.custom_anchor::before {
	position: absolute;
	width: 30px;
	text-align: center;
}
.custom_anchor:hover, .custom_anchor:focus {
	text-decoration: none;
	outline: none;
	opacity: 1;
}
#custom_top {
	top: 25%;
	bottom: 50%;
	border-top-right-radius: 1em;
}
#custom_top::before {
	bottom: 15%;
	content: "\21C8";
}
#custom_bottom {
	top: 50%;
	bottom: 25%;
	border-bottom-right-radius: 1em;
}
#custom_bottom::before {
	top: 15%;
	content: "\21CA";
}
/*  ------------------  */
/*  Reposition these.   */
/*  ------------------  */
@media (max-width: 48rem) {
	.custom_anchor {
		width: 4.4rem;
		opacity: .5;
	}
	#custom_top {
		top: auto;
		bottom: 0;
		border-top-right-radius: .5em;
	}
	#custom_bottom {
		top: auto;
		right: -1px;
		bottom: 0;
		left: auto;
		border-radius: .5em 0 0 0;
	}
	.custom_anchor::before {
		position: static;
		display: block;
		width: auto;
		line-height: 5rem;
	}	
}
/*	--------------------------	*/
/*	--------------------------	*/
/*	@NB: The inline style set	*/
/*	in ACP is not necessary.	*/
/*	Remove it from markup. :)	*/ 
/*	This:

	<div class="bbc_clear" style="height: auto; padding: .5em 0;">

	Should be:

	<div class="bbc_clear">

/*	--------------------------	*/
/*	--------------------------	*/
.bbc_clear {
	overflow: auto;
	padding: .5em 0;

	> * {
		display: inline-block;
		vertical-align: bottom;
	}
}
/*	--------------------------	*/
/*	--------------------------	*/
/*  ------ End of file. ------	*/
/*	--------------------------	*/
/*	--------------------------	*/