/* style CSS for SPECIES for screen */



html {

        font-size: 0.8em;

        line-height: 1.15;

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

	font-style: normal;

}

body {

	margin: 0;

	padding: 0;

	border: 0;

	background-color: #aabbcc;

        text-size-adjust: none;

        -webkit-text-size-adjust: 100%;

}

#container {

	padding: 0;

        margin: 0 auto;

        width: 800px;

        max-width: 800px;

        background: url(images/bkgd_tile-800.gif) top;

	background-repeat: repeat-y;

        overflow: hidden;

}



#masthead {

	color: #FFCC00;

	margin-right: 10px;

	margin-left: 10px;

	padding: 0;

	width: 97.5%;

	height: 80px;

	background-color: #996600;

	overflow: hidden;

}



#masthead p {

	   color: #2F2F2;

	   font-size: 300%;

	   text-align: center;

           text-shadow: 2px 2px #ff0000;

	   margin: 7px 10px 0 10px;

}



#masthead p.scientific {

            color: black;

            font-size: 100%;

            font-style: italic;

            text-shadow: 0px 0px;

}	



#page_content {   /* no border */

        position: relative;

        height: 75%;

        width: 97.5%;   /* 780px; */

        z-index: 0;

        left: 10px;

        overflow: hidden;

}



.range {

        position: absolute;

        top: 0px;

      	float: left;

        height: 80px;

}



   

#thumbs {

        background-color: #996600;

      	float: right;

      	width: 16.7%;

        padding-left: 10px;

        padding-top: 0px;

}



img.thumb {padding-top: 0px;

}



.big, .caption {

        position: absolute;

        top: 900px;

        left: 0px;

        

  -webkit-transition: top 1s ease;

  -moz-transition: top 1s ease;

  -o-transition: top 1s ease;

  -ms-transition: top 1s ease;

  transition: top 1s ease;

}



img.big, img.featured {width: 82%; /*640px; */ }



.featured {

       position: absolute;

       top: 0px;

       left: 0px;

       z-index: -3;

}



em {

  font-style: normal;

  font-weight: bold;

  color: red;

}



p.featured {

  top: 84%;

  font-size: 1em;

  color: black;

  background-color: white;

}



a:hover .thumb {

  -webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.5);

  -moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.5);

  box-shadow: 0px 0px 15px rgba(0,0,0,0.5);

}

 

a:hover .big {

  top: 0px;

}



a:hover .caption {

  top: 84%; /* 460px; */

  font-size: 80%;

  color: #990000;  /*pic caption */

  font-style: initial;

  margin-left: 2px;

  background-color: white;

} 



#footer {

	width: auto;

	clear: both;

	text-align: center;

	background-color: #996600;

	margin-right: 10px;

	margin-left: 10px;

	overflow: hidden;

	padding: 2px;

}



#footer p {

	color: #FFFFFF;

	font-size: 60%;

	margin-top: 2px;

	margin-bottom: 6px;

}

/* Styles for Links */

a: {color: #8080FF; font-size: 100%;}



#link-back {font-size: 100%; color: #FFCC00; }

#link-back a:link, #link-back a:visited {color: #FFCC00;}

#link-back a:focus {color: #996600; text-decoration: none;}

#link-back a:hover, #link-back a:active {color: #996600; text-decoration: none; font-weight: bold;}