@charset "utf-8";
/* CSS Document */



body
{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	height:480px;
	width:720px;
	background-color: #CCCCCC;
	font-size:14px;
	color:#000;

	

}



h1
{
	display:inline;
	
	font-size:2em;
	font-weight:normal;
	
	width:8em;
	text-align:right;
	
	
	
	font-variant:small-caps;

	color:#FFFFFF;
	float:right;
	position:relative;
	top:-0.5em;
	
	
	

		
}

ul
{
list-style:none;

}

#twitter_div
{
text-align:right;
float:right;
font-size:0.75em;
font-style:italic;
}

.textstuff
{
font-size:0.7em;
}

#flickr_badge_wrapper
{
position:absolute;
left:750px;
top:30px;

text-align:right;
float:right;
width:80px;
height:100 px;

}

h2
{
	display:inline;
	
	font-size:1.3em;
	font-weight:normal;
	



	position:relative;
	left:0;
	top:0;

	font-variant:small-caps;
	text-transform:lowercase;

	color:#FFFFFF;
	padding:0em 0.3em 0em 0em;
	

}

blockquote
{
	padding:2em 4.5em 2em 1.5em;
	
	font-size:0.9em;
	font-weight:normal;
	
	font-style:italic;
	text-transform:lowercase;

	text-align:justify;

}


#stuff
{
	background-image:url(snowflakes.gif);
	width:720px;
	height:34em;

	border:1px dotted green;

	


}


#text
{

	position:relative;
	clear:both;
	top:1.5em;
	left:60px;
	
	width:375px;
	height:450px;
	

	float:left;

	
	line-height:1.2em;
	font-size:0.9em;
}

#text p
{
display:inline;
position:relative;
top:0px;
left:0px;
}
#thumbs
{
	/*
	border:1px solid green; 
	*/
	
	position:fixed;
	
	top:20px;
	left:470px;
	


	width:220px;
	
	/* 	
		220 without borders
		224 pixels wide:
			2 images, each
			112 pixels per image
				100 pixel image
				+5 pixel right padding
				+5 pixel left padding
				+1 pixel right border
				+1 pixel left border
		
		
		Padding is room between content contained and the border, is additional
		to the specified width/height.
		
		This would mean that the actual width of the thumbs div is 
		
		230 without borders
		236 pixels:
			224 pixels for images, specified as width value
			+ 5 pixel left padding
			+ 5 pixel right padding
			+ 1 pixel left border
			+ 1 pixel right border


	*/
	
	height:440px;
	
	/*
	
		440 without borders	
		448 pixels for images:
			4 images, each occupying 
			112 pixels per image:
				100 pixel image
				+ 5 pixel top padding
				+ 5 pixel bottom padding
				+ 1 pixel top border
				+ 1 pixel bottom border
				
		As padding is appended to the value of width/height, the actual
		space occupied by the thumbs div is 
		
		450 without borders
		460 pixels:
			448 pixels for images
			+ 5 pixel left div padding
			+ 5 pixel right div padding
			+ 1 pixel left border
			+ 1 pixel right border
		
	*/
	
	
	line-height:0em;
	
	/* 	
		Setting the line-height to 0em [0% of the width of em value] in order
		for me to know precisely how big this div is.
	
		Prior to setting the value, part of the images in the bottom row
		extended beyond the scope of the div, as visualized through the
		use of a border to show me what elements are where and what they
		are doing.
		
		Setting the line-height to 0em means that the lines have no value-
		while I did not put any breaks between the images, due to setting
		the width of the div to create my rows, the images create a new
		line, and the line-spacing default value of the browser is used
		to insert blank space between the image elements. As I do not know
		what the value is for a given user - as it varies between browsers
		[tested Seamonkey and Firefox] and the user's font size options, 
		it seems simpler to set the line height as nonexistant.
		
	*/
	
	padding:5px 5px 5px 5px;
	
	/*
	
		Padding was set, as I wanted each thumb to be equidistant from what
		is around it. Without the padding, the inner corners end up 10 pixels
		apart, while the outside corners were flush with the border of the div.	

	*/

}

#thumbs img
{
	/*
	border:1px dotted blue;
	*/
	
	padding: 5px 5px 5px 5px;
	margin:0px 0px 0px 0px;
	border:none;
	
}

#fullview
{
	position:relative;
	top:20px;
	left:115px;
	
}

#description
{
	position:relative;
	top:0.5em;
	left:115px;
	width:480px;
	font-size:0.9em;
	line-height:1em;

}
.desctext
{

width:27em;
text-align:justify;
font-size:0.8em;
line-height:1em;


}

#mainlink
{
	position:absolute;
	top:440px;
	left:120px;
	font-size:0.7em;
	
}

#mainlink a
{
text-decoration:none;

}

#previous,next, img
{
	border:none;
}

#previous
{
	position:absolute;
	left:20px;
	
	width:100px;
	top:157px;

}

#next
{
	position:absolute;

	left:610px;
	top:157px;
	
	width:100px;

}



