/* This style sheet is designed to provide examples on how to:
1. CHANGE SIDEBAR APPEARANCE.
2. HIDE PAGE REFERENCE ITEMS
3. ALIGN TEXT VERTICALLY 
4. ALIGN CONTENT IMAGES, TABLES, TEXT */


/* 1. CHANGE SIDEBAR APPEARANCE */
/* Sample CSS to change the appearance of the Sidebar */
/* This sheet overwrites the values of the default style sheet located at http://www.nlm.nih.gov/styles/training.css */
/* 1.A. This style changes the background color to gray */

/* 3/7/2019 Roger hiding the this color change element
#leftlinks {
	background-color: #89224E;
}
 */
/* 1.B. This style changes the color of "Reference Materials"  to red with strong font */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li {
	color: red;
	font-weight: bold;
}
 */
/* 1.C. This style changes the bottom border color of the Chapter Level to white */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li {
	border-bottom-color: white !important;
	border-bottom-style: dotted !important;
	border-bottom-width: thick !important;
}
 */
/* 1.D..This style changes the link color  of the Chapter Level to orange */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li a:link {
	color: orange;
}
/* 1.E. This style changes the bottom border color of the Section Level to green */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li li {
	border-bottom-color: green !important;
	border-bottom-width: thick !important;
	border-bottom-style: double !important;
}
 */
/* 1.F. This style changes the link color of the Section Level to fucshia */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li li a:link {
	color: fuchsia;
}
 */
/* 1.G. This style changes the bottom border color of the Sub Section Level to purple */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li li li {
	border-bottom-color: purple !important;
	border-bottom-width: thick !important;
	border-bottom-style: dashed !important;
}
/* 1.H.This style changes the link color of the Sub Section Level to lime */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul li li li a:link {
	color: lime;
}
 */
/* 1.I. This style changes the bottom border color of separating Levels to orange */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks ul {
	border-bottom-color: orange;
	border-bottom-width: thick;
	border-bottom-style: double;
}
 */
/* 1.J. This style changes the link color from yellow to blue */
/* 3/7/2019 Roger hiding the this color change element
#main #leftlinks a:link {
	color: blue;
}
 */
 

/* 2. HIDE PAGE REFERENCE ITEMS */
/* The page numbers are controlled by the class  .pagenumbers */
/* "Previous section" and "Next section" are controlled by the class .sections */
/* "Page X of Y"  are controlled by class .numofpages */
/* All of these classes are located in the style sheet located in http://www.nlm.nih.gov/styles/training.css below. */
/* To hide a particular page reference item, remove the comment from the class.*/
/* 2.A. Hide page numbers*/
/*
.pagenumbers {display:none;}
*/
/* 2.B. Hide "Previous section" and "Next section" */
/*
.sections {display:none;}
*/
/* 2.C. Hide "Page X of Y" */
/*
.numofpages {display:none;}
*/



/* 3.A. ALIGN TEXT VERTICALLY */
/* Background: 
/* ** Page X of Y at top of screen */
/* ** Page Numbers at bottom of screen */
/* ** Previous section" and "Next section at bottom of screen */
/* In this scenario, the text from a paragraph at the top part of the page can be overwritten by the */
/* Page X of Y at top of screen */
/* Iissue can be resolved by placing the the following class in the first paragraph field */
.paragraph_top {
	padding-top:1.5em;
} 


/* 4. ALIGN CONTENT IMAGES, TABLES, TEXT */
/* SPECIFIC CLASS SELECTORS - Use these classes to impact specific items on a page. */
/* 4.A.     .center_item - Use this class to center an image or a table on a page */
.center_item {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
/* 4.B.    .center_text - Use this class to center text on a page */
.center_text {
	text-align: center;
}
/* 4.C.    .right_item - Use this class to right align an image or a table on a page */
.right_item {
	float: right;
}
/* 4.D.    .right_text - Use this class to right align text on a page */
.right_text {
	text-align: right;
}
/* 4.E.    .margin_bottom - Use this class to put add a 1 em margin to the bottom of a table or image */
.margin_bottom {
	margin-bottom: 1em;
}
/* 4.F.    .center_item_bottom - Example showing how to combine these two classes (.margin_bottom and .center_item) into a single class. */
/* Pro: Creating a single class reduces typing.*/
/* Con: Creating a single class can reduce flexibility in that you are tied to all the properties and respective values in the single class. */
.center_item_bottom {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1em;
}
/* 4.G.    .column_left - Use this class to put content on the left part of the page */
.column_left {
	width: 50%;
	float:left;
}

/* 4.H.    .column_right - Use this class to put content on the left part of the page */
.column_right {
	width: 50%;
	float: left;
}
