#lexicon {
			width: 100%;
			display: flex;
			gap: 20px;
			justify-content: space-between;
			align-items: flex-start;    
		}
		
		#lexicon #navigation {
			width: 20%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: var(--background2);
  border: 1px solid var(--border);
  padding: 1px;   
		}
		
		#lexicon #navigation .navigation-headline {
			min-height: 50px;
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			font-weight: bold;
			text-transform: uppercase;
			text-align: center;
			padding: 0 5px;
			box-sizing: border-box;
			background: var(--background3);
			color: var(--text);
		}
		
		#lexicon #navigation .navigation-headline:first-child {
		}
		
		#lexicon #navigation .navigation-headline:first-child a:link,
		#lexicon #navigation .navigation-headline:first-child a:visited,
		#lexicon #navigation .navigation-headline:first-child a:active,
		#lexicon #navigation .navigation-headline:first-child a:hover {
			margin-left: 0;
		}
		
		#lexicon #navigation .navigation-headline a:link,
		#lexicon #navigation .navigation-headline a:visited,
		#lexicon #navigation .navigation-headline a:active,
		#lexicon #navigation .navigation-headline a:hover {
			color: var(--text);
			margin-left: 5px;
		}
		
		#lexicon #navigation .navigation-item {
			min-height: 25px;
			width: 100%;
			margin: 0 auto;
			padding: 5px 20px;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			border-bottom: 1px solid var(--border);
			background: var(--background);
			font-variant: small-caps;
		}
		
		#lexicon #navigation .navigation-item:last-child {
		}
		
		#lexicon #navigation .navigation-subitem {
			min-height: 25px;
			width: 100%;
			margin: 0 auto;
			padding: 0 20px 0px 20px;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			border-bottom: 1px solid var(--border);
			background: var(--background2);
			font-variant: small-caps;
		}
		
		#lexicon #navigation .navigation-subitem i {
			font-size: 11px;
			padding-top: 1px;
		}
		
		#lexicon #navigation .navigation-externallink-option {
			width: 100%;
			text-align: right;
		}
		
		#lexicon #navigation .navigation-search {
			width: 100%;
			margin: 0 auto;
			padding: 10px 0;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			border-bottom: 1px solid var(--border);
			background: var(--background2);
			justify-content: center;
		}
		
		#lexicon #navigation .navigation-search input.textbox {
			width: 68%;
		}
		
		#lexicon .lexicon-entry {
			width: 80%;
  box-sizing: border-box;
  background: var(--background2);
  border: 1px solid var(--border);
  padding: 1px;    
		}
		
		#lexicon .lexicon-entry .entry-headline {
			height: 50px;
			width: 100%;
			font-size: 30px;
			display: flex;
			justify-content: center;
			align-items: center;
			font-weight: bold;
			text-transform: uppercase;
			background: var(--background3);
			color: var(--text);
		}
		
		
		#lexicon .lexicon-entry .entry-subline {
			text-align: right;
			padding-right: 10px;
			padding-top: 5px;
			background: var(--background2);
		}
		
		#lexicon .lexicon-entry .entry {
			background: var(--background2);
			padding: 20px 40px 40px 40px;
			text-align: justify;   
		}
		
		#lexicon .lexicon-entry .entry.content {

		}
		
		#lexicon .lexicon-entry .content-bit {
			padding: 0 40px 40px 40px;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			gap: 20px;
			background:var(--background2);
		}
		
		#lexicon .lexicon-entry .content-bit .content-letter {
			width: 45%;     
		}
		
		#lexicon .lexicon-entry .content-bit .content-letter .content-item {
			margin-bottom: 5px;    
		}
		
		#lexicon .lexicon-entry .content-bit .content-letter .content-item .content-item-cat {
			font-size:0.7em;
		}
		
		#lexicon .lexicon-entry .lexicon_search_results {
			margin-bottom: 10px;
		}

/* Infopopup
--------------------------------------------- */
.infopop { 
	position: fixed; 
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0; 
	background: hsla(0, 0%, 0%, 0.5); 
	z-index: 99; 
	opacity:0; 
	-webkit-transition: .5s ease-in-out; 
	-moz-transition: .5s ease-in-out; 
	transition: .5s ease-in-out; 
	pointer-events: none; 
}

.infopop:target { 
	opacity:1; 
	pointer-events: auto; 
} 

.infopop > .pop { 
	background: var(--background);
	width: 600px; 
	position: relative; 
	margin: 10% auto; 
	padding: 20px; 
	z-index: 3; 
	border: 1px solid var(--border);
} 

.closepop { 
	position: absolute; 
	right: -5px; 
	top:-5px; 
	width: 100%; 
	height: 100%; 
	z-index: 2; 
}

.lexi-button {
	box-sizing: border-box; 
	height: 30px; 
    width: 30px;	
	background: var(--background); 
	text-align: center; 
	color: var(--text);
	text-transform: uppercase;
	padding: 6px 5px 5px 6px;
	border-radius: 50%;
	font-size: 10px; 
	border: 1px solid var(--border);
}

.lexi-button i {
 	font-size: 16px !important; 
	display: block !important; 
	color: var(--text) !important; 
	margin-bottom: 2px !important;
}