/* CSS Document */

body	{
	color: #333;
	background: #fff;
	margin: 25px 0 25px 0;
	padding: 0;
text-align: center;
	}
	
.bg {
	background:  url(images/bg.jpg) bottom left fixed repeat;
	padding :0;
	margin :0;

	}
	
	
.hide	{
	display: none;
	}
	
img {
	/* removed display: block; to stop whole para showing up as link in tb2000 */
	border: 0;

	}
	
a:link {
	font-weight : bold; 
	text-decoration : none;
	color: #c30;
	background: transparent; 
	}

#sidebar p.in {
	font-weight : bold; 
	text-decoration : none;
	color: #660000;
	background: transparent; 
	}




#sidebar p a:link {
	font-weight : bold; 
	text-decoration : none;
	color: #333;
	background: transparent; 
	}

a:visited, #sidebar p a:visited {
	font-weight : bold; 
	text-decoration : none;
	color: #666;
	background: transparent; 
	}

a:hover, #sidebar p a:hover {
	font-weight : bold; 
	text-decoration : underline;
	color: #f60;
	background: transparent; 
	}

a:active, #sidebar p a:active {
	font-weight : bold; 
	text-decoration : none;
	color: #f90;
	background: transparent;  
	}
	
p, td, li, ul, ol, h1, h2, h3, h4, h5, h6	{
		font-family: "Trebuchet MS", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
		}

h1	{
	font-size: 1.15em;
	font-weight: normal;
	}

h2	{
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 0.25em;
	margin-top: 0.5em;
	}
	
.thispage  {
	font-size: 1.35em;
	font-weight: normal;
	font-weight: bold;
	}


 .date { 
color: #666; font-size: 9px; 
	text-transform: uppercase;
	letter-spacing: 2px;
}
	
	
	
	
#primarycontent p.d1  {
	font-weight : bold; 
	text-decoration : none;
	color: #333;
	background: transparent; 
	}

#primarycontent p.d1 a:link {
	font-weight : bold; 
	text-decoration : none;
color: #2ED4D6;
	background: transparent; 
	}

#primarycontent p.d1 a:visited {
	font-weight : bold; 
	text-decoration : none;
	color: #c30;
	background: transparent; 
	}

#primarycontent p.d1 a:hover {
	font-weight : bold; 
	text-decoration : none;
	color: #f60;
	background: transparent; 
	}

#primarycontent p.d1 a:active {
	font-weight : bold; 
	text-decoration : none;
	color: #f90;
	background: transparent;  
	}













.d2	{
	font-size: 2.6em;
	font-weight: bold;
	color: #2ED4D6;
line-height: -2em;
	}




h2.sub	{
	color: #999;
	}


html p	{
	margin-top: 0;
	margin-bottom: 1em;
	text-align: left;
	font-size:  0.85em;
	line-height: 1.5;
	}



#wrapper {
	position: relative;
	width: 610px;
	margin-right: auto;
	margin-left: auto;

}

#pharkh {

width: 610px;
height: 76px;
text-indent: -5000px;
background:   url(images/banpic_home_.jpg) no-repeat left top; 
margin: 0px; /*stops unwanted margin in ie */
} 

#pharkp {

width: 610px;
height: 76px;
text-indent: -5000px;
background:   url(images/banpic_photos.jpg) no-repeat left top; 
margin: 0px; /*stops unwanted margin in ie */
} 

#pharki {

width: 610px;
height: 76px;
text-indent: -5000px;
background:   url(images/banpic_illus.jpg) no-repeat left top; 
margin: 0px; /*stops unwanted margin in ie */
} 



#pharka { /*for archive_nb */

width: 610px;
height: 76px;
text-indent: -5000px;
background:  url(images/banpic_archive.jpg) no-repeat left top; 
margin: 0px; 
} 



#pharkabout {

width: 610px;
height: 76px;
text-indent: -5000px;
background:   url(images/banpic_about.jpg) no-repeat left top; 
margin: 0px; /*stops unwanted margin in ie */
} 




#logolink {/* provides link to phark logo with transparent gif*/
	position: absolute;

top: 28px;

left: 4px;

	text-align: left;

	margin-right: auto;

	margin-left: auto;

	padding: 0px 0 0px 0;

width: 200px;

height: 6px;

} 




div#topgap	{
height: 20px;
text-align: center;	
}

table#topborder	{ /* - */
	background: transparent;
	}


div#totop	{/* insert divs into tds  to go with doc flow*/
display: block;
height: 49px;
width:43px;
padding-right: 20px;
background:  url(images/totop.gif) no-repeat;
}

	
/* Basic page divisions  tables don't like this in ffox:  top left y-repeat*/

#primarycontent	{
	padding: 25px 10px 0 10px;
	}



#primarycontent .sectionpic a:link, #primarycontent .sectionpic a:visited {/* this is for the section header yellow applied as a div on liclass won't overide #nav specs but thats ok as this is only used once */

	color: #D8CC17;/* don't forget the visited state (above) */

padding: 0px 0px 0px 0px;

float: left;


display: inline;

margin: 3px 2px 3px 2px;

width: 30px;

height: 30px;

list-style: none;

border: 1px solid #FFF;

 /* gives spacing around thumbs , #navigation .sectionpicin*/

}



#primarycontent .sectionpic a:hover {

border: 1px solid #f60;

}


#primarycontent .divider {

	border-bottom: 1px solid #ccc; 

height: 3px;

width: 376px;
}






 /* =cat nav */


 /* first col */

#au, #mx, #ian, #mum, #new,   #dr, #sb {
	left: 0px;
padding-right: 20px;
padding-top: 10px;

	float: left;
}
 /* 2nd col */
#tw, #in, #amy, #dad, #ha,   #luna {
	left: 122px;
padding-right: 20px;
padding-top: 10px;
	float: left;
}
 /* 3rd col */
#ch, #owen, #fh,  #gr  {
	left: 244px;
padding-top: 10px;

	float: left;
}


#au a:link, #au a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_au.jpg") top left no-repeat;
}

#tw a:link, #tw a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_tw.jpg") top left no-repeat;
}

#ch a:link, #ch a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_ch.jpg") top left no-repeat;
}

#mx a:link, #mx a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_mx.jpg") top left no-repeat;
}

#in a:link, #in a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_in.jpg") top left no-repeat;
}





 /* family */

#ian a:link, #ian a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_ian.jpg") top left no-repeat;
}
#amy a:link, #amy a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_amy.jpg") top left no-repeat;
}
#owen a:link, #owen a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_owen.jpg") top left no-repeat;
}
#mum a:link, #mum a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_mum.jpg") top left no-repeat;
}
#dad a:link, #dad a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_dad.jpg") top left no-repeat;
}

#fh a:link, #fh a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_fh.jpg") top left no-repeat;
}


 /* new */

#new a:link, #new a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_new.jpg") top left no-repeat;
}

#ha a:link, #ha a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_ha.jpg") top left no-repeat;
}



 /* illusrations */

#dr a:link, #dr a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_dr.jpg") top left no-repeat;
}
#luna a:link, #luna a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_luna.jpg") top left no-repeat;
}
#gr a:link, #gr a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_gr.jpg") top left no-repeat;
}
#sb a:link, #sb a:visited {
	display: block;
width: 112px ;
	background: url("images/cat_nav_sb.jpg") top left no-repeat;
}





 /* hover and active states for all cat nav */

#au a:hover, #tw a:hover, #ch a:hover, #mx a:hover, #in a:hover, 

#ian a:hover, #amy a:hover, #owen a:hover, #mum a:hover, #dad a:hover, #fh a:hover, #new a:hover, #ha a:hover,

#dr a:hover, #luna a:hover, #gr a:hover, #sb a:hover 

{
	background-position: 0 -175px;
	color: #B51032;
}

#au a:active, #tw a:active, #ch a:active, #mx a:active, #in a:active, 

#ian a:active, #amy a:active, #owen a:active, #mum a:active, #dad a:active, #fh a:active, #new a:active, #ha a:active, 

#dr a:active, #luna a:active, #gr a:active, #sb a:active 

{
	background-position: 0 -350px;
	color: #B51032;
}












table#content {
	background:  url(images/holder.gif);

	}

/* =Sidebar display attributes 	 */

#sidebar	{
	}



#sidebar p	{
	margin-top: 0.5em;
	font-size:  0.75em;
padding: 0px 30px 0 15px;	
	}

#sidebar p.dl	{
	padding-left: 35px;
	background-image: url(images/icon_pdf.gif);
	background-repeat: no-repeat;
	background-position: 15px 0px;
	}



#sidebar img	{
	margin: 30px 0 15px 0;
	}

#sidebar h1	{
padding: 25px 30px 0 15px;	

	}

	
#sidebar h2	{
	font-size: 0.9em;
	font-weight: bold;
	color: #666;
	margin: 0;
	line-height: 1.5;
padding: 25px 30px 0 15px;	

	}
/* =Navigation bar components  margleft-15 margright-25 */	
	
	#sidebar .divider {
border-bottom: 1px solid #FFF; 
padding: 0px 30px 0 15px;	
margin-left: 4px;
margin-right: 20px;
line-height: 1.4em;
}




	
table#banner	{
	background:  url(images/holderbc.gif);
	}	




/* =breadcrumb 	
*/
	
table#breadcrumb	{
	background:  url(images/holderbc.gif);
	}		

table#breadcrumb p 	{
	font-size: 11px;
	margin-top: 10px;
	padding: 0px 0 0 10px;
	text-align: left;	
	color: #999;
	font-weight : bold; 
}

table#breadcrumb a:link	{
	font-weight : normal; 
	text-decoration : none;
	color: #999;
}


table#breadcrumb a:visited {
	font-weight : normal; 
	text-decoration : none;
	color: #999;
	}

table#breadcrumb a:hover {
	font-weight : normal; 
	text-decoration : underline;
	color: #999;
	}

table#breadcrumb a:active {
	font-weight : normal; 
	text-decoration : none;
	color: #f90;
	}
	
.youarehere {
color: #FAC11F;
	}



/* =nav */

table#nav	{ /* - */
	background:  url(images/holdernav.gif);
	}

table#nav td	{
	font: 11px verdana, arial, sans-serif;
	text-align: center;
	}

table#nav td a	{
	font-weight: normal;
	text-decoration: none;
	display: block;
	margin: 0;
	padding: 0;
	}
	
#nav td a:link, #nav td a:visited {
	background: transparent url(images/bgpat.gif) repeat;
	display: block;
	margin: 0;
	width: 100px;
	line-height: 25px;
	} 

#nav td a:hover {
	color: #f60;
	background: white url(images/nopat.gif) repeat;
	} 

/* =for when non home state */
td#home a:link, td#home a:visited {/* =no img for non in state as in ja-ren.com/index.html */
	color: #c30;
	background: transparent url(images/lhbutton_off.gif) repeat;
	width: 100px;
	line-height: 25px;
	} 

td#home a:hover {/* =no img for non in state as in ja-ren.com/index.html */
	color: #f60;
	background: white url(images/lhbutton_on.gif) repeat;
	width: 100px;
	line-height: 25px;
	} 


/* =for home state */
td#home a:link img, td#home a:visited img {
	color: #c30;
	background: transparent url(images/bgpat.gif) repeat;
	width: 100px;
	height: 75px;
	} 

td#home a:hover img {
	color: #f60;
	background: white url(images/nopat.gif) repeat;
	width: 100px;
	height: 75px;
	} 


/* =footer */

table#footer	{
margin: 0;
padding: 0;
position: relative;/* ensures proper localised positioning in ie */
	background:  url(images/holderfoot.gif);
height: 63px;
	}			

table#footer p	{
	font-size: 11px;
	margin-top: 15px;
text-align: center;	
padding-left: 31px;/* adjusting for arrow on right 43+20 margin */
}

div#botshadow	{
height: 4px;
	background:  url(images/botshadow.gif) center no-repeat;
margin: 0;
padding: 0;
}

#footup {
	position: absolute;
	display: block;
	left: 547px;
	bottom: 10px;
	height: 47px;
	width: 43px;
}

#footup a:link, #footup a:visited {

	display: block;
width: 43px ;
	background:  url(images/totop.gif) top left no-repeat;

}



#footup a:hover {

	background-position: 0 -108px;

}



#footup a:active {

	background-position: 0 -216px;


}


/* Fading Tooltips By Dustin Diaz*/
body div#toolTip { position:absolute;z-index:1000;width:220px;background:#000;border:2px double #fff;text-align:left;padding:5px;-moz-border-radius:5px; }
body div#toolTip p { margin:0;padding:0;color:#f60;font:11px/12px verdana,arial,sans-serif;font-weight:bold;  }
body div#toolTip p em { display:block;margin-top:3px;color:#fff;font-style:normal;font-weight:normal; }
body div#toolTip p em span { font-weight:bold;color:#fff; }


.picnavhead { 
width: 330px;
padding-top: 50px;
background-color: red;
height: 40px;
	clear: both;
margin-bottom: -35px;
}


.noheight {

padding:0;

margin:0;

width: 100%;

font-size: 1%;

  color: #CCC;

background: #CCC url(images/bg.jpg) bottom left fixed repeat;

}



.noheight a:link, .noheight a:visited {

  color: #CCC;

}





.noheighttarget {

padding:0;

margin:0;

width: 100%;

font-size: 1%;

  color: #FF9900;

	background:  url(images/holderbc.gif);

}



.clear { 



	clear: both;



}