/* 	Best Practice For Later:
/ 	*CSS Reset for safety reasons   -----> Normalize.css may be a better alt ((Pure. Base))
/	*Optimize your images!! -try Smush It-
/	*Use conditional comments (for browser variation)
/	*Place JS file at bottom
/	*test different browsers as you build
/	*Dont use @import, bc it's slow
*/

/*	CHECK THIS OUT:: 
	WEB FUNDAMENTALS BY GOOGLE DEV		https://developers.google.com/web/fundamentals/?hl=en */

html {
	font-family: 'Nunito', sans-serif;
	font-size: 11pt;
}
html, body, object { padding: 0; margin: 0; }
body {
	position: relative;
}

/* Main section */
main {
	padding-top: 6em;
    padding-left: 3em;
    padding-right: 3em;
    /* width: 90%; */
}
/* Clear floats after the columns */
main:after {
    content: "";
    display: table;
    clear: both;
}


*, *:before, *:after {		/*solves for inheritance!*/
  box-sizing: inherit;
}

/* Prevent content from getting clipped at top or bottom */
.container {
	padding-top: 9em; 
	padding-bottom: 9em;
}

p.author { 
	color: #2e6f40; 
    font-size: 10pt;
    margin-top: -1em;
    margin-bottom: 0em;
}
p.date { 
	color: #2e6f40; 
    font-size: 10pt;
    margin-top: 0em;
    margin-bottom: 2em;
}
 img.inline{
	display: block; 
	margin-left: auto; 
	margin-right: auto; 
	margin-top: 1.5em;
	margin-bottom: -0.5em;
    float: center; 
	/* min-width: 15em;  */ 
	max-width: 25em;	
    max-height: 20em;
	width: 100%;	
}
img.nested {
    display: block;
    float: right;
    max-width: 25em; 
	margin-top: 1em;
    margin-left: 2em;	
    margin-bottom: 0em;	
}



/*Text and line color change*/

.highlight {
	color: #004225;
	font-weight: 500;
	text-decoration:underline;
	display: inline;
}

hr {height:0.5px;
	border-width:0;
	color: #e2e2e2;
	background-color:#e2e2e2;
}


/* Handle general hyperlinks */
nav {
	position: fixed;

	width: 100%;	 
	top: 10px;
	padding: 0, 0, 0, 0;
	margin: 0, 0, 0, 0;
	z-index: 9999;
	background-color: #000000; /*#50738B;*/ 
	opacity: 0.90;
	}
nav .navname {
	float: left; 
	position: absolute; 
	color: #fff;	
	font-weight: 500; 
	padding-left: 1.5em;
}
nav ul {
	text-align: right;
	margin-left: 10%;
}
nav ul li {
	display: inline;
	margin: 0 25px 0 0;
	color: #fff;
}
nav a {
	text-decoration: none;
	font-weight: 500; /*600*/
	color: white;
}
nav a:hover {
    color: #9bd46c; 
}


/* Handle general hyperlinks */
a {
	text-decoration: underline;
	font-weight: 500;
	color: #2e6f40; 
	/*color: #905739;*/  /*#7388c7   #274e6b*/
}
a:hover {
    color: #2e6f40;   /* #d1c8c0; */
}



h1 {
    /* margin-top: 2em; */
	font-size: 28pt;
}
section h2 {
	color: #1f1d22; 
}
section h3 {
	color: #5c5d61; 
	margin-bottom: -8pt;	
}
section p {
	color: #5c5d61; 
}


/* References section */
section.references {
	margin-top: 2em;
	margin-bottom: 2em;
}
section.references h2 {
	color: #5c5d61; 
}
section.references ul{
	line-height: 1.5;
	color: #5c5d61; 
}

section.footer {
	margin-top: 4em;
	margin-bottom: 1em;
    color: #2e6f40; 
	text-align: center;
}
section.footer table {
	width: 100%;
}
section.footer td.previous {
	text-align: left;
}
section.footer td.next {
	text-align: right;
}
td.previous a {
	text-decoration: none;
	font-weight: 600;	
}
td.next a {
	text-decoration: none;
	font-weight: 600;	
}


/* Code block style */
pre code {
  font-family: monospace;    /* Use a monospaced font for readability */
  font-size: 10px;
  line-height: 1.5;          /* Improve line spacing */
}





/* Change if the viewport is 1200px or smaller */
/* Playing around wih cropping. Totally unnecessary. */
@media screen and (max-width: 1200px) {
	/*fabulous centers and constrains margin*/			
	.container 	{			
				padding-top: 0px;				
				color: #ff0000;
				margin: auto;
				}			
}


/* Change if the viewport is 1000px or smaller */
@media screen and (max-width: 950px) {
	.container 	{			/*fabulous centers and constrains margin*/			
				padding-top: 250px;
				margin: auto;
				max-width: 800px; 				
				}

	/* Should increase font size to 16pt for mobile accessibility*/ 
	/* Adjust nav bar to collapse when screen is small. move about section lower to compensate */
	nav 		{
		/* font-size: 12pt; */
		float: center;
				}
	nav .navname {
		display: none;
	}
	nav ul	{		
		margin-left: 0pt;
		margin-right: 0pt;
		text-align: center;
			}	
	nav ul li 	{		
		display: inline-block;
		text-align: right;
				}				
}