* {

    padding: 0;

    margin: 0;

} 



body {

background: #00CC33 url(../images/tracks.png);

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 11px;

line-height: 18px;

color: #333333;

}



img { border: none; }

a { color: #4c320d;  }

a:hover { text-decoration: none; color : #000; }



#wrap {

margin: 20px auto;

width: 800px;

}



#header { 

background: #4c320d url(../images/header.jpg) no-repeat;

height: 150px;

}

#header h1 {

font-size: 26px;

font-weight: 100;

letter-spacing: -1px;

padding: 22px 0 5px 20px;

}

.hanimal
{

font-size: 16px;

font-weight: bold;

letter-spacing: -1px;

}

#header h1 a {

color: #fff;

text-decoration: none;

}

#header h1 a:hover {

color: #111;

text-decoration: none;

}

#header h2 {

color: #ccc;

font-size: 15px;

font-weight: 100;

padding: 0 0 0 21px;

letter-spacing: -1px;

line-height: 12px;

}



#menu {

height: 50px;

line-height: 30px;

background: #4c320d url(../images/menu.jpg) no-repeat;

z-index: 5;



}

#menu ul {

padding-left: 10px;

list-style-type: none;

z-index: 5;

}

#menu ul li {

display: block;

float: left;

}

#menu ul li a {

color: #000000;

padding: 0 10px;

text-decoration: none;

font-weight: 600;

}

#menu ul li a:hover {

color: #fff;

text-decoration: underline;

}



#content {

background: #ffffff url(../images/content.jpg) repeat-y;

padding: 10px 20px;

}



.left {

width: auto;

text-align: justify;

}

.left h2 {

color: #FF4800;

font-size: 24px;

letter-spacing: -3px;

font-weight: 100;

padding : 10px 0 15px 0;

}



.textcenter{

width: 710px;

font-size: 14px;

text-align: inherit;



margin:0 auto;

}







#top {

background: #555 url(../images/top.jpg) no-repeat;

padding: 5px 0;

}

#bottom {

background: #555 url(../images/bottom.jpg) no-repeat;

padding: 7px 0;

}



#footer {

text-align: center;

color: #eee;

font-size: 11px;

padding: 0 0 10px 0;

}

#footer a { color: #eee; }









.thinborderfloat {

  float:top;

  border:solid 1px silver;

  padding:5px;

  margin-right:10px;

  } 

  

  

.whiteimg{

	width:200px;

	height:145px;

	background:url(../images/animalplaceholder.jpg) repeat;

	border:1px solid white;

	

}



.whitebdr{

	width:180px;

	height:125px;

	border:10px solid white;

	filter:alpha (opacity=50);

	-moz-opacity:.50;

	opacity:.50;

	-khtml-opacity: 0.5;

}



img.pic { border: 2px solid #000000 ;



z-index:-1; }



.animalbio{



border: 1px solid #333333;

width: 700px;



text-align: justify;



margin:0 auto;

z-index:1;

}





.leftdiv{

width: 365px;

height: 149px;

clear: left;

border: 1px solid gray;

}



.leftdiv .floatbox{

float: left;

width: 200px;

}



* html .leftdiv p{ /* IE 3px jog hack*/

height: 1%;

}



.leftdiv p{

margin-top: 0;

margin-left: 210px;

}













.rightdiv{



width: 365px;

height: 149px;

clear: left;

border: 1px solid gray;



}



.rightdiv .floatbox{

float: right;

width: 204px;



}



* html .rightdiv p{ /* IE 3px jog hack*/

height: 1%;

}



.rightdiv p{

margin-top: 0;

margin-right: 210px;

}









/*Left Thumbnail

/*Credits: Dynamic Drive CSS Library */

/*URL: http://www.dynamicdrive.com/style/ */



.thumbnail{

position: relative;

z-index: 0;

}



.thumbnail:hover{

background-color: transparent;

z-index: 50;

}



.thumbnail span{ /*CSS for enlarged image*/

position: absolute;

background-color: lightyellow;

padding: 5px;

left: -1000px;

border: 1px dashed gray;

visibility: hidden;

color: black;

text-decoration: none;

}



.thumbnail span img{ /*CSS for enlarged image*/

border-width: 0;

padding: 2px;

}



.thumbnail:hover span{ /*CSS for enlarged image on hover*/

visibility: visible;

top: 0;

left: 60px; /*position where enlarged image should offset horizontally */



}

/*Right Thumbnail

/*Credits: Dynamic Drive CSS Library */

/*URL: http://www.dynamicdrive.com/style/ */



.rightthumbnail{

position: relative;

z-index: 0;

}



.rightthumbnail:hover{

background-color: transparent;

z-index: 50;

}



.rightthumbnail span{ /*CSS for enlarged image*/

position: absolute;

background-color: lightyellow;

padding: 5px;

right: -1000px;

border: 1px dashed gray;

visibility: hidden;

color: black;

text-decoration: none;

}



.rightthumbnail span img{ /*CSS for enlarged image*/

border-width: 0;

padding: 2px;

}



.rightthumbnail:hover span{ /*CSS for enlarged image on hover*/

visibility: visible;

top: 0;

right: 60px; /*position where enlarged image should offset horizontally */



}