/* CSS Document 
Hello, thanks for taking a peek in here. This is my first
website utilizing CSS. I welcome all feedback/comments, so
please feel free to contact me.

Designer: Ruth Cielo
Client: Potted Ladies
Date: March 23, 2009
e-mail: cielo.ruth@gmail.com


*/

#wrap 				{background-image:url(images/portfolio.png);
			  		background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
			  
#about 	  			{background-image:url(images/aboutus.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#pricing 	  		{background-image:url(images/pricing.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#services			{background-image:url(images/services.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#servdescript		{background-image:url(images/servdescript.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#maintenance		{background-image: url(images/maintenance.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#floral				{background-image:url(images/floral.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#garddesign			{background-image:url(images/gdesign.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#home				{background-image:url(images/plhomepage.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#containers			{background-image:url(images/containers.png);
					background-repeat:no-repeat;
			  		background-position: 150px 150px;
			  		text-align:center;}
					
#blog				{background-image:url(images/blog.png);
					background-repeat:no-repeat;
					background-position: 150px 150px;
			  		text-align:center;}
			  

#linklist	
					{position:absolute;
					top: 167px;
					left: 174px;
					font-size: 13px;
					font-weight:normal;
					font-family:Arial, Helvetica, sans-serif;
					width: 66px;
					padding: 10px;
					height: 354px;}
			
#linklist a 		{color:#FFFFFF; 
					text-decoration: none; 
					display: block}
			
#linklist a:hover	{color:#F5D300;}


#aboutus			{font-family:Geneva, Arial, Helvetica, sans-serif;
					font-size:10px;
					position:absolute;
					left: 491px;
					top: 250px;
					width: 228px;
					height: 236px;}
					
#pricingtext		{font-family:Geneva, Arial, Helvetica, sans-serif;
					font-size:10px;
					position:absolute;
					left: 474px;
					top: 180px;
					width: 277px;
					height: 366px;}
					
#contact			{font-family:Geneva, Arial, Helvetica, sans-serif;
					font-size:10px;
					color:#FFFFFF;
					position:absolute;
					left: 311px;
					top: 625px;
					width: 122px;
					height: 45px;}
					
.contact			{font-family:Geneva, Arial, Helvetica, sans-serif;
					font-size:10px;
					color:#FFFFFF;
					position:absolute;
					left: 797px;
					top: 625px;
					width: 122px;
					height: 45px;}
			
					
#subnav				{position:absolute;
					top: 250px;
					left: 318px;
					font-family:Geneva, Arial, Helvetica, sans-serif;					
					font-size: 11px;
					width: 110px;
					padding: 10;
					height: 210px;}
					
#subnav a			{color:#8E0E6A;
					text-decoration:none;
					display:block;}
					
#subnav a:hover		{color:#FFFFFF;}

#subnavserv			{position:absolute;
					top: 274px;
					left: 338px;
					font-family:Geneva, Arial, Helvetica, sans-serif;					
					font-size: 11px;
					width: 110px;
					padding: 10;
					height: 210px;}
					
#subnavserv a		{color:#8E0E6A;
					text-decoration:none;
					display:block;}
					
#subnavserv a:hover	{color:#FFFFFF;}

#imagebox			{position:absolute;
					left: 454px;
					top: 245px;}

.waterfeature		{width:461px;
					 height:288px;}
					 
.details			{width:450px;
					height:283px;}
					




#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background:url(js/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background:url(js/images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }