/**************************************************************
   AUTHOR:  Duncan Frazier: redshift-blueshift.com
   DATE:    6/10/08
   PURPOSE: Controls the layout of the site and styles
            the menus
 **************************************************************/



/**************************************************************
   #wrapper & #content: wrapper positions and sets the width
   on the content.  The background is then applied to #content.
 **************************************************************/

#wrapper {
	width: 980px;
	height: 100%;
	margin: auto;
	text-align: left;
	border-top: 6px black solid;
}



/**************************************************************
   #header: Holds the site title and header images
 **************************************************************/

#header {
	padding: 45px 0 3px 0;
}

/* Forces IE to set the hasLayout flag and show the header at the height of its contents \*/
* html #header {
  height: 1%;
}
/* End hide from IE-mac */


#header h1 {
	font-size: 1.6em;
	font-family: Helvetica, sans-serif;
	color: #000000;
	position: relative;
	font-weight: bold;
	margin: 0;
	padding: 0;
	background: none;
}

/**************************************************************
   #menu: The top level site menu
 **************************************************************/

#mainnav {
	background-color: #000000;
	/*height: 46px;*/
	text-align: left;
}


#mainnav:after {
	content: ".";
	display: block;
	line-height: 0px;
	font-size: 0px;
	color: transparent; 
	clear: both;		
}


ul#menu {
	width: 980px;
	margin: 0;
	padding: 0;
	background-color: #000000;
	/*margin: 0 auto;
	padding: 0 !important;*/
}

ul#menu li {
	display: inline;
	list-style: none;
}

ul#menu li a {
	height: 38px;
	float: left;
	padding: 4px 0 0 5px;
	font: 200 .8em Helvetica, sans-serif;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #000000;
	border-right-color: #FFFFFF;
	border-width: 0 1px 0 0;
	border-right-style: solid;
}

ul#menu li a:visited {
}

ul#menu li a:hover {
	background-color: #CC3300;
}

ul#menu li a.here {
	
}

ul#features li {
	
	padding-bottom: 5px;

}

/* helper classes to control width of links in topbar */

ul.colseven li a {
  width: 163px;
}

/**************************************************************
   #page: Holds the main page content.
 **************************************************************/

#page {
	float: left;
	clear: both;
	width: 602px !important;
	width: 100%;
	padding: 5em 99px 0em 99px;
	height: auto;
}

#headerpic {
	clear: both;
	width: 100%;
	padding: 0 0 0 0;
	height: auto;
	margin: 10px 0 0 0;
	border-width: 1px 0 1px 0;
	border-color: #000000;
	border-style: solid;
	margin-bottom: 0em;
}
	
#panonav {
	float: left;
	width: 50%;
	background-color: #009900;	
}
	


/**************************************************************
   .footer: Site footer
 **************************************************************/

#footer {
	clear: both;
	width: 100%;
	font-size: 0.85em;
	text-align: right;
	border-width: 2px 0 0 0;
	border-color: #000000;
	border-style: solid;
	padding: 0 0 0 0;
	margin: 0 0 2em 0;
}

#panoCap {
	clear: both;
	width: 100%;
	font-size: 0.65em;
	border-width: 0 0 1px 0;
	border-color: #000000;
	border-style: solid;
	padding: 3px 0px 8px 0px;
	margin-bottom: 15px;
}
.gallery {
	font-size: 0.8em;
	margin-bottom: 1.5em;
}



/**************************************************************
   Width classes used by the site columns
 **************************************************************/

.width4col {
  width: 647px;
}

.widthForm {
	width: 598px;
}

.width3col {
  width: 330px;
}

.width2col {
  width: 333px;
}

.width1col {
  width: 167px;
}

.widthfull {
  width: 100%;
}

.width80 {
width: 80%;
} 



/**************************************************************
   Alignment classes
 **************************************************************/

.floatLeft {
	float: left;
	/*border-top-color: #000000;
	border-top-width: 10px;
	border-top-style: solid;
	margin: 0em 0 2em 0;
	padding-top: 1em;*/
}

.floatRight {
	float: right;	/*border-top-color: #000000;
	border-top-width: 1px;
	border-top-style: solid;*/
}

.alignLeft {
  text-align: left;
}

.alignRight {
  text-align: right;
}



/**************************************************************
   Generic display classes
 **************************************************************/

.panoLoader {
	text-align:left;
	color: #FFFFFF;
	background-color: #000000;
	width: 300px;
	margin: 0px 0px 15px 15px;
	padding-bottom: 0px;
	float: right;
	/*display: block;*/
}


.bigLink :hover {
	background-color: #cc3300;
}

.panoLoader :hover {
	background-color: #cc3300;
}

.noPad {
border: none;
padding: 0 0 0 0;
margin: none;
}

.padForm {
	padding: 0px 0px 0px 40px;
}

.padRight {
	padding: 0px 8px 0px 0px;
}

.padLeft {
	font: 0.8em Helvetica, san-serif;
	padding: 6px 0px 20px 10px;
	//display: block;
}

.preload {
	display:none;
}

.clear {
  clear: both;
}

.block {
  display: block;
}

.big {
  font-size: 1.5em;  
}

.small {
  font-size: 0.85em;  
}

.bold {
  font-weight: bold;
}

.italic {
  font-style: italic;
}

.grey {
  color: #AAA;
}

.green {
  color: #82C048;
}

.right {
	text-align: right;
}

.darkBrown {
  color: #512103;
}

a.caption {
	display:block;
	width: 290px;
	/*background-color: black;*/
	padding: 8px 0px 22px 10px;
	font-size: 12px;
	font-weight: 400;
}

a.caption :hover {
	background-color: orange;
}

.vCard {
  display:block;
  text-align: center;
  padding: 20px 0px 0px 0px;
}

.highlight {
  padding: 1px 2px;
  background: #D9F5EC;
  border-top: 1px solid #BDEDDE;
}

.caption a:hover {
	background-color: #ff7f00;
}