
body {
	margin: 0;
	padding: 0;
	background:#99CCFF;
	font-family: Helvetica, sans-serif;
	font-size: 62.5%;
	color: #333;
}


#gallerylinks{
  z-index:7; /*** Critical value for Moz/Opera Background Column colors fudge to work ***/
  position:absolute;
  float:left;
  width:480px;
  top:10px;;
  left:0px;
  overflow:visible;
}

/*first half-navigation*/
#gallerylinks ul#nav {
	margin-left:0px;
	top:40px;
	width: 480px;
	height: 26px;
	background: transparent url('../images/gallerylinks.png') 0 0 no-repeat;
	list-style-type: none;
	text-decoration: none;
	 outline: none; /*get rid of FF's annoying dotted outline! Why the FF team thought dotted outlines would be cool I don't know.*/
}
#gallerylinks ul#nav li {
	float: left;
	margin: 0;
	padding: 0;
}
#gallerylinks ul#nav li a {
	display: block;
	margin: 0;
	padding: 0;
	text-indent: -99999px;
	text-decoration: none;
	 outline: none;
}


/* --- Vision --- */
#gallerylinks ul#nav li.visitsite1 {
	margin-top: 0px;
	left: 0px;
}

/*this only tells where the actual picture is, NOT the swapped one!*/
#gallerylinks ul#nav li.visitsite1 a {
	width: 137px;
	height: 28px;
	left:0px;
	background: transparent url('../images/gallerylinks.png') 0px 0px no-repeat; /* -total distance from edge, -top */
}

#gallerylinks ul#nav li.visitsite1 a:hover {
    background: transparent url('../images/gallerylinks.png') 0px -28px no-repeat; /* -total distance from edge, -(220 + top) */
}

/* --- Praise --- */
#gallerylinks ul#nav li.visitsite2 {
	margin-top: 0px;
	left: 140px;
}

#gallerylinks ul#nav li.visitsite2 a {
	width: 167px;
	height: 28px;
	left:0px;
	background: transparent url('../images/gallerylinks.png') 30px 0px no-repeat; /* -total distance from edge, -top */
}

#gallerylinks ul#nav li.visitsite2 a:hover {
    background: transparent url('../images/gallerylinks.png') 30px -28px no-repeat; /* -total distance from edge, -(220 + top) */
}

/* --- Design --- */
#gallerylinks ul#nav li.visitsite3 {
	margin-top: 0px;
	left: 0px;
}

#gallerylinks ul#nav li.visitsite3 a {
	width: 170px;
	height: 28px;
	left:0px;
	background: transparent url('../images/gallerylinks.png') 33px 0px no-repeat; /* -total distance from edge, -top */
}

#gallerylinks ul#nav li.visitsite3 a:hover {
    background: transparent url('../images/gallerylinks.png') 33px -28px no-repeat; /* -total distance from edge, -(220 + top) */
}

#clearheadercenter{
  height:230px; /*** needed to make room for header in center column ***/
  overflow:visible;
}
#clearheaderright{
  height:230px; /*** needed to make room for header in right column ***/
  overflow:visible;
}

#fullheightcontainer {
  margin-left:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
  margin-right:auto; /*** Mozilla/Opera/Mac IE 5.x alignment of page ***/
  text-align:left; /*** IE Win re-alignment of page if page is centered ***/
  position:relative; /*** Needed for IE, othewise header and footer aren't contained
directly above and below the body ***/
  width:780px; /*** Needed for Moz/Opera to keep page from sliding to left side of
page when it calculates auto margins above. Can't use min-width. Note that putting
width in #fullheightcontainer shows it to IE and causes problems, so IE needs a hack
to remove this width. Left Col + Right Col + Center Col + Both Inner Border + Both Outer Borders ***/
/* \*/
  margin-top:20px;
/* Last height declaration hidden from Mac IE 5.x */
/*** Needed for Moz to give full height design if page content is
too small to fill the page ***/
}

#logo {
	position:absolute;
	width:190px;
	height:170px;
	z-index:8;
}

h1, h2, p, ul, li {
	margin: 0;
	padding: 0;
}


p {
	font-size: 1.4em;
	line-height: 1.4em;
}

ul {
	list-style-type: none;
}

a:link, a:visited {
	background:none;
	text-decoration:none;
	color:transparent;
}

/* This rule adds a nice style to our ampersands */
span.amp {
	font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
	font-weight: normal;
	font-style: italic;
}

#float-wrap{
  width:200px; /*** Critical left and right col/divider dimension value (moves inversly) = Center Col Width ***/
  right:-1px; /*** Static fix, doesn't change ***/
  float:left;
  display:inline;
  z-index:2;
}

#right{
  float:left;
  display:inline;
  width:580px; /*** Critical right col/divider dimension value = right col width + 2px ***/
  margin-right:-578px; /*** Critical right col/divider dimension value = negative right col width ***/
  margin-left:-1px; /*** Static fix ***/
  position:relative; /*** IE needs this or the contents won't show
outside the parent container. ****/
}

#container-right{
/* \*/
  position:absolute;
  max-width:95%;
/* Above hidden from IE-Mac */
/*** Critical right col dimension value = right col width ***/
  margin-left:20px; /*** Critical right divider dimension value = one internal border width + 2px ***/
}


.title {
font-weight:bold;
font-size:1.3em;
line-height:1em;
max-width:100%;
}

.welcome {
position:relative;
width:700px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.welcome span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/welcome.png');
background-repeat:no-repeat;
}



.menutitle {
	position:relative;
	width:165px;
	height:45px;
	font-weight:bold;
	font-size:1.8em;
	line-height:1em;
	color:#666666;
	overflow:hidden;
}

.menutitle span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-image:url('../images/menutitle.png');
	background-repeat:no-repeat;
}



.pagetitlewho {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlewho span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/whowearetitle.png');
background-repeat:no-repeat;
}

.blurb {
margin-right:6em;
color:#333333;
font-size:1.5em;
}

.blurb h2 b{
font:corbel;
margin-right:6em;
color:#0000FF;
}
.experiment {
font:corbel;
font-size:1.2em;
line-height:1.2em;
margin-bottom:1em;
margin-right:6em;
color:#006699;
}

.bizname {
font:corbel;
line-height:1.2em;
color:#FF9900;
}
.pointhighlight {
font:corbel;
font-size:1.7em;
line-height:1.5em;
color:#555555;
}

#wrapper{
  min-height:100%; /*** moz uses this to make full height design. As this #wrapper
is inside the #fullheightcontainer which is 100% height, moz will not inherit heights
further into the design inside this container, which you should be able to do with
use of the min-height style. Instead, Mozilla ignores the height:100% or
min-height:100% from this point inwards to the center of the design - a nasty bug.
If you change this to height:100% moz won't expand the design if content grows.
Aaaghhh. I pulled my hair out over this for days. ***/
/* \*/
  height:100%;
/* Last height declaration hidden from Mac IE 5.x */
/*** Fixes height for non moz browsers, to full height ***/
  background:#FFFFFF;/*** Set background color for side columns for Safari & IE ***/
}
#wrapp\65	r{ /*** for Opera and Moz (and some others will see it, but NOT Safari) ***/
  height:auto; /*** For moz to stop it fixing height to 100% ***/
}
/* \*/
* html #wrapper{
  height:100%;
}

#outer{
  z-index:1; /*** Critical value for Moz/Opera Background Column colors fudge to work ***/
  position:relative; /*** IE needs this or the contents won't show outside the parent container. ***/
  margin-left:px; /*** Critical left col dimension value = left col width ***/
  width:780px; /*** Critical left and right col/divider dimension value (moves inversly) = center col width ***/
  background:#FFFFFF;/*** Sets background of center col***/
/* \*/
  height:100%;
/* Last height declaration hidden from Mac IE 5.x */
/*** Needed for full height inner borders in Win IE ***/
}

#float-wrap{
  width:200px; /*** Critical left and right col/divider dimension value (moves inversly) = Center Col Width ***/
  margin-right:-1px; /*** Static fix, doesn't change ***/
  float:left;
  display:inline;
  z-index:2;
}

#canNACHI{
position:absolute; 
left:670px;
top:265px;
z-index:8;
}

#pageicon{
position:absolute; 
left:700px;
top:240px;
z-index:8;
}


#pagedivider{
position:absolute; 
left:190px;
top:220px;
height:436px;
width:10px;
background-image:url('../images/horizontdivider.png');
z-index:8;
}


* html .png{
position:relative;
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
);
}

#bottompics{
position:absolute; 
left:225px;
top:550px;
z-index:8;
}

#bottompics img{
float:left; 
margin-right:5px;
border-color:#666666;
border-style:solid;
}

#clearfootercenter{
  height:25px; /*** needed to make room for footer in center column ***/
  overflow:hidden;
}
#clearfooterright{
  height:25px; /*** needed to make room for footer in right column ***/
  overflow:hidden;
}
#footer{
  z-index:1; /*** Critical value for Moz/Opera Background Column colors fudge to work ***/
  position:absolute;
  clear: both;
  width:780px; /*** Set to Left Col + Right Col + Center Col + Both Inner Borders +
Both External Borders ***/
  height:62px; /*** = Bottom Margin + One Outer Border + body to footer divider depth +
subfooter1 height + any other subfooter heights ***/
  overflow:visible;
  background-color:#FFFFFF;
}


.footertext{
	position:absolute;
	top:30px;
	left:30px;
	font-size:1.1em;
	font-weight:bold;
	color:#333333;
}

.footertext a{
	color:#333333;
	text-decoration:none;
	border:none;
}

.blurb a{
	color:#666666;
	text-decoration:none;
	border:none;
}

.blurb a:hover{
	color:#000000;
	text-decoration:none;
	border:none;
}

.footertext a:hover{
	color:#000000;
	text-decoration:none;
	border:none;
}


.horizonlink{
	position:absolute;
	top:5px;
	right:30px;
	font-size:1.2em;
	font-weight:bold;
}

#subfooter1{
  background:#EEEEEE;/*** Background Color of Sub-footer #1 ***/
  text-align:left;
  margin-top:25px;
  margin-left:16px;
  margin-right:16px;
  height:33px; /*** sub-footer row height ***/
}

#gfx_bg_middle{
  top:0px;
  position:absolute;
  height:100%;
  overflow:hidden;
  width:200px; /*** = Center Col Width ***/
  margin-left:px; /*** = Left Col Width ***/
  background:#FFFFFF; /*** Set background color for center column for Mozilla & Opera ***/
}

#logo {
	position:absolute;
	margin-left:0px;
	margin-top:-10px;
	z-index:8;
	width:78px;
	height:73px;
}

#didyouknow {
position:absolute;
left:25px;
top:430px;
height:250px;
width:150px;
background:url('../images/didyouknow.gif');
overflow:visible;
z-index:5;
}

#header{
  z-index:7; /*** Critical value for Moz/Opera Background Column colors fudge to work ***/
  position:absolute;
  margin-top:15px;
  margin-left:15px;
  width:755px; /*** Set to Left Col (not if left sidebar fully intrudes into header or left sidebar is off)
+ Right Col (not if right sidebar fully intrudes into header or right sidebar is off) + Center Col + Both Inner
Borders (not if any sidebar intrudes into header or footer, or Inner Borders are off) + Both External Borders
(not if external borders are off) ***/
  height:189px; /*** = Top Margin + One Outer Border + header to body divider depth +
subheader1 height + any other subheader heights ***/
  overflow:visible;
}

#header img {
	border: 3px solid #DDDDDD;
}

#header h1 {
	font-size: 1.8em;
	margin: 0px 0px 0px 15px;
	padding: 5px;
	border-bottom: 2px solid #666666;
	z-index:1;
}

#content {
	margin: 15px 0 5px 0;
	padding: 5px;
	float: right;
	width: 530px;
	z-index:1;
}

#innertext {

}

#content h2 {
	font-size: 1.4em;
	font-weight:bold;
	margin: 0 0 10px 0;
}

#content h2 {
	color:#333333;
	font-size: 250%;
	font-weight:bold;
	font-family:Georgia, "Times New Roman", Times, serif;
	line-height:1.45em;
	margin: 0 0 10px 0;
}

#content p {
	font-size: 1.3em;
	margin: 0 0 10px 0;
}

#link-list {
	margin: 20px 0 0 0;
	font-size: 1.4em;
}

#link-list li {
	margin: 0 0 10px 0;
}

#sidebar {
	padding-top:5px;
	margin-left:15px;
	width: 200px;
	height:470px;
	background:#FFF;
}

#cannachi{
	positon:absolute;
	z-index:100;
}



#float-wrap{
  width:200px; /*** Critical left and right col/divider dimension value (moves inversly) = Center Col Width ***/
  margin-right:-1px; /*** Static fix, doesn't change ***/
  float:left;
  display:inline;
  z-index:2;
}

#profilephoto{
	margin-top:10px;
}


#bottomphoto {
	position:absolute;

}

#bottomphoto {
	margin: 1px 5px 5px 0;
	float: left;
	border: 2px solid #999999;
}

#menu6 {
	float:left;
	width: 180px;
	padding-left:10px;
	overflow:visible;
	}

/**NEW MENU SETUP!**/
/*first half-navigation*/
#menu6 ul#nav2 {
	width: 165px;
	height: 140px;
	background: transparent url('../images/menubar6.png') 0 0 no-repeat;
	list-style-type: none;
	text-decoration: none;
	 outline: none; /*get rid of FF's annoying dotted outline! Why the FF team thought dotted outlines would be cool I don't know.*/
}
#menu6 ul#nav2 li {
	float: left;
	margin: 0;
	padding: 0;
}
#menu6 ul#nav2 li a {
	display: block;
	margin: 0;
	padding: 0;
	text-indent: -99999px;
	text-decoration: none;
	 outline: none;
}


/* --- whoweare --- */
#menu6 ul#nav2 li.whoweare {
	margin-top: 0px;
	left: 0px;
}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.whoweare a {
	width: 165px;
	height: 20px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px 0px no-repeat; /* -total distance from edge, -top */
}

#menu6 ul#nav2 li.whoweare a:hover {
    background-position:-165px 0px;
}

/* --- whoweareon --- */
#menu6 ul#nav2 li.whoweareon {
	margin-top: 0px;
	left: 0px;
}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.whoweareon a {
	width: 165px;
	height: 20px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px 0px no-repeat; /* -total distance from edge, -top */
}

#menu6 ul#nav2 li.whoweareon a:hover {
    background-position:-165px 0px;
}

/* --- vision --- */
#menu6 ul#nav2 li.vision {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.vision a {
	width: 165px;
	height: 22px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px -20px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.vision a:hover {
    background-position:-165px -20px;
}

/* --- visionon --- */
#menu6 ul#nav2 li.visionon {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.visionon a {
	width: 165px;
	height: 22px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px -20px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.visionon a:hover {
    background-position:-165px -20px;
}

/* --- praise --- */
#menu6 ul#nav2 li.praise {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.praise a {
	width: 165px;
	height: 24px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px -42px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.praise a:hover {
background-position:-165px -42px;
}

/* --- praiseon --- */
#menu6 ul#nav2 li.praiseon {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.praiseon a {
	width: 165px;
	height: 23px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px -42px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.praiseon a:hover {
background-position:-165px -42px;
}

/* --- design --- */
#menu6 ul#nav2 li.design {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.design a {
	width: 165px;
	height: 27px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px -67px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.design a:hover {
background-position:-165px -67px;
}

/* --- designon --- */
#menu6 ul#nav2 li.designon {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.designon a {
	width: 165px;
	height: 27px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px -67px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.designon a:hover {
background-position:-165px -67px;
}

/* --- contact --- */
#menu6 ul#nav2 li.contact {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.contact a {
	width: 165px;
	height: 27px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px -93px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.contact a:hover {
background-position:-165px -93px;
}

/* --- contacton --- */
#menu6 ul#nav2 li.contacton {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.contacton a {
	width: 165px;
	height: 27px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px -93px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.contacton a:hover {
background-position:-165px -93px;
}

/* --- news --- */
#menu6 ul#nav2 li.news {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.news a {
	width: 165px;
	height: 22px;
	left:0px;
	background: transparent url('../images/menubar6.png') 0px -118px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.news a:hover {
background-position:-165px -118px;
}

/* --- newson --- */
#menu6 ul#nav2 li.newson {

}

/*this only tells where the actual picture is, NOT the swapped one!*/
#menu6 ul#nav2 li.newson a {
	width: 165px;
	height: 22px;
	left:0px;
	background: transparent url('../images/menubar6.png') -165px -118px;  /* -total distance from edge, -top */

}

#menu6 ul#nav2 li.newson a:hover {
background-position:-165px -118px;
}

.pagetitlewho {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlewho span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/whowearetitle.png');
background-repeat:no-repeat;
}

.pagetitlevision {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlevision span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/visiontitle.png');
background-repeat:no-repeat;
}

.pagetitlepraise {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlepraise span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/praisetitle.png');
background-repeat:no-repeat;
}

.pagetitledesign {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitledesign span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/designtitle.png');
background-repeat:no-repeat;
}

.pagetitlecontact {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlecontact span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/contacttitle.png');
background-repeat:no-repeat;
}

.pagetitlenews {
position:relative;
width:330px;
height:35px;
font-weight:bold;
font-size:1.8em;
line-height:1em;
color:#666666;
overflow:hidden;
}

.pagetitlenews span {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-image:url('../images/newstitle.png');
background-repeat:no-repeat;
}

#historytabon {
	position:absolute;
	left:10px;
	top:52px;
	height:50px;
	width:85px;
	background-image:url('../images/historytabon.png');
	z-index:8;
	visibility:visible;
}


#missiontabon {
	position:absolute;
	left:137px;
	top:52px;
	height:50px;
	width:85px;
	background-image:url('../images/missiontabon.png');
	z-index:8;
	visibility:hidden;
}

#valuestabon {
	position:absolute;
	left:263px;
	top:52px;
	height:50px;
	width:85px;
	background-image:url('../images/valuestabon.png');
	z-index:8;
	visibility:hidden;
}

.clear{
  clear:both;
/*** these next attributes are designed to keep the div
height to 0 pixels high, critical for Safari and Netscape 7 ***/
  height:1px;
  overflow:hidden;
  line-height:1%;
  font-size:0px;
  margin-bottom:-1px;
}
* html .clear{height:auto;margin-bottom:0} /*** stops IE browsers from displaying
the clear div/br in the page, as these are for Moz/Opera and
Safari only. If IE 5.x Win DID display these, the page is too high ***/


