/*****************************************************
 * Copyright 2006, Swirl, http://www.iswirl.com
 * All rights reserved
 *****************************************************/

/* wrappers */
#wrapper-login-box, #wrapper-login-box-control {
	padding: 0;
	margin: 0;
}

#wrapper-login-box-control {
	background: url(../images/login-control-bg.gif) top left repeat-x;
	height: 33px;
}

#home-wrapper, #subpage-wrapper {
	float: left;
	clear: both;
	padding: 0;
	width: 100%;
	margin: -20px 0 0;
	background: url(../images/main-container-bg.gif) top left repeat-x;
	text-align: center;
	position: relative;
	z-index: 0;
}

#subpage-wrapper {	
	background: url(../images/subpage-bg.gif) top left repeat-x;	
}
/* end wrappers */

/* login box */
#loginbox {
	width: 766px;
	padding: 0;
	margin: 0 auto;
	text-align: left;
	position: relative;
	height: 180px;
}

	#register-promo {
		float: left;
		width: 380px;
		margin: 15px 0 0;
		height: 165px;
	}

	#loginbox h3 {
		float: left;
		width: 380px;
		margin: 10px 0 0 1px;
		background: url(../images/top-login-h3.png) top left no-repeat;
		height: 25px;
		text-indent: -4500px;
	}
	
	#loginbox p {
		clear: left;
		width: 340px;
		margin: 0 0 0 1px;
		font-size: 1.1em;
		line-height: 1.9em;
	}
	
	#loginbox a#register {
		float: left;
		width: 160px;
		margin: 7px 0 0;
		text-indent: -4500px;
		background: url(../images/signup-button.png) top left no-repeat;
		display: block;
		height: 34px;
		text-decoration: none;
		overflow: hidden;
	}

	#loginbox a#signin {
		width: 84px;
		margin: 0 0 0 68px;
		text-indent: -4500px;
		background: url(../images/signin-button.png) top left no-repeat;
		display: block;
		height: 30px;
		text-decoration: none;
		overflow: hidden;
	}
	
	#register-box {
		float: right;
		width: 365px;
		height: 148px;
		margin: 15px 0 0;
		padding: 0;
		border: 5px solid #D5ECEC;
		background-color: #EFFAFA;
		color: #333;
	}
	
	#register-box form {
		height: 129px;
		margin: 10px 0 0 20px;
	}
	
	#register-box form span {
		color: #999;
		background-color: inherit;
	}

	#register-box form p {
		float: left;
		margin: 0 0 7px;
	}
	
	#register-box label {
		float: left;
		text-align: right;
		display: block;
		margin: 2px 0 0;
		width: 60px;
	}
	
	#register-box label#checkit {
		text-align: left;
		display: block;
		margin: 0;
		width: 200px;
		color: #666666;
		background-color: inherit;
	}
	
	#register-box input {
		float: left;
		margin: 0 0 0 10px;
		width: 240px;
		height: 22px;	
		border: 1px solid #C5DBDB;
		padding: 3px 4px;
	}
	
	#register-box input:focus {
		border: 1px solid #aaa;
	}
	
		#register-box input#password {
			float: left;
			margin: 0 0 0 10px;
			width: 110px;
			height: 22px;
			border: 1px solid #C5DBDB;
			vertical-align: middle;
			padding: 3px 4px;
		}
		
		#register-box input#password:focus {
			border: 1px solid #aaa;
		}
		
		#register-box input#remember_me {
			float: left;
			margin: 5px 5px 0 70px;
			width: 13px;
			height: 13px;
			font-size: 0.9em;
			border: 1px solid #C5DBDB;
			background: white;
			vertical-align: middle;
			color: #666;
		}
	
	#login-box-control {
		clear: both;
		width: 766px;
		padding: 0;
		margin: 0 auto;
		text-align: left;
		height: 33px;
		font-size: 1px;
		position: relative;
		z-index: 5;
	}
	
		#login-box-control p#control {
			width: 766px;
			padding: 0;
			margin: 0;
			text-align: right;
		}
		
		#login-box-control p#control a {
			display: block;
			width: 137px;
			height: 26px;
			float: right;
		}
/* end login box */

/* headers */
#header, #subpageheader {
	clear: both;
	width: 766px;
	margin: 0;
	padding: 0;
	height: 75px;
	text-align: left;
}

#subpageheader {
	height: 69px;	
}
/* end headers */

/* main navigation */	
#main-nav {
	float: left;
	text-align: left;
	width: 766px;
	margin: 0;
	padding: 8px 0 0;
}

	#main-nav ul {
		float: left;
		text-align: left;
		height: 25px;
		width: 766px;
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 1.1em;
	}
	
	#main-nav li {
		float: left;
		text-align: center;
		margin: 0;
		padding: 0;
		display: inline;
		background: url(../images/nav-divider.png) top right no-repeat;
		height: 25px;
	}
	
	#main-nav li#last {
		background: none;
	}

	#main-nav a {
		display: block;
		text-align: center;
		float: left;
		color: #7D5B2E;
		background-color: inherit;
		text-decoration: none;
		margin: 2px 0 0;
		padding: 4px 19px 0 16px;
		height: 22px;
		border: 0 solid red;
	}
	
	#main-nav a:hover {
		color: #E6831B;
		background-color: inherit;
	}
	
		body#home #main-nav a#homenav {
			color: #7D5B2E;
			text-align: center;
			background-color: inherit;
			text-decoration: none;
			padding: 0 0 0 2px;
			background: url(../images/nav-li-left.gif) no-repeat top left;
			height: 25px;
		}

		body#home #main-nav a#homenav span {
			display: block;
			float: left;
			color: white;
			background-color: inherit;
			text-decoration: none;
			padding: 5px 19px 0 14px;
			height: 20px;
			background: url(../images/nav-li-right.gif) no-repeat top right;
			cursor: pointer;
		}
/* end navigation */	

/* main navigation subpage */		
#main-nav-sub {
	float: left;
	text-align: left;
	width: 766px;
	margin: 0;
	padding: 8px 0 0;
	height: 55px;
}

	#main-nav-sub ul {
		float: left;
		text-align: left;
		height: 25px;
		width: 766px;
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 1.1em;
	}
	
	#main-nav-sub li {
		float: left;
		text-align: center;
		margin: 0;
		padding: 0;
		display: inline;
		background: url(../images/nav-divider.png) top right no-repeat;
		height: 25px;
		position: relative;
	}

	#main-nav-sub li#last {
		float: left;
		text-align: center;
		margin: 0;
		padding: 0;
		display: inline;
		background: none;
		height: 25px;
	}
	
	#main-nav-sub li ul { /* second-level lists */
		position: absolute;
		left: -100px;
		top: 30px;
		/*width: 766px;*/
		width: 250px;
		padding: 0;
		margin: 0;
		text-align: center;
		/* using left instead of display to hide menus because display: none isn't read by screen readers */
	}

		#main-nav-sub li ul li {
			float: left;
			text-align: center;
			margin: 0;
			padding: 0 13px;
			display: inline;
			background: url(../images/nav-divider.gif) bottom right no-repeat;
			height: 25px;
			position: relative;
		}
		
		#main-nav-sub li ul li#final {
			float: left;			
			margin: 0;
			padding: 0 13px;
			display: inline;
			background: none;
			height: 25px;
			position: relative;
		}

	#main-nav-sub a {
		display: block;
		float: left;
		color: #7D5B2E;
		background-color: inherit;
		text-decoration: none;
		margin: 2px 0 0;
		padding: 4px 19px 0 16px;
		height: 20px;
		text-align: center;
	}
	
		#main-nav-sub a:hover {
			color: #E6831B;
			background-color: inherit;
		}
				
		#main-nav-sub a#current {
			color: #7D5B2E;
			text-align: center;
			background-color: inherit;
			text-decoration: none;
			padding: 0 0 0 2px;
			background: url(../images/nav-li-left.gif) no-repeat top left;
			height: 25px;
		}
		
		#main-nav-sub a#current span {
			display: block;
			float: left;
			color: white;
			background-color: inherit;
			text-decoration: none;
			padding: 5px 19px 0 14px;
			height: 20px;
			background: url(../images/nav-li-right.gif) no-repeat top right;
			cursor: pointer;
		}
	
		#main-nav-sub li ul li a {
			display: block;
			float: left;
			color: white;
			background-color: inherit;
			text-decoration: none;
			margin: 0;
			padding: 5px 0 0;
			height: 20px;
			text-align: center;
			font-size: 0.9em;
		}
		
		#main-nav-sub li ul li a:hover {
			color: #7D5B2E;
			background-color: inherit;
		}
/* end navigation subpage */

/* promos */
#promos {
	clear: left;
	float: left;
	width: 766px;
	margin: 4px 0 0;
	padding: 7px 0 0;
	height: 235px;
	text-align: left;
	position: relative;
}

	#promo-left {
		float: left;
		width: 517px;
		height: 223px;
		background-color: white;
		border: 1px solid #D37f1E;
		color: black;
	}
	
		#promo-left-text {
			width: 511px;
			height: 217px;
			margin: 3px;
			padding: 0;
			position: relative;
			z-index: 2;
			background: url(../images/left-promo-bg.jpg) top left no-repeat;
		}
		
		#promo-left-text h3 {
			width: 273px;
			height: 64px;
			background: url(../images/promo-left-h3.gif) 0 0 no-repeat;
			margin: 0;
			padding: 0;
			position: absolute;
			left: 170px;
			top: 59px;
			text-indent: -4500px;
		}
	
		#promo-left-text p {
			margin: 0;
			padding: 0;
			position: absolute;
			left: 0;
			top: 180px;
		}
	
			#promo-left-text a#learn {
				float: left;
				width: 108px;
				margin: 0;
				text-indent: -4500px;
				background: url(../images/learn-more.png) top left no-repeat;
				display: block;
				height: 32px;
				text-decoration: none;
				position: absolute;
				left: 214px;
				top: 1px;
				z-index: 2;
			}
		
			#promo-left-text a#tour {
				width: 124px;
				margin: 0 0 0 8px;
				text-indent: -4500px;
				background: url(../images/take-a-tour.png) top left no-repeat;
				display: block;
				height: 32px;
				text-decoration: none;
				position: absolute;
				left: 324px;
				top: 1px;
				z-index: 2;
			}
	
		#promo-right {
			float: right;
			width: 245px;
			height: 223px;
			margin: 0;
			padding: 0;
			position: relative;
			background-color: white;
			border: 1px solid #D37f1E;
			color: black;
		}
	
		#promo-right-text {
			width: 239px;
			height: 217px;
			margin: 3px;
			padding: 0;
			position: relative;
			z-index: 0;
			background: url(../images/right-promo-bg.jpg) top left no-repeat;
		}
		
		#promo-right-text h3 {
			width: 151px;
			height: 101px;
			background: url(../images/promo-right-h3.gif) 0 0 no-repeat;
			margin: 0;
			padding: 0;
			position: absolute;
			left: 70px;
			top: 45px;
			text-indent: -4500px;
		}
	
		#promo-right-text p {
			margin: 0;
			padding: 0;
			position: absolute;
			left: 0;
			top: 180px;
		}
	
		#promo-right-text a#signup-free {
			width: 158px;
			margin: 0 0 0 8px;
			text-indent: -4500px;
			background: url(../images/signup-for-free.png) top left no-repeat;
			display: block;
			height: 34px;
			text-decoration: none;
			position: absolute;
			left: 60px;
			top: 1px;
			z-index: 0;
		}
	
	#player-box {
		width: 120px;
		height: 234px;
		margin: 0;
		padding: 0;
		position: absolute;
		top: 0;
		left: 454px;
		z-index: 100;
		float: left;
		background: url(../images/phone-bg.jpg) 0 0 no-repeat;
	}

	#player-box p {
		margin: 0;
		padding: 0;
		color: white;
		background-color: inherit;
		width: 70px;
		height: 93px;
		position: absolute;
		left: 27px;
		top: 68px;
		z-index: 100;
	}
/* end promos */

/* main content */
#main-content-home {
	clear: both;
	float: left;
	width: 766px;
	margin: 20px 0 0;
	padding: 0;
	position: relative;
}

#main-content-sub {
	clear: both;
	float: left;
	width: 766px;
	margin: 20px 0 0;
	padding: 0;
	position: relative;
}

#content-left {
	float: left;
	width: 515px;
	padding: 0 0 5px;
	text-align: left;
	color: #444;
}

	#content-left h1.home {
		background: url(../images/home-left-h1.gif) 0 50% no-repeat;
		width: 428px;
		font-size: 3.1em;
		height: 24px;
		line-height: 24px;
		color: #F3830C;
		text-indent: -4500px;
		margin: 0 0 17px;
		background-color: inherit;
	}
	
	#content-left h2.home {
		background: url(../images/home-left-h2.gif) 0 50% no-repeat;
		width: 500px;
		height: 52px;
		line-height: 24px;
		color: #F3830C;
		text-indent: -4500px;
		margin: 0 0 17px;
		background-color: inherit;
	}	
	
	#content-left dl {
		padding: 10px 0 0;
		margin: 0 0 0 13px;
	}

	#content-left dt {
		padding: 0 0 0 4px;
		margin: 0 23px 0 0;
		border-bottom: 1px dashed #999;
		font-size: 1.7em;
	}
	
	#content-left dd {
		padding: 0 0 0 30px;
		margin: 10px 23px 0 0;
		border-bottom: 1px dashed #999;
		font-size: 1.7em;
	}
	
	#content-left h3.home {
		display: block;
		margin: 8px 0 7px 18px;
		padding: 0;
	}

	#content-left p.home {
		padding: 0 10px 10px 0;
		margin: 0;
		position: relative;
		line-height: 24px;
		color: #888;
		background-color: inherit;
		font-size: 1.2em;
	}
	
	#content-left h1.general {
		color: #F09023;
		font-size: 1.8em;
		font-weight: bold;
		margin-bottom: 12px;
	}
	
	#content-left h1.sub, #content-left h1.features, #content-left h1.tour, #content-left h1.learn, #content-left h1.talk, #content-left h1.terms, #content-left h1.privacy, #content-left h1.thanks, #content-left h1.hood, #content-left h1.curtain, #content-left h1.share, #content-left h1.topics, #content-left h1.walkthroughs, #content-left h1.devices, #content-left h1.sitemap, #content-left h1.error-encountered,  #content-left h1.not-found, #content-left h1.presscenter, #content-left h1.potpourri, #content-left h1.partner {
		background: url(../images/subpage-h1.gif) 0 50% no-repeat;
		width: 428px;
		height: 24px;
		line-height: 24px;
		color: #F3830C;
		text-indent: -4500px;
		margin: 0 0 17px;
		font-size: 3.1em;
		background-color: inherit;
	}
	
	#content-left h1.tour {
		background: url(../images/titles/places.gif) 0 50% no-repeat;
	}
	
	#content-left h1.features {
		background: url(../images/titles/features.gif) 0 50% no-repeat;
	}
	
	#content-left h1.presscenter {
		background: url(../images/titles/presscenter.gif) 0 50% no-repeat;
	}
	
	#content-left h1.potpourri {
		background: url(../images/titles/potpourri.gif) 0 50% no-repeat;
	}
	
	#content-left h1.learn {
		background: url(../images/titles/learn.gif) 0 50% no-repeat;
	}
	
	#content-left h1.not-found {
		background: url(../images/titles/page-not-found.gif) 0 50% no-repeat;
	}
	
	#content-left h1.error-encountered {
		background: url(../images/titles/error-encountered.gif) 0 50% no-repeat;
	}
	
	#content-left h1.talk {
		background: url(../images/titles/talk.gif) 0 50% no-repeat;
	}
	
	#content-left h1.privacy {
		background: url(../images/titles/privacy.gif) 0 50% no-repeat;
	}
	
	#content-left h1.terms {
		background: url(../images/titles/terms.gif) 0 50% no-repeat;
	}
	
	#content-left h1.thanks {
		background: url(../images/titles/thanks.gif) 0 50% no-repeat;
	}
	
	#content-left h1.hood {
		background: url(../images/titles/hood.gif) 0 50% no-repeat;
	}
	
	#content-left h1.curtain {
		background: url(../images/titles/curtain.gif) 0 50% no-repeat;
	}
	
	#content-left h1.share {
		background: url(../images/titles/share.gif) 0 50% no-repeat;
	}
	
	#content-left h1.topics {
		background: url(../images/titles/topics.gif) 0 50% no-repeat;
	}
	
	#content-left h1.walkthroughs {
		background: url(../images/titles/walkthroughs.gif) 0 50% no-repeat;
		height: 28px;
		line-height: 28px;
	}
	
	#content-left h1.devices {
		background: url(../images/titles/devices.gif) 0 50% no-repeat;
	}
	
	#content-left h1.sitemap {
		background: url(../images/titles/sitemap.gif) 0 50% no-repeat;
	}
	
	#content-left h1.partner {
		background: url(../images/titles/partner.gif) 0 50% no-repeat;
	}
	
	#content-left h2.sub, #content-left h3.sub {
		width: 500px;
		font-size: 1.1em;
	}

	#content-left p.sub, #content-left p {
		padding: 0;
		margin: 0 5px 15px 0;
		position: relative;
		line-height: 18px;
		/*color: #888;*/
		background-color: inherit;
		font-size: 1.1em;
	}
	
	#content-left h2 {
		color: #F09023;
		font-size: 1.35em;
		font-weight: bold;
		margin-bottom: 8px;
	}
	
	#content-left h3 {
		text-transform: uppercase;
		color: #7D5B2E;
		font-size: 1em;
		font-weight: bold;
		margin-bottom: 4px;
	}
	
	#content-left div.about-container {
		margin: 10px 0 30px 0;
	}
	
	#content-left div.about-left {
		float: left;
	}
	
	#content-left div.about-left img {
		margin: 2px 10px 10px 0;
	}
	
	#content-left div.about-right {
		padding-left: 150px;		
	}
	
	#content-left div.about-right h2 {	
		margin-bottom: 0px;
	}

#content-right {
	float: right;
	width: 245px;
	position: relative;
	background-color: #E7F4F4;
	color: #666666;
	text-align: left;
	padding: 0 0 15px;
	margin: 0 0 10px;
}

	.subright {
		float: right;
		width: 245px;
		position: relative;
		color: #666666;
		text-align: left;
		height: 480px;
		background: #E7F4F4 url(../images/subpage-right-part-bg.gif) bottom center no-repeat;
	}
	
	#content-right h3.features, #content-right h3.demonstrations, #content-right h3.work, #content-right h3.tour, #content-right h3.started, #content-right h3.mobile, #content-right h3.contents, #content-right h3.better, #content-right h3.faq, #content-right h3.walkthroughs, #content-right h3.devicefaqs {
		margin: 10px 0 10px 15px;
		height: 16px;
		width: 225px;
		padding: 0;
	}
	
	#content-right h3.features {		
		background: url(../images/ico/check-ico.png) 0 50% no-repeat;		
	}	
	
	#content-right h3.demonstrations, #content-right h3.walkthroughs {
		margin: 10px 0 10px 16px;
		background: url(../images/ico/film-ico.png) 0 50% no-repeat;
	}	
	
	#content-right h3.work {
		background: url(../images/ico/phone-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.tour {
		background: url(../images/ico/tour-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.started {
		background: url(../images/ico/signup-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.mobile {
		background: url(../images/ico/phone-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.contents {
		background: url(../images/ico/link-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.better {
		background: url(../images/ico/better-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.faq {
		background: url(../images/ico/help-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.devicefaqs {
		background: url(../images/ico/devicehelp-ico.png) 0 50% no-repeat;
	}
	
	#content-right h3.features span, #content-right h3.work span, #content-right h3.demonstrations span, #content-right h3.tour span, #content-right h3.started span, #content-right h3.mobile span, #content-right h3.contents span, #content-right h3.better span, #content-right h3.faq span, #content-right h3.walkthroughs span, #content-right h3.devicefaqs span {
		height: 16px;
		margin: 0 0 0 23px;
		display: block;
		text-indent: -4500px;
	}
	
	#content-right h3.features span {
		background: url(../images/feature-list-h3.gif) 0 50% no-repeat;		
	}

	#content-right h3.work span {
		background: url(../images/will-it-work-h3.gif) 0 50% no-repeat;
	}
	
	#content-right h3.demonstrations span {
		background: url(../images/demo-videos-h3.gif) 0 50% no-repeat;
	}
	
	#content-right h3.tour span {
		background: url(../images/titles/take-the-tour.gif) 0 50% no-repeat;
	}
	
	#content-right h3.started span {
		background: url(../images/titles/get-started.gif) 0 50% no-repeat;
	}
	
	#content-right h3.mobile span {
		background: url(../images/titles/swirl-mobile.gif) 0 50% no-repeat;
	}
	
	#content-right h3.contents span {
		background: url(../images/titles/contents.gif) 0 50% no-repeat;
	}
	
	#content-right h3.better span {
		background: url(../images/titles/better.gif) 0 50% no-repeat;
	}
	
	#content-right h3.faq span {
		background: url(../images/titles/faq.gif) 0 50% no-repeat;
	}
	
	#content-right h3.walkthroughs span {
		background: url(../images/titles/available.gif) 0 50% no-repeat;
	}
	
	#content-right h3.devicefaqs span {
		background: url(../images/titles/devicefaqs.gif) 0 50% no-repeat;
	}
	
	#content-right p {
		margin: 0 0 0 15px;
		padding: 0 15px 0 0;
		line-height: 17px;
	}
	
	#content-right	 div.hr {
		height: 5px;
		background: #E7F4F4 url(../images/hr-bg.gif) no-repeat scroll center;
		color: inherit;
	}
	
	#content-right div.hr hr {
		display: none;
	}
	
	#content-right form {
		margin: 10px 0 0 15px;
		padding: 0 15px 0 0;
		line-height: 17px;
	}

		#content-right form p {
			margin: 10px 0 0;
			padding: 0 15px 0 0;
			line-height: 17px;
		}
		
		#content-right form select {
			margin: 0 7px 0 0;
			padding: 0;
			height: 17px;
			width: 139px;
			color: black;
			background-color: white;
			font-size: 1.1em;
			vertical-align: middle;
		}

		#content-right form p img {
			border: 0;
			margin: 0;
			padding: 0;
			height: 21px;
			width: 33px;
			vertical-align: middle;
			cursor: default;
		}
		
		#content-right form p a {
			border: 0;
			margin: 0;
			padding: 0;
		}

	#content-right a {
		padding: 0;
		margin: 5px 0 15px 18px;
		color: #24B4D3;
		background-color: inherit;
		font-weight: normal;
		text-decoration: underline;
		display: block;
	}
	
	#content-right a:hover {
		text-decoration: underline;
		color: #069;
	}
	
	#content-right dl {
		padding: 0;
		margin: 0 0 15px 17px;
		width: 215px;
		font-size: 1.0em;
		color: #737373;
		background-color: inherit;
	}
	
	#content-right dt {
		padding: 0 0 0 18px;
		margin: 0 0 5px;
		background: url(../images/arrow.gif) 0 50% no-repeat;
		display: block;
		line-height: 15px;
	}

	#content-right dt a {
		padding: 0;
		margin: 0;
		color: #24B4D3;
		background-color: inherit;
		font-weight: normal;
		text-decoration: underline;
		display: block;
	}
/* end main content */

a.secondary {
	text-decoration: underline;
	color: #137A90;
}

a.secondary:visited {
	text-decoration: underline;
	color: #137A90;
}

.newsDate {
	font-style: italic;
	color: #999999;
}