/*
 *
 * Inkreel.core
 *
 */
html {
 overflow-y: scroll; /* force vertical scrollbar - prevents animation stutter */
 /* overflow-x: hidden; */ /* hide horizontal scrollbar */
}
body {
 margin: 0;
 background: #1d1d1d url(../images/bg.jpg) center top repeat;
}
#content {
 margin: 0 auto;
 /*position: relative;*/ /* for sliding animation */
}
.container {
 width: 940px;
 padding: 0 20px; /* adds up to 980px */
 margin: 0 auto;
 overflow: auto; /* clear floats */
}
.hr {
 width: 980px;
 height: 1px;
 overflow: hidden; /* for IE6 */
 background-color: #333;
 margin: 19px auto;
}
.last.hr {
 background-color: #2f2f2f;
}
img {
 border: 0;
}
#loading {
 position: absolute;
 display: none;
 height: 16px;
 width: 16px;
 background: url(../images/lightbox/loading.gif) left top no-repeat;
}
#still-loading {
 color: #999;
 position: absolute;
 left: 50%;
 text-align: center;
}
#still-loading p {
 position: relative;
 margin-top: 30px;
 right: 50%;
}

/*-----text and headings-----*/
body, input, textarea, blockquote .author {
 font-family: sans-serif;
 color: #bbb;
 font-size: 10.5pt;
}
textarea {
 overflow: auto; /* remove scrollbar in IE6 */
}
h1, h2, h3, h4, h5 {
 font-size: 100%; /* IE6 changes font sizes */
 margin: 0;
}
p {
 margin: 8pt 0;
}
p, h5, input, textarea, label, blockquote .author, #tooltip {
 font-family: "Segoe UI",sans-serif;
 line-height: 14.25pt; /* unify line heights between fonts, equiv. to 19px */
}
a {
 color: #ddd;
}
a:hover, a.hover {
 color: #fff;
}
p, h5 {
 padding-bottom: 1px; /* render border in IE6 */
}
p a, h5 a {
 text-decoration: none;
 border-bottom: 1px solid #555;
}
p a:hover, p a.hover, h5 a:hover, h5 a.hover {
 border-bottom: 1px solid #fff;
}
h1 a, h2 a, h3 a {
 text-decoration: none;
 /*color: #999;*/
}
h1 a:hover, h2 a:hover, h3 a:hover {
 /*color: #fff;*/
}
h1, h2, h3, .label {
 font-weight: normal;
 font-family: "Kievit Pro","Kievit","Myriad Pro","Myriad","Segoe UI","Lucida Grande","Lucida Sans","Lucida Sans Unicode",sans-serif;
}
h1 {
 font-size: 39px;
}
h2 {
 font-size: 28px;
 font-weight: normal;
}
h3 {
 font-size: 24px;
 text-transform: uppercase;
}
h4 {
 font-size: 20px;
 font-weight: normal;
}
h5 {
 font-weight: normal;
 }
/* IE cufon hacks */
h1 span.cufon {
 * margin-top: 4pt;
 * margin-bottom: -4pt;
}
h2 span.cufon, h3 span.cufon {
 * margin-top: 2pt;
 * margin-bottom: -2pt;
}

/*-----header-----*/
.header {
 background: url(../images/no-repeat.gif) left -397px no-repeat;
 position: relative;
 height: 131px;
 margin: 0 -20px;
}
.hr.first {
 margin-top: 0;
}
a.ink-logo {
 position: absolute;
 left: 8px;
 top: 27px;
 width: 206px;
 height: 76px;
 overflow: hidden;
 text-decoration: none;
 display: block;
}
a.ink-logo:hover, a.hover.ink-logo {
 background: url(../images/no-repeat.gif) left -528px no-repeat;
 outline: none; /* remove focus outline */
}
a.ink-logo span.inner {
 position: relative;
 left: -5000px;
}
.subhead {
 position: absolute;
 top: 85px;
}

/*-----features-----*/
.feature {
 padding-top: 5px;
 padding-bottom: 5px;
}
.feature a span.arrow {
 display: none;
 position: relative; /* for animation */
}
.feature a:hover span.arrow {
 display: inline;
}

/*-----thumbs-----*/
.feature .thumb {
 display: block; 
 background: #222 url(../images/lightbox/loading.gif) center center no-repeat;
 position: relative;
}
.feature .thumb img {
 display: block; /* remove gap below images with strict doctype */
}
.feature .thumb a, .feature .thumb a span.inner {
 background-color: #000;
 display: block;
}

/*-----icons-----*/
.feature .zoom span.icon, .feature .play span.icon {
 position: absolute;
 left: 50%;
 top: 50%;
 display: none;
 cursor: hand;
}
.feature .zoom:hover span.icon, .feature .play:hover span.icon {
 display: block;
}
/*-----zoom-----*/
.feature .zoom span.icon {
 background: transparent url(../images/small-zoom.png) left top no-repeat;
 width: 51px;
 height: 40px;
 margin-left: -25px; /* icon width/2 */
 margin-top: -20px; /* icon height/2 */
}
.feature.case .zoom span.icon {
 background: transparent url(../images/zoom.png) left top no-repeat;
 width: 72px;
 height: 58px;
 margin-left: -36px; /* icon width/2 */
 margin-top: -29px; /* icon height/2 */
}
/*-----play-----*/
.feature .play span.icon {
 background: transparent url(../images/small-play.png) left top no-repeat;
 width: 48px;
 height: 40px;
 margin-left: -24px; /* icon width/2 */
 margin-top: -20px; /* icon height/2 */
}
.feature.case .play span.icon {
 background: transparent url(../images/play.png) left top no-repeat;
 width: 68px;
 height: 58px;
 margin-left: -34px; /* icon width/2 */
 margin-top: -29px; /* icon height/2 */
}

/*
 *
 * buttons
 *
 */
/*-----common-----*/
.button {
 position: relative; /* needed for .button .hover left: 0; */
}
.button span.top { /* for IE6 */
 position: relative; /* bring text to top */
}
.button, .button span.inner, .button span.hover { /* .hover for JS */
 background-image: url(../images/no-repeat.gif);
 background-repeat: no-repeat;
 cursor: hand; /* show hand in IE6 */
 display: block;  /* req'd on both for IE6, req'd on JS for IE8 */
}
.button, .button span.inner {
 background-repeat: no-repeat;
 font-size: 11pt;
 float: left; /* req'd on both inner and outer containers for IE6 */
 clear: both;
 text-decoration: none;
}
.button:focus, .nav a {
 outline: none; /* remove focus outline */
}
.button span.inner {
 padding: 4px 20px 0;
 height: 25px; /* 29px - padding-top */
}
.button span.cufon {
 * margin-top: 1.5pt;
}
.feature .button {
 margin-top: 15px;
}
.feature a img { /* or .feature .thumb a img, .feature a.thumb img */
 opacity: .75;
 filter: alpha(opacity=75);
}
.feature a:hover img { /* was .feature .thumb a:hover img, .feature a.thumb:hover img */
 opacity: 1;
 filter: alpha(opacity=100);
}

/*-----button-----*/
.button {
 background-position: left -228px;
}
.button.unhover { /* for JS */
 background-position: left -228px !important;
}
.button span.inner {
 background-position: right -228px;
}
.button.unhover span.inner { /* for JS */
 background-position: right -228px !important;
}
.button:hover, .button .hover { /* .hover for JS */
 background-position: left -257px;
}
.button .hover { /* for JS */
 position: absolute;
 left: 0;
}
.button:hover span.inner, .button .hover .hover { /* .hover .hover (right) for JS */
 background-position: right -257px;
}
.button .hover .hover { /* for JS */
 width: 50%;
 height: 100%;
 position: static; /* req'd for IE8 */
 float: right;
}
.button:focus {
 /*top: 1px;*/
}
.button:focus span.inner {
 /*padding: 5px 20px 1px;*/
 /*height: 23px;*/ /* 29px - padding-top - padding-bottom */
}
.button:focus span.inner {
 padding: 5px 20px 1px;
 height: 23px;
}
.button:focus .hover {
 background-position: left -286px;
}
.button:focus .hover .hover {
 background-position: right -286px;
}

/*-----nav-----*/
.nav {
 position: absolute;
 right: 20px;
 top: 52px;
}
.nav a {
 float: left;
 display: block;
 text-transform: uppercase;
 color: #ccc;
 margin-left: 43px;
 text-decoration: none;
 overflow: hidden; /* underline bleed */
}
.nav a.active {
 color: #fff;
}
.nav a .inner {
 display: block;
 padding: 10px 2px 0;
 position: relative;
}
.nav a >/**/ .under {
 display: none;
 width: 100%;
 overflow: hidden;
 height: 2px;
 background-color: #444;
 margin-top: 9px;
 position: relative; /* slide */
}
.nav a:hover >/**/ .under {
 display: block;
}
.nav a.active >/**/ .under {
 background-color: #fff;
}
/* IE6,7 */
.nav a {
 * padding-bottom: 8px;
}
html .nav a:hover {
 * border-bottom: 2px solid #444;
}
html .nav a.active:hover {
 * border-color: #fff;
}
.nav .home {
/* display: none;*/
}

/*-----2 col layout-----*/
.left-column, .right-column {
 float: left;
}
.left-column {
 width: 600px;
 margin-right: 60px;
}
.right-column {
 width: 280px; /* 980-(left col width+margin) - hardcoded because of expanding copy */
 overflow: hidden; /* fix me - req'd b/c mini-hr has hardcodeed dimensions - fix mini-hr first */
}

/*
 *
 * homepage
 *
 */
/*-----main-----*/
.feature.main h1, .feature h2 {
 margin-top: -4pt;
}
.feature.main .copy {
 float: left;
}
.feature .thumb, .feature .thumb {
 background-image: url(../images/no-repeat.gif);
 background-repeat: no-repeat;
 background-color: transparent;
}
.feature.main .thumb {
 background-position: left -604px;
 /* margin: -12px -9px -14px -8px;*/ /* original border compensation */
 margin: -6px 16px 0 -8px;
 float: left;
}
.feature.main .thumb a {
 margin: 12px 9px 14px 8px;
}

/*-----projects-----*/
.feature.projects .project {
 float: left;
 width: 216px;
 display: inline;
 margin-right: 25px;
 margin-top: 15px;
}
* html .feature.projects .project { /* IE6 */
 overflow: hidden; /* fix size */
}
.feature.projects #sdpa, .sdpa .feature.projects #denverfamilies, #about .feature.projects #denverfamilies, #contact .feature.projects #denverfamilies { /* was .feature.projects .project.last */
 margin-right: 0;
}
.feature.projects .thumb {
 height: 102px;
 margin: -5px -7px -7px;
 padding: 8px 7px;
 background-position: left -892px;
}
.feature.projects h5 {
 margin-top: 10px;
}
.feature.projects h2.more {
 display: none;
}
#home .feature.projects #sandhill, #about .feature.projects #sdpa, #contact .feature.projects #sdpa,
.sandhill .feature.projects #sandhill, .nbcolympics .feature.projects #nbcolympics, .nbcsports .feature.projects #nbcsports,
.denverfamilies .feature.projects #denverfamilies, .sdpa .feature.projects #sdpa {
 display: none;
}

/*-----input-----*/
fieldset {
 border: 0;
 padding: 0;
 margin: 0;
 display: inline; /* prevent IE6 expansion */
}
input, textarea {
 background-color: #2f2f2f;
 border: 1px solid #2f2f2f;
 color: #999;
 padding: 5px;
}
input.submit {
 padding: 0;
 width: 110px !important;
 height: 31px;
 padding-bottom: 2px;
 margin-top: 10px;
}

/*-----contact-----*/
.feature .contact {
 width: 460px;
 margin-right: 20px;
 float: left;
}
.feature .contact form {
 margin-top: 15px;
}
.feature .contact input, .feature .contact textarea {
 float: left;
 background-repeat: no-repeat;
}
.feature .contact input#name {
 background-image: url(../images/no-repeat.gif);
 background-position: 10px -164px;
 padding-left: 32px;
 width: 168px;
}
.feature .contact input#email {
 background-image: url(../images/no-repeat.gif);
 background-position: 10px -196px;
 padding-left: 40px;
 width: 168px;
 margin-left: 10px;
}
.feature .contact textarea {
 height: 90px;
 margin-top: 10px;
 overflow: hidden;
 width: 420px;
}
input:focus, textarea:focus, input.focus, textarea.focus {
 border: 1px solid #fff;
 background-color: #666;
 color: #fff;
}
.feature .contact input.submit:hover {
 background-color: #666;
 border-color: #fff;
 color: #fff;
 cursor: pointer;
}
.feature .contact .required {
 border: 1px solid #fff;
}
.feature .contact .sending, .feature .contact .thanks {
 margin-top: 15px;
 background-color: #2f2f2f;
 padding: 20px;
 display: none; /* hide until ajax is called */
 width: 410px;
}
.feature .contact .thanks {
 padding: 19px;
 border: 1px solid #666;
}
.feature .contact .error {
 margin-top: 10px;
 padding: 5px 10px;
 border: 1px dashed #333;
 width: 410px;
 margin-bottom: -5px;
 display: none;
}

/*-----rod boev-----*/
.rod-boev {
 float: left;
 width: 220px;
 margin-right: 20px;
}
.map {
 background: url(../images/no-repeat.gif) left -112px no-repeat;
 width: 106px;
 height: 52px;
 margin-top: 1.5em;
}

/*-----resume-----*/
.resume {
 float: left;
 width: 220px;
}
.resume .button {
 margin-top: 5px; /* was 15px */
}

/*-----footer-----*/
.footer {
 padding-bottom: 1.5em;
 text-align: center;
 color: #555;
 font-size: .9em;
}
.footer p {
 margin: 2pt 0;
}
.footer .pipe {
 margin: 0 5px;
 color: #222;
 font-size: 1.2em;
}

/*-----bottom-----*/
html, body {
 height: 100%;
}
body /**/> #wrapper { /* everything but IE6,7 */
 min-height: 100%;
 background-image: url(../images/bg-bottom.png);
 background-position: center bottom;
 background-repeat: repeat-x;
}

/*
 *
 * gallery
 *
 */
/*-----gallery-----*/
.heading {
 margin-bottom: 20px;
 overflow: hidden; /* remove IE8 scrollbar */
}
.feature.mini-slice {
 /*overflow: auto;*/ /* remove scrollbar */
}
.feature.mini-slice .thumb {
 float: left;
 background-position: -230px -892px;
 padding: 7px 8px 7px 5px;
 /* margin: -7px -4px -3px -5px; */ /* -4px right and bottom */
 margin: -7px 8px 9px -5px;
 /*overflow: hidden;*/ /* clip top labels */
}
.feature.mini-slice .thumb.last {
 margin-right: -4px;
}
.feature.mini-slice .thumb a {
 height: 130px;
 width: 301px;
 text-decoration: none;
 /* margin: -7px -8px -7px -5px; */ /* original */
 overflow: hidden;
 display: block;
 position: relative;
}
.feature.mini-slice .thumb a .label {
 position: absolute;
 width: 285px; /* was 100% - hardcoded for frame width */
 height: 18px;
 cursor: pointer; /* IE shows selection or default */
 padding: 4px 8px;
}
.feature.mini-slice .thumb a span.bg.label {
 background-color: #000;
 opacity: .75;
 display: block;
 filter: alpha(opacity=75);
 /* <= IE7 - filter doesn't support 2 opacities but PNG works */
 /* * background: url(../images/black-75.png); */
 /* IE6 - filter doesn't support opacity at the same time */
 /* _background: #000; */
}
.feature .thumb span, .feature .thumb a div {
 z-index: 1; /* needed for labels on FF */
}
.feature.mini-slice .thumb a .label.bottom {
 bottom: 0;
}
.feature.mini-slice h5 {
 margin-top: 10px;
}

/*
 *
 * case studies
 *
 */
/*-----case studies-----*/
.subpage .heading h2, .subpage .heading h3, .subpage .case h4, .subpage .right-column h4 {
 color: #d8d8d8;
}
#case-study h3 {
 font-size: 20px;
}
.feature.case .left {
 float: left;
 margin-right: 25px;
}
.feature.case .thumb {
 width: 530px;
 /*margin: -9px -9px -9px -8px;*/
 margin: -9px -9px 0 -8px;
 padding: 9px 9px 0 8px;
 background-position: left -1036px;
}
.feature.case .thumb a {
 background-image: url(../images/no-repeat.gif);
 background-repeat: no-repeat;
 background-color: transparent;
 background-position: left bottom;
 margin: 0 -9px -4px -8px;
 padding: 0 9px 9px 8px;
}
.feature.case div.right {
 float: left;
 width: 385px; /* fixme - hardcoded width */
}
#case-study div.right p {
 margin-top: .5em;
 margin-bottom: 1.25em;
}
#case-study div.right p.last {
 margin-bottom: 0;
}
.feature.case .slides {
 display: none;
 background: #000;
 padding: 0px 5px 5px;
 overflow: auto; /* clear floats */
}
.feature.case .slides a {
 font-size: 10pt;
 text-decoration: none;
 display: block;
 float: left;
 background-color: #333;
 padding: 5px 12px 6px;
 margin-right: 10px;
}

/*-----more-----*/
.container div.more {
 overflow: hidden; /* clear floats */
 margin-top: 30px;
 margin-bottom: 10px;
 float: right;
}
.container div.more .button {
 clear: none;
 margin-right: 10px;
}

/*-----more projects------*/
#case-study .projects .project p, #case-study .projects .project h5 {
 display: none;
}
#case-study .projects .project {
 padding-bottom: 7px; /* padding works in IE - at least 7px required for FF not to overflow*/
}
#case-study .projects h2 {
 display: none;
}
#case-study .projects h2.more {
 display: block;
}

/*
 *
 * contact
 *
 */
#contact .left-column fieldset {
 padding: 15px 25px;
 background-color: #161616;
}
#contact .left-column label {
 display: block;
 margin-bottom: 5px;
}
#contact .left-column input, #contact .left-column textarea {
 display: block;
 width: 485px;
 font-size: 12pt;
 margin-bottom: 24px;
}
#contact .left-column {
 padding-bottom: 10px;
}
#contact .contact, #contact .hr.before-contact {
 display: none;
}

/*
 *
 * about
 *
 */
/*-----quote-----*/
blockquote {
 background: url(../images/no-repeat.gif) -200px -112px no-repeat;
 margin: 0;
 margin-top: 40px;
 margin-bottom: 30px;
 margin-left: 20px;
 padding-left: 40px;
 width: 500px;
 color: #999;
 display: block;
}
blockquote p {
 font-family: Georgia,Times,serif;
 font-style: italic;
 font-size: 10.5pt;
 line-height: 1.8em;
 margin-top: 0; /* IE won't overlap margins across block level elements */
}
blockquote .author {
 font-style: normal;
 font-size: 9.5pt;
 line-height: 15pt;
}
#about .heading {
 margin-bottom: 10px; /* pull up content */
}
.linkedin-logo {
 display: block;
 width: 82px;
 height: 23px;
 background: url(../images/no-repeat.gif) -280px top no-repeat;
 margin-bottom: 11.5pt;
}
.replace span { /* image replacement */
 position: absolute;
 left: -9999px;
}
.right-column .blurb {
 overflow: hidden; /* scrollbar on button press */
 margin: 8pt 0;
}

/*
 *
 * shadowbox
 *
 */
/*-----container, overlay, & wrapper-----*/
#sb-container, #sb-wrapper {
  text-align: left; /* reset left alignment */
}
#sb-container, #sb-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /*margin: 0;
  padding: 0;*/
}
#sb-container {
  height: 100%;
  display: none;
  visibility: hidden;
  z-index: 100;
}
body > #sb-container {
  position: fixed; /* use position:fixed in modern browsers */
}
#sb-overlay {
  * height: expression(document.documentElement.clientHeight + 'px'); /* needed in IE6 where sb-container uses position:absolute */
  cursor: pointer;
}
#sb-container > #sb-overlay {
  /* use for sb-container position:fixed */
  height: 100%;
}

/*-----wrapper-----*/
#sb-wrapper {
  position: relative;
}
#sb-wrapper img {
  /*border: none;*/
}

/*-----body-----*/
#sb-body {
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 10px solid #000;
  border-bottom: 0;
}
#sb-body-inner {
  position: relative;
  height: 100%;
}
#sb-content.html {
  height: 100%;
  overflow: auto; /* make html content scrollable */
}

/*-----loading-----*/
#sb-loading {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  padding-top: 10px;
  background: url(../images/lightbox/loading.gif) center center no-repeat;
}
#sb-body, #sb-loading {
  background-color: #000; /* should match loading image background color */
}

/*-----title & info-----*/
#sb-title, #sb-info {
  position: relative;
  margin: 0; /* these must have no vertical margin or padding */
  padding: 0;
  overflow: hidden;
  background-color: #000;
}
#sb-title-inner, #sb-info-inner {
  position: relative;
  font-family: 'Lucida Grande', Tahoma, sans-serif;
  line-height: 16px;
}
#sb-title, #sb-title-inner {
  height: 26px;
}
#sb-title-inner {
  font-size: 16px;
  padding: 5px 0;
  color: #fff;
}
#sb-info, #sb-info-inner {
  height: 35px;
}
#sb-info-inner {
  font-size: 12px;
  color: #fff;
}

/*-----nav-----*/
#sb-nav {
  float: right;
  height: 16px;
  width: 45%;
}
#sb-nav a {
  display: block;
  float: right;
  height: 16px;
  width: 16px;
  margin-left: 3px;
  cursor: pointer;
}
a#sb-nav-close {
  background: url(../images/lightbox/close.gif) center center no-repeat;
  height: 19px;
  width: 66px;
  display: block;
  padding: 10px 15px 5px
}
/*#sb-nav-next {
  background-image: url(../images/lightbox/next.png);
  background-repeat: no-repeat;
}
#sb-nav-previous {
  background-image: url(../images/lightbox/previous.png);
  background-repeat: no-repeat;
}
#sb-nav-play {
  background-image: url(../images/lightbox/play.png);
  background-repeat: no-repeat;
}
#sb-nav-pause {
  background-image: url(../images/lightbox/pause.png);
  background-repeat: no-repeat;
}*/

/*-----counter-----*/
#sb-counter {
 display: none;
}
/*#sb-counter {
  float: left;
  padding: 2px 0;
  width: 45%;
}
#sb-counter a {
  padding: 0 4px 0 0;
  text-decoration: none;
  cursor: pointer;
  color: #fff;
}
#sb-counter a.sb-counter-current {
  text-decoration: underline;
}*/

/*-----messages-----*/
div.sb-message {
 display: none;
}
/*div.sb-message {
  font-family: 'Lucida Grande', Tahoma, sans-serif;
  font-size: 12px;
  padding: 10px;
  text-align: center;
}
div.sb-message a:link, div.sb-message a:visited {
  color: #fff;
  text-decoration: underline;
}*/

/*
 *
 * tooltip
 *
 */
#tooltip {
 position: absolute;
 /*z-index: 150;*/
 border-width: 1px;
 border-style: solid;
 border-color: #666 #4a4a4a #4a4a4a #666;
 background-color: #3a3a3a;
 color: #fff;
 padding: 5px 9px;
 font-style: italic;
 /*opacity: .75;*/
}
/*#tooltip h3, #tooltip div {
 margin: 0;
}*/
#tooltip .title {
 font-style: normal;
}