@charset "utf-8";
/*
  people4people.com global page styles
    - rev. 07 Jan 08
*/

* html {border:0; margin:0; padding:0}
body {background:#fff url('/imgs/bg_page.gif') top repeat-x; font-size:90%; margin:0; padding:0px}


/***** headr stuff *****/
#headr {width:800px; height:100px; margin:0 auto; padding:0; position:relative}
	#headr h1 {margin:0; padding:0; background:url('/imgs/p4p_logo.png') no-repeat; top:46px; height:74px; position:relative; text-indent:-2000px;}
#boilr {width:800px; height:100px; margin:0 auto; padding:0; position:relative}
	#boilr h2 {margin:0; padding:0; top:19px; position:relative; font:italic normal 1.3em "Trebuchet MS", sans-serif; color:#4e463f}
h3 {font:italic normal 1.5em "Trebuchet MS", sans-serif; color:#96A912; margin:0px 0px 16px; padding:0}
h4 {font:normal 1.2em "Trebuchet MS", sans-serif; color:#96A912; margin:0px 0px 8px; padding:0}
h5 {}
h6 {}
#boilr img {float:right; padding-top:7px}


/***** main content stuff *****/
#content {width:800px; position:relative; background:#fff url('/imgs/bg_content.png') center top no-repeat;
	margin:30px auto; padding:50px 0 30px; border:1px solid #ccc; overflow:auto}

#inner_content {width:560px; float:right; margin:0 20px 0 0; padding:0; position:relative;
font:normal 1.0em/1.2em Verdana, Arial, Helvetica, sans-serif; color:#586c78}
	#inner_content ul {margin:7px 15px; line-height:1.2em; margin-bottom:15px; font:normal 1.0em Verdana, Arial, Helvetica, sans-serif; color:#586c78}
	#inner_content ul li {list-style-image:url('/imgs/ico_rightarrow.png'); padding-left:0}
	#inner_content ul li a, #inner_content a {color:#91278f; line-height:1.4em; text-decoration:none}
	#inner_content ul li a:hover, #inner_content a:hover {background:#ffffcc; text-decoration:underline}
	#inner_content .highlight {width:440px; background:#ffffcc; color:#685d00}

.success_stories {margin:20px auto; padding:12px 10px 10px 10px; background-color:#f9f7f0; color:#586C78;
	border-bottom:5px double #f5f2e0; border-top:5px double #f5f2e0}
	.success_stories p {font-size:1em; margin:0; padding:4px}
	cite .success_source {font-weight:normal; font-style:italic; font-size:1.0em; font-family:Verdana, Arial, Helvetica, sans-serif; margin:0}
.big_emph {color:#91278f; margin:0 0 10px; padding:0}
.bquote {font-family:Georgia, "Courier New", Courier, monospace; float:left;
     height:30px; margin-top:-20px; padding-top:45px; margin-bottom:-50px; font-size:800%; color:#f5f2e0}

#affLogos {text-align:center; display:block; height:84px}
	#affLogos img {border:none}

.cleaner {clear:both}


/***** faq stuff *****/
.faq_headers {background-color:#fffffb; border-bottom:1px solid #e3ecb9; color:#789201;
	font:18px normal Arial,Helvetica,sans-serif; line-height:23px; text-transform:none}
.faq_headers p {color:#586c78; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:13px; line-height:21px}

.show-hide {width:100%}

.show-hide h5 {font:normal 0.95em "Trebuchet MS", sans-serif; color:#495667; margin:12px 0 0 0; border-top:1px dotted #eee; cursor:pointer; line-height:1.4em; 
	background:url('/imgs/ico_rightarrow.png') no-repeat; padding:0 0 0 10px}
/*  works good in FF but of course not in IE - diagnose later
.show-hide h5 {font:normal 0.95em "Trebuchet MS", sans-serif; color:#495667; margin:12px 0 0 0; border-top:1px dotted #eee; cursor:pointer; line-height:1.6em}
.show-hide h5:before {padding:0 6px; margin:0; content:url('/imgs/ico_rightarrow.png')}
*/

.show-hide h5:hover {background:#eddbed url('/imgs/ico_rightarrow.png') no-repeat}
.show-hide div {margin-left:1.5em; padding:6px 6px 20px 6px; background-color:#eddbed; text-align:justify}
	.show-hide div p {font:normal 0.95em "Trebuchet MS", sans-serif; color:#495667; margin:0; padding:0}


/***** inner nav stuff *****/
#inner_nav {width:180px; float:left; margin:0 0 0 20px; padding:0}
#inner_nav ul {margin:0px 0px 75px; padding:0px; color:#8493A8; font:normal 1.0em Verdana, Arial, Helvetica, sans-serif; list-style-type:none}
#inner_nav li {border-bottom:1px solid #d3a6d2; display:block; height:28px; line-height:180%; margin:0; padding:0; text-indent:26px}
#inner_nav .active {background:url('/imgs/menu_active.png') no-repeat; color:#fff; text-decoration:none}
#inner_nav li a, #inner_nav li a:link {color:#8493A8; text-decoration:none; display:block; height:28px}
#inner_nav li a:visited {color:#8493A8; text-decoration:none}
#inner_nav li a:hover {color:#495667; background:url('/imgs/menu_hover.png') no-repeat; text-decoration:none}


/***** footr stuff *****/
#footr {width:auto; margin:0 auto; padding:0; position:relative; clear:both}
#footr_content {width:800px; height:84px; margin:0 auto; clear:both; font:normal 0.9em Verdana, Arial, Helvetica, sans-serif; color:#999}
	#footr_content a, #footr_content a:link, #footr_content a:visited {color:#999; text-decoration:underline}
	#footr_content a:hover {color:#777; text-decoration:none}

/***** user panel stuff *****/
#columnContainer { 
	width:560px;
	margin:0;
	float:left;
	margin-bottom:17px;
	position:relative; 
	clear:both;
}

#columnContainer fieldset {
	margin:0;
	padding:0;
	border:0;
}

#columnContainer ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

#columnContainer li {
	display:block;
	margin:0;
	padding:3px 0px 3px 0px;
	float:left;
	border-bottom:solid 1px #d3a6d2;
}

#column {
	width:50px; 
	margin:0; 
	padding:0; 
	float:left;
	text-align:left;
	font-size:0.7em;
}

#column .active {
	background-color:#eee8dd;
}

#column li {
	width:50px;
}

#columnDef {
	width:100px; 
	margin:0; 
	padding:0; 
	float:left;
	text-align:left;
	font-size:0.7em;
}

#columnDef li {
	width:100px;
}

#column .total {
	font-weight:bold;
}

#columnContainer .categoryHeader {
	font-weight:bold;
}

/* User & Admin Control Panel */
#app_content { width:560px; float:right; margin:0 20px 0 0; padding:0; position:relative; 
			  font:normal 1.0em/1.2em Verdana, Arial, Helvetica, sans-serif; color:#586c78 }
#app_content a {color:#91278f; text-decoration:none}
#app_content a:hover {background:#ffffcc; text-decoration:underline}
#app_content ul { list-style-type:none; margin:0; padding:0 }
#app_content  li { display:block; margin:0; padding:2px 0px 2px 0px }
#app_content .errorMsg { text-align:left; font-weight:bold; color:red; }
#app_content .successMsg { text-align:left; font-weight:bold; color:#91278f; }

#customerInfo { width:560px; font-size:0.9em; margin-bottom:20px }
#customerInfoLeft { float:left; width:175px; font-weight:bold }
#customerInfoRight { float:left; width:385px }
#customerInfoRight li { display:block; float:left; width:385px; height:17px }

#expenseForm { width:500px; padding:0; margin:0; float:left; clear:both }
#expenseForm fieldset { border:0; padding:0; margin:0; }
#expenseForm .inline {float:left; clear:none; }
#expenseForm label { font-size:0.9em; float:left; width:125px; display:block; margin:-1px }
#expenseForm input { font:normal 0.9em Verdana, Arial, Helvetica, sans-serif; width:72px; 
				  margin-bottom:4px; margin-right:4px; text-align:right; padding-right:3px; 
				  background-color:#fffadb; border:1px solid #cbb945; color:#776b1b }
#expenseForm .expensesFormWrapper { width:250px; float:left; text-align:left; margin-bottom:15px; }
#expenseForm .extraTop { margin-top:5px }
#expenseForm input.button { width:150px; border:1px solid #eee8dd; color:#fff; font-weight:bold; 
						 background:#91278f; padding:5px; cursor:pointer; margin-top:10px; text-align:center }

#profileForm { width:560px; padding:0; margin:0; float:left; clear:both }
#profileForm fieldset { border:0; padding:0; margin:0; }
#profileForm .inline {float:left; clear:none; }
#profileForm label { font-size:0.9em; float:left; width:200px; display:block; margin:-1px }
#profileForm input, select { font:normal 0.9em Verdana, Arial, Helvetica, sans-serif; width:125px; 
				  margin-bottom:4px; margin-right:4px; text-align:left; padding-left:4px; 
				  background-color:#fffadb; border:1px solid #cbb945; color:#776b1b }
#profileForm select { width:131px; padding:0 }
#profileForm .formWrapper { width:260px; float:left; text-align:left; margin-bottom:15px; }
#profileForm .formWrapperLeft { margin-right:15px }
#profileForm .formWrapperLong { width:100% }
#profileForm .formInputLong { width:250px }
#profileForm .formSelectLong { width:256px }
#profileForm input.button { width:150px; border:1px solid #eee8dd; color:#fff; font-weight:bold; 
						 background:#91278f; padding:5px; cursor:pointer; margin-top:10px; text-align:center }
#profileForm .formatText { float:left; font-size:1em; font-style:italic; }
						 
#supportDisplay { width:560px; border:1px solid #d3a6d2; font-size:0.9em; margin-bottom:20px; float:left; padding-bottom:3px }
#supportDisplay .header { background-color:#91278f; font-weight:bold; color:#fff; float:left; line-height:1.7em; 
						 text-align:left; padding:0px 5px 1px 5px }
#supportDisplay .column1 { width:140px; float:left }
#supportDisplay .column2 { width:140px; float:left }
#supportDisplay .column3 { width:270px; float:left }
#supportDisplay .data { text-align:left; padding:2px 5px 0px 5px; margin-bottom:3px; border-top:1px solid #d3a6d2 }

#supportForm { width:560px; font-size:0.9em; margin-bottom:8px; margin-top:-6px; float:left; padding:3px 0px 3px 0px }
#supportForm input, textarea { background-color:#fffadb; border:1px solid #cbb945; color:#776b1b; padding:2px; font-size:1.2em }
#supportForm input { width:300px }
#supportForm fieldset { border:0; padding:0; margin:0 }
#supportForm label { line-height:1.8em; font-size:1.1em }
#supportForm textarea { width:500px }
#supportForm input.button { width:175px; border:1px solid #eee8dd; color:#fff; font-weight:bold; font-size:1.1em; 
						 background:#91278f; padding:5px; cursor:pointer; margin-top:10px; text-align:center }

#homeContainer { }
#homeContainer h4 { margin:0; padding:0; margin-bottom:5px; }
#homeContainer .header { padding-left:140px; font-size:.9em; font-weight:bold; border-bottom:solid 1px #d3a6d2; 
						padding-bottom:3px; }
#homeContainer .column { display:block; float:left; width:135px; font-size:.9em; padding-left:5px; }
#homeContainer .columnHeader { display:block; float:left; font-size:.9em; font-weight:bold; 
							  width:139px; border-right:solid 1px #d3a6d2; }
#homeContainer .data { font-size:.9em; border-bottom:solid 1px #d3a6d2; padding:3px 0px 3px 0px; }
#homeContainer .ob { color:red; font-weight:bold; }

#travelContainer { }
#travelContainer h4 { margin:0; padding:0; margin-bottom:5px; }
#travelContainer .header { padding-left:140px; font-size:.9em; font-weight:bold; border-bottom:solid 1px #d3a6d2; 
						padding-bottom:3px; }
#travelContainer .column { display:block; float:left; width:135px; font-size:.9em; padding-left:5px; }
#travelContainer .columnHeader { display:block; float:left; font-size:.9em; font-weight:bold; 
							  width:139px; border-right:solid 1px #d3a6d2; }
#travelContainer .data { font-size:.9em; border-bottom:solid 1px #d3a6d2; padding:3px 0px 3px 0px; }
#travelContainer .ob { color:red; font-weight:bold; }

#debtContainer { }
#debtContainer h4 { margin:0; padding:0; margin-bottom:5px; }
#debtContainer .header { padding-left:140px; font-size:.9em; font-weight:bold; border-bottom:solid 1px #d3a6d2; 
						padding-bottom:3px; }
#debtContainer .column { display:block; float:left; width:135px; font-size:.9em; padding-left:5px; }
#debtContainer .columnHeader { display:block; float:left; font-size:.9em; font-weight:bold; 
							  width:139px; border-right:solid 1px #d3a6d2; }
#debtContainer .data { font-size:.9em; border-bottom:solid 1px #d3a6d2; padding:3px 0px 3px 0px; }
#debtContainer .ob { color:red; font-weight:bold; }

#miscContainer { }
#miscContainer h4 { margin:0; padding:0; margin-bottom:5px; }
#miscContainer .header { padding-left:140px; font-size:.9em; font-weight:bold; border-bottom:solid 1px #d3a6d2; 
						padding-bottom:3px; }
#miscContainer .column { display:block; float:left; width:135px; font-size:.9em; padding-left:5px; }
#miscContainer .columnHeader { display:block; float:left; font-size:.9em; font-weight:bold; 
							  width:139px; border-right:solid 1px #d3a6d2; }
#miscContainer .data { font-size:.9em; border-bottom:solid 1px #d3a6d2; padding:3px 0px 3px 0px; }
#miscContainer .ob { color:red; font-weight:bold; }

#expense-form select { width:300px; padding:2px; margin-right:5px; }
#expense-form input.textbox { width:60px; font-size:.9em; padding:3px; margin-right:5px; background-color:#fffadb; border:1px solid #cbb945; color:#776b1b; }

#expense-list ul.item { display:inline; }
#expense-list ul.item li { float:left; }
#expense-list ul.header { font-weight:bold; }
#expense-list ul.item li.expense { width:300px; }
#expense-list ul.item li.date { width:125px; }
#expense-list ul.item li.amount { width:100px; }

#budget-snapshot ul.item { display:inline; }
#budget-snapshot ul.item li { float:left; }
#budget-snapshot ul.header { font-weight:bold; }
#budget-snapshot ul.item li.category { width:300px; }
#budget-snapshot ul.item li.allowed { width:125px; }
#budget-snapshot ul.item li.remaining { width:125px; }
#budget-snapshot .neg { color:red; font-weight:bold; }