/*
 *  generic primary stylesheet
 *  CS:JD  2007-04-12
 */

/* normalize basic styles */
html, body, div, span, applet, object, iframe,
blockquote, li,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0; 
  padding: 0; 
}
h1,h2,h3 { margin: 1em 0 0.6em 0; padding: 0; }
h4,h5,h6,ul,ol,dl,dt,dd,pre,p,form { margin: 0.8em 0; padding: 0; }
ul, ol { padding-left: 2em; }
pre { font: 100% "Courier New", Courier, monospace; }

h1 { font-size: 29px; line-height: 32px; }
h2 {
  color: #d9531e;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
}
h3 {
  color: #f58426;
  font-size: 13px;
  line-height: 1;
  margin-bottom: 0;
}
h4, h5, h6 { font-size: 100%; }

body { font: 13px/1.31 Arial, Helvetica, sans-serif; color: #464647; }
a { color: #000; }
a img { border: none; }
.menu { padding-left: 0; list-style: none; }

fieldset { border: none; padding: 0.5em 0; }
.formfield {
  margin: 0 0 5px 0;
  overflow: hidden;
}
select, textarea, input.text { 
  color: #333;
  font: 100% Verdana, Arial, Helvetica, sans-serif;
  background: #fff; 
  border: 2px solid #9e9e9f;
  padding: 2px 4px;
}

option {
}

textarea:focus, input.text:focus, select:focus {
}

input.text[disabled] {
}

.jump a, a.jump {
  color: #004467;
  text-decoration: none;
}
.jump a:hover, a.jump:hover {
  text-decoration: underline;
}
.morelink,
.morelink a {
  text-decoration: none;
}
fieldset.data label {
}
fieldset.data p.error {
  display: none;
}
fieldset.data .error p.error {
  background-color: #fee9e8;
  border: 1px solid;
  border-bottom-width: 0;
  color: #c00;
  display: block;
  line-height:20px;
  margin: 0;
  text-align:center;
}
fieldset.data .error input.text,
fieldset.data .error textarea {
  border-color: #c00;
}
.addthis_container {
  text-align: right;
}
.comment_link {
  background: url(../images/comment-bubbles-all.png) 0 -15px no-repeat;
  padding-left: 20px;
  text-decoration: none;
}

/* page layout */
html, body {  }
body {
  background: #fff;
  min-width: 980px;
}
#page {
  padding: 50px 0 32px;
}
.page_outer_decorator {
}
.page_decorator {
  background: url(../images/bkg-content.jpg) center top repeat-y #e6e6e6;
}
.page_wrap {
  margin: 0 auto;
  overflow: hidden;
  padding-right: 30px;
  width: 980px;
}
#header {
  float: left;
  padding: 150px 0 0 1px;
  position: relative;
  width: 194px;
}
#foreword {
  background: url(../images/bkg-foreword.png) left top no-repeat #009de0;
  color: #fff;
  float: left;
  min-height: 356px;
  padding: 30px 20px 30px 32px;
  width: 273px;
}
#content {
  float: right;
  width: 455px;
}
#footer {
  clear: both;
  margin: 0 auto;
  padding: 0 30px 0 195px;
  width: 785px;
}

#logo a,
#logo img {
  display: block;
}
#logo .active,
#nav .active {
  background: url(../images/bullet-menu.png) right center no-repeat;
}
#nav {
  background: url(../images/menu-items-all.png) -77px 2px no-repeat;
  list-style: none;
  margin: 26px 0 0 auto;
  padding-left: 0;
  width: 100px;
}
.skiplinks {
  list-style: none;
  margin: 0;
  padding-left: 0;
  position: absolute;
  right: 0;
  top: 30px;
  width: 162px;
}
.skiplinks li {
  padding-right: 23px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.1em;
  text-align: right;
  text-transform: uppercase;
}
.skiplinks a {
  position: relative;
  top: -600px;
}
.skiplinks a:focus {
  color: #009de0;
  top: 0;
}
#nav li {
  margin: 8px 0 0 auto;
  padding-right: 21px;
  width: 79px;
}
#nav a {
  background-image: url(../images/menu-items-all.png);
  background-repeat: no-repeat;
  text-indent: -2000px;
}
#nav a,
.skiplinks a {
  display: block;
  height: 13px;
  line-height: 1;
  padding: 2px 2px 1px;
  text-decoration: none;
}
#nav a:focus,
.skiplinks a:focus {
  border: 1px dotted #000;
  outline: none;
  padding: 1px 1px 0;
}
#nav .active a,
#nav a:focus,
#nav a:hover {
  background-image: none;
}
#nav-about a { background-position: 0 2px; }
#nav-services a { background-position: 0 -22px; }
#nav-projects a { background-position: 0 -46px; }
#nav-blog a { background-position: 0 -70px; }
#nav-contact a { background-position: 0 -94px; }

#foreword h1,
#foreword h2 {
  color: #fff;
  font-weight: normal;
  margin: 0;
}
#foreword h1 {
  font-size: 23px;
  line-height: 28px;
}
#foreword h2 {
  font-size: 16px;
  line-height: 16px;
  text-transform: uppercase;
}
#foreword h1 strong,
#foreword h2 strong {
  font-weight: normal;
  text-transform: uppercase;
}
#ttl-archives,
#ttl-blogroll,
#ttl-founders {
  background: url(../images/ttl-foreword-all.png) 0 0 no-repeat;
  text-indent: -2000px;
}
#ttl-archives { background-position: 0 0; }
#ttl-blogroll { background-position: 0 -24px; }
#ttl-founders { background-position: 100% -48px; text-indent: 2000px; }

#foreword p,
#foreword address {
  font-size: 18px;
  font-style: normal;
  line-height: 24px;
  margin: 0 0 8px;
}
#foreword ul {
  font-size: 12px;
  line-height: 16px;
  margin: 0;
}
#foreword a {
  color: #c3ecfd;
  text-decoration: none;
}
#foreword a em {
  color: #fff;
}
#foreword sup {
  font-size: 11px;
  vertical-align: 6px;
}
#pg-home #foreword p {
  font-size: 14px;
  line-height: 18px;
}
#foreword strong {
  color: #c3ecfd;
  font-weight: normal;
}
#content {
  color: #474747;
  font-size: 14px;
  line-height: 1.29;
}
.content_wrap {
  padding: 26px 24px 32px 24px;
}
#content h2 {
  color: #009de0;
  font-size: 16px;
  margin: 0 0 5px 0;
  text-transform: uppercase;
}
#content h2 em {
  text-transform: none;
}
#content p {
  margin: 6px 0 12px;
}
#content ul {
  list-style: none;
  margin: 12px 0 18px;
  padding-left: 50px;
}
#content ul li {
  background: url(../images/bullet.png) top left no-repeat;
  list-style-image: none;
  margin: 3px 0;
  padding-left: 23px;
}
#content a {
  color: #009de0;
}
#blog_latest {
  border-top: 1px solid #d2d2d2;
  border-bottom: 1px solid #d2d2d2;
  margin: 10px 0 0;
  min-height: 80px;
  overflow: hidden;
}
#blog_latest h2 {
  float: left;
  margin: 0;
  padding-top: 14px;
  width: 175px;
}
.blog_list {
  background: url(../images/bkg-blog_latest.png) right top repeat-x;
  color: #555;
  float: right;
  list-style: none;
  margin: 0;
  padding: 11px 0 6px;
  width: 605px;
}
.blog_taster {
  float: left;
  font-size: 11px;
  margin: 0;
  padding: 0 21px;
  width: 158px;
} 
.blog_taster a {
  color: #009de0;
  display: block;
  font-size: 12px;
  line-height: 1.25;
  margin-bottom: 3px;
  text-decoration: none;
}
#footer p {
  color: #b8b8b8;
  font-size: 11px;
  line-height: 18px;
  margin: 0;
}
#footer p.address {
  margin-top: 18px;
}
/* image rotator (home & projects pages) */
#image_rotator {
  height: 416px;
  overflow: hidden;
  position: relative;
  width: 100%;
}
#image_rotator a.next {
  position: absolute;
  height: 16px;
  width: 16px;
  z-index: 20;
}
#pg-home #image_rotator a.next {
  right: 23px;
  top: 346px;
}
#pg-projects #image_rotator a.next {
  right: 24px;
  top: 322px;
}
#image_rotator a.next img {
  display: block;
}
#image_rotator .image_rotator_wrap {
}
#image_rotator .slide {
  background: url(../images/bkg-project-leading.png) 0 0 no-repeat;
  border-left: 1px solid #d8d8d8;
  padding-left: 4px;
  margin-left: -4px;
}
#image_rotator .current_slide .screenshot {
}
#image_rotator .next_slide {
  position: absolute;
  top: 0;
  left: 460px;
  z-index: 10;
}
#image_rotator .next_slide h2,
#image_rotator .next_slide p {
}
#image_rotator .screenshot img {
  display: block;
}
#image_rotator .text {
  background-repeat: no-repeat;
  color: #fff;
  font-size: 12px;
  height: 120px;
  line-height: 14px;
  margin-top: -120px;
  padding: 0 18px 0 24px;
  position: relative;
}
#image_rotator .text a {
  color: #c3ecfd;
  font-weight: bold;
}
#image_rotator .text h2 {
  height: 52px;
  margin: 0;
  padding: 0;
  text-indent: -2000px;
}
/* home page */
#pg-home #foreword h1 {
  background: url(../images/h1-home-title.png) 0 0 no-repeat;
  height: 76px;
  margin: 44px 0 12px;
  text-indent: -2000px;
}
#pg-home #foreword h1 strong {
  color: #fff;
}
#project_tabs {
  background: url(../images/bkg-home-project-tabs-all.png) 0 -36px no-repeat;
  height: 36px;
  left: 0;
  position: absolute;
  top: 260px;
  width: 100%;
  z-index: 100;
}
#project_tabs h2 {
  float: left;
  font-size: 12px;
  line-height: 1;
  margin: 0;
  text-indent: -2000px;
  width: 104px;
}
#project_tabs ul {
  float: right;
  list-style: none;
  margin: 0;
  padding-left: 0;
  width: 351px;
}
#project_tabs ul li {
  background: url(../images/bkg-home-project-tabs-all.png) left top no-repeat;
  float: left;
  margin: 0 0 0 27px;
  padding: 0;
  width: 90px;
}
#project_tabs ul a {
  background: url(../images/bkg-home-project-tabs-all.png) left top no-repeat;
  display: block;
  height: 36px;
  text-indent: -2000px;
}
#project_tabs #tab-1 { background-position: -248px -36px; }
#project_tabs #tab-2 { background-position: -131px -36px; }
#project_tabs #tab-3 { background-position: -365px -36px; }

#project_tabs #tab-1 a { background-position: -248px 0; }
#project_tabs #tab-2 a { background-position: -131px 0; }
#project_tabs #tab-3 a { background-position: -365px 0; }

#image_rotator #project_tabs .current a { background: none; }

#pg-home .view_project {
  position: absolute;
  top: 50px;
  right: 42px;
  width: 88px;
  height: 16px;
  text-indent: -2000px;
}

/* about page */
#foreword #ttl-founders {
  margin: 78px 0 7px;
  text-align: right;
}
#pg-about #foreword ul {
  font-size: 14px;
  list-style: none;
  margin: 7px 0;
  padding-left: 0;
  text-align: right;
}
#pg-about #foreword li {
  background: url(../images/bullet-foreword.png) 100% 3px no-repeat;
  margin: 7px 0;
  padding: 2px 20px;
}
#pg-about .content_wrap {
  padding-bottom: 8px;
}
#pg-about h2 {
  margin-bottom: 0;
}
#pg-about .section {
  display: none;
}
#pg-about .show {
  display: block;
}
/* services page */
#pg-services #content {
  font-size: 12px;
  line-height: 15px;
}
#pg-services .content_wrap {
  padding-bottom: 6px;
  padding-top: 20px;
}
#pg-services #content p {
  margin: 5px 0 10px;
}
#pg-services #content li {
  font-weight: bold;
}
/* projects page */
#pg-projects #foreword {
  padding-bottom: 16px;
  padding-top: 24px;
}
/* contact form */
#pg-contact #foreword {
  min-height: 374px;
  padding-bottom: 12px;
}
#pg-contact .content_wrap {
  padding-bottom: 8px;
  padding-top: 18px;
}
#pg-contact .content_wrap h2 {
  font-size: 16px;
  margin-bottom: 18px;
}
#pg-contact address {
  margin: 6px 0 9px;
}
#pg-contact form {
  margin: 0;
}
#pg-contact fieldset {
  padding: 0;
}
#pg-contact .formfield {
}
#pg-contact label {
  float: left;
  font-size: 13px;
  font-weight: bold;
  margin: 2px 8px 2px 0;
  width: 120px;
}
#fld-message label {
  display: block;
  width: auto;
}
#pg-contact p.error {
  border-width: 2px;
  border-bottom: none;
  float: right;
  margin: 0;
  width: 275px;
}
#pg-contact input.text {
  float: right;
  width: 267px;
}
#pg-contact .error input.text {
  border-top-width: 1px;
}
#pg-contact textarea {
  border: 2px solid #9e9e9f;
  height: 110px;
  margin-top: 0;
  width: 395px;
}
#pg-contact .error textarea {
  border-color: #cc0000;
}
#pg-contact .buttons {
  text-align: right;
}
#map {
  height: 212px;
  margin: 0 auto;
  width: 232px;
}
/* blog */
#pg-blog .page_wrap {
  background: url(../images/bkg-content-blog.jpg) 195px 0 repeat-y;
}
#pg-blog .single_post .page_wrap {
  min-height: 416px;
  overflow: visible;
}
#pg-blog #foreword {
  width: 149px;
}
#pg-blog #foreword ul {
  margin: 12px 0 24px;
  padding-left: 16px;
}
#pg-blog #content {
  font-size: 12px;
  line-height: 15px;
  width: 580px;
}
#pg-blog .content_wrap {
  padding-bottom: 12px;
}
#pg-blog .blog_item h2 {
  text-transform: none;
}
#content ul.blogitem_list {
  list-style: none;
  margin: 0;
  padding-left: 0;
}
#content li.blog_item {
  background: none;
  padding-left: 0;
}
#content .blog_item h1 {
  color: #009de0;
  font-size: 18px;
  line-height: 21px;
  margin: 0 0 0;
}
#content .blog_item h2,
#content .blog_item h3 {
  font-size: 15px;
  margin-bottom: 0;
}
#content .blog_item h2 a,
#content .blog_item h3 a {
  text-decoration: none;
}
#content .blog_item p.date {
  font-size: 10px;
  margin: 0;
}
#content .blog_item p.snippet {
  margin: 6px 0 2px;
}
#content .blog_item p.meta {
  margin: 0;
  text-align: right;
}
#content p.pagination {
  margin-bottom: 0;
  text-align: center;
}
#content p.pagination a {
  text-decoration: none;
}
/* blog page, single post variation */
#pg-blog .single_post .content_wrap {
  background: #fff;
  padding: 0 0 12px;
}
#pg-blog .single_post .blog_item {
  padding-bottom: 24px;
  position: relative;
}
#pg-blog .single_post .posttitle {
  background: #f2f2f2;
  padding: 26px 24px 9px;
}
#pg-blog .single_post .entry {
  min-height: 232px;
  margin-bottom: 12px;
  padding: 12px 24px 0;
}
#pg-blog .single_post .postmeta-container {
  padding: 6px 24px 0;
  font-size: 10px;
}
#pg-blog .single_post .postmeta-container .navigation {
  margin-bottom: 0;
  text-align: center;
}
#pg-blog .single_post .entry .addthis_container {
  position: absolute;
  bottom: 6px;
  right: 24px;
}
#pg-blog .addthis_container a {
  text-decoration: none;
}
#comments {
  background: url(../images/comment-bubbles-all.png) -15px 0 no-repeat;
  padding-left: 20px;
}
#comments,
#respond h3 {
  color: #555;
  margin: 0 24px;
}
#respond {
  margin-top: 2em;
}
.commentlist {
  list-style: none;
  padding-left: 0;
}
.single_post .comment_link {
  background: url(../images/comment-bubbles-all.png) -15px 0 no-repeat;
}
#commentform {
  padding-left: 24px;
}
#commentform fieldset {
  padding: 0;
}
#commentform label {
  line-height: 24px;
  position: absolute;
  text-indent: 6px;
}
#commentform .data .text {
  width: 265px;
}
#commentform textarea {
  height: 110px;
  width: 544px;
}
#commentform .buttons {
  text-align: right;
}
.commentlist li.comment {
  margin-bottom: 4px;
  overflow: hidden;
}
.comment-meta-container {
  background: #f2f2f2;
  float: left;
  padding: 6px 12px 9px 24px;
  width: 100px;
}
.comment-author {
}
.comment-author cite {
  font-size: 14px;
  font-style: normal;
}
#content .comment-meta {
  font-size: 10px;
}
.comment-content-container {
  float: left;
  margin-left: 18px;
  width: 420px;
}

