/*This style sheet governs the images and look of the Prime site for the FOREST THEME*/

/*
*****************************************************************
*****************************************************************
changes to over all appearence and primary layout go here*/

body {
	background-image: url(images/watermarkBG.png);
	background-color: #d2b48c;
	margin: 0;
	padding: 0;
}
body img {
	border: 0px;
}


/*this ID adds the black gradient at the top of the page*/
#grade {
	background:url(images/topgrade_black.png);
	background-repeat:repeat-x;
	height: 600px;
}
/*this ID sets the page width and positioning*/
#page {
	width: 960px;
	margin-right:auto;
	margin-left:auto;
	text-align:left;
	/*	position:relative*/
}

/****************************************************************
*****************************************************************
stuff for the header goes here*/

/*this class sets the Z index to 10*/
.headerLogo {
	position:absolute;
	width: 960px;
	left: auto;
	z-index: 10;
	padding: 0;
	margin: 0px;
}
.headerLogo img {
	width: 282px;
	height: 210px;
	margin-top: -15px;	
}

/*this ID moves the flash header next to the logo but keeps it on the base level*/
#flashHeader {
	padding: 0 0 0 200px;
	margin: 0px;
	height: 172px;
	/*margin-left: 282px;
	position:relative;*/
}
/****************************************************************
*****************************************************************
stuff for the navigation goes here*/
/*this ID is the container for the navigation*/
#navigation {
	height: 35px;
	width: 765px;
	margin-top: 0px;
	margin-left: 180px;
	position:absolute;
	z-index: 15;
}
/*this ID sets the left end cap*/
#navigation #leftEnd {
	background-image:url(images/navigation_bg.png);
	background-position:bottom left;
	width: 12px;
	height:35px;
}
/*this ID sets the right end cap*/
#navigation #rightEnd {
	background-image:url(images/navigation_bg.png);
	background-position:bottom right;
	width: 12px;
	height:35px;
	margin-left:753px;
	margin-top:-35px;
}
/* removes margin and padding off all list elements */
.multi_drop_menus * {
 margin:0; padding:0;     
 }
/* SET YOUR PREFERENCES!!! */
/* set your menu's font and colors here - the MENU MECHANICS  follow below */
.multi_drop_menus {
	behavior:url(csshover.htc);/* you must link to the hover.htc file for this menu to work in IE6 and earlier */
	/* need a copy? go to http://www.xs4all.nl/~peterned/htc/csshover.htc - copy the code into a text file and save it as csshover.htc */
 	font-family:Georgia, "Times New Roman", Times, serif;
	font-variant:small-caps;
	font-size:12px;
	color:#FFF;
	background-image:url(images/navigation_bg.png);
	background-position:top;
	width: 741px;
	height: 35px;
	margin-left: 12px;
	margin-top:-35px;
 }

  
 /*this controls what the 'selected' container will look like*/
.multi_drop_menus   #selected  {
	/*background-image:url(images/navigation_bg.png);
	background-position: 0px -35px;*/
}
/*this controls what the 'selected' container looks like when moused over*/
.multi_drop_menus #selected a:hover {
	/*color: #FFFFFF;*/
}
 /*this controls what the 'selected' link text looks like*/
.multi_drop_menus   #selected a  {
	color: #000;
	font-weight:bold;
	text-decoration:none;
	background-image:url(images/navigation_bg.png);
	background-position: 0px -35px;
 }
 .multi_drop_menus   #selected li:hover  {
	color: #000;
	font-weight:bold;
	text-decoration:underline;
}
.multi_drop_menus   #selected ul a  {
	background-image:none;
	color:#FFF;
}
.multi_drop_menus   #selected ul a:hover  {
	background-image:none;
	color:#0C0;
	text-decoration:underline;
}

/*this class controls the level 1 menu container default state*/
.multi_drop_menus li {
/*	background-color:#F00;         
/*	border-right:1px solid #CCB;   */
 } 
/*this controls what the level 1 container lookw like when moused over*/
.multi_drop_menus li:hover {
	/*color:#0C0;*/
 }
 /*this controls what the level 1 link text looks like*/
 .multi_drop_menus a {
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	padding-right: 14px;
	padding-left: 14px;
	padding-top: 10px;
 }
/*this controls what the level 1 link text looks like when moused over*/
 .multi_drop_menus a:hover {
	color:#0C0;
	font-weight:bold;
	text-decoration:underline;

 }


/*this is the container for the entire drop down*/
.multi_drop_menus ul li ul {
	width:175px;   						
 }
 /*this is the container for the drop down items- this should be the middle items that see this background*/
.multi_drop_menus li li {
	background-image:url(images/menu_dropdown.png);
	background-position:left top;
	background-repeat:repeat-y;
	
 }
 /*this controls the link text for the drop down items*/
.multi_drop_menus li li a {
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	padding-top: 5px;
	padding-bottom: 5px;
}
/*this controls the link text for the drop down items*/
.multi_drop_menus li li a:hover {
	color:#0C0;
	font-weight:bold;
	text-decoration:underline;
}
/*this class is for the first list item*/
.multi_drop_menus .first {
	background-image:url(images/menu_dropdown.png);
	background-position: -174px 0px;
	background-repeat:no-repeat;
	height: 31px;
}
/*this class is for the last list item*/
.multi_drop_menus .last {
	background-image:url(images/menu_dropdown.png);
	background-position: -353px 0px;
	background-repeat:no-repeat;
	height: 31px;
}
/*this class is for the single list item*/
.multi_drop_menus .single {
	background-image:url(images/menu_dropdown.png);
	background-position: -528px 0px;
	background-repeat:no-repeat;
	height: 31px;
}

/* END MENU PREFERENCES */
 
/* YOU ARE STONGLY ADVISED NOT TO MODIFY THE CODE THAT FOLLOWS : ) */
/* the menu mechanics start here */
.multi_drop_menus {
	float:left;
 	/*width:100%;*/
	}
.multi_drop_menus ul {
 float:left; /* makes ul wrap li */
font-size:1em; /* prevents inheritence from main text style sheet */
}
.multi_drop_menus li {
 float:left;  /*causes the list to align horizontally instead of stack */
 list-style-type:none; /* removes the bullet off each list item */
 position:relative; /* positioning context for the absolutely positioned drop-down */
 }
.multi_drop_menus a {
 display:block; /* makes link fill li so entire area is "hot" */
 text-decoration:none;  /* removes the underlining from the links */
 }
/* the horizontal menu ends here */
/* the drop-downs starts here */
.multi_drop_menus ul li ul { 
 position:absolute;     /* positions the drop-down ul in relation to its relatively positioned li parent */
 border:0;         			/* stops inheritance from level 1 ul */
 margin-left:0px;        /* stops inheritance from level 1 ul */
 }
.multi_drop_menus ul li ul li {
 width:100%;
 padding:0; /* stops inheritance */
 border-left:0; /* stops inheritance */
 border-right:0; /* stops inheritance */
 }
.multi_drop_menus ul li ul {display:none;} /* conceals the drop-down when menu not hovered */
.multi_drop_menus ul li:hover ul {
	display:block; /* shows the drop-down when the menu is hovered */
	z-index:1000; /* Safari needs this to display menu on top of other page elements */
	} 
/* pop-outs starts here */


 /* END MENU MECHANICS */
 
/* inevitable hacks for IE6  and < */
* html .multi_drop_menus {
 z-index:1; /* IE6 won't respect high z-index on abs-pos'd child (ul li ul) without this on its parent rel-pos'd element */
 }				/* see http://www.last-child.com/conflicting-z-index-in-ie6/ */
* html .multi_drop_menus ul li ul {
  z-index:400; /*ensures menu is on top of other page elements */
 }
* html .multi_drop_menus a {
/* cannot find a way to get the top level 'a' to fill the unwidthed menu choices without drop-down in IE : ( */
} 
* html .multi_drop_menus.vertical a {
/* now hasLayout in IE - works on the vert menu as container has width */
 zoom:100%;
 } 
 * html .multi_drop_menus ul ul a { /* second level of horiz menu */
 zoom:100%;  /* now IE 'haslayout" - IE now makes background hot in horizontal menus */
 }
 
/****************************************************************
*****************************************************************
stuff for the content section goes here*/

/*this ID creates the top of the content section*/
#contentTop {
	height: 30px;
	width: 960px;
	background-image:url(images/content_ends.png);
	background-position:top;
	margin-top: 20px;
}
/*this ID creates the middle of the content section*/
#contentMiddle {
	width: 960px;
	float:left;
	background-image:url(images/content_middle.png);
}

/*this ID creates the left column of the content section*/
#leftColumn {
	width: 160px;
	float:left;
}
/*this class governs the P tags in the right column*/
#leftColumn p {
	font-size: 14px;
	font-weight: bold;
	margin-top: 10px;
	padding-left: 25px;
	color:#FFF;
}
/*this ID creates the center column of the content section*/
#centerColumn {
	width: 560px;
	float:left;
	font-family:Verdana, Geneva, sans-serif;
	padding: 0px 20px;
}
#centerColumn h1 {
	color:#154F40;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 49px;
	font-weight: bold;
	line-height: 49px;
	margin-top: 0px;
	padding-bottom: 10px;
}
#centerColumn h2 {
	color: #0E634E;
	font-size: 21px;
	line-height: 21px;
	margin-bottom: -4px;
	padding: 0px;
	display:block;
	font-weight: bold;
}
#centerColumn h3 {
	color: #857A64;
	font-size: 21px;
	line-height: 21px;
	margin-bottom: -4px;
	padding-bottom: 15px;
}
#centerColumn h4 {
	color: #154F40;
	font-size: 17px;
	line-height: 18px;
	margin-bottom: -13px;
	padding: 0px;
}
#centerColumn p {
	margin-bottom: 1em;
	margin-top: 1em;
	line-height: 1.125em;
	font-size: .875em;
}
#centerColumn .green {
	color: #154F40;
}
#centerColumn ul {
	list-style-position:inside;
	font-family:"Times New Roman", Times, serif;
	font-size: 14px;
	border:#6A9287 thin solid;
	background-color:#DFE7E5;
	margin: 0px;
	padding: 5px;
}
#centerColumn ul li {
	padding: 0px 12px 15px 12px;
}
	
#centerColumn a {
	color: #0E634E;
}
#centerColumn a:hover {
	text-decoration: none;
}
#centerColumn #margin_bottom_box {
	margin-bottom: 30px;
}
/*this ID creates the right column of the content section*/
#rightColumn {
	float:right;
	width: 200px;
}
/*this class governs the P tags in the right column*/
#rightColumn p {
	font-size: 14px;
	font-weight: bold;
	margin-top: 10px;
	padding-right: 20px;
}
/*this class governs the A tags in the right column*/
#rightColumn a {
	/*color:#5A4D3C;*/
}
/*this class governs the em tags in the right column*/
#addy {
	font-style:italic;
	width: 175px;
}
/*this ID creates the bottom of the content section*/
#contentBottom {
	width: 920px;
	background-image:url(images/content_middle.png);
	background-repeat:repeat-y;
	float:left;
	padding: 20px 20px 0px 20px;
	text-align:center;
}
#bottomEdge {
	width: 960px;
	height: 40px;
	background-image:url(images/content_ends.png);
	background-position:bottom;
	float:left;
	font-size: 1px;
}
#footer {
	width: 960px;
	font-variant:small-caps;
	font-size:12px;
	color:#5A4D3C;
}
#footer a{
	color:#5A4D3C;
	text-decoration:none;
}
#footer a:hover {
	background-color: #5A4D3C;
	color: #D1B38D;
}

/**********************************************************************
***********************************************************************/
/*here is the styles for the boxes in the left column*/
/*this class contains the 160 box*/
.box160 {
	float:inherit;
}
.box160middle {
	width: 145px;
	background-image:url(images/160_box.png);
	background-repeat:repeat-y;
	padding-left: 5px;
	padding-right: 10px;
}

.box160top {
	width:160px;
	height: 10px;
	background-image:url(images/160_box.png);
	background-repeat:no-repeat;
	background-position:right top;
}
.box160bottom {
	width:160px;
	height: 16px;
	background-image:url(images/160_box.png);
	background-repeat:no-repeat;
	background-position:right bottom;
}
/**********************************************************************
***********************************************************************/
/*here is the styles for the boxes in the left column*/
/*this class contains the 160 box*/
.box200 {
	float:inherit;
	margin: 0px;
}
.box200middle {
	width: 183px;
	background-image:url(images/200_box.png);
	background-repeat:repeat-y;
	/*padding: 0px 10px 0px 5px;*/
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 5px;
	margin: 0px;
	color:#FFF;
	float:left;
}
.box200middle div {
	/*margin: -10px 0px 0px 0px;*/
	padding: 0px;
}
.box200middle div p {
	margin: 0px;
	padding: 0px;
}

.box200top {
	width:200px;
	height: 13px;
	background-image:url(images/200_box.png);
	background-repeat:no-repeat;
	background-position:right top;
	float:left;
	margin: 0px;
	padding: 0px;
}
.box200bottom {
	width:200px;
	height: 24px;
	background-image:url(images/200_box.png);
	background-repeat:no-repeat;
	background-position:right bottom;
	float:left;
	margin: 0px;
	padding: 0px;
}

#allRevButton {
	display:block;
	color:#FFF;
	text-decoration:none;
}

/*these govern the layout of thumbs on the gallery page*/
#gallery {
	width: 555px;
	height: auto;
	padding: 0px;
	margin: 0px auto 0px auto;
}
#gallery div {
	float: left;
}
#gallery img {
	width: 165px;
	height: 110px;
}

/*The following classes and styles govern the COUPON FORM*****************************
***************************************************************************************
**************************************************************************************/
/*these classes govern the coupon section (Coupon/i_coupon.php)*/
#coupon {
	border:#2E8B57 thin dashed;
	padding: 5px;
}
/*for big important words in the coupon*/
#coupon .big {
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	color:#0E634E;
}
/*for the other words in the coupon*/
#coupon p {
	margin: 8px 0px 0px 0px;
	padding: 0px;
	font-size: 14px;
	font-weight: 800;
	display: block;
	color: #000;
}
#coupon .field {
	font-size: 12px;
	width: 130px;
	background-color: #F5FFFA;
	color: #0B4A3A;
	font-family:"Courier New", Courier, monospace;
	font-variant:small-caps;
	border: #000 solid 1px;
}
#coupon .greenTxt {
	font-size: 13px;
	color: #0E634E;
	font-family:"Courier New", Courier, monospace;
	font-variant:small-caps;
}
#coupon .smallTxt {
	font-size: 12px;
}
#coupon a {
	font-size: 10px;
	color: #2E8B57;
}
#coupon select {
	font-family: "Arial Narrow", Arial, sans-serif;
	font-size: 16px;
  	font-variant:small-caps;
 	background-color: #F5FFFA; 
 	color: #0B4A3A; 
 	border: 1px solid #000;
 	width: 130px;
}
#coupon input[type=submit] {
	height: 30px;
	width: 100px;
	background: transparent;
	background-image: url(images/navigation_bg.png);
	/*background-position: 0px -35px;*/
	font-family:Georgia, "Times New Roman", Times, serif;
	font-variant:small-caps;
	font-size:14px;
	border: 0px;
	color:#FFF;
	cursor: pointer; /* hand-shaped cursor */
  	cursor: hand; /* for IE 5.x */
}

/*The following classes and styles govern the PHONE NUMBERS section**********************
*****************************************************************************************
*****************************************************************************************/
/*these classes govern the list of counties and phone numbers at the bottom of each page (i_phoneNumbers.php)*/
.phone_numbers {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding: 0px;
	/*display: inline-table;
	background-color:#00F;
	border: #0F0 1px solid;*/
}

.phone_numbers ul {
	/*text-align: center;
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	width: 370px;*/
	font-size: 18px;
	font-weight: bold;
	line-height: 1.1em;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 0px;
	padding: 0px;
}
.phone_numbers  ul  li    {
	list-style-type: none;
	float: left;
	padding: 0px;
	margin-top: 15px;
	width: 200px;
	color: #5A4D3C;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
}
.phone_numbers  ul  li a   {
	color: #5A4D3C;
	text-decoration:none;
}
.phone_numbers  ul  li a:hover  {
	text-decoration:underline;
}

/*These classes and styles govern the contact form on contact.php*************************
******************************************************************************************
******************************************************************************************/
/*the following set of classes and ids govern the contact form*/
  #contact {
	  width: 361px;
  }
  #contact .top {
	  height: 46px;
	  width: 361px;
	  background-image: url(images/contactBG.png);
	  background-repeat:no-repeat;
	  background-position: -361px 0px;
	  margin: 0px;
	  padding: 0px;
	  float:left;
  }
  #contact .middle {
	  background-image: url(images/contactBG.png);
	  background-repeat:repeat-y;
	  margin: 0px;
	  padding: 0px;
	  height:auto;
	  width: 361px;
	  float:left;
  }
  #contact .content {
	padding: 0px 10px 0px 10px;
	margin: 0px;
	font-family:"Comic Sans MS", cursive;
	color:#3C1E00;
  }
  #contact .content #Cname, #Cemail, #Cmessage {
	margin-left: 5px;
	width: 325px;
	border:#A5946C solid 1px;
	background-color:#F1E3B6;
	font-family:"Comic Sans MS", cursive;
	color:#3C1E00;
  }
  #contact .content #Cphone, #Ctown {
	margin-left: 5px;
	border:#A5946C solid 1px;
	background-color:#F1E3B6;
	font-family:"Comic Sans MS", cursive;
	color:#3C1E00;
  }
  #contact .content input[type=submit], #contact .content input[type=reset] {
	width: 75px;
	border: 0px;
	height: 30px;
	background: transparent;
	background-image: url(images/navigation_bg.png);
	/*background-position: 0px -35px;*/
	font-family:Georgia, "Times New Roman", Times, serif;
	font-variant:small-caps;
	font-size:14px;
	color:#FFF;
	cursor: pointer; /* hand-shaped cursor */
  	cursor: hand; /* for IE 5.x */
  }
  #contact .content .error {
	  color: #F00;
	  font-weight:bold;
  }
  #contact .bottom {
	  height: 46px;
	  width: 361px;
	  background-image: url(images/contactBG.png);
	  background-repeat:no-repeat;
	  background-position: -721px 0px;
	  margin: 0px 0px 50px 0px;
	  padding: 0px;
	  float:left;
  }



/*****************************************************************************************
*******************************************************************************************/
/*extras*/

/*this is the class for showing the star background for reviews, full star15 is 75*15; full star20 is 100*20; and full star30 is 150*30 */

.star15 {
	background-image:url(images/stars.png);
	background-position: 0px -130px;
	background-repeat:repeat-x;
	width: 75px;
	height: 15px;
	text-align: left;
}
.star15 img{
	background-image:url(images/stars.png);
	background-position: 0px -145px;
	background-repeat:repeat-x;
	height: 15px;
	border: none;
}
.star20 {
	background-image:url(images/stars.png);
	background-position: 0px -90px;
	background-repeat:repeat-x;
	width: 100px;
	height: 20px;
	text-align: left;
}
.star20 img {
	background-image:url(images/stars.png);
	background-position: 0px -110px;
	background-repeat:repeat-x;
	height: 20px;
	border: none;
}
.star30 {
	background-image:url(images/stars.png);
	background-position: 0px -30px;
	background-repeat:repeat-x;
	width: 150px;
	height: 30px;
	text-align: left;
}
.star30 img {
	background-image:url(images/stars.png);
	background-position: 0px -60px;
	background-repeat:repeat-x;
	height: 30px;
	border: none;
}




/*this class is for hiding images at the bottom for the purpose of preloading them into the cache*/
.hiddenPic {
	display:none;
}



/*this set of classes create a drop shadow effect for the contents of the div*/
.shadow {
  /*width: 90%;*/
  float:left;
  background: url(images/dropshadow.png) no-repeat bottom right  !important;
  margin: 10px 0 0 10px !important;
  margin: 10px 0 0 5px;
  }

.shadow div {
  background: none !important;
  background: url(images/dropshadow_top.gif) no-repeat left top;
  padding: 0 !important;
  padding: 0 6px 6px 0;
  }
  
.shadow p {
	background-color: #fff;
	border: 1px solid #a9a9a9;
	padding: 4px;
	margin: -6px 6px 6px -6px !important;
	margin: 0;
}

.shadow img {
  background-color: #fff;
  border: 1px solid #a9a9a9;
  padding: 4px;
  margin: -6px 6px 6px -6px !important;
  margin: 0;
  }
 
/* SpryAccordion.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main Accordion container. For our default style,
 * we draw borders on the left, right, and bottom. The top border of the Accordion
 * will be rendered by the first AccordionPanelTab which never moves.
 *
 * If you want to constrain the width of the Accordion widget, set a width on
 * the Accordion container. By default, our accordion expands horizontally to fill
 * up available space.
 *
 * The name of the class ("Accordion") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * Accordion container.

.Accordion {
	border-left: solid 1px #8D8672;
	border-right: solid 1px #8D8672;
	border-bottom: solid 1px #8D8672;
	overflow: hidden;
}
if there is any content that does not fit, hide it */
.Accordion {
	overflow: hidden;
}


/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
 *
 * The name of the class ("AccordionPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel container.

set the padding for the whole accordian, best to leave it at 0*/
.AccordionPanel {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the AccordionPanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open a specific panel.
 *
 * The name of the class ("AccordionPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel tab container.

.AccordionPanelTab {
	background-color: #ADA89A;
	border-top: solid 1px #8D8672;
	border-bottom: solid 1px #8D8672;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
}
 This is the CSS for the CLOSED panels*/
.AccordionPanelTab {
	text-align: center;
	margin: 0px;
	padding: 0px;
	cursor: pointer; /*make the cursor a hand in N6+*/
	cursor: hand; /*for IE 5.0+*/
	-moz-user-select: none;
	-khtml-user-select: none;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #fff;
	font-weight: 500;
	font-size:16px;
	height: 100px;/*the panel content won't display in IE8 or FF3 unless a height is set*/
}
.AccordionPanelTab .phone {
	font-size: 25px;
}
/* This is the selector for a Panel's Content area. It's important to note that
 * you should never put any padding on the panel's content area if you plan to
 * use the Accordions panel animations. Placing a non-zero padding on the content
 * area can cause the accordion to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
 * Content container.
 *
 * The name of the class ("AccordionPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel content container.

.AccordionPanelContent {
	background-image: url(../images/quote.gif);
	overflow: auto;
	margin: 0px;
	padding: 0px;
	height: 100px;
}
 This is the CSS for the CONTENT section of the OPEN panel*/
.AccordionPanelContent {
	margin: 0px;
	padding: 0px;
	font-size:14px;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "AccordionPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the Accordion.
 
 this is the CSS for the TAB section of the OPEN panel*/
.AccordionPanelOpen .AccordionPanelTab {
	
	
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.

this is the CSS for the roll over state for the TAB section of the CLOSED and OPEN panels */
.AccordionPanelTabHover {
	font-size:16px;
	color: #CCC;
}
.AccordionPanelOpen .AccordionPanelTabHover {
	
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * Accordion has focus. The "AccordionFocused" class is programatically added and removed
 * whenever the Accordion gains or loses keyboard focus.

.AccordionFocused .AccordionPanelTab {
	background-color: #3399FF;
}
 */
/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.

.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
	background-color: #33CCFF;
}
 */
 
 /*********************************************************************************
 **********************************************************************************
 *********************************************************************************/
 /*this section controls the light box*/
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/siteParts/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/siteParts/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
#lightposition {
	text-align: center;
	width: 410px;
	margin-left: 55px;
}
 
 
/* SpryCollapsiblePanel.css - version 0.5 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
	width:200px;
	overflow:hidden;
/*	border-left: solid 1px #CCC;
	border-right: solid 1px #999;
	border-top: solid 1px #999;
	border-bottom: solid 1px #CCC;*/
}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
/*.CollapsiblePanelTab {
	font: bold 0.7em sans-serif;
	background-color: #DDD;
	border-bottom: solid 1px #CCC;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
}*/

.CollapsiblePanelTab {
	text-align: center;
	margin: 0px;
	padding: 0px;
	cursor: pointer; /*make the cursor a hand in N6+*/
	cursor: hand; /*for IE 5.0+*/
	-moz-user-select: none;
	-khtml-user-select: none;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #fff;
	font-weight: 500;
	font-size:16px;
	height: 100px;/*the panel content won't display in IE8 or FF3 unless a height is set*/
}
.CollapsiblePanelTab .phone {
	font-size: 25px;
}
.CollapsiblePanelTab .countyName {
	/*float: left;*/
}
.CollapsiblePanelTab .star15 {
	clear:both;
	float: left;
	margin-left:50px;
}
.CollapsiblePanelTab a {
	font-weight: normal;
	font-size: 13px;
	text-decoration:none;
	display:block;
	color:#FFF;
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px;
	padding: 0px;
	width:200px;
	height:250px;
	overflow:auto;
}

.CollapsiblePanelContent a {
	color:#5A4D3C;
	text-decoration:none;
}
.CollapsiblePanelContent a:hover {
	color:#937D62;
	text-decoration: underline;
}
.CollapsiblePanelContent a:visited {
	color:#000;
	text-decoration: none;
}
.CollapsiblePanelContent ul {
	margin-top:0px;
	margin-bottom:1em;
	list-style:none;
}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
/*	color: black;
	text-decoration: none;*/
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
/*	background-color: #EEE;*/
}

/* This is an example of how to change the appearance of the panel tab when the
 * CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed
 * whenever the CollapsiblePanel is closed.
 */

.CollapsiblePanelClosed .CollapsiblePanelTab {
 /* background-color: #EFEFEF */
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	color: #CCC;
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	/*background-color: #3399FF;*/
}
 