/*

	**  **           **  ************
	**   **         **   ************
	**    **       **         **
	**     **     **          **
	**      **   **           **
	**       ** **            **
	**        ***             **

*/


/************************************************\
 ******************** LAYOUT ********************
\************************************************/

/*	Created: Date & Time
 *	Author: Firstname Lastname <url>
 *
 *	Updated: Firstname Lastname (Date & Time)
*/


/*	LAYOUT
 *	----------------------------------------------
*/

	*
	{
		margin: 0;
		padding: 0;
	}
	
	#container
	{
		width: 980px;
 		margin: 0 auto;
	}

	/* --- header */
	#header
	{
		position: relative;
		height: 136px;
	}
	#header #logo
	{
		float: left;
		margin: 28px 0 0;
	}

	/* --- navigation */
	#nav
	{
		position: absolute;
		bottom: 16px;
		right: 5px;
		height: 30px;
		margin: 0;
		padding: 0;
	}
	#nav li
	{
		float: left;
		list-style: none;
		margin: 0 0 0 10px;
		padding: 0;
	}
	#nav li a
	{
		display: block;
		height: 30px;
		color: #27479e;
		font-family: 'MyriadProCondensed';
		font-size: 1.25em;
		text-decoration: none;
		text-indent: -999em;
		background: url(../images/bg-nav.gif) no-repeat;
	}

	/* off state */
	#nav li a.home 
	{ 
		width: 54px; 
		background-position: 0 0; 
	}
	#nav li a.features 
	{ 
		width: 69px; 
		background-position: -63px 0; 
	}
	#nav li a.clients 
	{ 
		width: 59px; 
		background-position: -141px 0; 
	}
	#nav li a.demo 
	{ 
		width: 54px; 
		background-position: -209px 0; 
	}
	#nav li a.partners 
	{ 
		width: 69px; 
		background-position: -272px 0; 
	}
	#nav li a.faq 
	{ 
		width: 41px; 
		background-position: -350px 0; 
	}
	#nav li a.contact 
	{ 
		width: 64px; 
		background-position: -400px 0; 
	}

	/* hover state */
	#nav li a.home:hover
	{ 
		width: 54px; 
		background-position: 0 -30px; 
	}
	#nav li a.features:hover
	{ 
		width: 69px; 
		background-position: -63px -30px; 
	}
	#nav li a.clients:hover
	{ 
		width: 59px; 
		background-position: -141px -30px; 
	}
	#nav li a.demo:hover
	{ 
		width: 54px; 
		background-position: -209px -30px; 
	}
	#nav li a.partners:hover
	{ 
		width: 69px; 
		background-position: -272px -30px; 
	}
	#nav li a.faq:hover
	{ 
		width: 41px; 
		background-position: -350px -30px; 
	}
	#nav li a.contact:hover
	{ 
		width: 64px; 
		background-position: -400px -30px; 
	}

	/* on state */
	#nav li.on a.home 
	{  
		background-position: 0 -60px; 
	}
	#nav li.on a.features 
	{ 
		background-position: -63px -60px; 
	}
	#nav li.on a.clients 
	{ 
		background-position: -141px -60px; 
	}
	#nav li.on a.demo 
	{ 
		background-position: -209px -60px; 
	}
	#nav li.on a.partners 
	{ 
		background-position: -272px -60px; 
	}
	#nav li.on a.faq 
	{ 
		background-position: -350px -60px; 
	}
	#nav li.on a.contact 
	{ 
		background-position: -400px -60px; 
	}

	/* --- banner */
	#banner
	{
		height: 315px;
	}

	/* --- content */
	#content .col
	{
		float: left;
		margin: 40px 0 0;
	}
	#content .how
	{
		width: 730px;
		padding: 0 20px 0 10px;
	}
	#content .already
	{
		width: 220px;
		padding: 0 20px;
	}
	#content .updates
	{
		width: 210px;
		padding: 0 20px 0 10px;
	}
	#content .more
	{
		width: 212px;
	}

	/* --- how */

	.how #howFade li
	{
		margin: 0 0 15px;
	}
	
	#content .how #btnFind a
	{
		display: block; 
		width: 108px; 
		height: 30px; 
		text-indent: -999em;
		cursor: pointer;
		background: url(../images/btn-how.gif) 0 0 no-repeat; 
	}
	#content .how #btnFind a:hover
	{
		background: url(../images/btn-how-hover.gif) 0 0 no-repeat; 
	}

	#clientSlide
	{
		float: left;
		margin: 20px 0;
		height: 136px;
		overflow: hidden;
	}
	#clientSlide ul li
	{
		float: left;
		text-align: center;
		margin: 0 41px 0 0;
	}

	#clientSlide ul li img
	{
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		border: 1px solid #ccc;	
	}

	/* --- updates */
	#content .updates #btnFull
	{
		margin: 0;
		padding: 0;
	}
	#content .updates #btnFull a
	{
		display: block; 
		width: 104px; 
		height: 30px; 
		text-indent: -999em;
		cursor: pointer;
		background: url(../images/btn-more-tweets.gif) 0 0 no-repeat; 
	}
	#content .updates #btnFull a:hover
	{
		background: url(../images/btn-more-tweets-hover.gif) 0 0 no-repeat; 
	}
	#content .updates ul
	{
		margin: 0;
		padding: 0;
	}
	#content .updates li
	{
		margin: 0 0 1.5em;
	}

	/* --- buttons */
	#content ul#buttons 
	{
		margin: 0;
		padding: 0;
	}				
	#content ul#buttons li 
	{
		list-style: none;
		margin: 0 0 7px 2px;
	}
	#content ul#buttons li a 
	{
		display: block; 
		width: 208px; 
		height: 30px; 
		text-indent: -999em;
		cursor: pointer;					
	}
	#content a.intro_video 
	{
		background: url(../images/btn-intro-video.gif) 0 0 no-repeat; 
	}	
	#content a.intro_video:hover 
	{ 
		background: url(../images/btn-intro-video-hover.gif) 0 0 no-repeat; 
	}						
	#content a.online_demonstration 
	{
		background: url(../images/btn-online-demo.gif) 0 0 no-repeat; 
	}	
	#content a.online_demonstration:hover 
	{ 
		background: url(../images/btn-online-demo-hover.gif) 0 0 no-repeat; 
	}
	#content a.example_associations 
	{
		background: url(../images/btn-example-associations.gif) 0 0 no-repeat; 
	}	
	#content a.example_associations:hover 
	{ 
		background: url(../images/btn-example-associations-hover.gif) 0 0 no-repeat; 
	}	
	#content a.request_quotation 
	{
		background: url(../images/btn-request-quotation.gif) 0 0 no-repeat; 
	}	
	#content a.request_quotation:hover 
	{ 
		background: url(../images/btn-request-quotation-hover.gif) 0 0 no-repeat; 
	}
	#content a.download_brochure 
	{
		background: url(../images/btn-download-brochure.gif) 0 0 no-repeat; 
	}	
	#content a.download_brochure:hover 
	{ 
		background: url(../images/btn-download-brochure-hover.gif) 0 0 no-repeat; 
	}

	/* --- footer */
	#footer
	{
		float: left;
		width: 954px;
		padding: 13px;
		background: url(../images/bg-footer.gif) 0 0 no-repeat; 
	}
	#footer p
	{
		float: left;
		padding: 0 5px;
	}
	#footer a
	{
		color: #666;
		text-decoration: none;
	}
	#footer a:hover
	{
		text-decoration: underline;
	}
	#footer form
	{
		float: right;
		width: 216px;
	}
	#footer form label
	{
		display: none;
	}
	#footer form input
	{
		float: left;
		width: 135px;
		margin: 0;
		padding: 10px;
		color: #999;
		background: url(../images/bg-search.gif) 0 0 no-repeat;
		border: 0;
	}
	#footer form button
	{
		float: left;
		width: 56px; 
		height: 30px;
		margin: 0 0 0 5px; 
		text-indent: -999em;
		cursor: pointer;
		border: 0;
		background: url(../images/btn-search.gif) 0 0 no-repeat; 
	}
	#footer form button:hover
	{
		background: url(../images/btn-search-hover.gif) 0 0 no-repeat; 
	}
	#footer ul#sections
	{
		float: left;
		width: 944px;
		margin: 17px 5px;
		padding: 0;
	}
	#footer ul#sections li
	{
		float: left;
		margin: 0 1.7em 0 0;
	}
	#footer ul#sections li.end
	{
		margin: 0;
	}
	#footer ul#sections li.end li
	{
		width: 108px;
	}
	#footer ul#sections li a
	{
		display: block;
		text-decoration: none;
		margin: 0 0 1em; 
		color: #27479e;
		font-size: 13px;
		font-weight: bold;  
		line-height: 1.7em; 
	}
	#footer ul#sections li li
	{
		float: none;
		margin: 0;
		padding: 0;
		width: 120px;
	}
	#footer ul#sections li li a
	{
		display: block;
		padding: 0 0 0 20px;
		background: url(../images/bullet.gif) 0 3px no-repeat;
		color: #666;
		font-size: 11px;
		font-weight: normal;
		line-height: 1.2em;
	}
	#footer ul#sections li li a:hover
	{
		color: #27479e;
		text-decoration: underline;
	}
	

/*	ERRORS  - DO NOT REMOVE, MAY EDIT!!!
 *	----------------------------------------------
*/

	div.sbError
	{
		display: inline-block;
		width: auto !important;
		margin: 0 0 1em;
		padding: 8px 10px 8px 35px;
		border: 1px solid #ffacad;
		background: #ffd5d5 url(../images/alert-icon.gif) 10px 50% no-repeat;	
		color: #d23755;
	}
	
	/* 
	   cart vouchers important message 
	   note do not remove !important or it will revert to old styling
	*/
	div.messageBox
	{
		display: inline-block;
		width: auto !important;
		margin: 0 0 1em !important;
		padding: 8px 10px !important;
		border: 1px solid #ffacad !important;
		background-color: #ffd5d5 !important;
		color: #d23755 !important;
	}
	div.messageBoxShade
	{
		border: none !important;
		padding: 0 !important;
		font-size: 14px !important;
	}
	div.messageBoxShade ul,
	div.messageBoxShade ul li
	{
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	div.messageBoxHeading
	{
		margin: 0 !important;
		text-indent: 0 !important;
	}




	#introBoxes
	{
		position: relative;
		width: 980px;
		height: 265px;
		background: url(../images/ao-banner-bg.gif) 0 0 no-repeat;
		overflow: hidden;
	}
	.introPart
	{
		position: relative;
		display: none;
		float: left;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	#introWelcome
	{
		display: block;
	}
	
	#introNav
	{
		position: relative;
		height: 56px;
	}
	#introNav ul.nav
	{
		position: absolute;
		top: 35px;
		left: 0;
		width: 100%;
		height: 30px;
		margin: 0;
	}	
	#introNav .nav li
	{
		margin: 0;
		padding: 0;
		list-style: none;
		position: absolute;
		top: 0;
		left: 0;
		text-align: center;
		background: none;
	}
	#introNav .nav li a
	{
		color: #2a459c;
		font-size: 12px;
		font-family: "Lucida Grande", Arial, Helvetica, sans-serif;
		font-style: italic;
		outline: 0;
		text-decoration: none;
	}
	#introNav .nav .p1
	{
		left: 8px;
	}
	#introNav .nav .p2
	{
		left: 140px;
	}
	#introNav .nav .p3
	{
		left: 305px;
	}
	#introNav .nav .p4
	{
		left: 435px;
	}
	#introNav .nav .p5
	{
		left: 600px;
	}
	#introNav .nav .p6
	{
		left: 762px;
	}
	#introNav .nav .p7
	{
		left: 892px;
	}
	#introNav .nav .p8
	{
		left: 882px;
	}
	
	#timeline
	{
		position: absolute;
		top: 15px;
		left: 0;
		overflow: hidden;
		width: 100%;
		height: 15px;
		background: transparent url(timeline.png) no-repeat 0 0;
	}
	#timeline .inside
	{
		width: 980px;
		height: 100%;
		position: relative;
		background: transparent url(timeline.png) no-repeat -980px -42px;
	}
	
	
	/* slide1 */
	#introWelcomeText
	{
		position: absolute;
		top: 86px;
		left: 68px;
		width: 299px;
		height: 83px;
		background: url(../images/slide1-text1.png) 0 0 no-repeat;
	}
	#introWelcomeButtons
	{
		position: absolute;
		top: 158px;
		left: 71px;
	}
	#introWelcomePicture
	{
		position: absolute;
		top: 0;
		right: 0;
		width: 381px;
		height: 265px;
		background: url(../images/slide1-pic1.png) 0 0 no-repeat;
	}	

		/* welcome buttons */
		.empowerButton,
		.rewardButton
		{
			width: 415px;
			height: 65px;
			background: url(../images/empower-btn.gif) 0 0 no-repeat;
		}
		.rewardButton
		{
			background: url(../images/reward-btn.gif) 0 0 no-repeat;
		}
	
	
	/* slide2 */
	#introMembershipText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 399px;
		height: 71px;
		background: url(../images/slide2-text1.png) 0 0 no-repeat;
	}
	#introMembershipButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introMembershipPicture
	{
		position: absolute;
		top: 0;
		right: 0;
		width: 400px;
		height: 265px;
		background: url(../images/slide2-pic1.png) 0 0 no-repeat;
	}
	
		/* membership buttons */
		.membersDatabaseButton
		{
			width: 96px;
			height: 65px;
			background: url(../images/members-database-btn.gif) 0 0 no-repeat;
		}
		.onlineJoinRenewalButton
		{
			width: 105px;
			height: 65px;
			background: url(../images/online-join-renewal-btn.gif) 0 0 no-repeat;
		}
		.membershipReportingButton
		{
			width: 114px;
			height: 65px;
			background: url(../images/membership-reporting-btn.gif) 0 0 no-repeat;
		}
		.memberDirectoryButton
		{
			width: 93px;
			height: 65px;
			background: url(../images/member-directory-btn.gif) 0 0 no-repeat;
		}
		
		
	/* slide3 */
	#introEventsText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 280px;
		height: 71px;
		background: url(../images/slide3-text1.png) 0 0 no-repeat;
	}
	#introEventsButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introEventsPicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 425px;
		height: 228px;
		background: url(../images/slide3-pic1.png) 0 0 no-repeat;
	}
	
		/* events buttons */
		.eventCalendarButton
		{
			width: 90px;
			height: 65px;
			background: url(../images/event-calendar-btn.gif) 0 0 no-repeat;
		}
		.onlineEventRegistrationButton
		{
			width: 112px;
			height: 65px;
			background: url(../images/online-event-registration-btn.gif) 0 0 no-repeat;
		}
		.myEventsButton
		{
			width: 96px;
			height: 65px;
			background: url(../images/my-events-btn.gif) 0 0 no-repeat;
		}
		.conferencesAbstractsButton
		{
			width: 120px;
			height: 65px;
			background: url(../images/btn-conference-management.gif) 0 0 no-repeat;
		}
	
	
	/* slide4 */
	#introPDText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 345px;
		height: 73px;
		background: url(../images/slide4-text1.png) 0 0 no-repeat;
		z-index: 99;
	}
	#introPDButtons
	{
		position: absolute;
		top: 150px;
		left: 68px;
	}
	#introPDPicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 422px;
		height: 265px;
		background: url(../images/slide4-pic1.png) 0 0 no-repeat;
		z-index: 1;
	}
	
		/* pd buttons */
		.professionalDevelopmentButton
		{
			width: 118px;
			height: 65px;
			background: url(../images/professional-development-btn.gif) 0 0 no-repeat;
		}
		.myPDPortfolioButton
		{
			width: 112px;
			height: 65px;
			background: url(../images/btn-professional-networking.gif) 0 0 no-repeat;
		}
		.complianceTrackingButton
		{
			width: 105px;
			height: 65px;
			background: url(../images/compliance-tracking-btn.gif) 0 0 no-repeat;
		}
		
		
	/* slide5 */
	#introDocsText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 422px;
		height: 71px;
		background: url(../images/slide5-text1.png) 0 0 no-repeat;
	}
	#introDocsButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introDocsPicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 400px;
		height: 265px;
		background: url(../images/slide5-pic1.png) 0 0 no-repeat;
	}
	
		/* docs buttons */
		.goveranceBoardDocsButton
		{
			width: 110px;
			height: 65px;
			background: url(../images/goverance-board-docs-btn.gif) 0 0 no-repeat;
		}
		.journalOnlineButton
		{
			width: 77px;
			height: 65px;
			background: url(../images/journal-online-btn.gif) 0 0 no-repeat;
		}
		.searchableArchivesButton
		{
			width: 101px;
			height: 65px;
			background: url(../images/searchable-archives-btn.gif) 0 0 no-repeat;
		}
		.onlinePublishingButton
		{
			width: 101px;
			height: 65px;
			background: url(../images/online-publishing-btn.gif) 0 0 no-repeat;
		}
	
	
	/* slide6 */
	#introSocialText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 233px;
		height: 73px;
		background: url(../images/slide6-text1.png) 0 0 no-repeat;
	}
	#introSocialButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introSocialPicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 415px;
		height: 265px;
		background: url(../images/slide6-pic1.png) 0 0 no-repeat;
	}
	
		/* social buttons */
		.specialInterestGroupsButton
		{
			width: 122px;
			height: 65px;
			background: url(../images/btn-content-management.gif) 0 0 no-repeat;
		}
		.communitiesOfPracticeButton
		{
			width: 122px;
			height: 65px;
			background: url(../images/btn-document-management.gif) 0 0 no-repeat;
		}
		.blogsForumsButton
		{
			width: 81px;
			height: 65px;
			background: url(../images/blogs-forums-btn.gif) 0 0 no-repeat;
		}
	
	
	/* slide7 */
	#introEcommerceText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 360px;
		height: 95px;
		background: url(../images/slide7-text1.png) 0 0 no-repeat;
	}
	#introEcommerceButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introEcommercePicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 437px;
		height: 265px;
		background: url(../images/slide7-pic1.png) 0 0 no-repeat;
	}
	
		/* ecommerce buttons */
		.onlineStoreButton
		{
			width: 98px;
			height: 65px;
			background: url(../images/btn-order-processing.gif) 0 0 no-repeat;
		}
		.automatedInvoicingButton
		{
			width: 105px;
			height: 65px;
			background: url(../images/automated-invoicing-btn.gif) 0 0 no-repeat;
		}
		.donationsButton
		{
			width: 100px;
			height: 65px;
			background: url(../images/donations-btn.gif) 0 0 no-repeat;
		}
		
		
	/* slide8 */
	#introCommsText
	{
		position: absolute;
		top: 48px;
		left: 68px;
		width: 449px;
		height: 71px;
		background: url(../images/slide8-text1.png) 0 0 no-repeat;
	}
	#introCommsButtons
	{
		position: absolute;
		top: 150px;
		left: 71px;
	}
	#introCommsPicture
	{
		position: absolute;
		bottom: 0;
		right: 0;
		width: 393px;
		height: 265px;
		background: url(../images/slide8-pic1.png) 0 0 no-repeat;
	}
	
		/* comms buttons */
		.newsletterButton
		{
			width: 79px;
			height: 65px;
			background: url(../images/btn-online-surveys.gif) 0 0 no-repeat;
		}
		.emailMarketingButton
		{
			width: 98px;
			height: 65px;
			background: url(../images/email-marketing-btn.gif) 0 0 no-repeat;
		}
		.contentManagementButton
		{
			width: 105px;
			height: 65px;
			background: url(../images/btn-association-journal.gif) 0 0 no-repeat;
		}
	
	
	.text h1,
	.text h2
	{
		display: none;
	}
	.buttons ul,
	.buttons ul li
	{
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}
	.buttons li
	{
		float: left;
	}
	.buttons li a
	{
		display: block;
		margin: 0 15px 0 0;
		text-indent: -999em;
	}
	
	#introNav .nav a .point
	{
		display: block;
		width: 15px;
		height: 15px;
		position: absolute;
		top: -20px;
		left: 0;
		text-indent: -999em;
		outline: 0;
		cursor: pointer;
	}
	#introNav .nav .p1 .point
	{
		left: 20px;
	}
	#introNav .nav .p2 .point
	{
		left: 30px;
	}
	#introNav .nav .p3 .point
	{
		left: 14px;
	}
	#introNav .nav .p4 .point
	{
		left: 45px;
	}
	#introNav .nav .p5 .point
	{
		left: 40px;
	}
	#introNav .nav .p6 .point
	{
		left: 19px;
	}
	#introNav .nav .p7 .point
	{
		left: 32px;
	}
	#introNav .nav .p8 .point
	{
		left: 46px;
	}

	.twtr-timeline
	{
		height: auto !important;
	}

	.twtr-tweet-text
	{
		font-size: 11px !important;
	}
