/* family.css */


body			{	background-color: #9BB5C1;
				background-image: url('images/th.jpg');	}
				
#wrapper	{	border: 1px solid grey;
				background-image: url("images/house1000.jpg");
				font-family: Arial, sans-serif;
				width: 1000px;
				height: 615px;
				margin: 0px auto;
				border-radius: 25px;	}

h1,h3		{	text-align: center;	
				background-color: rgb(200,200,255);	
				margin: 0;	}
		
h1			{	border-top-left-radius: 25px;
				border-top-right-radius: 25px;	}
				
				
img			{	width: 100%;
				border: 3px solid white;
				border-radius: 5px; }

figcaption		{	border-radius: 5px;
				border-top-left-radius: 0px;
				border-top-right-radius: 0px;
				border:3px solid white;	
				background-color: white;	}

figcaption  a		{text-decoration: none;	}				
				
#tnt		{	width: 75px;
				height: 100px;
				position: relative;
				left: 125px;
				top: 120px;
				}

#tyler		{	width: 75px;
				height: 100px;	
				position: relative;
				left: 610px;
				top: -20px;
				}				

#family		{	width: 75px;
				height: 100px;	
				position: relative;
				left: 110px;
				top: 45px;
				}	

#house		{	width: 75px;
				height: 100px;	
				position: relative;
				left: 504px;
				top: -80px;
				}

#topher		{	width: 75px;
				height: 100px;	
				position: relative;
				left: 700px;
				top: -195px;
				}			

#tig		{	width: 75px;
				height: 60px;	
				position: relative;
				left: 310px;
				top: -270px;
				}			
#bear		{	width: 100px;
				height: 75px;	
				position: relative;
				left: -20px;
				top: -270px;
				}								
#contact	{	width: 50px;
				height: 50px;	
				position: relative;
				left: 605px;
				top: -360px;
				}
				
fieldset		{	text-align: center;
				width: 500px;
				margin: 50px auto;	}
				
legend, label	{	background-color: rgb(200,200,200);
				border-radius: 5px;	} 				
figure  > a	{ 	display: none;	}

figure:hover   a {	display: block;	}

h2			{	margin: 0;	}

article		{	margin: 1px auto;	
				border: 1px solid grey;	
				padding: 0px 10px;
				margin-top: -190px;	
				background-color: rgb(200,200,200);	
				text-align: center;	}

#welcome	{	border-bottom-left-radius: 25px;
				border-bottom-right-radius: 25px;	
				width: 980px;
				position: relative;
				top: -60px;}

nav ul		{	display: inline;
				}

nav li		{	display: inline;
				list-style-type: none;
				}

nav li a		{	background-color: rgb(200,200,255);
				color: black;
				border: 2px solid black;
				border-radius: 10px;
				font-size: 1.2em;	
				text-decoration: none;		
				padding: 2px 10px;	
				position: relative;
				top: 465px;
				left: -20px;
				list-style-type: none;	}
				
/* The slideshow CSS. Customize to meet your taste. */
.slideshow {
	font-family:Arial, Helvetica, sans-serif;
	width:950px;
	color:#FFFFFF;
	border:0px solid #99CC00;
	position: relative;
	top: 10px;
	left: 30px;
	}
.slideshow > ul {
	margin: 0;
	padding: 0;
}
.slideshow > ul > li {
	display:inline;
	margin:0px;
	padding:0px;
	}
 
.slideshow > ul > li > img	{	width: 100%;	}

.slideshow > ul > li > figure > figcaption {
  font-size:11px;
  text-align:center;
  margin-top:-12px;
  padding-top: 5px;
  color:black;
  background-color: white;
  /*border: 3px solid white;*/
  width: 100%;
}

.slideshow  > ul > li > img {
	border:2px solid #FFFFFF;
	margin:0;
	padding:0px;
	width:70px;
	height:60px;
	background-color: grey;
}

.slideshow > ul > li > figure {
  display: none;
  text-decoration: none;
  } 
  
/* Shows slides when mouse pointer is over a thumbnail image */
ul > li:hover > figure {
	display: block;
	position: absolute;
	top: 60px;
	left: 200px;
	}

/* Highlights the thumbnail image when mouse pointer is over it */
.slideshow > ul > li:hover > img {
	border-color:#FF0000;
	/*margin: 0 auto;*/
	}