/* @override http://aesthetic-answers.com/site/wp-content/themes/aesthetic-answers/style.css */

/*
Theme Name: Aesthetic Answers
Author: Joe Tan (joetan54@gmail.com)
*/
xmp {
	background: yellow;
}
html, body {
	font-family: "Verdana", sans-serif;
	font-size: 11px;
	color: #5a4a42;
	background: #e6e4e3;
}
html {
}
body {
	padding-top: 0;
}

.clear { clear: both;}
.alignleft { float: left; }
.alignright { float: right; }

img.alignleft {	margin: 0 15px 15px 0; }
img.alignright { margin: 0 15px 15px 0; }

h1,h2,h3,h4 { 
	margin: 0;
}
h1 {
	font-size: 118%;
	color: #ea088c;
	font-weight: normal;
	margin-bottom: 2em;
}
h1 a {
	color: #5a4a42;
}

h1 span {
	margin: 0 10px;
	color: #5a4a42;
}
h2 {
	font-size: 175%;
}
h3 {
	font-size: 150%;
}
a {
	color: #ea088c;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
p {
	margin-bottom: 2em;
}
#wrap {
	position: absolute;
	width: 960px;
	height: 600px;
	margin: 0 auto;
	text-align: left;
	background: no-repeat bottom right;
	border: 1px solid white;
	
	left: 50%;
	top: 50%;
	margin-top: -300px;
	margin-left: -480px;
}

#wrap.no-center {
	position: relative;
	left: auto;
	top: auto;
	margin: 0 auto;
}
/* @group Nav */

#nav {
	position: absolute;
	z-index: 100;
	top: 0;
	left: 0;
	height: 68px;
	width: 960px;
	font-family: "Myriad Pro",sans-serif;
	text-align: center;

}

#nav ul {
	margin: 0;
	padding: 0;
}
#nav ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
	background: white;
	padding: 5px;
}
#nav ul li.level-1 {
	float: left;
}
#nav ul li.level-1 a {
	display: block;
	width: 210px;
	height: 58px;
	line-height: 58px;
	background: #5a4a42  no-repeat;;
	color: white;
	text-decoration: none;
	font-size: 31px;
}
#nav ul li.selected a.level-1,
#nav ul li.level-1 a.hover,
#nav ul li.level-1 a:hover {
	background-color: #ea088c;
}
#nav ul li.level-1 a.level-1 { 
	background-image: url(images/nav.gif);
	background-position: -5px 17px;
	text-indent: -10000px;
}
#nav ul li.portfolio a.level-1 { background-position: -5px 17px;}
#nav ul li.process a.level-1 { background-position: -225px 17px;}
#nav ul li.about a.level-1 { background-position: -445px 17px;}
#nav ul li.contact a.level-1 { background-position: -665px 17px;}
#nav ul li.home a.level-1 {  width: 70px; background-position: -885px 17px;}

#nav ul li.selected a.portfolio,
#nav ul li.portfolio a.hover,
#nav ul li.portfolio a.level-1:hover { background-position: -5px -75px;}
#nav ul li.selected a.process,
#nav ul li.process a.hover,
#nav ul li.process a.level-1:hover { background-position: -225px -75px;}
#nav ul li.selected a.about,
#nav ul li.about a.hover,
#nav ul li.about a.level-1:hover { background-position: -445px -75px;}
#nav ul li.selected a.contact,
#nav ul li.contact a.hover,
#nav ul li.contact a.level-1:hover { background-position: -665px -75px;}
#nav ul li.selected a.home,
#nav ul li.home a.hover,
#nav ul li.home a.level-1:hover {  width: 70px; background-position: -885px -75px;}


#nav ul.level-2 {
	display: none;
	position: absolute;
	top: 68px;
	left: 0;
	padding-bottom: 2px;
	background: white;
}
#nav li.opened ul.level-2 {
	display: block;
}
#nav ul.level-2 li {
	padding: 4px 5px;
}
#nav ul.level-2 li a {
	font-size: 19px;
	width: 210px;
	padding: 0px 0;
	height: 36px;
	line-height: normal;
	background: #aca4a0 url(images/nav2.gif) no-repeat;
	text-indent: -10000px;
}
/*
#nav ul.level-2 li.current_page_ancestor a,
#nav ul.level-2 li.selected a{
	background-color: #ea088c;
	background-position: 0px -43px;
}
*/
#nav ul.level-2 li.page-item-environments a { background-position: 0px 0px; }
#nav ul.level-2 li.page-item-displays a { background-position: -210px 0px; }
#nav ul.level-2 li.page-item-print a { background-position: -420px 0px; }
#nav ul.level-2 li.page-item-web a { background-position: -630px 0px; }

#nav ul.level-2 li.page-item-35 a { background-position: -840px 0px; }
#nav ul.level-2 li.page-item-37 a { background-position: -1050px 0px; }

#nav ul.level-2 li.selected a.page-item-environments,
#nav ul.level-2 li.page-item-environments a:hover { background-position: 0px -43px; background-color: #ea088c;}
#nav ul.level-2 li.selected a.page-item-displays,
#nav ul.level-2 li.page-item-displays a:hover { background-position: -210px -43px; background-color: #ea088c;}
#nav ul.level-2 li.selected a.page-item-print,
#nav ul.level-2 li.page-item-print a:hover { background-position: -420px -43px; background-color: #ea088c;}
#nav ul.level-2 li.selected a.page-item-web,
#nav ul.level-2 li.page-item-web a:hover { background-position: -630px -43px; background-color: #ea088c;}

#nav ul.level-2 li.current_page_ancestor a.page-item-35,
#nav ul.level-2 li.selected a.page-item-35,
#nav ul.level-2 li.page-item-35 a:hover { background-position: -840px -43px; background-color: #ea088c;}
#nav ul.level-2 li.selected a.page-item-37,
#nav ul.level-2 li.page-item-37 a:hover { background-position: -1050px -43px; background-color: #ea088c;}


#nav2 {
	margin: 0 0 2em 0;
	font-size: 118%;
}
#nav2 ul {
	margin: 0;
	padding: 0;
}
#nav2 ul li {
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
}
#nav2 ul li a {
	padding:0 10px;
	color: #5a4a42;
	border-left: 1px solid #5a4a42;
}
#nav2 ul li.first a {
	padding-left: 0;
	border-left: 0;
}
#nav2 ul li.selected a {
	color: #ea088c;
}
#nav2 ul li.selected a:hover {
	text-decoration: none;
}
/* @end */



#footer {
	position: absolute;
	bottom: -7px;
	right: 23px;
	height: 15px;
	line-height: 15px;
	padding: 0 4px;
	background: #e7e4e3;
	font-size: 10px;
	color: #ACA4A0;
}
#footer a {
	color: #ACA4A0;
}
#content {
	padding: 125px 0 0 65px;
	width: 320px;
	line-height: 1.7;
}
/* @group Home */

#wrap.home {
	background: url(images/home.gif) no-repeat center center;
}
#wrap.home #content {
	position: absolute;
	bottom: 15px;
	left: 148px;
	width: 665px;
	padding: 0;
}
#wrap.home #content .welcome {
	position: absolute;
	top: 5px;
	left: -33px;
	width: 200px;
	text-align: right;
}
#wrap.home #content .welcome h1 {
	font-size: 11px;
	margin: 5px 0 1px 0;
}
#wrap.home #content .welcome a{
	color: #5a4a42;
	text-decoration: none;
}

#wrap.home #content .welcome a.selected {
	color: #ea088c;
}

#wrap.home #content .welcome a:hover {
	text-decoration: underline;
}
#wrap.home #content .welcome a.selected:hover {
	text-decoration: none;
}
#wrap.home #content .main {
	margin: 0 0 0 200px;
	padding:5px 0 5px 32px;
	border-left: 1px solid #6f615a;
	height: 60px;
}
#wrap.home #content .main p {
	margin-bottom: 0;
}
#wrap.home #footer {
	display: none;
}
/* @end */


/* @group Portfolio */
#wrap.portfolio {
	background: url(images/bg-portfolio.gif) no-repeat;
}
#wrap.portfolio #content {
	width: auto;
	margin: 0;
	padding-top: 115px;
	padding-left: 0;
}
#wrap.portfolio #content h1 {
	margin-bottom: 1em;
}

#portfolio {
	position: relative;
	height: 430px;
	width: 880px;
}
#portfolio .slides {
	position: absolute;
	z-index: 9;
	width: 540px;
	height: 420px;
	left: 340px;
	top: 50px;
	overflow: hidden;
}
#portfolio .slider {
	position: absolute;
	left: -0px;
	width: 10000px;
}
#portfolio .slider .slide {
	display: block;
	float: left;
	width: 540px;
	padding: 0 0px;
}
#portfolio .frame {
	position: absolute;
	z-index: 10;
	top: 0px;
	left: 0px;
	width: 600px;
	height: 360px;
	xbackground: url(images/fade2.png);
}
#portfolio .caption {
	position: absolute;
	top: 360px;
	right: 2px;
	color: #aca4a0;
	font-size: 82%;	
}
#portfolio .info {
	position: absolute;
	left: 60px;
	top: 240px;
	width: 245px;
}
#portfolio .info h1#slide-title {
	margin-bottom: 0;
}
#portfolio .clients {
	position: absolute;
	top: 20px;
	left: 340px;
}
#portfolio .clients a{
	position: relative;
	display: block;
	margin: 0 5px 0 0;
	float: left;
	height: 16px;
	width: 16px;
	text-indent: -10000px;
	
	background: #aca4a0;
}
#portfolio .clients a.selected,
#portfolio .clients a:hover {
	background: #ea088c;
}
#portfolio .clients a.prev {
	width: 7px;
	background: url(images/arrow-left.gif) no-repeat 0px 1px;
}
#portfolio .clients a.next {
	width: 7px;
	background: url(images/arrow-right.gif) no-repeat 0px 1px;
}
#portfolio .clients a.prev:hover,
#portfolio .clients a.next:hover {
	background-position: 0 -16px;
	text-decoration: none;
}
#portfolio .clients a.disabled,
#portfolio .clients a.disabled:hover {
	opacity:0.5;
	cursor: default;
	background-position: 0px 1px;
}
#portfolio .title {
	position: absolute;
	top: 20px;
	right: 0px;
	font-size: 118%;
}
#portfolio .nav {
	position: absolute;
	left: 340px;
	top: 418px;
	height: 30px;
	width: 540px;
	z-index: 11;
}
#portfolio .nav a {
	display: block;
	float: left;
	width: 16px;
	height: 16px;
	color: #aca4a0;
	font-weight: bold;
}
#portfolio .nav a.selected,
#portfolio .nav a:hover {
	color: #ea088c;
	text-decoration: none;
}
#portfolio .nav a.prev {
	background: url(images/arrow-left.gif) no-repeat 0px 3px;
	text-indent: -10000px;
}
#portfolio .nav a.next {
	background: url(images/arrow-right.gif) no-repeat 0px 3px;
	text-indent: -10000px;
}
#portfolio .nav a.prev:hover,
#portfolio .nav a.next:hover {
	color: #ea088c;
	background-position: 0 -14px;
	text-decoration: none;
}
/* @end */

#wrap.process { background-image: url(images/bg-process.gif); }
#wrap.about { background-image:url(images/bg-about.gif); }
#wrap.contact { background-image: url(images/bg-contact.gif); }
#wrap.page-179,
#wrap.page-177 { background-image: url(images/bg-bio.gif); }
#wrap.page-37 { background-image: url(images/bg-community.gif); }


