@charset "utf-8";
/*www.californiafungi.com copyright Michael Wood*/

*{
	margin: 0;
	padding: 0;
}

a:link{
	color: #0000FF;
}

a:visited{
	color: #000080;
}

a:hover{
	background: #FFFF00;
	color: #0000FF;
}

a:active{
	color: #FF0000;
}

body{
	background-color: #FEFEDE;
/*	font-family: Georgia,"Times New Roman",Times,serif;
*/	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 100%;
	max-width: 900px;
	min-width: 750px;
	padding: 5px 10px 5px 10px;
	margin: 0 auto;
}

html {
	min-height: 101%;
	margin-bottom: 1px;
}

h1{
	padding-top: 5px;
	color: #800000;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 160%;
	font-weight: bold;
}

h2{
	color: #008080;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 130%;
	text-align: center;
}

h3{
	color: #000080;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 110%;
	font-weight: normal;
}

h4{
	color: #800000;
	font-family: serif;
	font-size: 110%;
	font-weight: normal;
	margin-bottom: -15px;
}

ol{
	padding-left: 25px;
}

p{
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: verdana,helvetica,arial,sans-serif;
	font-style: normal;
}

td{
	background-color: #FEFEDE;
	color: #000000;
}

th{
	background-color: #CCFF99;
	color: #000000;
}

ul{
	padding-left: 25px;
}

.author{
	color: #000000;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 100%;
	font-style: normal;
	font-weight: normal;
}

.citation{
	color: #000000;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 80%;
}

.footer{
	clear: left;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 60%;
	font-style: normal;
	padding-top: 15px;
	padding-bottom: 10px;
	margin-left: 40px;
}

.forthcoming{
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 60%;
	font-style: normal;
}

.genus{
	color: #990066;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 115%;
}

.genus a:link{
	color: #CC9900;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	text-decoration: none;
}

.genus a:visited{
	color: #990066;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	text-decoration: none;
}

.genus a:hover{
	background-color: #FFCC66;
	color: #CC9900;
	font-family: Verdana,Arial,Helvetica,sans-serif;
}

.genushead{
	padding-top: 10px;
	padding-bottom: 10px;
	color: #800000;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 100%;
	font-weight: bold;
}

.indentboth{
	margin-left: 10%;
	margin-right: 10%;
}

.larger{
	font-size: larger;
}

.listpad li{
	padding-bottom: 10px;
}

.mainPic {
	border-width: 2px;
	border-style: solid;
	max-width: 100%;
    height: auto;
}

.edibility {
	padding-right: 5px;
}

.newdate{
	color: #800000;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 110%;
	font-weight: normal;
	margin-bottom: 0px;
	padding-top: 10px;
}

.odp{
	margin-top: 5px;
}

.photographer{
	font-family: serif;
	font-size: 75%;
	font-style: normal;
}

.plist{
	margin-top: -1%;
}

.smaller{
	font-size: smaller;
}

.spdesc{
	/*font-family:Georgia,"Times New Roman",Times,serif;*/
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-style: normal;
/*	margin-top: 4px;*/
	margin: 0px 10px 10px 10px;
}

.species{
	color: #000066;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 120%;
	font-style: italic;
	font-weight: bold;
}

.species_index_menu{
	margin-top: 15px;
	margin-bottom: 10px;
}

.spheader{
	color: #800000;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 150%;
	font-style: italic;
	font-weight: bold;
	padding-bottom: 5px;
}

.spindexalpha{
	color: #800000;
	font-family: verdana,helvetica,arial,sans-serif;
	font-size: 130%;
	font-weight: bold;
	margin-bottom: 0px;
	padding-top: 5px;
}

.spli{
	color: #800000;
	font-family: Georgia,"Times New Roman",Times,serif;
	font-size: 110%;
	font-weight: bold;
}

.spref{
	font-style: normal;
	margin-top: 4px;
	font-size: 85%;
	padding-bottom: 5px;
}

.spsyn{
	font-family: times,serif;
	font-style: normal;
	margin-bottom: 4px;
	margin-top: 4px;
}

.tags{
	font-family: times,serif;
	font-size: 75%;
	font-style: normal;
	margin-top: -1%;
	padding-bottom: 10px;
}

p.biblio{
	font-size: 85%;
	line-height: 100%;
	padding-top: 0px;
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
}
#listmenu{
	/*background-color:#FFFFAA;*/
	margin-top: 10px;
	background-color: #FFCC66;
	border-bottom: 1px solid#008080;
	border-left: 1px solid #008080;
	border-right: 1px solid #008080;
	border-top: 1px solid #008080;
	float: left; /*makes the div enclose the list */
	font-size: .9em;
	width: 100%;
	text-align: center;
}

#listmenu a{
	color: #000000;
	padding: 5px 10px;
	text-decoration: none;
	text-align: center;
}

#listmenu a:hover{
	color: #800000;
	background: #FFFF00;
}

#listmenu li{
	background-color: #FFCC66;
	border-right: 1px solid #008080; /* creates dividing lines between the li elements */
	float: left; /* causes the list to align horizontally instead of stack */
	list-style-type: none;
	padding: 5px 0;
}

#listmenu li:hover{
	background-color: #FFFFFF;
}

#listmenu li:first-child{
	border-left: 1px solid #008080; /*the first vertical line on the menu */
}

#listmenu ul{
	margin: 0px 0px 0px 0px; /* indents ul from edge of container */
}

#main_wrap{
	margin: 0 2% 0 2%;
}

#species_wrap{
	margin: 0 1% 0 1%;
}

#spindex li{
	color: #000000;
	/*	font-family:Georgia,"Times New Roman",Times,serif;*/
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 110%;
	font-weight: normal;
	padding-bottom: 3px;
}

.floatRight {
	float: right;
}
.floatLeft {
	float: left;
}

.picLeft {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	border: 1px solid #000;
}

.picRight {
	float: right;
	margin-left: 5px;
	margin-bottom: 5px;
	border: 1px solid #000;
}

.hide {
	display: none;
}

@media screen and (min-width: 0px) and (max-width: 750px) {

     body {
         min-width:inherit;
     }
     .mainPic {
         width:100% !important; /* !important necessary to override inline html styles */
         height:auto !important;
     }

     /* below this is to make the lightbox work with the auto body width */

     div#lbCenter {
         width:100% !important;
         height:100% !important;
         margin-left:-50% !important;
         margin-top:-50% !important;
         background:none !important;
     }
     div#lbImage {
         width:100% !important;
         height:100% !important;
         top:0 !important;
         bottom:0 !important;
         background-size:contain;
         background-position:center;
         border:none !important;
     }
     div#lbImage > div {
         width:100% !important;
         height:100% !important;
     }
     div#lbImage > div a {
         height:100% !important;
     }
     div#lbBottomContainer {
         left: 50% !important;
         width: 100% !important;
         top: auto !important;
         bottom:0 !important;
     }

}  /* ----- end of conditional CSS ------ */