/*****************************
 * AlexanderReyna.com
 * Side Pane & Scrollbar -- only for the CONTENT of the side pane, not the pane itself.
 * Author:  Grace Pok (gracepok.com)
 * 
 * bg pale blue:   a9c2c9
 * menu pale blue: a8c1c8
 * 
 */


/* 
 * Applies to profile page and friends page.  
 * Heights of thumbnail set for profile page. They're later overwritten for Friends Page 
 * ----------------------------------------------- */
#scrollitems {
	margin: 10px 3px 10px 0px;
	padding-left: 10px;  /* pad instead of margin b/c of IE6 double-margin bug */
	width: 170px;	/* 5px extra for the new bubble */
	height: 450px;
	overflow: hidden;
	float: left;

	position: relative;  /* needed for IE for scrolling to work since children are positioned */

	z-index: 2;			/* force on TOP of the page header arrow to make clickable */
}

#sidewrap {
	margin-top: 15px;
}





#noscrollitems {  /* bigger to take up scrollbar real-estate */
	padding: 10px 0 0 10px;
	width: 195px;
	height: 470px;
	overflow: hidden;
	float: left;
}



#scrollitems p, #bio_leftpane p {
	font-size: 85%;
	background: url('../graphics/icon_arrow.gif') left 2px no-repeat;
	padding-left: 18px;
	margin-top: 0;
	margin-bottom: 1em;
}
#scrollitems p a, #bio_leftpane p a {
	text-decoration: none;
	color: black;
}
#scrollitems p a:hover, #bio_leftpane a:hover  {
	text-decoration: underline;
}


#scrollitems div.thumb {
	padding: 5px 0;
	width: 170px;
	height: 92px;
	overflow: hidden;
}
#scrollitems div.thumb a {
	display: block;
	width: 165px;
/*	height: 135px; */ height: 92px;
	text-decoration: none;
	position: relative;	
	overflow: hidden;
	cursor: pointer;
	border: 1px solid white;
}
#scrollitems div.thumb a:hover, #scrollitems div a.hover {
	border: 1px solid #ff9933;
}

#scrollitems div.thumb img {
	width: 165px;
	border: 0;
	position: relative;	
	top: -33px;
}
#scrollitems div.thumb span.title {
	display: block;
	position: relative;
	padding-left: 4px;
	padding-top: 1px;
	height: 32px;
	/* top: 102px;  */ top: 59px;
	z-index: 4;
	font-size: 12px;
	background: transparent url('../graphics/graybg_trans.png') scroll repeat top left;
}
#scrollitems div.thumb span.title strong { display: block; }
#scrollitems div.thumb a span.title {	color: white; }
#scrollitems div.thumb a:hover span.title, #scrollitems div a.hover span.title {color: #ff9933; }

#scrollitems div.thumb span.newtag {
	position: relative;
	left: 115px;
	/* top: -140px; */ top: -97px;
	display: block;
	background: url('../graphics/newbubble.gif') no-repeat scroll top right;
	width: 55px;
	height: 55px;
	z-index: 4;
}
#scrollitems div.thumb span.newtag em {
	display: none;
}


/* 
 * Override for Friends Page:  Thumbnail dim:  165 x 110 (3:2 ratio)
 * ---------------------------------------*/

#pg_friends #scrollitems {	height: 500px; }
#pg_friends #scrollitems div.thumb {	height: 110px; }
#pg_friends #scrollitems div.thumb a { height: 110px; 
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #dadada;
}
/*
#pg_friends #scrollitems div img {	width: 165px;	height: 110px;}
*/
#pg_friends #scrollitems div.thumb span.title { top: 78px;}



/* 
 * Override for Blog Archives
 * ---------------------------------------*/
#pg_blog #subnav h2{  /*blog page sidepane header */
	padding-top: 25px;
	z-index: 2;	
	text-align: center;	
	color: #669999;
}
#pg_blog #subnav p {
	font-size: 90%;
	background: url('../graphics/icon_arrow.gif') left 2px no-repeat;
	padding-left: 18px;
	margin-top: 0;
	margin-bottom: 1em;
}