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

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

#portfolioSection{ 
position: absolute;  z-index: 80;
height:438px; width:630px; overflow: hidden; 
margin:0px; padding:0px 0;
color:#666666;
font-size:11px; line-height:1.6em;
/* border-bottom: 2px solid #F6921E; */
}
#portfolioSection h3 {float: left; margin: 0 0 0px 0px; font-weight: normal;display: block;padding: 5px 0;  }
#portfolioSection h4 {float: right; margin: 6px 0 0px 0; font-weight: normal;}

#portfolioHeader {position: absolute; z-index:100;  }
#portfolioHeader h3 {font-size: 1.5em}
#portfolioNav {position: absolute; z-index:100; top:323px; left: 605px; text-align: right; width: 282px}
#portfolioNav a {text-decoration:none; color: #333333; padding: 3px; }
#portfolioNav a:hover {color:#F6921E}

body.portfolio #portfolioTop {background:url(../images/portfolio_top.png) no-repeat; position: absolute; z-index: 100}
*html body.portfolio #portfolioTop {background: url(../images/portfolio_top2.gif) no-repeat;}
body.portfolio #portfolioMain {height: 438px}
body.portfolio #portfolioMain img {margin: 0 0px 15px 10px; border: none; float: left; position: relative; z-index: 30 }
body.portfolio #portfolioMain p {text-align: right; width: 280px; margin:0 12px 7px 0; float: right; clear: right; position: relative; z-index: 100;} 
body.portfolio #portfolioMain p img {float: none; height: auto; width: auto; margin: 0 0 0 0}

body.portfolio #portfolioMain h5 {font-size: 1.2em; margin: 0 0 5px 25px}

body.portfolio #portfolioMain ul {width: 275px; float: right; margin: 0 0 15px 0 }
body.portfolio #portfolioMain ul li {list-style: none; font-size: 11px; margin: 4px 0}

.port_piece .header {width: 270px; border-bottom: 4px solid #CCCCCC; float: right; margin: 0 15px 20px 0; }
*html body .port_piece .header {margin: 0 7px 20px 0}

.orderButtons {float: right; clear: right; margin: 0 15px 0 0; width: 275px; }

#last p {text-align: left !important;}

/* ----- portfolio nav----- */
#portfolioSection .thumbs {clear: left; float: left; margin: 0 0 0 20px }

#portfolioSection ul.controls {height: 23spx; width: 232px; float: right; clear: right; list-style:none;margin: 50px 17px 0 0 }
ul.controls li {height: 23px; display: block; float: left;}
ul.controls li a {display: block; height: 100%; width: 100%; text-indent: -9999px}
ul.controls li.previous {background:url(../images/portPrev.gif) right no-repeat; width: 115px;}
ul.controls li.next {background:url(../images/portNext.gif) left no-repeat; width: 117px}
ul.controls li.first {background:url(../images/portFirst.gif) left no-repeat; width: 115px}
ul.controls li.more {background:url(../images/portMore.gif) left no-repeat; width: 120px}
ul.controls li.last {background:url(../images/portLast.gif) left no-repeat; width: 117px }
ul.controls li.blank {background: none; width: 115px;}

ul.controls li.previous a:hover {background:url(../images/portPrev_over.gif) no-repeat;}
ul.controls li.next a:hover {background:url(../images/portNext_over.gif) no-repeat;}
ul.controls li.first a:hover {background:url(../images/portFirst_over.gif) no-repeat;}
ul.controls li.more a:hover {background:url(../images/portMore_over.gif) no-repeat;}
ul.controls li.last a:hover {background:url(../images/portLast_over.gif) no-repeat;}

ul.controls li.prevBlank {background:url(../images/portfolioNav_previous_blank.gif) no-repeat;}
ul.controls li.nextBlank {background:url(../images/portfolioNav_next_blank.gif) no-repeat;}

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

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

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

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

/*----------------------------------- This class separates the portfolio pieces -------------------*/
div.port_piece { width:630px; height:438px; position:absolute; padding:10px 0px; line-height:1.4em; }
div.port_piece h1 {margin:0 0 9px 0px;}
div.port_piece h2 {font-size:14px; margin:4px 0 4px 0px;}

#portfolioSection p a {text-decoration:none; color: #F6921E;  }
#portfolioSection p a:hover {color:#F6921E; text-decoration: underline}
/*-----------------------------------Use id of intro and closing for the first div in each section - don't change -------------------*/

#intro, #closing {top:0px; left:0px; }


#portfolioTop {background:url(../images/portfolio_top.gif) no-repeat; height: 55px; width: 639px;}
#portfolioBottom {background:url(../images/portfolio_bottom.gif) no-repeat; height: 23px; width: 639px}

#portfolioMain {background:url(../images/portfolio_bkg.gif) repeat-y; width: 639px;}

#portfolioTop h3 {color: #ffffff; padding: 13px 0 0px 10px; margin: 0px !important}
#portfolioTop h4 {    color: #FFFFFF;
    float: left;
    font-size: 10px;
    margin: 0 !important;
    padding: 1px 0 5px 10px;}
#portfolioTop h5 {float:right; width:265px; font-size: 2.3em; padding: 4px 0px 4px 42px}

#portfolioMain h6 {font-size: 1.5em; color:#202020; width: auto; float: none;}
#portfolioMain p {font-size: 1em; line-height: 1.6em; margin: 2px 0px 2px 0; padding: 0 8px 0 0width: 100%; float: none;}
#portfolioMain a {color: #f37e00; text-decoration: none;}
#portfolioMain a:hover {text-decoration: underline}

#portfolioMain img {float: left; margin: 0 5px 0 0}

#portfolioMain .content {width: 153px; float: right}
#portfolioMain .image {display: block; position: absolute; z-index:100; height: 105px; width: 265px; border: none}
#portfolioMain img {border:none}

#portfolioMain .eightftkit { background:url(../images/8ft_bkg.gif) bottom right no-repeat; height: 105px; width: 265px; float: left; margin: 19px 24px 0 30px}
#portfolioMain .tenftkit {background:url(../images/10ft_bkg.gif) bottom right no-repeat; height: 105px; width: 265px ; float: left; margin: 19px 24px 0 30px}
#portfolioMain .twentyftkit {background:url(../images/20ft_bkg.gif) bottom right no-repeat; height: 105px; width: 265px ; float: left; margin: 19px 24px 0 30px}
#portfolioMain .tabletop {background:url(../images/tabletop_bkg.gif) bottom right no-repeat; height: 105px; width: 265px ; float: left; margin: 19px 24px 0 30px}

*html body #portfolioMain .eightftkit {margin: 19px 12px 0 15px}
*html body #portfolioMain .tenftkit {margin: 19px 12px 0 15px}