* {margin: 0; padding: 0;}

/* Primary layout */

body {
	font: 0.7em Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	margin: 0;
	padding: 0;
	text-align: center;
	background: #FFF;
}

#wrap {
	width: 800px;
	margin: 20px auto 20px auto;
	padding: 0;
	text-align: left;
	color: #333;
	background: #FFF;
}

#header { 
	width: 800px;	
 	height: 83px;
	margin: 15px auto 14px auto;
	padding: 0;
	text-align: left;
}

#navcontainer {
	width: 798px;
	margin: 0 auto 0 auto;
  	padding: 2px 0 2px 0;
	background: #FFF url(../images/nav_bkgrd.gif) top left repeat-x;
  	border: 1px solid #CCC;
}

#wrapper {
	width: 800px;
	margin: 0 auto 0 auto;
	padding: 0;
	border: 0;
	color: #333;
	background: #fff url(../images/border.gif) repeat-y;
}

#content {
	float: left;
	width: 560px;
	min-height: 500px;
	overflow: hidden;
	display: inline;
	text-align: left;
	padding: 15px 0 0 0;
	border: 0;
	margin: 0 0 0 15px;
	line-height: 140%;
	background: transparent;
	height: 100%;
}

#sidebar {
	margin: 0 0 0 604px;
	padding: 30px 15px 0 0;
	text-align: left;
	border: 0;
	line-height: 140%;
	height: 100%;
} 

#wrapper-footer {
	clear: left;
	width: 800px;
	margin: 0 auto 0 auto;
	padding: 15px 0 0 0;
	text-align: left;
}

#footer {
	width: 798px;
	height: 25px;
	margin: 0 auto 10px auto;
	padding: 0;
	font-size: 0.9em;
	text-align: center;
	background: #FFF url(../images/nav_bkgrd.gif) top left repeat-x;
	border: 1px solid #CCC;
}



/* General Typography */

p {
	margin: 0 0 1em 0;
	padding: 0;
	line-height: 1.6em;
	text-align: center;
}

h1, h2, h3, h4 {
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
	color: #522380;
	background: #FFF;
}

a, a:link, a:visited {color: #5c2484; text-decoration: underline; background: #FFF;}

a:hover {color: #666; text-decoration: underline; background: #FFF;}

img {border: none;}

em {font: italic 96%/1.4em Georgia, "Times New Roman", Times, serif; letter-spacing: 1px;}

.dropcap {
	float: left;
	margin: -0.08em 0.1em -0.1em 0;
	font-weight: normal;
	color: #4D4940;
	background: #FFF;
	font: 3.6em Georgia, "Times New Roman", Times, serif;
}

.italic {font-style: italic;}

input {margin: 20px 0 20px 0;}



/* Logo and Header Pieces */

#header h1 {text-indent:-9999px;}

#header h1 a {
	display: block;
	width: 202px;
	height: 83px;
	float: left;
	overflow: hidden;
	background: transparent url(../images/logo.gif) 0 0 no-repeat;
}

/* Commented Backslash Hack
   hides rule from IE5-Mac \*/
#header h1 a {float: none;}
/* End IE5-Mac hack */

#header h1 a:hover {background-position: -202px 0;}



/* Top Navigation */

#topnav {
	margin: 0;
  	padding: 0;
  	border-top: 1px dotted #bababa;
	border-bottom: 1px dotted #CCC;
  	font: 14px "Times New Roman", Times, serif; 
	overflow: hidden;
	letter-spacing: 0;
}

#topnav li {
	list-style: none;
	float: left; 
	padding: 0 16px 0 0; 
	margin-left: 15px;
  	background: transparent url(../images/nav_bullet.gif) 100% 53% no-repeat;
}

#topnav li a {
	display: block; 
	padding: 7px 0 5px 0;
  	text-transform: uppercase;
	text-decoration: none;
	background: none; 
	color: #666;
}

#topnav #contact {color: #666; background: none; padding: 0;}

#topnav #meetpiggers {background: url(../images/nav_bullet.gif) 100% 53% no-repeat;}

#topnav a:hover,
  .meetpiggers #topnav #meetpiggers a,
  .about #topnav #about a,
  .mission #topnav #mission a,
  .piggerspals #topnav #piggerspals a,
  .donations #topnav #donations a, 
  .resources #topnav #resources a,
  .contact #topnav #contact a { 
	color: #5c2484;
	text-decoration: none;
	background: none;
}



/* Sidebar Pieces */

#sidebar p {padding-bottom: 1.5em; border-bottom: 1px dotted #CCC;}
#sidebar h2 {font-size: 1.5em; padding-bottom: 0.7em; color: #444; background: #FFF;}

#sidebar ul {
	margin-bottom: 1em;	
	padding-bottom: 1em;
	border-bottom: 1px dotted #CCC;
}

#sidebar li {
	list-style-type: none;
	padding-bottom: 0.5em;
}

#sidebar a, #sidebar a:link, #sidebar a:visited,
#sidebar a:active, #sidebar a:hover {text-decoration: none;}



/* Content layout style 1 (main layout) */

.column1 {padding: 0; margin: 0; border: 0; color: #333; background: #FFF;}

.column1 p {line-height: 1.8em; text-align: left;}
.column1 h2 {font-size: 1.8em; line-height: 1.1em; font-weight: bold; margin: 0.5em 0 0.5em 0;}
.column1 h3 {font: bold 0.8125em Verdana, sans-serif; text-transform: uppercase; letter-spacing: 2px; color: #9075bc;  margin-bottom: 1em;}

.column1 h4 {font: bold 0.8125em Verdana, sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #9075bc;}
.column1 h4 a, .column1 h4 a:link, .column1 h4 a:visited {letter-spacing: 1px; margin-bottom: 0; text-decoration: none;}
.column1 h4 a:hover, .column1 h4 a:active {margin-bottom: 0; text-decoration: none;}

.column1 img {display: block; border: 0;}



/* Content layout style 2 (purple background layout) */

.column2 {padding: 10px; margin: 0; border: 0; background: #b2b2d9; color: #001;}

.column2 p {margin: 0.7em 0 0 0; padding: 0; line-height: 1.6em; text-align: left;}
.column2 img {display: block; border: 0;}



/* Content layout style 3 (dotted top/bottom borders layout) */

.column3 {min-height: 240px; padding: 10px 0 10px 0; margin: 0; border: 0; color: #333; background: #FFF; border-top: 1px dotted #CCC;}

.column3 p {line-height: 1.8em; text-align: left;}
.column3 h2 {font-size: 1.8em; line-height: 1.1em; font-weight: bold; margin: 0.5em 0 0.5em 0;}
.column3 h3 {font: bold 0.8125em Verdana, sans-serif; text-transform: uppercase; letter-spacing: 2px; color: #9075bc;  margin-bottom: 1em;}

.column3 h4 {font: bold 0.8125em Verdana, sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #9075bc;}
.column3 h4 a, .column3 h4 a:link, .column3 h4 a:visited {letter-spacing: 1px; margin-bottom: 0; text-decoration: none;}
.column3 h4 a:hover, .column3 h4 a:active {margin-bottom: 0; text-decoration: none;}

.column3 img {display: block; border: 0;}



/* Content area footer */

.column-footer {clear: both; padding: 15px 0 10px 0; text-align: center; border-top: 1px dotted #CCC;}
.column-footer h4 {font: bold 0.8125em Verdana, sans-serif; text-transform: uppercase; letter-spacing: 1px; color: #9075bc;}
.column-footer h4 a, .column-footer h4 a:link, .column-footer h4 a:visited {text-decoration: none;}
.column-footer h4 a:hover, .column-footer h4 a:active {text-decoration: none;}



/* Footer pieces */

#footer p {
	margin: 0;
	padding: 5px 15px 0 15px;
	color: #666;
	background: transparent;
}

#footer a, #footer a:link, #footer a:visited {
	color: #5c2484;
	text-decoration: none;
	background: transparent;
}

#footer a:hover {
	color: #666;
	text-decoration: none;
	background: transparent;
}



/* Misc */

.p-first {margin-top: 1em}

.p-nomargin{margin: 0;}

.h-first {margin-top: 1em;}

.text-darkpurple {color: #522380;}

.copyright {padding-right: 1em;}

.years {font: 1.2em Georgia, "Times New Roman", Times, serif;}

.right {float: right;}

.left {float: left;}



/* Photos and illustration rules */

.illustration1 {float: left; margin: 7px 15px 5px 0; line-height: 1.6em}
.illustration2 {float: left; margin: 7px 15px 5px 0; line-height: 1.6em}
.right {float: right; margin: 7px 0 5px 15px;}
.full {float: none; width: 540px; margin: 0;}
.half {width: 270px;}
.third {width: 180px;}
.quarter {width: 135px;}

.illustration1 p {
	font: italic 95%/1.4em Georgia, "Times New Roman", Times, serif;
	text-align: center;
	color: #333;
	margin: 0; 
	padding: 2px;
	background: transparent;
	border-bottom: 1px dotted #ccc;
}

.illustration2 p {
	font: italic 95%/1.6em Georgia, "Times New Roman", Times, serif;
	text-align: center;
	color: #333;
	margin: 0; 
	padding: 2px;
	background: transparent;
	border-bottom: 1px dotted #666;
}

.illustration a, .illustration a:link, 
.illustration a:visited {display: block; border: 1px solid #ccc;}
.illustration a:hover, .illustration a:active {border: 1px solid #807E6E;}
