@charset "UTF-8";

/*
Theme Name: HappiFace
Theme URI: http://www.happiface.com/
Description: A cute but professional design that exudes the fabulousness of happiface.com.
Version: 2.0
Author: Chad Holden
Author URI: http://www.maifith.com/
*/

html {width:100%; height:100%}
body {background: #ff80f1 url(images/bg_grad.gif) top left repeat-x; margin: 0px; padding: 0px; color:#666; font-family: "Myriad Pro", Arial, Helvetica, Verdana, sans-serif; font-size:10pt; text-align:center; position: relative;}

.clear {clear: both; height: 0px; width: 100%; overflow: hidden; padding: 0px; margin: 0px;}

.glow {position:absolute; display: block; top: -40px; left: -140px; width:491px; height: 442px; background: url(images/top_left_bg.png) top left no-repeat;}

a img {border:none;}
a {font-weight: bold; color: #FF00CC; text-decoration: none;}

.alignright {float:right; margin:0 0 0 10px; padding-bottom:10px}
.alignleft {float:left; margin:0 10px 0 0px; padding-bottom:10px}
.middle {vertical-align:middle; margin:0 4px 0 0;}

.img-border {padding:2px; background:#fff; border:1px solid #999999}

#flickr img {display: block; float: left; padding: 0px; position: relative; height: 55px; width: 55px; border-width:0; margin:2px; }

.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix  { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

#commentform textarea {width:350px;}

.rss {text-align: center; height: 25px;}
.technorati {text-align: center; height: 25px;}

input {padding: 2px; border:1px solid #999; font: normal 1em Verdana, sans-serif; color:#777;}
textarea {width:300px; padding:2px; font: normal 1em Verdana, sans-serif; border:1px solid #999; display:block; color:#777;}

blockquote {margin:20px; padding:1px 10px 1px 70px; background:url('image/bg_blockquote.gif') #eee top left no-repeat;}

.navigation {margin-top: 1.2em; padding-bottom: 1em; clear:left; margin:10px 0px 0px; border-top:1px solid #333; overflow: hidden;}
.previous {float: left;}
.next {float: right; text-align: right;}


/*  -------------- Start of centered container  ----------------  */
#container {width:986px; margin:0px auto; height:100%; padding: 261px 0 4px 0; text-align:left; position: relative}

	#header {width:986px; margin: 0px; height: 0px}
	#header h1 {display: block; position: absolute; top:60px; left: 260px; width: 529px; height: 139px; margin: 0px; padding: 0px; background: url(images/biglogo.png) top left no-repeat}
		#header h1 a {display: block; width:301px; height: 74px; text-indent: -2500px;}
	
	#header h2 {display:block; width:167px; height: 279px; background: url(images/girl.png) top left no-repeat; text-indent: -2500px; position: absolute; top:19px; left: 3px; margin: 0px; padding: 0px; z-index: 25 !important;}
	
	#header #menu {display:block; position: absolute; top:232px; right:4px; list-style: none; margin: 0px; padding: 0px; height: 22px}
		#header #menu li {display: block; float: left}
		#header #menu li a {display: block; padding: 6px 8px 10px 8px; font-size: 14px; background: rgb(255,139,242); font-weight: normal; color: #FFFFFF; text-decoration: none; -moz-border-radius: 4px; -webkit-border-radius: 4px; margin: 0 2px 0 0; white-space: nowrap;}
		#header #menu li a:hover {background: #ffffff; color: #333;}
			#header #menu li.active a {display: block; padding: 6px 8px 10px 8px; background: rgb(255,255,255); font-size: 1.2em; font-weight: bold; color: #444;}	

/*  -------------- Start of Body Content  ----------------  */
	#body_cont {background: #FFFFFF url(images/content_top.gif) top left no-repeat; padding: 30px 10px; margin: 0px; position: relative; }

	/*   rounded corners   */		
	.content_bottom {position: absolute; bottom:0px; left: 0px; width: 986px; display: block; height: 4px; overflow: hidden; background: url(images/content_bottom.gif) top left no-repeat}

	/*   content   */	
	#content_col {width: 710px; padding: 0 20px 10px 0; float: left; height:100%; overflow:auto;}
	
		#content_col h2 {color: #000000; font-weight:normal; font-size: 1.9em; letter-spacing: -1px; padding: 8px 0 8px 55px; background: url(images/flower_white-bg.gif) center left no-repeat; margin: 5px 0 0 0;}
		#content_col h3 {color: #FF00CC; font-weight:normal; font-size:1.7em; letter-spacing:-1px; padding:3px 0 3px 5px; margin:12px 0 6px 0; background: #EcEcEc}
		#content_col p {margin: 0 0 10px 0; padding:0px}
		#content_col .entry {padding: 0 10px; line-height: 160%;}
		#content_col .post {clear:left; padding:10px 0 0 0; border-top:dotted 1px #333333; margin:10px 0 0 0}
		#content_col .entry h2 a, #content_col .entry h3 a {font-weight: normal}
		.entry h4 {margin:0 0 3px 0; font-size:1.2em; font-weight:normal; color:#666666}
		.entry h4, #home .entry h4 {color:#333333; font-size:1.1em}
		
		.entry ul {margin: 15px 0 15px 20px; }
		
		.postmeta {margin:5px 0 10px 0; padding:5px; clear:both}
			.postmeta .comments {display:block; height:24px; width:30px; background:url(images/comments.gif) top left no-repeat; color:#FFFFFF; text-align:center; font-size:1em; font-weight:bold; padding:2px 0 0; line-height:100%; float:right}
				.postmeta .comments a {color:#FFFFFF}

	.videos {list-style:none; margin:10px 0; padding:0px;}
		.videos li {display:block; float:left; width:290px; margin:0 5px 0 0; text-align:center; padding:0 0 10px 0}
		
	.portfolio {list-style:none; margin:10px 0; padding:0px;}
		.portfolio li {display:block; float:left; width:110px; margin:0 5px 0 0; text-align:center; padding:0 0 10px 0}

	.commentlist {list-style:none; margin:0px; padding:0px}
		.commentlist li {padding:5px;}
		.commentlist li.alt {padding:5px; background: #FFF4FF; border-top:1px dotted #FF00CC; border-bottom:1px dotted #FF00CC;}
		.commentlist li.author {padding: 10px 5px; background: #ddd; border-top:1px dotted #000; border-bottom:1px dotted #000; color: #000}
		#commentform textarea {width:97%; padding:1%; border:1px dotted #FFCCFF}
		#comments {font-size:1.3em;}
	
	/*   Sidebar   */	
	#sidebar {width:200px; padding: 0 0 10px 20px; float: left; background: #eee; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
	#sidebar h2 {color:#fff; background: #c1c1c1; font-size:1.0em; font-weight:normal; margin:10px -5px 5px -15px; padding: 5px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; width: 200px;}
		#sidebar ul {list-style:none; margin:10px 0; padding:0px}
		#sidebar li {display:block; list-style:none;}
		#sidebar li li {padding:7px 0 7px 4px; border-bottom:1px dotted #CCCCCC}
			#sidebar li a {font-weight:normal; font-size:90%}
			#sidebar li .video {display: inline-block; margin: 0 0 0 5px; line-height:110%; width:200px}
		#sidebar li p {text-align: center;}
		
	.feedburner {background: rgb(255,153,244); color: #000; text-align: left; margin: 0 0 10px -15px; width: 190px; padding: 10px;}
		.feedburner strong {font-weight: normal; display: block; padding: 0 0 8px 0; color: rgb(225,0,200);}
		.feedburner input {width: 100px;}
		.feedburner input.subscribe {width:auto; font-size: 10px; text-transform:uppercase; background:none; border:none; color:#000000;}
		.feedburner span {display: block; padding: 5px 0; color: #fff; font-size: 10px;}
	

/*  -------------- End of Body Content  ----------------  */
	/*   Footer   */	
	#footer {padding: 10px; position: relative; width: 100%; color: #ffffff}
		#footmenu {display:block; width:540px; position: absolute; top:0px; right:4px; list-style: none; margin: 0px; padding: 0px; height: 18px}
		#footmenu li {display: block; float: left}
		#footmenu li a {display: block; padding: 5px 8px 0 8px; font-size: 1em; font-weight: normal; color: #FFFFFF; text-transform: lowercase; text-decoration: none}
			#footmenu li.active a {display: block; padding: 5px 8px 0 8px; font-size: 1em; font-weight: bold; color: #ffc4f3; text-transform: lowercase; text-decoration: none; background: url(images/bottom_menu_bg.gif) top center no-repeat}	
		#footmenu li a:hover {color: #ffc4f3}