html {
	background-color: #f0f0f0;
	font: normal 75%/1.5em "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #666;
	background: url(../img/back.gif) repeat;
}

body { text-align: left;  }

.hide { display: none; }

/* -- FRAMEWORK -- */
.clear {clear:both;display:block;overflow:hidden;width:0;height:0}

.left { float: left; }
.right { float: right; }

.mleft30 { margin-left: 30px; }
.mleft15 { margin-left: 15px; }

.mright30 { margin-right: 30px; }
.mright15 { margin-right: 15px; }

.padd30 { padding-left: 30px; padding-right: 30px; }
.padd15 { padding-left: 15px; padding-right: 15px; }

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .imgcol, .col1a, .col1b, .col1c, .col1d { float: left; }

.imgres {
	float:left;
	margin-top: 85px;
	margin-left:20px;
}

.col1 { width: 123px; }
.col1a { width: 100px; }
.col1b { width: 100px; }
.col1c { width: 146px; }
.col1d { width: 146px; }
.col2 { width: 280px; }
.col3 { width: 435px; }
.col4 { width: 900px; }
.col4b { width: 680px; }
.col5 { width: 745px; }
.col6 { width: 900px; }

.col7 { width: 775px; }
.col8 { width: 330px; }

.imgcol { width: 223px; }
/* -- end FRAMEWORK -- */	

#wrapper { 
	width: 962px;
	margin: 100px auto 0;
 }	
	
#header { 
	width: 960px;
	background: #fff;
	border: 1px solid #c5c5c5;
	margin-bottom: 30px; float: left; }	
 
.logo { width: 125px; height: 126px; background: url(../img/logo.gif) no-repeat; text-indent: -999em; margin-left: 30px; position: relative; top: -49px; float: left; margin-bottom: -60px; }

#header .col7 { padding: 25px 0; float: left; }

#header .home { border-bottom: 1px dotted #767676; }

.slogan { font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: #525151; float: left; margin-left: 30px; margin-bottom: 0; }


#content { float: left; margin-bottom: 30px; }

#cform { width: 248px; float: left; background: #fff; border: 1px solid #c5c5c5; padding: 0 30px 20px; }

#about, #services, #contact { width: 590px; background: #fff; border: 1px solid #c5c5c5; padding-bottom: 30px; padding-top: 30px; }

#portfolio { background: #fff; border: 1px solid #c5c5c5; padding-bottom: 30px; padding-top: 30px; }

#team, #badge { background: #fff; border: 1px solid #c5c5c5; padding-bottom: 30px; margin-bottom: 30px; }

#bottom { float: left; padding-top: 20px; border-top: 1px dotted #767676; margin-top: 20px; }

#footer { 
	border-top: 1px dotted #767676; }

#copy p { 
	float: right;
	padding: 15px 30px;
	letter-spacing: 1px;
	margin-bottom: 0; 
	font-size: 9px;
	color: #787878;
}
	

.icon { float: left; }
.follbtn { width: 100px; margin-bottom: 15px; float: left; }
.follbtn.alt { margin-left: 20px; }

.follbtn a { background: #fff; border: 1px solid #c5c5c5; padding-top: 3px; padding-bottom: 3px; margin-left: 20px; padding-left: 20px; font-size: 10px; text-decoration: none; display: block; color: #444; }
.follbtn a:hover { background: url(../img/follbtn_bg.gif) repeat-y left top; }

.follbtn .icon { position: relative; top: -3px; }

.member { margin-top: 10px; height: 32px; }
.member p { border-bottom: 1px solid #c5c5c5; padding-bottom: 6px; text-align: right; font-size: 12px; color: #282425; margin-left: 5px; margin-bottom: 0; }

.client-comment { color: #6c6b6b; border-left: 1px solid #c5c5c5; border-right: 1px solid #c5c5c5; border-top: 1px solid #c5c5c5; padding: 15px; background: #fff url(../img/bubble-bg.gif) repeat-x 0 bottom; margin-bottom: 0; }
.client { background: url(../img/bubble-btm.gif) no-repeat 0 top; margin-bottom: 30px; padding-top: 8px; border-bottom: 1px dotted #c5c5c5; padding-bottom: 8px; color: #525151; text-align: right; }
	.client.last { border-bottom: none; margin-bottom: 0; }

a.viewbtn { width: 52px; height: 17px; display: block; text-indent: -999em; float: left; margin-top: 10px; background: url(../img/view.gif) no-repeat; }
	a.viewbtn:hover { background: url(../img/view_h.gif) no-repeat; }
	
a.viewmorebtn { width: 104px; height: 25px; display: block; text-indent: -999em; float: right; margin-top: 10px; background: url(../img/viewmore.gif) no-repeat; }
	a.viewmorebtn:hover { background: url(../img/viewmore_h.gif) no-repeat; }

a.viewresumebtn { width: 104px; height: 25px; display: block; text-indent: -999em; float: right; margin-top: 10px; background: url(../img/viewresume.gif) no-repeat; }
	a.viewresumebtn:hover { background: url(../img/viewresume_h.gif) no-repeat; }

a.readmorebtn { width: 85px; height: 25px; display: block; text-indent: -999em; float: right; margin-top: 10px; background: url(../img/readmorebtn.gif) no-repeat; }
	a.readmorebtn:hover { background: url(../img/readmorebtn_h.gif) no-repeat; }

#teamimg img { width: 218px; margin-top: 30px; border: 1px solid #767676; }

#about img { border: 1px solid #767676; padding: 5px; margin: 10px; }


/* -- PORTFOLIO -- */

#portBox { width: 900px; height: 270px; margin-top: 20px; margin-bottom: 30px; }
.colPort { width: 210px; }
.buffer { padding-left: 20px; }
.portheading { width: 200px; padding-right: 30px; float: left; }
h9 { font-size: 21px; letter-spacing: 1px; text-align: right; color: #5e5e5e; }

.porthdr {
	display:block;
	width:900px;
	height:25px;
	font: normal 21px "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #666;
	margin-bottom: 10px;
	margin-top: 25px;
}

.portbtn { 
	width: 210px; 
	height: 17px; 
	display: block; 
	float: left; 
	margin-top: 10px;
}

.portimg {
	height: 150px; 
	width: 208px; 
	overflow: hidden; 
	display: block; 
}

.portitem { margin-bottom: 30px; color: #767676; width: 210px; float:left;}
.portitem p { font-size: 10px; margin-bottom: 0; }
.portitem .workimg { border: 1px solid #c5c5c5; height: 118px; width: 210px; overflow: hidden; display: block; }
.portitem a.workimg:hover { border: 1px solid black; }


.works { padding-left: 29px; }
.headings { width: 250px; padding-right: 30px; float: left; }

#websites { float: left; margin-top: 30px; }
#print, #branding { float: left; }

.item { margin-bottom: 30px; color: #767676; width: 278px; }
.item p { font-size: 10px; margin-bottom: 0; }
.item .workimg { border: 1px solid #c5c5c5; height: 118px; width: 276px; overflow: hidden; display: block; }
.item a.workimg:hover { border: 1px solid black; }

.stripe { position: absolute; height: 10px; width: 590px; background-image: url(../img/stripe.gif); }

a.top { text-indent: -999em; width: 19px; height: 26px; display: block; overflow: hidden; float: left; background: url(../img/top.gif) no-repeat 0 bottom; position: relative; left: -80px; opacity: .5; bottom: 8px; }
	a.top:hover { opacity: 1; }
	
.folioblock { margin-bottom: 30px; }

/* --end portfolio */

/* -- slide box -- */	

#slideshow {
    position:relative;
   	width: 900px;
    height:308px; 
    margin: 30px;
    border: 1px solid #767676;
}

#slideshow img {
    position:absolute;
   	width: 900px;
    height:308px; 
}

/* -- #slide box -- */

/* -- Text Style -- */

h2 { color: #282425; border-bottom: 1px dotted #767676; }
	#who h2 { text-indent: -999em;  border: none; background-image: url(../img/who-title.gif); width: 280px; height: 63px; margin-bottom: 20px; }
	#what h2 { text-indent: -999em;  border: none; background-image: url(../img/what-title.gif); width: 280px; height: 63px; margin-bottom: 20px; }
	#cform h2 { font-size: 30px; letter-spacing: 3px; color: #5e5e5e; margin-bottom: 20px; padding-top: 15px; padding-bottom: 10px; }
	#about h2, #services h2, #portfolio h2, #contact h2 { font-size: 48px; letter-spacing: 3px; padding-bottom: 20px; margin-bottom: 30px; }
	#portfolio h2 { margin-bottom: 10px; }
	
	#team h3, #follow h3, #testimonials h3, #badge h3 { letter-spacing: 2px; font-size: 20px; color: #484848; padding-bottom: 10px; margin-top: 20px; margin-bottom: 20px; border-bottom: 1px dotted #767676; }
	#bottom h3 { font-size: 18px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; padding-bottom: 10px; color: #282425; border-bottom: 1px dotted #767676; }
	.headings h3 { font-size: 24px; letter-spacing: 1px; margin-bottom: 20px; text-align: right; color: #5e5e5e; }
	#about h3 {font-size:21px;}

#about h4 {font-size:19px;}
	.item h4 { font-size: 16px; color: #282425; text-transform: uppercase; margin-bottom: 10px; margin-top: 10px; border-bottom:1px dotted grey; padding-bottom:6px;}
	
#about h5 {font-size:17px;}
#about h6 {font-size:15px;}

h3,h5,h6,pre{margin-bottom:20px;}

h4{margin-bottom:5px;}
	
p { margin-bottom: 1.25em; }
	#about p, #who p, #what p, #services p, #contact p { line-height: 1.8em; }
	p.sign { text-indent: -999em; width: 125px; height: 61px; background: url(../img/KL_signature_img.jpg) no-repeat; float: right; margin-top: 10px; margin-bottom: 0; }
	#badge p { margin-bottom: 0; }

#content a { color: black; }
	#content a:hover { text-decoration: none; }
pre, code{font-size: 13px;}
blockquote {margin-left:30px;border-left:3px solid grey;padding-left:10px;font-size:14px;}
strong {font-weight:bold;}
em{font-style: italic;}
del{text-decoration: line-through;}
#bottom li { list-style-type: disc; list-style-position: inside; font-size: 11px; margin-bottom: .5em; }

#content.home li{list-style:disc;list-style-position:inside;margin:10px 10px 2px;padding:3px 0;border-bottom:1px dotted gray;}


/* NAVIGATION */

#nav { 
	float: right; }

#nav ul { 
	float: left;
 }

#nav li {
	list-style: none;
	display: inline;
	float: left;
	margin-right: 30px;
}

#nav li a, #submenu li a { position: relative; text-decoration: none; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #525151; overflow: hidden; }
	#nav li a:hover, #nav .selected a, #submenu li a:hover { padding-bottom: 5px; border-bottom: 1px dotted #767676; }
	
#nav li.last, #submenu li.last { margin-right: 0; }

#secnav { 
	float: left;
	padding: 15px 30px;
}
#secnav li	{
	list-style: none;
	display: inline;
	float: left;
	margin-right: 20px;
}

#secnav li a { position: relative; font-size: 9px; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; color: #787878; }
#secnav li a:hover, #secnav .selected a { padding-bottom: 5px; border-bottom: 1px dotted #767676; }

#submenu { float: right; }
#submenu li { display: inline; list-style: none; margin-right: 20px; text-transform: uppercase; }


/* END NAVIGATION */

/* -- contact form -- */

/* Form */

#emailerror {
	margin-bottom: 10px;
	padding: 10px;
	background: #fcc;
	border: 1px solid #ff1600;
	color: #4b4b4b;
}

#success {
	margin-bottom: 10px;
	padding: 10px;
	background: #d6f1a9;
	border: 1px solid #76993d;
	color: #455a23;
}

#success p {
	font-size: 16px;
	margin-bottom: 0;
}

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


/* // Form	*/

#submitform #message, #name, #email { 
	width: 568px;
	max-width: 568px;
	margin-bottom: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	color: #666;
	}
	
	#submitform #name, #email { height: 20px; }
	#submitform #message { height: 80px; }
	
#submitformhome #message, #submitformhome #name, #submitformhome #email { 
	width: 228px;
	max-width: 228px;
	margin-bottom: 10px;
	border: 1px solid #ccc;
	padding: 10px;
	color: #666;
	}
	
	#submitformhome #name, #submitformhome #email { height: 10px; }
	#submitformhome #message { height: 80px; }
	
#submitform input.error, #submitform #message.error, #submitformhome #name.error, #submitformhome #email.error, #submitformhome #message.error { background-color: #ffe5e6; margin-bottom: 0; }
#submitform label.error, #submitformhome label.error {	
	float: right;
	color: #99100f;
	clear: both;
}	

#submitform label, #submitformhome label, .required { float: left; text-transform: uppercase; font-size: 9px; color: #767676; padding-bottom: 3px; margin-bottom: 0; clear: both;}
	
.submit-button { 
	display:block;
	line-height: 0px;
	text-indent: -999em;
	background: url(../img/submit.gif) no-repeat;
	border: none;
	height: 25px;
	overflow: hidden;
	margin-top: 10px;
	margin-bottom: 0; 
	float: right;
	width: 76px; }
	
	.submit-button:hover { 
		background: url(../img/submit_h.gif) no-repeat;
	}

/* -- #contact form -- */