/* CSS Document */
body{ background-color:#000000;}

.style3{ font-family:Comic Sans MS; font-style:italic; font-size:14pt; color:#FFFFFF;}

.style4{ color:#FFFFFF; font-family:Comic Sans MS;}

a:link{ color:#FFCC99; text-decoration:none;}

a:visited{ text-decoration:none; color:#FFCC99;}

a:hover{ text-decoration:underline; color:#FFFFCC;}

a:active{ text-decoration:underline; color:#FFFFCC;}

.txt{ font-family:Verdana, Tahoma, Arial, Helvetica; font-size:11px; color:#FFCCCC; font-weight:normal;}

.h1{ font-family:Comic Sans MS, Verdana, Tahoma, Arial, Helvetica; font-size:13px; color:#FFFFCC;}

.h2{ font-family:Comic Sans MS, Verdana, Tahoma, Arial, Helvetica; font-size:12px; color:#FF6666; font-weight:normal;}

.h3{ font-family:Comic Sans MS, Verdana, Tahoma; font-size:12px; color:#FF6699;}

.main{ background-color:#000000; border-right-width:thin; border-left-width:thin; border-right-style:solid; border-left-style:solid; border-right-color:#663300; border-left-color:#663300; border-bottom-width:thin; border-bottom-style:ridge;	border-bottom-color:#663300; padding:0px; border-top-style:none; width:751px; background-image:url(http://www.poipassion.co.uk/images/bg.jpg); background-repeat:no-repeat; text-align:left;}

.pic{ border:thin ridge #660000; background-color:#000000; padding:0px; margin:0px; font-family:Verdana, Tahoma, Arial, Helvetica; font-size:12px; color:#FFFFCC;}

.pic2{ border:thin ridge #663300; background-color:#000000; padding:0px; margin:0px;}

.content{ padding:5px 10px; font-family:Verdana, Tahoma, Arial, Helvetica; font-size:11px; color:#FFCCCC; text-align:left;}

.blank { margin:0px;}

.links { padding:5px 3px; font-family:Comic Sans MS, Verdana, Tahoma; font-size:13px; border:none; width:100%; top:0px; text-align:left;}

.head { padding:0px; width:100%; border:none; height: 170px;}

.credit { FONT-SIZE:8px; COLOR:#CCCCCC; font-family:Verdana, Tahoma, Arial, Helvetica; font-style:normal; padding-left:5px; padding-right:5px; padding-bottom:3px; font-weight:normal; padding-top: 3px; border:thin ridge #663300;}

.vimeo{ width:410px; height:245px; padding:5px; border:1px solid #660000; margin:0 auto 0 auto;}
.video{ width:435px; height:354px; padding:5px; border:1px solid #660000; margin:0 auto 0 auto;}

.photoca{ width:490px; height:370px; margin:0 auto 0 auto;}

.tube480{ width:480px; height:385px; margin:0 auto 0 auto; border:1px solid #660000; padding:5px;}

.fr{ float:right; margin:0 0 5px 10px;}

.style31 { font-family:Comic Sans MS; font-size:10pt; font-weight:bold;}
.style32 { font-family:Comic Sans MS; font-size:13px; font-weight:normal;}
.style35 {font-family:Comic Sans MS; color:#FF0000; font-size:18pt;}
.style36 {color:#00FF00;}

.pale{ color:#FFFFCC;}

.thumbl{ width:140px; height:140px; float:left; background-color:#000000;}

img.pp480x360{ width:480px; height:360px; border:1px solid #660000; padding:5px;}
img.pp360x480{ width:360px; height:480px; border:1px solid #660000; padding:5px;}
img.pp480x248{ width:480px; height:248px; border:1px solid #660000; padding:5px;}
img.pp200x267{ width:200px; height:267px; border:1px solid #660000; padding:5px;}
img.pp267x267{ width:267px; height:267px; border:1px solid #660000; padding:5px;}
img.pp396x267{ width:396px; height:267px; border:1px solid #660000; padding:5px;}
img.pp397x267{ width:360px; height:270px; border:1px solid #660000; padding:5px;}
img.pp180x240{ width:180px; height:240px; border:1px solid #660000; padding:5px;}
img.pp240x320{ width:240px; height:320px; border:1px solid #660000; padding:5px;}
img.pp120x120{ width:120px; height:120px; border:1px solid #660000; padding:5px;}
img.pp120x75{ width:120px; height:75px; border:0; margin:15px 0 0 15px;}
img.pp240x358{ width:240px; height:358px; border:1px solid #660000; padding:5px;}
img.pp240x240{ width:240px; height:240px; border:1px solid #660000; padding:5px;}
img.pp240x180{ width:240px; height:180px; border:1px solid #660000; padding:5px;}
img.pp240x180fl{ width:240px; height:180px; border:1px solid #660000; padding:5px; float:left; display:block; margin:5px;}
img.pp240x180fr{ width:240px; height:180px; border:1px solid #660000; padding:5px; float:right; display:block; margin:5px;}

/* lightbox CSS */

#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(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../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; }

/* end of lightbox CSS */