/* -----------------------------------------------------------------------

Uniting People International: Main Site Basic CSS

author: Tarquin Rees
agency: www.okapicreative.com
mail: hello@okapicreative.com
version: 4.1
date: May 2009

----------------------------------------------------------------------- */

@import url(profiles.css);
@import url(projects.css);
@import url(typography.css);


body {
	
	margin: 0;
	margin-bottom: 30px;
	padding: 0;
	background: url(http://www.unitingpeople.com/images_main/back.png) top left repeat-x;
	background-color: #fbfaff;
	}

/* =Main Layout Divs
----------------------------------------------------------------------- */	

#wrapper {

	margin: 0px auto 0px auto;
	padding: 0;
	width: 900px;
	background-color: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	}
	
#footer {

	margin: 0px auto 60px auto;
	padding: 0;
	width: 900px;
	background-color: #fff;
	text-align: center;
	}

#header, #header_es {

	margin: 0;
	padding: 0;
	height: 160px;
	background: url(http://www.unitingpeople.com/images_main/header_new.png) top left no-repeat;
	background-color: #fff;
	}

#header_es {

	background: url(http://www.unitingpeople.com/images_main/header_new_es.png) top left no-repeat;
	}
	
#content {

	margin: 0px 0px 0px 25px;
	padding: 0;
	width: 850px;
	}
	
#menu {

	margin: 0;
	padding: 0;
	height: 40px;
	background: url(http://www.unitingpeople.com/images_main/menuback_new.png) top left no-repeat;
	}

#main, #main_proj {

	margin: 10px 0px 0px 10px;
	padding-bottom: 250px;
	width: 600px;
	float: left;
	}	

#sidebar, #sidebar_project, #sidebar_404 {

	margin: 10px 0px 20px 30px;
	padding-bottom: 250px;
	width: 200px;
	background: url(http://www.unitingpeople.com/images_main/login.png) top left no-repeat;
	float: left;
	}

#sidebar_404 {

	margin: 0px 0px 0px 0px;
	padding-bottom: 250px;
	}
	
#sidebar_project {

	background: none;
	}
	
#clear {

	clear: left;
	}
	
#clear_home {

	margin: 0px 0px 0px 0px;
	height: 0px;
	clear: left;
	}

#login {

	margin: 0;
	padding: 35px 0px 0px 20px;
	height: 200px;
	}

div.biopic {
	
	margin: 0px 0px 30px 0px;
	padding: 0px;
	}

#flash {

	margin: 0px 0px 30px 0px;
	padding: 5px;
	}
	
/* =Featured Projects - Home Page
----------------------------------------------------------------------- */	

img.proj_feat {

	margin: 20px 20px 0px 0px;
	padding: 5px;
	border: 1px solid #ccc;
	float: left;
	}	
	

/* Home Page Top Menu
----------------------------------------------------------------------- */	

#menu ul {

	margin: 0px 0px 0px 0px;
	padding-top: 12px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 15px;
	font-weight: 700;
	text-align: center;
	}

#menu ul li {

	display: inline;
	}

#menu ul li a {

	padding: 5px 20px 2px 20px;
	color: #6284a6;
	font-weight: normal;
	text-decoration: none;
	}

#menu ul li a:hover {

	color: #f1a819;
	}
	
#home #menu .home a, #how #menu .how a, #about #menu .about a, #news #menu .news a, #projects #menu .projects a, #contmen #menu .contmen a, #faq #menu .faq a {

	color: #A68F62;
	font-weight: normal;
	cursor: default;
	}

/* Language Menu
----------------------------------------------------------------------- */	

#header ul, #header_es ul {

	margin: 0;
	padding: 10px 40px 0px 0px;
	font-size: 10px;
	letter-spacing: 1px;
	font-weight: normal;
	color: #ccc;
	text-align: right;
	}

#header ul li, #header_es ul li {

	display: inline;
	}

#header ul li a, #header_es ul li a {

	color: #ccc;
	text-decoration: none;
	font-weight: normal;
	}

#header ul li a:hover, #header_es ul li a:hover {

	color: #336699;
	}



/* =Side Nav
----------------------------------------------------------------------- */	

div#arch ul li {

	margin-left: -20px;
	padding: 0;
	border-bottom: none;
	}

div#arch ul li {

	margin-left: -20px;
	padding: 0;
	border-bottom: none;
	}

div#arch ul li a:hover {

	background-color: #fff;
	}	
	
#sidebar_project ul {
	
	margin: 0px 20px 90px 0px;
	padding: 0;
	list-style-type: none;
	font-family: verdana, geneva, helvetica, arial, sans-serif;
	font-size: 12px;
	color: #999;
	background-color: #fff;
	font-weight: normal;
	text-align: left;
 	}
 
#sidebar_project ul li.top {
	
	border-top: 1px solid #dfdedd;
 	}
 	
#sidebar_project ul li {
	
	border-bottom: 1px solid #dfdedd;
 	}
 			
#sidebar_project ul li a {
 
 	display: block;
 	padding: 2px 0px 0px 15px;
 	text-align: left;
 	font-family: "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
 	font-size: 12px;
 	line-height: 27px;
 	font-weight: normal;
	text-decoration: none;
	color: #690;
	background-color: #fff;
 	}
 
 	
#sidebar_project ul li a:hover {

 	color: #7d7d7e;	
 	background-color: #f7f7f7;
 	}

#sidebar_project ul li a.selected {
 
 	color: #690;
 	background-color: #f7f6f6;
 	font-weight: normal;
 	}

#buttons {
 
 	margin-left: 10px;
 	}


/* =SubNav - Team Pages and Projects Pages 
##################### ##################### ##################### 
#####################  TO GO ????? ##################### 
##################### ##################### ##################### 
----------------------------------------------------------------------- */	

div#projmenu {

	margin: 0px 0px 25px -20px;
	padding: 0;
	text-align: left;
	}

#navlist ul {

	margin: 0;
	padding: 0;
	white-space: nowrap;
	}

#navlist li {

	margin: 0;
	display: inline;
	list-style-type: none;
	font-size: 11px;
	}

#navlist a {

	padding: 5px;
	border: 1px solid #ccc;
	background-color: #fff;
	}

#navlist a:link, #navlist a:visited {

	color: #999;
	text-decoration: none;
	}

#navlist a:hover {

	border: 1px solid #333;
	background-color: #fff;
	color: #666;
	}

#active a:link, #active a:visited, #active a:hover {

	border: 1px solid #999;
	background-color: #fff;
	color: #666;
	}


/* =Lists
----------------------------------------------------------------------- */	
	
ol, ul {

	margin: 20px 40px 10px 30px;
	padding: 0;
	color: #666;
	font-size: 12px;
	line-height: 19px;
	font-weight: normal;
	}

ol {

	margin-left: 50px;
	}
	
ol li {

	margin: 0px 0px 0px 0px;
	}

ul li#emph {

	margin: 20px 0px 30px 0px;
	font-weight: 700;
	list-style: none;
	}

ul.quest {
	
	list-style-type: none;	
	padding: 0;
	margin: 0px 0px 0px 0px;
	}

ul.projlist {

	margin: 10px 10px 10px 30px;
	padding: 0;
	color: #336699;
	font-size: 11px;
	line-height: 14px;
	font-weight: normal;
	}

ul.projlist li {

	margin: 8px 0px 0px 0px;
	padding: 0;
	}
	
ul.homelist {

	list-style-type: none;	
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	}

ul.homelist_sub {

	font-weight: normal;
	margin: -15px 0px 10px 40px;
	}

ul.homelist_sub2 {

	list-style-type: none;	
	font-weight: normal;
	margin: 10px 0px 10px 20px;
	}
	
ul.homelist_sub2 li {

	margin: 0px 30px 10px 0px;
	}
	
ul#social {

	margin: 5px 10px 10px 10px;
	padding: 0;
	list-style-type: none;
	}

ul#social li {

	margin: 10px 5px 10px 0px;
	display: inline;
	}

/* =Projects Page
----------------------------------------------------------------------- */	

div.listing {

	margin: 30px 40px 0px 0px;
	padding-bottom: 5px;
	border-bottom: 1px solid #ccc;
	}
	
div#proj_rating	{

	margin: 30px 30px 0px 15px;
	}	
	
div#main_rating {

	margin: 30px 30px 0px 15px;
	}
	
div#rankings {

	margin: 30px 30px 0px 45px;
	}

div.projclear {

	clear: left;
	}
		
img.proj_prof, img.mark_prof {

	margin: 0px 20px 0px 0px;
	padding: 5px;
	border: 1px solid #ccc;
	float: left;
	}

img.mark_prof, img.peop_prof {

	margin: 0px 20px 0px 0px;
	padding: 10px 5px 15px 5px;
	border: none;
	float: left;
	}

img.peop_prof {

	margin: 5px 20px 0px 10px;
	padding-bottom: 35px;
	}

/* =Team Pages
----------------------------------------------------------------------- */

.team {
	
	margin: 60px 0 40px 15px;
	width: 450px;
	border-collapse: collapse;
	font-family:  arial, verdana, geneva, helvetica, sans-serif;
	color: #666;
	font-size: 13px;
	line-height: 19px;
	}

td.pic {
	
	width: 170px;
	}

	
/* Blogs/Community Divs and Layout 
----------------------------------------------------------------------- */	

div.comment_main, div.comment_alt1, div.comment_alt2 {

	margin: 0px 60px 0px 0px;
	padding: 0px 0px 0px 0px;
	background: #fff;
	border-bottom: 1px dotted #ccc;
	}

div.comment_alt1 {

	background: #fff;
	}

div.comment_alt2 {

	background: #f7f7f7;
	}

#comm_out {

	margin: 30px 0px 0px 0px;
	width: 500px;
	}

#comm_out label {

	float: left;
	width: 50px;
	}

#left_blog {

	margin: 0;
	}

.textarea {

	border-top: 1px solid #999;
	border-left: 1px solid #999;
	background-color: #fff;
	color: #999;
	font-family: Verdana, Geneva, Tahoma, "Trebuchet MS", Arial, Sans-serif;
	font-size: 11px;
	margin-top: 3px;
	margin-bottom: 3px;
	}


/* =Links page code display
----------------------------------------------------------------------- */	

div.code {

	margin: 0;
	padding: 0;
	color: #666;
	font-size: 12px;
	}

div.code blockquote {

	margin: 0;
	padding: 5px;
	width: 550px;
	border: solid 1px #ccc; 
	background-color: #fafafa;
	}

/* =Marketplace Pages
----------------------------------------------------------------------- */	

img.key {

	margin: 0px 0px 30px 15px;
	}
	
div.mark_listing1, div.mark_listing2, div.mark_listing3 {

	margin: 0px 40px 0px 0px;
	padding: 0;
	border: 1px solid #fff;
	border-top: 1px dotted #ccc;
	}

div.mark_listing1 {
	
	background: #fff;
	}

div.mark_listing2 {

	background: #f7f7f7;
	}

div.mark_listing3 {

	background: #fffff0;
	}

div.mark_listing1 h4, div.mark_listing2 h4, div.mark_listing3 h4 {

	margin: 15px 0px 10px 0px;
	}

div.mark_listing1 p, div.mark_listing2 p, div.mark_listing3 p {

	font-size: 11px;
	color: #666;
	}


	
/* =Donations Pages
----------------------------------------------------------------------- */	
	
div#donate, div#donate1 {
	
	margin: 0px 0px 75px 0px;
	padding: 30px;
	width: 500px;
	border: 1px dotted #ccc;
	background-color: #fafafa;
	}

div#donate1 {
	
	background-color: #fff;
	}


/* =Featured Projects - Home Page
----------------------------------------------------------------------- */	


img.proj_feat {

	margin: 20px 20px 0px 0px;
	padding: 5px;
	border: 1px solid #ccc;
	float: left;
	}	

	
	
/* =Images
----------------------------------------------------------------------- */	

img {

	border: 0;
	}

img.intext {

	margin: 30px 0px 10px 10px;
	}
	
img.head, img.memb {
	
	margin: 0px 0px 20px 0px;
	background-color: #fff;
	border-color: #ddd;
	border-top: solid #eee 1px;
	border-left: solid #eee 1px;
	border-style: solid;
	border-width: 1px;
	padding: 5px;
	}	

img.linkbutt {
	
	margin-top: 70px;
	border: 1px solid #ccc;
	}

img.team_prof {
	
	border: 1px solid #333;
	}
	
/* =Log-ins & Forms
----------------------------------------------------------------------- */	

p {

	margin-right: 30px;
	}
	
#fieldset {

	height: 190px;
	}
	
#contform fieldset {

	padding-left: 30px;
	border: 1px solid #ddd;
	margin-bottom: 30px;
	background-color: #f6f6f6;
	width: 450px;
	}

#contform legend {

	font-size: 14px; 
	font-weight: 700;
	color: #ce8f62;
	}
	
#contform label {

	float: left;
	width: 10em;
	}
	
#contform p input {

	width: 200px;
	}

#contform form#contact {

	margin: 0;
	}
	
#contform p.form_butt input {

	text-align: center;
	margin: 10px 0 0 0px;
	width: 75px;
	}

#contform textarea {

	margin-top: 20px;
	width: 400px;
	height: 150px;
	}

#contform p.top {

	margin-top: 20px;
	}

fieldset#interest, fieldset#newsletter {

	margin: 0;
	padding: 0;
	width: 460px;
	border: none;
	background: transparent;
	}
	
fieldset#interest p input.checkbox, fieldset#newsletter p input.checkbox {

	margin: 3px 0px 0px 0px;
	padding: 0;
	float: left;
	width: auto;
	}
	
fieldset#interest p label, fieldset#newsletter p label {

	margin: 0px 0 0 10px;
	padding: 0;
	float: none;
	display: inline;
	font-size: 12px;
	}

#login2 {

	margin: 40px 0px 0px 0px;
	padding: 0;
	width: 300px;
	}

#login input.butt {

	margin-top: 5px;
	margin-bottom: 25px;
	}
	
	
/* =Sliding Div on Platform
----------------------------------------------------------------------- */	

div#slidebox {
	
	background: #fafaf8;
	color: #fff;
	width: 520px;
	padding: 10px;
	margin: 5px 0px 5px 0px;
	border: 1px dotted #ccc;
	}

div#space {
	
	margin-top: 220px;
	}

/* =Tag Cloud
----------------------------------------------------------------------- */	

#cloud {

	margin-bottom: 20px;
	text-align: center;
	}
			
#cloud a {

	color: #999;
	}
			
#cloud a:hover {

	color: #336699;
	}
	
h4.tag {

	margin: 0px 0px 5px 10px;
	}

p.tagblurb {

	margin: 0px 0px 5px 10px;
	}

p.tagblurb a {

	color: #999;
	font-size: 12px;
	}

p.tagblurb a:hover {

	color: #336699;
	}