* { margin: 0; padding: 0; }

body {
	background: #000;
  font-family: Arial, Verdana, sans-serif;
  font-size: 75%;
  margin: 0;
}

#main_container { background: #fff; }

table {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
}

table td { vertical-align: top; }

a { color: #ff4400; }

.swatch1 { color: #ff4400 !important; }
.swatch1_lighter { background-color: #FFE8D9; }
.swatch2 { color: #999900 !important }
.swatch2_lighter { background-color: #F0F7D9; }
.swatch2_lighter a { color: #999900; }
.swatch3 { color: #ff6600 !important;}
		
a img { border: none; }

h1, h2, h3, h4 {
  font-family: "Lucida Grande",Tahoma, Arial, sans-serif;
  font-weight: normal;
  line-height: 1.4em;
}

h1 { font-size: 1.7em; }
h2 { font-size: 1.55em; } 
h3 { font-size: 1.35em; }
h4 { font-size: 1.15em; }

p { 
  margin: .25em 0 1em 0;
  line-height: 1.5em;
}

ul { 
  list-style-type: none;  
  margin: .5em 0; 
}
	ul.bulleted {
		list-style-type: disc;
		margin-left: 2em;
	}
	
ol { 
  margin: .5em 0 .5em 1em; 
  list-style-position: inside;
}
  
   li {  padding: 0 0 1em .5em; line-height: 1.5em; }
      
  .inline li {
    float: left; 
    margin-right: 2em;
  }

fieldset {
  border: 1px solid #ccc;
  padding: 1em 2em 1em 2em;
  margin-top: 1em;
  margin-bottom: 1em;
}

    legend {
      font-family: Tahoma, Arial, sans-serif;
      color: #333;
      font-size: 1.42em;
      padding: 0 .5em .2em .5em;
    }
    
option { padding-right: 1em; }

#main {
  width: 1000px;
  margin: 0 auto;
  padding-bottom: 1px;
  padding-top: 1px;
}

#header_container {
	background: #fff url(/images/new/common/header_x.png) repeat-x;
  color: #fff;	
  height: 150px;
}
		
		#header {
			width: 1000px;
			height: 151px;
		  margin: 0 auto;
		  background: url(/images/new/common/header_bg.jpg) no-repeat top left;
		}
		
		#header div#logo { 
			float: left;
			margin-top: 30px;
		}
		
		#header div#logo a { display: block; height: 80px; width: 230px;}
		
		#header div#logo span { display: none; }
		
		#header #status {
		  padding-top: 8px;
		  font-size: .85em;
		  margin-left: 370px;
		}
		
				#header #status a { color: #ff6600; text-decoration:  none; }
		
				#header #status .swatch1 { padding-left: .85em; }
         

    #header #completely_free {
      font-size: 2em;
			margin-left: 330px;
			margin-top: 60px;
      color: #ccc;
    }
		
		#primary_nav {
      position: relative;
      margin: 40px 0px 0 85px;
      padding-left: 25px;
      float: left;
      width: 620px;
		}
		
				#primary_nav li {
				  display: inline;
				  font-family: "Lucida Grande",Tahoma,Verdana,sans-serif;
          padding-right: 10px;
				  font-size: 1.4em;
				  background: url(/images/new/common/nav_arrow_right.png) no-repeat 0 6px;
				  text-align: center;
				}

				#primary_nav a { 
					text-decoration: none; 
					padding-right: 1em;
					color: #fff;
				}
		
				#primary_nav .active {
					background: url(/images/new/common/nav_arrow_down.png) no-repeat 0 6px;
				}
		
				#primary_nav .active a { color: #ff6600; }
			  
			  #primary_nav .annotation { color: #ff6600; font-size: .8em; }
	
		#secondary_nav {
			margin-left: 260px;
			margin-top: 10px;
			padding-right: 25px;
			text-align: center;
			color: #ff6600;
		}
		
				#secondary_nav li {
					display: inline;
          padding-right: 2em;
				}
		
				#secondary_nav a { color: #ff6600; padding-right: 2em; text-decoration: none;  }

		    #secondary_nav .active a { font-weight: bold; text-decoration: underline; }
	

#footer {
  background: #000 url(/images/new/homepage/footer_bg_x.png) repeat-x top left;
  clear: both;
  padding-top: 1em;
  border-top: 2px solid #fff;
}

		#footer div.linkbar {
		  margin-top: .5em;
		  padding-top: 4.3em;
		  padding-bottom: 1em;
		  text-align: center;
		  color: #666;
		}

				#footer div.linkbar a { color: #666; padding: 0 0.5em; ; }

				#footer div.copyright { color: #444; text-align: center; font-size: .95em; padding-bottom: 2em; }

#logged_out {
	text-align: center;
}

		#logged_out h2 {
			margin-top: 2em;
			padding-bottom: 2em;
		}


/* small inline user portrait / city / last time online */
/* TODO: remove this... (maybe put it in another .css) */
div.miniuser { font-size: .95em; overflow: auto; }

div.miniuser img {
  float: left;
  width: 100px;
  height: 100px;
  margin-right: 10px;
  border: 2px solid white;
}

div.miniuser p {
  padding-top: 0.25em;
  line-height: 1.25;
}

.miniuser .online_now { 
  font-size: .9em;
  text-decoration: none; 
}

.skyscraper_ad {
  width: 150px;
  float: right;
  margin: 0.5em;
  margin-left: 1em;
  margin-top: 0;
}

.user_list { margin-left: 1em; }

	.user_list hr { border: 1px solid #ddd; background-color: #f8f8f8; padding: 1px; clear:left; width: 810px; text-align: left;}
	
	.user_list h4 { margin: 0.5em 0;}

.inline_user_profile {
  clear: left;
  overflow: visible;
  margin: 0.5em 0;
  padding: 0.1em;
}
  .recent_inline_user_profile {
    background-color: #ffd;
  }
  .inline_user_profile .user_thumbnail {
    float: left;
    border: 5px solid #ddd;
    margin-right: 1em;
    margin-bottom: 0.5em;
  }
  .inline_user_profile .user_thumbnail_premium {
     border: 5px solid #f6ea00;
  }
  .inline_user_profile .username {
    font-size: 2em;
  }
  .inline_user_profile a.remove_link {
    float: right;
    width: auto;
    margin-right: 1em;
  }
	.inline_user_profile .city_link {
		float: right;
		width: auto;
		margin-right: 1em;
		font-size: 0.9em;
	}
  .inline_user_profile .headline {
    font-size: 1.2em;
    color: #999;
    margin: 0.4em 0;
  }
  .inline_user_profile .summary {
    margin-top: 0.5em;
    color: #444;
    font-size: 1.2em;
  }

  .inline_user_profile .annotation { color: #666; margin-top: 0.25em; font-size: 1.2em; margin-top: 0.5em; }
  .inline_user_profile .online_now { display: inline; }


table.thumbnails td { width: 16%; }
table.thumbnails td img { border: 6px solid white; }
table.thumbnails td.current img { border-color: #ecc; }


.blue_button_nolink {
  margin: .25em auto 0 auto;
  padding: 10px 25px;
  text-decoration: none;
  display: inline;
  color: #000;
  font-size: 1.5em;
  background: #99CC00 url(/images/new/common/button_blue_x.png) repeat-x;
}

.red_button a, .black_button a, .blue_button a, .red_submit_button {
  margin: .25em auto 0 auto;
  padding: 10px 25px;
  text-decoration: none;
  color: #fff;
  font-size: 1.5em;
  cursor: pointer;
}
		.red_submit_button { overflow: visible;}

		.red_button a, .red_submit_button {
		  background: #ff6600 url(/images/new/common/button_red_x.png) repeat-x;
		  border: 1px solid #ff4400;
		}
    
    .black_button a {
			 padding: 10px 20px;
		   background: #333 url(/images/new/common/button_black_x.png) repeat-x;
		   border: 1px solid #333;
     }
     
     .blue_button a {
		   background: #99CC00 url(/images/new/common/button_blue_x.png) repeat-x;
		   border: 1px solid #99CC00;
     }


.red_button a, .black_button a, .blue_button a { padding-top: 14px !important;}
.red_button:hover, .red_submit_button:hover { color: #FFE8D9; }

div.red_button_bar { padding: 1em 0.25em 1.5em 0.25em; }
div.red_button_bar div.red_button { display: inline; margin-right: 1em;}

/* creates the black bar heading with a main h1 and a detailed description */
.large_heading {
  color: #ff6600;
  font-weight: normal;
  margin: 0;
  margin-top: 1em;
  padding: 0.25em 1em;
  background-color: #333;
  background-image: url(/images/new/common/h1_bg_taller_x.png);
  background-position: bottom left;
  background-repeat: repeat-x;
  font-size: 1.5em;
}


		.large_heading .heading_detail { 
		  display: block;
			font-size: .6em; color: #999; padding-bottom: 0.5em; 
			font-family: Arial, Verdana, sans-serif;
			padding-top: 0;
			margin-top: 0;
			line-height: 1em;
		}

    .large_heading a { color: #ff6600; }

/* black bar heading */
.black {
  color: #ff6600;
  font-weight: normal;
  margin: 0;
  margin-top: 1em;
  padding: 0.25em 1em;
  background-color: #333;
  background-image: url(/images/new/common/h1_bg_x.png);
  background-position: bottom left;
  background-repeat: repeat-x;
  font-size: 1.5em;
}
		.black a { color: #ff6600;}

		.framed {
		  border: 1px solid #aaa;
		  border-bottom: none;
		}


		div.framed {
		  border: 1px solid #ccc;
		  border-top: none;
		  padding: 1em 1.5em;
			margin-bottom: 2em;
		}

    div.framed div.framed_section_content { padding: 0 1em; }

/* floating grey box on right of many pages */
div.floating_info {
  float: right;
  width: 200px;
  background-color: #eee;
  margin-right: 0;
  margin-left: 1em;
  padding: 2em;
}

input.textfield, select, textarea {
  background-color: white;
  border: 1px solid #666;
  padding: 0.1em 0.2em;
}


div.pagination span.page_label { padding-right: 0.5em; font-weight: bold; }
div.pagination a { color: #ff6600; padding: 0 0.2em; text-decoration: none; }
div.pagination a:hover { text-decoration: underline; }
div.pagination span.current { padding: 0 0.25em; color: black; font-weight: bold; }


/* validation errors, etc; usually displayed in a <ul> */
.errors {
  border: 3px solid #990000;
  margin: 1em 0;
  padding: 0.25em 1em;
  background-color: #fee;
	text-align: center;
}

.flash_notice {
  margin: 0.5em 0;
  font-weight: bold;
  color: #333;
  border: 1px solid #ccc;
  background-color: #fee;
  padding: 0.5em 1em;
}

.flash { 
	background: url(/images/new/common/flash_bg.png) no-repeat 10px 10px;
	border: 1px solid #efefef;
	font-size: 2em !important;
	color: #999900;
	padding: 1em 1em 1em 75px;
}

.warning {
  color: red;
  font-weight: bold;
  margin: 0.25em 0;
}

.username a { display: inline; }
.username .online_now { margin-left: 0.5em;}

.user_thumbnail { border: 5px solid white; }
.user_thumbnail_premium { border: 5px solid #f6ea00; }


table.user_portrait {
  background-image: url(/images/new/common/photo_frame.png);
  background-position: top left;
  background-color: white;
  background-repeat: no-repeat;
  width: 316px;
  height: 317px;
}
		table.user_portrait td { vertical-align: middle; text-align: center; }
		table.user_portrait img.portrait { border: 2px solid white; }
		table.user_portrait p.no_photo { font-size: 1.5em; }


		table.simple_form td { padding-top: 0.5em; }
		table.simple_form td input.textfield { border: 1px solid #666; }
		table.simple_form td.label {
		  text-align: right;
		  color: #444;
		  padding-right: 1em;
		  width: 30%;
		}


/* ad styles */
div.ad_728x90 {
  margin: 0 auto;
  width: 728px;
  height: 90px;
  text-align: center;
}

#topbannerad, #bottombannerad, #middlebannerad {
  margin: 0 auto;
  width: 728px;
  height: 100px;
  text-align: center;
}
#bottombannerad { clear: both; }

#bottombannerad {
  margin-top: 10px;
}

#top_300x250_placeholder, #top_300x250 {
  margin: 0 auto;
  width: 320px;
  height: 260px;
  border: 1px solid #ccc;
  text-align: center;
  background-color: #f8f8f8;
  color: #ccc;
}

#textlink_ads_placeholder, #textlink_ads {
  margin: 0 auto;
  text-align: center;
  font-size: 1.1em;
  color: #ccc;
  text-align: center;
	padding-bottom: 1em;
	height: 1em;
}

#textlink_ads_placeholder div, #textlink_ads div { display: inline; padding: 0 0.5em; }

#adsenseholder1, #adsenseholder2, #middlebannerad1, #middlebannerad2 { height: 90px; width: 728px; margin: 0.5em auto; }


.pagination {
  font-size: 1.2em;
  margin: 0.5em 0;
}


/* simulates <fieldset><legend> style on an element */
.boxed {
  border: 1px solid #ccc; 
  padding: 1em;
  margin-top: 35px;
  z-index: -99999; 
}

    .boxed .boxtop  {
      margin-top: -1.2em;
      background: #fff; 
      z-index: 1000000;
      float: left;
      padding: 0 .5em;
      line-height: 1.2em;
      margin-bottom: .5em;
    }
    
    .boxed > * { clear: left; }
		.boxed .next { clear: left;}

/* clearfix - put this on a containing element and the children will be cleared */
.cf { display:block; } 

		.cf:after {
		  content: ".";
		  display: block; 
		  height: 0; 
		  clear: both !important;
		  visibility: hidden;
		}

		.cf { display: inline-block; } 

		* html .cf {height: 1%;}

/* convenient clearing */
.clear { clear: both; }

div.linebreak { height: 14px;}

/* adds a mouse cursor, useful for javascript powered onclicks */
.cursor { cursor: pointer; text-decoration: underline; }

/* makes forms a bit cleaner */
.pretty_form label { display: block; margin-bottom: .25em; }	

.pretty_form h4 label { color: #999; }

.pretty_form input[type=text], .pretty_form select, .pretty_form textarea { border: 1px solid #999; }

.cancel { margin-left: 2em; }

/* makes all the children inline elements */
.inline * { display: inline; }

/* hide element */		
.ghost { display: none; }

/* useful for creating two floated columns */
.col1, .col2 {
	width: 47%;
	float: left;
  margin-right: 1em;
}

/* apply this to a UL tag and all the children LI tags will have red arrows */
.arrow li { 
  background: url(/images/new/common/arrow_right.png) no-repeat 0 7px;
  padding-left: 1em;
}

/* use on muted text - soft, not obvious */
.mute { font-size: .9em; text-transform: uppercase; color: #ccc; }

.ancillary {
	color: #444;
	text-align: center;
	padding: 1em 0;
}

/* quotation blocks in forum/inbox messages */
.quote_top {
  border-bottom: 1px solid #999;
  border-top: 1px dotted #666;
  border-left: 8px solid #ff6600;
  border-right: 1px dotted #666;
  background-color: #FFE8D9;
  padding: 0.25em 0.25em;
  margin-left: 0;
  clear: right;
}
.quote {
  background-color: #efefef;
  margin-left: 0;
  border: 1px dotted #666;
  border-left: 8px solid #ddd;
  border-top: none;
  padding: 0.25em 0.25em;
}


/* admin reports / moderation log */
table.report {
  width: 100%;
  border: 2px solid #ccc;
}
table.report th { background-color: #ddd; }


/* move this elsewhere... (maybe just inline it into the html) */
table.friend_requests th { background-color: #eee; text-align: left; padding: 0.25em 0.5em; }
table.friend_requests td { vertical-align: top; padding: 0.5em; text-align: left; border-bottom: 1px solid #aaa;}
table.friend_requests td.from { width: 120px; }
table.friend_requests td.message { width: 500px; padding-top: 2em;}
table.friend_requests td.actions { vertical-align: middle;}


/* CSS for the jsh -> opu migration */
#header #jsh_header_note { padding-left: 2em; text-transform: uppercase;  } 

#jsh_signup_note { 
	margin: 2em 0;
	text-align: center;
	padding: 1em;
	border:	1px solid #efefef;
}
#invitation_message {
	width: 98%;
	height: 150px;
}
#friend_message_header {
	margin-top: 1em;
}
#friend_add_form {
	font-weight: bold;
}


.recent_activity ul { list-style-type: disc; margin-left: 1em; }
.recent_activity ul li { padding: 0.2em 0; }

#emoticons { overflow: auto; width: 165px; height: 150px; border: 1px solid #333; background-color: #fff; padding: 5px;}
	
	#emoticons_toggle { font-size: 0.7em; margin: 0.5em 0;}
	
#transition_background { width: 100%; height: 62px; background-color: #fff;}

#transition_message { width: 700px; height: 50px; margin: 0 auto; background-color: #fff;}
	
	#transition_message.opu_message { width: 600px;}

	#transition_message img { margin-top: 5px; float: left;}
	
	#transition_message span.transition_message { float: left; margin-left: 30px; margin-top: 15px; } 
	
		#transition_message h4 { float: left;}
		
		#transition_message a { float: left; margin-left: 20px; margin-top: 3px;}
		
		.justsayhi { color: #1073B7;}
		
		.oneplusyou { color: #f44; }

.announcement { 
	  font-family: "Lucida Grande",Tahoma, Arial, sans-serif;
	  font-weight: normal;
	  line-height: 1.4em; 
		font-size: 1.7em;
}
	.announcement h1 { display: inline; color: #999900; font-size: 1em;}
	
div.text_ad_banner { width: 728px; height: 90px; padding: 0 0 0 10px; text-align: center; background-color: #f8f8f8; border: solid 1px #ccc;}

div.text_ad_banner ul li { display: block; float: left; width: 182px; margin: 0; padding: 0; text-align: left; font: normal 11px arial, sans-serif;}

	div.text_ad_banner ul li div.text_ad { padding-right: 8px;}

	div.text_ad_banner ul li div.text_ad a { font-weight: bold; color: #ff4400; font-size: 12px;}
	
	div.text_ad_banner ul li div.text_ad div.ad_copy { color: #000; margin-top: 4px;}
	
		div.text_ad_banner ul li div.text_ad div.ad_copy a { font: normal 11px arial, sans-serif; color: #000; text-decoration: none; }
	
	div.text_ad_banner ul li div.text_ad div.ad_url { margin-top: 2px;}
	
		div.text_ad_banner ul li div.text_ad div.ad_url a { color: #78B749; font-weight: normal; text-decoration: none; font-size: 10px; }
		
		

#by_location_footer {
	text-align: center;
	padding: 0 !important;
}

		#by_location_footer h2 {
			margin-bottom: .5em;
		}

		#by_location_footer ul { 
			width: 140px; 
			float: left; 
		}

		#by_location_footer li { 
		  line-height: 1.2em;
		  padding-right: 0.5em;
		  padding-left: 0;
		  text-align: left;
		}

		#by_location_footer h4 { clear: both; }

		#by_location_footer #location_first_col { margin-left: 35px; }

.othersites {
  text-align: center;
  color: #666;
  margin-bottom: 1em;
}
  .othersites a {color: #666;}



.search_unavailable {
  border: 2px solid red;
  width: 80%;
  margin: 1em auto;
  color: #004;
  background-color: #fdd;
  padding: 0.5em;
  text-align: center;
  font-size: 16px;
}


/* only for Contact Us page */
table.contact_us {
  margin-top: 1em;
}
table.contact_us td {
  padding: 0.25em 0.5em;
}
table.contact_us td.label { text-align: right; }


/* shared by incomplete profile snippets */
div.complete_profile_container {
  background-color: #fdded7;
  padding-top: 1px;
  margin-top: 0.5em;
}
div.complete_profile {
  padding: 1em 0.75em;
  margin-bottom: 1em;
  color: #444;
  border-top: 1px solid white;
  font-size: 1.2em; 
}
div.complete_profile a {
  color: #ff0000;
  font-weight: bold;
}


/* used on some of the wide pages to make room for the sidebar ad */
div.content_wrapper {
  width: 800px;
}