/* ***************************************
   JennieChen.info 
   Stylesheet: balloon.css
   Copyright 2011 Jennie S. Chen
   *************************************** */

/* ***************************************
   facelift Font-Face embedding is using:
      Delicious-Roman - font by Jos Buivegna 
	  (exljbris) wwx.exljbris.nl 
   *************************************** */
@import url("reset.css");

body {
	background: #fff url(../img/bg_site.png) 0 0 repeat-x;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 0.7em;
	line-height: 1.5em;
	color: #333;
	height: 100%;
	text-align: center;
}

p {
	margin: 1em 2.3em 1em 0;
}

span.amp {
	font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;	
	font-size: 1.6em;
 	font-style: italic;
	vertical-align: bottom;
	color: #693;	
	padding: 0 1px;
}

span.disable {
	color: #CCC;
}

/* ***************************************
   LINKS
   *************************************** */

a:link, a:visited {
	text-decoration: none;
	color: #2590b4;
	border-bottom: 1px dotted #a6dff2;
}
	#foot a:link, #foot a:visited {
		border: none;
	}
#content a:hover {
	color: #43aed6;
	border-bottom: 1px solid #efefef;
	background: #ddf6ff;
}
	#nav a:hover {
		color: #fff;
	}
	#foot a:hover {
		color: #99cccc;
	}

/* ***************************************
   LAYOUT 
   *************************************** */

#container {
	width: 793px;
	height: 500px;
	display: block;
	margin: 0 auto;
	text-align: left;
}

#left {
	float: left;
	width: 185px;
	height: 500px;
	display: block;
	background: url(../img/bg_left.png) 0 0 no-repeat;
}

#middle {
	float: left;
	width: 430px;
	height: 500px;
	display: block;
}
	#middle #head {
		float: left;
		width: 430px;
		height: 180px;
		display: block;
		background: url(../img/bg_header.png) 0 0 no-repeat;
	}
		#navi {
			float: right;
			width: 64px;
			height: 47px;
			margin: 100px 11px 21px 0;
			padding: 0 0 0 7px;
			border-left: 1px dashed #ccf1ff;
			text-transform: uppercase;
			line-height: 1.4em;
			color: #219ac7;
		}
	#middle #foot {
		float: left;
		width: 410px; /* 430 - padding */
		height: 126px;
		display: block;
		background: url(../img/bg_footer.png) 0 0 no-repeat;
		color: #99cccc;
		padding: 15px 10px;
	}
	#foot div.copy {
		float: left
	}
	#foot div.other {
		float: right;
	}
#right {
	float: left;
	width: 178px;
	height: 500px;
	display: block;
	background: url(../img/bg_right.png) 0 0 no-repeat;
}

/* ***************************************
   CONTENT
   *************************************** */
#content {
	float: left;
	width: 390px; /* 430 - padding */
	height: 194px; /* 194 - padding */
	display: block;
	background: #fff;
	padding: 0px 20px;
	overflow: hidden;
	cursor: default;
}
#content h1 {
	text-transform: uppercase;
	font-family: 'delicious', Helvetica;
	font-size: 1.8em;
	font-weight: normal;
	border-bottom: 1px dashed #a6dff2;	
	padding-bottom: 3px;	
	margin: 0 0 0.5em 0;
}

	#info h1 {
		color: #F93;
	}
	#network h1 {
		color: #9C3;
	}
	#contact h1 {
		color: #f04b9e;
	}

#info, #network, #contact {
	height: 216px; /*206*/
}
#network {
	margin: 5.0em 0;
}
	#contact strong {
		width: 100px;
		padding-right: 15px;
		display: block;
		float: left;
		text-align: right;
		font-weight: normal;
	}
	#contact em {
		color: #999;
	}

#network dl {
	float: left;
	width: 49.9%;
	display: block;
	margin: 1.0em 0;	
}
	dt {
		margin: 0;
		font-size: 1.6em;
		background: url(../img/networks.png) no-repeat;
		padding: 0 0 0 23px;
		font-family: "delicious", Helvetica;		
	}
		dt.twitter {
			background-position: 0 0;
		}
		dt.facebook {
			background-position: 0 -24px;
		}
		dt.tumblr {
			background-position: 0 -48px;
		}
		dt.flickr {
			background-position: 0 -72px;
		}
		dt.linkedin {
			background-position: 0 -96px;
		}
		dt.delicious {
			background-position: 0 -120px;
		}
	dd {
		margin: 0 0 1.4em 24px;
	}

#contact ul.contact li {
	line-height: 1.8em;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/* ***************************************
   img 
   *************************************** */

.balloon {
	float: right;
	width: 23px;
	height: 66px; /* 56 + positioning */
	background: url(../img/balloon.png) 0 10px no-repeat;
}
.clover {	
	background: url(../img/clover.png) 95% 2% no-repeat;
}
.birdie {
	background: #fff url(../img/birdie.png) 0 bottom no-repeat;
	width: 87%;
	height: 33%;
	float: left;
	padding-left: 50px;
	margin-top: 10px;	
	border-bottom: 1px solid #efefef;
}

/* ***************************************
   TWEET
   *************************************** */
#twitter {
    background-color: #fbf9f9;
	width: 95%;
	min-height: 40px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-radius-bottomleft: 0;
	border-bottom-left-radius: 0;
}
.tweet {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.0em;
	line-height: 1.3em;	
	font-style: italic;
	color: #a29898;
	padding: 3px 10px;	
}
.tweet_list {
	list-style-type: none;
}
.tweet ul, .tweet ol { margin: 0; padding: 0; }
	.tweet_list li {
		overflow: auto;
		padding: .5em; 
	}
	.tweet_list li a:link, 
	.tweet_list li a:visited {
		color: #0C717A; 
		font-weight: bold;
		font-size: 0.7em;
	}
.tweet_even {
	background-color: #91E5E7; 
}
.tweet_avatar {
	padding-right: .5em;
	float: left; 
}
.tweet_avatar img {
	vertical-align: middle;
	display: none;
}