/* Cascading Sytle Sheet for Midcoasty Green Collaborative Website pages. */
/* UNIVERSAL ATTRIBUTES */
* {
	/*zeroes out margins so we control them, not the browser*/
	margin: 0;
	border: 0;
	padding: 0;
}

body {
	background: #99dd99 url(images/background.gif) 0 0 repeat-y;
	font-size: 100%;
	font-family: Arial, san-serif;
	text-align: left; /* IE bug fix? */
}

/* REGIONS */
/* Horizontal regions - Note: all widths must equal 100% (Adding width, border, and margin tags) */

#leftcol { /* for left columns for 2 or 3 column page */
	float: left;
	width: 20%;
	margin: 0%;
	display: inline; /* fix for IE for windows margin bug */
	text-align: center;
}

#midcol { /* center column in three column page*/
	float: left;
	width: 60%;
	display: inline; /* fix for IE for windows margin bug */	;
}

#full { /* single column page */
	width: 80%;
	margin: 0 auto;
}
	
#rightcol { /* right column in three column page*/
	float: left;
	display: inline; /* fix for IE for windows margin bug */
	width: 20%;
}

#rightdbl { /* right column in a two column page */
	float: left;
	width: 80%;
	display: inline; /* fix for IE for windows margin bug */	
	text-align: justify;
}

/* vertical sections within a coloumn */
#banner {
	padding: 2%;
	text-align: center;
}
#main {
	margin: auto;
	padding: 2%;
	background: white;
	border: 1px #669966 solid;
	text-align: justify;
}
#foot {
	margin: 1.5% 2%;
	float: left;
	clear: both;
	width: 96%;
	text-align: center;
}
/* INTERNAL ELEMENTS */

div.picture {
	margin: 4% 4% 1% 4%;
	text-align: center;
}
div.picleft {
	float: left;
	margin: 0.7% 4% 1% 6%;
	text-align: left;
}
div.picright {
	float: right;
	margin: 0.7% 4% 1% 4%;
	text-align: right;
}

/* TYPOGRAPHY */

h1, h2, h3, h4, h5, h6 {
	font-family: 'Copperplate Gothic Bold','Copperplate', sans-serif;
	font-weight: normal;
	color: #006600;
	margin: 11px 0.8% 5px 0.8%;
	padding: 0;
	text-align: center ;
}
h1 {
	font-size: 300%;
	font-weight: bold;
	text-shadow: 3px 3px 3px #669966;
}
h2 { font-size: 200%; }
h3 { font-size: 170%; }
h4 { font-size: 130%; }
h5 { font-size: 110%; }
h6 { font-size: 100%; }

#main h5, #main h6 { padding: 7px 3.0em 5px 3.0em }

	
hr {
	margin: 0 5%;
	text-align: center;
	border: 1px solid #669966;
	padding: 1px;
	width: 90%;
}

table {
	margin: 0 3%;
	text-align: left;
	font-family: Arial, san-serif;
	border-collapse: collapse;
	vertical-align: middle;
}

th, thead {
	padding: 1em;
	font-family: 'Copperplate Gothic Bold','Copperplate', sans-serif;
	text-align: center;
}

td {
	background: white;
	color: black;
	border: 1px #669966 solid;
	padding: 1.0em;
	vertical-align: middle;
	text-align: justify;
}

table.bare {
	margin: 1.2% 7%;
	width: 86%;
}

table.bare > tbody > tr > th, table.bare > tbody > tr > thead  {
	background: white;
	font-family: Arial, san-serif;
	border: 0;	
	padding: 1px 7px;
	font-weight: bolder;
	font-size: 85%;
}
table.bare > tbody > tr > td  {
	border: 0;	
	padding: 1px 7px;
	font-size: 85%
}

li.open { padding: 6px 0; }

em {
	font-style: italic;
}

p {
	margin: 1.6% 6.0%;
	padding: 0;
	max-width: 35em;
	color: black;
	text-align: justify;
	text-indent: 1.3em;
	line-height: 1.23em;
}

td > ul, td > ol {
	margin: 0.1em 2.0em 0.1em 2.0em;
	padding: 0;
	max-width: 35em;
}

ul, ol {
	margin: 1.6% 6.0%;
	padding: 0;
	max-width: 35em;
	text-align: left;
	line-height: 1.23em;
}

li {
	margin: 0;
	padding: 0;
	text-indent:0;
}

q blockquote {
	margin: 0.6em;
	border: 1px #669966 solid;
	padding: 0.4em;
	color: #006600;
	font-weight: bolder;
	font-size: 114%;
	text-align: center;
	display: block;
	max-width: 28em;
}

#foot p { text-indent: 0; }

img.illus {
	margin-left: auto;
    	margin-right: auto;
	background: white;
	border: 1px solid #669966;
	padding: 5px;
	width: 15em;
	display: inline;
}

img.inline {
	margin-left: auto;
    	margin-right: auto;
	background: white;
	border: 1px solid #669966;
	padding: 5px;
	width: 97.5%;
	display: inline;
}

img.logo, img.scaleable {
	width: 100%;
	margin: 0;
	border: 0;
	padding: 0;	
}

img.sized {
	margin-left: auto;
    	margin-right: auto;
	background: white;
	border: 1px solid #669966;
	padding: 5px;
	display: inline;
}

br.left { clear: left; }
br.right { clear: right; }
br.both { clear: both; }

input:focus { border-color: red; }

/* LINKS (love before hate) */
a { color: blue; }
a:link { text-decoration: none; }
a:visited {
	color: #008899;
	text-decoration: none;
}
a.img:visited { color: #006699; }
a:hover {
	color: blue;
	text-decoration: underline;
}
a.img:hover {
	color: blue;
	text-decoration: none;
}
a:active { color: purple; }

/* CLASSES (in alphabetical order) */
.alert { 
	color: red;
	font-weight: bold;
	font-size: 150%;
}
.author {
	color: navy;
	text-align: right;
	margin: 0 20% 0 10%;
	max-width: 35em;
}
.bio {
	color: #339933;
}
.booktitle { text-decoration: underline; }
.caption {
	font-size: 70%;
	color: #006600;
	text-align: center;
}
.center {
	text-align: center;
	text-indent: 0;
	max-width: 100em;	
}
.credit {
	font-size: 60%;
	color: #666666;
	text-align: left;
}
.dimmed { color: gray; }
.green { color: #006600; }
.hidden { color: white; }
.important {
	font-size: 108%;
	text-align: justify;
	max-width: 32em;
}
.justify { text-align: justify; }
.locator {
	margin: 10px 0 0 0;
	text-align: left;
	text-indent: 0;
	color: gray;
	font-size: 70%;
	font-weight: lighter;
}
.noborder { border: 0; }
.noscreen { display: none; }
.reduced { font-size: 80%; }
.right { text-align: right; }
.short {
	text-indent: 0;
	text-align: left;
}
.trivial {
	font-size: 85%;
	color: gray; 
	font-weight: lighter;
}
.wide {
	margin: 0.4em 1em;
	padding: 0;
	text-indent: 0;
	text-align: center;
}