@charset "UTF-8";
/* CSS Document */


img {border:0px;}

body {
 font-size: 1em;
 }
 


/*----------------------------------- Portfolio section - see notes for info on how to update -------------------*/



/*----------------------------------- Portfolio Navigation -------------------*/
#work_nav { 
width:160px; float:left;
margin:0px;
padding:0px;}

#work_nav li {display:block; height:37px; list-style:none; text-indent:-9999px;}
#work_nav li a { display:block; height:35px;}

/*----------------------------------- previous and next controls -------------------*/
.controls {postition:absolute; bottom:0;width:510px; overflow:hidden;}

.previous {background:url(../images/previous.jpg) no-repeat 0px 0px;text-indent:-9999px;float:left;}
.previous a { display:block;height:32px;width:152px;text-indent:-9999px;  overflow:hidden;}
.previous a:hover {background:url(../images/previous_on.jpg) no-repeat 0px 0px;}

.next {background:url(../images/next.jpg) no-repeat; text-indent:-9999px;float:right;}
.next a { display:block; height:32px;width:152px;text-indent:-9999px; overflow:hidden;} 
.next a:hover {background:url(../images/next_on.jpg) no-repeat 0px;}


/*----------------------------------- Outer layer of slider effect - don't change this -------------------*/

#wrapper { position: absolute; 
height: 420px; width:550px; overflow: hidden; 
margin:0px; padding:0px 0 0 ;
margin:0 auto; left:130px;
color:#666666;
font-size:11px; line-height:1.6em;}

/*----------------------------------- Inner layer of slider effect - you can make this wider to 
accomodate more portfolio divs, otherwise, don't change  -------------------*/

#work_images  { width:20000px;  position: relative;  margin:0px; padding:0px; z-index:10;}

#work_images p { margin:0 0 5px 0;}

#work_images img {margin-bottom:0px;}

/*----------------------------------- This class separates the portfolio pieces -------------------*/
div.port_piece { width:510px; height:420px; position:relative; top:40px; padding:0 30px; line-height:1.4em;float:left }
div.port_piece h1 {margin:0 0 9px 0px; font-size:1.6em;font-family:"Courier New", Courier, monospace}
div.port_piece h2 {font-size:1.2em; margin:-4px 0 4px 0px; font-family:"Courier New", Courier, monospace}
div.port_piece h2 a {text-decoration:none; color:#999999;}
div.port_piece h2 a:hover { color:#333333}
div.port_piece p {margin:0 0 0px 10px; line-height:1.8em; font-family:Arial, Helvetica, sans-serif}
div.port_piece p a {color: #999999; text-decoration:none; font-weight: bold}
div.port_piece p a:hover {color:#333333}

div.port_piece#intro { background:none;}

/*-----------------------------------Individual Portfolio peices - each should have it's own unique div id
NOTE - this controls the positioning of each portfolio piece, to make sure they are not overlapping
they are set up in increments of 550px - to add a new piece, add 550px to the LEFT property -------------------*/

/*-----------------------------------Use id of intro and closing for the first div in each section - don't change -------------------*/

#intro, #closing {top:0px; left:0px; font-size:11px; padding:40px 0 0 30px; line-height:1.4em;}


/*-----------------------------------ordered navigation of portfolio pieces - there is one in each portfolio page -------------------*/

ul#ordered_nav {z-index:100; width: 135px; position:relative; top:50px; font-family:"Courier New", Courier, monospace;font-weight:200;font-size:.7em; margin:0 0 0 15px;padding:0px;}
ul#ordered_nav li { margin:0px;display:block; }
ul#ordered_nav li a  { padding:0 3px; text-decoration:none; color:#999999;}
ul#ordered_nav li a:hover {  color:#333333;}