/* Timothy Framework - timothyframework.com  ADAPTED by JB @ NGSM.org*/
/* This work is licensed under the MIT License - http://opensource.org/licenses/mit-license.php */


/* Color Legend */


/* Reset HTML elements to override browser defaults*/

html, body { margin: 0; padding: 0; border: 0;  
				background: transparent; font-size:10px; }

div, span, article, aside, footer, header, hgroup, nav, section,
h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, 
table, tr, th, td, tbody, tfoot, thead 
	{
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	background: transparent;
	}

img 	{ border-style: none;
	border-color: inherit;
	border-width: 0;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}

table, tr, th, td, tbody, tfoot, thead 
	{
	margin: 0; padding: 0; border: 0;
	vertical-align: baseline;
	background: transparent;
	}
	
table { border-collapse: collapse; border-spacing: 0; }
	
input, select, textarea, form, fieldset 
	{	margin: 0; padding: 0; border: 0; }

article, aside, dialog, figure, footer, header, hgroup, nav, section 
	{ 	display:block; }

h1, h2, h3, h4, h5, h6, p, li, blockquote, td, th, a, caption, em, strong, strike 
	{ 
	font-family: Arial, Helvetica, sans-serif;
	font-size:100%;
	font-weight: normal;
	font-style: normal;
	line-height: 100%; 
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000;
	}

ol, ul { list-style: none; }



/* Setting GLOBAL HTML elements for the webpage to which this CSS is linked in the head section of the HTML code*/

html 	{	}
body	{ background-image: url('http://ngsm.org/test/images/snefaded2.gif') ; text-align:center;	}



/* Headings */

h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #000; }

h1 { font-size:32px; }
h2 { font-size:20px; }
h3 { font-size:16px; }
h4 { font-size:14px; }
h5 { font-size:14px; }

/* h6 used for manual date stamping sections of doc*/
h6 { font-size:10px; text-align:right; font-weigh:normal; padding-top:20px}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }



/* TEXT Elements;   the period (.) means a class style */

p           	{ color :#000; font-size:12px; line-height:150%;  }
p .left			{ margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p .right 		{ margin: 1.5em 0 1.5em 1.5em; padding: 0; }

  /* a = anchors */
a           	{   }
a:link			{   }
a:visited		{   }
a:active		{   }
a:focus			{   }
a:hover     	{ color: #006;  }

blockquote  	{ color:#000; font-size:12px; }

/* color=inherit was added to Timothy's code in order to allow Web Design 
   to add attributes (e.g., strong) while keeping other attributes of the element (e.g., font-color) 
   which otherwise would default to the p element color declared above among the TEXT elements */
strong      	{ font-weight: bold;   color:inherit}
em		      	{ font-style:  italic; color:inherit}
center 			{ text-align:  center; color:inherit; font-size:inherit}

/* Images */



/* Lists */

ul          { 	padding-left:25px;
				background: transparent; 
				list-style-type: square;;
			}

				
ol          	{ 	padding-top:15px;
					padding-left:50px; 
					background: transparent; 
					list-style-type:decimal; }

ul li		    { color:#000; font-size:12px; }
ol li	     	{ color:#000; font-size:12px; }



dl          	{  	}
dt       		{  	}
dd          	{ 	}



/* Tables */

table       	{ width:100%; }

tr				{	}
.odd			{ background-color:#eee; }
.even			{ background-color:#fff; }

th          	{ font-weight: bold; }
thead, th    	{ background: #ccc; }

tbody			{   }

th,td,caption 	{ 	}
caption 		{ 	}

tfoot       	{	}
.tfooter		{ background-color:#ccc; text-align:center; font-style:italic; }

caption     	{ background: #efefef; }



/* Miscellaneous */

sup, sub    	{ line-height: 0; }

abbr, acronym   { border-bottom: 1px dotted #666; }
address     	{ 	 }
del         	{ background:#FFCECE; color:#f00; }

code, pre		{ background-color:#FF9; padding:2px 0px; margin:4px 25px;
					font-family:"Courier New", Courier, monospace; font-size:12px; font-weight:normal; line-height:150%;	}


/* Containers 
Content - The content of the box, where text and images appear
Padding - Clears an area around the content. The padding is transparent
Border - A border that goes around the padding and content
Margin - Clears an area outside the border. The margin is transparent 
http://w3schools.com/css/css_boxmodel.asp  */

#wrapper 			
{
	border-style: none;
	border-color: inherit;
	border-width: 0;
	width: 800px;
	height: 850px;
	padding : 0;
	margin: auto;
	background-color: #ffffcc;
	overflow: hidden;
}

 #top				
 {
	position: relative;
	width: 800px;
	padding-top: 10px;
	padding-bottom: 10px;
	border : 0;
	margin: auto;
	background-color: #000066;
}
#top h1 {
	margin-top:50px
}

  #logo	 			{ padding:0; border:0; margin:0; }

/*
 #leftside 			
 {
	border-style: none;
	border-color: inherit;
	border-width: 0;
	width: 50px;
	height: 1500px;
	position : absolute;
	padding-top: 100px;
	margin-left: 0px;
	margin-top: 0;
	margin-bottom: 0;
	background-color: #ffc;
}
*/
 
 #rightside 		
 {
	border-style: none;
	border-color: inherit;
	border-width: 0;
	width: 50px;
	height: 750px;
	position : absolute;
	padding-top: 100px;
	margin-left: 750px;
	margin-top: 0;
	margin-bottom: 0;
	background-color: #ffc;
}
 
 #leftside h2		{ color:#fff; padding:10px }
 #rightside h2		{ color:#fff; padding:10px }
 #leftside p		{ font-size:12px; color:#fff; padding:10px; line-height:150%;}
 #rightside p		{ font-size:12px; color:#fff; padding:10px; line-height:150%;}

 /*
  #social-media			{ float:right; margin:0 10px 0 0; text-align:left; }
  #social-media ul 		{	}
  #social-media ul li		{ display:inline;  	}
  #social-media ul li a	{	}
  #social-media p			{ color:#fff; margin:4px 10px 4px 0px; font-size:11px; }
 */

 /* #topnav 			{ clear:both; background-color:#ffcc66;  } */
 #topnav 			{ width:650px;    padding:0;         border:0; margin:0 auto; background-color:#ffcc66;               }
 #topnav ul			{ width:100%;     padding:10px 0px;  border:0; margin:0;      background-color:#ffcc66; }

 #topnav ul li		{ display:inline;	}
 #topnav ul li a		{                 padding:10px 10px; border:0; margin:0; }

 #topnav a:link		{ color:#000066;	}
 /*
 #topnav a:visited	{ color:#fff;	}
  #topnav a:active	{ color:#fff;	}
  #topnav a:hover		{ color:#fff; background-color:#900;	}
  #topnav a:focus		{ color:#fff;	} 
 */


 #banner 			{border-style: none;
	border-color: inherit;
	border-width: 0;
	width:650px;   padding-top:20px; margin:0 auto; background-color:#ffffcc;
	height: 350px;
					}
					
 #banner h1	{text-align:center; color:#000066; border:0; padding-bottom:20px; 
			}					

 /* #subbanner 			{ width:100%; float: center; background-color: #555; overflow:hidden; padding:10px 0;   }
 #subbanner p		{ line-height:180%; font-size:16px; font-weight:bold; color:#fff; text-align:center;  }*/

 /* #leftside 			{ width=20%; padding:20px; margin-left:0px;  }
 #leftside h2		{ color:#600; margin:20px 0 10px 0;}
 #leftside p			{ line-height:150%; margin:5px 0; } */

/* Hiding the scrollbar on an HTML page
Declare a wrapper div that has it's overflow hidden, and the inner div set to auto. 
To remove the inner div's scroll bar, pull it out of the outer div's viewport. 
Then apply equal padding to the inner div so that the content stays in view.
stackoverflow.com/questions/3296644/hiding-the-scrollbar-on-an-html-page
*/	

 #content 			{
	width: auto;
	height: 600px;
	margin: auto;
	padding-left: 130px;
	padding-right: 120px;
	overflow: auto;
	border-top-style: none;
	border-top-color: inherit;
	border-top-width: 0px;
}
 #content h1		{ text-align:center; color:#000066; border:0; padding-top:30px; }
 #content h2		{ text-align:center; color:#000066; border:0; padding-top:30px; }
 #content h3		{ text-align:center; color:#000066; border:0; padding-top:30px; }
 #content p			{ font-size:14px; color:#000066; line-height:150%; padding-top:10px }
 #content ul li		{ font-size:14px; color:#000066; line-height:150%;  } 
 #content ol li		{ font-size:14px; color:#000066; line-height:150%;  } 
 #content img		{ border-style: none; border-top:0; display:block ;
						border-color: inherit;
						border-width: 0;
						padding: 20px 0px;
						margin: auto;
						text-align: center;
}
  
 #content a:link		{ color:#000066;	}

 /*
 #footer1 			{  height: 10px;padding : 0; background-color:#ffffcc; }

  
 #footer2 			{
	margin-bottom: 0;
	margin-top: 0;
	margin: auto;
	height: 50px;
	padding : 0;
	background-color: #ffc;
	width: 600px;
}
 */
 #footer2 			{
	margin: auto;
	margin-top:30px;
	height: 50px;
	background-color: #ffc;
	width: 600px;
}


 /*
 #box1 {   }

 #box2 {   }

 #box3 {   }

 #box4 {   }

 #box5 {   }

 #box6 {   }
 */

 /* Layout Extra */


 /* Navigation Extra */


 /* Forms

 form ol { list-style-type:none; }

 form 	{ text-align:left; margin:20px;	}

 label 	{ 
		float: left; width: 150px; margin-top:5px;
		text-align:right; display:block; background:none; font-weight:bold;
		}
	
 submit	{ background:none; 	}

 input 	{ 
		width: 280px; margin:0 0 16px 10px;
		border:1px #bbb solid; padding:5px; background:none; 
		}
		
 input:focus, textarea:focus	{ background-color:#EFDEDE; }

 textarea {
		width: 280px; height: 150px; margin:0 0 16px 10px;
		border:1px #bbb solid; padding:5px; background:none; 
		}

 select { margin-bottom:20px;	}
	
 .month { margin-left:155px;	}

 .submit {
		width:90px; height:25px;
		margin-left:170px;
		font-size:12px;
		}

 br		{ clear: left; 	}

 .clear	{ clear:both; }

 */


 /* Miscellaneous  */

.copyright-text	{ font-size:80%; font-style:italic; color:#333; }
.footer-text	{ font-size:80%; font-style:normal; color:#fff; text-align:center; }

.title			{ font-size:18px; font-weight:bold; color:#333;  }
.subtitle		{ font-size:14px; font-style:italic; color:#333;  }

.artist			{ font-size:16px; font-weight:bold; color:#333;  }
.author			{ font-size:14px font-weight:bold; color:#555;  }
.editor			{ font-size:14px font-style:italic; color:#555;  }

.pub-date		{ font-size:10px font-style:italic; color:#555; }
.article-date	{ font-size:10px font-style:italic; color:#555;  }
.location		{ font-size:10px font-style:italic; color:#555;  }

.float-right	{ float:right; }
.float-left		{ float:left; }
.clear			{ clear:both; }

.hide			{ display:none; }
.block			{ display:block; }
.inline			{ display:inline; }

.first			{ font-weight:bold; }
.last			{ font-weight:bold; }
.left			{ font-weight:bold; text-align:left; }
.right			{ font-weight:bold; text-align:right; }

.added      	{ background:#D7D7FF; }
.removed    	{ background:#FFCECE; color:#f00; }
.changed		{ background:#FFB; }


/* Success, info, notice and error/alert boxes - from Blueprint CSS Framework */

.error, .alert, .notice, .success, .info {
	padding: 0.8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error, .alert 	{ background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
	
.notice			{ background: #fff6bf; color: #514721; border-color: #ffd324; }
	
.success   		{ background: #e6efc2; color: #264409; border-color: #c6d880; }
	
.info 			{ background: #d5edf8; color: #205791; border-color: #92cae4; }
	
.error a 	{ color: #8a1f11; }
.alert a 	{ color: #8a1f11; }
	
.notice a   { color: #514721; }
.success a  { color: #264409; }
.info a		{ color: #205791; }