@charset "UTF-8";
/* CSS Document */
		body {font-size: 12px; line-height: 24px; font-family: Georgia, "Times New Roman", Times, serif ;background: #fff url(../images/global/page_background.gif) repeat-y 50% 0;}
html, body, #grid {height: 101%;}
#grid {width: 768px; margin: 0 auto; /*background: url(../images/global/baseline_grid.png); background-repeat: no-repeat; background-position: -33px 0;*/}
#page {height: 100%; width: 768px; margin: 0 auto; position: relative;}
#sidebar1 {position: absolute; top: 0; left: 0; width: 192px; z-index: 4;}
#mainContent {position: absolute; width: 768px; top: 0; left: 0; z-index: 2;}
.home #mainContent {top: 179px;}
#mainContent .content {margin-left: 215px; position: relative;}
#wrapperCont {width:168px; position: absolute; top: 200px; left: 0;}
#detail {position: absolute; top: 200px; left: 192px; width: 360px;}
.work #detail {top: 193px;}
.contact #secondNavContainer, .services #secondNavContainer {width:287px;}
/*.work #secondNavContainer {width:432px; } Old rule with Vanguard link visible */
.work #secondNavContainer {width:407px; }

/* Index page image*/
#indexImage {padding-bottom: 24px;}

#brand {height: 118px;padding-top: 84px;}
#footer {font-size: 10px; line-height: 12px; color: #999; margin-top: 72px;}
.about #footer {margin-left: 96px;}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */clear:both;height:0;font-size: 1px;line-height: 0px;}

.content ul, .content dl {list-style-type: none; margin: 0; padding: 0;}

.content a {outline: none;}
.content a:link {text-decoration: none;color: #999;}
.content a:visited {text-decoration: none;color: #999;}
.content a:hover {text-decoration: none; color: #333;}
.content a:active {text-decoration: none;color: #999;}
.callToAction a {color: #29ABE2; font-size:14px;}
.callToAction a:link {text-decoration: none;color: #29ABE2;}
.callToAction a:visited {text-decoration: none;color: #29ABE2;}
.callToAction a:hover {text-decoration: none; color: #29ABE2;}
.callToAction a:active {text-decoration: none;color: #29ABE2;}


/* Page titles */
#section-title {height: 200px;}
#section-title img {padding-top: 84px;}

/* Main Navigation */
#main-nav {float: right;width: 100px;}
#main-nav span {display: none;}
#main-nav li {display: block; height: 24px;}
#main-nav a {display: block;background-image: url(../images/global/global_nav.gif);background-repeat: no-repeat;background-position: top left;margin: 0 24px 0 0; padding: 0 0 0 0; height: 24px;}
#services {}
#main-nav a#work {background-position: 0 -24px;}
#main-nav a#about {background-position: 0 -48px;}
#main-nav a#contact {background-position: 0 -72px;}
.services #main-nav a#services, .services #main-nav a#services:hover {background-position: -75px 0;}
.work #main-nav a#work, .work #main-nav a#work:hover {background-position: -75px -24px;}
.about #main-nav a#about, .about #main-nav a#about:hover {background-position: -75px -48px;}
.contact #main-nav a#contact, .contact #main-nav a#contact:hover {background-position: -75px -72px;}
#main-nav a#services:hover {background-position: -150px 0;}
#main-nav a#work:hover {background-position: -150px -24px;}
#main-nav a#about:hover {background-position: -150px -48px;}
#main-nav a#contact:hover {background-position: -150px -72px;}

/* Secondary Navigation */
#second-nav span {display: none;}
#second-nav h3 {background-position: 0 2px;background-repeat: no-repeat;height: 24px; margin: 24px 0 0 0; }
#second-nav h3.first {margin-top: 0;}
#second-nav li {}
#second-nav a.selected {font-weight: bold;color: #333;}
#second-nav .selected ul {margin-top: 3px;margin-left: 12px;padding-left: 0;}
#second-nav .selected li {padding: 0 0 6px 6px;}
#second-nav .selected li a {font-weight: normal;}
#in-dev {background-image: url(../images/global/in_development.gif);}
#past-work {background-image: url(../images/global/past_work.gif);}
#design {background-image: url(../images/global/design.gif);}
#development {background-image: url(../images/global/development.gif);}
#emailHeader {background-image: url(../images/global/email.gif);}
#phoneHeader {background-image: url(../images/global/phone.gif);}
#mailHeader {background-image: url(../images/global/mail.gif);}

/* Client Project Navigation */
#client-project-nav {display: block;margin-bottom: 0;}
#client-project-nav li {display: inline;margin-right: 6px;}
#client-project-nav a {font-weight: normal; color:#999; cursor: pointer;}
#client-project-nav a:hover {font-weight: normal; color:#333;}
#client-project-nav .selected a {font-weight: bold;color: #333;}

/* Client project viewer */
#client-project {list-style: none;margin: 0 0 0 0;padding: 0 0 0 0;}
#client-project dd, #client-project dt {margin: 0 0 0 0;padding: 0 0 0 0;}
#client-project dt {display: none;}
#client-project .image {display: block;margin-bottom: 7px;}
#client-project .navigation {display: block;width: 100%;}
#client-project .title, #client-project .link {display: inline;}
#client-project .title {border-right: solid 1px #ccc;padding-right: 4px;margin-right: 4px;}
#client-project .last {border-right-width: 0;}
#client-project .name {font-weight: bold;font-size: 14px;display: block;}
#client-project .title {color: #29ABE2;}
#client-project .description p {margin-top: 0; margin-bottom:0;}
#client-project .disclaimer p {font-weight: normal; font-size: 10px; color: #999; margin-top:0;}

/* Contact form */
.inputWrap {margin-bottom: 24px;}
input, .comment-box {display: inline;border: solid 1px #999; color: #999;font: normal 12px Georgia, Times, serif;padding: 4px;width: 168px;margin-right: 6px;}
.content input {border-color: #999;}
.content input:hover {border-color: #333;}
.content .comment-box {width: 360px;height: 110px;margin: 0 0 0 0;border: solid 1px #999;}
.content .comment-box:hover {border-color: #333;}
input#send {border: none;padding: 0 0 0 0;width: auto;}
button {display: block;margin: 0 0 0 0;padding: 0;background: none;border: none;}
.error {color:#FF0000;}
.required {display:inline;}
.loader {font: bold 12px Georgia, Times, serif; color: #29ABE2;}

/* About page */
.about #detail {left: 0;width: 552px;}
#about {position: relative;}
#about .name {position: relative;top: 0;left: 96px;font-size: 14px; /*background: red;*/}
#about .headshot {position: relative;top: -18px;float: left;width: 72px;}
#about .title {display: inline;margin-left: 24px;color: #29ABE2;border-right: solid 1px #ccc;padding-right: 4px;margin-right: 4px; /*background: green;*/}
#about .email {display: inline;}
#about .description {margin-left: 96px; /*background: blue;*/}

/* Hide from IE5-mac. Only IE-win sees this. \*/
 
* html #about .headshot {
  margin-right: 20px;
  }
 
* html #about .title, * html #about .description {
  height: 1%;
  margin-left: 0;
  }
 
/* End hide from IE5/mac */