/* EXTERNAL STYLE SHEET FOR THE PETERBOROUGH AND KAWARTHAS CHAPTER OF THE COUNCIL OF CANADIANS */

body 
{
	margin: 0 auto;
	background: url("images/bg.gif") repeat;
	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
	font-size: 12px;	
} 
#header, #header-home, #mid, #bottom, #bottom-home 
{
	margin: 0 auto;
	width: 773px;	
}
#header
{
	margin: 0 auto;
	background: url("images/headerbg.gif") no-repeat;
	height:	297px;
}
#header-home
{
	background: url("images/headerbg.jpg") no-repeat;
	height:	297px;
}	
#mid
{
	background: url("images/midbg.gif");
	background-repeat: repeat-y;
	
}
#bottom, #bottom-home 
{
	background: url("images/bottombg.gif");
	background-repeat: no-repeat;
	height: 342px;
	position: relative;
	bottom: 180px;
}
#bottom-home
{
	position: relative;
	bottom: 340px;	
}
#content, #content-home
{
	margin: 0 auto;
	width: 500px;	
	position: relative;
	bottom: 210px;
	left: 70px;
}
#content-home
{
	position: relative;
	bottom: 380px;
}
#footerinfo, #footerinfo-home
{
	margin-left: 200px;
	width: 500px;
}
.inset10
{
margin-left: 10px;
}
p 
{
	line-height: 1.5em;
}
h1
{
	font-size: 18px;
}
h2
{
	font-size: 15px;
}
h3
{
	font-size: 13px	
}
/* ==============<'BACK TO TOP' BUTTON>============== */
/* multiple divs used for pages where there are more than 1 topbutton (using class doesn't work in IE 6) */
a#topbutton, a#topbutton2, a#topbutton3  
{
	display: block;
	width: 100px;
	height: 60px;	
	background-image: url(images/CoC_top.gif);
	background-repeat: no-repeat;
	margin-top: 30px;
}
a#topbutton:hover, a#topbutton2:hover, a#topbutton3:hover
{
	background-image: url(images/CoC_top.gif);
	background-position: left bottom;
}	
/* ==============</'BACK TO TOP' BUTTON>============== */

/* ==============<'VISIT THE NATION COUNCIL OF CANADIANS' BUTTON>============== */
a#natbutton 
{
	position: relative;
	top: 48px;
	right: 12px;
	display: block;
	width: 150px;
	height: 170px;	
	background-image: url(images/national_button.gif);
	background-repeat: no-repeat;	
	margin-left: 12px;
}
a#natbutton:hover
{
	background-image: url(images/national_button.gif);
	background-position: left bottom; 
}	
/* ==============</'VISIT THE NATION COUNCIL OF CANADIANS' BUTTON>============== */

/* ==============<ANCHORS>=============== */
a:link 
{
	color: #891A18;
	background: white;
}
a:visited 
{
	color: #666633;
	background: white;     
}
a:hover 
{
	color: #666633;
	background: white;
	text-decoration: none;
}
a:active
{
	color: #891A18;
	background: white;
}

/* ==============</ANCHORS>=============== */

/* ===============<LISTS>================ */
ul
{
	margin-top: -8px;	
}
ul ul
{
 margin-top: 8px;	
}
li
{
 line-height: 150%;	
}
ol li
{
	list-style-type: upper-alpha
}
ol ul
{
	margin-top: 6px;
	margin-bottom: 8px;	
}
ol ul li
{
 list-style-type: disc;	
}
ol ul ul li
{
	list-style-type: circle;	
}
.leaf
{
  list-style-image: url(images/leaf.gif);  	
}
.arrow
{
  list-style-image: url(images/arrow.gif);	
}

/* ===============</LISTS>=============== */

/* =================<CAMPAIGNS PAGE AND SUB-PAGES>======================= */
.introright
{
	float: right;
	position: relative;
	bottom: 100px;
	width: 340px;	
}
.introleft
{
	position: relative;
	bottom: 76px;
	width: 500px;
	clear: both;
}
/* ===================</CAMPAIGNS PAGE AND SUB-PAGES>==================== */

/* =========================<IMAGE DIVS>======================= */
.image
{
	width: 193px;
	height: 150px;
	margin-left: 140px;
	position: relative;
	top: 26px;
}
.image0
{
	position: relative;
	bottom: 12px;
	left: 20px;
	float: right;
	margin: 10px;	
	width: 193px;
	height: 150px;
}
.image1
{
	margin-top: 30px;
	margin-bottom: -10px;	
	width: 132px;
	height: 102px;
}
.image2
{
	margin-top: -50px;
	margin-bottom: -10px;
	width: 132px;
	height: 102px;
}
.image3
{
	position: relative;
	bottom: 10px;
	left: 20px;
	height: 270px;
	width: 360px;
}
.image4
{
	height: 228px;
	width: 420px;
	margin: 20px 0 50px 40px;
}
.eventphotos
{
	margin: 0 auto;
	width: 400px;
	position: relative;
	top: 26px;
	right: 10px;			
}
.photo-credit
{
	position: relative;
	bottom: 10px;
	font-size: 10px;
	line-height: 1.2em;
}
/* =====================</IMAGE DIVS>======================= */

/* ===============<MAIN (VERTICAL) NAVIGATION BAR>================= */

/* ====<1 div background for the navigation menu for every page in the site>====== */
#homenav, #aboutnav, #newsnav, #campaignsnav, #eventsnav, #contactnav, #linksnav, #errornav
{
	width: 181px;
	height: 253px;
	position: relative;
	left: 0px;
	top: 137px;	
	margin: 0px;
	padding: 0px;
}
#errornav
{
  background: url("images/naverror.gif") no-repeat;	
}
#homenav 
{
	background: url("images/nav_home.gif") no-repeat;
}
#aboutnav
{
	background: url("images/navabout.gif") no-repeat;
}
#newsnav
{
	background: url("images/navnews.gif") no-repeat;
}
#campaignsnav
{
	background: url("images/navcampaigns.gif") no-repeat;
}
#eventsnav
{
	background: url("images/navevents.gif") no-repeat;
}
#contactnav
{
	background: url("images/navcontact.gif") no-repeat;
}
#linksnav
{
	background: url("images/navlinks.gif") no-repeat;
}

/* ====<white image placed to hide some of the green nav bg when page lengthens>==== */
#whitepatch
{
	width: 15px;
	height: 84px;
	position: relative;
	left: 154px;
	top: 10px;
	margin: 0px;
	padding: 0px;	
}

/* =========<classes work in conjunction with the javascript readmap() and nav_over.gif for menu rollovers>========= */

.links
{	
	background: url("images/navover.gif") -1267px 0px no-repeat;
}
.contact
{
	background: url("images/navover.gif") -1086px 0px no-repeat;
}
.events 
{
	background: url("images/navover.gif") -905px 0px no-repeat;
}
.campaigns 
{
	background: url("images/navover.gif") -724px 0px no-repeat; 
}
.news
{
	background: url("images/navover.gif") -543px 0px no-repeat;
}
.about
{
	background: url("images/navover.gif") -362px 0px no-repeat; 	
}
.home 	
{
	background: url("images/navover.gif") -181px 0px no-repeat;	
}
.navbase
{
 	background: url("images/navover.gif") top left no-repeat; 	
}
/* ===============</	END MAIN NAVIGATION>=============== */

/* =====<HORIZONTAL NAVIGATION FOR CAMPAIGNS PAGE, SUB-PAGES AND ABOUT US PAGE>===== */

#horiznav
{
	width: 577px;
	position: relative;
	top: -126px;
	left: 196px;
}
#horiznavlist
{
	margin: 0;
	padding: 0 0 0 10px;
	border-top: 1px solid #000000;
}
#horiznavlist ul, #horiznavlist li
{
	margin: 0;
  padding: 0;
	display: inline;
	list-style-type: none;
}
#horiznavlist a:link, #horiznavlist a:visited
{
	float: right; 
	padding: 6px 5px 5px 5px;
	line-height: 14px;
	font-weight: bold;
	margin: 0 6px 0 6px;
	text-decoration: none;
	color: #666633;
	background: white;
}
#horiznavlist a:link#current, #horiznavlist a:visited#current, #horiznavlist a:hover
{
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black; 	  
  padding: 6px 4px 4px 4px;
	color: #FEE004;
	background: #2F421B;


}
#horiznavlist a:hover 
{ 
	color: #FEE004;
	background: #2F421B;

}

/* =====</END HORIZONTAL NAVIGATION FOR CAMPAIGNS PAGE AND SUB-PAGES>===== */
/* for controlling which divs are accessible for a given device (e.g. print vs screen) */ 
#skip, .print-only
{
	display: none;	
}
/* ================<DEFINITION LIST FOR EVENTS PAGE>=================== */
 dl.event
{
	margin: 1em 0;
	padding: 0;
	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
}
.event dt
{
	position: relative;
	right: 10px;
	top: 2.2em;
	width: 5em;
	font-weight: bold;
}
.event dd
{
	border-left: 1px solid #000000;
	margin: 0 0 0 6em;
	padding: 0 0 .5em .5em;
}
/* ================</DEFINITION LIST FOR EVENTS PAGE>=================== */

/* =================<FOOTER CREDIT ON HOME PAGE>======================== */
#design
{
	display: block;
	position: relative;
	top: 172px;
	font-size: 0.75em;
	text-align: center;
	color: black;
	background: #2F421B;	
}
#design a:link
{
	color: black;
	background: #2F421B;
	text-decoration: none;		
}
#design a:visited 
{
	color: black;
	background: #2F421B;     
	text-decoration: none;
}
#design a:hover
{
	color: black;
	background: #2F421B;  
	text-decoration: underline;
}
#design a:active
{
	color: black;
	background: #2F421B;
}
/* =================<FOOTER CREDIT ON HOME PAGE>======================== */

/* ========<FORCE SCROLL BAR ON SHORT PAGES TO PREVENT PIXEL SHIFT IN FIREFOX>======== */
html 
{
	min-height: 100%; 
	margin-bottom: 1px; 
}