@charset "utf-8";
@import url("reset.css");

body { background: #fff url("../imgs/bg.jpg") repeat-x; }

#container {
	margin: 0 auto;
	padding: 0 23px;
	width: 1053px;
	background: url("../imgs/container-bg.png") no-repeat;
	font-family: Arial, Helvetica, verdana, tahoma, sans-serif; color: #666666;
	}
	
p { margin-top: 20px; font-family: Arial, Helvetica, verdana, tahoma, sans-serif; color: #666666; }

a { color: #787878; }
a:hover { color: #ec9079; }

/* header */
#header {
	margin: 0 auto;
	padding: 74px 0 0 0;
	width: 980px;
	height: 213px;
	background: url("../imgs/header-bg.png") top center no-repeat;
	}
	
	/* global nav */
	ul#nav {
		margin: 91px auto 0;
		width: 980px;
		height: 29px;
		list-style: none;
		}
	
	ul#nav li { float: left; display: block; height: 29px; }
	ul#nav li a { display: block; height: 29px; text-decoration: none; background: url("../imgs/nav.png") no-repeat; outline: none; }

	ul#nav li#nav-home-active a { width: 113px; background-position: 0 -29px; }
	ul#nav li#nav-home a { width: 113px; background-position: 0 0; }
	ul#nav li#nav-home a:hover { width: 113px; background-position: 0 -29px; }

	ul#nav li#nav-about-active a { width: 137px; background-position: -113px -29px; }
	ul#nav li#nav-about a { width: 137px; background-position: -113px 0; }
	ul#nav li#nav-about a:hover { width: 137px; background-position: -113px -29px; }

	ul#nav li#nav-portfolio-active a { width: 171px; background-position: -250px -29px; }
	ul#nav li#nav-portfolio a { width: 171px; background-position: -250px 0; }
	ul#nav li#nav-portfolio a:hover { width: 171px; background-position: -250px -29px; }

	ul#nav li#nav-services-active a { width: 165px; background-position: -421px -29px; }
	ul#nav li#nav-services a { width: 165px; background-position: -421px 0; }
	ul#nav li#nav-services a:hover { width: 165px; background-position: -421px -29px; }

	ul#nav li#nav-blog-active a { width: 120px; background-position: -586px -29px; }
	ul#nav li#nav-blog a { width: 120px; background-position: -586px 0; }
	ul#nav li#nav-blog a:hover { width: 120px; background-position: -586px -29px; }

	ul#nav li#nav-links-active a { width: 128px; background-position: -706px -29px; }
	ul#nav li#nav-links a { width: 128px; background-position: -706px 0; }
	ul#nav li#nav-links a:hover { width: 128px; background-position: -706px -29px; }

	ul#nav li#nav-contact-active a { width: 146px; background-position: -834px -29px; }
	ul#nav li#nav-contact a { width: 146px; background-position: -834px 0; }
	ul#nav li#nav-contact a:hover { width: 146px; background-position: -834px -29px; }

/* content */
#content {
	clear: both; 
	margin: 0 auto;
	padding: 20px 32px 0 32px;
	width: 940px;
	min-height: 432px;
	height: auto !important;
	height: 432px;
	background: url("../imgs/content-bg.png") no-repeat;
	font-size: 12px;
	}
	
	/* home page */
	#content-home {
		background: #ffffff url("../imgs/home-introbg.jpg") no-repeat;
		width: 940px;
		height: 510px;
		}
	
	span#front-intro a {
		position: relative;
		top: 383px;
		left: 560px;
		display: block;
		width: 380px;
		height: 100px;
		background: #ffffff url("../imgs/home-intro.jpg") 0 0 no-repeat;
		text-decoration: none;
		}
		
	span#front-intro a:hover {
		background: #ffffff url("../imgs/home-intro.jpg") 0 -100px no-repeat;
		}
		
	/* about page */
	#about-info { float: left; margin: -20px 20px 0; width: 380px; font-size: 12px; }
	
	/* portfolio page */
	
	
	/* services page */
	#services-info { float: left; margin-top: -20px; width: 620px; }
	#services-info div { width: 300px; }
	
	/* blog section */
	#blog-content { float: left; width: 600px; }

	#blog-content div.meta { font-size: 11px; }
	
	#blog-sidebar { float: right; width: 300px; }
	#blog-sidebar ul { list-style: none; }
	
	#blog-sidebar a,
	#blog-content a { color: #ec9079; text-decoration: none; }

	#blog-sidebar a:hover,
	#blog-content a:hover { text-decoration: underline; }
	
	.post { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #cccccc; }
	
	a.more-link { float: left; margin-top: 20px; }
	
	#blog-content input,
	#blog-content textarea { font-family: arial, helvetica, tahoma, verdana, sans-serif; font-size: 12px; }
	
	textarea#comment { width: 600px; }
	
	ol.commentlist { margin-top: 20px; list-style: none; }
	ol.commentlist cite { font-size: 14px; font-weight: bold; }
	
	ol.commentlist li { margin-bottom: 20px; padding-left: 20px; border-left: 4px solid #fae3dd; }
	
	img.alignleft { float: left; margin-right: 20px; }
	img.alignright { float: right; margin-left: 20px; } 
	
	/* links page */
	ul.list { list-style: none; width: 940px; }
	ul.list li.left { margin-right: 150px; }
	
	/* contact page */
	#contact-info { float: left; width: 300px; }
	#contact-form { float: right; padding: 20px 0 10px 20px; width: 600px; border-left: 1px solid #cccccc; }
	
	#contact-form em { color: #ff0000; font-weight: bold; }
	
	#contact-form legend,
	#contact-form label { float: left; padding-right: 20px; width: 110px; font-weight: bold; }
	
	#contact-form label.error { margin-left: 20px; padding: 0px; width: 200px; color: #ff0000; }
	#contact-form fieldset.mor-list,
	#contact-form fieldset.s-list { float: left; margin: -21px 0 0 130px; }
	#contact-form fieldset.mor-list label,
	#contact-form fieldset.s-list label { float: none; padding: none; width: 300px; font-weight: normal; }
	#contact-form fieldset.mor-list label.error { display: none; margin-left: 144px; font-weight: bold; }
	#contact-form fieldset.s-list label.error { display: none; margin-left: 98px; font-weight: bold; }
	
	
	#contact-form input.form-short,
	#contact-form textarea.form-long,
	#contact-form div.form-options { float: left; margin-bottom: 20px; width: 200px; font-family: arial, helvetica, verdana, tahoma, sans-serif; font-size: 12px; }
	
	#contact-form textarea.form-long { height: 75px; }
	
	#contact-form input.error,
	#contact-form textarea.error { border: 1px solid #ff0000; }
	
	#contact-form input.form-submit { margin-left: 130px; }
	
/* footer */
#footer {
	border-top: 1px solid #787878;
	margin: 20px auto 40px;
	padding: 10px 0; 
	width: 940px;
	font-size: 11px;
	color: #797878;
	}
	
#footer p { margin: 0; }
	
#footer a { color: #797878; text-decoration: underline; }


/* headers */
h1 {
	margin: 0 auto;
	display: block; 
	width: 361px;
	height: 72px;
	background: url("../imgs/pamella-alexandra.png") no-repeat ;
	}
h2 { display: block; margin-bottom: 20px; width: 940px; height: 25px; }
	
h2.header-about { background: url("../imgs/header-about.jpg") no-repeat; }
h2.header-portfolio { background: url("../imgs/header-portfolio.jpg") no-repeat; }
h2.header-services { background: url("../imgs/header-services.jpg") no-repeat; }
h2.header-links { background: url("../imgs/header-links.jpg") no-repeat; }
h2.header-blog { background: url("../imgs/header-blog.jpg") no-repeat; }
h2.header-contact { background: url("../imgs/header-contact.jpg") no-repeat; }

h3 { font-family: georgia, garamond, times new roman, times, serif; font-size: 20px; }
h3 a { text-decoration: none; }

h4 { margin-top: 20px; font-weight: bold; font-size: 14px; }
	
/* misc */

var { visibility: hidden; }
.left { float: left; }
.right { float: right; }
.clear { clear: both; }

blockquote { font-family: georgia, garamond, serif; font-size: 12px; margin-left: 20px; padding-left: 10px; border-left: 3px solid #cccccc; }
blockquote em { font-family: georgia, garamond, serif; font-size: 12px; letter-spacing: 0.5px;}
em { font-style: italic; }