/* 
Prático uses some of Blueprint CSS Framework 0.7.1 - http://blueprintcss.googlecode.com 
* Copyright (c) 2007-2008. See LICENSE for more info.
*/

@import "reset.css";
@import "type.css";
@import "forms.css";
@import "grid.css";
@import "custom.css";

h1#logo {
	float:left;
	margin-top:20px;
	margin-bottom:0;
	display:inline;
}

#signin {
	background:#efe47c url(../images/bg_signin.png) repeat-x top left;
	width:280px;
	float:right;
	padding-top:1.8em;
	}
	
	#signin form { 
	background:url(../images/bg_sombra_signin.png) no-repeat bottom left; 
	padding:10px 10px 0;
	padding-bottom:20px; 
	margin:0 0 -20px; 
	}
		#signin h3, #welcome h2 { margin-bottom:0.5em; }
	
#news {
	width:260px;
	background:#fff;
	float:right;
	clear:right;
	margin-top:1.5em;
	padding:10px;
	}
	
#welcome {
	background:url(../images/bg_welcome.png) repeat-x top left;
	margin-right:300px;
	padding:1.8em 10px;
	}
	
	#welcome .welcomeshaddow {
		background:url(../images/bg_sombra_welcome.png) no-repeat bottom left;
		margin:0 -10px -10px;
		padding-bottom:47px;
		}
		
		#welcome ul li { margin-left:15px; background:url(../images/bulet_welcome.gif) no-repeat left 8px; }
			#welcome ul li:first-letter { padding-left:10px; }
		
#welcomeactions {
	margin-right:300px;
	position:relative;
	height:110px;
	padding:10px;
	background:#fff;
	}
		#welcomeactions li { float:left; margin-right:10px; }
		#welcomeactions a {
			display:block;
			height:64px; width:64px;
			margin:1px;
			background-repeat:no-repeat;
			background-position:bottom;
			}
			
			#welcomeactions a span {
				position:absolute;
				bottom:10px;
				display:none;
				width:297px;
				height:28px;
				color:#000;
				text-indent:-9000px;
				margin-left:-150px;
				left:50%;
				}
				
				#welcomeactions a:hover {
					background-color:#fcfae5;
					border: 1px solid #efe47c;
					margin:0;
					}
				#welcomeactions a:hover span {
					display:block; 
					}
				
	#welcomeactions a.link_signup { background-image: url(../images/ico_signup.png); }
	#welcomeactions a.link_join { background-image:url(../images/ico_join.png); }
	#welcomeactions a.link_blog { background-image:url(../images/ico_blog.png); }
	#welcomeactions a.link_dev { background-image:url(../images/ico_developers.png); }
	
		#welcomeactions a.link_signup span { background: url(../images/copy_signup.png) no-repeat top; }
		#welcomeactions a.link_join span { background:url(../images/copy_join.png) no-repeat top; }
		#welcomeactions a.link_blog span { background:url(../images/copy_blog.png) no-repeat top; }
		#welcomeactions a.link_dev span { background:url(../images/copy_developers.png) no-repeat top; }



div#nav { float:right; }

/* --- SHORTCUTS --- */
div#shortcuts h2 { display:none; }

div#shortcuts ul li {	margin-bottom:1em; }

div#shortcuts a { font-size:14px; }
	div#shortcuts a:focus { background-color:transparent; }


/* --- TABS --- */
.squared div#tabs	{ background:url(../images/canto_aba_quadriculado.jpg) no-repeat bottom left; }
.lined div#tabs		{ background:url(../images/canto_aba_pauta.jpg) no-repeat bottom left; }
.clean div#tabs		{ background:url(../images/canto_aba_limpo.jpg) no-repeat bottom left; }

div#tabs {
	padding-left:90px;
	height:65px;
}

.squared div#tabs ul	{ background:url(../images/bg_abas_quadriculado.jpg) no-repeat bottom right; }
.lined div#tabs ul		{ background:url(../images/bg_abas_pauta.jpg) no-repeat bottom right; }
.clean div#tabs ul		{ background:url(../images/bg_abas_limpo.jpg) no-repeat bottom right; }

div#tabs ul {
	height:65px;
}
	div#tabs ul li {
		float:left;
		margin:0 10px 0 0;
	}

		div#tabs ul li a {
			display:block;
			height:23px;
			padding:10px 20px;
			font-size:16px;
			background:url(../images/bg_aba_inativa.jpg) no-repeat bottom right;
			float:left;
			text-decoration:none;
		}

			div#tabs ul li a:hover, div#tabs ul li a:focus{
				color:#000;
			}

		div#tabs ul li a.active {
			background-image:url(../images/bg_aba_ativa.jpg);
			padding-right:40px;
			font-weight:bold;
			text-decoration:none;
		}

/* --- CONTENT --- */

.squared div#content { background:url(../images/bg_note_quadriculado.jpg) repeat-y top left; }
.lined div#content { background:url(../images/bg_note_pauta.jpg) repeat-y top left; }
.clean div#content { background:url(../images/bg_note_limpo.jpg) repeat-y top left; }

div#content { padding-left:90px; }

/* --- Main Content --- */
.squared div#content_main { background:url(../images/bg_quadriculado.jpg) repeat-y top right; }
.lined div#content_main { background:url(../images/bg_pauta.jpg) repeat-y top right; }
.clean div#content_main { background:url(../images/bg_limpo.jpg) repeat-y top right; }

div#content_main { padding-right:20px; }

/* --- TEXT --- */

div.col#text {
	margin-right:300px;
	}

/* --- TODAY'S TASKS --- */

div#todaytasks {
	float:right;
	width:280px;
	}
	
	div#todaytasks div { 
	padding:10px;
	background:#fef9ca; 
	}
	
	div#todaytasks h5 {
		margin-bottom:1em;
		}
	
	div#todaytasks div ol { 	
		list-style-image:url(../images/bulet_single.png);
		list-style-position:inside;
		}
		
		div#todaytasks ol li {
			border-top:1px solid #d2cfa7;
			margin-bottom:0.2em;
			padding-bottom:0.2em;
			}
			
	.postit {
		margin:0 -10px;
		padding:0 10px;
		margin-bottom:-50px;
		padding-bottom:50px;
		min-height:190px;
		background:url(../images/bg_todaytasks.png) no-repeat bottom center;
		}
	
/* --- CONTACT'S CARDS --- */

div.card {
	background:#fff;
	border:1px solid #ddd;
	border-bottom:3px solid #ccc;
	margin:0 10px 1.5em 0;
	padding:10px;
	overflow:hidden;
	/*min-width:200px;
	max-width:330px;*/
	width: 45%;
	height: 98px;
	float: left;
	}
	
	div.card:hover {
		border-color:#999;
		}
	
	
	.pic { float:left; margin-right:10px; clear:none; }
		.pic .edit { vertical-align:top; }
	
	
	.fn { font-size:14px; font-weight:bold; }
		h4.fn { font-size:1.4em; font-weight:normal; margin-bottom:0; display:inline; }
	.tel { font-size:10px; white-space:nowrap; padding-left:20px; background:url(../images/ico_phone.png) no-repeat left; }
	.email { padding-left:20px; background-image:url(../images/ico_mail.png); background-position:left; background-repeat:no-repeat;}
	.org { font-style:italic; margin:0 5px; padding-left:20px; background:url(../images/ico_work.png) no-repeat left; }
	.tags { background:#eaeaea url(../images/ico_tag.png) no-repeat 3px; clear:left; float:left; margin-top:5px; padding-left:20px;}
		.card .tags { background-color:#f0f0f0; }

	div.tags ul { line-height:1.5em; float:left; }
		div.tags ul li { display:inline; padding:0 2px; border-right:1px solid #fff; font-size:10px; }
		
	#profile .tags { margin-bottom:1em;}

/* --- LETTER INDEX --- */

div#letter_index {
	float:left;
	padding-top:2px;
	width:37px;
	}

div#letter_index ul li {
	padding-bottom:1px;
	padding-right:9px;
	}
	
	div#letter_index ul li.active {
		background: url(../images/current_letter.png) no-repeat right;
		}

	div#letter_index ul a {
		display:block;
		padding: 0 4px;
		width:20px;
		background:#999;
		color:#000;
		text-align:center;
		text-decoration:none;
		line-height:1.41em;
		}
		
		div#letter_index ul a:hover, div#letter_index ul li.active a {
			background:#666;
			color:#fff;
			}
			
/* --- CONTACT LIST --- */
div#contact_list {
	/* no margin here until we implement the search by initial (contact book index by letter) */
	/* margin-left:60px; */
	width:155%;
	}
	
	div#contact_list ol li {
		margin-bottom:1.25em;
		padding: 0 2px;
		}
		
		div#contact_list ol li:hover {
			background:#fdfdfd;
			}
		
/* --- PAGE LIST --- */

div#page_list {
	margin:0 30px 0 60px;
	}

div#page_list ul {
	text-align:center;
	padding-top:1.25em;
	border-top:1px solid #666;
	}
	
	div#page_list ul li {
		display:inline;
		padding:0 10px 0 0;
		}
		
/* --- PROFILE --- */
#profile { margin-bottom:1.5em; }

div#info { margin-bottom:0.3em; height:94px; border-bottom:1px solid #666; }
	
div#about h4 { display:inline; }


div#contacts {
	width:260px;
	float:right;
	padding:0 10px;
	}
	
	div#contacts div { border-bottom: 1px solid #ccc; margin-bottom:1.255em; }
	
	
	div#contacts h5 {
		text-decoration:underline;
		font-size:1.2em;
		display:inline;
		}
		
		div#contacts ul { 
		margin:0 0 1.1em;
		list-style-image:url(../images/bulet_single.png);
		list-style-position:inside;
			}
			
			div#contacts ul li:hover { background-color:#ffe;}

	#contacts .tel, #contacts .email {background-image:none; padding:0; }	
	
			
div#notes { clear:left; padding:10px; background:#fff; border:1px solid #ddd; border-right:1px solid #ccc; border-bottom:1px solid #ccc;}
	div#notes form { max-width:320px; float:left; }
	div#notes h4, div#notes textarea { margin:0; }
	div#notes h4 { border-bottom:1px solid #d2cfa7; margin-bottom:1.1em; }
	div#notes select { float:left; margin-top:0; }
	div#notes input.button { float:right !important; }
	div#notes p { padding:10px; }
	
	div#notes h5 { margin-top:.7em; padding:0.75em 10px; margin-bottom:0.5em; background:#dedede; }
	div#notes li { clear:left; padding:0.8em 32px 0.9em 5px; border-bottom:1px solid #ccc; position:relative; }
		div#notes li:hover { background:#ffe; }
		div#notes li:hover .del { display:block; }
	div#notes .label { color: #fff; background-image:url(../images/bg_label.png); background-position:bottom; background-repeat:repeat-x; display:block; height:18px; font-size:.8em; padding:2px 2px 0; margin-right:5px; float:left; width:80px; text-align:center; }
	div#notes .observation { background-color:#713f4c;}
	div#notes .call { background-color:#4f7973; }
	div#notes .conversation { background-color:#558d9f;}
	div#notes .meeting { background-color:#87876d;}
	div#notes .other { background-color:#717171; }
	

/* --- BOTTOM --- */

.squared div#bottom p { background:#f5f5f5 url(../images/borda_bottom_quadriculado.jpg) no-repeat top right; }
.lined div#bottom p, .clean div#bottom p { background:#f5f5f5 url(../images/borda_bottom_pauta_limpo.jpg) no-repeat top right; }

.squared div#bottom { background:#f5f5f5 url(../images/canto_bottom_quadriculado.jpg) no-repeat top left; }
.lined div#bottom, .clean div#bottom { background:#f5f5f5 url(../images/canto_bottom_pauta_limpo.jpg) no-repeat top left; }

div#bottom { padding-left:80px; }
div#bottom p { padding-top:40px; text-align:center; }

/* --- CLASSES --- */

.faketabs {
	margin-bottom:1.5em;
	padding-left:1em;
	}
.faketabs li {
	border-right: 1px solid #006;
	display:inline;
	padding:0 5px;
	}	
	.faketabs li a { font-size:1.2em; }
	.faketabs li.last { border:none; }

#shortcuts .ico {
	display:block;
	height:32px;
	padding-left:40px;
	background-repeat:no-repeat;
	background-position:left;
	}
	
	.ico:hover { background-color:transparent; color:#000; } 
	
	.person { background-image:url(../images/ico_addperson.png); }
	.company { background-image:url(../images/ico_addcompany.png); }
	.task { background-image:url(../images/ico_addtask.png); }
	
.edit { font-size:0.9em; line-height:1em;}
	
	.edit:before	{ content:"("; }
	.edit:after		{ content:")"; }
	
a.del { display:block; width:12px; height:16px; position:absolute; top:2px; right:2px; border:1px solid #666; display:none; background:#ffc url(../images/ico_trash.png) no-repeat center; padding:2px; }

a.expand span, a.contract span, a.del span { display:none; }

a.expand:hover, a.contract:hover, a.expand:focus, a.contract:focus { background-color:transparent;}
a.expand, a.contract {background-repeat:no-repeat; background-position:center; margin-right:3px; }
.expand { background-image:url(../images/expand.gif);
	padding:0 8px; }
.contract { background-image:url(../images/contract.gif);
	padding:0 8px; }

.addfield { display:block; width:16px; height:16px; float:left; margin-top:7px; background:url(../images/ico_add.png) no-repeat top center; }
	.addfield span { display:none; }

.ico:hover, .ico:focus { background-color:transparent; }