@charset "utf-8";
/*  ---------------------------------------
	
	main.css
	````````
	main stylesheets document for
	Project Name!
	
    ---------------------------------------  */


/*  ---------------------------------------
	Global Reset
	- - - - - - - - - - - - - - - - - - - -  */

		html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: none; text-decoration: none; }
		
		

/*  ---------------------------------------
	Global rules and typography
	- - - - - - - - - - - - - - - - - - - -  */
	
		body {
			background: url(../images/body-bg.jpg) center -102px no-repeat;
		}
		
		#container {
			width: 960px;
			height: 582px;
			margin: 20px auto 60px auto;
			background: url(../images/container-bg.gif) no-repeat;
			position: relative;
		}
		
		.hidden { display: none; }
		.clear { height: 1%; clear: both; }
		.left { float: left; }
		.right { float: right; }
		
		.clearfix:after {
			content: ".";
			display: block;
			height: 0;
			clear: both;
			visibility: hidden;
		}
		
		.clearfix {display: inline-block;}
		.no-background { background: none !important; }
		
		/* Hides from IE-mac \*/
		* html .clearfix {height: 1%;}
		.clearfix {display: block;}
		/* End hide from IE-mac */
		
		



/*  ---------------------------------------
	Header
	- - - - - - - - - - - - - - - - - - - -  */
	
		#header {
			position: absolute;
			left: 25px;
			top: 30px;
			width: 908px;
			height: 88px;
		}
			#header h1 {
				display: block;
				text-indent: -999999px;
				width: 300px;
				height: 30px;
			}
			#header h2 {
				position: absolute;
				display: block;
				height: 41px;
				width: 145px;
				text-indent: -999999px;
				right: 10px;
				top: 20px;
				background: url(../images/ambit-logo.gif) no-repeat;
			}



/*  ---------------------------------------
	Content
	- - - - - - - - - - - - - - - - - - - -  */
	
		#content {
			width: 908px;
			height: 440px;
			position: absolute;
			left: 25px;
			top: 118px;
		}



/*  ---------------------------------------
	Slide Stage
	- - - - - - - - - - - - - - - - - - - -  */
	
		#slide-stage {
			height: 398px;
			position: relative;
			background: url(../images/stage-bg.gif) left top no-repeat;
		}
			#slide-stage.video { background: none; }
			#slide-stage.question { background-image: url(../images/stage-bg-question.gif); }
			
			#right-content {
				position: absolute;
				top: 18px;
				right: 0;
				width: 295px;
			}
				#right-content h3 {
					font-family: Arial;
					font-size: 16px;
					color: #b9dfff;
					display: block;
					width: 207px;
					padding-bottom: 10px;
					font-weight: normal;
					line-height: 22px;
					padding-left: 5px;
				}
				#right-content .name,
				#right-content .phone,
				#right-content .email a {
					display: block;
					font-size: 16px;
					font-weight: bold;
					font-family: Arial;
					padding-bottom: 0;
					color: #fff;
					padding-left: 5px;
				}
				#right-content .position {
					display: block;
					font-size: 12px;
					font-family: Arial;
					font-weight: normal;
					color: #b9dfff;
					padding-bottom: 7px;
					padding-left: 5px;
				}
				#right-content .email a {
					text-decoration: underline;
					padding: 10px 0 20px 5px;
				}
				#right-content .join-now a {
					width: 179px;
					height: 61px;
					display: block;
					text-indent: -999999px;
					background: url(../images/button-join-now.gif) left top no-repeat;
				}
				#right-content .need-more-info a {
					width: 171px;
					height: 48px;
					display: block;
					text-indent: -999999px;
					background: url(../images/button-need-more-info.gif) left top no-repeat;
				}
				#right-content .no-thanks a{
					display: block;
					width: 86px;
					height: 31px;
					text-indent: -999999px;
					background: url(../images/button-no-thanks.gif) bottom no-repeat;
				}
				
				#meet-leaders {
					padding-left: 5px;
					padding-top: 1px;
				}
					#meet-leaders p{
						display: block;
						padding-bottom: 12px;
						font-size: 12px;
						font-family: Arial;
						color: #fff;
						line-height: 17px;
					}
					#meet-leaders ul {
						display: block;
						list-style-type: none;
					}
						#meet-leaders ul li {
							display: block;
							width: 96px;
							height: 67px;
							float: left;
						}



/*  ---------------------------------------
	Slide (one: select language)
	- - - - - - - - - - - - - - - - - - - -  */
				
		#select-language.stage-content {
			width: 507px;
			height: 216px;
			position: absolute;
			top: 71px;
			left: 42px;
			background: url(../images/stage-select-lang.gif) no-repeat;
		}
			#select-language h3 {
				height: 35px;
				text-indent: -999999px;
			}
			#select-language #select-english a {
				display: block;
				width: 248px;
				height: 181px;
				text-indent: -999999px;
				float: left;
			}
			#select-language #select-espanol a {
				display: block;
				width: 248px;
				height: 181px;
				float: right;
				text-indent: -999999px;
			}



/*  ---------------------------------------
	Slide (two-five; seven: introduction / videos)
	- - - - - - - - - - - - - - - - - - - -  */
				
		#introduction.stage-content {
			position: absolute;
		}
			h4.now-playing {
				display: block;
				padding: 28px 0 0 12px;
				font-size: 15px;
				font-weight: normal;
				font-family: Arial;
				color: #b9dfff;
			}
				h4.now-playing strong {
					font-weight: bold;
					color: #e6f4ff;
				}
				
		.video-container {
			width: 544px;
			height: 331px;
		}



/*  ---------------------------------------
	Slide (six: choose state)
	- - - - - - - - - - - - - - - - - - - -  */
				
		h4.choose-state {
			display: block;
			padding: 18px 0 0 12px;
			font-family: Arial;
			font-size: 15px;
			color: #b9dfff;
			line-height: 32px;
			font-weight: normal;
		}
			h4.choose-state strong {
				display: block;
				float: left;
			}
				h4.choose-state a {
					display: block;
					float: left;
					text-indent: -999999px;
					background-repeat: no-repeat;
					background-position: center;
				}
				h4.choose-state .texas {
					width: 102px;
					background-image: url(../images/button-choose-texas.gif);
				}
				h4.choose-state .ny-il {
					width: 201px;
					background-image: url(../images/button-choose-ny-il.gif);
				}



/*  ---------------------------------------
	Slide (eight: continue presentation)
	- - - - - - - - - - - - - - - - - - - -  */
				
		#choose-next-steps.stage-content {
			position: absolute;
		}
			h4.next-steps {
				display: block;
				padding: 18px 0 0 12px;
				font-size: 15px;
				font-weight: normal;
				font-family: Arial;
				line-height: 32px;
				color: #b9dfff;
			}
				h4.next-steps strong {
					display: block;
					float: left;
				}
				h4.next-steps a {
					display: block;
					float: left;
					text-indent: -999999px;
					background-repeat: no-repeat;
					background-position: center;
					background-image: url(../images/button-continue.gif);
					width: 235px;
				}
			#directions {
				padding: 116px 108px 117px 0;
				background: url(../images/directions-arrows.gif) 200px 132px no-repeat;
			}
				#directions.continue {
					padding: 146px 0 150px 64px;
					background: url(../images/directions-continue-arrows.gif) 200px 132px no-repeat;
				}
				#directions-state {
					padding: 146px 0 150px 34px;
					background: url(../images/directions-continue-arrows.gif) 280px 132px no-repeat;
				}
				#directions strong,
				#directions-state strong {
					display: block;
					height: 33px;
					line-height: 33px;
					font-size: 17px;
					font-weight: bold;
					font-family: Arial;
					color: #c3daef;
					float: left;
				}
					#directions strong.please-click {
						padding-left: 115px;
					}
				#directions a {
					display: block;
					height: 33px;
					text-indent: -999999px;
					float: left;
					background-repeat: no-repeat;
					background-position: center top;
				}
					#directions .join-now {
						width: 137px;
						background-image: url(../images/button-choose-join-now.gif);
					}
					#directions .continue {
						width: 234px;
						background-image: url(../images/button-continue.gif);
					}
				#directions em {
					display: block;
					width: 100%;
					text-align: center;
					height: 32px;
					line-height: 32px;
					color: #c3daef;
					font-style: normal;
					clear: both;
					font-family: Arial;
				}



/*  ---------------------------------------
	Slide (11: choose get started)
	- - - - - - - - - - - - - - - - - - - -  */
				
		#choose-get-started.stage-content {
			position: absolute;
		}
			#choose-get-started #directions {
				padding: 116px 108px 117px 75px;
				background: url(../images/directions-get-started-arrows.gif) 214px 132px no-repeat;
			}
					#choose-get-started #directions strong.please-click {
						padding-left: 46px;
					}
					#directions .need-more-info {
						width: 175px;
						background-image: url(../images/button-choose-more-info.gif);
					}



/*  ---------------------------------------
	Slide (12: More Info)
	- - - - - - - - - - - - - - - - - - - -  */
				
		#more-info h3 {
			display: block;
			padding: 16px 0 18px 24px;
			font-size: 16px;
			font-weight: bold;
			color: #fff;
			font-family: Arial;
		}
		#more-info p.thanks {
			display: block;
			font-size: 12px;
			color: #fff;
			font-family: Arial;
			width: 500px;
			padding-left: 24px;
			line-height: 18px;
		}
		#more-info-form {
			width: 567px;
		}
		#form-info {
			width: 253px;
			float: right;
			padding: 5px 0 0 0;
			font-size: 11px;
			font-family: Arial;
			color: #fff;
			line-height: 18px;
		}
		#contact-info {
			display: block;
			width: 312px;
			float: left;
		}
			.normal-field {
				display: block;
				height: 35px;
				padding-left: 24px;
			}
				.normal-field strong {
					display: block;
					float: left;
					width: 84px;
					font-size: 12px;
					color: #fff;
					font-family: Arial;
					height: 31px;
					line-height: 31px;
					font-weight: normal;
				}
				.normal-field span {
					display: block;
					float: left;
					width: 188px;
					height: 31px;
					text-align: center;
					background: url(../images/normal-field-bg.gif) no-repeat;
				}
					.normal-field span input {
						width: 169px;
						display: block;
						padding: 8px;
						font-size: 12px;
						color: #9b9b9b;
						font-weight: normal;
						background: none;
						border: none;
					}
		#questions-info {
			display: block;
			clear: both;
			padding-left: 24px;
			padding-top: 10px;
		}
			.textarea-field strong {
				display: block;
				padding: 0 0 5px 0;
				font-size: 12px;
				color: #fff;
				font-family: Arial;
				font-weight: normal;
			}
			.textarea-field span {
				display: block;
				width: 545px;
				padding: 5px 0;
				background: url(../images/fieldset-bg.gif) no-repeat;
				text-align: center;
			}
				.textarea-field span textarea {
					display: block;
					height: 81px;
					width: 535px;
					text-align: left;
					background: none;
					border: none;
					font-size: 12px;
					color: #9b9b9b;
					font-weight: normal;
					background: none;
					margin: 0 auto;
				}
		#submit-info {
			display: block;
			padding: 8px 0 0 24px;
		}
			#submit-info strong {
				display: block;
				float: right;
				text-align: right;
				width: 212px;
				font-size: 12px;
				font-weight: normal;
				color: #c3daef;
				font-family: Arial;
				height: 27px;
				line-height: 27px;
			}
			#submit-info span {
				display: block;
				float: left;
				width: 90px;
			}
				#submit-info span input {
					display: block;
					width: 71px;
					height: 27px;
				}




/*  ---------------------------------------
	Slide Changer
	- - - - - - - - - - - - - - - - - - - -  */
	
		#slide-changer {
			height: 41px;
			width: 908px;
			background: url(../images/switcher-bg-top.gif) top no-repeat;
		}
			#slide-changer ul {
				display: block;
				list-style-type: none;
			}
				#slide-changer ul li {
					display: block;
					float: left;
					padding-top: 4px;
					height: 1%;
				}
					#slide-changer ul li .item {
						display: block;
						float: left;
						height: 36px;
						line-height: 32px;
						font-size: 12px;
						color: #5c819d;
						text-align: center;
						background: url(../images/changer-item-bg.gif) -328px top no-repeat;
						font-family: Arial;
					}
					
					#slide-changer #item-introduction .item {
						background-position: left top;
						width: 123px;
					}
						#slide-changer #item-introduction.past .item {
							color: #fff;
							background-position: left -36px;
						}
						#slide-changer #item-introduction.current .item {
							color: #fff;
							background-position: left bottom;
						}
					#slide-changer #item-the-opportunity .item {
						background-position: -187px top;
						width: 141px;
					}
						#slide-changer #item-the-opportunity.past .item {
							color: #fff;
							background-position: -187px -36px;
						}
						#slide-changer #item-the-opportunity.current .item {
							color: #fff;
							background-position: -187px bottom;
						}
					#slide-changer #item-the-company .item {
						background-position: -202px top;
						width: 126px;
					}
						#slide-changer #item-the-company.past .item {
							color: #fff;
							background-position: -202px -36px;
						}
						#slide-changer #item-the-company.current .item {
							color: #fff;
							background-position: -202px bottom;
						}
					#slide-changer #item-the-service .item {
						background-position: -214px top;
						width: 114px;
					}
						#slide-changer #item-the-service.past .item {
							color: #fff;
							background-position: -214px -36px;
						}
						#slide-changer #item-the-service.current .item {
							color: #fff;
							background-position: -214px bottom;
						}
					#slide-changer #item-the-income-potential .item {
						background-position: -160px top;
						width: 168px;
					}
						#slide-changer #item-the-income-potential.past .item {
							color: #fff;
							background-position: -160px -36px;
						}
						#slide-changer #item-the-income-potential.current .item {
							color: #fff;
							background-position: -160px bottom;
						}
					#slide-changer #item-the-system .item {
						background-position: -214px top;
						width: 114px;
					}
						#slide-changer #item-the-system.past .item {
							color: #fff;
							background-position: -214px -36px;
						}
						#slide-changer #item-the-system.current .item {
							color: #fff;
							background-position: -214px bottom;
						}
					#slide-changer #item-get-started .item {
						background-position: right top;
						width: 122px;
					}
						#slide-changer #item-get-started.past .item {
							color: #fff;
							background-position: right -36px;
						}
						#slide-changer #item-get-started.current .item {
							color: #fff;
							background-position: right bottom;
						}
					
					#slide-changer .current { background: url(../images/slide-current-arrow.gif) center top no-repeat; }



/*  ---------------------------------------
	Popup Overlay
	- - - - - - - - - - - - - - - - - - - -  */
	
		div.overlay {
			background:url(../images/overlay.png) no-repeat;
			padding:40px;	
			width: 589px; 
			height: 331px; 
			display:none;
		}
		
		div.overlay div.close {
			background:url(../images/close.png) no-repeat;
			position:absolute;
			top:2px;
			right:5px; 
			width:35px;
			height:35px;
			cursor:pointer;
		}
		
		a.test-video { 		
			display:block;
			height: 331px;
			width: 589px;
		}




/*  ---------------------------------------
	Footer
	- - - - - - - - - - - - - - - - - - - -  */
	
		#footer {
			display: block;
			position: absolute;
			top: 600px;
			padding: 0 40px;
		}
			#footer #legal {
				font-size: 11px;
				font-weight: bold;
				font-family: arial;
				color: #d0eaff;
				line-height: 18px;
				display: block;
				width: 660px;
				float: left;
			}
				#footer #legal a {
					color: #d0eaff;
					text-decoration: underline;
				}
			#footer #seals {
				width: 218px;
				float: right;
				text-align: right;
			}
				#footer #seals p {
					display: block;
					float: right;
					padding-left: 10px;
				}