@charset "UTF-8";

/* Spryright.css - Revision: Spry Preview Release 1.4 */

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

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

/* This is the selector for the rightPanel 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 ("rightPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * right panel container.
*/
.AccordionPanel {
	margin: 				0;
	padding: 				0;
	background-color: 		#fff;
}

/* This is the selector for the rightPanelTab. 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 ("rightPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * right panel tab container.
 */
.AccordionPanelTab {
	margin: 			0px;
	padding: 			16px 10px;
	cursor: 			pointer;
	-moz-user-select: 	none;
	-khtml-user-select: none;
	font: 				18px Arial, Helvetica, sans-serif;
	color: 				#999;
	background: 		url('../images/bg-panel-closed.jpg') top left no-repeat;
}

.AccordionPanelTab1 {
	margin: 			0px;
	padding: 			7px 10px 10px 10px;
	cursor: 			pointer;
	-moz-user-select: 	none;
	-khtml-user-select: none;
	font: 				18px Arial, Helvetica, sans-serif;
	color: 				#999;
	background: 		url('../images/bg-panel-closed.jpg') top left no-repeat;
	/*height: 40px;*/
	text-decoration:none;
}

.AccordionPanelTab1 p {
	margin: 			0px;
	padding: 			0px;
	font: 				12px/14px Arial, sans-serif;
	color: 				#999;
	text-decoration:none;
}

.AccordionPanelTab1 a, .AccordionPanelTab1 a:hover {
	font-weight:bold;
	color: 			#1d91cc;
	text-decoration:none;
	border-bottom:1px dotted #1d91cc;
	outline:none;
	}

.AccordionPanelTab1 a:hover {
		text-decoration:none;
		border-bottom:1px solid #1d91cc;
	}
	
/* 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 rights panel animations. Placing a non-zero padding on the content
 * area can cause the right to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an right *MUST* specify a height on the right Panel
 * Content container.
 *
 * The name of the class ("rightPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * right panel content container.
 */
.AccordionPanelContent {
	overflow:			auto;
	margin: 			0px 0px;
	font: 				12px/20px Arial, Helvetica, sans-serif;
	color: 				#333;
	background:			#e8e8e8 url('../images/bg-right.jpg') left bottom no-repeat;
	/*height:				359px;*/
	height:				309px;
	/*_height:			372px;*/
	/*border-left:1px solid #ccc;*/
	width:385px;
}

.AccordionPanelContent1 {
	overflow:			auto;
	margin: 			0px 0px;
	background:			#e8e8e8 url('../images/bg-right1.jpg') bottom left no-repeat;
	/*height:				374px;*/
	height:				309px;
	/*_height:			448px;*/
}

.AccordionPanelContent1 p {
	margin: 			0px 20px;
	font: 				12px/20px Arial, Helvetica, sans-serif;
	color: 				#333;
	/*text-align:left;*/
}

.AccordionPanelContent img {
	margin:				0 auto;
	border:				0;
}

.AccordionPanelContent img.lungs {
	margin:				5px 0 5px 10px;
	border:				1px solid #1b2f92;
	display:			inline;
	float:				right;
}

.AccordionPanelContent h1, .AccordionPanelContent1 h1 {
	margin: 			0px 10px 10px 10px;
	font: 				bold 14px/18px Arial, Helvetica, sans-serif;
	color: 				#1b2f92;
}

.AccordionPanelContent p, .AccordionPanelContent1 p {
	margin:  				0px 10px 15px 20px;
	font:  					12px/18px Arial, Helvetica, sans-serif;
	color:  				#333;
	/*border-left:1px solid #ccc;*/
}

.AccordionPanelContent a.panel {
color: 				#1d91cc;
	text-decoration:	none;
	border-bottomt:1px dotted #1d91cc;
}

.AccordionPanelContent a.panel:hover {
	color: 				#1b2f92;
	text-decoration:	none;
border-bottom:1px solid #1b2f92;
}

.AccordionPanelContent p.question {
	margin:  			0;
	font:  				12px/18px Arial, Helvetica, sans-serif;
	color:  			#1b2f92;
}

.AccordionPanelContent p.test {
	margin:  			0px 20px 5px 20px;
	font:  				12px/18px Arial, Helvetica, sans-serif;
	color:  			#333;
}

.AccordionPanelContent p.testauthor {
	margin:  			0px 20px 15px 20px;
	font: 				12px/18px Arial, Helvetica, sans-serif;
	color:  			#333;
	text-align:			right;
	font-style: 		italic;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "rightPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the right.
 */
.AccordionPanelOpen .AccordionPanelTab, .AccordionPanelOpen .AccordionPanelTab1 {
	background: 		url('../images/bg-panel-open.jpg') top left no-repeat;
	font: 				18px arial, helvetica, sans-serif;
	font-weight:		normal;
	color: 				#333;
	/*text-align: 		left;*/
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "rightPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.AccordionPanelTabHover, .AccordionPanelTabHover1 {
	color: 				#333;
	text-decoration:	none;
	background-color: 	#FFF;
	font-weight:		normal;
}

.AccordionPanelTabHover1 p {
	color: 				#999;
	text-decoration:	none;
	font-weight:		normal;
	border:0;
}

.AccordionPanelOpen .AccordionPanelTabHover {
	color: 				#333;
	background-color: 	#FFF;
	font-weight:		normal;
	text-decoration:	none;
}

.AccordionPanelOpen .AccordionPanelTabHover1 p {
	color: 				#333;
	background-color: 	#999;
	font-weight:		normal;
	border:0;
	text-decoration:	none;
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * right has focus. The "rightFocused" class is programatically added and removed
 * whenever the right gains or loses keyboard focus.
 */
.AccordionFocused .AccordionPanelTab {
	background-color: 	#fff;
	font-weight:		normal;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the right has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
	background-color: 	#FFF;
	font:  				18px/20px arial, helvetica, sans-serif;
	font-weight:		normal;
}
