/******** stylee.css********
******style sheet for*******
****new perry's florist*****
*****weddings site ********/

body{
	background-color: #fadbef;
	margin:0;
	padding:0;
}

a {
	
	text-decoration: none;
	color: #0000FF;
}

a:link {
	text-decoration: none;
}

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

#main{
	height: 768px;
	/*width: 1024px;*/
	width: 1174px;
	left: 50%;
	margin-top: -20px;
	/*margin-left: -512px;*/
	margin-left: -587px;
	position: absolute;
	background-image: url(wedding_layout.jpg);
	background-position:center;
	background-repeat: no-repeat;
	background-color: #fadbef;
}

#top_left{
	height: 243px;
	width: 186px;
	left: 76px;
	margin-left: 9px;
	text-align: center;
	color: #000000;
	font-size: 18px;
	z-index: 1000;
	position: absolute;
	top: 114px;
	
	/*scrollbar colors*/
	SCROLLBAR-FACE-COLOR: #FF99CC; 
	SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-ARROW-COLOR: #000000; 
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF; 
}

#top_right{
	height: 273px;
	width: 186px;
	margin-top: 273px;
	text-align: center;
	color: #000000;
	font-size: 18px;
	z-index: 1010;
	margin-left: 820px;
	position: absolute;
	left: 82px;
	top: -159px;
	
	/*scrollbar colors*/
	SCROLLBAR-FACE-COLOR: #FF99CC; 
	SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-ARROW-COLOR: #000000; 
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF; 
}

#bottom_left{
	height: 273px;
	width: 186px;
	left: 85px;
	text-align: center;
	color: #000000;
	font-size: 18px;
	z-index: 1020;
	position: absolute;
	top: 414px;
	
	/*scrollbar colors*/
	SCROLLBAR-FACE-COLOR: #FF99CC; 
	SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-ARROW-COLOR: #000000; 
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF; 
}

#bottom_right{
	height: 273px;
	width: 186px;
	right: 86px;
	float: right;
	text-align: center;
	color: #000000;
	font-size: 18px;
	z-index: 1030;
	position: absolute;
	top: 414px;
	
	/*scrollbar colors*/
	SCROLLBAR-FACE-COLOR: #FF99CC; 
	SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-ARROW-COLOR: #000000; 
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF;
}

#console{
	height: 563px;
	width: 575px;
	left: 588px;
	margin-left: -294px;
	margin-top: -275px;
	color: #0000000;
	font-size: 16px;
	z-index: 1000;
	position: absolute;
	padding-left: 5px;
	padding-right: 5px;
	overflow: auto; /*automatic scroll bars in console when they become necessary*/
	top: 389px;
	
	/*scrollbar colors*/
	SCROLLBAR-FACE-COLOR: #FF99CC; 
	SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-SHADOW-COLOR: #FFFFFF; 
	SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; 
	SCROLLBAR-ARROW-COLOR: #000000; 
	SCROLLBAR-TRACK-COLOR: #FFFFFF;
	SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF; 
}	

ul.centered{
	list-style-type: none;
	list-style-image: none;
	margin-left: 0;
	padding: 0;
	list-style-position: outside;
	text-align: center;
}

ul.mailing{

}

li{
	list-style-position: inherit;
	list-style-position: outside;
}



h1{
	font-size: 36px;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	font-weight: lighter;
	color: #FF99CC;
	/*background-color: #fdf1f9;*/
	padding-top: 0;
	margin: 0;
}

h2{
	font-size: 24px;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	font-weight: lighter;
	color: #FF99CC;
	background-color: #fdf1f9;
	padding-top: 0;
	margin: 0;
}

h3{
	font-size: 18px;
	font-family: "Times New Roman", Times, serif;
	font-weight: lighter;
	color: #000000;
	background-color: #fdf1f9;
	padding-top: 0;
	margin: 0;
}

h4{
	font-size: 24px;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	font-weight: lighter;
	color: #903;
	background-color: #fdf1f9;
	padding-top: 0;
	margin: 0;
}

h5{
	font-size: 36px;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	font-weight: lighter;
	color: #FF99CC;
	background-color: #fdf1f9;
	padding-top: 0;
	margin: 0;
}


/* box even and box odd are used in alternating fashion down a page */

#box{
	padding: 10px;
	text-align: center;
	z-index: 1000;
}

#box.odd{
	background-color: #FFCCFF;
}

#box.even{
	background-color: #fdf1f9;
}

/* next 4 divs are the overlaying corner images used to round the corners around the accordion widgets, tops are perfect 35 X 35 squares but due to a bug in mozilla firefox and similar browswers the bottom corner images had to be extended to the entire width of the boxes 

b_l_c - bottom left corner, b_r_c - bottom right corner, t_l_c - top left corner, t_r_f - top right corner

*/

#b_l_c{
	height: 35px;
	width: 35px;
	position: absolute;
	z-index: 2000;
	left: 84px;
	top: 653px;
}

#b_r_c{
	height: 35px;
	width: 35px;
	position: absolute;
	z-index: 2000;
	left: 1053px;
	top: 653px;
}

#t_r_c{
	height: 35px;
	width: 35px;
	position: absolute;
	z-index: 2000;
	left: 1053px;
	top: 112px;
}

#t_l_c{
	height: 35px;
	width: 35px;
	position: absolute;
	z-index: 2000;
	left: 84px;
	top: 112px;
}

/* bottom line - bug fix for mozilla and mozillaish browsers 

b_l_l - bottom left line
b_r_l - bottom right line

*/

#b_l_l{
	height: 8px;
	width: 186px;
	position: absolute;
	z-index: 2010;
	left: 85px;
	top: 687px;
}

#b_r_l{
	height: 8px;
	width: 186px;
	position: absolute;
	z-index: 2010;
	left: 902px;
	top: 687px;
}


input.btn{
	background-color: #FFCCFF;
	font-size: 15px;
	color:  #000000;
	border-style: solid;
}

p.console_p{
	background-color: #fdf1f9;
	padding: inherit;
}

img.noBorder{
	border: 0;
}


/* style sheet additions for functionality of spry image gallery  */
#thumbContainer {
    position:absolute;
    left:23px;
    top:127px;
    width:180px;
    height:800px;
    z-index:1;
}
#img_box{
    position:absolute;
    left:476px;
    top:128px;
    width:491px;
    height:315px;
    z-index:2;
}
img.thumbs{
	float:left;
	height:50px;
	width:50px;
	margin-right: 2px;
	margin-bottom: 2px;
	border: solid black 1px;
}



<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid blue;
}

.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*/
visibility: visible;
top: 0;
left: 230px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

/* for image galleries */ 

#thumbContainer {
	position:absolute;
	left:10px;
	top:10px;
	width:72px;
	height:545px;
	overflow: auto;
	z-index:10001;
	border: thin solid #FFCCFF;
	background color: #FFF;
	padding-top: 5px;
	padding-left: 5px;
	text-align: center;
}
#main2 {
	position:absolute;
	left:94px;
	top:50px;
	width:465px;
	height:492px;
	z-index:10002;
/* 	background-image: url(note.jpg);
	background-position: bottom;
	background-repeat:no-repeat;*/
	
}

img.bigImg{
	border: thick black solid;
	width: 460px;
	
}
img.thumbs {
	float:left;
	height:50px;
	width:50px;
	margin-right: 2px;
	margin-bottom: 2px;
	border: solid black 1px;
}

#img_ctrl{
	position:absolute;
	left:105px;
	top:10px;
	width:453px;
	height:39px;
	z-index:2;
	/*border: thin black solid;*/
	text-align: center;
	
}

#bottom{
	position:absolute;
	z-index:1100;
	
	width: 1004px;
	left: 50%;
	margin-left: -502px;
	
	height: 30px;
	text-align: center;
	color: #903;
	font-style: italic;
	top: 698px;
}