.credits {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #850F08; text-decoration: none}
.text {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #533423; text-decoration: none; line-height: 18px}
.textlinks {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #533423; text-decoration: none; line-height: 16px}
A:link {
	FONT-SIZE: 11px; COLOR: #533423; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A:visited {
	FONT-SIZE: 11px; COLOR: #533423; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A:active {
	FONT-SIZE: 11px; COLOR: #533423; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A:hover {
	FONT-SIZE: 11px; COLOR: #976142; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: none
}.juice {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #5C0004; text-decoration: none}
.heading {  font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #EFEED0; text-decoration: none}
.portfolio {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #F4DDB1; text-decoration: none}

A.work:link {
	FONT-SIZE: 11px; COLOR: #F4DDB1; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A.work:visited {
	FONT-SIZE: 11px; COLOR: #F4DDB1; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A.work:active {
	FONT-SIZE: 11px; COLOR: #F4DDB1; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: underline
}
A.work:hover {
FONT-SIZE: 11px; COLOR: #976142; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: none}
.vou {  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #533423; text-decoration: none}
.hd {  font-family: Arial, Helvetica, sans-serif; font-size: visibility:hidden; 7px; color: white; text-decoration: none;margin:0;padding:0;}
H1 {FONT-SIZE: 17px; COLOR: #392317; FONT-FAMILY: Arial, Helvetica, sans-serif;}

/*DIV CLEAR~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.clearfix:after {
    content:".";
    display:block;clear:both;visibility:hidden;
    height:0;
}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

/*PORTFOLIO~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div#portfolioListing{
	padding:0 0 0 19px;
}

div#portfolioListing a img{
	margin:0 auto 5px auto;
	display:block;
	border:1px solid #FBE6B9;
}

div#portfolioListing a:link, div#portfolioListing a:visited{
	display:block;
	width:116px;
	float:left;
	margin:0 10px 10px 0;
	padding:7px 0 4px 0;
	background-color:#533423;
	color:#FBE6B9;
	font: normal 9px/13px Arial, Helvetica, sans-serif;
	text-align:center;
	text-decoration:none;
}

div#portfolioListing a:hover{
	background-color:#2A0400;
}

/*PORTFOLIO PROJECT PAGE~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div#otherProjects{
	padding:0 13px 10px 13px;
	text-align:left;
}


div#otherProjects a{
	font: bold 18px/24px Arial, Helvetica, sans-serif;
	color: #FFFFC7;
	text-decoration:none;
}

.topBottomPanels{
	margin:0 auto 0 auto;
	display:block;
	width:752px;
	height:5px;
}

div#container{
	width:752px;
	background: #4A2F1C;
	margin:0 auto 0 auto;
	padding:0 0 20px 0;
}

div#projectDetails{
	background: url(../portfolio/panel-left.gif) no-repeat left top;
	width:282px;
	height:266px;
	float:left;
	margin:16px 10px 16px 16px;
	font: 12px/16px Arial, Helvetica, sans-serif;
	color: #FFFFCC;
	text-align:left;
}

div#projectDetails h1{
	font:bold 22px/26px Arial, Helvetica, sans-serif;
	color: #FFFFCC;
	margin:15px 0 0 15px;
}

div#projectDetails h2{
	font:bold 16px/20px Arial, Helvetica, sans-serif;
	color: #FFFFCC;
	margin:15px 0 0 15px;
}

div#projectDetails p{
	font: 12px/16px Arial, Helvetica, sans-serif;
	color: #FFFFCC;
}

div#projectDetails ul{
	margin:30px 0 0 15px;
	list-style:none;
	padding:0;
}

div#projectDetails li{
	font: 18px/22px Arial, Helvetica, sans-serif;
	color: #FFFFCC;
	margin:0 0 20px 0;
	padding:0 0 0 15px;
	background: url(../portfolio/arrow.gif) no-repeat 1px 5px;
}

div#projectDetails li span{
	font-weight:bold;
}

div#projectDisplay{
	float:left;
	width:430px;
	height:302px;
	margin-top:14px;
	margin-bottom:20px;
}


/*TABS AND PANS~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/



/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 0 0 -1px !important; 
	padding:0;	
	height:24px;
}

/* single tab */
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a { 
	background: url(../portfolio/blue.png) no-repeat -420px 0;
	font-size:11px;
	display:block;
	height: 24px;  
	line-height:27px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#4D301E;	
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-position: -420px -62px;		
	cursor:default !important; 
	color:#000 !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s 			{ background-position: -553px 0; width:81px; }
ul.tabs a.s:hover 	{ background-position: -553px -31px; }
ul.tabs a.s.current  { background-position: -553px -62px; }

/* width 2 */
ul.tabs a.l 			{ background-position: -248px -0px; width:174px; }
ul.tabs a.l:hover 	{ background-position: -248px -31px; }
ul.tabs a.l.current  { background-position: -248px -62px; }


/* width 3 */
ul.tabs a.xl 			{ background-position: 0 -0px; width:248px; }
ul.tabs a.xl:hover 	{ background-position: 0 -31px; }
ul.tabs a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */ 
.panes .pane {
	display:none;	
}

div.panes img{
 	border:1px solid #FFFFC7;
	margin-top:1px;margin:0;
	height:241px;
 }
 
div.moreImages{
	padding:0 12px 0 0;
	margin:-10px 0 0 0;
}

div.moreImages ul{
	width:389px;
	marign:0;
	padding-top:0;
}

div.moreImages li{
	float:right;
	list-style:none;
	margin-top:0;
	margin-left:5px;
	color:#FFFFC7;
	font: bold 12px/16px Arial, Helvetica, sans-serif;
	padding-top:0;
}

div.moreImages li a:link, div.moreImages li a:visited{
	color:#FFFFC7;
	display:block;
	width:13px;
	text-decoration:none;
	border:1px solid #FFFFC7;
	padding:5px;
	font:12px/16px Arial, Helvetica, sans-serif;
	margin:0;
}


div.moreImages li a:hover{
	color:#FFF;
	display:block;
	width:13px;
	text-decoration:none;
	border:1px solid #FFF;
	background-color:#986143;
	padding:5px;
	font:bold 12px/16px Arial, Helvetica, sans-serif;
	margin:0;
}