@charset "utf-8";

/*initial setup */
*{margin:0;padding:0;}
img{border:0;}
html, body{ 	/*html ref required for IE and post overflow control */
	overflow-y:auto;
	overflow-x:hidden;
	width:100%;
	margin:0 auto;
	font-family: Arial, Helvetica, sans-serif;
	color: #efefef;
	background: #000 url(../images/wp_gradient1.jpg) center repeat-y;
	}
h3 {
	font-size:1.2em;
	}
p	{
	position:relative;
	line-height:normal;
	clear:both;
	}
ol, ul{
	margin-left:25px;
	}
ul li{
	list-style:square;
	list-style-type:square;
	}
.noBull li{
	margin-left:-25px;
	list-style:none;
	list-style-type:none;
	}
#horizontalList{
	display:inline-block;
	text-align:center;
	}
#horizontalList ul li {
	float:left;
	display:inline;
	list-style:none;
	list-style-type:none;
	padding:0 15px 0 0;
	font-size:10px;
	}
a:link, a:visited, a:active{
	outline:none;
	color:#fff;
	text-decoration:none;
	}
a:hover{
	outline:none;
	color:#96e444;	
	}

/* background image handling */
.slideCSSparams img {
	z-index:-2;
	width:auto; 
	height:100%; 
	opacity: 0;
	-moz-opacity: 0;
	-khtml-opacity:0;
	filter: alpha(opacity=0);
	}
.blend img {
	z-index:-1;
	width:auto; 
	height:100%; 
	opacity: 0;
	-moz-opacity: 0;
	-khtml-opacity:0;
	filter: alpha(opacity=0);
	}
#background{
	position:fixed;
	height:100%;
	width:100%;
	z-index:-1;
	}
#background img{
	visibility:visible;
	z-index:-1;
	}

/* meat and potatoes begins here */
#wrapper { 
	position: absolute;
	z-index:10;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height:100%;
	}
#page {
	position: relative;
	width: 100%;
	height:100%;
	}
#content {
	position: relative;
	width: 100%;
	height:100%;
	}
	
/* background transparent vellums - without affecting transparancy/opaqueness for other elements */
#vellumMediumHeavy{
	position: absolute;
	z-index:0;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #000; opacity: 0.75;-moz-opacity: 0.75;filter:alpha(opacity=75);
	}
#vellumMedium{
	position: absolute;
	z-index:0;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	background: #000; opacity: 0.65;-moz-opacity: 0.65;filter:alpha(opacity=65);
	}
#vellumLight{
	position: absolute;
	z-index:0;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #000; opacity: 0.35;-moz-opacity: 0.35;filter:alpha(opacity=35);
	}
#vellumHeavy{
	position: absolute;
	z-index:0;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #000; opacity: 0.85;-moz-opacity: 0.85;filter:alpha(opacity=85);
	}
#vellumWhite{
	position: absolute;
	z-index:0;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #fff; opacity: 0.90;-moz-opacity: 0.90;filter:alpha(opacity=90);
	}
.stationery, #stationery{
	margin:20px 20px 0 20px;
	}	
#stationeryTop{
	width:638px;
	height:25px;
	}
#stationeryBG{
	width:528px;	
	padding:30px 50px 30px 60px;
	background: repeat-y url('/images/paper.png');
	}
#stationeryBottom{
	fwidth:638px;
	height:38;
	}
	
/* header elements */
#headerWrap{
	position:absolute;
	z-index:20;
	top:60px;
	width:auto;
	height:60px;
	margin:0;
	border-top: 1px solid #777;
	border-right: 1px solid #777;
	border-bottom: 1px solid #777;
	}
#headerContent{
	position:relative;
	z-index:30;
	}
#headerLeft{
	position:relative;
	float:left;
	padding:7px 0 0 20px;
	font-size:10px;
	}


/* primary menu for all pages but home */
#mainMenu{
	position:relative;
	float:left;
	text-align:right;
	padding:20px 20px 0 0;
	}
#parentNav {
	cursor:pointer;
	}
#parentNav li {
	padding-left:17px;
	list-style:none;
	float:left;
	}
#parentNav li a {
	display:block;
	padding:0 0 5px 5px;
	color:#e5e5e5;
	font-weight:900;
	font-size:1em;
	text-decoration:none;
	}
#parentNav li:hover a{
	color:#fff;
	}
#parentNav li ul {
	display:none;	
	width:110px; /*opera*/
	}
#parentNav li:hover ul, #parentNav li.sfhover ul  {
	display:block;
	position:absolute;
	margin:0;
	padding:16px 0 0 13px;
	}
#parentNav li li {
	text-align:left;
	margin:0 -25px 0 -30px;
	}
#parentNav li:hover li, #parentNav li.sfhover li {
	float:none;
	}
#parentNav li:hover li a, #parentNav li.sfhover li a  {	
	padding:5px 5px 5px 10px;
	min-height:15px;
	min-width:110px;
	text-transform:lowercase;
	font-size:12px;
	color:#efefef;
	background-color:#000;
	border-bottom: 1px solid #555;
	opacity: 0.75;-moz-opacity: 0.75;filter:alpha(opacity=75);
	}
#parentNav li li a:hover {
	color:#fff;
	background-color:#777;
	opacity: 0.80;-moz-opacity: 0.80;filter:alpha(opacity=80);
	}

/* home page capition set up */
#captionPanel{
	position:absolute;
	z-index:25;
	height:auto;
	/*width:auto;*/
	max-width:380px;
	bottom:70px;
	left:40px;
	}
#caption{
	position:relative;
	z-index:30;
	padding:20px;
	font:12px/1.2 Arial,Helvetica,sans-serif;
	font-weight:500;
	font-style:italic;
	color:#fff;
	}


/* portfolio and detail panels - left and right side orientations */
#bodyPanel{
	display:block;
	position:absolute;
	z-index:10;
	min-height:300px;
	width:769px;
	top:140px;
	left:-1px;
	border: 1px solid #777;
	}
#bodyContent{
	position:relative;
	z-index:15;
	padding:20px 60px 20px 40px;
	/*max-height:520px;
	overflow:auto;*/
	font-size:1em;
	}	
#detailPanel{
	display:block;
	position:relative;
	z-index:10;
	width:280px;  /* 4 column sub-portfolio use: 355px, 3 col = 280px */
	bottom:20px;
	right:-1px;
	float:right;
	border: 1px solid #777;
	}
#detailContent{
	position:relative;
	z-index:15;
	padding:20px 20px 20px 40px;
	font-size:.7em;
	}
#detailText{
	position:relative;
	max-height:auto;
	width:230px;
	overflow-y:scroll;
	text-align:justify;
	padding-right:10px;
	/* scrollbar positioning
	margin-right:10px;
	*/
	}
.panelSlideButtons{
	position:absolute;
	z-index:100;
	padding:0 15px 0 5px;
	top:42%;
	font-size:2.5em;
	}
#LS-slideRightButton{  /*LS = Left Side Panel */
	display:none;
	right:0;
	}
#LS-slideLeftButton{
	display:block;
	right:0;
	}
#RS-slideRightButton{  /*RS = Right Side Panel */
	display:block;
	left:0;
	}
#RS-slideLeftButton{
	display:none;
	left:0;
	}
#media{
	position:absolute;
	z-index:100;
	padding:0 15px 0 7px;
	bottom:15px;	
	}
.subPortfolio{
	padding:0 5px 5px 0;
}
#thumbContainer{
	display:inline-block; 
	float:left;
	width:145px;
	height:125px;
	margin:0 22px 20px 0;
	}


/* tidbits */
.small {
	font-size:.9em;
	}
.smaller {
	font-size:.8em;
	}
.smallest {
	font-size:.7em;
	}
#back, .back {
	text-align:left;
	left:0;
	}
#close{
	display:none;
	width:100%;
	}
#closeButton{
	margin-top:-20px;
	margin-right:-45px;
	text-align:right;
	color:#333;
	}
a.closeButton:link, a.closeButton:visited, a.closeButton:active{
	display:inline-block;
	background: url("/images/icon_closeX-dg.png");
	width:22px;
	height:22px;
	color:#333;
	text-decoration:none;
	}
a.closeButton:hover{
	display:inline-block;
	background: url("/images/icon_closeX-lg.png");
	width:22px;
	height:22px;
	color:#f00;	
	}
.padLeftBlock{
	display:inline-block;
	padding-left:10px;
	}
.loading{
	background:url('/images/icon_loading.gif') no-repeat center;
	}
.rotateThis {
	writing-mode:tb-rl;
	/*filter: flipH() flipV();*/
	}
.hint{
	color:#555;
	font-style:italic;
	}
.blackOnWhite{
	color:#333;	
	}
a.blackOnWhite:link, a.blackOnWhite:visited, a.blackOnWhite:active{	
	color:#333;
	text-decoration:none;
	}
a.blackOnWhite:hover{
	color:#683;	
	}
.green{
	color:#683;	
	}
a.green:link, a.green:visited, a.green:active{	
	color:#683;
	text-decoration:none;
	}
a.green:hover{
	color:#339900;
	}
.lightGreen{
	color:#6B4;	
	}
a.lightGreen:link, a.lightGreen:visited, a.lightGreen:active{	
	color:#6B4;
	text-decoration:none;
	}
a.lightGreen:hover{
	color:#8f6;
	}
.offWhite{
	color:#009933;	 /* ddd */
	}
a.offWhite:link, a.offWhite:visited, a.offWhite:active{	
	color:#996600;
	text-decoration:none;
	}
a.offWhite:hover{
	color:#8f6;
	}
span#blockQuote{
	float:left;
	color:#c5c5c5;
	margin-top:-65px;
	margin-left:-20px;
	margin-bottom:-170px;
	font:200px/1 "Times New Roman", Times, serif;
	}
span#blockQuoteRight{
	float:right;
	color:#c5c5c5;
	margin:-50px -20px -120px 0;
	font:200px/1 "Times New Roman", Times, serif;
	}
span#grayElement{
	color:#888;
	font:24px/2.0 Arial,Helvetica,sans-serif;
	font-weight:800; 
	}

#copyright{
	position:fixed;
	float:left;
	bottom:15px;
	padding:20px 20px 0 50px;
	color:#999;
	font-size:.6em;
	}
