@charset "utf-8";
/* CSS Document */

* {
	margin:0px;
	padding: 0px;
	}
	
body {
		font-family:"Times New Roman", Times, serif;
		color:#0066CC;
		background:#FFFFFF;
		font-size: small;
		/* use this font size so later we can use % to define the other sizes, 
		instead of a definite size like 12 pixels */
		
		}
		
#intro_page {
background:#DFDFDF;
}
		
#container {
	position: relative;
	width: 982px;
	height: 100%;
	margin: 0px auto;
	text-align: left;
	}
	

	
#header {
	margin-top: 25px;
	float: left;
	width: 100%;
	height: 80px;
	background:url(images/myadesignlogof.png) right no-repeat;
	}
#navigation {
	float: left;
	width: 100%;
	height: 22px;
	background: url(images/navbar.png) left top no-repeat;
	}
	#navigation ul {
		float: left;
		list-style: none; /* turns of the bullets */	
		padding: 0px 0px 0px 0px; /* padding numbers are for: top, right, bottom, left */
		margin: 0px;
		}
		#navigation ul li {
			float: left;
			margin-right: 10px; /* this was the space between the tabs of home, about us, and contact me */
			}
			
		#navigation ul li a{
			color: #000;
			text-decoration: none;
			padding: 4px 25px;
			display: block; /* lets users see a link by clicking in the box area, instead of just hovering over type */
			}
			
		#navigation ul li a:hover {
			color: #fff;
			padding: 4px 25px;
			background: url(images/hover.png) top center no-repeat;
			height:100%;
			}
			
		#navigation ul li a:active {
			color: #fff;
			}

#work_page #main {
	float: left;
	width: 100%;
	background:url(images/mainwhite.png) top left no-repeat;
	min-height: 528px;
	}
#photos_page #main {
	float: left;
	width: 100%;
	background:url(images/mainwhite.png) top left no-repeat;
	min-height: 528px;
	}
#aboutme_page #main {
	float: left;
	width: 100%;
	background:url(images/maintext.png) top left no-repeat;
	min-height: 528px;
	}

	
#main {
	float: left;
	width: 100%;
	background:url(images/main2.png) top left no-repeat;
	min-height: 528px;
	
	}
#main #lt {
	width: 275px;
	margin: 50px 0px 0px 50px;
	float: left;
	}
	
p {
	margin-bottom: 10px; /* space between the paragraphs */
	color: #000000;
	font-size: 100%;
	}
	
#mainimage {
	padding-left: 40px;
	float: left;
	padding-top: 65px;
	padding-right: 0px;
	}
#thumbs {
	float: right;
	white-space: nowrap;
	margin-top: 60px;
	margin-right: 170px;
	width: 11em;
	}

#apDiv1 {
	position:absolute;
	left:291px;
	top:253px;
	width:118px;
	height:129px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:607px;
	top:185px;
	width:130px;
	height:68px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:544px;
	top:324px;
	width:76px;
	height:65px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:367px;
	top:239px;
	width:120px;
	height:67px;
	z-index:4;
}
	
#footer {
	float: left;
	width: 100%;
	font-size: 85%;
	color:#666666;
	text-align:center;
	}


/* this is for the test gallery - erase everything below if it doesnt work */


.text{
	color: #33FF00;
	font-size: 100%;
	}


#FrogJS {
background: none;
margin-top: 200px;

width: 760px;
height: 300px;
margin: 0 auto;
margin-top: 50px;
}


#FrogJSCredit{
	text-align: center;
	font-size: 100%;
	color: #470541; /* change color for description type */
	padding: 5px;
			}
#FrogJSCaption{
	text-align: left;
	line-height: 130%;
			}