/*
Title: Animal Magnetism
Copyright: (c) 2006
Author: Dennis J. Fesemyer
Company: Fezlab
Description: Main Site Controls
*/

/* basics
-------------------------------------------------------- */


strong {
   font-weight: bold;
   }

em {
   font-style: italic;
   }

img {
   display: block;
   border: 0;
   }
   
p {
	margin: 0 0 10px 0;
	}
	
	

hr {
   display: block;
	width: 100%;
	height: 1px;
   border: 0; border-top: 1px solid #99993d;
   clear: both;
}

hr.dotted {
   display: block;
	width: 100%;
	height: 1px;
   border: 0; border-top: 1px dotted #99993d;
   margin: 15px 0;
   clear: both;
}

hr.double {
   display: block;
	width: 100%;
	height: 1px;
   border: 0; border-top: 3px double #99993d;
   clear: both;
}


/* typogrpahy
-------------------------------------------------------- */

h1 {
	font: normal 2em/1.6em "Lucida Grande", trebuchet, sans-serif; color: #666600;
	border-bottom: 1px solid #99993d;
	margin: 0 0 20px 0; padding: 0;
	letter-spacing: -.04em
	}
	
h3 {
	font: normal 1.1em/1.1em "Lucida Grande", trebuchet, sans-serif; color: #cc5200;
	margin: 0 0 .2em 0; padding: 0;
	}

blockquote {
	float: right;
	padding: 15px 0 20px 22px;
	border-left: 1px dotted #99993d;
	margin: 10px 0 10px 10px;
	width: 230px;
	width/**/:/**/ 210px;
	background: transparent url(/images/quote.gif) 0 5px no-repeat;
	font: normal 1.5em/1.2em georgia, times, serif; color: #cc5200;
	}
	

/* So my floats work well with each other
-------------------------------------------------------- */

#container:after,
#header:after,
#content:after,
#col-container:after,
#topmodule:after,
form dl:after {
		content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
		}


/* layout
-------------------------------------------------------- */


body {
   background: #999933 url(/images/bg.gif) top left repeat-x;
   font: normal 10px/14px  georgia, times, serif; color: #330000;    
   margin: 0; padding: 0;
   text-align: center;
   width: 100%;
   }


#container {
   margin: 0 auto;
   padding: 0;
   text-align: left;
   width: 740px;
   }
   

/* header
-------------------------------------------------------- */
  
#header {
	width: 740px;
	display: block;
	height: 188px;
	background: transparent url(/images/hdr/home.gif) top left no-repeat;
	}
	
	
		
#logo {
      float: left;
      height: 126px;
      width: 259px;
      }
      
   #logo a {
      background: url(/images/logo.gif) top left no-repeat;
      color: #333;
      display: block;
      height: 126px;
      outline: none;
      text-decoration: none;
      text-indent: -9999px;
      margin-left: 73px;
      width: 259px;
      }

      #logo a:hover {
         text-decoration: none;
         }
         
#topmodule {
	background: transparent url(/images/topmodule.gif) top left no-repeat;
	width: 287px;
	height: 46px;
	float: right;
	padding-right: 105px; margin: 0;
	}
	
	#payme {
      float: left;
      font-size: 1em;
      height: 27px;
      margin: 0;
      padding: 0;
      width: 61px;
      }
      
		#payme a {
			background: url(/images/payme.gif) top left no-repeat;
			margin-left: 43px;
			color: #333;
			display: block;
			height: 27px;
			outline: none;
			text-decoration: none;
			text-indent: -9999px;
			width: 61px;
			}
	
			#payme a:hover {
				text-decoration: none;
				background: url(/images/payme.gif) bottom left no-repeat;
				}
				
   #purchase {
      float: left;
      font-size: 1em;
      height: 34px;
      margin: 0;
      padding: 0;
      width: 80px;
      }
      
		#purchase a {
			background: url(/images/purchase.gif) top left no-repeat;
			margin-left: 26px;
			color: #333;
			display: block;
			height: 34px;
			outline: none;
			text-decoration: none;
			text-indent: -9999px;
			width: 80px;
			}
	
			#purchase a:hover {
				text-decoration: none;
				background: url(/images/purchase.gif) bottom left no-repeat;
				}

	#emailme {
      float: right;
      font-size: 1em;
      height: 26px;
      margin: 0;
      padding-right: 42px;
      width: 81px;
      }
      
		#emailme a {
			background: url(/images/emailme.gif) top left no-repeat;
			color: #333;
			display: block;
			height: 26px;
			outline: none;
			text-decoration: none;
			text-indent: -9999px;
			width: 81px;
			}
	
			#emailme a:hover {
				text-decoration: none;
				background: url(/images/emailme.gif) bottom left no-repeat;
				}
				
.padding {
	padding: 0 30px;
	}
	



/* content areas
-------------------------------------------------------- */ 	
   	
#left {
	float: left;
	width: 155px;
	padding: 0; margin: 0;
	}
	
	#servicenumber {
		margin-top: 25px;
		float: left;
		position: relative;
		width: 155px; height: 104px;
		}
		
		#servicenumber span { 
			position:absolute; 
			width: 155px; height: 104px;
			background: url(/images/calltoschedule.gif ) top left no-repeat;
			}
	
#right {
	float: right;
	width: 585px;
	padding: 0; margin: 0;
	}
	
	#content {
		background: transparent url(/images/content-bg.gif) top left repeat-y;
		padding: 0 30px; margin: 0;
		width: 585px;
		width/**/:/**/ 525px;
		font-size: 1.2em;
		line-height: 1.4em;
		}
		
		#content ul{
		   clear: both;
			margin: 10px;
			padding: 0;
			list-style: none;
			}
			
			#content ul li{
				margin: 3px 0 0 0;
				padding: 0 0 5px 15px;
				background: transparent url(/images/arrow.gif) 0 .5em no-repeat;
				}
			

		
		.content-photo {
			float: right;
			margin: 0 0 20px 20px;
			}
			
		.content-photo-full {
			float: left;
			margin: 0 0 20px 0;
			display: block;
			}
			
			.border {
				border: 1px solid #fff;
				}
		
		#content a {
			text-decoration: none;
			background-color: #ff7d26;
			padding: 1px;
			color: #fff;
			border: none;
			}
			
			#content a:hover {
				text-decoration: none;
				background-color: transparent;
				color: #fff;
				border: none;
				}
				
				#content a:visited {
					text-decoration: none;
					background-color: transparent;
					border-bottom: 1px dotted #767513;
					color: #767513;
					}
					
		#content a.none{
			text-decoration: none;
			background-color: transparent;
			border: none; outline: none;
			}
					
		#col-container {
			background: transparent url(/images/col-border.gif) 261px 0 repeat-y;
			height: 1%;
			width: 525px;
			margin: 15px 0 0 0;
			} 
			
		
			#col1 {
				background-color: transparent;
				float: left;
				padding: 0 10px 0 0;
				width: 260px;
				width/**/:/**/ 250px;
				}
			
			#col2 {
				background-color: transparent;
				float: right;
				padding: 0 0 0 15px;
				width: 260px;
				width/**/:/**/ 245px;
				}
			

		#cap {
			background: transparent url(/images/home-bottom.gif) top left no-repeat;
			height: 64px;
			width: 585px;
			}

.buynow {
   padding: 5px 0 0 0;
   }
   
/* gallerytable
-------------------------------------------------------- */

#gallerytable {
	margin: 10px 0;
	padding: 0;
	}
	
	#gallerytable td {
		width: 175px;
		text-align: center;
		padding: 22px;
		margin: 0;
		border: 1px solid #d8d874;
   	background-color: transparent;
		}

		#gallerytable td:hover {
         background-color: #98983c;
         }	
         
         #gallerytable a {
            padding: 0;
            background-color: transparent;
            }
			

/* form
-------------------------------------------------------- */

			
dl { 
	padding: 0 0 0 15px; 
	margin: 0;
	clear: both;
}

dt { 
	width: 150px;
	text-align: left;
	float: left; 
	padding: 0px; margin: 0px;
}

dd { 
	width: 280px;
	float: left; 
	text-align:left;
	margin: 0px;
	padding: 0 0 12px 0;
}

dd input.text, dd textarea, dd input.image {
   padding: 4px; 
	text-align:left;
   vertical-align:top;
	width: 280px;
	width/**/:/**/ 272px;
	border: 1px solid #99993d;
	font: 10px Arial, Verdana, sans-serif; color: #330000; 
}


table.misc {
   margin: 0;
   padding: 10px;
   }
   
   table.misc td {
      text-align: center;
      padding: 5px 10px;
      }


/* footer
-------------------------------------------------------- */

#footer {
   clear: both;
   font: normal 10px arial, verdana, sans-serif; color: #ff7d26;
   background: #6d3500 url(/images/footer-bg.gif) top left repeat-x;
   height: 46px;   
   margin-top: 5px;  
   text-align: center;   
   }
   
   #footer p {
   	padding: 10px 0 0 0;
   	margin: 0;
   	}


#footer a {
   font: normal 10px arial, verdana, sans-serif; color: #ff7d26;
   text-decoration: none;
   }

#footer a:hover {
   text-decoration: underline; color: #fff;
   text-decoration: none;
   }








