/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 - modified */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {line-height: 1;}
blockquote, q {quotes: none;}
blockquote:before, q:before {content: ""; content:no-open-quote;}
blockquote:after, q:after {content: ""; content:no-close-quote;}
:focus {outline: 0;}/* remember to define focus styles! */
ins {text-decoration: none;}/* remember to highlight inserts somehow! */
del {text-decoration: line-through;}
table {/* tables still need 'cellspacing="0"' in the markup */
	border-collapse: collapse;
	border-spacing: 0;
}
/*end reset
****************************************/

/* @license
 * MyFonts Webfont Build ID 2440129, 2013-01-02T06:41:09-0500
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Forgotten Futurist by Typodermic
 * URL: http://www.myfonts.com/fonts/typodermic/forgotten-futurist/regular/
 * Copyright: (c) 1999-2012 Typodermic Fonts Inc. See attached license agreement. If agreement is missing visit typodermicfonts.com for more info. Accents by Chikako Larabie.
 * Licensed pageviews: Unlimited
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2440129
 * 
 * © 2013 Bitstream Inc
*/
 
@font-face {font-family: 'ForgottenFuturistRg-Regular';src: url('/webfonts/253BC1_0_0.eot');src: url('/webfonts/253BC1_0_0.eot?#iefix') format('embedded-opentype'),url('/webfonts/253BC1_0_0.woff') format('woff'),url('/webfonts/253BC1_0_0.ttf') format('truetype');}
p.ff {
	font-family: ForgottenFuturistRg-Regular;
	font-weight: normal;
	font-style: normal;
	font-size:16px;
}
body {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:18px;
	color:#000;
	background-color:#fff;
	text-align:center;
	}
/*typography
****************************************/
a {
	text-decoration: underline;
	font-weight: normal;
	color: #666;
	}
a:link {
	}
a:visited {
	}
a:active {
	}
a:hover {
	color: #eb2980;/*pink*/
	}
h1,h2,h3,h4,h5,h6 {
	font-family: ForgottenFuturistRg-Regular;
	font-weight: normal;
	font-style: normal;
	margin: 0 0 12px;
	color:#666;
	}
h1 {
	font-size:24px;
	clear:both;
	margin:24px 0;
	line-height:1.2em;
	}
h2 {
	font-size: 24px;
	}
h3 {
	font-size: 20px;
	}
h4 {
	font-size: 1.0em;
	}
h5 {
	font-size: 1.0em;
	}
h6 {
	font-size: 1.0em;
	}
ol, ul, li {
	font-size: 1.0em;
	line-height: 1.8em;
	margin-top: 0.2em;
	margin-bottom: 0.1em;
	margin-left:0;
	padding-left:0; 
	}
ol, ul {
	margin-bottom: 1.2em;
	margin-left:1.5em; 
	}
p {
	font-size: 1.0em;
	line-height: 1.8em;
	margin: 0 0 12px;
	}
li > p {/*for any p that is a child of li*/
	margin-top: 0.2em;
	}
strong, b {
	font-weight: bold;
	color:#333;
	}
/*images
****************************************/
.imgfit {
	max-width:100%;
	height:auto;
}
.imgbio {
	border:1px solid #666;
	}
.hero {
	max-width:100%;
	height:auto;
	border:1px solid #aaa;
	padding:12px;
	}
@media (max-width: 750px) {
.hero {
	max-width:95%;
}
}

/*containers
****************************************/
#wrap {
	max-width:960px;
	margin:0 auto;
	text-align:left;
	display:block;
	padding:44px 18px 18px;
}
@media (max-width: 400px) {
#wrap {
	padding:0 14px 18px;
}
}

.box {
	border:1px solid #aaa;
	padding:18px;
}
.boxtext, .bio {/*for boxes with a paragraph at the bottom*/
	border:1px solid #aaa;
	padding:12px 18px 0;
	margin:18px 0;
}
#logo {
	width:100%;
	padding:18px 0 12px 0;
	border:1px solid #aaa;
	text-align:center;
}
@media (max-width: 569px) {
#logo {
	padding:12px 0 8px;
}
}

/*profile
****************************************/
.bio {
	margin:0 0 18px 245px;
}
.imgbio {
	float:left;
	margin:0;
	}

@media (max-width: 750px) {
.imgbio {
	margin:18px 18px 14px 18px;
	}
.bio {
	margin:0 0 18px;
}
}
@media (max-width: 500px) {
.imgbio {
	float:none;
	margin:0;
	}
.bio {
	margin:18px 0;
}
}

/*hmpg
****************************************/
#content {
	float:left;
	width:69%;
	margin-top:24px;
	}
#side {
    float:right;
	width:26%;
	margin-top:24px;
	}
#side p {
	line-height:1.3em;
	}
.sidebox {
	border:1px solid #aaa;
	padding:12px 12px 0;
	min-height:215px;
}
.headshot {
	width:100%;
	text-align:center;
	font-size: 13px;
	margin:0 0 24px 0;
}

@media (max-width: 750px) {
  #content, #side {
	width:100%;
	float:none;
	}
.headshot {
	float:right;
	width:175px;
	margin:0 0 12px 12px;
}
}
@media (max-width: 350px) {
.headshot {
	float:none;
	width:225px;
	clear:both;
	margin:0 0 12px 0;
}
}

/*portfolio
****************************************/
.wrapper {
	text-align:center;
	padding-right: 18px;
}
.folio {
	position:relative;
	width:80%;
	text-align:center;
	margin:0 auto 24px;
}
.folio img {
	max-width:100%;
	height:auto;
	border:1px solid #aaa;
	padding:12px;
	margin-bottom:6px;
}
.pag-prev, .pag-next {
	position:absolute;
	top: 44%;
}
.pag-prev {
	left: -30px;
}
.pag-next {
	right: -54px;
}
@media (min-width: 590px) {
.wrapper {
	padding-right:0;
}
.folio {
	width:100%;
}
.pag-prev {
	left: 12px;
}
.pag-next {
	right: 12px;
}
}
@media (min-width: 750px) {
.pag-prev {
	left: 75px;
}
.pag-next {
	right: 75px;
}
}
@media (min-width: 925px) {
.pag-prev {
	left: 150px;
}
.pag-next {
	right: 150px;
}
}
.pag-prev a, .pag-next a {
	width:18px;
	height:39px;
	display:block;
	background:url(/img/sprite-prev-nxt.png) no-repeat 0 0;
	text-indent:-5000px;
}
.pag-next a {
	background-position:left bottom;
}

/*press list view
****************************************/
.pressthm {
	float:left;
	width:23%;
	margin:0 1% 12px;
}
.pressthm img {
	max-width:100%;
	height:auto;
}
@media (max-width: 740px) {
.pressthm {
	width:31%;
}
}
@media (max-width: 600px) {
.pressthm {
	width:48%;
}
}
@media (max-width: 400px) {
.pressthm {
	float:none;
	width:100%;
	margin:0 0 12px;
}
}
/*press detail view
****************************************/
.cover {
	float:right;
	width:288px;
}
.pgs {
	margin-top:24px;
	width:63%;
}
.cover img, .pgs img {
	max-width:100%;
	height:auto;
	border:1px solid #aaa;
	padding:12px;
}
.cover img {
	max-width:90%;
}
.prevnxt {
	width:100%;
	height:16px;
	margin-bottom:28px;
}
.prev {
	float:left;
	width:48%;
}
.nxt {
	float:right;
	width:48%;
	text-align:right;
}
@media (max-width: 950px) {
.cover {
	width:30%;
}
.pgs {
	width:63%;
}
}
@media (max-width: 730px) {
.cover {
	float:none;
	width:100%;
}
.pgs img, .cover img {
	max-width:95%;
}
.pgs {
	width:100%;
}
}

/*nav
****************************************/
#menu {
	position:fixed;
	top:0;
	right:18px;
	width:100%;
	padding:2px 0 6px;
	background-color:#fff;
	text-align:right;
	font-size:12px;
}
ul#nav {
  list-style:none;
	margin:0;
	padding:0;
	width:100%;
	}
ul#nav li {
  display:inline;
	border-top:3px solid #eb2980;/*pink*/
	}
ul#nav li.turq {
  border-top:3px solid #038daa;/*turquoise*/
	}
ul#nav li.green {
  border-top:3px solid #c9e054;/*spring green*/
	}
ul#nav li.fbk {
  border-top:none;
	}
.fbk img {
  x-margin-top:4px;
	}
ul#nav a {
	padding:4px 10px;
    text-decoration: none;
	color: #9b9b9b;
	font-weight: bold;
	display:inline-block;
	}
ul#nav li a:hover {
	color: #000;
	}
#navbar.pg-home a#home, #navbar.pg-capabilities a#capabilities, #navbar.pg-clients a#clients, #navbar.pg-about a#about, #navbar.pg-contact a#contact {
  color: #00f;/*blue*/
	text-decoration:none;
    }

@media (max-width: 400px) {
#menu {
	position:static;
	top:auto;
	right:auto;
	padding:2px 0 6px;
	text-align:left;
	font-size:14px;
}
ul#nav a {
	padding:4px 18px 18px;
	}
}
		
/*footer
****************************************/
#footer {
  clear:both;
	margin:0 0 2em;
	padding-top:12px;
	}
#footer p {
  clear:both;
	font-size: 10px;
	color:#999;
	}
#footer a {
	color:#999;
	text-decoration:none;
	}
#footer a:hover {
	color: #eb2980;/*pink*/
	}

/*misc
****************************************/
.clr {clear:both;}
/* clearfix for modern browsers -- the class is applied to the parent element containing the floated items */
.cf:before,
.cf:after {
    content:"";
    display:table;
}
.cf:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.cf {
    *zoom:1;
}
.center {text-align:center;}

/*tempory - delete later
****************************************/
.blog-container, .post-list, .side-panel {
	text-align:left;
}