/* BASE STYLES */
/* set some base styles on some base elements */

/* set basic site colors and font */
body { background: #ffffff; color: #006600; font-family: "tahoma", "arial", "verdana", sans-serif; font-size: 76%; }

/* set basic site link colors */
a:link {
	color: #cf40a4;
	text-decoration: none;
	font-weight: bold;
}
a:visited {
	color: #551a8b;
	text-decoration: none;
	font-weight: bold;
}
a:hover {
	color: #0000ff;
	text-decoration: underline;
	font-weight: bold;
}

/* set headings */
h1, h2, h3, h4, h5, h6 { font-family: georgia, times new roman, times, serif; }
.transform {
  text-transform: uppercase;
}
h1 { margin: 0; padding: 0em; font-size: 3.2em; line-height: 1.4em; }
/* h2 is used for the first level heading in main content area - for example: Welcome */
h2 { margin: 0; padding: 0.3em 0 0 0; border-bottom: 1px solid #cf40a4; font-size: 1.6em; line-height: 1.2em; font-weight: bold; }
/* h3 is used for a second level heading in main content area  */
h3 { margin: 0.3em 0 0 0; padding: 0.3em 0 0 0; font-size: 1.6em; line-height: 1.2em; font-weight: normal; font-style: normal; }
/* h4 is used for a third level heading in main content area */
h4 { margin: 0.3em 0 0 0; padding: 1em 0 0.3em 0; font-size: 1.2em; line-height: 1.5em; font-weight: bold; font-style: normal; }
/* h5 is used for a fourth level heading in the main content area */
h5 { margin: 0; padding: 1em 0 0.3em 0; font-size: 1.2em; line-height: 1.2em; font-weight: normal; }
/* h6 is used as a smaller different color heading in the main content area */
h6 { color: #ff2a00; font-size: 1.2em; font-weight: bold; }

p { margin: 0.7em 0 0.3em 0; padding: 0 0 0.3em 0; }

em { font-style: italic; }
strong { font-weight: bold; }
sup { font-weight: normal; }

dl { margin: 1em 0 0.3em 0; padding: 0 0 0.3em 0; }
/* make dt's bold - used for schedules, faq's, benefits, etc. */
dl dt { margin: 0.5em auto 0.3em 0; padding: 0em 0 0 0em; font-weight: bold; }
dl dd { margin: 0.3em auto 0.3em 0em; padding: 0 0 0 2.3em; }

/* set base bullet styles */
ul { margin: 0.3em 0 0.3em 0; padding: 0 0 0.3em 0; list-style: inside square; }
ul li { margin: 0.3em 0 0.3em 1em; padding: 0.3em 0 0 0.3em; }
ul ul { padding: 0; list-style: inside circle; }
ul ul li { margin: 0.3em 0 0.3em 1em; padding: 0.3em 0 0 0.3em; }

/* set hr color and style */
hr { height: 0; border: 0; border-top: 1px dotted #006600; }

/* make sure tables clear rightasides and rightfloats */
table { clear: right; margin: 1em 0 0.3em 0; border-collapse: collapse; border: 1px solid #006600; }
/* style table caption */
table caption { margin-top: 1.3em; font-style: italic; }
/* style table headers */
table thead th { padding: 7px; text-align: center; font-weight: bold; }
/* style table cells */
table tbody td { padding: 7px; }

/* set base margin on form elements - for google serach in gallery */
form label, form input { margin: 0.3em; }
form input { color: #006600; border-color: #006600; border-width: 1px; }
form input[type="submit"] { font-variant: small-caps; }

/* turn off borders on images - especially on image links */
img { border: 0; }
img a { border: 0; }

/* ladyslipper image - css dynamically controls size - size is left out of the html - if in html then the css sizing does not work*/
img#lady { width: 88%; margin: 0.3em 0 0.3em 0; padding: 0; }


/* GENERAL PURPOSE CLASSES for use wherever needed */
/* some current uses are noted */
.new { color: #ff2a00; }
/* used in main content to make things look pretty - such as mail to addresses - downloads - etc */
.center { text-align: center; }
/* used on book titles */
.ital { font-style: italic; }
/* used in gallery menu - used in calling card table */
.small { font-size: small; }
/* used in calling card table */
.xsmall { font-size: x-small; }
/* used on p as photo caption in gallery */
.caption { font-weight: bold; }
/* used on p as photo credit in gallery */
.credit { font-size: small; font-style: italic; }
/* italicize scientifc names - also used in plant tables */
.scientific { font-style: italic; }
/* add color to invasive and rare statuses - used in plant tables */
.status { color: #ff6600; font-style: italic; }
/* affect "posted by" footers to entries */
.posted {
margin-bottom: 10px;
font: 10px lucida grande, verdana, arial, helvetica, sans-serif;
background: transparent;
color: #666;
}
.recent{
margin-bottom: 10px;
font: 11px lucida grande, verdana, arial, helvetica, sans-serif;
background: transparent;
color: #666;
}


/* HEADER STYLES */
#header { text-align: center; }
/* set site title link effects */
#header h1 a { color: #006600 !important; text-decoration: none; }
#header h1 a:hover { color: #cf40a4 !important; }
/* make LEVEL 1 PAGE NAV flow horizontally */
#header ul.nav { width: 100%; margin: 0.5em 0 0.5em 0; padding: 0.5em 0 0.5em 0; list-style: none; color: #ffffff !important; background: #006600 !important; border-top: 3px double #cf40a4; border-bottom: 3px double #cf40a4; font-size: 1.4em; }
/* nowrap - to make sure the menu items are not cut up - this is done instead of using nobr in the html */
#header ul.nav li { white-space: nowrap; display: inline; margin: 0; padding: 0em 0.5em 0.5em 0.5em; }
/* set LEVEL 1 PAGE NAV link effects */
#header ul.nav a { color: #ffffff !important; text-decoration: none; }
#header ul.nav a:hover { color: #ff66ff !important; text-decoration: underline; }
#header ul.nav .active, #header ul.nav .active a, #header ul.nav .activecat a { color: #ff66ff !important; }


/* SIDEBAR STYLES */
/* place bar, style text */
#sidebar { float: left; width: 23%; min-width: 150px; margin: 0em 0.7% 0.7em 0.7%; padding: 0em 0.7% 0.5em 0.7%; text-align: center; font-size: 1.3em; }
#sidebar p { margin: 0; padding: 0.3em 0em 0.3em 0em; }
#sidebar h5 { padding-top: 0.5em; }
/* style LEVEL 2 PAGE NAV */
#sidebar ul.nav { margin: 0.3em 0 0.3em 0em; padding: 0 0 0.3em 0; list-style: none; }
/* nowrap - to make sure the menu items are not cut up - this is done instead of using nobr in the html */
#sidebar ul.nav li { white-space: nowrap; margin: 0.3em 0 0.3em 0; padding: 0.2em 0 0 0em; }
/* make LEVEL 2 PAGE NAV a to z menu in gallery display right */
#sidebar ul.nav ul li { display: inline; }
/* set LEVEL 2 PAGE NAV link effects */
#sidebar ul.nav li a { color: #cf40a4; text-decoration: none; }
#sidebar ul.nav li a:hover { text-decoration: underline; }
#sidebar ul.nav li.active, #sidebar ul.nav li.activecat { color: #006600; font-weight: bold; }


/* LEVEL 3 PAGE NAV - in main content area */
#maincontent .nav { display: block; margin: 0.5em 0 1em 0; border-left: 1px dotted #006600; }
/* nowrap - so each menu item is not cut up - this is done instead of using nobr in the html */
#maincontent ul.nav li { white-space: nowrap; display: inline; margin-bottom: 0; margin-top: 0.3em; }
#maincontent ul.nav li.active, #maincontent ul.nav li.activecat { font-weight: bold; }
#maincontent .nav dt { margin-left: 0.5em; margin-top: 0.3em; margin-bottom: 0; font-weight: normal; }
#maincontent .nav dd { margin: 0 2.3em 0 0; }

/* JUMP TO NAV - for jump to anchor menus - in main content area */
/* jumpright does same but aligned right instead of left - used for back to top and see also */
#maincontent .jump, #maincontent .jumpright { margin: 0; padding: 0 0 0 0.5em; font-size: small; font-style: italic; }
#maincontent .jumpright { text-align: right; }
/* nowrap - so each menu item is not cut up - this is done instead of using nobr in the html */
#maincontent ul.jump li, #maincontent ul.jumpright li { white-space: nowrap; display: inline; }
#maincontent dl.jump { margin-left: 1.3em; }
#maincontent .jump dt { margin-bottom: 0; font-weight: normal; }
#maincontent .jump dd { margin: 0 2.3em 0 0; font-style: normal; }


/* MAIN CONTENT AREA STYLES */
#maincontent  { font-size: 1.3em; line-height: 1.3em; margin: 0.5em 7% 3% 28%; position: relative; min-width: 190px; max-width: 680px }
/* constrain images so they can not make page too wide */
#maincontent img { max-width: 95%; height: auto; }


/* FOCUS - in main content */
/* adds visual focus - a border - does not change width */
#maincontent .focus { margin-top: 0.7em; padding: 0.5em 1em 1em 1em; border: 1px dotted #006600; text-align: center; }


/* RIGHTASIDE and RIGHTFLOAT - in main content area */
/* rightaside - floats right - changes width - adds border */
/* rightfloat - floats right - changes width */
/* always test first before making live since things don't always flow nicely */
#maincontent .rightfloat, #maincontent .rightaside { float: right; clear: right; margin: 1em 0 0.7em 1em; text-align: center; }
//#maincontent .rightaside { width: 41%; min-width: 125px; padding: 1em; border: 1px dotted #006600; }
#maincontent .rightaside { width: 41%; min-width: 125px; padding: 0em; border: none; }
#maincontent .rightaside h3, #maincontent .rightaside h4 { margin-bottom: 0.3em; padding: 0; }
#maincontent .rightaside dl{ margin: 1em 0 0.3em 0; padding: 0 0 0.3em 0; } 
/* style dt's - make bold - used for chapter schedules */
#maincontent .rightaside dl dt { margin: 0.3em auto 0.3em 0em; font-weight: bold; }
#maincontent .rightaside dl dd { margin: 0.3em auto 0.3em 0em; padding: 0 0 0 0; }
#maincontent .rightaside ul li { margin-left: 0; margin-right: 0; } 
#maincontent .rightaside p { margin-top: 0.3em; padding: 0.3em 0 0.3em 0; }
/* shorten hr's */
#maincontent .rightaside hr { width: 37%; }

/* LEFTFLOAT - in main content area */
/* leftfloat - floats left - changes width */
img.leftfloat { float: left; clear: left;}

/* TABLES - COMMON STYLES */
/* styles used in tables - not dependant on the table's class */
table thead th.scientific { font-style: normal; }
table tbody td.thumb { text-align: center; font-style: italic; }
table tbody td.thumb img { vertical-align: middle; }

/* GALLERY TABLES STYLES - tables with class plants */
/* special styles for the table on each a to z gallery page */
table.plants tbody td.nativealien { text-align: center; }

/* PORTRAIT TABLES STYLES - tables with class portrait */
/* special styles for the table on each plant portrait page */
#maincontent table.portrait h4 { margin: 0; padding: 4px; }
#maincontent table.portrait p { text-align: center; }
#maincontent table.portrait td.scientific { width: 60%; }

/* FOOTER STYLES */
/* place it, style text, clear all floats so it will always be below the sidebar and any floated content in main content area */
#footer { width: 100%; clear: both; margin-top: 1em; text-align: center; font-style: italic; }
/* style text links */
#footer a { font-style: normal; }
/* shorten hr's */
#footer hr { width: 23%; }
/* turn off img link borders */
#footer img { border: 0; }
/* conact class is the actual BAR with background and borders */
#footer .contact { width: 100%; padding: 0.5em 0 0.5em 0; background: #006600 !important; color: #ffffff !important; border-top: 3px double #cf40a4; border-bottom: 3px double #cf40a4; font-style: normal; font-weight: bold; }
#footer .contact p { margin: 0; }