/* Body. Set page margin/padding/bg here. Leave text-align=center alone. */
body {
	margin:0;
	padding:0;
	font-size: 13px;
	font-family: Verdana, Tahoma, Helvetica, Arial, sans-serif;
	background: url(/cpix/layout/v2/hg_bkg.jpg);
	color: #c0c0c0;
	text-align:center;
}

#top {
	background: url(/cpix/layout/v2/hg_crusader.jpg) no-repeat left top;
}
/* Configure logo here. */
#header {
	height: 135px;
	text-align: left;
}

#header-shadow {
}

/* Should have the same dimensions & bg as `#sitelogo a' to prevent IE6 flicker on hover */
#sitelogo {
	margin: 0;
	padding: 0;
	background: url(/cpix/layout/v2/hg_shmasthead_c.jpg) no-repeat;
	width: 401px;
	height: 90px;
	float: left;
	top: 30px;
	left: 100px;
	position: relative;
}
#sitelogo a {
	background: url(/cpix/layout/v2/hg_shmasthead_c.jpg) no-repeat;
	width: 401px;
	height: 90px;
	font-size: 16pt;
	display: block;
}

#sitelogo a span {
	display: none;
}

#header-right {
	float: right;
	width: 140px;
	height: 130px;
	background: url(/cpix/layout/hgx_logo.jpg) no-repeat;
}

#header p {
	margin: 0;
}

/* Main wrapper for everything but the header and top banner. Leave alone,
leave line-height in. */
#main {
	min-width: 990px;
	line-height: 1.2; /* Kills peekaboo bug in IE */
	margin: 0 auto;
	width: 100%;
}

/* main1, main2 and main3 are to get min-width working in IE. LEAVE ALL 
STYLES ON THESE DIVS ALONE!! */
* html #content {
	height: 100%;
}
* html #main1 {
	padding-left: 990px;
}
* html #main3 {
	margin-left: -990px;
	position: relative;
}
#main3 {
	text-align: left;
}
/*\*/
* html #main1, * html #main2, * html #main3 {
	height: 1px;
}
/**/
/* End min-width hack for IE */

/* NAVIGATION STYLES */
/* Left bar styles. Leave the float & inline alone */
#left-bar {
	float: left;
	width: 190px;
	display: inline;
	background-color: #eaeaea;
}

/* First wrapper div for the left bar, use for background */
#left1 {
	background: url(/cpix/layout/v2/s_nav_bkg.jpg) repeat-y 0px 34px;
}
/* Second wrapper div for the left bar, use for background */
#left2 {
	background: url(/cpix/layout/v2/s_nav_top.jpg) no-repeat top;
}
/* Third wrapper div for the left bar, use for background */
#left3 {
	background: url(/cpix/layout/v2/s_nav_bottom.jpg) no-repeat bottom;
}
/* Final div for the left bar. Use for background, padding, etc */
#left {
	padding: 25px 28px 40px;
}

/* Right bar styles. Leave the float & inline alone */
#right-bar {
	float: right;
	width: 170px;
	display: inline;
}
/* First wrapper div for the right bar, use for background */
#right1 {
	background-color: #eaeaea;
	background: url(/cpix/layout/v2/r_nav_bkg.jpg) repeat-y center top;
}
/* Second wrapper div for the right bar, use for background */
#right2 {
	background: url(/cpix/layout/v2/r_nav_top.jpg) no-repeat top;
}
/* Third wrapper div for the right bar, use for background */
#right3 {
	background: url(/cpix/layout/v2/r_nav_bottom.jpg) no-repeat bottom;
}
/* Final div for the right bar. Use for background, padding, etc */
#right {
	padding: 25px 30px 40px;
}

/* #left and #right divs are both classed "nav". Use ".nav whatever" to define
styles for both navbars */
/*
.nav h3 {
	...
}
*/


/* Ad banner and skyscraper styles. */
#ad-banner-wrap {
	text-align: center;
	margin: 0px 10px 10px 120px;
}
#ad-banner {
	width: 728px;
	margin: auto;
}
#ad-skyscraper {
	height: 600px;
	width: 160px;
	background: black;
	margin: 0 5px 10px;
}



/* CONTENT LAYOUT */

/* Div for a possible background on the left navigation, that extends all
the way to the bottom. Make sure the background isn't wider than, say, 180px */
#wrap-lhs-back {
	
}

/* Div for a possible background on the right navigation, that extends all
the way to the bottom. Make sure the background isn't wider than, say, 180px */
#wrap-rhs-back {
	
}

#gallery {
	background: url(/cpix/layout/v2/hg_mbkg.jpg);
	margin: 0 20px;
}
/* First wrapper div for the content area, use for background, leave margin and 
position alone */
#content1 {
	margin: 0 180px 0 200px;
	position: relative;
	background: url(/cpix/layout/v2/hg_mbkg.jpg);
}
/* Second wrapper div for the content area, use for background */
#content2 {
	background: url(/cpix/layout/v2/bdr_top.gif) repeat-x top left;
}
/* Third wrapper div for the content area, use for background */
#content3 {
	background: url(/cpix/layout/v2/bdr_bottom.gif) repeat-x bottom left;
}
/* Fourth wrapper div for the content area, use for background */
#content4 {
	background: url(/cpix/layout/v2/bdr_left.gif) repeat-y top left;
}
/* Fifth wrapper div for the content area, use for background */
#content5 {
	background: url(/cpix/layout/v2/bdr_right.gif) repeat-y top right;
}
/* Sixth wrapper div for the content area, use for background */
#content6 {
	background: url(/cpix/layout/v2/bdr_tlc.gif) no-repeat left top;
}
/* Seventh wrapper div for the content area, use for background */
#content7 {
	background: url(/cpix/layout/v2/bdr_trc.gif) no-repeat right top;
}
/* Eighth wrapper div for the content area, use for background */
#content8 {
	background: url(/cpix/layout/v2/bdr_brc.gif) no-repeat right bottom;
}

/* Final div for the content area, use for background, padding, etc */
#content {
	background: url(/cpix/layout/v2/bdr_blc.gif) no-repeat left bottom;
	padding: 20px;
	margin: 0;
}

/* Optional footer. Leave the clear property alone */
#footer {
	padding-top: 10px;
	clear: both;
}

p#skip {
	display: none;
}

/* Copyright message, should be in other stylesheet */
#copyright {
	font-size: 85%;
	text-align: left;
	padding-left: 200px;
	color: #e0e0e0;
}