/* Clearing
==================================================================================================== */
#main:after,
#content:after,
#footer:after,
div.featurebox:after,
div.featurebox div.content:after,
#core-attributes:after,
#further-reading div.item:after,
ul.people:after,
div.post:after,
.clear:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }


/* General Structure
==================================================================================================== */
body {
  background: url(/assets/5/bg.png) repeat 0 0;
  margin: 0;
  padding: 22px 0 30px;
}
#wrapper {
  margin: 0 auto;
  width: 940px;
}


/* General Styles
==================================================================================================== */
a img {	border: none; }


/* General Typography
==================================================================================================== */
body {
  color: #535454;
  font: 12px/1.5 Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6, p, ol, ul {
  margin: 0 0 18px;
}
h1, h2 {
  font: normal 300 30px/1 "museo-1", "museo-2", Georgia, "Times New Roman", Times, serif;
}
h1 {
  color: #1a232e;
  margin: 0 0 10px;
}
h2 {
  color: #010101;
  font-size: 20px;
}
h1 strong,
h2 strong {
  color: #24afca;
  font-weight: 700;
}
h3 {
  font-size: 16px;
}
h4, h5, h6 {
  font-size: 12px;
  margin: 0;
}
ol, ul {
  margin-left: 40px;
  padding: 0;
}
p:last-child {
  margin: 0;
}
a {
  color: #18999e;
  text-decoration: none;
}
.tagline {
  color: #798a97 !important;
  font: normal 17px/1.2 "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif !important;
}


/* Forms
==================================================================================================== */
form input,
form textarea,
form select {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
}
.mailer-error {
  background-color: #9F3E22;
  color: white;
  font-weight: bold;
  font-size: 1.4em;
}

/* Header
==================================================================================================== */
#header {
  border-bottom: 1px dashed #b8b8b8;
  height: 99px;
}
#logo {
  float: left;
  margin: 6px 0 0;
}

/* Search--------------------------------------------------  */
#header-search {
  float: right;
  margin: 0 0 0 15px;
}
#header-search input.text {
  background: transparent url(/assets/11/header-search-input.png) no-repeat 0 0;
  border: none;
  color: #a0a0a0;
  font-family: "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif;
  font-size: 16px;
  height: 17px;
  outline: none;
  padding: 5px 10px;
  width: 208px;
}
#header-search input.submit {
  background: none;
  border: none;
  color: #8f8f8f;
  cursor: pointer;
  font-family: "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif;
  font-size: 16px;
  padding: 0;
}

/* Icon Links -------------------------------------------------- */
#header-links {
  float: right;
}
#header-links a {
  margin: 0 0 0 2px;
}

/* Nav Menu -------------------------------------------------- */
#nav {
  clear: right;
  float: right;
  margin: 42px 0 0;
}
#nav ul {
  float: right;
  list-style: none;
  margin: 0;
  padding: 0;
}
#nav ul li {
  float: left;
  margin: 0 0 0 2px;
  text-transform: uppercase;
}
#nav ul li a {
  background: url(/assets/21/nav-button.png) no-repeat 0 0;
  color: #030303;
  display: block;
  height: 40px;
  padding: 0 0 0 10px;
}
#nav ul li a span {
  background: url(/assets/21/nav-button.png) no-repeat 0 0;
  cursor: pointer;
  float: left;
  font: 400 16px/40px "museo-1", "museo-2", Georgia, "Times New Roman", Times, serif;
  display: block;
  height: 40px;
  padding: 0 25px 0 15px;
}
#nav ul li a:hover,
#nav ul li a.active {
  background-position: 0 -40px;
}
#nav ul li a:hover span,
#nav ul li a.active span {
  background-position: right -80px;
}


/* Main
==================================================================================================== */
#main {
  clear: both;
  padding: 20px 0 30px;
}
body.homepage #main {
  padding-top: 0;
}


/* Content
==================================================================================================== */
#content {
}
body.sidebar #content {
  float: left;
  width: 620px;
}
#content .right { float:right; }
#content .left  { float:left; }

/* Transparent Boxes -------------------------------------------------- */
div.featurebox, div.dobox, div.donotbox {
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  padding: 12px;
}
div.featurebox div.corners, div.dobox div.corners, div.donotbox div.corners {
  display: none;
}

div.featurebox {
  background: url(/assets/10/featurebox-bg.png) repeat 0 0;
  padding: 30px;
}
div.featurebox div.left-col {
  float: left;
  width: 630px;
}
div.featurebox div.right-col {
  float: right;
  width: 220px;
}
div.featurebox h2 {
  color: #078699;
}

div.dobox {
  background: url(/assets/10/featurebox-bg.png) repeat 0 0;
  height: 250px;
}
div.dobox h2 {
  color: #078699 !important;
}
div.donotbox {
  background: url(/assets/10/featurebox-bg.png) repeat 0 0;
  height: 250px;
}
div.donotbox h2 {
  color: #DF732C !important;
}
#content div.notice {
  background-color: #FFD;
  border: 1px solid #FF2;
  padding: 1em;
  margin: 1em 0;
}
div.attribute {
  margin: 20px 0;
}

/* Testimonial -------------------------------------------------- */
div.testimonial {
  background: url(/assets/35/testimonial-box.png) no-repeat 0 0;
  padding: 43px 20px 20px;
  width: 260px;
}
div.testimonial h2 {
  color: #000;
  margin: 0 0 8px;
}
div.testimonial blockquote {
  font-style: italic;
  margin: 0 0 5px;
}
div.testimonial cite {
  color: #737576;
  font-size: 11px;
  font-style: normal;
}
div.featurebox div.testimonial {
  background: url(/assets/34/testimonial-box-teal.png) no-repeat 0 0;
  padding: 38px 15px 15px;
  width: 190px;
}
div.featurebox div.testimonial cite {
  color: #242729;
}


/* Sidebar
==================================================================================================== */
#sidebar {
  float: right;
  width: 300px;
}
#sidebar img.big-logo {
  display: block;
  margin: 0 auto 30px;
}

/* Jobs -------------------------------------------------- */
#sidebar div.jobs {
  margin: 0 0 5px;
}
#sidebar div.jobs h2 {
  margin: 0 0 10px;
}
#sidebar div.jobs p {
  padding: 0 0 0 20px;
}
#sidebar div.jobs h2 {
  background: url(/assets/17/logo-small.gif) no-repeat left center;
  padding: 0 0 0 25px;
}


/* Home
==================================================================================================== */

/* Intro -------------------------------------------------- */
#intro {
  background: url(/assets/138/trike.png) no-repeat 560px 24px;
  height: 342px;
  padding: 56px 430px 0px 52px;
}
#intro h1,
#intro h2 {
  color: #19384f;
  display: inline;
  font-size: 33px;
  margin: 0;
}
#intro h1 {
  font-weight: 700;
}
#intro p {
  font: normal 300 20px/1 "museo-1", "museo-2", Georgia, "Times New Roman", Times, serif;
  margin: 18px 0;
}
#intro a.more {
  background: url(/assets/20/more-link-arrow.png) no-repeat left center;
  color: #949385;
  font-weight: bold;
  padding: 0 0 0 20px;
}

/* Core Elements -------------------------------------------------- */
#home-core-elements h2 {
  color: #000;
  margin: 0 0 20px;
}
#home-core-elements div.element {
  float: left;
  margin: 0 0 20px;
  padding: 0 20px 0 0;
  width: 200px;
}
#home-core-elements div.element h3 {
  background-position: 0 0;
  background-repeat: no-repeat;
  font: 16px/1 "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif;
  margin: 0 0 10px;
  padding: 0 0 0 24px;
}
#home-core-elements div.intuitive h3 {
  background-image: url(/assets/8/checkmark-orange.png);
  color: #df732c;

}
#home-core-elements div.agile h3 {
  background-image: url(/assets/9/checkmark-teal.png);
  color: #65c3c7;
}
#home-core-elements div.profitable h3 {
  background-image: url(/assets/7/checkmark-gray.png);
  color: #808384;
}
#home-core-elements div.element p {
  margin: 0 0 5px;
}
#home-core-elements div.element a.more {
  color: #000;
  font-size: 11px;
}

/* Testimonial -------------------------------------------------- */
#home-core-elements div.testimonial {
  float: right;
  margin: -23px 0 20px;
  position: relative;
}
#home-core-elements div.testimonial h2 {
  margin: 0 0 8px;
}

/* Footer -------------------------------------------------- */
#home-core-elements div.footer {
  clear: both;
}

/* Core Attributes -------------------------------------------------- */
#home-core-elements div.intuitive h2 {
  color: #df732c;
}
#home-core-elements div.agile h2 {
  color: #1c979c;
}
#home-core-elements div.profitable h2 {
  color: #747374;
}

/* Further Reading -------------------------------------------------- */
#further-reading div.item {
  margin: 20px 0 30px;
}
#further-reading div.item:last-child {
  margin-bottom: 0;
}
#further-reading div.item img.lead {
  display: block;
  float: left;
  margin: 0 20px 0 0;
  width: 120px;
}
#further-reading div.item div.item-content {
  margin: 0 0 0 140px;
}


/* Project Listing
==================================================================================================== */
div.projectbox div.project div.screenshot {
  background: url(/assets/19/magnify.png) no-repeat 500px 500px; /* preload image */
  margin: 0 0 15px;
  position: relative;
  width: 286px;
}
div.projectbox div.project div.screenshot img.magnify {
  display: none;
  height: 48px;
  left: 50%;
  margin: -24px 0 0 0;
  position: absolute;
  top: 50%;
  width: 48px;
}
div.projectbox div.project div.screenshot:hover img.magnify {
  display: block;
  z-index: 5;
}
div.projectbox div.project div.screenshot a,
div.projectbox div.project div.screenshot a img {
  display: block;
}
div.projectbox div.project h3 {
  font-size: 12px;
  margin: 0;
}
div.projectbox div.project a.more {
  display: block;
  float: right;
  margin: 7px 0 0;
  height: 22px;
  width: 22px;
}
div.projectbox div.project a.more img {
  display: block;
  height: 22px;
  width: 22px;
}
div.project {
  padding-bottom: 20px;
}
div.project-blurb {
  padding: 10px 0px 10px 45px
}
@media screen and (max-width: 1200px) {
  div.project-blurb {
    padding: 10px 0px 10px 0px
  }
}


/* Project Detail
==================================================================================================== */
body.projects #sidebar {
  padding: 20px 0 0;
}
div.project-info h2 {
  color: inherit;
  font: bold 12px/1.5 Arial, Helvetica, sans-serif;
}
div.project-info {
  padding-bottom: 20px;
}
img#project-screenshot {
  clear: both;
  display: block;
}
a.project-launch {
  background: url(/assets/25/project-arrow-small-teal.png) no-repeat left center;
  font: 16px/1 "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif;
  padding: 0 0 0 22px;
}


/* About
==================================================================================================== */
ul.people {
  clear: both;
  list-style: none;
  margin: 20px 0;
}
ul.people li {
  float: left;
  font-size: 11px;
  margin: 0 20px 0 0;
  width: 170px;
  height: 270px;
}
ul.people li:last-child {
  margin-right: 0;
}
ul.people li h5 {
  margin: 0 0 12px;
}
ul.people li a.portrait {
  display: block;
  margin: 0 0 12px;
}
ul.people li a.portrait img {
  display: block;
  height: 100px;
  width: 170px;
}
ul.people li p {
  margin: 0 0 1em;
}
ul.people li a.more {
  color: #000;
}

/* Sidebar -------------------------------------------------- */
body.about #sidebar div.jobs h2 {
  background: none;
  padding: 0;
}
body.about #sidebar div.jobs p {
  padding: 0;
}
body.about #sidebar img {
  display: block;
  margin: 0 0 25px;
  width: 300px;
}
/* Services
==================================================================================================== */
#services #content h2 {
  color: #59ACAB;
  margin-top: 2em;
}

/* Profile
==================================================================================================== */
#profile-header {
  margin: 0 0 20px;
}
#profile-header h1 {
  margin: 0 0 10px;
}
#profile-header p {
  font-size: 11px;
  text-transform: uppercase;
}
#profile-summary {
  line-height: 1.5 !important;
}
#profile-details h3 {
  font-size: 12px;
  margin: 0 0 5px;
}


/* Blog
==================================================================================================== */
body.blog #content {
  width: 590px !important;
}
div.post {
  border-bottom: 1px solid #d6d6d6;
  clear: both;
  padding: 20px 0;
}
div.post div.post-date {
  float: left;
  width: 140px;
}
div.post div.post-date span {
  display: block;
  font-size: 11px;
  height: 15px;
  line-height: 15px;
}
div.post div.post-date span.date {
  border-right: 1px solid #a6a6a6;
  float: left;
  font-size: 19px;
  height: 30px;
  margin: 0 10px 0 0;
  padding: 0 0 0 10px;
  line-height: 30px;
  width: 30px;
}
div.post div.post-container {
  float: left;
  width: 440px;
}
div.post h2.post-title {
  background: url(/assets/17/logo-small.gif) no-repeat 0 0;
  font: 20px/1 "kremlin-pro-web-expanded-1", "kremlin-pro-web-expanded-2", Arial, Helvetica, sans-serif;
  padding: 0 0 0 25px;
}
div.post h2.post-title a {
  color: #7d7d7d;	
}
div.post div.post-content {
  margin: 0 0 18px;
}
div.post div.post-meta {
  font-size: 11px;
}
div.post div.post-meta span.author a,
div.post div.post-meta span.tags a {
  color: #000;
}


/* Sidebar -------------------------------------------------- */
body.blog #sidebar {
  width: 330px;
}
body.blog #sidebar div.featurebox {
  padding: 20px;
}
body.blog #sidebar div.sidebox {
  margin: 0 0 25px;
}
body.blog #sidebar div.sidebox:last-child {
  margin-bottom: 0;
}
body.blog #sidebar div.sidebox h2 {
  color: #010101;
  margin: 0 0 12px;
}
body.blog #sidebar a {
  color: #5c5b5b;
}
body.blog #sidebar div.tags ul {
  list-style: none;
  margin: 0;
}
body.blog #sidebar div.tags ul li {
  margin: 0 0 5px;
}
body.blog #sidebar div.jobs h2 {
  background: none;
  padding: 0;
}
body.blog #sidebar div.jobs p {
  padding: 0;
}
body.blog #sidebar div.testimonial {
  background: url(/assets/33/testimonial-box-teal-blog.png) no-repeat 0 0;
  margin: -23px 0 0;
  padding: 43px 20px 20px;
  width: 250px;
}
body.blog #sidebar div.testimonial cite {
  color: #737576;
}



/* Contact
==================================================================================================== */
div#map {
  height: 400px;
}


/* Footer
==================================================================================================== */
#footer {
  border-top: 1px dashed #b8b8b8;
  clear: both;
  color: #6f757b;
  font-size: 11px;
  line-height: 10px;
  padding: 15px 0 0;
}
#footer a {
  color: #6f757b;
}
#footer a.active {
  font-weight: bold;
}
#footer ul {
  float: left;
  list-style: none;
  margin: 0;
}
#footer ul li {
  border-right: 1px solid #6f757b;
  float: left;
  margin: 0 6px 0 0;
  padding: 0 6px 0 0;
}
#footer ul li:last-child {
  border-right: none;
}
#footer div.notice {
  float: right;
}

/* 2016-09-07 Responsive update */


p, h1, h2, h3, h4, h5, h6 {
  margin: 0 0 18px;
}

a {
  color: #18999e;
  text-decoration: none;
}

a:hover, a:focus {
  color: #18999e;
  text-decoration: none;
}

h2 {
  color: #010101;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.0;
}

h3 {
  font-size: 12px;
  margin: 0 0 5px 0;
  font-weight: bold;
}

h4 {
  font-size: 12px;
  margin: 0;
  font-weight: bold;
  line-height: 1.5;
}

h5 {
  font-size: 12px;
}

.screenshot {
  width: 100%;
}

.breadcrumb {
  padding: 0;
  margin-bottom: 18px;
  list-style: none;
  background-color: transparent;
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -o-border-radius: 0;
}

.breadcrumb a {
  margin-right: 5px;
  color: #18999e;
  text-decoration: none;
}

.breadcrumb>li+li:before {
  content: "";
  padding: 0;
}

.tagline {
  color: #798a97;
  font-size: 17px;
}

.jobs-vacancy {
  color: #078699;
  font-size: 20px;
  margin: 0 0 10px;
}

.jobs-vacancy:hover, .jobs-vacancy:focus {
  color: #078699;
  text-decoration: none;
}

.navbar-toggle {
  border: 1px solid #7d7d7d;
  margin-top: 33px;
}

.navbar-toggle .icon-bar {
  border: 1px solid #7d7d7d;
}

.navbar-brand {
  padding: 0;
  height: 100%;
}

@media (min-width: 768px) and (max-width: 992px) {
  .navbar-brand {
    width: 80%;
    margin-top: 13px;
  }
}

@media (max-width: 767px) {
  .navbar-brand {
    width: 70%;
  }
}

.navbar {
  min-height: 99px;
  border-bottom: 1px dashed #b8b8b8;
}

.navbar .navbar-nav {
  margin-top: 35px;
}

.navbar .navbar-nav li {
  height: 40px;
}

.navbar .navbar-nav li a {
  font: 400 16px/40px "museo-1", "museo-2", Georgia, "Times New Roman", Times, serif;
  color: #030303;
  padding: 0 24px 0 24px;
  text-transform: uppercase;
}

.navbar .navbar-nav li a:hover {
  background-color: transparent;
}

@media (min-width: 768px) and (max-width: 992px) {
  .navbar .navbar-nav {
    margin-top: 48px;
  }

  .navbar .navbar-nav li a {
    font-size: 14px;
    padding: 0 13px;
  }
}

.navbar .navbar-nav li.active {
  background-color: rgba(214, 226, 228, 0.4);
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
}

.intro, .intro-image {
  margin: 30px;
}

.intro h1 {
  font-weight: 700;
  color: #19384f;
  display: inline;
  font-size: 33px;
}

.intro h1 strong {
  color: #24afca;
}

.intro h2 {
  color: #19384f;
  display: inline;
  font-size: 33px;
  font-weight: 300;
}

.intro p {
  margin: 18px 0;
}

.intro-image img {
  margin: 0 auto;
  display: block;
}

.featurebox {
  padding: 30px;
  margin-bottom: 30px;
  background: rgba(214, 226, 228, 0.4);
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
}

.featurebox h2 {
  font-size: 20px;
}

.featurebox img {
  display: block;
  margin: 0 auto;
}

.featurebox .intuitive h2 {
  color: #df732c;
}

.featurebox .agile h2 {
  color: #1c979c;
}

.featurebox .profitable h2 {
  color: #747374;
}

.featurebox .featurebox-footer {
  padding-top: 30px;
}

.featurebox .featurebox-footer a {
  color: #18999e;
}

#home .featurebox h2 {
  margin-top: 30px;
}

#projects .featurebox {
  margin: 0 0 30px;
  padding: 20px;
}

#projects .featurebox h2 {
  color: #078699;
  margin-top: 0;
}

#projects h1 {
  color: #1a232e;
  font-size: 30px;
  font-weight: 300;
}

#projects .screenshot-box {
  position: relative;
}

#projects .screenshot-box:hover .magnify {
  display: block;
}

#projects .screenshot-box .screenshot {
  margin-bottom: 15px;
}

#projects .screenshot-box .magnify {
  position: absolute;
  height: 48px;
  left: 50%;
  margin: -24px 0 0 -24px;
  position: absolute;
  top: 50%;
  width: 48px;
  display: none;
}

#projects .more {
  display: block;
  float: right;
  margin: 7px 0 0;
  height: 22px;
  width: 22px;
}

#projects .more img {
  height: 22px;
  width: 22px;
}

#projects .project-info {
  margin-bottom: 40px;
}

#projects .project-info h2 {
  color: #010101;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
}

#projects .project-info .project-launch {
  background: url(/images/project-arrow-small-teal.png) no-repeat left center;
  font-size: 16px;
  padding: 0 0 0 22px;
  color: #18999e;
}

#about-us h1 {
  color: #1a232e;
  font-size: 30px;
  font-weight: 300;
}

#about-us .people {
  margin: 20px 0;
  font-size: 11px;
}

#about-us .people h5 {
  margin: 0 0 12px;
  font-weight: bold;
}

#about-us .people .more {
  color: #000000;
}

#about-us .people p {
  margin: 0 0 1em;
}

#about-us .people a img {
  margin: 0 0 12px;
  width: 100%;
}

@media (max-width: 768px) {
  .peers {
    margin-top: 20px;
  }
}

#jobs .featurebox {
  padding: 12px;
}

#contact-us img {
  width: 100%;
  padding-bottom: 30px;
}

#map {
  position: relative;
  overflow: hidden;
  background-color: #e5e3df;
  height: 400px;
}

.footer {
  margin-top: 15px;
  border-top: 1px dashed #b8b8b8;
}

.footer ul {
  list-style: none;
  font-size: 11px;
  line-height: 10px;
  padding: 15px 0 0 0;
  display: inline-block;
}

.footer ul li {
  border-right: 1px solid #6f757b;
  float: left;
  margin: 0 6px 0 0;
  padding: 0 6px 0 0;
  overflow: hidden;
}

.footer ul li:last-child {
  border-right: none;
}

.footer ul li a {
  color: #6f757b;
}

.footer ul li .active {
  color: #6f757b;
  font-weight: bold;
}

.footer .notice {
  color: #6f757b;
  font-size: 11px;
  line-height: 10px;
  padding: 15px 0 0 0;
}

img.centered {
  margin: 0 auto;
}

p.centered {
  text-align: center;
}

.mugshot {
  padding: 10px 0;
}

.person-blurb {
  min-height: 150px;
}