/*

	Style Index

	

	$1 - Site Structure Styles

	$2 - Header Styles

	$3 - Sidebar Styles

	$4 - Content Styles

	$5 - Footer Styles

	$6 - Image Replacements

	$7 - sIFR Styles

	$100 - Clearfix Styles

*/





/* undohtml.css 

(CC) 2004 Tantek Celik. Some Rights Reserved.

http://creativecommons.org/licenses/by/2.0

This style sheet is licensed under a Creative Commons License.

Purpose: undo some of the default styling of common (X)HTML browsers */



:link,:visited {text-decoration:none}

ul,ol {list-style:none}

h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;}

ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input

{ margin:0; padding:0 }

a img,:link img,:visited img {border:none}

address {font-style:normal}





/* $1 - Site Structure Styles ///////////////////////////////////////////////////////////////////////////////////*/



body {

	background:#F3F3F3;

	font-family: Helvetica, Arial, Verdana, sans-serif;

	font-size: 12px;

	color:black;

	}

	

body#home {background:#CCC;}

	#container {

	background-color: #132C5A;

	background-image: url(pic/wakeface/site-bg.png);

	background-repeat: repeat-x;

	}



	

	#bg-container {

		background:url(pic/wakeface/big-bg.jpg) 50% 91px no-repeat;

		margin:0 auto;

		text-align:center;

		}

		

#about #container,

#work #container,

#team #container,

#contact #container,

#blog #container {

	background:#F3F3F3 url(pic/wakeface/site-bg-blue.png) repeat-x;

	}

	

	#about #bg-container,

	#work #bg-container,

	#team #bg-container,

	#contact #bg-container,

	#blog #bg-container {

		background:url(pic/wakeface/big-bg-blue.jpg) 50% 88px no-repeat;

		}

		

#header {

	position:relative;

	height:35px;

	width:930px;

	margin:0 auto;

	padding-top:60px;

	text-align:left;

	}



#content-container {

	width:930px;

	padding:0;

	margin:0 auto;

	padding:30px 0;

	text-align:left;

	}



#main-content {

	float:left;

	width:610px;

	}



#sidebar-right {

	float:right;

	width:290px;

	padding-top:90px;

	}

	

#sidebar-right-secondary {

	float:right;

	width:290px;

	padding-top:125px;

	}

		

#footer {

    border-top: #CCC solid 1px;

    background:url(/images/wakeface/footer-bg2.png) repeat-x;

	height:80px;

	text-align:center;

	}



#home #footer {

	border: none;

	font-size: 11px;

	height:235px;

	background:url(pic/wakeface/footer-bg.png) repeat-x;

	color:#000;

	text-align:center;

	}



#copyright {

	width: 930px;

	margin: 20px auto;

	padding: 0 10px;

	font-size: 11px; 

	text-align:center;

	color: #626873;

}



	

/* $2 - Header Styles ///////////////////////////////////////////////////////////////////////////////////*/



.header-logo {

	position:absolute;

	top:20px;

	right:0;

	}



#header-nav-ul li {

	display:inline;

	font-family: Helvetica, Arial, Verdana, san-serif;

	font-size: 12px;

	}



#header-nav-ul li a {

	color:#464A52;

	font-weight:normal; 

	text-transform: uppercase;

	margin-right:17px;

	padding-bottom:24px;

	display: inline-block;

	background:url(pic/wakeface/header-li-hover-bg.gif ) -2000px 100% no-repeat;

	}





#header-nav-ul li a.selected {

	background-position:50% 28px;

	color:#003F8E;

	}

	

#header-nav-ul li a:hover {

	background-position:50% 28px;

	color:#AB0101;

	}



/*#header-nav-ul li a.selected#nav-about,

#header-nav-ul li a:hover#nav-about {color:#AB0101;} 



#header-nav-ul li a.selected#nav-work,

#header-nav-ul li a:hover#nav-work {color:#AB0101;}

	

#header-nav-ul li a.selected#nav-team,

#header-nav-ul li a:hover#nav-team {color:#AB0101;}

	

#header-nav-ul li a.selected#nav-contact,

#header-nav-ul li a:hover#nav-contact {color:#AB0101;}



#header-nav-ul li a.selected#nav-blog,

#header-nav-ul li a:hover#nav-blog {color:#AB0101;} 	*/

	

/* $3 - Sidebar Styles ///////////////////////////////////////////////////////////////////////////////////*/



.help-ul {margin-bottom:33px;}

	

	html>body .help-ul {margin-bottom:35px;}

	

.ul-left {

	font-size: 12px;

	margin-left:50px;

	}



.ul-right {

	float:right;

	width:145px;

	}



.ul-left li,

.ul-right li {

	background:url(pic/wakeface/icon-check.png) 0% 50% no-repeat;

	padding-left:30px;

	margin-bottom:10px;

	}



.fresh {

	line-height: 1.7;

	}



.fresh li {

	background:url(/images/wakeface/icon-tag.gif) 0px 4px no-repeat;

	padding-left:27px;

	margin-top: 0px;

	margin-bottom:25px;

	font-size: 11px;

	color:#CCC;

	}





.fresh li a {

	color:white;

	text-shadow: #000 1px 1px 1px ;

	font-size: 12px;

	line-height: 1.8;

	}



.sidebar-menu {

	padding-top: 18px;

}





html>body .sidebar-menu {

	padding-top: 15px;

}



	.sidebar-menu h4 {

		color: #003F8E;

		text-transform: uppercase;

		font: 12px Helvetica, Arial, Verdana, san-serif;

		line-height: 35px;

		padding-top: 15px;

		margin-left: 20px;

	}

		

	.sidebar-menu ul {

		margin: 10px 0 0px 30px;

	}

		

	.sidebar-menu ul li {

		font-size: 11px;

		color: #464A52;

		font-weight:  bold;

		background:url(pic/wakeface/arrow-play.png) 0px 50% no-repeat;

		padding: 8px 0 8px 30px;



	}

	

	.sidebar-menu ul#services {

		margin: 10px 0 0px 20px;

	}

	

	.sidebar-menu ul#services li {

		font-size: 12px;

		color: #464A52;

		font-weight:  bold;

		padding: 15px 0 15px 40px;



	}



	.sidebar-menu ul#services li.webdesign {background:url(pic/wakeface/webdesign.gif) 0px 50% no-repeat;}

	.sidebar-menu ul#services li.iddesign {background:url(pic/wakeface/iddesign.gif) 0px 50% no-repeat;}	

	.sidebar-menu ul#services li.ecommerce {background:url(pic/wakeface/ecommerce.gif) 0px 50% no-repeat;}	

	.sidebar-menu ul#services li.webapp {background:url(pic/wakeface/webapp.gif) 0px 50% no-repeat;}	

	.sidebar-menu ul#services li.hosting {background:url(pic/wakeface/hosting.gif) 0px 50% no-repeat;}	



	

	.sidebar-menu ul li.selected {

		font-weight:  bold;

		background:url(pic/wakeface/arrow-selected.gif) 0px 50% no-repeat;

	}

	

	.sidebar-menu-head {

		height: 20px;

		background:url(/images/wakeface/sbhead.png) top no-repeat;

		padding-left: 20px;

	}

 

	.sidebar-menu-info {

		font-size: 11px;

		padding: 30px 20px;

	}

	

		.sidebar-menu-info strong {

			font-weight: bold;

			font-size: 12px;

			color: #464A52;

		}

		

		.sidebar-menu-info p {

			line-height: 18px;

			color: #464A52;

		}



		.sidebar-menu-info p span {

			color: #000;

		}



 	.sidebar-menu-foot {

		height: 60px;

		background:url(pic/wakeface/sbfoot.png) top no-repeat;

	}



.sidebar-icon {

	vertical-align: middle;

	margin-right: 15px;

}	



/* $3 - Content Styles ///////////////////////////////////////////////////////////////////////////////////*/



a,

a:link,

a:visited {

  	outline: none;

	color:white;

	}





a:hover {



	}



#content-container a,

#content-container a:link,

#content-container a:visited {

	color: #AB0101;

	border-bottom: 1px solid #CCCCCC;

	padding: 1px 0;

	}



#content-container a:hover {

	color: #333333;

	background-color: #EFEFEF;

	border-bottom: 1px solid #AB0101;

	}



#content-container a.external { 

	background: url(pic/wakeface/external-link.gif) 100% 40% no-repeat;

	padding-right: 15px;

} 

	

#home #content-container a,

#home #content-container a:link,

#home #content-container a:visited {

	color: #ECECEC;

	border-bottom: 1px solid #aecdfc;

	padding-bottom: 1px;

	}



#home #content-container a:hover {

	color: #FFFFFF;

	border-bottom: 1px solid #AB0101;

	background: none;

	}

	

	

#content-container #work-slides a:hover {

	background: none;

	border-bottom: none;

	}





h1,h2,h3,h4,h5,h6 {margin-bottom:10px;}

	

h1 {margin-bottom:15px;}



.page-title {

	color: #464A52;

	font: 22px normal Helvetica, Arial, Verdana, san-serif;

	margin-top: 20px;

	padding-bottom:5px;

	letter-spacing: .3mm;

	margin-bottom: 5px;

	text-shadow: 1px 1px 6px #BBB;

}



.page-subtitle {

	color: #003F8E;

	font: 14px normal Helvetica, Arial, Verdana, san-serif;

	margin-top: 20px;

	padding-bottom:5px;

	letter-spacing: .3mm;

	margin-bottom: 10px;

	text-shadow: 1px 1px 6px #BBB;

	background:url(pic/wakeface/page-title-bg.png) bottom no-repeat;

}





p {

	color: #000;

	margin-bottom:10px;

	line-height:1.8;

	}



#home p,

#home li {

	color: #FFF;

	}



img {border:none;}



.featured-index {width:610px;}



.featured-index img {float:left;}

	

.featured-index .index-right-feature {float:right;}





.globe-icon-float {

	width:30px;

	float:left;

	margin-right:15px;

	}



.bar-icon-float {

	width:33px;

	float:left;

	margin-right:15px;

	}



.block-what-we-do {

	margin-bottom:41px;

	color: white

	}



.featured-index img {

	padding-bottom:9px;

	background:url(pic/wakeface/feature-img-bottom-bg.gif) left bottom no-repeat;

	}



hr {height: 0; border: 0; border-bottom: 1px solid #DDD; color: #DDD; margin: 0; padding: 0; clear:both; width: 100%;}



.row {

	width: 290px;

	padding-top: 30px;

	font-size: 14px;

	font-weight: bold;

	margin-bottom: 10px;

}



.featured-index .row {

	text-shadow: #000 1px 1px 1px ;

	padding-top: 0px;

	font-size: 12px;

}



.row p {

	color: #464A52;

	font-size: 11px;

	font-weight: normal;

	line-height: 16px;

	margin-top: 6px;

	

}



.featured-index .row p {

	text-shadow: none;

	font-size: 11px;

	line-height: 16px;

	margin-top: 6px;

}



.first {

	clear: both;

	float:left;

	font:12px;

}



.second {float:right;}

	

.row img {

	margin-top: 10px;

	padding-bottom: 9px;

	background:url(/images/wakeface/work-img-bottom-bg.gif) left bottom no-repeat;

}



.featured-index .row img {

	background:url(pic/wakeface/feature-img-bottom-bg.gif) left bottom no-repeat;

}



#content-container .row a,

#content-container .row a:link,

#content-container .row a:visited {

	padding: 0;

	border: none;

	color:#AB0101;

	text-decoration: none;	

}



#content-container .row g {

	background: none;

	color: #333;

	text-decoration: none;	

}





.approach {

	clear: both;

	height: 70px;

	margin-top: 30px;

	margin-left: 0px;

	width: 600px;

}



	.approach img {

		padding: 5px;

		float: left;

		width: 48px;

	}

	

	.approach h3 {

		font: 14px Helvetica, Arial, Verdana, san-serif;

		font-weight: bold;

		color: #000;

		float: right;

		width: 520px;

		margin: 0;

		padding: 0;

	}

	

	.approach p {

		font-size: 12px;

		line-height: 1.6;

		color: #464A52;

		float: right;

		width: 520px;

		padding: 0px;

	}





#work h3 {

	font-weight: bold;

	font-size: 14px;

	color: #003F8E;

	margin: 30px 0 10px 0;

}



#work-slides {

	width: 610px;

	background-color: #EFEFEF;

}



#work-details {

	margin-top: 15px;

}



	#work-details p {

		float: left;

		width: 320px;

	}

	

	#work-details span {

		margin: 10px 0;

		display: block;

	}

	

	

	#work-details h4 {

		margin-top: 5px;

		width: 250px;

		float: right;

		color: #464A52;

		text-transform: uppercase;

		font: 12px bold Helvetica, Arial, Verdana, san-serif;

	}

	

	#work-details ul {

		width: 243px;

		float: right;

		margin: 0;

	}



		#work-details ul li {

			font-size: 11px;

			color: #003F8E;

			font-weight:  normal;

			background:url(pic/wakeface/arrow-play.png) 0px 50% no-repeat;

			padding: 6px 0 6px 25px;

	

		}



.team-member {

	clear: both;

	height: 120px;

	margin-top: 30px;

}



	.team-member img {

		background: #FFFFFF;

		border: #DDD 1px solid;

		padding: 5px;

		float: left;

		width: 90px;

	}

	

	.team-member h3 {

		font: 14px bold Helvetica, Arial, Verdana, san-serif;

		color: #000;

		float: right;

		width: 480px;

		margin-top: 0px;

		margin-bottom: 0px;

		padding-bottom: 5px;

		background:url(pic/wakeface/page-title-bg.png) bottom no-repeat;

	}

	

	.team-member p {

		float: right;

		width: 480px;



	}



#contactForm fieldset{font-size: 12px; border: none; margin: 10px 0; padding:0; text-align: left; }

#contactForm legend {display:none;}

#contactForm ol {padding:0; margin:0;}

#contactForm li {list-style: none; padding:0;}

#contactForm label {color: #464A52; display: block; line-height:20px; padding: 10px 0 5px 0; text-align:left; vertical-align:top; }

#contactForm label span.required {color: #AB0101; font-weight: bold}

#contactForm input {width: 400px; font-size:1.2em; padding:3px; vertical-align:middle; background: #FFFFFF;}

#contactForm textarea {width: 100%; height:250px; padding:3px; background: #FFFFFF; font:12px Helvetica, Arial, Verdana, san-serif;}

#contactForm input.submitButton {width:auto; text-align: center; margin: 20px 0}



.blogimg {

	float: left;

	margin-right: 20px;

	margin-bottom: 20px;

}



.blog-post-info {

	clear: left;

	color: #626873;

	margin: 15px 0 40px 0;

}



.display-comment {

	clear: both;

	border-top: 1px solid #DDD;

	margin-bottom: 30px;

}



	.author1 {

	background: url('pic/wakeface/bg-comment.gif') no-repeat;

	min-height: 50px;

}



	.display-comment .comment {

		color: #464A52;

		float: right;

		padding: 20px 0 10px 0;

		width: 440px;

	}

	

	.display-comment .comment p {

			font-size: 12px;

			color: #464A52;

			margin: 0;

			padding: 0;

		}



	.display-comment .posted {

		font-size: 11px;

		font-style: italic;

		padding: 20px 0 10px 0;

		color: #626873;

		float: left;

		width: 150px;

	}

		.display-comment .posted p {		

			color: #626873;

		}

		.display-comment .posted strong {

			font-size: 12px;

			font-weight: bold;

			font-style: normal;

			color: #626873;

		}

		

#commentForm #formTitle {margin: 20px 0 10px 0; font-size: 12px; font-weight: bold; color: #003F8E;}

#commentForm input.textField {width: 440px; font-size:11px; padding:5px; vertical-align:middle; background: #FFFFFF;}

#commentForm textarea {width: 440px; height:200px; padding:5px; background: #FFFFFF; font:12px Helvetica, Arial, Verdana, san-serif;}

#commentForm input.submitButton {text-align: center;}



/* $5 - Footer Styles ///////////////////////////////////////////////////////////////////////////////////////*/



#footer h1,

#footer h2,

#footer h3,

#footer h4,

#footer h5,

#footer h6 {margin-bottom:0;}

	

#footer p,

#footer li {

	color: #464A52;

}





#footer a,

#footer a:link,

#footer a:visited {

	color:#AB0101;

	border-bottom:1px solid #CCCCCC;

	padding-bottom: 2px;

	}



#footer a:hover {

	color: #333333;

	background-color: #FFFFFF;

	border-bottom:1px solid #AB0101;

	}





.footer-container {

	width:930px;

	margin:0 auto;

	padding-top:20px;

	text-align:left;

	}



.footer-block-left,

.footer-block-middle,

.footer-block-right {

	width:290px;

	height:170px;

	background:url(pic/wakeface/footer-block-bottom.png) left bottom no-repeat;

	}



.footer-block-left {

	position:relative;

	float:left;

	margin-right:30px;

	color:#666666;

	line-height: 1.6;

	font-size: 12px;

	}

	

	.rss-icon {

		position:absolute;

		top:0;

		right:4px;

		}

	

	.footer-block-left li  {margin-bottom:5px;}

	

	#footer .footer-block-left li em {

		font-weight:normal;

		font-size: 10px;

		font-style: normal;

		}

	

	

.footer-block-middle {float:left;}

	

	.footer-block-middle p {margin-bottom:10px;}



.footer-block-right {float:right;}

	

	.footer-block-right p {

		line-height:1.7;

		color:#464A52;

		}

		

	.footer-block-right p span {color:#000;}



	.footer-block-right strong {

		font-size: 12px;

		font-weight: normal;

		}		

	

#footer .content {

	padding:10px 20px 0 20px;

	border-top-style: none;

	border-right-style: none;

	border-bottom-style: none;

	border-left-style: none;

	}



.work-button {

	height:33px;

	width:245px;

	padding:0 10px;

	line-height:40px;

	background:url(pic/wakeface/work-button.gif) no-repeat;

	color:white;

	font:10px Helvetica, Arial, Verdana, san-serif;

	}



#footer .work-button span a {

	color:#87E95C;

	line-height:30px;

	}



span.download-pdf {

	padding-left:24px;

	background:url(pic/wakeface/download-pdf.png) 0px 50% no-repeat;

	line-height:30px;

	}



span.download-word {

	padding-left:20px;

	background:url(pic/wakeface/download-word.png) 0px 50% no-repeat;

	line-height:30px;

	}





/* $6 - Image Replacements //////////////////////////////////////////////////////////////////////////////////*/



#quote-heading {

    padding:75px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/we-create-modern.gif) no-repeat;

    

    height:0px !important;

    height /**/:75px;

}



#about #quote-heading {

    margin-bottom: 50px;



}



#work #quote-heading {

    margin-bottom: 50px;

    background:url(pic/wakeface/we-do-what-we-love.gif) no-repeat;

}



#team #quote-heading {

    margin-bottom: 50px;

    background:url(pic/wakeface/caring-for-our-business.gif) no-repeat;

}



#contact #quote-heading {

    margin-bottom: 50px;

    background:url(pic/wakeface/want-to-make-something.gif) no-repeat;

}



#blog #quote-heading {

    margin-bottom: 50px;

    background:url(pic/wakeface/the-wake-blog.gif) no-repeat;

}



#what-we-do {

    padding:29px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/what-we-do.gif) no-repeat;

    

    height:0px !important;

    height /**/:29px;

	border-bottom:1px solid #426FA8;

	margin-bottom:16px;

	/*float:right;*/

	width:565px;

}



#featured-projects {

    padding:26px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/featured-projects.gif) no-repeat;

    

    height:0px !important;

    height /**/:22px;

	border-bottom:1px solid #426FA8;

	margin-bottom:16px;

}



#wed-love-to-help {

    padding:29px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/wed-love-to-help.gif) no-repeat;

    

    height:0px !important;

    height /**/:29px;

	border-bottom:1px solid #426FA8;

	margin-bottom:16px;

	/*float:right;*/

	width:240px;

}



#still-fresh {

    padding:26px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/still-fresh.gif) no-repeat;

    

    height:0px !important;

    height /**/:24px;

	border-bottom:1px solid #426FA8;

	margin-bottom:16px;

}



#whats-happening {

    padding:22px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/whats-happening.gif) no-repeat;

    

    height:0px !important;

    height /**/:22px;

}



#want-to-work {

    padding:20px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/want-to-work.gif) no-repeat;

    

    height:0px !important;

    height /**/:20px;

}



#contact-us {

    padding:22px 0 0 0;

    overflow:hidden;

    background:url(pic/wakeface/contact-us.gif) no-repeat;

    

    height:0px !important;

    height /**/:22px;

}





/* $100 - Clearfix Styles ///////////////////////////////////////////////////////////////////////////////////*/







.clearfix:after {

    content: "."; 

    display: block; 

    height: 0; 

    clear: both; 

    visibility: hidden;

}



/* Hides from IE-mac \*/

* html .clearfix {height: 1%;}

.clearfix {display: block;}

/* End hide from IE-mac */

	

	


