/* CSS Document */

body {
	margin: 0 0 15px 0;
	padding: 0;
	background-color: #000;
	background-repeat: repeat;
	behavior: url(includes/csshover.htc);
}
table tr.pagebreakhere {page-break-before: always}
/* ------------------------------ CONTENT PADDING ------------------------------------------ */
.content5, #content5 {
	padding: 5px;
}
.content10, #content10 {
	padding: 10px;
}
.content15, #content15 {
	padding: 15px;
}
.content25, #content25 {
	padding: 25px;
}


form, form.outlined p {
	padding: 0;
	margin: 0;
}
form.outlined {
	padding: 2px 0 3px 3px;
	outline: 1px dotted #999;
	margin: 4px 0;
}

/* ------------------------------ TOOL TIPS ------------------------------------------ */
div.photo{
    position:relative; /*this is the key*/
    z-index:24;
	float: right;
	width: 160px;
	}
div.photo span{ display: none; }
div.photo span a{ 
	color: #0f6bae; 
}
div.photo span h5{ 
	font: 12px Arial, Helvetica, sans-serif;
}
div.photo:hover{ 
	z-index:25; 
}
div.photo:hover span{ /*the span will display just on :hover state*/
    display: block;
    position: absolute; 
	top: -40px;
	right: 0;
	width: 200px;
    background-color: #dae9f6;
	color:#000;
	padding: 5px;
    text-align: left;
}

/* ------------------------------------- HOME --------------------------------------------- */
#pagewrap {
	display: block;
	margin: 0;
	padding: 0;
	width: 965px;
	background-image: url(../images/page-bg.gif);
	background-repeat: repeat-y;
}

div#final_footer { 
	width: 965px;
	height: 108px;
	background: url(../images/site-footer.jpg);
}
*html div#final_footer { 
	width: 965px;
	margin-right: 1px;
}

.red {
background: #FF0000;
}
.hr_gray {
background: #c8c8c8;
border: 0;
height: 1px;
margin: 5px 0;
}

/* ------------------------------ HEADER & MENU ------------------------------------------ */
div#top_banner {
	width: 949px;
	height: 180px;
	background: url(../images/top_banner_bg.jpg);
}
div#logo {
	float: left;
	width: 398px;
	padding: 10px 0 0 40px;
	text-align: left;
}
div#menu_wrap {
	float: left;
	padding: 0 0 0 40px;
	margin: 13px 0 0 0;
	height: 20px;
}
div#spacer_col {
	float: left;
	width: 18px;
	height: 50px;
}
div#top_container {
	float: left;
	width: 650px;
}                    

/* ------------------------------ BANNER & CUBE ADS ------------------------------------------ */
div#advertisement {
	float: right;
	padding: 5px 20px 0 0;
	width: 480px;
	height: 115px;
	text-align: left;
}
div#ad_banner {	
	position: relative;
	float: right;
	border: 1px solid #333;
	width: 477px;
	height: 100px;
}
div#ad_banner span.inner_banner{	
	position: absolute;
	top: 0;
	left: 0;
}

ul.reg { 
	padding: 0; 
	margin:  0 5px 10px 0;
	float: right;
}

/* ------------------------------ COLUMNS ------------------------------------------ */
div#left_col {
	float: left;
	width: 399px;
}
div#mid_col {
	width: 251px;
	float: left;
}
div#full_col {
	width: 650px;
	float: left;
}
div#right_col {
	width: 275px;
	float: right;
	margin-right: 18px;
}
div#admin_col {
	background-color: #FFF;
	margin: 10px 20px 5px;
}
/* ------------------------------ BOTTOM COLUMNS ---------------------------------- */
div#bot_left_col {
	float: left;
	width: 321px;
}
div#bot_mid_col {
	width: 319px;
	float: left;
}

/* ------------------------------ CONTAINER BOXES ------------------------------------------ */

div#yellow_small_container {
	background: url(../images/containers/yellow_bg.gif);
}
div#yellow_med_container {
	background: url(../images/containers/yellow_med_bg.gif);
}
div#gray_small_container {
	background: url(../images/containers/gray_bg.gif);
}
div#orange_small_container {
	background: url(../images/containers/orange_bg.gif);
}
div#orange_med_container {
	background: url(../images/containers/orange_med_bg.gif);
}
div#white_tiny_container {
	background: url(../images/containers/white_tiny_bg.gif);
}
div#white_small_container {
	background: url(../images/containers/white_tiny_bg.gif);
}
div#white_large_container {
	background: url(../images/containers/white_large_bg.gif);
}
div#white_full_container {
	background: url(../images/containers/white_full_bg.gif);
}
div#striped_container {
	height: 212px;
	padding: 0px;
	margin: 0px;
}
div#striped_container a {
	color: #FFF;
}
/* ------------------------------ STRIPED ------------------------------------------ */
div#striped_container #container_header {
	background-repeat: no-repeat;
}
div#striped_container #container_bot{
	background: url(../images/containers/striped_bot.gif);
	height: 212px;
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ GRAY ------------------------------------------ */
div#gray_small_container #container_header {
	background: url(../images/containers/gray_top.gif);
	background-repeat: no-repeat;
}
div#gray_small_container #container_bot{
	background: url(../images/containers/gray_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ YELLOW ------------------------------------------ */
div#yellow_small_container #container_header {
	background: url(../images/containers/yellow_top.gif);
	background-repeat: no-repeat;
}
div#yellow_small_container #container_bot{
	background: url(../images/containers/yellow_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ MEDIUM YELLOW ----------------------------------- */
div#yellow_med_container #container_header {
	background: url(../images/containers/yellow_med_top.gif);
	background-repeat: no-repeat;
}
div#yellow_med_container #container_bot{
	background: url(../images/containers/yellow_med_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ ORANGE ------------------------------------------ */
div#orange_small_container #container_header {
	background: url(../images/containers/orange_top.gif);
	background-repeat: no-repeat;
}
div#orange_small_container #container_bot{
	background: url(../images/containers/orange_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ MEDIUM ORANGE ----------------------------------- */
div#orange_med_container #container_header {
	background: url(../images/containers/orange_med_top.gif);
	background-repeat: no-repeat;
}
div#orange_med_container #container_bot{
	background: url(../images/containers/orange_med_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ WHITE ------------------------------------------ */
div#white_small_container #container_header {
	background: url(../images/containers/white_tiny_top.gif);
	background-repeat: no-repeat;
}
div#white_small_container #container_bot{
	background: url(../images/containers/white_tiny_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ WHITE FULL ------------------------------------ */
div#white_tiny_container #container_header {
	background: url(../images/containers/white_tiny_top.gif);
	background-repeat: no-repeat;
}
div#white_tiny_container #container_bot{
	background: url(../images/containers/white_tiny_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ WHITE LARGE ------------------------------------ */
div#white_large_container #container_header {
	background: url(../images/containers/white_large_top.gif);
	background-repeat: no-repeat;
}
div#white_large_container #container_bot{
	background: url(../images/containers/white_large_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}
/* ------------------------------ WHITE FULL ------------------------------------ */
div#white_full_container #container_header {
	background: url(../images/containers/white_full_top.gif);
	background-repeat: no-repeat;
}
div#white_full_container #container_bot{
	background: url(../images/containers/white_full_bot.gif);
	background-position: bottom;
	background-repeat: no-repeat;
}

/* ------------------------------ TAB VIEWING ------------------------------------------ */

div#usertabs {
	display: block;
	
	font: 12px Arial, Helvetica, sans-serif;
	border-bottom: 5px solid  #FF9900;
}

div#usertabs div.tab, div#usertabs div.tab-active {
	text-align: center;
	padding: 4px 0;
	margin-right: 2px;
}

div#usertabs div.tab, div#usertabs div.tab a {
	background-color: #FFCC00;
	color: #000;
}
div#usertabs div.tab-active, div#usertabs div.tab-active a {
	background-color: #FF9900;
	color: #FFF;
}

div#usertabs a {
	text-decoration: none;
}

div#usertabs a:hover {
	text-decoration: underline;
}

div#usertabs #tab-classifieds, div#usertabs #tab-account, div#usertabs #tab-dirt-listings, div#usertabs #tab-advertising, div#usertabs #tab-biz-dir, div#usertabs #tab-blog { float: left; }

div#usertabs #tab-account		{ width: 80px; }

div#usertabs #tab-dirt-listings	{ width:  80px; }

div#usertabs #tab-classifieds { width:  80px; }

div#usertabs #tab-advertising { width:  80px; }

div#usertabs #tab-blog { width:  80px; }

div#usertabs #tab-biz-dir { width: 120px; }

div.upgrade_wrapper { background: #ebe5cf; }


/* ------------------------------ ACCOUNT CONTAINERS ------------------------------------------ */
div#borderbox {
	display: block;
	padding: 15px;
	border: 1px solid #df901c;
}
div#borderbox .float_left {
	margin-right: 15px;
}
div#borderbox .float_right {
	margin-left: 15px;
}

/* ------------------------------ END CONTAINER BOXES ------------------------------------------ */
div#page_end {
	background: url(../images/bottom_cap.jpg);
	width: 965px;
	height: 20px;
}
div#footer {
	padding: 5px;
	width: 965px;
	color: #CCC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}
div#footer a {
	color: #CCC;
	text-decoration: none;
}
div#footer a:hover {
	color: #FFF;
	text-decoration: underline;
}
div#copyright {
	float: left;
	text-align: left;
	margin-left: 25px;
}
div#credits {
	float: right;
	width: 350px;
	text-align: right;
	margin-right: 25px;
}

/* ------------------------------ FEEDS ------------------------------------------ */

a.feed{
    position:relative; /*this is the key*/
    z-index:24;
	}
a.feed span{ display: none; }
a.feed:hover{ z-index:25; }
a.feed:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:20px; left:20px; width:450px;
    border:1px solid #666;
    background-color: #CCC;
	color:#000;
	padding: 5px;
    text-align: left;}

/* ------------------------------ DROPDOWN MENU ------------------------------------------ */

body div#main_menu ul li ul, body div#main_menu ul li ul li ul {
	display: none;
	}
div#main_menu {	
	float: left;
	text-align: left;
	z-index: 50;
	position: relative; 
}
div#main_menu ul {
	float: left;
	margin: 0;
	padding: 0;
}
div#main_menu li {
	float: left;
	position: relative;
	padding: 0 10px 0 0;
	list-style-type: none; 	
}
div#main_menu a {
	display: block;
	text-decoration: none;
	margin: 0;
} 
div#main_menu ul li ul:hover, div#main_menu ul li:hover ul {
	display: block;
}
div#main_menu ul li ul {
	margin: 0px;
	position: absolute;
	width: 145px;		
	z-index: 25;
	border: 2px solid #45291b;
	background-color: #d5731c;
}
div#main_menu ul li ul li {
	width: 145px;
	padding: 0px;
	color: #D14F1E;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
}
div#main_menu ul li ul li a{
	width: 121px;
	border-top: 0;
	padding: 8px 12px;
	color: #000;
	margin: 0px;
}
div#main_menu ul li ul li:hover ul {
	display: block;
	left: 120px;
}
div#main_menu ul li a {
	padding: 0px;
	color:#FFFFFF;
}
div#main_menu ul li a:hover {
	color: #272262;
}

div#main_menu ul li ul li a:hover {
	color: #000;
	background-color: #999;
}
div#main_menu ul li ul li:first-child {
	border-top: 0;
}

div#main_menu ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* second level popouts start here*/
div#main_menu ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* third level popouts start here*/
div#main_menu ul li ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */
	
/* pop-out starts here */
div#main_menu ul li ul li ul  {
	visibility:hidden; /* same effect as display:none in this situation */
	top:-1px;
	left:10em;
	}


/* THE HACK ZONE - */
* html div#main_menu ul {
	float:left; /* makes the ul wrap the li's */
	margin-left:0px; /* IE doubles the given value above - why? */
	}

*html div#right_col {
	width: 275px;
	float: right;
	margin-right: 1px;
}

/* add a top line to drops and pops in IE browsers - can't read :first-child */
* html  div#main_menu ul li ul {
	border-top:1px solid #692E02;
	border-left:0px; /* stops the drop inheriting the ul border */
	}
/* the Tantek hack to feed IE Win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */
* html  div#main_menu ul li ul li ul { 
  left:0; 
  voice-family: "\"}\""; 
  voice-family:inherit;
  left:0em;
  } 
/* and the "be nice to Opera" rule */
html>body div#main_menu ul li ul li ul {
  left:0em;
} 

/* END OF HACK ZONE */

/* FLOATERS */

.float_left, #float_left {
	float: left;
}
.float_right, #float_right {
	float: right;
}

/* CLEARFIX */

.clear, #clear {
	clear: both;
}