/*-------------------------IMPORTANT NOTES FOR FUTURE PROGRAMMERS-------------------------*/
/*
1)The way I did the colors is a little quirky. All the colors (well, all the ones I remembered to do this to) are in the first section of this file. This includes borders, backgrounds, fonts, etc. The point of this is to make color theme editing easier in the future, so you don't have to hunt down every red or green color and make sure it follows the site's theme. This is a bit experimental for me, so I'm sorry if this is frustrating, but in the long run, I think it saves me a lot of time.
*/

/*-------------------------Colors-------------------------*/

/*http://www.cssdrive.com/imagepalette/index.php is a nice app to get colors off of images.

Here are some of the colors in the nav_bg.jpg:
lighter: #519b9e  #5ea3aa 
medium: #3e8f90 
darker:  #297f7e #187473*/

/*Greens and green-blues*/
#blackbar li ul li, #footer 
	{background-color: #3e8f90;} 
	
.submit
	{background-color: #187473;}
	
#blackbar li ul a:hover
	{background-color: #297f7e;}
	
fieldset
	{background-color: rgb(240, 240, 240);}
	
#login input.email, #login input.pwd 
	{border-color: #187473;}
	
/*Reds*/
a, a:visited, .clicktext, .green
	{color: #297f7e;}
	
.warning, .error
	{color: red;}	
	
.warningHL
	{background-color: yellow;}
	
/*whites*/	
#blackbar a, .submit
	{color: white;}
	
#page
	{background-color: white;}
	
/*blacks*/
#blackbar li ul
{
  border-color: black;}	

/*Greys*/	
body
	{background-color: #303030;}
	
#blackBar, #sidebarContainer li
	{border-color: #555;}
	
/*

#footer 
	{background: #555;}
*/
#footer
	{border-color: #ccc;}
	
#footer
	{color: #f3f3f3;}


/*-------------------------Typography-------------------------*/

/*---------------General Elements---------------*/

body {font-size: 14px; font-family: "Times New Roman",Times,serif;}

.clicktext {cursor: pointer;}
 
a, .clicktext {text-decoration: underline;}

a:hover, .clicktext:hover {text-decoration: none;}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, #sidebarContainer ul .heading {
	font-weight: bold;
	color:#297f7e;
	margin-bottom: 0.6em;
	margin-top: 0.3em;
}

ul {
	list-style: none;
	margin: 0px;
}
	
ul.styledList {
	list-style: disc;
	margin: 0px 28px;
	padding: 7px 0px 0px;
}
	
ul.styledList li {
	margin-bottom: 7px;
}

/*---------------Headings---------------*/

h1,.h1 {font-size: 2.25em;margin-bottom: 0.4em;margin-top:0.4em;letter-spacing: 0.1em;}

h2,.h2 {font-size: 1.8em;letter-spacing: 0.1em;}
 
h3,.h3 {font-size: 1.5em;}

h4,.h4 {font-size: 1.14em;font-style: italic;}

h5,.h5 {font-size: 1.14em;font-weight: normal;text-decoration: underline;}

h6,.h6 {font-size: 1.14em;font-style: italic;font-weight: normal;}




/*---------------Styling Classes---------------*/

em, .em {
	font-style: italic;
}

strong, .strong {
	font-weight: bold;
}

small, .small {
	font-size: 12px;
}

large, .large{
	font-size: 18px;
}

.hidden {
	display: none;
}


/*-------------------------Page Structure-------------------------*/

/*---------------Whole Page---------------*/

html, body {
	margin: 0px;
	padding: 0px; 
}
	
body {
	background-image: url(../../images/bg.gif);
	background-position: top center;
	background-repeat: no-repeat;
	min-height: 100%;
}

#page {
	margin: 20px auto 0px auto;
	padding: 0px;
	width: 650px;
	/*width: 848px;   For the wider header.*/
	min-height: 100%;
}
	
	
	
/*---------------Header---------------*/
#header1 {
	margin-bottom:-5px;/*For some reason the div containing the image was leaving 5 px of white space below the image. This counteracts that.*/
}

#logout_link {
	position: absolute;
	top: 19px;
	margin-left: 610px;
	display: block;
}

/*Navigation Bar*/
#header2  { 
  font-family: sans-serif;
  font-style:normal;
  font-weight: bold;
  font-size:100%;
  border-top: 1px solid;/*Color defined in color area*/
  padding-top:3px;
  width: 650px;
  background-image: url(../../images/nav_bg.jpg);
  background-repeat: repeat-x;
}

#blackbar {
	width: 529px;
	margin:0px auto;/*To line this up with the Confidential word, set it to 40-41px. For the top of the B in Bio-tech, try 80px. If there's a new graphic, this won't make any sense, so good luck. And use firefox's layout ruler if you need help aligning it.*/
	height: 25px;/*This is important. Because the primary list items are floated left, #blackbar (and so also #header2) don't actually have any height from their contained elements (since they aren't floated), and so the next div, #content, will pull itself up and interfere with the header. In short, be careful.*/
	/* font-size: 16px; */
}
	
#blackbar a:hover {
	text-decoration: none;
}
	
#blackbar li.parent > a:hover {
	cursor: default;
}
	
#blackbar > li {
	float: left;
	list-style: none;
	margin-right: 20px;
	margin-top: 1px;
}
	
#blackbar li ul {
	display: none;
	position: absolute;
	border: 1px solid;
	border-top: 0px;
}
	
#blackbar li:hover ul {
	display: block;
}
	
#blackbar li ul li 
{list-style: none;}
	
#blackbar li ul a {
	padding: 3px 5px;
}
	
#blackbar a {
	display: block;
	text-decoration: none;
}
	
/*---------------Content---------------*/

#content
{  
  padding: 0px 24px;
  min-height: 450px;
} 

p
{ 

/*  font-family: sans-serif; */
  font-style:normal;
  /*font-weight: bold;*/
  font-size:100%;
  padding-bottom: 10px;

 }

#content p#warn
{ color:red;
  
  padding: 24px 0px;
  }
  
 #content #userDirection {
	margin-bottom: 0px;
 }
 
#content #userDirection ul {
	font-size: 16px;
}
  
 #content p#warn, #content #userDirection {
padding-bottom: 16px;
  font-family: arial, sans-serif;
  font-size: 20px;
  font-weight: bold;
 }

#contentContainer {
	width: 420px;
	float: left;
	clear: left;
}

#sidebarContainer {
	width: 168px;
	float: right;
	clear: right;
	padding-left: 12px;
}

#sidebarContainer ul .heading {
	border-bottom: 0px;
	padding-left: 0px;
	margin-left: 0px;
	font-size: 1.14em;
}

#sidebarContainer li {
	padding: 2px;
	margin-left: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

#sidebarContainer li a {
	text-decoration: none;
	color: black;
}

#sidebarContainer li:hover {
	/*background-color: lightGrey;*/
}

 
 /*---------------Footer--------------*/
 
#footer {  
	border: 10px solid;
	width: 630px;
}

#footer p 
{
  font-family: sans-serif;
  font-style:normal;
  font-weight: bold;
  font-size:100%;
  padding: 10px 0px;
  padding-left:30px;
  text-align: center;
}
	


/*---------------Forms--------------*/

/*-----General Forms-----*/
.submit, form.smallForm input.submit {
	/*colors set above*/
	border:1px solid black;
	font-size:16px;
	padding:2px 10px;
	font-weight:bold;
	width: auto;
}

fieldset {
	border: 1px solid;
	padding: 10px;
}

fieldset legend {
	font-weight: bold;
	margin: 0px;
	padding: 0px;
}
	
input.month, input.day, input.minute, input.hour, input.second, input.shortNumber {
	width: 1.5em;
}
	
input.year {
	width: 2em;
}
	
input.zip {
	width: 5em;
}
	
select.country {
	width: 10em;
}

input.title, input.subtitle {
	width: 15em;
}

textarea.preview,textarea.extra, textarea.editor_note {
	height: 6em;
}

textarea.body {
	height: 15em;
}

textarea.preview, textarea.body, textarea.extra, textarea.editor_note {
	width: 100%;
}

input.email, input.userName, input.pswd, input.pswdHint, input.address, input.city, input.state {
	width: 10em;
}
	
label .optleft, label .optright {
	font-size: small;
	font-variant: small-caps;
	position: absolute;
	margin-top: 1em;
}
	
label .optleft {
	margin-left: 0.5em;
}
	
label .optright {
	margin-left: -5em;
}
	
.formSmallNote {
	font-size: small;
	font-variant: small-caps;
}

.underSubmitOptions li {
	padding: 4px 0px;
}



/*-----Login Form-----*/
#login{ 
	font-family: arial, sans-serif;
}

#login form {
	width: 300px;
	margin:0px auto;
}

#login form > ul > li {
	padding: 8px 0px;
}

#login form .warning {
	padding: 0px;
	font-size: 16px;
}

#login form label {
	display: block;
	font-size: 20px;
}

#login input.email, #login input.pwd {
	font-size:20px;
	padding:3px;
	width:290px;
	border-width: 1px;
	border-style: solid;
}

#login form .submitContainer {
	text-align: right;
}



/*-----Small Forms-----*/
form.smallForm{ 
	font-family: arial, sans-serif;
	padding: 3px;
	width: 300px;
	margin:0px auto;
	}

form.smallForm > ul > li {
	padding: 8px 0px;
}

form.smallForm .warning {
	padding: 0px;
	font-size: 16px;
}

form.smallForm label {
	display: block;
	font-size: 20px;
}

form.smallForm input{
	font-size:20px;
	padding:3px;
	width:290px;
}

form.smallForm .submitContainer {
	text-align: right;
}



/*-----Subscribe/Register Form-----*/
#regForm {
	
}

#regForm fieldset{
	width: 450px;
	border-bottom: 0px; /*This is clunky, but it maintains the default for border-top.*/
	border-left: 0px;
	border-right: 0px;
}
	
#regForm fieldset legend {
	padding: 0em 0.3em;
}
	
#regForm fieldset li{
	padding: 0.5em;
}

#regForm fieldset li label{
	width: 200px;
	float: left;
	font-weight: bold;
	/*text-align: right;
	padding-right: 10px;*/
}

#regForm fieldset li label .optleft {
	font-weight: normal;
}

#regForm #regFormSubmitDiv {
	width: 450px;
	text-align: center;
	padding: 10px;
}

#regForm #disclaimerText {
	height: 300px;
	overflow: auto;
	background-color: white;
	padding: 5px;
}

#regForm #disclaimerText p {
	font-weight: normal;
}

#regForm #disclaimerText p.strong {
	font-weight: bold;
}

/*-----Edit/Create Post Form-----*/
.editPost label {
	display: block;
	font-size: 16px;
}

.editPost .smallLabel {
	display: inline;
	font-size: inherit;
}

.editPost .submitContainer {
	text-align: center;
}

.editPost li li {
	padding: 5px 0px;
}

/*-----Edit/Create Schedule Form-----*/
.scheduleForm label {
	display: block;
	width: 10em;
	float: left;
	font-size: 16px;
}

.scheduleForm .schedulePostList li {
	width: 20em;
	padding: 5px 0px;
}

.scheduleForm li:hover .viewPostDisplay {
	display: inline;
}

/*-------------------------Posts-------------------------*/
.previewPost .body {display: none;}

.fullPost .loadFullPost {display: none;}

.post .pdf {text-align: right;}

.post .extra, .post .postedby, .post .admin {font-size: 12px;}

.post .extra {
	font-style: italic;
}

.post .postedby {
	text-align: right;
	color: #555;
}

.post .admin {
	text-align: right;
}

.post .subheading_list ul {
	list-style: disc inside;
	padding-bottom: 16px;
}

.post > li {
	padding-bottom: 10px;
}

.post > li.title {
	padding-bottom: 10px;
}

/*-------------------------Specific Pages-------------------------*/
/*-----contact.php-----*/
#contact #contentContainer ul {
	padding-bottom: 16px;
}

/*-----about-----*/
#about .letterBody p {
	text-indent: 2.5em;
}

#about .quote {
	margin-left: 27%;
}

#about .quoteName {
	text-align: right;
	margin-right: 13%;
}

#about {
	font-size: 14pt;
	padding-top: 8px;
}

/*-----subscribe-----*/
#subscribe h3, #subscribe .address {
	text-align: center;
}

#subscribe .address {
	text-indent: 0px;
	font-weight: bold;
}

#subscribe .priceDeclaration {
	font-weight: bold;
	text-indent: 0px;
}

#subscribe .notice {
	text-indent: 0px;
}

#subscribe p {
	text-indent: 2.5em;
	padding-bottom: 0px;
}

#subscribe #disclaimer {
	padding: 10px 3.7em;
	font-family: arial, sans-serif;
	font-size: 0.85em;
}

#subscribe #disclaimer p {
	text-indent: 0px;
	padding-bottom: 10px;
}


/*-------------------------Sidebars-------------------------*/



/*-------------------------Center Boxes-------------------------*/
.centerBox {
	background-color: white;
	border: 1px solid #3e8f90;
}

/*-----Disclaimer-----*/
.centerBox #disclaimerText {
	height: 350px;
	overflow: auto;
	padding: 5px;
	margin-bottom: 10px;
}

.centerBox #disclaimerText p {
	font-weight: normal;
}

.centerBox #disclaimerText p.strong {
	font-weight: bold;
}

.centerBox #disclaimerContainer > p {
	padding: 5px;
}