@charset "UTF-8";

/* 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 and expands horizontally to fill up available space. 
*/
/* If you want to constrain the width of the CollapsiblePanel widget, set a width on the CollapsiblePanel container.*/

/* 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 a CollapsiblePanel panel tab container.*/
   /*CURRENLTY NOT USING A BORDER*/
   /*BACKGROUND IS CONTROLED BY H3 STYLES IN MAIN STYLE SHEET*/
 
	.CollapsiblePanel 
	{ 
		/*border-bottom-width: thick; 
		border-bottom-style: solid; 
		border-bottom-color: #004566;*/ 
	}
 
	.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;
	}

/* 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: 10px; 
		padding: 0px;  	
	}

/* 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, .CollapsiblePanelOpen .CollapsiblePanelTab h3 
	{
		/*background-color: #EEE;*/
		background-image:url(../images/up_arrow.gif);
		background-repeat: no-repeat;
		background-position: 98% 50%;
	}

/* 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. */
   
/*DOWN ARROW ICON ADDED TO RIGHT OF PANEL TAB IN CLOSED STATE THIS IS THE BACKGROUND IMAGE*/

	.CollapsiblePanelClosed .CollapsiblePanelTab, .CollapsiblePanelClosed .CollapsiblePanelTab h3 
	{
 		background-image:url(../images/down_arrow.gif);
		background-repeat: no-repeat;
		background-position: 98% 50%;
	}

/* 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. */
/*   CURRENLTY NOT USED FOR .CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover */   

   /*.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover, */
   .CollapsiblePanelTabHover h3, 
   .CollapsiblePanelTabHover .re1, 
   .CollapsiblePanelTabHover .re2, .CollapsiblePanelTabHover .re3, .CollapsiblePanelTabHover .re4,  
   .CollapsiblePanelTabHover .re5, .CollapsiblePanelTabHover .re6, .CollapsiblePanelTabHover .re7 
   {
		background-color: #668FA3;
		border:#668FA3;
	}

/* 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. */
   /*CURRENTLY NOT USED*/
   
	.CollapsiblePanelFocused .CollapsiblePanelTab 
	{
		/*background-color: #3399FF;*/
	}