@charset "utf-8";

/* Important Notes
Paths in this file are relative to this file.
*/

/* CSS Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,p,th,td{
	margin: 0;
	padding: 0;
	text-align: left;
}

/* Set default text and background */
body {
	background-color: rgb(223,223,223);
	color: #000000;
	font-family: Arial, sans-serif;
	font-size: 15px;
	text-align: center;
	/*These are for the sticky footer*/
	position: relative;
	min-height: 100%;
	padding-bottom: 6.6em; /* 99 px */
}

img {
	display: block;
	border: 0;
}

/* Silly */
.spinny {
    animation: spinny 3600s linear infinite;
} @keyframes spinny {
	100% {	transform: rotate(360deg);	}
}

/*-------------*\
  Text Elements
\*-------------*/
p {
	text-align: justify;
	margin-bottom: 1em; /* 15 px */
}
.c {
	text-align: center;
}

/* Custom tag for small text: <sm></sm> */
sm {
	font-size: 70%;
}

h1, h2, h3 {
	margin-bottom: 0.6em; /* 9 px */
}
h1.c, h2.c {
	clear: both;
}

hr {
	clear: both;
	margin-top: 1.6em; /* 24 px */
	margin-bottom: 1.6em; /* 24 px */
} hr.invis {
	border: 0;
	margin: 0;
}
.activetext {
} .activetext:after {
	content: " \1F517  ";
}

/*------*\
  Tables
\*------*/
table, th, td {
	border-collapse: collapse;
	border-spacing: 0;
	padding: 0.5em; /* 3 px */
	margin-bottom: 1.6em; /* 24 px */
} 
table.pubs td:first-child {
	text-align: center;
}
table.cv tr td {
	min-width: 5em;
	max-width: 40em;
	padding-right: 2em;
} table.cv tr td p {
	margin-left: 1em;
	margin-bottom: 0;
}
table.talign tr td {
	vertical-align: top;
}

.dedent {
	margin-left: -1em;
}
.indent {
	margin-left: 1em;
	padding-left: 0.4em;
	border-left: 1px solid rgba(0,0,0,0.2);
}

ol.cv {
	margin-left: 1em;
	list-style-type: upper-alpha;
} ol.cv li {
	padding-bottom: 0.5em;
}

/*---------*\
  Main Divs
\*---------*/
div {
	display: block;
	text-align: left;
}
div.mainwrapper {
	width: 100%;
	height: 100%;
	min-height: 40em;  /* 600 px */
	text-align: center;
}

div.wrap {
	z-index: 40;
	margin: 0 auto;
	width: 60em;  /* 900 px */
	max-width: 60em;  /* 900 px */
	min-height: 26.6em;  /* 399 px */
	padding: 1.4em;  /* 21 px */
	background-color: rgba(240,240,240,0.75);
	background-image: url("../img_ui/bg.png");
	background-position: center;
	background-size: 100%;
	background-repeat: repeat-y;
	        box-shadow: inset 0px 0px 10px 10px rgb(223,227,236);
	   -moz-box-shadow: inset 0px 0px 10px 10px rgb(223,227,236);
	-webkit-box-shadow: inset 0px 0px 10px 10px rgb(223,227,236);
}
div.main {
	background-color: rgba(220,220,220,0.85);
	min-height: 20em;  /* 300 px */
	max-height: 53.4em;  /* 801 px */
	width: 57.2em; /* 879 px */
	overflow: auto;
	padding: 1.4em;  /* 21 px */
}
div.nav {
	background-color: transparent;
}
div.main img {
	border: 3px solid black;
} div.main img.x {
	border: 3px solid rgb(100,100,100);
} div.left img, div.right img {
	margin-bottom: 1em; /* 15 px */
}
div.main ul, div.main ol {
	width: auto;
	overflow: hidden;
	margin-bottom: 0.8em; /* 12 px */
}
div.main li {
	margin-bottom: 0.2em; /* 3 px */
	margin-left: 1.6em; /* 24 px */
}


/*-----------*\
  Column Divs
\*-----------*/
.left, .middle{/*Use for 2-3 columns*/
	float: left;
	max-width: 20em; /* 300 px */
	margin-right: 1.6em; /* 24 px */
}
.right {/*Use for a right-aligned image*/
	float: right;
	max-width: 20em; /* 300 px */
	margin-left: 1.6em; /* 24 px */
}
.col { /*Use for equal columns*/
	float: left;
	width: 46%;
	padding-left: 0.8em; /* 12 px */
	padding-right: 0.8em; /* 12 px */
	margin-bottom: 1.6em; /* 24 px */
} div.main .col p {
	margin-bottom: 0.8em; /* 12 px */
}
.float {/*Use for sub-columns*/
	float: left;
	margin-right: 1em; /* 15 px */
}
.labm {/*Use for PCYU lab member lists*/
	float: left;
	margin-right: 0.8em; /* 12 px */
	max-width: 7em; /* 105 px */
}
.gal { /*Use for gallery lists*/
	float: left;
	margin-right: 1.6em; /* 24 px */
	max-width: 17em; /* 255 px */
}

/*---------*\
  Galleries
\*---------*/
h1.family, h2.subfamily, h3.tribe, h3.genus {
	border: 1px solid black;
	padding: 0.2em; /* 6 px */
	clear: both;
	margin-bottom: 0.2em; /* 3 px */
} h1.family {
	background-color: rgb(255,255,0);
	font-size: 200%;
} h1.family, li.family {
	margin-left: 0px;
} h2.subfamily {
	background-color: rgb(215,215,0);
	font-size: 180%;
} h2.subfamily, li.subfamily {
	margin-left: 1em; /* 15 px */
} h3.tribe {
	background-color: rgb(175,175,0);
	font-size: 160%;
} h3.tribe, li.tribe {
	margin-left: 2em; /* 30 px */
} h3.genus {
	background-color: rgb(155,155,0);
	font-size: 140%;
} h3.genus, li.genus {
	margin-left: 3em; /* 45 px */
} 
div.entries {
	margin-top: 1em; /* 15 px */
	margin-left: 4.4em; /* 66 px */
} div.entry, div.entry_placeholder {
	float: left;
	max-width: 24.4em; /* 366 px */
	/*max-height: 40em; /* 600 px */
	margin-right: 1.4em; /* 21 px */
	margin-bottom: 2em; /* 30 px */
} 

div.entry img {
	margin-bottom: 0.6em; /* 9 px */
} div.entry h3, div.entry_placeholder h3 {
	padding: 0.2em; /* 3 px */
	text-align: center;
	background-color: black;
	color: white;
} div.entrylabel {
	min-height: 3.4em; /* 45 px */
} div.entry_placeholder {
	max-width: 50.2em; /* 753 px */
	width: 50.2em; /* 753 px */
} div.subcaption {
	background-color: black;
	color: white;
	text-align: center;
	margin-top: -1em;
	padding-bottom: 0.2em;
}
img.copylink {
	border: 0px;
	clear: none;
}

div.sidebar {
	z-index: 50;
	position: fixed;
	margin-left: -13.4em; /* -201 px */
	left: 13.4em; /* 201 px */
	width: 13.4em; /* 201 px */
	height: 100%;
	background-color: rgba(220,220,220,0.6);

	padding: 0em 0.6em 0em 0.6em; /* 0 9 0 9 px */
	overflow: auto;
} div.sidebar ul li {
	margin-left: 0.6em; /* 9 px */
} div.sidebar ul li ul li {
	margin-left: 0.6em; /* 9 px */
}
div.sidebar h1, div.sidebar h2, div.sidebar h3, div.sidebar h4, div.sidebar h5 {
	font-size: 80%;
	margin-bottom: 0px;
	margin-top: 0px;
} div.sidebar h1 {
	margin-left: 0px;
} div.sidebar h2 {
	margin-left: 0px;
} div.sidebar h3 {
	margin-left: 0.6em; /* 9 px */
} div.sidebar h4 {
	margin-left: 1.3em; /* 20 px */
} div.sidebar h5 {
	margin-left: 2.0em; /* 30 px */
}
div.sidebar_toggler {
	display: none;
	float: left;
	font-weight: bold;
	margin-right: 0.4em; /* 6 px */
	padding: 0.4em 0.6em 0.4em 0.6em;  /* 6 9 6 9 px */
	background: rgb(255,255,200);
} div.sidebar_toggler:hover {
	background: rgb(255,255,0);
} span.sidebar_toggler_noscript {
	float: right;
	max-width: 10em; /* 150 px */
	background: rgb(255,100,100);
	padding: 0.4em; /* 6 px */
	margin: 0.4em; /* 6 px */
	text-align: center;
	font-weight: bold;
}

/*--------*\
   Footer
\*--------*/
div.foot {
	height: 6.8em; /* 102 px */
	width: 60em; /* 900 px */
	min-width: 60em;
	font-size: 13px;
	padding: 0px;
	background-color: rgba(180,180,180,0.75);
	/*These are for the sticky footer */
	position: absolute;
	bottom: 0;
	text-align: center;
}
div.foot div {
	float: left;
	display: block;
	margin-left: 2em; /* 30 px */
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

/*----------*\
  Link Icons
\*----------*/
div.main a[href^="http"].out:after{
	content: url("../img_ui/icon_external.png");
	margin-left: 0.2em; /* 3 px */
	position: relative;
}

a[href$=".pdf"]:before, a[href$=".js"]:before, a[href$=".doc"]:before, a[href$=".docx"]:before, a[href$=".ppt"]:before, a[href$=".pptx"]:before, a[href$=".xls"]:before, a[href$=".xlsx"]:before, a[href$=".txt"]:before {
	line-height: 0.8em;
	margin-right: 0.4em; /* 6 px */
	position: relative;
	top: 0.2em; /* 6 px */
}
a[href$=".pdf"]:before {
	content: url(../img_ui/icon_pdf.png);
} a[href$=".pdf"]:after  { 
    content: " (PDF)"; 
} 
a[href$=".js"]:before {
	content: url(../img_ui/icon_js.png);
} a[href$=".js"]:after {
	content: " (JavaScript/Text)";
} 
a[href$=".doc"]:before {
	content: url(../img_ui/icon_doc.png);
} a[href$=".doc"]:after {
	content: " (Word Doc)";
} 
a[href$=".docx"]:before {
	content: url(../img_ui/icon_docx.png);
} a[href$=".docx"]:after {
	content: " (Word 2007+ Doc)";
} 
a[href$=".ppt"]:before {
	content: url(../img_ui/icon_ppt.png);
} a[href$=".ppt"]:after {
	content: " (PowerPoint)";
} 
a[href$=".pptx"]:before {
	content: url(../img_ui/icon_pptx.png);
} a[href$=".pptx"]:after {
	content: " (PowerPoint 2007+)";
} 
a[href$=".xls"]:before {
	content: url(../img_ui/icon_xls.png);
} a[href$=".xls"]:after {
	content: " (Excel)";
} 
a[href$=".xlsx"]:before {
	content: url(../img_ui/icon_xlsx.png);
} a[href$=".xlsx"]:after {
	content: " (Excel 2007+)";
} 
a[href$=".txt"]:before {
	content: url(../img_ui/icon_txt.png);
} a[href$=".txt"]:after {
	content: " (Plain Text)";
} 

/*---------------*\
  Navigation Menu
\*---------------*/
div.nav {
	clear: both;
	text-align: left;
	height: 2.6em; /* 39 px */
	z-index: 99;
}
div.home {
	margin-top: -0.4em; /* 6 px */
}
div.nav div.home {
	float: right;
	background-color: transparent;
	padding: 0.4em; /* 6 px */
} div.nav div.home img:hover {
	background-color: rgba(255,255,0,0.5);
}

/* Style links in the lists */
.nav ul li a {
	padding: 0.4em 0.6em 0.4em 0.6em;  /* 6 9 6 9 px */
	text-decoration: none;
	white-space: nowrap;
	color: rgb(0,0,0);
} .nav ul ul ul.long li a {
	min-width: 15em;
	white-space: normal;
}

/* Lists */
.nav ul {
	list-style: none;
	font-weight: bold;
}
.nav ul li {
	display: block;
	position: relative;
	float: left;
	margin-right: 0.4em;
	background-color: rgba(200,200,200,0.8);
} 

/* Create some space (and a border) around dropdown items for easier mouseover*/
.nav ul li ul li {
	margin-right: 1.6em; /* 24 px buffer for mouseover to the right of each item */
	width: calc(100% - 1.4em);
} .nav ul li ul li:last-child {
	margin-bottom: 2em; /* 30 px buffer for mouseover on the last item in each dropdown */
	border-bottom: 1px solid rgba(0,0,0,0.4);
} .nav ul li ul li:first-child {
	border-top: 1px solid rgba(0,0,0,0.4);
}

/* Hide sub-menus by default */
.nav li ul { display: none; }
.nav ul li a { display: block; }

/* Display dropdowns on hover */
.nav li:hover > ul { display: block; position: absolute; }
.nal li:hover li { float: none; }
.nav li:hover li a:hover { background: rgba(255,255,0,0.8); } 

/* Make the top-level active button yellow. */
.nav > ul > li:hover { background: rgb(255,255,0); }

/* Support multiple levels of nesting */
.nav ul ul ul, .nav ul ul ul ul, .nav ul ul ul ul ul {
	left: 100%;
	top: calc(0% - 1px);
}