/* @override http://www.youknowwhodesign.com/css/ykw_main.css */

/* Modified CSS Style reset by Sarah Parmenter, You Know Who Design
----------------------------------------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td,p { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }
p {  margin:0 0 1.4em; }

strong, b {
	font-weight: bold;
}

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

* html .group{
	/* IE6 */
	height:1%;
}

*:first-child+html .group{
	 /* IE7 */
	 min-height:1px;
}


a.vcard-icon {
	padding-left: 35px;
	background: url(http://www.youknowwhodesign.com/images/siteimages/vcard.png) no-repeat top left;
	display: block;
}

a:active
{
  outline: none;
  top: 1px;
  position: relative;
}


/* You Know Who
----------------------------------------------------------------------------------------- */
html,body { background: #fff url(../images/background_10.gif) repeat-x center top; font-family:Arial, Verdana, sans-serif; font-size:small; color: #373737;}
#introduction p { padding-bottom:18px;
	font: 14px/21px Arial, Georgia, "Times New Roman", Times, serif;
}
.divider { border:0; background: url(../images/divider.gif) no-repeat center; margin: 5px 0px; clear:left; height: 35px; }
#container { width:960px; margin:auto;}
.entry { background:url(http://www.youknowwhodesign.com/images/horizontal.gif) bottom left no-repeat; padding:0 0 20px; }
.entry h2 { color:##230b47; }
#topheader { height: 50px; float:left; width:960px; margin: 0px;padding: 0px;}
#topheader #logo { float:left; width:243px; margin-left:20px; margin-top:10px; }
#topheader #nav { width:960px; float:left; font-size: 105%; }

#nav ul {
	height: 35px;
	padding-top: 12px;
}
#topheader #nav li { float:left; margin-right:15px; font-size: 80%; font-family:Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
}
#topheader #nav li a { color: #b08aaa; text-decoration:none; padding-top: 7px; display: block; padding-right: 25px;
text-shadow: #252525 1px -1px 0px;
}

#topheader #nav li.current a { color:#fff; 
	background: url(http://www.youknowwhodesign.com/images/recessed.gif) no-repeat; padding: 7px 12px 8px; width: 84px; display: block; text-align: center; margin-right: 25px;text-shadow: #252525 1px -1px 0px;
}

#topheader #nav li a:hover { color:#fff; }

#home-portfolio { float: left; width: 960px; padding:20px 0px; margin-top: 30px; }

#homepage-columns h3 {
	text-align: center;
	letter-spacing: 2px;
	font-size: 38px;
	margin-bottom: 30px;
}

#core_services li h4 {
	font-size: 18px;
	margin-bottom: 5px;
	font-weight: bold;
}

#core_services li strong {
	font-size: 16px;
	font-style: italic;
}

#homepage-columns h5 {
	clear: left;
	text-align: center;
	font-style: italic;
	font-size: 16px;
}

#home-portfolio ul li h3 {
	font-weight: normal;
}



#home-portfolio ul {
	float: left;
	width: 960px;
}

#home-portfolio ul li {
	float: left;
	width: 300px;
	margin-right: 20px;
}

#home-portfolio ul li a img {
	border: 3px solid #cccccc;
	margin-bottom: 5px;
}

#home-portfolio ul li p {
	font-size: 13px;
	line-height: 18px;
}

#home-portfolio .cols { width:300px; height:250px; float:left; margin-right:20px; }
#home-portfolio .cols:last-child { margin-right:0; }
#home-portfolio .cols img { background:url(../images/img-shadow.gif) no-repeat center bottom; padding-bottom:20px; }


#colshomepg { margin-right:20px; float:left; padding-bottom:20px;
	width: 540px;
	clear: both;
}

#getaquote img {
	margin-bottom: 20px;
}
#colshomepg li {  
padding: 15px; float: left;
width: 500px; 
position: relative;
background-color: #efeeee;
background-image: -webkit-gradient(linear, 0 top, 0 bottom, from(#f1f0f0), to(#e2e0e0));
background-image: -moz-linear-gradient(90deg, #f1f0f0, #e2e0e0);
-webkit-border-radius:5px;
-moz-border-radius:5px;
margin-bottom: 10px;
text-shadow: white 0 1px 0;
margin-bottom:15px;
min-height: 145px;
	line-height: 19px;
}

#colshomepg ul li span.upcoming {
	color: #70a94f;
	font-weight: bold;
	text-transform: uppercase;
}

#colshomepg ul li.alt {
	margin-right: 0px;
}


#colshomepg ul li img {
	float: right;
	border: 3px solid #a6a9b1;
	margin-left:20px;
	margin-top: 1%;

}
#colshomepgr { width: 380px; float:left;
}


#colshomepgr li { background: url(../images/star.png) no-repeat 0 4%; padding:0 0 3px 25px;
font-size: 12px;
}

span.book {
	background: url(../images/ticket.png) no-repeat 0 50%;
	padding: 5px 5px 5px 25px;
}

#colshomepg h3, #colshomepgr h3 {
	margin-bottom: 15px;
}
#news { width:300px; float:right; margin-bottom:20px; }
#news li { background:url(http://www.youknowwhodesign.com/images/news.png) no-repeat 0 20%; padding-left:25px; }
#maincontent ul { line-height:22px; font-size:90%; margin-bottom:20px; }
#bannerbar { height: 247px; clear:both; float:left; width:960px; position: relative;
	background: url(../images/top_highlight.png) center top no-repeat;
}

#bannerbar #showcase {
width:340px;
float:right;
overflow:hidden;
position: absolute;
left: 620px;
top: 15px;
z-index: 2;
}

div#introduction {
	width: 590px;
	padding:10px 0px;
}

div#latest_work{
	background: #d4d3d4 url(http://www.youknowwhodesign.com/images/recent-work.gif) no-repeat;
	min-height: 145px;
	padding: 110px 50px 40px;
}

#intro {
	width: 650px;
	padding-top: 20px;
}

#bannerbar h1 {
	width: 300px;
	margin-top: 25px;
}
#maincontent,#portfolio_content {  padding:20px 0px 10px; float:left; clear:left; width:960px; min-height: 300px;
position: relative;
}
#maincontent{
	min-height: 783px;
}

#latest_work p {
	font-size: 11px;
	padding-top: 10px;
}
#maincontent-plain { background:#fff; margin:0 10px; padding:0 10px 10px; float:left; clear:left; width:820px; }
#maincontent a, #portfolio_content a { color: #4c1a63; text-decoration:none; font-weight:bold; }
 {
	
}
#maincontent a:hover, #portfolio_content a:hover { color: #b975a8; border-bottom:0; text-decoration:none; font-weight:bold; }
#maincontent-plain a,#maincontent-plain a:hover { color:#b975a8; }
#portfolio_content h1 { font-size:22px; clear:right;
	text-transform: uppercase;
}
#port1 { padding:20px 0 0 0; float:left; clear:left; width:920px; border-top: 2px solid #cccccc; }

#port1 #content_left { 
width:370px; float:left; margin-bottom: 20px; }

#content_left p { margin:0; padding:0; }


#port1 #portfolio_pic { width:500px; float:right; border:1px solid #cdcdcd; }
#back-shadow { background:url(../images/back-shadow.gif) no-repeat center top; height:22px; width:500px; float:right; }
#pagination { float:right; width:113px; margin-bottom:20px; height:25px; font-size:14px; font-weight:bold; }
#pagination a { color:#42197d; }
#pagination a:hover { color:#571fa6; text-decoration:none; }
#portfolio_content h2 { margin-bottom:25px;
}

#about-sarah h2, #ball-rolling h2, #ball-extended h2,
#colshomepg h2, #colshomepgr h2 {
font-weight: 20px;
}

#colshomepg h2 , #colshomepgr h2{
	font-size: 15px;
}




.portfolio_showcase ul { float:left; clear:left; }
.portfolio_showcase li { width: 254px; float:left; margin-right: 45px; margin-bottom: 45px;display:block; height: 278px; border: 0px; background-color: #ebecee; padding: 10px;}
.portfolio_showcase li:last-child {  margin-right: 0px;  }
.portfolio_showcase li a img { margin-bottom: 8px; ; }

.portfolio_showcase h3 { margin: 6px 0 ; width: 252px;
	font-size: 16px;
}
a.launch_site { background: #bd6ca6; padding:5px 10px; display:inline-block; color:#fff; text-decoration:none; font-weight:bold; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; border-bottom:1px solid #222; cursor:pointer; margin-bottom:10px; margin-top:20px; border-color:#fdf2b2; font-size: 10px;
	text-transform: uppercase;
}
a:hover.launch_site { background: #54315f; text-decoration:none; color: #452161;}

.portfolio_graphic, .portfolio_iphone { clear:left; float:left; width:940px;}


/*Header Stylers
----------------------------------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 { font-family:Helvetica, Arial, sans-serif; line-height:22px; font-weight: normal;  }
h1 { font-size: 26px; line-height:24px; margin-bottom:8px; }
h2 { font-size: 28px; padding:5px 0 0; margin-bottom:8px;
}
h3{
	font-size: 24px;
	margin-bottom: 7px;
}

#colshomepg ul li h4 {
	margin-bottom: 8px;
	padding-top: 5px;
	font: italic 20px Georgia, "Times New Roman", Times, serif;
}


#introduction h2.homepage {
	line-height: 30px;
	margin-bottom: 15px;
	font-size: 24px;
	font-weight: normal;
}

#inner div.cols p {
	font-size: 12px;
	line-height: 18px;
}

.readmore { font-family:Helvetica, Arial, Verdana; font-weight:bold; text-transform:uppercase; color:#230b47; padding:5px 0 0; letter-spacing:2px; margin-bottom:3px; }
#maincontent-plain h1 { font-size:160%; padding-bottom:10px; }

#home-portfolio ul li h3 a {
	font-size: 18px;
	margin: 6px 0px;
	font-weight: bold;
}



span.slides a {
	background:url(../images/slides.png) no-repeat 0px 70%;
	padding: 8px 0px 0px 25px;
	position: absolute;
	font-size: 12px;
	left: 15px;
	bottom: 15px;
	display: block;
	margin: 0px;
}



#home-portfolio ul li h3 a:hover{
	color: #bd6ca6;
}



#rightcol p { font-size:11px; line-height:18px; }
#rightcol h2 { border-bottom:1px solid #73569e; font-size:110%; }
#rightcol h3 { border-bottom:1px solid #73569e; }
#rightcol .quickquote { background:url(http://www.youknowwhodesign.com/images/1.png) top left no-repeat; padding-left:30px; padding-top:8px; margin-top:-4px; }
#rightcol .quickquote + p { line-height:22px; }
#rightcol .speaking + p { line-height:22px; }
#rightcol .availability { clear:left; background:url(http://www.youknowwhodesign.com/images/calendar.png) top left no-repeat; padding-left:30px; padding-top:8px; margin-top:20px; }
#rightcol .speaking { clear:left; background:url(http://www.youknowwhodesign.com/images/speaking.png) 2% 50% no-repeat; padding-left:30px; padding-top:8px; }
.postedby { font-size:110%; color:#240b47; font-family:Helvetica, Arial, Verdana; font-weight:bold; text-transform:uppercase; }

/* end Header Stylers
----------------------------------------------------------------------------------------- */
#maincontent #leftcol { width:700px; float:left; margin-right:20px; }
#maincol { width:900px; }
#maincontent #rightcol { width:200px; float:left; padding:0 10px; }
#rightcol label { float:left; width:150px; padding-top:5px; font-weight:bold; }
#rightcol form { padding:2px 0; margin:5px 0; }

#main-form {
	width: 620px;
}

.sendbutton { background:#230b48; color:#fff; clear:left; padding:5px 10px; border:1px solid #1b0737; margin-top:10px; }
.form { margin-bottom:2px; border:0; background:#fff; padding:5px; width:180px; float:left; font:Helvetica, Arial, sans-serif; font-size:12px; }
#portrait { width:270px; height: 313px; float:right; position: absolute;
right: 80px; 
top: -70px; }
#footer { background:#2a0a3a url(http://www.youknowwhodesign.com/images/footer.gif) repeat-x top; clear:left; font-size:100%; color:#c9a9db; width:100%;
float:left; margin-top:20px; 
}
#footer #inner { width:960px; margin:auto; height: 104px; }
#footer .cols { width:279px; float:left; padding: 15px 20px 10px 10px; margin-right:10px; border-right:1px solid #1f052c; height: 75px;
	font-size: 12px;
}
.cols h4 { color: #e27dc8; font-size: 18px; margin-bottom: 5px;
}

#footer a { color:#fff; text-decoration:none; font-weight: normal; }
#footer a:hover { color: #d692bf; text-decoration:underline; }
.clear { clear:both; }
.vcardbottom { margin-top:15px;}
.vcardbottom a { font-size:11px; }
.vcard { line-height:19px; }
.vcardbottom img { margin-left:10px; }
#contact_form { background:#f9f9f9 url(http://www.youknowwhodesign.com/images/horizontal.gif) top no-repeat; padding:26px 10px 10px; width:655px; }
#contact_form label { float:left; clear:left; width:135px; padding-top:5px; font-weight:bold; margin-bottom:20px; }
#contact_form input { margin-bottom:20px; font-size:11px; }
#contact_form .form { width:250px; }
#contact_form textarea { width:500px; border:1px solid #c8e9e8; }

.submit_form { width: 103px; height: 45px; text-indent: -9999px;display:block; border:0; margin-top:20px; background: #210a45 url(http://www.youknowwhodesign.com/images/send_button.gif) no-repeat;
}
.submit_form:hover { background-position: 0 -46px; cursor:pointer; }

a#show-extended.new-project {
	width: 233px; height: 45px; text-indent: -9999px;display:block; border:0; margin-top:5px; background: #210a45 url(http://www.youknowwhodesign.com/images/new_project.gif) no-repeat; 
	outline: none;
	margin-bottom: 20px;
}

#getaquote h3 {
	clear: left;
}

#getaquote p {
	clear: left;
	float: left;
	width: 100%;
}

a:hover#show-extended.new-project { background-position: 0 -46px; cursor:pointer;outline: none; }

div#extend-np {
	width: 235px;
	float:left;
	margin-right: 20px;
}

div#submit_entire {
	width: 200px;
	float: left;
	padding-top: 5px;
}

a#hide-extended {
	clear: left;
	display: block;
	margin: 20px 0px;
	font-size: 15px;
	color: #9a9a9a;
}



/* @group Homepage Cols */

ul#core_services {
	width: 300px;
	float: left;
	
}



/* @end */




/*Blog Stylers
----------------------------------------------------------------------------------------- */
.date { color:#6f2590; font-size:105%; background:#C8E9E8; padding:5px; margin-bottom:10px; }
.comments { float:left; clear:left; width:500px; padding:10px 0; background:url(http://www.youknowwhodesign.com/images/horizontal.gif) bottom left no-repeat; }
.comments img { float:left; margin-right:20px; }
.comments p { float:left; }
.commentform { clear:left; padding-top:20px; }


#ball-rolling{
	padding: 0px 0px 40px 0;
	float: left;
	width: 620px;
	border-right: 1px solid #e5e5e5;
	padding-right: 10px;
}

#about-sarah {
	width: 540px;
	float: left;
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 21px;
}

div#homepage-columns {
float: left;
width: 960px;	
background: url(../images/divider.gif) no-repeat center top;
	padding-right: 0;
	padding-top: 57px;
	padding-left: 0;
}

div#homepage-columns p{
display: block;
}

img.quote-lettering {
	padding:10px 0px 30px;
	
	clear: left;
}

#homepage-columns ul{
	float: left;
	width: 960px;
}

#homepage-columns ul li {
	float: left;
	padding-top: 10px;
	margin-right: 20px;
	margin-bottom: 10px;
	width: 300px;
	border-bottom: 1px solid grey;
	border-top: 3px solid grey;
	display: block;
	height: 160px;
	}

#core_services li p em {
	letter-spacing: 1px;
	font-style: normal;
	font-size: 16px;
}

#core_services li p {
	font-size: 13px;
	line-height: 18px;
}

p.price {
	font-style: italic;
	font-size: 16px;
}

#homepage-columns ul li:last-child {
	margin-right: 0px;
}




#website-dev img, #graphic-design img, #iphone-ui img {
	float: left;
	margin-right: 5px;
}

li#graphic-design, li#website-dev, li#iphone-ui {
		height: 150px;
		width: 300px;
}

#homepage-columns h2 {
	margin-bottom: 20px;
}

#homepage-columns ul li h3{
	font-size: 14px;
}


#freeform {  width: 590px; float: left; 
	border-color: #e3e3e3;
	
}

#basic_form dl dt label, #extended-form dt label  {
	float: left;
	display: block;
	width: 175px;
	font-weight: bold;
	font-size: 12px;
}

#freeform legend {
	font-size: 21px;
	font-weight: bold;
	margin-bottom: 20px ;
	display: block;
	height: 24px;
	float: left;
}

#ball-rolling p {
	margin-bottom: 30px;
	font-size: 14px;
	line-height: 21px;
}

#freeform dl {
	float: left;
}

#freeform dt {
	float: left;
	padding-top: 8px;
	padding-bottom: 10px;
}

#freeform dd.form_input input, #extended-form dd.form_input input {
	width: 300px;
	border: 1px solid #d6d6d6;
	padding: 5px;
}

#extended-form dl span, #basic_form dl span {
	color: #feffff;
	font-style: italic;
	font-size: 11px;
	padding: 5px;
	background: #4a2060;
	-moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; 
	float: right;
}



#extended-form dl span{
	margin-top: 6px;
}

#basic_form dl span {
	margin-top: 3px;
	}
	
#freeform fieldset{
	float: left;
	width: 565px;
	padding-bottom: 25px;
	border-bottom: 1px solid #cccccc;
}

#freeform fieldset:last-child{
	border-bottom: 0px;
}

#freeform fieldset p {
	clear: left;
}

div#ball-extended {
	width: 620px;
	float: left;
	border-right: 1px solid #e5e5e5;
	padding-right: 10px;
}

#ball-extended p {
	font-size: 14px;
	line-height: 21px;
}

div#ball-extended h2, #ball-rolling h2{
line-height: 24px;
margin-bottom: 15px;
}

#freeform fieldset h3 {
	float: left;
	display: block;
	height: 24px;
	font-size: 16px;
	margin: 25px 0;

}

#freeform dd{
	padding-bottom: 10px;
	float: left;
	width: 335px;
}

#extended-form dd.form_select select {
	width: 300px;
	margin-top: 8px;
	padding: 5px;
}

#extended-form h3 {
	margin-top: 20px;
}



div#submit_entire input{
	border: 0px;
	padding: 0;
	margin:0;
	text-indent: -9999px;
}

#freeform .form { 
width:250px; }


#freeform dd.form_textarea textarea {
	border: 1px solid #d6d6d6;
	margin-top: 10px;
	width: 300px;
	height: 100px;
	padding: 5px;
	font: 11px "Lucida Grande", Lucida, Verdana, sans-serif;
}

#about_business dl dt label, #project_sheet dl dt  {
	font-weight: bold;
	display: block;
	width: 165px;
	margin-right: 10px;
	font-size: 12px;
	line-height: 18px;
}



#about_business dl dt label span.note {
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
	display: block;
	padding-top: 5px;
	line-height: 15px;
}

#getaquote {
	width: 300px;
	float: right;
	font-size: 13px;
	line-height: 18px;
}

ul.portfolio_showcase {
	float: left;
	padding-bottom: 60px;
	background: url(../images/divider.gif) no-repeat center bottom;
	width: 960px;
	margin-bottom: 50px;
}

/* @group Portfolio */



div.port_item {
	border-top: 1px dotted black;
	padding: 20px 0px;
	clear: both;
	float: left;
	width: 940px;
}

div.content_left {
	float: left;
	width: 220px;
	margin-right: 20px;
}

#portfolio_content div.port_item div.content_left h4 {
	color: #4b4b4b;
	font-size: 18px;
}

 div.portfolio_pic{
	width: 700px;
	float: right;
}



#developers {
	font-size: 14px;
	margin-top: 30px;
	line-height: 19px;
	
}

#developers dt{
	font-weight:bold;
	font-size: 16px;
	margin-bottom: 2px;
	position: relative;
	padding-left: 140px;
	background: url(../images/tick.png) 115px top no-repeat;
}


#developers dt img {
	position: absolute;
	left: 0;
}

#developers dt img.ps_img {
	
}

#developers dt img.xcode_img {
	top: -18px;
	
}





#developers dd{
	margin-bottom: 20px;
	padding-left: 140px;
	margin-bottom:50px
}



#process {
	float: left;
}

#process li{
	float: left;
	width: 210px;
	margin-right: 
	30px;
	line-height: 17px;
	list-style-type: decimal;
	list-style-position: outside;
}

#process li span {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 3px;
	display: block;
	color: #44226e;
}

/* @end */