/***********************************************************************************************************************
DOCUMENT: style/format.css
DEVELOPED BY: Ryan Stemkoski
COMPANY: Zipline Interactive
EMAIL: ryan@gozipline.com
PHONE: 509-321-2849
DATE: 2/26/2009
DESCRIPTION: This document contains the structural formatting files for the accordion style menu.
************************************************************************************************************************/

#accordionOuterWrapper {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	}

.accordionButton h3{	
    font-family: 'helvetica_neue_lt_proitalic';
    -webkit-text-stroke-width: 0 !important;
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale;
    font-synthesis: none; 
}

.accordionButton h3{
    font-size: 46px;
	padding-bottom:10px;
    color:rgba(7,123,192,1);
}
 
.accordionButton { 
	height:40px;
	padding:10px;
	margin-bottom:10px;
	width: 100%;
	float: left;
	_float: none;  /* Float works in all browsers but IE6 */
	background: #fff;
	position: relative;
	padding-right: 28px; /* room for the arrow */
	cursor: pointer;
	background-color: #eeeeee;
}

/* The arrow (points down by default = closed) */
.accordionButton::before {
	content: "";
	position: absolute;
	right: 25px;
	top: 50%;
	margin-top: -8px;
	width: 0;
	height: 0;
	border-left:16px solid transparent;
	border-right: 16px solid transparent;
	border-top: 18px solid rgba(255,212,7,1);   /* arrow color */
	transition: transform 0.2s ease;
}


/* Open state: rotate to point down */
.accordionButton.on::before {
	transform: rotate(180deg);
}
	
.accordionContent {	
	width: 100%;
	float: left;
	_float: none; /* Float works in all browsers but IE6 */
	background: #fff;
	margin:10px 0px 20px 0px; 
	}
	
/***********************************************************************************************************************
 EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/

.on {
	background: #eee;
	}
	
.over {
	background: #eee;
	}