/*
Theme Name: Foothold
Theme URI: n/a
Description: Custom WordPress theme by <a href="http://www.footholddesign.com/">Foothold Design Studio</a>
Version: 1.0
Author: Foothold Design Studio
URI: http://www.footholddesign.com/
Tags: fixed width, grid, 2-column
*/

/* TABLE OF CONTENTS

00 - Global Elements - Site structure and properties
01 - Typography - All type throughout the site
02 - Main Structure - Columns, Clearfix, etc.
03 - Header - Header, Logo, Navigation, Client Login
04 - Main Content - The Meat & Potatoes
05 - Sidebars - Left & Right side columns
06 - Footer - Copyright, Footerlinks
07 - Forms - Contact form
08 - Miscellaneous Elements - Temporary items, One-offs
09 - Admin - Administrative elements

*/

/*/////// RESET ///////*/

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }


/* ----------------------------------------------*/

/* 00 - GLOBAL ELEMENTS
/* ----------------------------------------------*/

body {
	background:#090707;
	color:#bebcba;
	color:#bfbdbb;
	color:#888684;
	height:100%;
	font:68.8%/16px 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
	font-weight:normal;
	text-align:left;
	width:auto;
}

img {
	border:0;
	margin:0;
	padding:0;
}

/* 01 - TYPOGRAPHY
/* ----------------------------------------------*/

h1 {
	color:#00B7D2;
	font-size:200%;
	font-weight:100 !important;
	letter-spacing:.3px;
}

#project-examples h1 {
	color:#DCD8CE;
	font-size:26px !important;
	padding-top:4px;
}

h2 {
	color:#2A8C9D;
	font-size:155%;
	letter-spacing:.3px;
	padding-bottom:10px;
	padding-top:2px;
}


h3 {
	color:#DCD8CE;
	font-size:130%;
	font-weight:300;
	letter-spacing:.3px;
	line-height:1.2em;
	margin-top:20px;
	padding:0;
}

h3#synopsistitle {
	color:#2A8C9D;
	font-size:140%;
}

h4 {
	color:#2A8C9D;
	font-size:100%;
	padding-bottom:.4em;
}

h5 {
	font-size:90%;
	margin-top:5px;
}

h6 {
	font-size:80%;
}

p {
	padding-bottom:1.6em;	
}

strong {
	font-size:100%;
	font-weight:bold;
}

a:link, a:visited {
	color:#2A8C9D;
	color:#7B939D;
	text-decoration:underline;
}

a, a:active {
	outline: none;
}

a:hover {
	color:#247684;
	color:#657880;
	text-decoration:none;
}

#logo a {
	background: transparent url(images/logo.gif) top left no-repeat;
	height:0;
	overflow:hidden;
	padding-top:32px;
	position:absolute;
	text-indent:-9999px;
	top:54px;
	width:299px;
}

h3 a {
	color:#DCD8CE !important;
	text-decoration:none !important;
}

input:focus {
	outline: none;
}

.divide {
	background: transparent url(images/dots_hor.gif) top left repeat-x;
	clear:both;
	float:left;
	height:2px;
	padding-bottom: 2.2em; width:100%; }
/* IE Fix */ *html .divide { padding-bottom: .8em; }

#details .divide {
	background-position: center left !important;
	padding:10px 0 !important;
}
/* IE Fix */ *html #details .divide { padding:5px 0 !important; }

#project-examples .divide {
	margin-top:10px;
}

/* Header
/* -------------- */

#navigation ul li a:link, #navigation ul li a:active, #navigation ul li a:visited {
	color:#34393e;
	display:block;
	font:bold 1.08em Arial, Helvetica, sans-serif;
	margin:0;
	padding:13px 15px;
}

#navigation ul li a:hover {
	color:#000;
	font-weight:bold;
	text-decoration:underline;
}

#navigation ul.pages li.current_page_item a:link, #navigation ul.pages li.current_page_item a:active, #navigation ul.pages li.current_page_item a:visited {
	background:#171615 url(images/navigation-hover.gif) repeat-x bottom center;
	color:#f1f8ff;
	margin:-3px 0 0 0;
	padding:15px 15px 14px 15px;
	position:relative;
}

a.rss:link, a.rss:active, a.rss:visited, a.rss:hover {
	background:url(images/rss.png) no-repeat top center;
	display:block;
	margin:13px 15px 0 0;
	outline:0;
	padding:0;
	text-indent:-9999px;
	width:16px; height:17px;
}

/* Footer
/* -------------- */

#footer {
	color: #57676e;
	font-size:10px;
}

#footer a, #footer a:visited {
	text-decoration:none;	
}

#footer a:hover {
	text-decoration:underline;	
}

#footer ul {
	margin-top:40px;	
}

#footer ul li {
	display:inline;
	margin-right:10px;
}

#footer ul li.page-item-52 {
	margin-right:0;	
}

#footer ul li:after {
	color:#657880;
	content:"+";
	margin-left:10px;
}

#footer ul li.page-item-52:after {
	display:none;
}

#footer p {
	font-size:10px;
}


/* 02 - MAIN STRUCTURE
/* ----------------------------------------------*/

#wrapper {
	background:#050404;
	background:transparent;
	margin:0 auto;
	overflow:hidden;
	width:960px;
}

#headcontent {
	margin:0 auto;
	position:relative;
	width:960px;	
}

#content {
	background:transparent url(images/bg.jpg) no-repeat scroll top;
	clear:both;
	overflow:hidden;
	padding:44px 0 80px;
	width:100%;
}
/* IE Fix */ *html #content { margin-bottom:40px; }

#maincontent {
	float:right;
	width:603px;
}

.center {
	clear:both;
	text-align:center;
}

.error404 {
	font-size:24px;
	font-weight:bold;
	margin:100px auto;
}

/* Work
/* -------------- */

#maincontent.work {
	float:left;
	margin-left:7px;
	width:100%;
}

#projects {
	float:left;
	width:100%;
}


/* 03 - HEADER
/* ----------------------------------------------*/

#header {
	background:#090707 url(images/head_grad.jpg) no-repeat scroll bottom;
	border-bottom:#181315 1px solid;
	border-color:#1a1a1a;
	clear:both;
	height:120px;
	width:100%;
}

/* Client Login
/* -------------- */

#clientlogin {
	float:right;
}

a.tab {
	background: transparent url(images/clienttab_right.gif) no-repeat scroll top right; 
	display: block;
	float: left;
	height: 21px;
	margin-right: 2px;
	padding-right: 10px;
	text-decoration: none;
	color: #f1eeeb;
	font-size:9px;
}

a.tab span {
	background: transparent url(images/clienttab_left.gif) no-repeat; 
	display: block;
	line-height: 21px;
	padding: 1px 0 5px 10px;
} 

a.tab:hover span {
	color:#dbd8d6;
	text-decoration:underline;
}

/* Navigation
/* -------------- */

#nav {
	position:absolute;
	right:0;
	top:62px;
}

#nav ul li {
	display:inline;
	
}

#nav ul li a, #nav ul li.active {
	height:0;
	float:left;
	margin: 0;
	margin-left: 20px;
	margin-right: 0px;
	overflow:hidden;
	padding-top:26px;
	text-decoration: uppercase;
}

#nav li.page-item-50 a {
	width:57px;
}

#nav li.page-item-2 a {
	width:62px;
}

#nav li.page-item-52 a {
	width:76px;
}

#nav li a, #nav li.active, #nav li a:active, #nav li .current_page_item {
	background-image: url(images/nav.gif); background-repeat: no-repeat;
}

/* Buttons */
#nav .page-item-50 a { background-position: 0 0; }
#nav .page-item-2 a { background-position: -77px 0; }
#nav .page-item-52 a { background-position: -357px 0; }

/* Hover & Current */
#nav .page-item-50 a:hover, #nav .page-item-50.current_page_item a { background-position: 0 -62px !important; }
#nav #project .page-item-50 a { background-position: 0 -62px !important; }
#nav .page-item-2 a:hover, #nav .page-item-2.current_page_item a { background-position: -77px -62px !important; }
#nav #about .page-item-2 a { background-position: -77px -62px !important; }
#nav .page-item-52 a:hover, #nav .page-item-52.current_page_item a { background-position: -357px -62px !important; }
#nav #contact .page-item-52 a { background-position: -357px -62px !important; }

/* Active */
#nav .page-item-50 a:active { background-position: 0 -31px; }
#nav .page-item-2 a:active { background-position: -77px -31px; }
#nav .page-item-52 a:active { background-position: -357px -31px; }

		
/* 04 - MAIN CONTENT
/* ----------------------------------------------*/

/* Homepage
/* -------------- */

/* Featured Project */
#herotitle {
	margin:20px 0 0 0;
}

#herotitle ul {
	height:20px;
}

#herotitle ul li {
	display:inline;
	float:left;
	margin-right: 10px;
}

#herotitle .projectname h2 {
	color: #f1eeeb;
}

#herotitle a.button { background: transparent url(images/button_details.gif) top left no-repeat; display:inline; float:left; margin:-2px 0 0 !important; width:68px; }
*html #herotitle a.button {margin:0 !important;}
#herotitle a.button:hover { background-position: 0 -21px; }
#herotitle a.button:active { background-position: 0 0; }

#herodesc {
	clear:both;
	float:left;
	margin:5px 0 0 0;
}

/* Bottom Boxes */
#bottomboxes {
	float:left;
}

#bottomboxes .box {
	float:left;
	width: 280px;
}

#bottomboxes #rightbox {
	margin-left: 40px;
}

#bottomboxes #leftbox a.button { background: transparent url(images/button_readmore.gif) top left no-repeat; margin-top: 0; width:88px; }
#bottomboxes #leftbox a.button:hover { background-position: 0 -21px; }
#bottomboxes #leftbox a.button:active { background-position: 0 0; }

#bottomboxes #rightbox a.button { background: transparent url(images/button_seethework.gif) top left no-repeat; margin-top: 0; width:106px; }
#bottomboxes #rightbox a.button:hover { background-position: 0 -21px; }
#bottomboxes #rightbox a.button:active { background-position: 0 0; }

/* About Page
/* -------------- */

.listrow {
	background:url(images/dots_hor.gif) top left repeat-x;
	color:#57676E;
	float:left;
	line-height:3.2em;
	width:45%;
}

.listrow li {
	background:url(images/dots_hor.gif) bottom left repeat-x;
	display:block;
	padding-left:5px;
}

#listright {
	float:right;
}

/* Clients Page
/* -------------- */

.clientrow {
	background:transparent;
	cursor:pointer;
	display:block;
	float:left;
	width:25%;
}

.clientrow li {
	border-bottom:0px dotted #181315;
	border-left:1px solid #181315;
	color:#2a8c9d;
	display:block;
	margin-bottom:10px;
	padding:6px 0 6px 10px;
	width:90%;
}

.clientrow li.first {
	border-top: 0px dotted #181315;
}

.clientrow li:hover {
	color:#bebcba;
}

/* Projects Page
/* -------------- */

.projectbox {
	float:left;
	height:360px;
	padding:10px 15px 20px;
	width:300px;
}

.projectbox .projectdesc {
	padding:0 5px;
}

.projectbox p {
	font-size:100%;
}

.projectbox {
	background: transparent url(images/dots_ver.gif) top right repeat-y;
}

.projectbox.lefty {
	padding-left:0 !important;
}

.projectbox.righty {
	background:none !important;
	padding-right:0 !important;
}

.projectbox a.button { background: transparent url(images/button_details.gif) top left no-repeat; margin-top: 5px; width:68px; }
.projectbox a.button:hover { background-position: 0 -21px; }
.projectbox a.button:active { background-position: 0 0; }

/* Project Thumbs */
.projectthumb {
	background-color: transparent;
	background-position: top left;
	background-repeat:no-repeat;
	cursor:pointer;
	display:block;
	height:170px;
	overflow:hidden;
	position:relative;
	width:300px;
}

a.projectthumb img.attachment-post-thumbnail {
	left:0;
	position:absolute;
	top:0;
}
a.projectthumb img.attachment-post-thumbnail:hover {
	opacity: 0.90;
	-ms-filter: 'alpha (opacity=90)';
	filter: alpha (opacity=90);
}
/*
a.projectthumb img.attachment-post-thumbnail:hover {
	left:0;
	position:absolute;
	top:-170px !important;
}
*/

/*
.projectthumb:hover {
	background-position:bottom left !important;
}
*/

#telly.projectthumb { background:url(images/project/thumb_telly.jpg); }
#planethollywood.projectthumb { background:url(images/project/thumb_planethollywood.jpg); }
#gdp.projectthumb { background:url(images/project/thumb_gdp.jpg); }
#biorad.projectthumb { background:url(images/project/thumb_metamorphosite.jpg); }
#dole.projectthumb { background:url(images/project/thumb_dole.jpg); }
#brilliantpet.projectthumb { background:url(images/project/thumb_brilliantpet.jpg); }
#sears1.projectthumb { background:url(images/project/thumb_prom09.jpg); }
#bp.projectthumb { background:url(images/project/thumb_bpcentenary.jpg); }
#ty.projectthumb { background:url(images/project/thumb_beaniebabies.jpg); }
#statefarm1.projectthumb { background:url(images/project/thumb_nowwhat.jpg); }
#sears2.projectthumb { background:url(images/project/thumb_arrivelounge.jpg); }
#statefarm2.projectthumb { background:url(images/project/thumb_iamsothere.jpg); }

/* Project Detail Page
/* -------------- */

.client-logo {
	display:block;
	position:absolute;
	top:0;
	left:0;
}

#synopsistitle {
	clear:both;
	margin:30px 0 10px;
}

#details {
	font-size:9px;
	text-transform:uppercase;
	width:100%;
}

#details .divide {
	padding:1.2em 0 !important;
}

#details .left-side {
	float:left;
	width:30%;
}

#details .right-side {
	float:right;
	text-align:right;
	width:70%;
}

#sidebar.project #summary {
	clear:both;
	float:left;
	margin-top:10px;
	text-align:justify;
	width:100%;
}

#sidebar.project #summary .wp-caption, #sidebar.project #summary .wp-caption-text, #sidebar.project #summary .flashmovie {
	display:none;
}

#project-title {
	background:url("images/dots_hor.gif") repeat-x scroll left bottom transparent;
	display:block;
	padding-bottom:10px;
}

#project-examples .wp-caption-dd, #project-examples .wp-caption-text {
	color:#42403D;
	font-size:9px;
	padding:2px 0 7px;
}

#project-examples {
	float:right;
	overflow:visible;
	width:603px;
}

#project-examples p {
	display:none;
}

#project-examples .wp-caption-dd, #project-examples .wp-caption-text {
	display:block;
}

#project-examples .wp-caption {
	background:url("images/dots_hor.gif") repeat-x scroll left bottom transparent;
	clear:both;
	margin:0 0 25px;
	width:100%;
}

#project-examples .flashmovie {
	background:transparent;
	clear:both;
	margin:0 0 25px;
}


/* 05 - SIDEBARS
/* ----------------------------------------------*/

#sidebar {
	background: #090707;
	float:left;
	font-size:11px !important;
	margin: 0;
	width:300px;
}

.contactpage, #sidebarnews {
	background:transparent url(images/topcap_blue.gif) left top no-repeat;
	padding-top:3px;
}

#sidebarcontact, #sidebarnews {
	background-color: #090707;
	color: #7b939d;
	font-size: 10px;
	overflow:hidden;
}

a.button, a#button {
	display:block;
	height:0;
	margin-top:10px;
	overflow:hidden;
	padding-top:21px;
}

/*#sidebarcontact .contact-title, #sidebarcontact .aboutpage */

.contact-title, .news-title {
	/*background: #2a8c9d url(images/sidebar_contactTitle.gif) top left no-repeat;*/
	background: #2a8c9d;
	color:#DCD8CE;
	font-weight:100;
	height:22px;
	padding-left:20px;
	padding-top:17px;
/*
	height:0px;
	overflow:hidden;
	padding-top:50px;
*/
}

#sidebarcontact.contactpage .title {
	background: #2a8c9d url(images/sidebar_contactTitle2.gif) top left no-repeat;
	height:0px;
	overflow:hidden;
	padding-top:50px;
}

#sidebarcontact .box {
	border-bottom:#161515 1px solid;
	float:left;
	padding:20px 20px 20px 48px;
	width:232px;
}

#sidebarcontact .halfbox {
	float:left;
	padding:20px 0 20px 48px;
	width:105px;
}

/* Address Box */
#sidebarcontact #address.box {
	background: transparent url(images/icon_house.gif) 20px 22px no-repeat;
}

#sidebarcontact #address.box a#button {
	background: transparent url(images/button_map.gif) top left no-repeat;
	width:43px;
}

#sidebarcontact #address.box a#button:hover {
	background-position: 0 -21px;
}

#sidebarcontact #address.box a#button:active {
	background-position: 0 0;
}

/* Phone/Fax Box */
#sidebarcontact #phonefax.box {
	padding:0;
	width:auto;
}

#sidebarcontact.contactpage #phonefax.box {
	border-bottom:none;
	padding:0;
	width:auto;
}

#sidebarcontact #phone.halfbox {
	background: transparent url(images/icon_phone.gif) 20px 20px no-repeat;
}

#sidebarcontact #fax.halfbox {
	background: transparent url(images/icon_fax.gif) 14px 20px no-repeat;
	padding-left:42px;
}

/* Message Box */
#sidebarcontact #message.box {
	background: transparent url(images/icon_envelope.gif) 20px 24px no-repeat;
	border-bottom:none;
}

#sidebarcontact #message.box a.button, #message.box a.button {
	background: transparent url(images/button_sendusamessage.gif) top left no-repeat;
	margin-top: 0;
	width:138px;
}

#sidebarcontact #message.box a.button:hover, #message.box a.button:hover {
	background-position: 0 -21px;
}

#sidebarcontact #message.box a.button:active, #message.box a.button:active {
	background-position: 0 0;
}

/* Home
/* -------------- */

/* News Accordion */

#sidebarnews {
	width:300px;
}

.accordionButton {	
	cursor: pointer;
	background: transparent;
	border-top: 1px solid #141414;
	padding:20px 10px 25px 15px;
	/*float: left;
	_float: none;   Float works in all browsers but IE6 */
	width: 275px;
}

.accordionContent {	
	background: #0A0808;
	color:#888684;
	font-size:98% !important;
	line-height:1.5em;
	/*border-bottom:1px solid #141414;*/
	padding:0 10px 20px 20px;
	/*float: left;
	_float: none;  Float works in all browsers but IE6 */
	width: 260px;
}

.on, .on.over {
	background: #0A0808;
}
	
.over {
	background: #111111;
}

.post-date {
	color:#DCD8CE;
	float:left;
	font-size:26px !important;
	text-align:center;
	width:35px;
}

.date-day {
	padding-top:2px;
}

.date-month {
	font-size:11px !important;
	letter-spacing:5px;
	line-height:15px;
	margin-left:2px;
	text-shadow:none;
	text-transform:uppercase;
}

.post-title {
	display:inline-block;
	font-size:110%;
	margin-top:0px;
}

.post-excerpt {
	color:#DCD8CE;
	color:#B7B4AE;
	display:inline-block;
	font-size:10px !important;
	line-height:1.5em;
	margin-top:4px;
}

.post-excerpt p {
	padding-bottom:0 !important;
}

.post-intro {
	display:inline-block;
	margin-top:-4px;
	padding-left:20px;
	width:210px;
}

/* About
/* -------------- */

#profiles .profile .top, #profiles .profile .bottom {
	padding:20px;
}

#profiles .profile .top {
	border-bottom:1px solid #161515;
	min-height:104px;
}

#profiles .profile .bottom {
	clear:both;
}

.profile#sean .avatar {
	float:left;
	height:104px;
	width:104px;
}

.profile#sean .name {
	background:transparent url(images/profiledesc_sean.gif) top left no-repeat;
	float:left;
	height:0;
	margin:45px 0 0 20px;
	overflow:hidden;
	padding-top:26px;
	width:130px;
}

/* Project Detail
/* -------------- */

#sidebar.project {
	background:transparent;
	float:left;
	overflow:hidden;
	padding-top:50px;
	position:relative;
	width:300px;
}

#sidebar.project #summary .mceTemp {
	display:none;
}

						
/* 06 - FOOTER
/* ----------------------------------------------*/

#footer {
	background: #090707 url(images/foot_grad.jpg) no-repeat scroll top;
	border-top:#181315 1px solid;
	border-color:#1a1a1a;
	clear:both;
	height:160px;
	margin:0;
	padding:0;
	text-align:center;
	width:100%;
}


/* 07 - FORMS
/* ----------------------------------------------*/

/* Wufoo Contact Form
/* -------------- */

/* Backgrounds */

#public {
	background:none;
}

.wufoo input.text, .wufoo textarea.textarea {
	background:#f1eeeb;
}

.wufoo .focused {
	background:#242424;
}

.wufoo .instruct {
	background-color:#F5F5F5;
}

.wufoo .name input.text {
	background: #f1eeeb;
}

.wufoo .email input.text {
	background: #f1eeeb;
}

.wufoo .message textarea {
	background: #f1eeeb;
}

/* Typography */

.wufoo .info h2 {
	font-size:160%;
	font-family:inherit;
	color:#2A8C9D;
	line-height:1.2em;
	margin-left:0px;
}

.wufoo label.desc {
	color: #888684;
	font-size:95%;
	font-family:inherit;
	font-weight:normal;
}

.wufoo li.focused label.desc {
	color: #7B939D;
}

.wufoo li {
	padding: 4px !important;
}

.wufoo .name input, .wufoo .email input {
	font-size:20px;
	height:30px;
	padding:4px 0 0 4px;
	text-align:left !important;
	width:586px;
}

.wufoo .message textarea {
	font-size:12px;
	height:290px;
	padding:4px;
	width:582px;
}

/* Submit Button */

.wufoo .buttons #saveForm {
	background: url(images/button_sendmessage.gif) top left no-repeat;
	border:none;
	cursor:pointer;
	float:left;
	height:0;
	margin-top:10px;
	overflow:hidden;
	padding-top:21px;
	width:115px;
}

.wufoo .buttons #saveForm:hover {
	background-position: 0 -21px;
}

.wufoo .buttons #saveForm:active {
	background-position: 0 0;
}

/* Drop Shadows */

#top, #bottom {
	visibility:visible;
	display:none;
}

/* Errors */

#errorLi {
	background: #7e000f !important;
	border:0; color:white;
	margin:0 0 5px 0;
	padding:15px 0 0 0;
	-moz-border-radius:0;
	-webkit-border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	-webkit-border-top-left-radius: 0;
	-webkit-border-top-right-radius: 0;
}

#errorMsgLbl {
	margin-top:15px;
}

#errorMsgLbl, #errorMsg {
	color:white !important;
}

.noI form li, .noI form li.buttons, .altInstruct form li, .altInstruct form li.buttons {
	width:100% !important;
}

.wufoo form p.error {
	line-height:15px !important;
}

.wufoo .info h2 {
	display:none;
}

#contactform h2 {
	padding-left:4px;
}


/* 08 - MISCELLANEOUS
/* ----------------------------------------------*/

/* Temporary Splash Page
/* -------------- */

#splashcenter {
	background:transparent url(images/bg.jpg) no-repeat scroll top;
	padding:100px 0;
	text-align:center;
}

#splashcenter #message.box a.button {
	background: transparent url(images/button_message.gif) top left no-repeat;
	margin:0 auto;
	width:125px;
}

#splashcenter #message.box a.button:hover {
	background-position: 0 -21px;
}

#splashcenter #message.box a.button:active {
	background-position: 0 0;
}


.edit-btn { background: transparent url(images/button_edit.gif) top left no-repeat; cursor:pointer; float:left; height:0; margin:5px 10px 0 0; overflow:hidden; padding-top:21px; width:45px; }
.edit-btn:hover { background-position: 0 -21px; }
.edit-btn:active { background-position: 0 -21px; }

#project-examples .edit-btn {float:right;}


/* Last Update 07/16/2010 */