.bannerOffset:before { 
	display: block; 
 	content: " "; 
  	height: 5rem;              //100px;      /* Give height of your fixed element */
        margin-top: -5rem;         //-100px; /* Give negative margin of your fixed element */  	
        visibility: hidden; 
}

.bannerOffsetMore:before { 
	display: block; 
 	content: " "; 
  	height: 5rem;              // 200px;      /* Give height of your fixed element */
        margin-top: -5rem;         // -200px; /* Give negative margin of your fixed element */  
        visibility: hidden; 
}

/************************** TOP EVIDENCE BANNER ********************************/
/*^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/

div#bannerEvidence { 
	position: fixed; 
	top: 0; 
	left: 0; 
	background-color: #b8daa2;
	width: 300%; 
	float: top;
	display: inline-block;
	z-index: 1;
}

div#bannerEvidence-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 2.1rem;                     // 45px; 
	font: 130% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
}

/************************** BOTTOM BANNER ********************************/
/* VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV*/ 

.bannerBottom { 

	position: fixed; 
	bottom: 0; 
	width: 300%;                            //100%; 
	height: 1rem;                           // 61px; 
	background-color: #b8daa2; 
	color: black; 
	display: flex; 
	float: bottom;
	align-items: center; 
	padding: 1rem 2rem;                     // 0 20px; 
	z-index: 1;
	margin: auto
	//margin: 0 auto
	//margin-left: 45px; 
	//margin-right: 45px; 
	z-index: 1;
}

.bannerBottom .icon { 
	margin-right: 0rem;                    // 10px; 
	margin-left: 0rem;                     // 10px; 
} 

.bannerBottom .text { 
	flex-grow: 1; 
	margin: 0 auto; 
	//padding: 17px; 
	padding-left: 1rem;                    // 15px; 
	font: 100% calibri, sans-serif;        // 45px calibri, sans-serif;
	//font-weight: bold;
	height: 1rem;                          // 61px;
}

/************************** TOP CHAPTER BANNER ********************************/

div#bannerChapter { 
	top: 0; 
	left: 0; 
	background-color: #808080;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerChapter-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 2.1rem;                     // 45px; 
	font: 150% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
	color: white;
}

div#bannerTOC { 
	top: 0; 
	left: 0; 
	background-color: #808080;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerTOC-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 2.1rem;                     // 45px; 
	font: 150% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
	color: white;
}

div#bannerINDICES { 
	top: 0; 
	left: 0; 
	background-color: #808080;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerINDICES-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 2.1rem;                     // 45px; 
	font: 150% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
	color: white;
}

div#bannerQUESTIONS { 
	top: 0; 
	left: 0; 
	background-color: #808080;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerQUESTIONS-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 2.1rem;                     // 45px; 
	font: 150% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
	color: white;
}




div#bannerInductive { 
	top: 0; 
	left: 0; 
	background-color: #f8cbac;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerInductive-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 3rem;                     // 45px; 
	font: 130% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
}
div#bannerDeductive { 
	top: 0; 
	left: 0; 
	background-color: #fef4b7;
	width: 300%; 
	float: top;
	display: inline-block;
	position: fixed; 
	z-index: 1;
}

div#bannerDeductive-content { 
	width: 300%;   // extend it for long title so it doesnt wrap              //2000px; 
	height: 1rem; // bottom of banner       //61px; 
	text-align: left;
	margin: 0rem auto; 
	padding: 1rem;                          //17px; 
	padding-left: 3rem;                     // 45px; 
	font: 130% calibri, sans-serif;         // 45px calibri, sans-serif;
	font-weight: bold;
	z-index: 1;
}
