@charset "UTF-8";
html {
	background-color:#000;
	background-image:url(images/htmlpatter.jpg);
	background-repeat:repeat;
}


#tl {
	background:url(images/top_left_gradient.png);
	position:relative;
	height: 220px;
	width: 220px;
	float:left;
}
#l {
	background-image:url(images/left_gradient.png);
	position:relative;
	height:210px;
	width:220px;
	float:left;

}
#ol {
	background-image:url(images/left_gradient.png);
	position:relative;
	height:810px;
	width:220px;
	float:left;

}
#bl {
	background-image:url(images/bottom_left_gradient.png);
	position:relative;
	height: 220px;
	width: 220px;
	float:left;
}
#t {
	background-image:url(images/top_gradient.png);
	position:relative;
	height:220px;
	width:584px;
	float:right;
}
#b {
	background-image:url(images/bottom_gradient.png);
	position:relative;
	height:220px;
	width:584px;
	float:right;


}
#br {
	background-image:url(images/bottom_right_gradient.png);
	position:relative;
	height: 220px;
	width: 220px;
	float:right;
}
#r {
	background-image:url(images/right_gradient.png);
	position:relative;
	height:210px;
	width:220px;
	float:right;

}
#or {
	background-image:url(images/right_gradient.png);
	position:relative;
	height:810px;
	width:220px;
	float:right;

}
#tr {
	background-image:url(images/top_right_gradient.png);
	position:relative;
	height: 220px;
	width: 220px;
	float:right;
	top:0px;
}
#wrap {
	height:650px;
	width:1024px;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	top:0px;
	background-image:url(images/harlequin.jpg);
	background-repeat:repeat;
	
}
#doublewrap {
	text-align:center;
	position:relative;
	width:auto;
	height:auto;
	margin-left:10px;
	margin-right:10px;
	margin-top:-16px;
}
#owrap {
	height:1250px;
	width:1024px;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	top:0px;
	background-image:url(images/harlequin.jpg);
	background-repeat:repeat;
	
}
#odoublewrap {
	text-align:center;
	position:relative;
	width:auto;
	height:auto;
	margin-left:10px;
	margin-right:10px;
	margin-top:-16px;
}
.top {
	height:220px;
	width:1024px;
}
.middle {
	width:1024px;
	height:210px;
}
.omiddle {
	width:1024px;
	height:810px;
}
.bottom {
	height:220px;
	width:1024px;
}



.logo {
	float:left;
	display: block;
	width: 350px;
	height: 203px;
	background:url(images/810slant.png) bottom;
	position:absolute;
	left: -20px;
	top: -2px;
	z-index:68;
}

.logo:hover {
	background-position: 0 0;
}
li {
	list-style:none;
}
#footer {
	height:20px;
	width:1024px;
	margin-left:auto;
	margin-right:auto;
	background-image:url(images/stripes.jpg);
	background-repeat:repeat-x;
	margin-top:-40px;
	z-index:10;
	font:Verdana, Geneva, sans-serif;

}

.ophotos {
	float:left;
	display: block;
	width: 200px;
	height: 81px;
	background:url(images/KEY2.png) bottom;
	position:absolute;
	left: 414px;
	top: 1125px;
	z-index:20;
}
.ophotos:hover {
	background-position: 0 0;
}
.photos {
	float:left;
	display: block;
	width: 200px;
	height: 81px;
	background:url(images/KEY2.png) bottom;
	position:absolute;
	left: 414px;
	top: 525px;
	z-index:20;
}
.photos:hover {
	background-position: 0 0;
}
.ocontact {
	float:left;
	display: block;
	width: 175px;
	height: 112px;
	background:url(images/contact.png) bottom;
	position:absolute;
	left: 33px;
	top: 1090px;
	z-index:50;
}

.ocontact:hover {
	background-position: 0 0;
}
.contact {
	float:left;
	display: block;
	width: 175px;
	height: 112px;
	background:url(images/contact.png) bottom;
	position:absolute;
	left: 33px;
	top: 490px;
	z-index:50;
}

.contact:hover {
	background-position: 0 0;
}
.oorder {
	float:left;
	display: block;
	width: 175px;
	height: 112px;
	background:url(images/order.png) bottom;
	position:absolute;
	left: 797px;
	top: 1090px;
	z-index:50;
}
.oorder:hover {
	background-position: 0 0;
}
.order {
	float:left;
	display: block;
	width: 175px;
	height: 112px;
	background:url(images/order.png) bottom;
	position:absolute;
	left: 797px;
	top: 490px;
	z-index:50;
}
.order:hover {
	background-position: 0 0;
}


#slideshow {
	position:absolute;
	top:43px;
	left:56px;
	height:350px;
	width:500px;
	z-index:7;
}
#contact {
	position:absolute;
	left: 934px;
	top: 225px;
	list-style:none;
	list-style-type:none;
	border:0;
	text-decoration:none;
	height: 186px;
	z-index:69;
}
.thumbnail{
position: absolute;
z-index: 0;
}

.thumbnails:visited{
	display:none;
	
}
.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;

}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
 /*position where enlarged image should offset horizontally */

}

#photonav {
	position:absolute;
	width:200px;
	height:auto;
	left: 0px;
	top: 174px;
	text-decoration:none;
	z-index:69;
	text-align:center;
}
#photonav2 ul li {
	display:inline;
	}

#photonav2 {
	position:absolute;
	width:200;
	height:72px;
	left: 320px;
	top: 7px;
	text-decoration:none;
	z-index:69;
	text-align:center;
}
#thumbnails {
	position:absolute;
	width:150px;
	height:360px;
	left: 750px;
	top: 100px;
	text-decoration:none;
	overflow:auto;
	
	
	
}
#thumbnails ul li {
	border:none;
}


#gallery {
	position:absolute;
	height:350px;
	width:500px;
	float:right;
	z-index:7;
	right:53px;
	top:96px;
	
	
	
}
#gallerybackground {
	position:absolute;
	background-image:url(images/framebackground.jpg);
	height:299px;
	width:429px;
	float:left;
	z-index:6;
	left:83px;
	top:80px;
}
#frame {
	height:450px;
	width:600px;
	position:absolute;
	z-index:8;

}

.center2 {
	position:absolute;
	height:450px;
	width:600px;
	left:203px;
	top:77px;
}
#gallerybackground2 {
	position:absolute;
	background-image:url(images/framebackground.jpg);
	height:299px;
	width:429px;
	float:left;
	z-index:1;
	left:83px;
	top:80px;

}
.price {
	position:absolute;
	z-index:50;
	left: 463px;
	top: 23px;
}

#order {
	position:absolute;
	left: 88px;
	top: 104px;
}
.bio {
	font-family: Georgia, "Times New Roman", Times, serif;
	position: absolute;
	left: 520px;
	top: 77px;
	width: 350px;
}
#text {
	position:absolute;
	height:400px;
	width:450px;
	left: 475px;
	top: 80px;
}

#text .top {
	height:186px;
	width:450px;
}
#text .middle {
	width:450px;
	height:52px;
}
#text .bottom {
	height:162px;
	width:450px;
}

#text #tl {
	background:url(images/text-block_01.png);
	position:relative;
	height: 186px;
	width: 162px;
	float:left;
}
#text #l {
	background-image:url(images/text-block_04.png);
	position:relative;
	height:52px;
	width:162px;
	float:left;

}
#text #bl {
	background-image:url(images/text-block_07.png);
	position:relative;
	height: 162px;
	width: 162px;
	float:left;
}
#text #t {
	background-image:url(images/text-block_02.png);
	position:relative;
	height:186px;
	width:126px;
	float:right;
}
#text #b {
	background-image:url(images/text-block_08.png);
	position:relative;
	height:162px;
	width:126px;
	float:right;


}
#text #br {
	background-image:url(images/text-block_09.png);
	position:relative;
	height: 162px;
	width: 162px;
	float:right;
}
#text #r {
	background-image:url(images/text-block_06.png);
	position:relative;
	height:52px;
	width:162px;
	float:right;

}
#text #tr {
	background-image:url(images/text-block_03.png);
	position:relative;
	height: 186px;
	width: 162px;
	float:right;
	top:0px;
}
#text #m {
	background-image:url(images/text-block_05.png);
	position:relative;
	height:52px;
	width:126px;
	float:right;
	background-repeat:repeat;
}

#bio {
	position:absolute;
	height:360px;
	width:360px;
	left:96px;
	top:125px;
	font-family: Georgia, "Times New Roman", Times, serif;
}

#bio .top {
	height:186px;
	width:360px;
}
#bio .middle {
	width:360px;
	height:12px;
}
#bio .bottom {
	height:162px;
	width:360px;
}

#bio #tl {
	background:url(images/bioframe_01.png);
	position:relative;
	height: 186px;
	width: 162px;
	float:left;
}
#bio #l {
	background-image:url(images/bioframe_04.png);
	position:relative;
	height:12px;
	width:162px;
	float:left;

}
#bio #bl {
	background-image:url(images/bioframe_07.png);
	position:relative;
	height: 162px;
	width: 162px;
	float:left;
}
#bio #t {
	background-image:url(images/bioframe_02.png);
	position:relative;
	height:186px;
	width:36px;
	float:right;
}
#bio #b {
	background-image:url(images/bioframe_08.png);
	position:relative;
	height:162px;
	width:36px;
	float:right;


}
#bio #br {
	background-image:url(images/bioframe_09.png);
	position:relative;
	height: 162px;
	width: 162px;
	float:right;
}
#bio #r {
	background-image:url(images/bioframe_06.png);
	position:relative;
	height:12px;
	width:162px;
	float:right;

}
#bio #tr {
	background-image:url(images/bioframe_03.png);
	position:relative;
	height: 186px;
	width: 162px;
	float:right;
	top:0px;
}
#bio #m {
	background-image:url(images/bioframe_05.png);
	position:relative;
	height:12px;
	width:36px;
	float:right;
	background-repeat:repeat;
}
#biotext {
	font-family: Georgia, "Times New Roman", Times, serif;
	position:absolute;
	height:360px;
	width:300px;
	left:125px;
	top:125px;
	z-index:10;
}

.art {
	float:right;
	display: block;
	width: 60px;
	height: 45px;
	background:url(images/art.png) bottom;
	z-index:100;
	
}

.art:hover {
	background-position: 0 0;
}
.adults {
	float:left;
	display: block;
	width: 82px;
	height: 45px;
	background:url(images/adult.png) bottom;
	z-index:100;
	
}

.adults:hover {
	background-position: 0 0;
}
.avant {
	float:right;
	display: block;
	width: 137px;
	height: 45px;
	background:url(images/avant.png) bottom;
	z-index:100;
	padding-top:-20px;
}

.avant:hover {
	background-position: 0 0;
}
.baby {
	float:right;
	display: block;
	width: 73px;
	height: 45px;
	background:url(images/baby.png) bottom;
	z-index:100;
}

.baby:hover {
	background-position: 0 0;
}
.christ {
	float:right;
	position:relative;
	display: block;
	width: 102px;
	height: 45px;
	background:url(images/christmas.png) bottom;
	z-index:100;
}

.christ:hover {
	background-position: 0 0;
}
.kid {
	float:right;
	position:relative;
	display: block;
	width: 73px;
	height: 45px;
	background:url(images/kid.png) bottom;
	z-index:100;
}

.kid:hover {
	background-position: 0 0;
}
.family {
	float:right;
	position:relative;
	display: block;
	width: 94px;
	height: 45px;
	background:url(images/family.png) bottom;
	z-index:100;
}

.family:hover {
	background-position: 0 0;
}
.me {
	float:right;
	position:relative;
	display: block;
	width: 61px;
	height: 45px;
	background:url(images/me.png) bottom;
	z-index:100;
}

.me:hover {
	background-position: 0 0;
}
.storybook {
	float:right;
	position:relative;
	display: block;
	width: 121px;
	height: 45px;
	background:url(images/storybook.png) bottom;
	z-index:100;
}

.storybook:hover {
	background-position: 0 0;
}
.highschool {
	float:right;
	position:relative;
	display: block;
	width: 132px;
	height: 45px;
	background:url(images/high.png) bottom;
	z-index:100;
}

.highschool:hover {
	background-position: 0 0;
}

.pricelist {
	position:absolute;
	display: block;
	width: 135px;
	height: 45px;
	background:url(images/pricelist.png) bottom;
	z-index:100;
	left: 558px;
	top: 29px;
}

.pricelist:hover {
	background-position: 0 0;
}