html, body {margin: 0; padding: 0; border: 0;}
body {background-color: #FFFFFF; color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 0.9em; line-height: 1.5em; text-align: center;}
div {color: #000000; text-align: left; }
input {font-family: Arial, sans-serif; padding: 2px;}
textarea {font-family: Arial, sans-serif;  padding: 2px;}
select {font-family: Arial, sans-serif; padding: 2px;}
form {display: inline;}
hr {color: #CCE290; height: 1px;}
h1 {font-size: 1em;}
h2 {font-size: 0.9em;}
p {margin-top: 0px;}

a {color: #82bc4b; text-decoration: underline;}
a:hover {color: #82bc4b; text-decoration: none;}

.clear {clear: both; overflow: hidden; line-height: 8px;}
.bold {font-weight: bold;}
.normal {font-style: normal; font-weight: normal;} 
.left {float: left;}
.right {float: right;}
.padded {padding: 4px;}
.paddedLeft {padding-left: 8px;}
.paddedRight {padding-right: 8px;}
.paddedTop {padding-top: 8px;}
.small {font-size: 0.8em;}
.medium {font-size: medium;}
.title {padding: 4px 0px; margin-bottom: 10px; font-weight: bold; font-size: 1.3em; color: #ad208e;}
.content {}
.content img {margin: 5px;}
.message {padding: 4px 0px; margin: 4px 0px; font-weight: bold; color: #333333; font-size: medium;}
.alert {padding: 4px 0px; font-weight: bold; color: #990000; font-size: medium;}
.banner {margin-bottom: 8px; padding-top: 4px;}
.paging {padding: 6px 0px; border: 1px solid #ad208e; border-width: 1px 0px; margin: 8px 0px;}
.dotLine {border-bottom: 1px dotted #B3C77E; padding: 0px; margin: 1px 0px; height: 1px; overflow: hidden;}
.solidLine {border-bottom: 1px solid #B3C77E; padding: 0px; margin: 1px 0px; height: 1px; overflow: hidden;}
.blankLine {height: 10px; overflow: hidden;}
.ulPlain {padding: 0px; margin: 0px; list-style-type: none;}
.breakWord {word-wrap: break-word;}
.hint { color: #999999; }
.containBox {border: 1px dotted #C4C8AA; padding: 4px; margin: 8px 0px;}
.borderSolid {border: 1px solid #663300;}
.icon {padding: 0px; margin: 0px; text-align: bottom;}
.iconContainer {margin: 2px 0px; }
.lightBg {background-color: #ECF5E1;}
.hr {color: #CCE290; height: 1px; width: 99%;}

#body {width: 750px; margin: auto;}
#header {width: 750px; margin: 20px 0px; background-color: #FFFFFF;}
#logo {float: left; margin-bottom: 15px;}
#main {width: 750px;}
#footer {width: 750px; margin: 25px 0px 15px 0px;}
#contentBody {clear:both;}

#popupHeader {padding: 0px; background-color: #2B7C41; margin: 0px 0px 15px 0px;}
#popupLogo {}
#popupContent {padding: 10px;}
#popupFooter {padding: 10px 15px; background-color: #EEF3E4; margin: 10px -5px -15px -5px;}

/* menu styles */
#mainMenu ul {padding: 0px; margin: 0px 0px 10px 0px; background: #82bc4b; float: left; width: 750px; font-weight: bold; font-size: 0.9em;}
#mainMenu ul li {display: inline;}
#mainMenu ul li a {padding: 1px 13px 3px 13px; background: transparent; background-position: right; color: #FFFFFF; text-decoration: none; float: left; border-right: 1px solid #FFFFFF;}
#mainMenu ul li a:hover {background-color: #ad208e; color: #FFFFFF;}

/* line rules */
.dotLine {border-bottom: 1px dotted #ad208e; padding: 0px; margin: 10px 0px; height: 1px; overflow: hidden;}
.solidLine {border-bottom: 1px solid #ad208e; padding: 0px; margin: 10px 0px; height: 1px; overflow: hidden;}
.blankLine {height: 10px; overflow: hidden;}

/* form styles */
.button {border: 1px solid #82BC4B; background-color: #82bc4b; padding: 1px 6px; color: #FFFFFF; cursor: hand;}
.form {float: left; width: 100%; margin: 0px; padding: 0px; text-align: left; }
.form fieldset {border: none; padding: 0; margin: 0;}
.form legend {display: none;}
.form a {}
.form label {font-weight: normal;}
.form input {}
.form textarea {}
.form select {}
.form .checkbox {border: 0px;}
.form .radio {border: 0px;}
.form .cell {float: left; padding: 0px 0px 3px 0px; color: #333333; min-height: 30px; line-height: 1.5em;}
.form .cell .side {display: none;}
.form .cell .text {width: 95%;}
.form .cell .input {width: 95%;}
.form .box {float: left; width: 100%; padding: 4px; background-color: #FFFFEA; border: 1px solid #000000;}
.form .heading {font-weight: bold; padding: 4px 0px; color: #ad208e; margin-bottom: 10px; font-size: 1.3em;}
.form .errors {padding: 4px;} 
.form .errors ul {color: #FF0000;}
.form .spacer {clear: both; width: 100%; height: 20px;}
.form .divide {border-bottom: 1px dotted #B3C77E; padding: 0px; margin: 1px 0px; height: 1px; overflow: hidden; clear: both;} 
.form .error {font-weight: bold; color: #FF0000;} 
.form .errorCell {background-color: #FF6666;} 
.form .errorCell input {border: 1px solid #FF0000;}
.form .required {font-weight: bold;}
.form .requiredCell {} 
.form .requiredCell input {border: 1px solid #FF6600;}
.form .message {padding: 4px;}
.form .buttons {margin: 10px 0px;}
.form .buttons input {background-color: #82bc4b; padding: 1px 1px; color: #FFFFFF; cursor: hand;}

/* search styles */
#search {float: right; margin-top: 72px; font-size: 0.85em;}
#search label {padding: 5px;}
.searchInput {width: 120px; border: 1px solid #82bc4b; }
.searchSelect {width: 130px; padding: 1px;}

.searchItem {width: 100%}
.searchLeft {float: left;}
.searchImg {padding: 3px 0px; width: 70px; height: 70px; margin-right: 10px;}
.searchRight {float:left;}
.searchResult {float: left; padding: 0px 0px 0px 3px;}
.searchNote {font-size: 0.85em; border: 1px dotted #ad208e; background-color: #E0E3EB; padding: 4px; width: 620px;}
.brief {font-size: 0.85em;}
.searchHighlight {border-bottom: dotted 1px #ad208e;}

/* plant finder */
.plantFinder {}
.plantFinder .element {padding: 4px 0px; font-style: italic;}
.plantFinder .subTitle {font-weight: bold;}
.plantFinder select {width: 300px; margin-right: 5px;}
.match {color: #333333; font-weight: bold; }

/* indices */
.index {}
.index ul {padding: 2px 0px 3px 0px; margin: 10px 0px -10px 0px; list-style-type: none; background-color: #F3EDF0; border-bottom: #ad208e 3px solid;}
.index li {display: inline; padding: 4px 4px 6px 6px; }
.index li a {text-decoration: none; }
.index li.selected {background-color: #e4c6d2; font-weight: bold;}

.indexPlant ul {padding: 0px; margin: 0px; list-style-type: none;}
.indexPlant li {padding: 4px 0px;}

.indexProblem ul {padding: 0px; margin: 0px; list-style-type: none;}
.indexProblem li {padding: 4px 0px;}

.plantListUl {margin: 0px; }
.plantListLi {border-bottom: 1px dotted #B3C77E; padding-bottom: 5px; margin-top: 2px;}


/* plant styles */
.plantLabel {font-weight: bold; color: #333333; float: left; padding-right: 5px; padding-top: 2px;}
.plantText {font-weight: normal; color: #000000; padding-top: 2px;}
.plantImage {padding: 0px 5px;}
.plantName {font-style: normal;}
.plantLatinName {font-style: italic;}
.plantOtherName {font-style: normal; font-size: 0.85em;}
.plantThumb {border: 1px solid #663300;} 
.plantFeatureImage {border: 1px solid #663300;}
.plantListDetail {font-size: x-small;}
.plantingNote {border: 1px dotted #C8C77C; background-color: #EEF3E4; padding: 3px; width: 98%;}

.plantTabNav { list-style-type:none; margin:0; padding:0; }
.plantTabNav li { display:block; float:left; border: 1px solid #ABB8D5; border-bottom:0; padding: 3px 6px; background-color:#F3EDF0; margin-right: 3px; }
.plantTabNav li.selected { background-color: #E0E3EB; border-bottom: 1px solid #E0E3EB; margin-bottom: -1px; z-index: 100;}
.plantTabNav li a {text-decoration: none; font-weight: bold; }

.plantDetailsSheet {}
.plantFactSheet {background-color: #E0E3EB;  padding: 10px 6px; border: 1px solid #ABB8D5; border-top:0; width: 98%;}

.gardenPlantUl {margin: 0px; padding: 0px; list-style-type: none;}
.gardenPlantLi {display: inline;}

.alert {color: #990000; padding: 3px 0px;}

.plant_container { padding-top: 15px; clear: both; }
.plant_body_content { float: left; width: 560px; }