/*              Welcome to 'The Piercing bodz'                            */
/*copyright carl mairs 2007.                                       */

/* PLEASE DO NOT CHANGE THIS. Internet explorer can't work properly without it*/
body
{
  	border:0;
  	padding:0;
  	height:100%;
	width:100%;
	background-color:#e8f6e6;
	background-image:url(../graphics/topcenter.jpg);
	background-position:top left;
	background-repeat:repeat-x;
	font-family:verdana, sans-serif;
    margin: 0 ; /* to avoid margins */
  	overflow: hidden;
    text-align: center; /* to correct the centering IE bug*/

}/* PLEASE DO NOT CHANGE THIS. Internet explorer can't work properly without it*/


/*  You can change ALL the following......BE VERY CAREFUL< PLEASE*/

/*    FONT STYLES          */

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 10000;
	text-align: center;
	line-height: 0;
	}

#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: 1000;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

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


#imageDataContainer{
	font-size: 10px;
	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;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9000;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
	
	
#content a {
	font-size:12px;
	}


#content h1 {
	font-weight: bold; 
	font-size:1em;
	color:#66cc66;
	background:#001d00;
	text-align:left;
}

#content h2 {
	font-size:14px;
	font-weight:600;
	text-align:center;
	text-indent:0.5em;
	color:#003300;
}

#content h3 {
	font-size:14px;
	font-weight:600;
	text-align:left;
	color:#003300;
}

#content h4 {
	font-size:12px;
	text-align:left;
	color:#003300;
} 

h5 {
	font-size:14px;
	font-weight:normal;
	text-align:justify;
	}

#content p {
	text-indent:1em;
	font-size:12px;
	text-align:left;
	color:#001b00;
	background:transparent;
	padding:5px;
}


#footer p {
	font-size:10px;
	text-align:left;
	text-indent:0.5em;
	color:#cccccc;
}


#content a, #footer a {
	color:#001b00;
}

#content a:hover, #footer a:hover {
	color:#003300;
}



#content li {
	font-size:12px;
	font-family:verdana, sans-serif;
	text-align:left;
	color:#001b00;
}

#content dt {
	font-size: 0.8em;
	text-align:left;
	color:#003300;
}

#content dd {
	font-size: 0.8em;
	text-align:left;
	color:#001b00;
}

#mobiledevices p{
	text-indent:1em;
	font-size:10px;
	font-weight:200;
	text-align:left;
	color:#001b00;
	background:transparent;
	padding:5px;
}

.floatr {
  float:right;
  margin: 2px;
  padding: 2px;
  clear:left;
  border:1px solid #669966;
  }

.floatl {
  float:left;
  margin: 2px;
  padding: 2px;
  clear:right;
  border: 1px solid #669966;
  }

.floatlboth {
  float:left;
  margin: 2px;
  padding: 2px;
  clear:both;
  }

.floatlbothb {
    float:left;
  margin: 2px;
  padding: 2px;
  clear:both;
  border:1px solid #669966;
  }

.floatrboth {
  float:right;
  margin: 2px;
  padding: 2px;
  clear:both;
  border:1px solid #669966;
  }

.floatlb {
  float:left;
  margin: 2px;
  padding: 2px;
  border: 1px solid #669966;
  }


#content li {
	font-size:12px;
	text-align:left;
	color:#001b00;
}





.green {
	background:#001d00;
	text-align:left;
	}

/*      Top Banner       */
#header {
  	position:absolute; 
  	left:5%;
	top:3%;
  	width:449px; 
  	height:108px;
	z-index:20;
  }
  
 #topleft{
	position:absolute;
	top:0px;
	left:0px;
	height:94px;
	width:131px;
	background-image:url(../graphics/topleft.jpg);
	background-position:top left;
	background-repeat:no-repeat;
	z-index:10;
	}
 #topright{
	position:absolute;
	top:0px;
	right:0px;
	height:101px;
	width:143px;
	background-image:url(../graphics/topright.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	z-index:10;
	}
 #bottomleft{
	position:absolute;
	bottom:0px;
	left:0px;
	height:211px;
	width:98px;
	background-image:url(../graphics/bottomleft.jpg);
	background-position:bottom left;
	background-repeat:no-repeat;
	z-index:10;
	}
	
#bottomright {
	position:absolute;
	bottom:0px;
	right:0px;
	width:88px;
	height:83px;
	background-image:url(../graphics/bottomright.jpg);
	background-position:bottom right;
	background-repeat:no-repeat;
	z-index:10;
}

 #bottomcenter {
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	height:23px;
	background-image:url(../graphics/bottomcenter.jpg);
	background-position:bottom;
	background-repeat:repeat-x;
	z-index:5;
	}
 #leftcenter {
	position:absolute;
	bottom:0px;
	left:0px;
	height:100%;
	width:21px;
	background-image:url(../graphics/leftcenter.jpg);
	background-position:left;
	background-repeat:repeat-y;
	z-index:5;
	}
	
#rightcenter {
	position:absolute;
	bottom:0px;
	right:0px;
	height:100%;
	width:34px;
	background-image:url(../graphics/rightcenter.jpg);
	background-position:left;
	background-repeat:repeat-y;
	z-index:5;
	}
	
/*        Bottom banner         */
#footer {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:16px;
	z-index:60;


}

/*          The box the main content is in        */
#content {
  	position:fixed;
	padding:5px;
	padding-right:45px;
  	top:180px;
  	bottom:40px;
  	left:100px;
  	right:8px;
	max-width:850px;
  	overflow:auto;
  	z-index:600;
	border:none;
  }




/*       This code turns an unordered list into a menu         */
/*  DO NOT CHANGE ANY OF THE POSITION SETTINGS (absolute,relative,fixed etc.) as the menu simply won't work       */ 


.menu{
position:absolute;
top:130px;
left:20%;
font-weight:bold;
font-size:11px;
font-family: verdana, arial;
z-index:1000;
border:1px solid #003300;
background-color:#a4da9a;
}

.menu a {
font-family: verdana, arial;
}

.menu:after{
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.menu ul{
border:none;
padding: 4px;
margin: 4px;
text-align: center;
border:none;
}

.menu ul li{
display: inline;
padding-right:4px;
}

.menu ul li a{
color: #000000;
padding-right: 6px;
margin-right: 4px;
text-decoration: none;
border-right: none;
}

 
.menu ul li a.selected{ 
background-color:#a4da9a;
padding-right:6px;
color:#336633;
}

.menu ul li a:hover {
	background-color:#a4da9a;
	padding-right:6px;
	color:#ffffff;
}

/* Style for Drop Down Menu */

.dropmenu{
position:absolute;
top: 0;
border:1px solid #003300;
border-bottom-width: 0;
font-family:verdana, arial;
font-size: 12px;
font-weight:bold;
line-height:18px;
text-align:left;
z-index:1000;
background-color: #a4da9a;
width: 200px;
visibility: hidden;

}


.dropmenu a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #003300;
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: #001b00;
}

* html .dropmenu a{
width: 100%;
}

.dropmenu a:hover{
background-color: #a4da9a;
color:#ffffff;
}

.dropmenu a:active{ 
background-color: #66cc66;
color:#003300;
}

.dropmenu a.selected{
	color:#336633;
	background-color:#a4da9a;
}


.rightimg {
	margin:10px;
	padding:5px;
	float:right;
	border:1px solid #003300;
	background-color:#a4da9a;
	clear:right;
	}

.leftimg {
	margin:10px;
	padding:5px;
	float:left;
	border:1px solid #003300;
	background-color:#a4da9a;
	clear:left;
	}

#content .rightimg p{
	text-indent:0em;
	text-align:center;
	color:#003300;
	font-weight:500;
	margin-top:5px;
	margin-bottom:0px;
	padding:0;
	}
	
#content .leftimg p{
	text-indent:0em;
	text-align:center;
	color:#003300;
	font-weight:500;
	margin-top:5px;
	margin-bottom:0px;
	padding:0;
	}
	
#content li{
	list-style:none;
	}
	
#content hr {
		width:80%;
		color:#001b00;
		background-color:#a4da9a;
		height:3px;
		}

form {
	
	width: 100%;

	
}


.col1 {
	text-align:right;
	width:30%;
	height: 31px;
	margin: 0;
	float: left;
	margin-right: 2px;
	background:none;
	font: 100 0.90em verdana;
	text-indent:0.5em;
	color:#001d00;

}

.col2 {
	width:30%;
	height: 31px;
	display: block;
	float: left;
	margin: 0;
	background:none;
	font: 100 0.90em cursive;
	text-indent:0.5em;
	color:#001d00;
}

.col2comment {
	width: 30%;
	height: 98px;
	margin: 0;
	display: block;
	float: left;
	background: none;
		font: 100 0.85em cursive;
	text-indent:0.5em;
	color:#001d00;
}

.col1comment {
	text-align:right;
	width:30%;
	height: 98px;
	float: left;
	display: block;
	margin-right: 2px;
	background: none;
		font: 100 0.90em cursive;
	text-indent:0.5em;
	color:#001d00;
}

div.row {
	clear: both;
	width: 100%;
}

.submit {
	height: 29px;
	width: 100%;
	background: none;
	padding-top: 5px;
	clear: both;
	
} 

.input {
	background: none;
	font: 100 0.90em cursive;
	text-indent:0.5em;
	color:#001d00;
	margin: 4px 0 5px 8px;
	padding: 1px;
	border: 1px solid #001b00;
}

.textarea {
	border: 1px solid #001b00;
	background:none;
	font: 100 0.90em cursive;
	text-indent:0.5em;
	color:#001d00;
	margin: 4px 0 5px 8px;
}	
	
.clear	 {
clear:both;
}

#title{
	font-family: verdana, sans-serif;
	font-size:16px;
	font-weight:300;
	text-align:left;
	color:#ffffff;
	background:#001b00;
	padding:2px;
	} 
	
object
   {
	position:relative;
    width:100%; 
	height:95%;
	overflow:visible;

   }
   
#footer a {
	font-size:10px;
	font-family:verdana, arial;
	font-weight:100;
	}
	
/*That's it. Hope you enjoy your new css website.... Don't forget to back up regularly or you stand the chance of having me deride you when you ask me for another copy. Only kidding. Enjoy.                                       */


			/*Carl*/

/*   If you need help................HOLLER                            */