/******************************************************
Style sheet for pixelplume.com
Archive Page layout -- list of projects + big picture area

author:  Grace Pok
version 1.0

Color scheme

	Green:  6DB33F
	Light green (link hover):  C1D83D
	white: (active link + text): FFFFFF
	grey: (minor text): D4D4D4

******************************************************/

div#content {
	margin-top: 15px;
}

div#plongdescbox {
	position: absolute; /* relative to the parent, which is the CONTENT div */
	width: 300px;

	margin-top: -40px;
	margin-left: 323px;  /* 620 - (this box's width) - padding x 2 */
}
div#plongdescbox  .txtbody {
	margin: 0;
	padding: 0 10px 12px 0px;	
	max-height: 300px;  /* Hack in IE.css */
	overflow: auto;
	font-size: 95%;
}
div#plongdescbox p {
	text-align: right;
}
div#plongdescbox p.morelink {
	font-size: 80%;  /* match the project info text size */
	padding-top: 10px;
	height: 30px;
}

/* Menu list -- contains project list + vertical scrollbar
-------------------------------------------------- */
#archmenu {
	width: 273px;
	height: 378px;
	float: left;
	margin-left: 3px;
	border: 1px solid #999;
	
	display: inline;  /* fixes IE5/Win double margin bug */
}
#plist {  /* list of projects */
	float: left;
	width: 246px;  /* width + padding + track + border == 252 */
	padding: 5px;
	height: 368px;
	
	overflow: hidden;
	white-space: nowrap;
}

/* wrap to make sure that image area is clickable */
#wrap2 {
	float: left;
	width: 14px;
	height: 378px;
	background-color: #4D4D4D;
	border: 1px solid #CCC;
	margin: -1px -1px 0 1px;  /* make track look like it overlaps the container */
}

/* vertical track */
#track2 {
	margin-top: 5px;
	width: 15px;
	height: 368px;
	font-size: 0;
}

/* vertical track handle */
#handle2 {
	width: 15px;
	height: 102px;
	font-size: 0;  /* prevents handle from shifting down when text size is increased */
}

/* Project thumbnail 
-------------------------------------------------- */
#plist a {
	display: block;
	border-bottom: 1px solid #999;
	float: left;
	padding-bottom: 5px;
	margin-bottom: 5px;

	/* kludge for IE5.5 bug of wrapping...  the scrollbar wrapper is positioned incorrectly, so it pushes the title below the image without this*/
	width: 260px; 
}

#plist a.last {
	border-bottom: 0px solid #999;
	margin-bottom: 0;
}
#plist a img {
	width: 80px; height: 45px;
	float: left;
}
#plist a span {
	font-size: 75%;
	display: block;
	float: left;
	width: 160px;
	padding-left: 6px;   	
	height: 45px;
	overflow: hidden;  		/* needed for IE 6 so that width will not expand*/

	text-transform: uppercase;
	font-weight: bold;
	line-height: 1.5;
	color: #999;
	white-space: normal;	/* needed for line-wrapping */
}
#plist a:hover span, #plist a.cur  span{ color: white;}

/* main project picture 
-------------------------------------------------- */
div#bigpx, div#bigpx img {  /* make the image fill the entire box. overflow will be cropped */
	width: 619px;
}
div#bigpx {
	float: left;
	overflow:hidden;
	height: 348px;
	margin-left: 20px;
}

/* selected archive project information
-------------------------------------------------- */
#archpinfo {
	float: left;
	width: 610px;
	padding-top: 15px;
	margin-left: 20px;
}
#archpinfo span#projtitle {
	font-size: 90%;
	text-transform: uppercase;
	font-weight: bold;
}
#archpinfo span#projdesc_s {  /* short description */
	font-size: 80%;
	margin-left: 2em;
	color: #AAA;
}