body{text-align:center;}
#all{position:relative;}
#logo{

float: left;
	margin: 0 20px 0 0;
	width: 260px;
}

#all{max-width:969px; min-width: 640px; margin: 0 auto;text-align:left; padding: 0 20px 0 0;}
#header {
	margin: 3px 0 0 20px;
	padding: 20px 0 0 0;
}
#header .doNotPrint {
	padding: 0 0 0 0;
}

#functions{padding-top:89px;text-align:right}

#functions a{text-decoration:none}
#functions a:hover{text-decoration:underline}
.oneThird img{width:100%;}
.PrintOnly{display:none}


.quarter, .oneThird, .half, .twoThirds, .fullWidth {
  margin: 1em 0;
  float: left;
  border-left: 1px solid rgb(204,204,204);
}

.quarter {
  width: 21%;
  padding: 0 1.9%;
}

.twoThirds {
  width: 66%;
  padding: 0 1.9%;
}

.half{width:50%}
#north{width:50%}
#east{width:90%}
#south{width:50%}
#west{width:50%}

#emailpic{width:70%}
#reppic{}
#faxpic{width:70%}


#waterfall{width:70%}
#bridge{width:70%}
#dome{width:70%}
#ball{width:70%}
#canyon{width:70%}
#desert{width:70%}

/* ##### Common Styles ##### */

body {
  font-family: verdana, helvetica, arial, sans-serif;
  font-size: 73%;  /* Enables font size scaling in MSIE */
  margin: 0;
  padding: 0;
}

html > body {
  font-size: 9pt;
}

acronym, .titleTip {
  border-bottom: 1px dotted rgb(61,92,122);
  cursor: help;
  margin: 0;
  padding: 0 0 0.4px 0;
}

a {
  color: rgb(61,92,122);
  background-color: transparent;
  text-decoration: underline;
  margin: 0;
  padding: 0 1px 2px 1px;
}

a img {
  border-style:none;
}

a:hover {
  color: rgb(117,144,174);
  text-decoration: none;
}

ol {
  margin: 1em 0 1.5em 0;
  padding: 0;
}

ul {
  list-style-type: square;
  margin: 1em 0 1.5em 0;
  padding: 0;
}

dl {
  margin: 1em 0 0.5em 0;
  padding: 0;
}

ul li {
  line-height: 1.5em;
  margin: 1.25ex 0 0 1.5em;
  padding: 0;
}

ol li {
  line-height: 1.5em;
  margin: 1.25ex 0 0 2em;
  padding: 0;
}

dt {
  font-weight: bold;
  margin: 0;
  padding: 0 0 1ex 0;
}

dd {
  line-height: 1.75em;
  margin: 0 0 1.5em 1.5em;
  padding: 0;
}

.doNotDisplay {
  display: none !important;
}


.smallCaps {
  font-size: 117%;
  font-variant: small-caps;
}


/* ##### Header ##### */

.superHeader {
  color: rgb(130,128,154);
  background-color: rgb(33,50,66);
  text-align: right;
  margin: 0;
  padding: 0.5ex 10px;
}

.superHeader span {
  color: white;
  background-color: transparent;
  font-weight: bold;
  text-transform: uppercase;
}

.superHeader a {
  color: white;
  background-color: transparent;
  text-decoration: none;
  font-weight: bold;
  margin: 0;
  padding: 0 0.25ex 0 0;
}

.superHeader a:hover {
  color: rgb(193,102,90);
  background-color: transparent;
  text-decoration: none;
}

.midHeader {
  color: black;
  background-color: white;
  margin: 0;
  padding: 0.26ex 10px;
}

.headerTitle {
  font-size: 300%;
  margin: 0;
  padding: 0;
}

.headerSubTitle {
  font-size: 151%;
  font-weight: normal;
  font-style: italic;
  margin: 0 0 1ex 0;
  padding: 0;
}

.headerLinks {
  text-align: right;
  margin: 0;
  padding: 0 0 2ex 0;
  position: absolute;
  right: 1.5em;
  top: 3.5em;
}

.headerLinks a {
  color: white;
  background-color: transparent;
  text-decoration: none;
  margin: 0;
  padding: 0 0 0.5ex 0;
  display: block;
}

.headerLinks a:hover {
  color: rgb(195,196,210);
  background-color: transparent;
  text-decoration: underline;
}

.innerHeader {
	margin-right: 210px;
}

/*.subHeader {
  color: white;
  background-color: rgb(117,144,174);
  margin: 0;
  padding: 0.5ex 10px;

  }*/

.subHeader a, .subHeader .highlight {
  color: white;
  background-color: transparent;
  font-size: 110%;
  font-weight: bold;
  text-decoration: none;
  margin: 0;
  padding: 0 0.25ex 0 0;
}

.subHeader a:hover, .subHeader .highlight {
  color: rgb(255,204,0);
  background-color: transparent;
  text-decoration: none;
}


/* ##### Main Copy ##### */

#main-copy {
	max-width: 900px;
	/*  width: 900px;*/
  margin: 0 auto 0 35px;
	/*  margin: 0 auto;*/
  padding: 0.5em 10px;
	clear: left;
}

#main-copy h1 {
  color: rgb(117,144,174);
  background-color: transparent;
  font-family: "trebuchet ms", verdana, helvetica, arial, sans-serif;
  font-size: 177%;
  margin: 0;
  padding: 0;
}

#main-copy h2 {
  color: rgb(61,92,122);
  background-color: transparent;
  font-family: "trebuchet ms", verdana, helvetica, arial, sans-serif;
  font-weight: normal;
  font-size: 151%;
  margin: 0;
  padding: 1ex 0 0 0;
}

#main-copy p {
  line-height: 1.75em;
  margin: 1em 0 1.5em 0;
  padding: 0;
}

.newsHeading {
  color: rgb(61,92,122);
  background-color: transparent;
  font-family: "trebuchet ms", verdana, helvetica, arial, sans-serif;
  font-size: 145%;
  text-decoration: none;
  margin: 0;
  padding: 1ex 0 0 0;
  display: block;
}

.newsHeading:hover {
  color: rgb(117,144,174);
  background-color: transparent;
  text-decoration: underline;
}

.newsDate {
  font-style: italic;
  margin: 0 !important;
  padding: 0;
}

.newsSummary {
  margin: 1.5ex 0 2.5ex 0.75ex !important;
  padding: 0;
}

.more {
  text-align: right;
  margin: 0;
  padding: 0.5em 0;
}

.more a {
  color: rgb(61,92,122);
  background-color: transparent;
  font-size: 92%;
  text-decoration: underline;
  margin: 0;
  padding: 0.25ex 0.75ex;
}

.more a:hover {
  color: rgb(117,144,174);
  text-decoration: none;
}

.rowOfBoxes {
  clear: both;
}

.quarter, .oneThird, .half, .twoThirds, .fullWidth {
  margin: 1em 0;
  float: left;
  border-left: 1px solid rgb(204,204,204);
}

.quarter {
  width: 21%;
  padding: 0 1.9%;
}

.oneThird {
  width: 28%;
  padding: 0 1.9%;
}

.half {
  width: 46%;
  padding: 0 1.9%;
}

.twoThirds {
	width: 63%;
	padding: 0 1.9%;
	min-width: 339px;
}

.fullWidth {
  width: 96%;
  padding: 0 1.2em;
  border-left: none;
  text-align: left;
}
.fullWidth.alliance {
text-align: center;
}

.filler {  /* use with an empty <p> element to add padding to the end of a text box */
  border: 1px solid white;
}

.noBorderOnLeft {
  border-left: none;
}

.dividingBorderAbove {
  border-top: 1px solid rgb(204,204,204);
}

.centre {
    text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
}

/* More elegant alternatives to .noBorderOnLeft & .dividingBorderAbove
 * that don't require the creation of new classes - but which are not
 * supported by MSIE - are the following:
 *
 * .rowOfBoxes > div:first-child {
 *   border-left: none;
 * }
 *
 * .rowOfBoxes + .rowOfBoxes {
 *   border-top: 1px solid rgb(204,204,204);
 * }
 */



/* ##### Footer ##### */

#footer {
  color: rgb(51,51,102);
  font-size: 87%;
  text-align: center;
  line-height: 1.25em;
  margin: 2em auto 0 auto;
  padding: 1ex 10px;
  clear: left;
  max-width: 1000px;
}

#footer a {
  color: rgb(0,68,204);
  background-color: transparent;
  text-decoration: underline;
}

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


/*nav styles*/
.nav{
/*max-width: 330px;*/
/*max-width: 669px;*/
float: left;

}

.nav .block{
	float:left;
	border-left:1px solid #ccc; /* line on the left navigation */
	margin:0 10px 0 0;
	padding:0;
	/*max-width: 182px;*/
}

.nav ul{
    margin:0;
    padding:0 0 0 5px;
}

.nav li{
    list-style:none;
    padding:3px 0;
    margin:0;
}


.clear{
    clear:both;
/*    padding:20px 0 0 0; *//*increase the no to move the blue lines and text links on right down*/
height: 20px;
}

.clear1{
    clear: both;
    height: 0;
}

#call{
	color:#FF0000;
	margin:25px auto 0 auto;
	font-size:12px;
	text-align: right;
	/*width: 330px;*/
	width: 200px;
	position: absolute;
	right: 20px;
}

#call span{
    font-size:18px; /*style for phone no*/
    font-weight:bold;
}


#functions{
    padding:0;
}

.rt{
    clear: both;
    float:right;
    max-width: 350px;
}

.superHeader{
    padding:0;
    margin:0;
}

.subHeader{
	padding:0;
	margin:0 0 0 0;
	border-bottom:1px solid #ccc;
	max-width:100%;
	clear: both;
}

#alliancePage .pics {
    text-align: center;
}
#alliancePage .pics img {
    width: 100%;
}
/** CALL OUT BOXES **/

/*Border Property Values

Value     Description
none     Specifies no border
hidden     The same as "none", except in border conflict resolution for table elements
dotted     Specifies a dotted border
dashed     Specifies a dashed border
solid     Specifies a solid border
double     Specifies a double border
groove     Specifies a 3D grooved border. The effect depends on the border-color value
ridge     Specifies a 3D ridged border. The effect depends on the border-color value
inset     Specifies a 3D inset border. The effect depends on the border-color value
outset     Specifies a 3D outset border. The effect depends on the border-color value
inherit     Specifies that the border style should be inherited from the parent element
*/

.bluebox {
    width: 300px; /*width of the box.*/
    background-color: #B3C4FF; /*background color of the box*/
    min-height: 100px;  /*This is not necessary. You can delete this and then allow content to resize the box*/
    /* sample: border-top is which border. 1px is how thick the border is.
    then  after the thickness is the color of the border. Border types are listed above.
    */
    border-top: 1px solid #99CCFF;
    border-right: 1px solid #99CCFF;
    border-bottom: 1px solid #99CCFF;
    border-left: 1px solid #99CCFF;
}
.greybox {
    width: 300px;
    background-color: #E5E5E5;
    min-height: 100px;

    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;
}
.tanbox {
    width: 300px;
    background-color: #FFCC33;
    min-height: 100px;

    border-top: 1px solid #FF9900;
    border-right: 1px solid #FF9900;
    border-bottom: 1px solid #FF9900;
    border-left: 1px solid #FF9900;
}
/*Buttons:
The way the buttons are setup is they are contained within
a container called .moreInfo. Each button is alinged to
one side of the container. .getInfo is aligned to the left
of the container. .keepReading is alinged to the right of
the container. To adjust the space between the buttons,
just increase or decrease the width of .moreInfo. Increasing
the width will set the buttons further apart. Decreasing the
width will bring them closer together.

min-width will prevent the buttons from collapsing.
*/
.moreInfo {/*this is the overall container.*/
	margin: 0 auto;
	width: 65%; /*how large the container is initially*/
	min-width: 339px;/*the smallest size the container can be*/
}
.moreInfo .getInfo { /*need to attach this class to your left button*/
    float: left;
}
.moreInfo .keepReading { /*need to attach this class to your right button*/
    float: right;
}
