/***
	Author: Tiffany B. Brown & Nate Steiner
	Armchair Media <www.armchairmedia.com>
	Copyright 2008 - 2010

		Colors
			work background light red: #FFF7F9
			blog background light green: #f1f7ff
			about background light purrple: #fbf1ff	
			store background light orange: #F9EBDE
			
			work red: #ff0033
			blog green: #257A86
			about purple: #564779
			store orange: #DC8236
			
		Changelog:
			2010-07-15: Added iPad-specific styles
			2010-07-21: Added new comment form styles 
***/

/* UNIVERSAL STUFF */
body {background: #eee; font-size: 70%; line-height:1.3em; font-family:helvetica, arial, sans-serif;text-align: center}
body *{text-align: left}
.c {clear:both}
a img{border:0}
a, a:link, a:visited{text-decoration: none;outline:none}
a:hover{text-decoration: none}
/* div {min-height: 10px} */
p {margin: 0}
h1, h2, h3, h4, h5, h6{ margin: 0}
.clear-left{clear:left}
.clear-right{clear:right}
.ir span {display:block;width:0;height:0;overflow:hidden;font-size:0.5em}

/* for jquery.flash */
.flash-replaced .alt {
				display: block;
				height: 0;
				position: absolute;
				overflow: hidden;
				width: 0;
			}

/* CONDITIONAL BACKGROUND COLORS FOR PAGES */
body.work,
body.work .tease_wrap {background-color:#FFF7F9}

body.blog,
body.blog .tease_wrap {background-color:#f1f7ff}

body.about,
body.about .tease_wrap {background-color:#fbf1ff}

body.store,
body.store .tease_wrap {background-color:#F9EBDE}

abbr{border: 0; font-style: normal}

/* used on comment form. can be applied elsewhere. */
.button{
	font:bold 12px / 1.3 'Arial', sans-serif;
	color:#fff;	
	text-transform:uppercase;
	border-width:8px; 
	border-style: solid;
	text-align:center;
}
/* MAIN WRAP, MINIMUM HEIGHT USED TO FORCE SCROLLBARS */
#content{position: relative; min-height: 1100px;moz-min-height:1100px;margin-bottom:300px}

/* FULL WIDTH ITEMS */
#identity_wrap, #header, #content, #home #directions {width: 909px; margin: auto; clear:both}

/*
 UNCOMMENT FOR TESTING PURPOSES
	#identity_wrap, #content {background:#999}
*/


/* ARMCHAIR NAME, AT TOP OF PAGE */
#identity{height: 225px}

/* LARGE LOGO AND TEXT AT TOP OF PAGE */
#logotype{
	background: url(http://armchair.s3.amazonaws.com/_img/armchair-logotype.png) 0 0 no-repeat;height: 23px;text-indent: -9999px;margin:45px 0 10px 240px;line-height:1.3em;font-size:2em;clear:both}
#logotype a {color:#000}
#logotype a:hover {color:#ff0033}
#logotype sup {font-size:0.7em}

#identity {clear:both;display: block;font: normal 6em;height: 225px;margin: 0;padding:0;vertical-align: bottom;width: 908px;overflow:hidden}
.work #identity {overflow:normal;height:auto}
#identity a.homelink, #mixed_identity_wrap a.homelink {display:block;float:left; width:228px;height:225px}
#identity .project_info {width:228px;float:left}
#identity .project_info a.homelink {margin-bottom:10px}
#identity h2 {margin:15px 0 0 228px;width:500px}	
#identity p.subtitle {margin-left:228px;font-size: 1em}

#home #identity a.homelink, 
#work #identity a.homelink,
#work #mixed_identity_wrap a.homelink {background: url(http://armchair.s3.amazonaws.com/_img/chairlogo-red.png) 0 0 no-repeat;height: 225px}

#blog #identity a.homelink,
#blog #mixed_identity_wrap a.homelink {background: url(http://armchair.s3.amazonaws.com/_img/chairlogo-green.png) 0 0 no-repeat;height: 225px}

#about #identity a.homelink,
#about #mixed_identity_wrap a.homelink {background: url(http://armchair.s3.amazonaws.com/_img/chairlogo-purple.png) 0 0 no-repeat;height: 225px}

#store #identity a.homelink,
#store #mixed_identity_wrap a.homelink {background: url(http://armchair.s3.amazonaws.com/_img/chairlogo-orange.png) 0 0 no-repeat;height: 225px}


body #content #identity a:hover,
body #content #mixed_identity_wrap a:hover{background-position:0 100%}

#home #identity_wrap #identity h2{
	background: url(http://armchair.s3.amazonaws.com/_img/everything.gif) 11px 18px no-repeat; 
	height: 157px; 
	text-indent: -9999px; 			
}
#home #identity_wrap #identity p.subtitle{
	background: url(http://armchair.s3.amazonaws.com/_img/interacts.gif) 228px 5px no-repeat;
	height: 50px;
	text-indent: -9999px; 
}

/* archive pages */
.navigation a:link{color:#444}
.navigation a:visited{color:#999}

/* Non SiFR styles for homepage and other index pages */
#work .tease_title a:link, #work .tease_title a:visited{color:#f03}
#blog .tease_title a:link, #blog .tease_title a:visited{color: #257A86}
#about .tease_title a:link, #about .tease_title a:visited{color: #564779}
#home .tease_title a:link, #home .tease_title a:visited{color: #f03}


/* NEW NAVIGATION */
#nav{float:right;width:225px;list-style-type: none}
#nav li{padding:0;margin:0}
#nav a{	
	background-image: url(http://armchair.s3.amazonaws.com/_img/nav-with-store.gif); 
	background-repeat: no-repeat;
	display:block; 
	height: 20px;
	margin:0; 
	text-indent: -9999px; 
	padding:0; 
	width: 60px;
}
#nav #nav_blog a:link, #nav #nav_blog a:visited{background-position:0px -4px}
#nav #nav_work a:link, #nav #nav_work a:visited{background-position:0px -24px}
#nav #nav_about a:link, #nav #nav_about a:visited{background-position:0px -44px}
#nav #nav_store a:link, #nav #nav_store a:visited{background-position:0px -64px}
#nav #nav_blog a:hover{background-position:-60px -4px}
#nav #nav_work a:hover{background-position:-60px -24px}
#nav #nav_about a:hover{background-position:-60px -44px}
#nav #nav_store a:hover{background-position:-60px -64px}
		
/* on the work page */
#work #nav #nav_blog a:link, #work #nav #nav_blog a:visited{background-position:-120px -4px}
#work #nav #nav_about a:link, #work #nav #nav_about a:visited{background-position:-120px -44px}
#work #nav #nav_store a:link, #work #nav #nav_store a:visited{background-position:-120px -64px}
#work #nav #nav_blog a:hover{background-position:-60px -4px}
#work #nav #nav_work a:hover{background-position:-60px -24px}
#work #nav #nav_about a:hover{background-position:-60px -44px}
#work #nav #nav_store a:hover{background-position:-60px -64px}
		
/* on the blog page */
#blog #nav #nav_work a:link, #blog #nav #nav_work a:visited{background-position:-120px -24px}
#blog #nav #nav_about a:link,#blog #nav #nav_about a:visited{background-position:-120px -44px}
#blog #nav #nav_store a:link,#blog #nav #nav_store a:visited{background-position:-120px -64px}
#blog #nav #nav_blog a:hover{background-position:-60px -4px}
#blog #nav #nav_work a:hover{background-position:-60px -24px}
#blog #nav #nav_about a:hover{background-position:-60px -44px}
#blog #nav #nav_store a:hover{background-position:-60px -64px}
		
/* on the about page */
#about #nav #nav_blog a:link, #about #nav #nav_blog a:visited{background-position:-120px -4px}
#about #nav #nav_work a:link, #about #nav #nav_work a:visited{background-position:-120px -24px}
#about #nav #nav_store a:link,#about #nav #nav_store a:visited{background-position:-120px -64px}
#about #nav #nav_blog a:hover{background-position:-60px -4px}
#about #nav #nav_work a:hover{background-position:-60px -24px}
#about #nav #nav_about a:hover{background-position:-60px -44px}
#about #nav #nav_store a:hover{background-position:-60px -64px}

/* on the store page */
#store #nav #nav_blog a:link, #store #nav #nav_blog a:visited{background-position:-120px -4px}
#store #nav #nav_work a:link, #store #nav #nav_work a:visited{background-position:-120px -24px}
#store #nav #nav_about a:link,#store #nav #nav_about a:visited{background-position:-120px -44px}
#store #nav #nav_blog a:hover{background-position:-60px -4px}
#store #nav #nav_work a:hover{background-position:-60px -24px}
#store #nav #nav_about a:hover{background-position:-60px -44px}


/* FOOTER */
#footer{clear: both; position: absolute; bottom: 0}
#inner-copyright{width: 211px; color: #666}
#footer li{display: inline; text-decoration: none}

.row, .row_not_rollover {position:relative;width:100%;clear:both;padding-top:3px;height:225px;overflow:hidden}

.link_wrap_a {width:681px;height:225px;margin:0 0 0 228px;padding:0;position:relative}
.link_wrap_b {float:left;width:453px;height:225px;margin:0;padding:0;position:relative;overflow:hidden}
.link_wrap_c {float:left;width:453px;height:225px;margin:0 0 0 3px;padding:0;position:relative;overflow:hidden}
.link_wrap_d {width:453px;height:225px;margin:0 0 0 228px;padding:0;position:relative;overflow:hidden}
.link_wrap_e {float:left;width:453px;height:225px;margin:0;padding:0;position:relative;overflow:hidden}
.link_wrap_f {float:left;width:453px;height:225px;margin:0 0 0 3px;padding:0;position:relative;overflow:hidden}
.link_wrap_g {width:453px;height:225px;margin:0 0 0 228px;padding:0;position:relative;overflow:hidden}
.link_wrap_h {width:453px;height:225px;margin:0;padding:0;position:relative;overflow:hidden}
.link_wrap_i {width:453px;height:225px;margin:0 0 0 228px;padding:0;position:relative;overflow:hidden}
.link_wrap_header {width:680px;height:225px;margin:0 0 0 0;padding:0;position:relative;overflow:hidden}

.link_wrap_a a,
.link_wrap_b a,
.link_wrap_c a,
.link_wrap_d a,
.link_wrap_e a,
.link_wrap_f a,
.link_wrap_g a,
.link_wrap_header a,
.videobox {width:453px;height:225px;display:block;margin:0;padding:0} 
.videobox {position:absolute;z-index:3000}

.tease_wrap, .directions_wrap {position:absolute;z-index:2000;right:0;width:228px;height:225px}

.tease, .address, .copyright {position:relative;width:225px;height:225px}
.tease .tease_txt, .copyright p {position:absolute;top:70px;left:8px;margin:0;padding:0;width:220px}
.address p  {position:absolute;top:8px;left:8px;margin:0;padding:0;width:220px}
.tease_txt .tease_intro {font-family:helvetica, arial, sans-serif;font-size:1.1em;padding-right:8px}
.ttwork .tease_txt .tease_intro {color:#ff0033}
.ttabout .tease_txt .tease_intro, .ttabout .teaselink  {color:#564779}
.ttblog .tease_txt .tease_intro {color:#257A86}
.tease .teaselink {background:none;width:200px;height:2em;display:inline}

/* items with images to the right -- floating image in case it's not wide enough */
.link_wrap_d a img,
.link_wrap_c a img,
.link_wrap_e a img,
.link_wrap_f a img {float:right}

/* items with images to the right -- adjustment of the text block */
.link_wrap_c .tease_wrap{left:0}

/* .link_wrap_c .tease_wrap,
.link_wrap_d .tease_wrap, 
.link_wrap_e .tease_wrap,
.link_wrap_f .tease_wrap{left:0}*/ 

.link_wrap_c .tease p.tease_txt,
.link_wrap_d .tease p.tease_txt,
.link_wrap_e .tease p.tease_txt,
.link_wrap_f .tease p.tease_txt {text-align:right;padding:0;width:220px}

/* little color blocks that sit on top of tease link images, and associate it with the text and category */
/* NOTE: ttypes are also used to indicate the color to be used for text color */
.tease_type {position:absolute;z-index:3000;width:20px;height:20px;background-color:#ccc;margin:0;padding:0}
p.ttwork {background-color:#ff0033}
p.ttblog {background-color:#257A86}
p.ttabout {background-color:#564779}

.ttwork .tease_title{color:#ff0033}
.ttblog .tease_title{color:#257A86}
.ttabout .tease_title{color:#564779}

p.tease_title{font-size: 2.1em; letter-spacing:-.05em}
p.tease_title a:hover{color: #ccc}

/* these numbers align the square as needed based on the tease type, 20px is removed because that's the width of the square */
.link_wrap_a .tease_type,
.link_wrap_header .tease_type {left:432px;bottom:0}

.link_wrap_g .tease_type,
.link_wrap_d .tease_type,
.link_wrap_e .tease_type,
.link_wrap_b .tease_type,
.link_wrap_f .tease_type {left:205px;bottom:0}

.link_wrap_c .tease_type
 {right:205px;bottom:0}

/* foooter styles */
.address a, .address {color:#f03}
.address a:hover {color:#000}
.copyright {background:#f03;color:#fff}

/* post pages */
.post-wrap {margin:3px 0 0 228px;width:681px;font-family:helvetica, arial, sans-serif}
.post-wrap a {font-weight:normal}
.post-wrap p {font-size:1.3em;line-height:1.3em}
.post-meta {width:225px;float:right}
.post-meta div{font-size: 1.2em}
.post-text, .post-comments {width:453px}
.post-comments {margin-top:8em}
.post-text p {margin-bottom:1em}

#deskof, p.blog-posted-on{font-size:10px; color: #A6C0D1;padding-top:3px}
.blog-posted-by span{display:block}

#comments-nav a{font-weight:bold; font-size: 11px; text-transform:uppercase; }

#commentadd{
	background: url(http://armchair.s3.amazonaws.com/_img/add.gif) top center no-repeat;
	display:block;
	width:75px;
	height:80px;
	padding-top:80px;
	white-space:nowrap;
	float:left;
}
.postnav a{
	float:right;
	width:80px;
	height:80px;
	padding-top:80px;
	white-space:nowrap;
	background-image: url(http://armchair.s3.amazonaws.com/_img/nav-arrows.gif);
	background-repeat: no-repeat;
	display:block;
	text-align:center;
}
#nxtpost a{	background-position: -85px 0}
#prevpost a{background-position: 5px 0}


#comment{width:453px; height:145px; font: normal 14px / 1.1 arial,helvetica,sans-serif} /* comment form textarea */
.post-text h1 {margin:0.5em 0 0.2em 0;font-size:50px;font-weight:normal;}
.post-text h3 {font-size:2em;line-height:1.3em}

.comments-title {margin:0.5em 0;font-size:3em}
.comments-list {margin:1em 0 5em 0}
.comment-individual p {text-indent:1.5em}
.comments-list .single_comment {margin:0em}

.comments-list .single_comment cite {font-style:normal}
.comments-list .single_comment .comment-info{font-size:1.2em; margin:0}

.work .post-wrap, .work .post-wrap a {color: #ff0033}
.blog .post-wrap {color:#257A86}
.about .post-wrap, .about .post-wrap a {color:#564779}
.store .post-wrap {color:#DC8236}

.work .post-wrap a, .about .post-wrap a, .blog .post-wrap a, .store .post-wrap a {color:#333}
.post-wrap a:visited {color:#999}
.post-wrap a:hover {color:#666}

.comment-form-entry{ margin-top:16px; width: 460px}
.comment-form-entry label {display:block}
.comment-form-entry * {vertical-align:middle}
.comment_text {background-color:#D2E4ED; padding:8px 35px 8px 16px; color:#1F6673; text-shadow: 1px 1px 0px #fff}

.commentsmsg, #comments-rsslink{margin: 16px 0 0 16px}
.comment-info{
	background: url(http://armchair.s3.amazonaws.com/_img/commenttip.gif) -1px top no-repeat;
	padding: 23px 0 27px 16px;
}
#commentformwrapper{clear:both}
#commentform #commentwrap{
	background: url(http://armchair.s3.amazonaws.com/_img/commenttip.gif) -1px bottom no-repeat;
	padding-bottom:13px;
}
.commentdate{
	font-style:normal;
	color:#A6C0D1;
	font-size:11px;
	display:block;
	float:right;
}


.commentfield, .comment_text{border: 1px solid #A7C1D1}
input.commentfield{font: normal 14px / 1.1 arial,helvetica,sans-serif; width:225px; height:28px}
input.commentfield,
.comment-form-entry label,
.comment-form-entry .button,
.comment-restrictions{ margin-left:16px}
.comment-form-entry .button{background:#1E7983; border-color: #1E7983}

.post-meta .authorimg{width:50px; float:left; margin-right: 8px}

/* Work pages */
.work .post-wrap {margin:3px 0 0 0;width:908px;position:relative}
.portfolio_text {width:430px;position:absolute;right:0}
.portfolio_images {width:450px;margin:0;padding:0;list-style-type:none}
.portfolio_images li {float:left;padding:0;margin:0}
.portfolio_images li img {margin:0 0 2px 0;padding:0;float:left}
.portfolio_images li.addmargin img {margin-right:2px}
.portfolio_text p {margin-bottom:1em}

.portfolio_info{color: #f03; font-size: 1.6em;}
.portfolio_info a:link, .portfolio_info a:visited{color: #333;}



/* About section */
.tease_intro a.aboutinfolink {display:inline;color:#333;background:none}
.tease_intro a.aboutinfolink:visited {color:#999}
.tease_intro a.aboutinfolink:hover {color:#666}
.about .about_info {width:227px;height:225px;font-size:1.1em;line-height:1.4em}
.about .about_info .vcard {padding:12px 10px}
#about #content .post-wrap,
#store #content .post-wrap {margin:3px 0 0 0;width:902px;position:relative;padding:0}
.about .portfolio_images,
.store .portfolio_images {width:452px}
#about .post-wrap .portfolio_text,
#store .post-wrap .portfolio_text {right:0}
.tel {padding-top:1em}
.fax {padding-bottom:1em}
#thePeople {clear:both;padding-top:70px}
p#thePeopleLeft {width:400px;float:left}
p#thePeopleRight {width:440px;margin-left:450px}
#thePeople h3.aboutHeadline {font-size:3em;margin-bottom:10px}
#thePeopleGrid {clear:both;padding-top:70px;width:900px}
.person, .personRight {width:450px;float:left}
.person img {width:225px;float:left}
.personRight img {width:225px;float:right}
.personInfo {padding:10px;margin-left:225px}
.personRight .personInfo {margin:0 225px 0 0}
.personInfo h3 {font-size:1.5em;line-height:1.1em;padding-bottom:1em}
.personInfo p {font-size:1.1em}
#about #peopleSeeMore {padding-top:40px;font-size:1.5em;font-weight:bold}
#about #peopleSeeMore a {color:#333}
#sfForm {font-size:1.3em}
#sfForm label {width:120px;display:block;float:left;padding:3px}
#sfForm input, #sfForm textarea {width:285px;margin-bottom:10px;border:0;padding:3px;color:#564779;font-size:1em}
#sfForm textarea {height:125px;width:285px}
#sfForm #submitButton {margin-left:126px;background:#564779;color:#fff;width:290px;padding:3px 5px}
#sfForm #submitButton:hover {background-color:#333}

/* footer with logo on about page */
#armchair-footer {margin-top:50px}
#armchair-footer a {float:left;display:block;width:90px}
#armchair-footer span {font-size:1.1em;color:#564779;display:block;margin:0 0 0 90px;padding:2px 0 0 0}
	
.tease_title{ /* height: 100px; */ width:210px; margin-bottom:.1em}
	
.tease_title > a{display:table-cell; height: 3em; line-height:.5; vertical-align:bottom; width:210px}
.tease .tease_txt{position:absolute;top:70px;left:8px;margin:0;padding:0;width:220px}
.tease .teaselink {background:none;width:200px;height:2em;display:inline}
	
/* Non SiFR styles for homepage and other index pages */
#home .ttabout .tease_txt p.tease_title a:link, #home .ttabout .tease_txt p.tease_title a:visited{color:#564779}
#home .ttblog  .tease_txt p.tease_title a:link, #home .ttblog  .tease_txt p.tease_title a:visited{color:#257A86}
#home .ttblog  .tease_txt p.tease_title a:hover{color:#666}
#home .ttwork  .tease_txt p.tease_title a:hover{color:#666}

/* WordPress captions */
.wp-caption-text{font-size: .8em; font-style: italic; opacity:.8;}