/* Stylesheet for view-sw.com									  */

/* (CC) 2004 Ross Harmes. Some Rights Reserved.  				  */
/*         http://creativecommons.org/licenses/by/2.0             */
/* This style sheet is licensed under a Creative Commons License. */

@import "undohtml.css"; /* This file strips the styles automatically given by browsers. */


/* Tags. */

body			{ background : url("/images/pattern.gif"); font : .7em/1.5em "Lucida Grande", Veranda, Arial, Helvetica, sans-serif; color : #777; }
a:link,
a:visited,
a:active		{ color : #8C1404; }
a:hover			{ color : #C35E51; } 
h1, h2, h3		{ color : #333; }


/* Major sections. */

#content 		{ position : relative; width : 700px; margin : 0 auto; padding : 0 20px 0 22px; background : url("/images/content_bkgd.png") repeat-y 0 0; }

#header			{ width : 700px; height : 79px; background : url("/images/header.png"); text-indent : -9999px; }
#home			{ position : absolute; top : 5px; display : block; width : 186px; height : 66px; margin-left : 5px; background : url("/images/logo.png") no-repeat 0 0; }
#about			{ position : absolute; top : 65px; display : block; width : 39px; height : 7px; margin-left : 362px; background : url("/images/nav.png") no-repeat 0 0; }
#about:hover	{ background-position : 0 -7px; }
#software		{ position : absolute; top : 65px; display : block; width : 60px; height : 7px; margin-left : 421px; background : url("/images/nav.png") no-repeat -39px 0; }
#software:hover	{ background-position : -39px -7px; }
#articles		{ position : absolute; top : 65px; display : block; width : 51px; height : 7px; margin-left : 501px; background : url("/images/nav.png") no-repeat -99px 0; }
#articles:hover	{ background-position : -99px -7px; }
#forum			{ position : absolute; top : 65px; display : block; width : 39px; height : 7px; margin-left : 571px; background : url("/images/nav.png") no-repeat -150px 0; }
#forum:hover	{ background-position : -150px -7px; }
#contact		{ position : absolute; top : 65px; display : block; width : 56px; height : 7px; margin-left : 630px; background : url("/images/nav.png") no-repeat -189px 0; }
#contact:hover	{ background-position : -189px -7px; }

.program		{ width : 700px; height : 200px; margin : 14px 0; }
.info			{ position : relative; float : left; width : 334px; height : 190px; margin-left : 12px; padding : 10px 10px 0; background : url("/images/program_bkgd.gif") no-repeat 0 0; border : 1px solid #DBDBDB; }
.info h2		{ margin-bottom : 10px; font : 2.6em/1em "Gill Sans", "Lucida Grande", Arial, Verdana, sans; text-transform : uppercase; text-indent : 0; }
.info h2 span	{ font : .6em/1em "Gill Sans", "Lucida Grande", Arial, Verdana, sans; text-transform : uppercase; color : #aaa; text-indent : 0; }
.info h3.version { position : absolute; top : 27px; left : 289px; font : .5em/1em "Gill Sans", "Lucida Grande", Arial, Verdana, sans; text-transform : uppercase; color : #CB6513; }
.info ul		{ list-style-image: url("/images/dot.gif"); padding-left : 2.5em; }
.info p,
.info ul		{ margin-bottom : .8em; }
.moreinfo		{ position : absolute; top : 181px; left : 235px; display : block; width : 119px; height : 19px; background : url("/images/moreinfo.gif") no-repeat 0 0; text-indent : -9999px; }
.moreinfo:hover	{ background-position : 0 19px; }

.screenshots	{ position : relative; float : right; width : 306px; height : 200px; margin-right : 12px; background : url("/images/screenshots_bkgd.gif") no-repeat 0 0; border : 1px solid #DBDBDB; }
.viewer			{ position : absolute; z-index : 5; visibility : hidden; }
.activator		{ float : left; display : block; width : 62px; height : 40px; margin : 7px 0 0 7px; padding : 2px; background : #fff; border : 1px solid #333; }
.activator:hover { border-color : #fff; }

#rms-screen,
#birch-screen	{ width : 306px; height: 200px; }

#footer			{ z-index : 5; position : relative; bottom : -41px; width : 700px; height : 41px; margin : -43px 0 18px -22px; padding : 0 20px 0 22px; background : url("/images/footer.png") no-repeat 0 0; text-indent : -9999px; }
#xhtml			{ display : block; position : absolute; top : 0px; left : 456px; width : 57px; height : 14px; background : url("/images/footer_nav.png") no-repeat 0 0; }
#xhtml:hover	{ background-position : 0 -14px; }
#css			{ display : block; position : absolute; top : 0px; left : 515px; width : 35px; height : 14px; background : url("/images/footer_nav.png") no-repeat -57px 0; }
#css:hover		{ background-position : -57px -14px; }
#copy			{ display : block; position : absolute; top : 0px; left : 552px; width : 164px; height : 14px; background : url("/images/footer_nav.png") no-repeat -92px 0; }
#copy:hover		{ background-position : -92px -14px; }

#next-main .info { background : url("/images/next_prog_bkgd.gif") no-repeat 0 0; }

#notice			{ width : 654px; padding : 10px; margin: 12px 0 12px 12px; border : 1px solid #DBDBDB; }
#notice h2		{ margin-bottom : 6px; font-size : 1em; color : #3D454E; }

/* Software pages. */

#detail			{ padding : 12px; }
#detail h2 		{ margin : 0 0 18px; text-indent : 0; font-size : 1.5em; color : #111; }
#detail h3		{ margin : 1em 0 .3em; }
#detail ul		{ list-style-image: url("/images/dot.gif"); padding-left : 2.5em; }
#detail p,
#detail ul		{ margin-bottom : 1em; }
#detail strong,
#detail dt		{ font-weight : normal; color : #444; }
#detail dd		{ margin : -1.5em 0 0 36px; font-family : courier, mono; color : #aaa; }

#main			{ float : left; width : 478px; padding : 10px 0 10px 10px; }
#main h3		{  }

#sidebar		{ float : right; width : 166px; padding : 10px 10px 10px 0; font : .9em/1.5em "Lucida Grande", Veranda, Arial, Helvetica, sans-serif;  }


/* Page specific styles. */

#detail.rms h2,
#detail.birch h2		{ margin-left : -2px; font : 3em/.7em "Gill Sans", "Lucida Grande", Arial, Verdana, sans; text-transform : uppercase; }
#detail.rms h2 span,
#detail.birch h2 span	{ font : .6em/1em "Gill Sans", "Lucida Grande", Arial, Verdana, sans; text-transform : uppercase; color : #aaa; }

#detail.resume h3 { margin-bottom : 1em; font-size : 1.25em; }
#detail.resume h4 { margin-bottom : .5em; color : #555; }
#detail.resume h5 { font-style: italic; font-weight : normal; margin-bottom : .5em; }


/* Statistics page styles. */

#statistics 					{ width : 826px; height : 558px; float : left; color : #333; }

#statistics #thirty-days 		{ position : absolute; top : 105px; width : 442px; height : 160px; margin-left : -1px; padding : 4px; border : 1px solid #bbb; }
#statistics #basic-stats 		{ position : absolute; top : 105px; width : 212px; height : 160px; margin-left : 459px; padding : 4px; border : 1px solid #bbb; }

#statistics #most-popular 		{ position : absolute; top : 283px; width : 212px; height : 160px; margin-left : -1px; padding : 4px; border : 1px solid #bbb; }
#statistics #referrers 			{ position : absolute; top : 283px; width : 212px; height : 160px; margin-left : 229px; padding : 4px; border : 1px solid #bbb; }
#statistics #search-strings 	{ position : absolute; top : 283px; width : 212px; height : 160px; margin-left : 459px; padding : 4px; border : 1px solid #bbb; }

#statistics #last-year 			{ position : absolute; top : 462px; width : 442px; height : 160px; margin-left : -1px; padding : 4px; border : 1px solid #bbb; }
#statistics #browsers 			{ position : absolute; top : 462px; width : 212px; height : 160px; margin-left : 459px; padding : 4px; border : 1px solid #bbb; }

#statistics div.text div 		{ width : 212px; height : 160px; padding : 0 0 0 0; overflow : auto; }
#statistics div.text div h2 	{ width : 96%; height : 14px; padding : 1px 1px 0 4%; background : #bbb; border : 0; font : .9em/1.4em "Trebuchet MS", Verdana, Arial, sans-serif; color : #fff; }
#statistics div.text div dt 	{ width : 78%; height : 16px; float : left; overflow : hidden; padding : 3px 4% 0; }
#statistics div.text div dd 	{ width : 50%; height : 16px; float : right; overflow : visible; margin-top : -19px; padding : 3px 4% 0 0; text-align : right; }
#statistics div.text div dl 	{ width : 100%; clear : both; margin-top : -1px; border-bottom : 1px dotted #bbb; font : .9em/1.4em "Trebuchet MS", Verdana, Arial, sans-serif; }


/* Portfolio page styles. */

#detail.portfolio #main			{ float : none; width : 658px; }

#detail.portfolio #main	hr		{ width : 100%; height : 0; margin : 18px 0 24px; background : transparent; border : 0; border-bottom : 1px solid #ddd; }

.portfolio-entry				{ border-bottom : 1px solid #ddd; padding-bottom : 12px; margin-bottom : 24px; }
.portfolio-entry h3				{ width : 100%; padding-bottom : 8px; }
.portfolio-entry h3 span		{ float : right; font-weight : normal; color : #777; }

.thumbnail-container			{ float : right; margin : 0 0 12px 12px; padding : 5px; border : 1px solid #ccc; }
.thumbnail-container div.small	{ width : 240px; height : 120px; }
.thumbnail-container div.large	{ width : 240px; height : 400px; }

#thb-liminality					{ background : url("../images/portfolio/liminality.png") no-repeat top left; }
#thb-downdream					{ background : url("../images/portfolio/downdream.png") no-repeat top left; }
#thb-weblog						{ background : url("../images/portfolio/weblog.png") no-repeat top left; }
#thb-atdatabase					{ background : url("../images/portfolio/atdatabase.png") no-repeat top left; }
#thb-reading					{ background : url("../images/portfolio/reading.png") no-repeat top left; }
#thb-view						{ background : url("../images/portfolio/view.png") no-repeat top left; }

a:link.offline,
a:visited.offline,
a:active.offline,
a:hover.offline					{ color : #999; }

/* General classes. */

.clear			{ clear : both; height : 0; margin : 0; padding : 0; }
.small-text		{ font-size : .6em; }


/* Print speific sections. */

.print-only		{ display : none; }


/* Hacks that force certain browsers to display the page correctly. */

	/* The following rules are applied to IE Mac only */ /*\*//*/

	div.info		{ position : absolute; width : 333px; height : 189px; }
	div.photos		{ width : 285px; height : 149px; }
	.moreinfo		{ top : 180px; left : 234px; }
	
	.screenshots	{ width : 305px; height : 199px; }
	.viewer			{  }
	
	#footer			{ height : 18px; background : none; color : #fff; }

	/* */
	/* The following rules are applied to IE Win only. */ /*\*/

	* html #content	{ padding : 0; background : #fff; }
	
	* html .program	{ margin : 8px 0; }
	* html .info	{ width : 334px; margin-left : 6px; }
	* html .viewer	{ margin-left : -151px; margin-top : -53px; }
	* html #birch-viewer	{ margin-left : -225px; }
	* html .screenshots	{ margin-right : 6px; }
	* html .activator	{ margin-left : 3px; margin-right : 3px; }
	
	* html #main	{ width : 458px; }
	* html #sidebar	{ width : 126px; }
	
	* html #detail dd	{ font-family : "Lucida Grande", Veranda, Arial, Helvetica, sans-serif; }
	
	* html #header	{ background : transparent; filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/header.png',sizingMethod='crop'); text-indent : 0 }
	* html #home	{ background : transparent; filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/logo.png',sizingMethod='crop'); text-indent : -9999px; }
	* html #about,
	* html #contact,
	* html #forum	{ position : static; display : inline; margin : 0; background : transparent;  text-transform : uppercase; } 
	* html #nav		{ margin : 80px 0 0 512px; }
	* html #nav li	{ display : inline; margin-left : 12px; }
	* html #nav li a:link,
	* html #nav li a:visited,
	* html #nav li a:active	{ color : #aaa; }
	* html #nav li a:hover	{ color : #E4B6B1; }
	
	* html #footer	{ padding : 0; background : transparent; text-indent : 500px; color : #ccc; font-size : .9em; }
	* html #footer a:link,
	* html #footer a:visited,
	* html #footer a:active	{ color : #aaa; }
	* html #footer a:hover	{ color : #E4B6B1; }
	* html #xhtml,
	* html #css,
	* html #copy	{ display : inline; position : static; background : transparent; }

	/* */