/* CSS 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, 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: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

:focus{ outline: 0; }
body{ line-height: 1; }
ol, ul{ list-style: none; }

table{ border-collapse: collapse; border-spacing: 0; }

caption, th, td{ text-align: left; font-weight: normal; }

/* Basic Semantic Elements */
html{ overflow-y: scroll; }
body{ background: #fff; color: #22222C; font: small "Helvetica Neue", Helvetica, Arial, Sans, sans-serif; }

a{ color: #0051BA; }
a:hover{ color: #D14414; }

table{ font-size: x-small; width: 100%; }
	
td, th{ border: 1px solid #F5F4FB; padding: .5em; vertical-align: middle; }
	.odd td{ background: #F7FDFF; }
	td.icon_action, th.icon_action{ text-align: center; }
	th{ background: #CDE6F2; font-weight: bold; }

table a{ text-decoration: none; }
	table a:hover{ text-decoration: underline; }

ol{ list-style: decimal; margin-bottom: 1em; }
	
ul.bulleted{ list-style: square; margin-bottom: 1em; }
	
ol li, ul.bulleted li{ margin-bottom: .5em; margin-left: 2.5em; }
	
dl{ margin-bottom: 1em; }
dd, dt{ display: block; float: left; margin-bottom: 1em; }
	
dt{ clear: left; color: #99a; font-size: x-small; margin-right: 5%; text-transform: uppercase; width: 35%; }
	
dd{ width: 60%; }

p{ line-height: 150%; margin-bottom: 1em; }
	p.indent{ text-indent: 1.5em; }
	p.important{ font-size: medium; font-weight: bold; }
	p.quiet{ color: #334; font-size: x-small; }

h1, h2, h3, h4, h5, h6, legend{ font-family: "Helvetica Neue", Helvetica, Arial, Sans, sans-serif; font-weight: bold; margin-bottom: .5em; }

	h1{ font-size: xx-large; }
		h1 a{ color: #22222c; border-bottom: 1px dotted #0051BA; text-decoration: none; }
			h1 a:hover{ color: #0051BA; border-style: solid; }

	h2{ font-size: x-large; }
	h3, legend{ font-size: large; }
	h4{ font-size: medium; }
	h5{ font-size: small; }
	h6{ font-size: x-small; }
	
strong{ font-weight: bold; }
	strong.highlight{ background: #ffc; white-space: nowrap; }
em{ font-style: italic; }
.center{ text-align: center; }

pre{ border-left: 5px solid #99a; color: #334; font: small "Monaco", "Andale Mono", "Lucida Console", monospace; margin-bottom: 1em; padding-left: .75em; }
	
code, .code{ font: small "Monaco", "Andale Mono", "Lucida Console", monospace; }
	
/* Form Elements */
fieldset{ padding-bottom: 1em; }
	fieldset.split{ float: left; width: 50%; }
		fieldset.split #remember_me_label{ float:right; clear:both; font-size:.2em; }
input, textarea{ color: #334; font: small "Lucida Grande", Tahoma, "Helvetica Neue", Helvetica, Arial, Sans, sans-serif; }
	textarea{ display: block; }
	select{ color: #334; font: small "Lucida Grande", Tahoma, "Helvetica Neue", Helvetica, Arial, Sans, sans-serif; padding: .125em; }
	input.text, input.password, textarea{ border: 1px solid #99A; padding: .4em; }
		input.password:focus, input.text:focus, input.text:focus, textarea:focus{ border-color: #D14414; }
	input.button, input.submit, input.reset, button{ background: #D14414; color: #fff; cursor: pointer; border: 1px solid #F77F00; border-bottom-color: #4C280F; border-right-color: #4C280F; font-size: .9em; overflow: visible; padding: .35em .5em; width: auto; }
		input.button:hover, input.submit:hover, input.reset:hover, button:hover{ color: #EFB22D; }
		input.button:focus, input.submit:focus, input.reset:focus, button:hover{ border-color: #4C280F #F77F00 #F77F00 #4C280F; outline: none; }
legend{ font-weight: bold !important; }
label{ color: #334; font-size: small; }	
	.block-labels label{ display: block; }
	label .optional{ color: #99a; font-style: italic; font-size: x-small; padding-left: .5em; }
.subtxt{ color: #334; display: block; font-size: x-small; margin: .25em 0 .5em 0; }
.explination{ color: #99a; font-size: x-small; margin-left: 0.5em; }
.submit_note{ float: left; line-height: 3em; margin-top: 0; }

a.secondary_action{ color: #99a; padding-left: .5em; text-decoration: none; }
	a.secondary_action:hover{ text-decoration: underline; color: #334; }

/* Header */

#account_bar_wrapper {
  background: #ad2f0d url("/images/account_bar_bg.png") repeat-x top;
  border-bottom: 1px solid #80270b;
  font-family: "Lucida Grande", Verdana, Arial, Helvetica, Sans, sans-serif;
  font-size: 93%; }
  #account_bar_wrapper #account_bar {
    margin: 0 auto;
    width: 800px;
    overflow: hidden; }
    #account_bar_wrapper #account_bar #account {
      float: right; }
      #account_bar_wrapper #account_bar #account li {
        float: left;
        margin-right: 5px; }
      #account_bar_wrapper #account_bar #account a {
        color: #fff;
        text-decoration: none;
        display: block;
        padding: 5px; }
      #account_bar_wrapper #account_bar #account a:hover {
        background: #852b11; }

#header_wrapper{ background: #bd3d12 url("/images/n/header-bg.png") repeat-x; border-top: 1px solid #E65F2E; }
	#header{ position: relative; height: 70px; margin: 0 auto; width: 800px; overflow: hidden; }
		#header .header_logo{ display: block; border: none; width: 165px; height: 66px; background: url("/images/n/logo.png"); float: left; }

	#tabs{ float: right; position: relative; padding-right: 10px; width: 600px; } /* right padding added by amiel for lavalamp */
		#tabs li{ float: right; height: 70px; }
		#tabs a{ text-shadow: #80270b 0 1px 0; color: #fff; font-weight: bold; text-decoration: none; text-transform: uppercase; display: block; position: relative; overflow: hidden; z-index: 10; height: 70px; line-height: 70px; }
		#tabs a, #tabs .lavaleft{ padding: 0 13px; }
			/*#tabs a:hover{ background: #D14414; -moz-border-radius: 3px; -webkkit-border-radius: 3px; }*/
			#tabs li.lavaback{ position: absolute; z-index: 8; }
				#tabs li.lavaback .lavaleft{ background: #D14414; -moz-border-radius: 3px; -webkkit-border-radius: 3px; border-radius: 3px; margin-top: 20px; height: 30px; }
	
#call_us{ color: #fff; padding-right: 25px; text-shadow: 0 -1px 0 rgba(0,0,0,.3); }
  #call_us span{ line-height: 2em; margin-right: 7px; display: block; float: left; }
  #call_us a{ display: block; float: left; margin-right: 5px; }
  #call_us strong{ display: block; float: left; font-size: 1.25em; line-height: 1.55em; }
#login { text-shadow: 0 -1px 0 rgba(0,0,0,.3); }
	

/*				#tabs .current a{ background-position: -291px -450px; }*/
					
#already_using{ text-decoration: none; font-weight: bold; border-bottom: 1px dotted #F77F00; padding: .1em .2em; display: block; position: absolute; right: 0; display: inline-block; }
	#already_using:hover{ background: #EFB22D; border-bottom: 1px solid #F77F00; }

			
/* Content */
#content{ margin: 0 auto; min-height: 34em; overflow: hidden; padding: 40px 7px 10px 7px; width: 800px; }
.full-width #content{ width: 100%; margin-top: 0; padding: 0 0 10px; }
.content_shunt{ width: 800px; margin: 0 auto; margin: 40px auto 10px; position: relative; }

/* Footer */
#footer{ clear: both; margin: 2.5em auto 1em; text-align: center; width: 800px;	font-size: .9em; color: #99a; }
	
	#footer a{ text-decoration: none; padding: 0 5px 0 3px; border-right: 1px solid #99a; }
	    #footer a.last{ border: none; }
		#footer a:hover{ text-decoration: underline; }

	#footer .copy{ color: #99a; clear: both; font-size: x-small; padding: 1em; }

/* Utility Classes */
.c{ clear:both; height:1px; }
	
.clear{ clear: both; }

.flash{ margin: 1em 0 2em 0; padding: 1em 1.5em; background: #E2F2C2; border: 1px solid #339E35; }
	
	#facebox .flash{ margin: 0 0 20px 0; background: #fff no-repeat 6px center url("/images/icons/color/checkmark.png"); padding: 6px 6px 6px 28px; color: #339E35; font-weight: bold; width: 450px; }
		#facebox .error{ color: #D14414; background-image: url("/images/icons/color/delete.png"); }
		#facebox .warning{ color: #EFB22D; background-image: url("/images/icons/color/warning.png"); }

	.error{ background: #FFDECC; border-color: #D14414; }

	.warning{ background:#F7E8AA; border-color: #EFB22D; }	
		
	.flash ul{ list-style-type: disc; margin-top: .25em; }
		
		.flash ul li{ margin: 0 0 .25em 2em; }

.plan-warning{ background: #F7E8AA no-repeat url("/images/n/icons/warning-16.png") 8px center; padding: 8px 8px 8px 32px; margin-bottom: 20px; font-weight: bold; color: #334; border: 1px solid #EFB22D; }

.inline-notice{ background-color: #F5F4FB; border: 1px solid #99a; margin: 1em 0; padding:1em; }
.generic_left{ float: left; width: 450px; }
.generic_right{ float: right; width: 250px; }
.t_left_column{ float: left; width: 32%; }
.t_center_column{ float: left; margin: 0 3%; width: 32%; }
.t_right_column{ float: right; width: 32%; }
.narrow{ margin: 0 auto; width: 400px; }
.text_button{ background: no-repeat left center url("/images/icons/circle.png"); display: block; float: left; margin-top: 1em; margin-right: 1em; padding-left: 18px; text-decoration: none; width: auto; }
.secondary{ color: #334; float: right; }
.large-break{ margin-top: 2em; }
.generic_container{ width: 800px; margin: 0 auto; }
.no-border{ border: none !important; }

.orange_button{ background: #D14414 no-repeat 5px center url("/images/icons/add_light.gif"); border: 1px solid #993214; clear: both; color: #fff; display: block; float: left; padding: 5px 5px 5px 26px; text-decoration: none; width: auto; }
	.orange_button:hover, .generic_button:hover{ color: #EFB22D; }
	
.generic_button{ background: #D14414; border: 1px solid #993214; clear: both; color: #fff; padding: 5px; text-decoration: none; }	
	
.half_width{ width: 50%; }

.two_column{ float: left; width: 50%; }

.green-button{ height: 30px; text-decoration: none; border: 0; width: 120px; display: block; float: left; background: transparent url("/images/n/button_green.png"); line-height: 30px; color: #fff; font-size: 1.3em; text-align: center; font-weight: bold; }
	.green-button:hover{ color: #fff; text-decoration: underline; }


/* Malarkey Image Replacement */

.mir { text-indent: -999em; overflow: hidden; }

/* Misc */
#groups{ clear:right; }

	/* Group Switcher */
	.group_header{ float: left; margin-bottom: .125em; width: auto; }
	.unread_replies{ color: #fff; background: #D14414 no-repeat bottom left url("/images/unread_replies.png"); float: left; font-size: xx-small; margin: .25em 0 0 .75em; padding: 4px 8px 12px 8px; width: auto; display: none; }
		.unread_replies a{ color: #fff; text-decoration:none; }
		.unread_replies a:hover{ text-decoration: underline; }
		.overview_title{ float:left; }
	.user_count{ color: #fff; background: #334; float: right; font-size: xx-small; margin: .75em 0 0 .75em; padding: 3px; width: auto; -moz-border-radius: 1px; -webkit-border-radius: 1px; }
		.user_count a{ color: #fff; text-decoration:none; }
		.user_count a:hover{ text-decoration: underline; }
	#change_group{ background: #F7FDFF; border: 1px solid #99A; color: #334; display: block; float: right; font-size: xx-small;	margin-top: .75em; padding: 4px; text-decoration: none; text-transform: uppercase; width: auto; }
		#change_group:hover{ color: #D14414; }


#fine_print{ color: #99a; margin: 0 auto 1em; text-align: center; font-size: xx-small; }

#social_icons { width: 84px; /* old width: 54px; */ margin: 1em auto 0; }



#social_icons a{ display: block; float: left; height: 24px; width: 24px; margin-right: 3px; background: url(/images/share.png) no-repeat top left; }
#social_icons .facebook{ background-position: -12px -60px; } 
#social_icons .twitter{ background-position: -12px -444px; } 
#social_icons .myspace{ background-position: -12px -300px; } 
#social_icons .tatangotv{ background-image: url(/images/social/tatangotv.png); } 

/* old small icons
#social_icons a {
	background: url(/images/partners.gif) no-repeat;
	float: left;
	display: block;
	margin: 0 1px;
	width: 16px;
	height: 16px;
}


#social_icons .myspace { background-position: 0 -16px; } 
#social_icons .twitter { background-position: 0 -48px; } 
#social_icons .facebook { background-position: 0 -80px; } 
*/

/* because social_icons needs to float, this could be more specific if needed */
.copy{ clear:both; }

#show_more_info{ display:block; margin-top:8em; font-size:xx-small; }


.group_length_text{ display: block; margin-bottom: 1em; width: 230px; }
	
.group_length_bar{ border-top: 10px solid #fff; border-bottom: 6px solid #fff; display: block; height: 1px; width: 1px; }

.beta_sticker{ float:right; margin:0px; padding:0px; }

#beta_sticker{ background: #0051BA; color: #fff; display: block; float: right; font-size: x-small; margin: 1em auto; padding: 3px 5px; text-align: center; text-transform: uppercase; width: auto; -moz-border-radius: 3px; -webkit-border-radius: 3px; }

#partner_logo { float:right; padding-left:2em; padding-bottom:2em; }

/* Message Type Candybar */
.candybar{ display: block; height: 28px; margin-bottom: 1em; text-indent: -9999em; width: 178px; }
	.candybar:active{ outline: 0; border: 0; }

	#text_message, #voice_message{ background: url(/images/message_candybar.png); }
		#text_message:hover{ background-position: 0 -28px; }
		#text_message:active{ background-position: 0 -56px; }
	#voice_message{ background-position: 0 -84px; }
		#voice_message:hover{ background-position: 0 -112px; }
		#voice_message:active{ background-position: 0 -140px; }
		
		
/* Public Group Stuff */
#progress_bar{ display: block; width: 128px; margin: 25px auto; }

#bar-outer{ float: right; border: 1px solid #99a; width: 50px; height: 10px; padding: 1px; overflow: hidden; margin: 0; }

#bar-inner{ padding: 0; margin: 0; height: 10px; background-color: #CDE6F2; }

div#interesting_groups_content, div#nearby_groups_content{ margin-top: 0; }

.public_groups_box div.suggestion_labels{ margin-bottom: 0; padding-bottom: 0;}
.suggestion_labels div{ font-size: xx-small; color: #334; float: left; width: 50%; margin: 0; padding: 0;}
	.suggestion_labels div.relevance{ text-align: right; }
	
.nearby-distance {float:right; font-size:x-small;}

/* Announcements */
#announcement{ background: #334 repeat-x 200px bottom url("/images/tails/334.png"); clear: both; color: #fff; margin-bottom: 3.5em; margin-top: 2em; font: medium "Helvetica Neue", Helvetica, Arial, Sans, sans-serif; line-height: 150%; margin: 20px; padding: 20px 20px 28px 20px; overflow: hidden; }

	#announcement p{ width: 85%; float: left; margin-bottom: 0; }
	#announcement a{ color: #fff; }
	.announcement_button{ text-decoration: none; font-size: x-small; display: block; float: right; background: #22222c; -moz-border-radius: 3px; -webkit-border-radius: 3px; width: auto; padding: 0px 8px; margin-right: 2px; }
		.announcement_button:hover{ background: #334; text-decoration: underline;}

/* Pagination */
#will_paginate_activity{ position: absolute; z-index: 99; background: url("/images/activity_background.png") no-repeat center center; }
	#will_paginate_activity img{ display: block; width: 32px; height: 32px; position: relative; left: 50%; top: 50%; margin-top: -16px; margin-left: -16px; }

.pagination{ padding: 1em 0; font-size: x-small; clear: both; overflow: hidden; }
	.pagination .disabled, .pagination .gap{ background: #fff; border-color: #fff; color: #99a; }
	.pagination a, .pagination span{ display: block; float: left; width: auto; padding: 1px 3px; margin: 0 1px; border: 1px solid #DEDDE7; background: #F5F4FB; }
		.pagination a.prev_page, .pagination a.next_page{ color: #0051BA; }
	.pagination a{ text-decoration: none; color: #334;}
		.pagination a:hover{ background: #0051BA; color: #fff; border-color: #0051BA; }
	.pagination span.current{ background: #DEDDE7; border-color: #99a; color: #334; font-weight: bold; } 
	
/* Error Handling */
.errorExplanation{ background: #FFDECC; border: 1px solid #D14414; padding: 1em; margin-bottom: 2em; }
	.errorExplanation p{ display: none; }
	.errorExplanation h2{ font-size: medium; font-weight: normal; color: #993214; }
	.errorExplanation ul{ list-style-type: square; margin: 0; padding: 0; list-style-position: inside; }

.error_image { float:right; margin-left:20px; }

/* Help links */
.help_link{ text-decoration: none; border-bottom: 1px dotted #99a; }
	.help_link:hover{ border-bottom-style: solid; }
	
.new_feature{ font-size: x-small; text-transform: uppercase; color: #99a; }
	.new_feature strong{ font-weight: bold; color: #D14414;}

/* Horizontal Tabs */
.ui-tabs-hide { display: none; }
.ui-tabs-nav div {clear:left;}

.ui-tabs-nav ul.tabs { margin-left: 0px; margin-bottom: 0; overflow: hidden; }
.ui-tabs-nav ul.tabs li{ float: left; width: auto; }
	.ui-tabs-nav ul.tabs li a{ display: block; color: #fff; background: #99a; text-decoration: none; padding: 4px 12px; margin: 0 2px 8px 0; }
		.ui-tabs-nav ul.tabs li a:hover, .ui-tabs-nav ul.tabs li.ui-tabs-loading a{ background: #334; }
	.ui-tabs-nav ul.tabs li.ui-tabs-selected a{ background: #334 no-repeat center bottom url("/images/tails/334.png"); margin-bottom: 0; padding-bottom: 12px; }
	.ui-tabs-nav a em{ font-style: normal; color: #EFEEF6; }
.ui-tabs-nav .ui-tabs-panel { padding: 0 .5em; }


/* brought from plans.css to generalize */
#security{ margin: 2em 0; border: 1px solid #EFB22D; background: #F7E8AA no-repeat 10px 10px url("/images/n/icons/lock-24.png"); padding: 10px 10px 10px 52px; clear: both; }
	#security h3{ font-size: 1em; text-transform: uppercase; margin-bottom: .15em; }
	#security p{ margin-bottom: 0; line-height: 1.2em; font-size: .9em; }

	#flash_bar{ text-align: center; padding: 2em; background: #F5F4FB; border-bottom: 1px solid #DEDDE7; }
		#flash_bar h4{ font-size: 2em; color: #334; width: 800px; margin: 0 auto 0em; }
		#flash_bar p{ font-size: 1.6em; color: #667; width: 800px; margin: 0 auto; }


div.jGrowl{ z-index: 9999; position: fixed; top: 0; left: 0; width: 100%; background: #22222c; border-bottom: 1px solid #111119; }

#jGrowl .jGrowl-notification{ display: none; width: 880px; padding: 14px 20px 14px 34px; margin: 0 auto; position: relative; background: left center no-repeat; color: #fff; border: 0; }
	#jGrowl .jGrowl-notification .message{ font-size: .85em; }
	#jGrowl .jGrowl-notification .close{ position: absolute; right: 0; height: 14px; width: 14px; background: no-repeat center center url('/images/jgrowl/close.png'); text-indent: -999em; cursor: pointer; }
		#jGrowl .jGrowl-notification .close:hover{ background-image: url("/images/jgrowl/close_hover.png"); }

	#jGrowl .jGrowl-notification.flash{ background-image: url('/images/icons/24/info.png'); }
	#jGrowl .jGrowl-notification.error{ background-image: url('/images/icons/24/error.png'); }
	#jGrowl .jGrowl-notification.warning{ background-image: url('/images/icons/24/warning.png'); }
	#jGrowl .jGrowl-notification.notice{ background-image: url('/images/icons/24/success.png'); }

	#jGrowl .jGrowl-closer{ position: absolute; color: #fff; font-size: .7em; bottom: 10px; right: 10px; cursor: pointer; }

#facebox, #facebox tr, #facebox td, #facebox th{ border: none; }

#facebox .b {
	background:url(/images/facebox/b.png);
	border: none;
}

#facebox .tl {
	background:url(/images/facebox/tl.png);
	border: none;	
}

#facebox .tr {
	background:url(/images/facebox/tr.png);
	border: none;	
}

#facebox .bl {
	background:url(/images/facebox/bl.png);
	border: none;	
}

#facebox .br {
	background:url(/images/facebox/br.png);
	border: none;	
}


#facebox .loading {
	margin: 20px auto;
	width: 28px;
	height: 28px;
	background: url(/images/facebox/loading.gif) no-repeat;
	text-align: center;
}

#facebox {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	text-align: left;
}

#facebox .popup {
	position: relative;
}

#facebox table {
	border-collapse: collapse;
	font-size: small;
	width: auto;
}

#facebox td {
	border-bottom: 0;
	padding: 0;
}

#facebox .body {
	padding: 0px;
	background: #fff;
	width: 370px;
}

#facebox .content {
	padding: 10px;
}

#facebox .facebox_image {
	text-align: center;
}

#facebox img {
	border: 0;
	margin: 0;
}

#facebox .title {
	height: 30px;
	border-bottom: 1px solid #993214;
	background-color: #D14414;
	padding: 0px 10px;
	margin-bottom: 5px;
	position: relative;
	color: #fff;
}

#facebox .title h2 {
	height: 30px;
	line-height: 30px;
	margin: 0;
	font-size: small;
	letter-spacing: 0;
}

#facebox .title a.close {
	position: absolute;
	top: 0px;
	right: 6px;
	display: block;
	padding-right: 20px;
	padding-left: 20px;
	background: url(/images/icons/close_light.png) no-repeat center right;
	text-decoration: none;
	color: #fff;
	text-transform: uppercase;
	line-height: 30px;
	height: 30px; 
	font-size: x-small;
}

	#facebox .title a.close:hover{ color: #E89170; }


#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
	height: 10px;
	width: 10px;
	overflow: hidden;
	padding: 0;
}

#facebox_overlay {
	position: fixed;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.facebox_hide {
	z-index:-100;
}

.facebox_overlayBG {
	background-color: #000;
	z-index: 99;
}

* html #facebox_overlay { /* ie6 hack */
	position: absolute;
	height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
