/* CSS Document */


/* Special star to promote event */

#star { width:186px; height:185px; background: url(../images/star.png) right top no-repeat; position:relative; right:-670px; top:-186px;  overflow:hidden;  z-index:101;  }
#star a { display:block; width:186px; height:185px;  }

/*  Page Code to go into <div> of "Photo" point to correct page>>

<div id="star"> <a href="faq.html" title="Special Notice"></a> </div>

Special star to promote event 
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
*/






/* Wrapper for whole site*/
#wrapper{
	width:800px;
	margin:auto;
	display:block;
	float:none;
	background-color: #fff;
	
	
}



*{
margin:0;
padding:0;
border:0;
line-height:16px;
text-align:left;
font-family:Arial, Helvetica, sans-serif;
}




p{
	margin: 10px 10px 10px 15px;
	color:#444;
	font-weight: 400;
	font-size:12px;
}

h1{

	margin:8px 0 0 15px;
	color:#000;
	font-size:14px;
	font-weight:bold;
	text-shadow: 0px 1px 1px #fff
}


h2{
	display:inline;
	float:left;
	margin:8px 0 0 15px;
	color:#2a2;
	font-size:11px;
	font-weight:normal;

}

h3{
	color:#2a2;
	margin:20px 0 11px 15px;
	font-size:18px;
	font-weight:bold;
	line-height:22px;
	
}

h4,h5,h6{
	color:#2a2;
    margin:10px 0 11px 15px; 
	font-size:18px;
	font-weight:bold;
	line-height:22px;	
	
}


body{
	padding-top:0px;
	background-color: #fff;
    background-image: url(../images/gradient_green.jpg);
	background-repeat: repeat-x;
}

/*This is the top image*/
#toppic {
	position:relative;
	width:800px;
	height:180px;
	margin:0px 0 0 0px;
	
}

#Navlayer {
	position:relative;
	width:800px;
	height:22px;
	font-size:12px;
	text-align: center;
	background-image: url(../images/gradient.jpg);  /*green bit at top of Main Text Box */
	background-repeat: repeat-x;
	padding-top: 6px;
}

.nav a:link,.nav a:active,.nav a:visited{
color:#444;text-decoration:none;
}
.nav a:hover{
color:#2a2;text-decoration:none;
}

/*This is the working area  - large box*/
#mainbox {
	position:relative;
	width:800px;
	height: 502px;
	background-color:#a4cfbe;
	background-image: url(../images/kunekunepig.jpg);
	background-repeat: no-repeat;  
}
/*This is a fix for pages kunekune and kunekunepiglets to increase box size.   (1st Feb only kunekune change)*/
#mainbox1 {
	position:relative;
	width:800px;
	height: 542px;
	background-color:#a4cfbe;
	background-image: url(../images/kunekunepig.jpg);
	background-repeat: no-repeat;  
}

/*This is INSIDE the working area of the large box */
/*This is Left box*/
#leftbox {
    float:left;
	width:380px;
	height:auto;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	
}
/*This is the right box*/
#rightbox {
	width:380px;
	float:right;
	height:auto;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	background-color: #a4cfbe;
	
}
/*This is the bottom band/box*/
#foot{
    width:800px;
	height:auto;
 	float:left;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #aaa;
	background-image: url(../images/gradient_foot.jpg);  /*green bit at bottom */
	background-repeat: repeat-x;
}

#foot img{
	margin-top: 8px;
	margin-right: 15px;
	margin-bottom: 0;
	margin-left: 15px;
	float:left;
	border: 1px solid #ddd;
}
.kenb{
	font-size: 9px;
}
#copy{
	float:right;
	margin:0px 15px 0 0;
	
}

#logo { width:75px; height:83px; background: url(../images/swine.jpg) right bottom no-repeat; position:relative; right:-600px; top:-100px;  overflow:hidden;  }
#logo a { display:block; width:75px; height:83px;  }

/*This was 86 by 85*/

#lightboximages{
	width:380px;
	background-color: #a4cfbe;
	float:left;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
	padding-bottom: 5px;
}
#lightboximages img{
	margin-top: 8px;
	margin-right: 8px;
	margin-bottom: 13px;
	margin-left: 2px;
	float:left;
	width: 100px;
	height: 70px;
	border: 1px solid #666666;
}



/*---------- bubble tooltip -----------*/

a.tt{
	position:relative;
	z-index:24;
	color:#03C; /*  Blue hover */
	font-weight:bold;
	text-decoration: underline;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #444; font-weight:bold; background:;
/*  #444 is dark mouse over  */
}


a.tt:hover span.tooltip{
	
	display:block;
	position:absolute;
	top:0px;
	left:0px;
	padding: 15px 0 0 0;
	width:200px;
	font-weight: 400;
	font-size:12px;
	text-decoration:none;
	text-align: center;/* No effect due to * function */
	/*	filter: alpha(opacity:90);
	KHTMLOpacity: 0.90;
	MozOpacity: 0.90;*/
	opacity: 	0.999;
}
a.tt:hover span.top{
	display: block;
	padding: 30px 8px 0;
	text-decoration:none;
    background: url(../tooltip/bubble.gif) no-repeat top;
}

a.tt:hover span.middle{ /* different middle bg for stretch */
	/*  Text within the box */
	display: block;
	padding: 0 8px; 
	background: url(../tooltip/bubble_filler.gif) repeat bottom; 
	color: #444;
	font-weight: 400;
	font-size:12px;
	text-decoration: none;
	
}
a.tt:hover span.bottom{
	display: block;
	padding:3px 8px 10px;
	color: #fff;
	text-decoration:none;
    background: url(../tooltip/bubble.gif) no-repeat bottom;
}

/*---------- bubble tooltip -----------*/